修改第一版bug
This commit is contained in:
yuyongdong
parent
90c9026c30
commit
a30b8cac84
BIN
src/assets/common/Icon_explore0.png
Normal file
BIN
src/assets/common/Icon_explore0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/assets/common/Progress bar bg.png
Normal file
BIN
src/assets/common/Progress bar bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 512 B |
BIN
src/assets/common/Progress bar fill.png
Normal file
BIN
src/assets/common/Progress bar fill.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 986 B |
BIN
src/assets/common/User-bar.png
Normal file
BIN
src/assets/common/User-bar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
BIN
src/assets/common/WL .png
Normal file
BIN
src/assets/common/WL .png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
src/assets/common/wallet-no.png
Normal file
BIN
src/assets/common/wallet-no.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
BIN
src/assets/common/wallet-yes.png
Normal file
BIN
src/assets/common/wallet-yes.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
@ -151,6 +151,12 @@ export const apiUserState = async () => {
|
||||
return httpGet(url)
|
||||
}
|
||||
|
||||
// 邀请新人
|
||||
export const apiUploadInviteCode = async (code) => {
|
||||
const url = `${API_BASE}/api/activity/upload_invite_code`;
|
||||
return httpGet(url, { code })
|
||||
}
|
||||
|
||||
// 探索状态
|
||||
export const apiGameStat = async () => {
|
||||
const url = `${API_BASE}/api/game/stat`;
|
||||
|
||||
@ -72,7 +72,7 @@
|
||||
</div>
|
||||
<div class="btn" @click="ExploreDialog">Confirm</div>
|
||||
</div>
|
||||
<div v-else-if="eventName == 'help_event' || eventName == 'help_event'">
|
||||
<div v-else-if="eventName == 'help_event' || eventName == 'check_event'">
|
||||
<div class="top">
|
||||
<div class="top-title"></div>
|
||||
<div class="top-close" @click="ExploreDialog">
|
||||
@ -89,13 +89,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="points-amount" v-if="awardData.ticket">
|
||||
<div>Points</div>
|
||||
<div>Explore</div>
|
||||
<div>
|
||||
<span>X {{ awardData.ticket }}</span>
|
||||
<img src="./../../assets/common/Icon_Explore9.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="awardData.isNewUser == 0">Complete tasks to get more rewards</div>
|
||||
<div>Complete tasks to get more rewards</div>
|
||||
</div>
|
||||
<div class="btn" v-if="awardData.isNewUser == 0" @click="toComplete">To complete</div>
|
||||
<div class="btn" v-else @click="ExploreDialog">Confirm</div>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 成功获得奖品弹窗 -->
|
||||
<!-- -->
|
||||
<el-dialog class="Explore-dialog" :visible.sync="helpDialogVisible" :modal="false" :before-close="helpDialog">
|
||||
<div class="top">
|
||||
<div class="top-title">Boosting Records</div>
|
||||
@ -47,10 +47,10 @@
|
||||
<div class="user-img" v-else>
|
||||
<img :src="item.imgSrc" alt="">
|
||||
</div>
|
||||
<div class="user-name">User name</div>
|
||||
<div class="user-name">{{ item.nickname }}</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="records">+8</div>
|
||||
<div class="records">+{{ item.score }}</div>
|
||||
<div class="icon">
|
||||
<img src="./../../assets/common/Icon_Points.png" alt="">
|
||||
</div>
|
||||
@ -98,8 +98,8 @@ export default {
|
||||
this.boxId = this.$route.params.boxId.split("id=")[1];
|
||||
this.boxCode = this.$route.params.box.split("box=")[1];
|
||||
// this.$axios.all([this.getBoxData(),this.getHelpBoxLog(),this.helpConfirm(),this.initBoxState(this.boxCode,this.boxId)])
|
||||
if(this.token) {
|
||||
this.getBoxData()
|
||||
if(this.token) {
|
||||
this.getHelpBoxLog()
|
||||
this.helpConfirm()
|
||||
this.initBoxState(this.boxCode,this.boxId)
|
||||
@ -108,7 +108,7 @@ export default {
|
||||
methods: {
|
||||
// 宝箱信息接口
|
||||
async getBoxData() {
|
||||
let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/chest/enhance/state', {chestId: '660a4b63de92bca95af2b714'},{})
|
||||
let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/chest/enhance/state', {chestId: this.boxId},{})
|
||||
this.boxData = res.data.data
|
||||
},
|
||||
|
||||
@ -157,37 +157,37 @@ export default {
|
||||
if(this.boxState.enhanced == 0) {
|
||||
// 4、开始助力
|
||||
this.sendEnhanceReq(this.boxCode)
|
||||
// try{
|
||||
// // 5、链上请求交互
|
||||
// let helpRes = await sendHelp(address, this.boxCode)
|
||||
// if(helpRes) {
|
||||
// // 6、轮询是否助力成功
|
||||
// let serTimeId = setInterval(async () => {
|
||||
// let res = await this.$axios.post(
|
||||
// "/api/chest/enhance",
|
||||
// { code: this.boxCode },
|
||||
// { headers: { Authorization: `Bearer ${this.token}` } }
|
||||
// );
|
||||
// if (res.data.errcode == 0) {
|
||||
// // 7、判断是否是新用户
|
||||
// if(this.isNewUser == 0) {
|
||||
// // 8、关闭助力弹窗
|
||||
// this.awardData = {...res.data.data, isNewUser: this.isNewUser}
|
||||
// this.$emit('awardDialog', this.awardData)
|
||||
// this.$emit('handleClose')
|
||||
// } else {
|
||||
// // 8、关闭助力弹窗
|
||||
// this.awardData = {...res.data.data, isNewUser: this.isNewUser}
|
||||
// this.$emit('awardDialog', this.awardData)
|
||||
// this.$emit('handleClose')
|
||||
// }
|
||||
// clearInterval(serTimeId)
|
||||
// }
|
||||
// }, 2000)
|
||||
// }
|
||||
// } catch(e) {
|
||||
// this.$message.error(e.message)
|
||||
// }
|
||||
try{
|
||||
// 5、链上请求交互
|
||||
let helpRes = await sendHelp(address, this.boxCode)
|
||||
if(helpRes) {
|
||||
// 6、轮询是否助力成功
|
||||
let serTimeId = setInterval(async () => {
|
||||
let res = await this.$axios.post(
|
||||
"/api/chest/enhance",
|
||||
{ code: this.boxCode },
|
||||
{ headers: { Authorization: `Bearer ${this.token}` } }
|
||||
);
|
||||
if (res.data.errcode == 0) {
|
||||
// 7、判断是否是新用户
|
||||
if(this.isNewUser == 0) {
|
||||
// 8、关闭助力弹窗
|
||||
this.awardData = {...res.data.data, isNewUser: this.isNewUser}
|
||||
this.$emit('awardDialog', this.awardData)
|
||||
this.$emit('handleClose')
|
||||
} else {
|
||||
// 8、关闭助力弹窗
|
||||
this.awardData = {...res.data.data, isNewUser: this.isNewUser}
|
||||
this.$emit('awardDialog', this.awardData)
|
||||
this.$emit('handleClose')
|
||||
}
|
||||
clearInterval(serTimeId)
|
||||
}
|
||||
}, 2000)
|
||||
}
|
||||
} catch(e) {
|
||||
this.$message.error(e.message)
|
||||
}
|
||||
} else {
|
||||
this.$emit('handleClose')
|
||||
this.$message.error('Already helped this treasure chest')
|
||||
|
||||
@ -14,6 +14,7 @@
|
||||
<img src="./../../assets/common/Invites.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Invites</div>
|
||||
<div class="hover-tips">Successful invtations</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="top">
|
||||
@ -21,25 +22,32 @@
|
||||
<img src="./../../assets/common/Icon_Boosting.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Boosting</div>
|
||||
<div class="hover-tips">Daily boosting reamaining times</div>
|
||||
</li>
|
||||
<!-- <li v-if="navIndex == 1"> -->
|
||||
<li>
|
||||
<div class="top">
|
||||
<span class="textCol2">{{ todayStepTicket }}</span>
|
||||
<img src="./../../assets/common/Icon_Explore.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Exploration</div>
|
||||
<div class="hover-tips">Explorations obtained</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="top">
|
||||
<span class="textCol1">{{ myScoreTotal }}.000</span>
|
||||
<span class="textCol1">{{ myScoreTotal }}</span>
|
||||
<img src="./../../assets/common/Icon_Points.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Points</div>
|
||||
<div class="hover-tips">Explorations obtained</div>
|
||||
</li>
|
||||
<div class="touxiang">
|
||||
<img src="./../../assets/home/Nav bar_character.png" alt />
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-top-points-right">
|
||||
<img src="./../../assets/home/Nav bar_character.png" alt />
|
||||
<img v-if="inWhiteList == 1" src="@/assets/common/wallet-no.png" alt="">
|
||||
<img v-else src="@/assets/common/wallet-yes.png" alt="">
|
||||
<div v-if="inWhiteList == 1" class="hover-tips">Holder of the partner NFT collections will receive additional rewards</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -155,15 +163,29 @@
|
||||
</div>
|
||||
<div class="quest">
|
||||
<div class="bar">
|
||||
<div class="bar-left">
|
||||
<div class="bar-top">
|
||||
<div class="bar-top-left">12</div>
|
||||
<div class="bar-top-right">34</div>
|
||||
<div class="bar-top-left">Progress</div>
|
||||
<div class="bar-top-right">
|
||||
<div class="bar-top-jinDu" :style="{width: filteredBar+'%'}" ref="questPendingBg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bar-btm">
|
||||
<p>*Complete tasks to win three exploration</p>
|
||||
<p>attempts.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bar-right">{{filteredBar}}
|
||||
<div class="bar-no" v-if="filteredBar < 100">
|
||||
<span>X 3 </span>
|
||||
<img src="@/assets/common/Icon_explore0.png" alt="">
|
||||
</div>
|
||||
<div class="bar-yes" v-else>
|
||||
<span>X 3 </span>
|
||||
<img src="@/assets/common/Icon_Explore9.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="quest-list">
|
||||
<li v-for="(item, index) in activeList" :key="index">
|
||||
<div class="quest-item" @click="toPost(item, true)">
|
||||
@ -383,37 +405,45 @@
|
||||
<span>Daily Check-in </span>+{{ gameStateData.todayTickets }}
|
||||
<img src="./../../assets/common/Icon_Daily.png" alt="">
|
||||
</li>
|
||||
<li v-if="gameStateData.todayStat == 9">
|
||||
<span>Daily Check-in </span>+{{ gameStateData.todayTickets }}
|
||||
<div class="check-yes" v-if="gameStateData.todayStat == 9">
|
||||
<img src="./../../assets/home/check-yes.png" alt="">
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-right" v-if="navIndex == 2">
|
||||
<div class="title">
|
||||
<div class="title-left">
|
||||
<!-- <div class="title-left">
|
||||
<div>Partner</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="quest">
|
||||
<div class="quest-list">
|
||||
<div ></div>
|
||||
<li v-for="(item, index) in activeList" :key="index">
|
||||
<div class="content-right-left">
|
||||
<!-- <div class="img-logo">
|
||||
<div class="partner-list">
|
||||
<div>
|
||||
coming soon
|
||||
</div>
|
||||
<!-- <div class="partner">
|
||||
<div>Partner</div>
|
||||
<div>Rewards</div>
|
||||
<div></div>
|
||||
</div>
|
||||
<li v-for="(item, index) in nftsList" :key="index">
|
||||
<div class="quest-item">
|
||||
<div class="content-rewards-left">
|
||||
<div class="img-logo">
|
||||
<img src="./../../assets/home/twitter.png" alt />
|
||||
</div>
|
||||
<div class="score">
|
||||
<span>{{ item.score }} Pts</span>
|
||||
</div>-->
|
||||
<div class="desc">
|
||||
<h3>{{ item.title }}</h3>
|
||||
<p>{{ item.desc }}</p>
|
||||
<h3>{{ item.collection }}</h3>
|
||||
<p>{{ item.projectName }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rewards">
|
||||
<img src="@/assets/box/box01.png" alt="">
|
||||
</div>
|
||||
<div v-if="token != null" class="btn">
|
||||
<div class="is-btn">
|
||||
<div>Chick</div>
|
||||
<div v-if="item.status == 0" class="started" @click="toPost(item)">{{ item.actionTitle }}</div>
|
||||
<CheckBtn v-if="item.status == 1" @stateupdate="toCheck" :dataid="item.id" time="10" title="Check" class="started">Check</CheckBtn>
|
||||
<div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div>
|
||||
@ -421,7 +451,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class='light-btn' v-else @click="onWalletLogin">Connect Wallet</div>
|
||||
</li>
|
||||
</div>
|
||||
</li> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -443,6 +474,7 @@
|
||||
<img src="./../../assets/common/Invites.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Invites</div>
|
||||
<div class="hover-tips">Successful invtations</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="top">
|
||||
@ -450,25 +482,31 @@
|
||||
<img src="./../../assets/common/Icon_Boosting.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Boosting</div>
|
||||
<div class="hover-tips">Daily boosting reamaining times</div>
|
||||
</li>
|
||||
<!-- <li v-if="navIndex == 1"> -->
|
||||
<li>
|
||||
<div class="top">
|
||||
<span class="textCol2">{{ todayStepTicket }}</span>
|
||||
<img src="./../../assets/common/Icon_Explore.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Exploration</div>
|
||||
<div class="hover-tips">Explorations obtained</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="top">
|
||||
<span class="textCol1">{{ myScoreTotal }}.000</span>
|
||||
<span class="textCol1">{{ myScoreTotal }}</span>
|
||||
<img src="./../../assets/common/Icon_Points.png" alt="">
|
||||
</div>
|
||||
<div class="btm">Points</div>
|
||||
<div class="hover-tips">Explorations obtained</div>
|
||||
</li>
|
||||
<div class="touxiang">
|
||||
<img src="./../../assets/home/Nav bar_character.png" alt />
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-top-points-right">
|
||||
<img src="./../../assets/home/Nav bar_character.png" alt />
|
||||
<img src="@/assets/common/wallet-no.png" alt="">
|
||||
<div class="hover-tips">Holder of the partner NFT collections will receive additional rewards</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -558,6 +596,7 @@ import LogDialog from './logDialog.vue'
|
||||
import { getToken } from '@/utils/cookies.js'
|
||||
// import { getWalletAddress, isWalletConnected, linkWallet } from "@/wallet/index.js";
|
||||
import {
|
||||
apiUploadInviteCode,
|
||||
apiBeginActivity,
|
||||
apiCheckActivity,
|
||||
apiTaskClaim,
|
||||
@ -597,7 +636,9 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
inWhiteList: 0,
|
||||
activityData: {},
|
||||
baseTasks: [],
|
||||
myScoreTotal: 0,
|
||||
myInviteCount: 0,
|
||||
myEnhanceCount: 0,
|
||||
@ -668,6 +709,8 @@ export default {
|
||||
dialogTitle: '',
|
||||
eventName: '',
|
||||
logDialogVisible: false,
|
||||
nftsList: [],
|
||||
isNewUser: 0,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
@ -678,6 +721,15 @@ export default {
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
filteredBar() {
|
||||
let aa = this.activeList.filter(item => this.baseTasks.includes(item.id))
|
||||
let bb = aa.filter(item => item.status == 2 || 3).length
|
||||
console.log(bb, aa, this.baseTasks, this.activeList,'-------------------------------------------------------------------------')
|
||||
let cc = bb / this.baseTasks.length * 100
|
||||
return cc
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.userData = JSON.parse(localStorage.getItem("userData"));
|
||||
this.token = getToken();
|
||||
@ -705,6 +757,10 @@ export default {
|
||||
this.myScoreTotal = this.userData.scoreTotal
|
||||
this.myInviteCount = this.userData.inviteCount
|
||||
this.myEnhanceCount = this.userData.enhanceCount
|
||||
this.inWhiteList = this.userData.inWhiteList
|
||||
if(this.$route.params.name) {
|
||||
this.helpConfirm()
|
||||
}
|
||||
|
||||
} else {
|
||||
this.walletDialogVisible = true
|
||||
@ -730,6 +786,8 @@ export default {
|
||||
this.activeList.push(data)
|
||||
}
|
||||
this.activityData = res.data.data
|
||||
this.baseTasks = res.data.data.baseTasks
|
||||
console.log(this.baseTasks, this.activityData)
|
||||
// }
|
||||
})
|
||||
.catch(err => {
|
||||
@ -939,6 +997,7 @@ export default {
|
||||
|
||||
// 社媒任务奖励
|
||||
activityDialog(val) {
|
||||
console.log('社媒任务奖励',val)
|
||||
this.awardData = val
|
||||
this.eventName = 'help_event'
|
||||
this.dialogTitle = 'Congratulations'
|
||||
@ -1082,6 +1141,7 @@ export default {
|
||||
async getNftList() {
|
||||
let res = await this.$axios.get(process.env.VUE_APP_API_URL+'/api/partner/nfts')
|
||||
console.log('apiNftList获取nft合作列表', res)
|
||||
this.nftsList = res.data.data
|
||||
},
|
||||
|
||||
// 复制链接
|
||||
@ -1102,6 +1162,51 @@ export default {
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// 邀请新人
|
||||
async getUploadInviteCode(code) {
|
||||
await apiUploadInviteCode(code)
|
||||
return
|
||||
try {
|
||||
let { errcode, errmsg, data } = apiUploadInviteCode(code)
|
||||
if (errcode) {
|
||||
if (errcode === 12) {
|
||||
// 已领取, 给个提示就可以了
|
||||
this.$message.error(errmsg)
|
||||
} else if (errcode !== 14) {
|
||||
// 状态不是等待链上确认的, 都提示错误
|
||||
this.$message.error(errmsg)
|
||||
}
|
||||
} else {
|
||||
if(data?.status == 3) {
|
||||
// alert(`领取成功, 获得积分: ${data.score}`)
|
||||
// this.activityDialog({data, isNewUser: this.isNewUser})
|
||||
localStorage.removeItem(storeageKey)
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
this.$message.error(`claim task reward error: ${err}`)
|
||||
}
|
||||
},
|
||||
|
||||
// 领取助力奖励 || 判断是否是新用户
|
||||
async helpConfirm() {
|
||||
if(this.$route.params.name != undefined) {
|
||||
let newInvite = this.$route.params.name.split("new=")[1];
|
||||
let rtoken = await checkReCaptcha("invite_user");
|
||||
let res = await this.$axios.get(process.env.VUE_APP_API_URL+"/api/activity/upload_invite_code", {
|
||||
params: { code: newInvite, rtoken: rtoken },
|
||||
headers: { Authorization: `Bearer ${this.token}` }
|
||||
});
|
||||
if (res.data.errcode == 0) {
|
||||
this.isNewUser = 0
|
||||
this.getUploadInviteCode(newInvite)
|
||||
} else {
|
||||
this.isNewUser = 1
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
isLogin() {
|
||||
if(this.token) {
|
||||
this.logDialogVisible = true
|
||||
@ -1176,16 +1281,34 @@ export default {
|
||||
}
|
||||
}
|
||||
.left-top-points {
|
||||
background: #2d2738;
|
||||
border-radius: 15px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.left-top-points-left {
|
||||
// width: 140px;
|
||||
display: flex;
|
||||
height: 50px;
|
||||
padding-right: 30px;
|
||||
background: url('@/assets/common/User-bar.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
li {
|
||||
color: #fff;
|
||||
padding: 5px 20px 5px 40px;
|
||||
padding: 10px 20px 5px 40px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
.hover-tips {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
right: 0px;
|
||||
width: 240px;
|
||||
height: 100px;
|
||||
line-height: 90px;
|
||||
background: url('@/assets/common/WL .png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
@ -1215,6 +1338,11 @@ export default {
|
||||
color: #A8A5AC;
|
||||
text-align: right;
|
||||
}
|
||||
&:hover {
|
||||
.hover-tips {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
li:nth-child(1) {
|
||||
img {
|
||||
@ -1227,25 +1355,52 @@ export default {
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
&:hover {
|
||||
.hover-tips {
|
||||
display: block;
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
}
|
||||
li:nth-child(4) {
|
||||
img {
|
||||
width: 10px;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.left-top-points-right {
|
||||
.touxiang {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: -20px;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
.left-top-points-right {
|
||||
margin-left: 30px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.hover-tips {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
right: -60px;
|
||||
width: 590px;
|
||||
height: 120px;
|
||||
line-height: 110px;
|
||||
background: url('@/assets/common/WL .png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
&:hover {
|
||||
.hover-tips {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1512,22 +1667,75 @@ export default {
|
||||
border-radius: 20px;
|
||||
.bar {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
.bar-left {
|
||||
padding: 0 10px;
|
||||
.bar-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 5px;
|
||||
.bar-top-left {
|
||||
font-size: 14px;
|
||||
}
|
||||
.bar-top-right {
|
||||
width: 200px;
|
||||
height: 8px;
|
||||
margin-left: 10px;
|
||||
background: url('@/assets/common/Progress bar bg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.bar-top-jinDu {
|
||||
width: 80%;
|
||||
height: 8px;
|
||||
background: url('@/assets/common/Progress bar fill.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bar-btm {
|
||||
font-size: 10px;
|
||||
font-size: 12px;
|
||||
color: #9950FD;
|
||||
p {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bar-right {
|
||||
>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 700;
|
||||
}
|
||||
.bar-no {
|
||||
color: #4E475B;
|
||||
}
|
||||
.bar-yes {
|
||||
color: #9950FD;
|
||||
}
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.quest-list {
|
||||
width: 100%;
|
||||
height: 380px;
|
||||
height: 320px;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
.partner {
|
||||
display: flex;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
div:nth-child(1) {
|
||||
width: 180px;
|
||||
}
|
||||
div:nth-child(2) {
|
||||
width: 45px;
|
||||
}
|
||||
}
|
||||
li:hover{
|
||||
background-color: #27242e;
|
||||
}
|
||||
@ -1555,8 +1763,33 @@ export default {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.score {
|
||||
margin-left: 10px;
|
||||
.desc {
|
||||
max-width: 240px;
|
||||
margin: 0 5px;
|
||||
h3 {
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
font-family: 'Poppins-SemiBold';
|
||||
}
|
||||
p {
|
||||
font-family: 'Poppins-Light';
|
||||
font-size: 12px;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
.content-rewards-left {
|
||||
display: flex;
|
||||
align-items: left;
|
||||
width: 180px;
|
||||
.img-logo {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-right: 10px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.desc {
|
||||
max-width: 240px;
|
||||
@ -1573,6 +1806,14 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.rewards {
|
||||
width: 45px;
|
||||
height: 40px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
border-radius: 15px;
|
||||
color: #000;
|
||||
@ -1631,6 +1872,13 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.partner-list {
|
||||
height: 380px;
|
||||
line-height: 380px;
|
||||
font-size: 54px;
|
||||
font-family: "Anton-Regular";
|
||||
font-weight: 700;
|
||||
}
|
||||
::v-deep .quest-list::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
@ -1693,8 +1941,7 @@ export default {
|
||||
.right-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 10px;
|
||||
margin: 10px 50px 10px 0;
|
||||
.right-header-left {
|
||||
.right-header-nav {
|
||||
width: 160px;
|
||||
@ -1923,16 +2170,26 @@ export default {
|
||||
background: #fec25d;
|
||||
border-radius: 15px;
|
||||
font-size: 14px;
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
span {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
color: #000;
|
||||
}
|
||||
img {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
}
|
||||
.check-yes {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.check-btm {
|
||||
width: 200px;
|
||||
@ -1956,14 +2213,14 @@ export default {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url('./../../assets/common/bg_p3.png') no-repeat;
|
||||
background-size: 100%;
|
||||
background-size: 100% 100%;
|
||||
.box-top {
|
||||
width: 100%;
|
||||
// height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
width: 60%;
|
||||
width: 68%;
|
||||
.left-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -1980,16 +2237,34 @@ export default {
|
||||
}
|
||||
}
|
||||
.left-top-points {
|
||||
background: #2d2738;
|
||||
border-radius: 15px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.left-top-points-left {
|
||||
// width: 140px;
|
||||
display: flex;
|
||||
height: 50px;
|
||||
align-items: center;
|
||||
background: url('@/assets/common/User-bar.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
padding-right: 30px;
|
||||
li {
|
||||
color: #fff;
|
||||
padding: 5px 20px 5px 40px;
|
||||
padding: 10px 20px 5px 40px;
|
||||
position: relative;
|
||||
.hover-tips {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
right: 0px;
|
||||
width: 240px;
|
||||
height: 100px;
|
||||
line-height: 90px;
|
||||
background: url('@/assets/common/WL .png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
@ -2019,6 +2294,11 @@ export default {
|
||||
color: #A8A5AC;
|
||||
text-align: right;
|
||||
}
|
||||
&:hover {
|
||||
.hover-tips {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
li:nth-child(1) {
|
||||
img {
|
||||
@ -2031,31 +2311,58 @@ export default {
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
&:hover {
|
||||
.hover-tips {
|
||||
display: block;
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
}
|
||||
li:nth-child(4) {
|
||||
img {
|
||||
width: 10px;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.left-top-points-right {
|
||||
.touxiang {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: -20px;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
.left-top-points-right {
|
||||
margin-left: 30px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.hover-tips {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
right: -60px;
|
||||
width: 590px;
|
||||
height: 120px;
|
||||
line-height: 110px;
|
||||
background: url('@/assets/common/WL .png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
&:hover {
|
||||
.hover-tips {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 30%;
|
||||
width: 28%;
|
||||
padding: 20px 30px;
|
||||
.right-header {
|
||||
display: flex;
|
||||
@ -2155,8 +2462,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.nav-btm {
|
||||
width: 380px;
|
||||
|
||||
// width: 380px;
|
||||
margin: 10px auto;
|
||||
margin-bottom: 0px;
|
||||
.nav {
|
||||
|
||||
@ -36,7 +36,7 @@
|
||||
<el-table-column label=" Earnings">
|
||||
<template slot-scope="scope">
|
||||
<div class="points">
|
||||
<span>{{ scope.row.score }}</span>
|
||||
<span>{{ scope.row.scoreInvite }}</span>
|
||||
<!-- <img src="./../../assets/common/Icon_Points.png" alt=""> -->
|
||||
</div>
|
||||
</template>
|
||||
@ -95,6 +95,7 @@ export default {
|
||||
headers: { Authorization: `Bearer ${token}` }
|
||||
});
|
||||
// ToDo
|
||||
this.invitationList = res.data.data
|
||||
console.log("我的邀请列表", res.data.data);
|
||||
},
|
||||
|
||||
|
||||
@ -33,7 +33,7 @@
|
||||
</div>
|
||||
<div class="forward-list-item-top">
|
||||
<div class="user-img">
|
||||
<img :src="rankingTableData[0].avatar" alt="">
|
||||
<img :src="rankingTableData[1].avatar" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="forward-list-item-btm">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user