Skip to content

W
walk_daka_h5
Commit 9d623af2 by 穆启卓
Options

比赛详情页自动显示底部 & 我的页面新增一栏 & 打卡记录页文字和状态

parent f15d6e69
Showing with 348 additions and 343 deletions
src/images/Record/status0.png
src/images/Record/status0.png

1.08 KB | W: | H:

src/images/Record/status0.png

1.07 KB | W: | H:

src/images/Record/status0.png
src/images/Record/status0.png
src/images/Record/status0.png
src/images/Record/status0.png
  • 2-up
  • Swipe
  • Onion skin
src/images/Record/status2.png
src/images/Record/status2.png

1.09 KB | W: | H:

src/images/Record/status2.png

1.08 KB | W: | H:

src/images/Record/status2.png
src/images/Record/status2.png
src/images/Record/status2.png
src/images/Record/status2.png
  • 2-up
  • Swipe
  • Onion skin
src/images/Record/status3.png
src/images/Record/status3.png

1.07 KB | W: | H:

src/images/Record/status3.png

1.09 KB | W: | H:

src/images/Record/status3.png
src/images/Record/status3.png
src/images/Record/status3.png
src/images/Record/status3.png
  • 2-up
  • Swipe
  • Onion skin
src/views/HaveJoinedGame.vue
<template> <template>
<div class="have-joined-game-page"> <div class="have-joined-game-page-scroll">
<Title class="page-title" @goback="goback" show_back="true" v-if="currentPage()==='HaveJoinedGame'"></Title> <div class="have-joined-game-page">
<div class="game-rule-container" @click="goOtherPage('Rule')"> <Title class="page-title" @goback="goback" show_back="true" v-if="currentPage()==='HaveJoinedGame'"></Title>
<img src="../images/ChallengeDetail/ic_que.png"> <div class="game-rule-container" @click="goOtherPage('Rule')">
活动规则 <img src="../images/ChallengeDetail/ic_que.png">
</div> 活动规则
<div class="game-bonus-container"> </div>
<div class="bonus-title">本期累计奖励金（元）</div> <div class="game-bonus-container">
<div class="bonus-amount">{{bet_bonus|moneyFormatter}}</div> <div class="bonus-title">本期累计奖励金（元）</div>
</div> <div class="bonus-amount">{{bet_bonus|moneyFormatter}}</div>
<div class="game-title">{{target_steps}}步{{record_list.length}}日耐力赛</div> </div>
<div class="game-time">开赛时间：{{period_start}} — {{period_end}}</div> <div class="game-title">{{target_steps}}步{{record_list.length}}日耐力赛</div>
<div class="target-people-container"> <div class="game-time">开赛时间：{{period_start}} — {{period_end}}</div>
<img class="target-img" src="../images/HaveJoinedGame/ic_shoes.png"> <div class="target-people-container">
<div class="target-people-text">每日{{target_steps}}步达标</div> <img class="target-img" src="../images/HaveJoinedGame/ic_shoes.png">
<img class="people-img" src="../images/HaveJoinedGame/ic_people.png"> <div class="target-people-text">每日{{target_steps}}步达标</div>
<div class="target-people-text">已有{{total_signup}}人参赛</div> <img class="people-img" src="../images/HaveJoinedGame/ic_people.png">
</div> <div class="target-people-text">已有{{total_signup}}人参赛</div>
<div class="hr"></div> </div>
<!-- <div style="height: 2.68rem;">v-if="showSwiper" --> <div class="hr"></div>
<swiper :options="swiperOption" ref="mySwiper" class="game-scroll-container" v-show="showSwiper">
<swiper :options="swiperOption" ref="mySwiper" class="game-scroll-container" v-show="showSwiper"> <swiper-slide v-for="(item,index) in record_list" :key="index">
<swiper-slide v-for="(item,index) in record_list" :key="index"> <div class="game-scroll-item">
<div class="game-scroll-item"> <div class="item-title-status">
<div class="item-title-status"> <div class="item-title">第{{item.days}}天</div>
<div class="item-title">第{{item.days}}天</div> <div :class="item.status===0?'item-status0':item.status===1?'item-status1':item.status===2?'item-status2':'item-status2'">{{item.status===0?'未开始':item.status===1?'比赛中':item.status===2?'已结束':'已淘汰'}}</div>
<div :class="item.status===0?'item-status0':item.status===1?'item-status1':item.status===2?'item-status2':'item-status2'">{{item.status===0?'未开始':item.status===1?'比赛中':item.status===2?'已结束':'已淘汰'}}</div> </div>
</div> <div class="item-income" v-if="(item.status == 1 || item.status == 2) && item.money">
<div class="item-income" v-if="(item.status == 1 || item.status == 2) && item.money"> <div class="item-amount">{{item.money|moneyFormatter}}</div>
<div class="item-amount">{{item.money|moneyFormatter}}</div> <div class="item-text">(元) 收益</div>
<div class="item-text">(元) 收益</div> </div>
</div> <div class="item-income" v-else-if="(item.status == 1 || item.status == 2) && item.yj_money">
<div class="item-income" v-else-if="(item.status == 1 || item.status == 2) && item.yj_money"> <div class="item-amount">{{item.yj_money|moneyFormatter}}</div>
<div class="item-amount">{{item.yj_money|moneyFormatter}}</div> <div class="item-text">(元) 预计收益</div>
<div class="item-text">(元) 预计收益</div> </div>
</div> <div class="item-income" v-else style="visibility: hidden;">
<div class="item-income" v-else style="visibility: hidden;"> <div class="item-amount">0.00</div>
<div class="item-amount">0.00</div> <div class="item-text">(元)</div>
<div class="item-text">(元)</div> </div>
<div class="item-progress-num">
<div class="item-num" v-if="item.status===0">还有{{item.format_tsp || '0秒'}}开始</div>
<template v-else>
<div class="item-progress" :style="'width: '+item.rate/100*2.46+'rem;'" v-if="index ==0 || (index > 0 && record_list[index-1].status != 3)"></div>
<div class="item-num">
<!-- 已淘汰 1-->
<!-- 0: 未开始 1:比赛中 2:已结束 3:已淘汰-->
<span v-if="item.is_complete == 2">未达标({{item.step_num}}步)</span>
<span v-else-if="item.status == 3 && item.is_complete != 2">已失去比赛资格</span>
<span v-else-if="item.is_complete == 1 && item.status == 2">已达标({{item.step_num}}步)</span>
<span v-else-if="item.status == 1 && item.is_complete == 1">今天达标了</span>
<!-- 今天进行中-->
<span v-else-if="item.is_complete == 0 && item.status == 1">({{item.step_num}}/{{target_steps}}步)</span>
</div>
</template>
</div>
</div> </div>
<div class="item-progress-num"> </swiper-slide>
<div class="item-num" v-if="item.status===0">还有{{item.format_tsp || '0秒'}}开始</div> <div class="swiper-pagination" slot="pagination" style="opacity: 0"></div>
<template v-else> </swiper>
<div class="item-progress" :style="'width: '+item.rate/100*2.46+'rem;'" v-if="index ==0 || (index > 0 && record_list[index-1].status != 3)"></div> <div class="func-btn green-btn" @click="inviteFriend" v-if="record_list.length&&record_list[0].status === 0">邀请好友来参赛</div>
<div class="item-num"> <div class="func-btn" @click="goOtherPage('GoXCX')" v-else>提交今日步数</div>
<!-- //已淘汰 1--> <div class="next-func-btn" v-if="next_signup" @click="joinNextGame()">报名下一期</div>
<!-- 0: 未开始 1:比赛中 2:已结束 3:已淘汰--> <!-- 报名成功弹框 -->
<span v-if="item.is_complete == 2">未达标({{item.step_num}}步)</span> <div class="game-status-popup" v-if="userHavePaidGame">
<span v-else-if="item.status == 3 && item.is_complete != 2">已失去比赛资格</span> <div class="game-status-container">
<span v-else-if="item.is_complete == 1 && item.status == 2">已达标({{item.step_num}}步)</span> <img class="status-icon" src="../images/HaveJoinedGame/pop_bmcg_title.png">
<span v-else-if="item.status == 1 && item.is_complete == 1">今天达标了</span> <img class="join-success-banner" src="../images/HaveJoinedGame/pop_bmcg_img.png">
<!-- 今天进行中--> <div class="popup-text1">
<span v-else-if="item.is_complete == 0 && item.status == 1">({{item.step_num}}/{{target_steps}}步)</span> <span>每日24点前</span>打开「步步运动赚」小程序，手动提交今日步数，否则可能导致无法分钱哦！
</div>
</template>
</div> </div>
<div class="popup-text2">注：微信暂不支持小程序实时更新步数</div>
<div class="popup-btn1 green-btn" @click="inviteFriend">邀请好友来参赛</div>
<img class="close-btn" src="../images/common/pop_ic_close.png" @click="closePayPopup()">
</div> </div>
</swiper-slide>
<div class="swiper-pagination" slot="pagination" style="opacity: 0"></div>
</swiper>
<!-- </div>-->
<div class="func-btn green-btn" @click="inviteFriend" v-if="record_list.length&&record_list[0].status === 0">邀请好友来参赛</div>
<div class="func-btn" @click="goOtherPage('GoXCX')" v-else>提交今日步数</div>
<div class="next-func-btn" v-if="next_signup" @click="joinNextGame()">报名下一期</div>
<!-- 报名成功弹框 -->
<div class="game-status-popup" v-if="userHavePaidGame">
<div class="game-status-container">
<img class="status-icon" src="../images/HaveJoinedGame/pop_bmcg_title.png">
<img class="join-success-banner" src="../images/HaveJoinedGame/pop_bmcg_img.png">
<div class="popup-text1">
<span>每日24点前</span>打开「步步运动赚」小程序，手动提交今日步数，否则可能导致无法分钱哦！
</div>
<div class="popup-text2">注：微信暂不支持小程序实时更新步数</div>
<div class="popup-btn1 green-btn" @click="inviteFriend">邀请好友来参赛</div>
<img class="close-btn" src="../images/common/pop_ic_close.png" @click="closePayPopup()">
</div> </div>
</div> <!-- 恭喜达标弹框 -->
<!-- 恭喜达标弹框 --> <div class="game-status-popup" v-if="popupData.window && popupData.daka_done">
<div class="game-status-popup" v-if="popupData.window && popupData.daka_done"> <div class="game-status-container">
<div class="game-status-container"> <img class="status-icon" src="../images/HaveJoinedGame/pop_gxdb_title.png">
<img class="status-icon" src="../images/HaveJoinedGame/pop_gxdb_title.png"> <div class="status-date">第{{popupData.days}}日达标</div>
<div class="status-date">第{{popupData.days}}日达标</div> <div class="status-money">
<div class="status-money"> <div class="popup-text3">{{popupData.days===popupData.all_days?'总奖励金':'返还契约金'}}</div>
<div class="popup-text3">{{popupData.days===popupData.all_days?'总奖励金':'返还契约金'}}</div> <div class="popup-text4">
<div class="popup-text4"> {{popupData.yj_money|moneyFormatter}}
{{popupData.yj_money|moneyFormatter}} <span>元</span>
<span>元</span> </div>
<div class="popup-text5">第{{String(popupData.week).substring(4,8)}}期{{popupData.target_steps}}步{{popupData.all_days}}日耐力赛</div>
</div> </div>
<div class="popup-text5">第{{String(popupData.week).substring(4,8)}}期{{popupData.target_steps}}步{{popupData.all_days}}日耐力赛</div> <div class="popup-text6">{{popupData.target_steps}}步达标，今天走了{{popupData.step_num}}步</div>
<div class="popup-text7">{{popupData.days===popupData.all_days?'奖励金':'契约金'}}将于12点后返还至钱包中</div>
<div class="popup-btn1 green-btn" @click="inviteFriend">邀请好友来参赛</div>
<img class="close-btn" src="../images/common/pop_ic_close.png" @click="closePopup()">
</div> </div>
<div class="popup-text6">{{popupData.target_steps}}步达标，今天走了{{popupData.step_num}}步</div>
<div class="popup-text7">{{popupData.days===popupData.all_days?'奖励金':'契约金'}}将于12点后返还至钱包中</div>
<div class="popup-btn1 green-btn" @click="inviteFriend">邀请好友来参赛</div>
<img class="close-btn" src="../images/common/pop_ic_close.png" @click="closePopup()">
</div> </div>
</div> <!-- 你已被淘汰弹框 -->
<!-- 你已被淘汰弹框 --> <div class="game-status-popup" v-else-if="popupData.window && !popupData.daka_done">
<div class="game-status-popup" v-else-if="popupData.window && !popupData.daka_done"> <div class="game-status-container">
<div class="game-status-container"> <img class="status-icon" src="../images/HaveJoinedGame/pop_out_title.png">
<img class="status-icon" src="../images/HaveJoinedGame/pop_out_title.png"> <div class="status-date">第{{popupData.days}}日未达标</div>
<div class="status-date">第{{popupData.days}}日未达标</div> <div class="status-money">
<div class="status-money"> <div class="popup-text3">扣除契约金</div>
<div class="popup-text3">扣除契约金</div> <div class="popup-text4">
<div class="popup-text4"> {{popupData.yj_money|moneyFormatter}}
{{popupData.yj_money|moneyFormatter}} <span>元</span>
<span>元</span> </div>
<div class="popup-text5">第{{String(popupData.week).substring(4,8)}}期{{popupData.target_steps}}步{{popupData.all_days}}日耐力赛</div>
</div> </div>
<div class="popup-text5">第{{String(popupData.week).substring(4,8)}}期{{popupData.target_steps}}步{{popupData.all_days}}日耐力赛</div> <div class="popup-text6">{{popupData.target_steps}}步达标，今天走了{{popupData.step_num}}步</div>
<div class="popup-text7">已达标{{popupData.days}}天，契约金已返还至你的钱包</div>
<div class="popup-btn1 yellow-btn" @click="joinNextGame()">报名下一期</div>
<img class="close-btn" src="../images/common/pop_ic_close.png" @click="closePopup()">
</div> </div>
<div class="popup-text6">{{popupData.target_steps}}步达标，今天走了{{popupData.step_num}}步</div>
<div class="popup-text7">已达标{{popupData.days}}天，契约金已返还至你的钱包</div>
<div class="popup-btn1 yellow-btn" @click="joinNextGame()">报名下一期</div>
<img class="close-btn" src="../images/common/pop_ic_close.png" @click="closePopup()">
</div> </div>
<ShareModal v-on:close="closeShareModal" v-if="showShareModal"></ShareModal>
</div> </div>
<ShareModal v-on:close="closeShareModal" v-if="showShareModal"></ShareModal>
</div> </div>
</template> </template>
...@@ -175,15 +174,7 @@ export default { ...@@ -175,15 +174,7 @@ export default {
this.userHavePaidGame = true; this.userHavePaidGame = true;
} }
}, },
computed: {
swiper() {
return this.$refs.mySwiper.swiper;
}
},
mounted() { mounted() {
setTimeout(() => {
this.swiper.slideTo(this.current_day, 1200, false);
}, 800);
if (window["userData"]) { if (window["userData"]) {
this.userData = window["userData"]; this.userData = window["userData"];
} else { } else {
...@@ -194,6 +185,17 @@ export default { ...@@ -194,6 +185,17 @@ export default {
} }
} }
}, },
updated() {
// 显示页面最底部
this.$nextTick(function(){
document.getElementsByClassName('have-joined-game-page-scroll')[0].scrollTop = document.body.scrollHeight;
})
},
computed: {
swiper() {
return this.$refs.mySwiper.swiper;
}
},
methods: { methods: {
joinNextGame() { joinNextGame() {
this.$router.push({ this.$router.push({
...@@ -242,6 +244,9 @@ export default { ...@@ -242,6 +244,9 @@ export default {
this.record_list = pageData.record_list; this.record_list = pageData.record_list;
this.current_day = pageData.current_day - 1; this.current_day = pageData.current_day - 1;
this.showSwiper = true; this.showSwiper = true;
setTimeout(() => {
this.swiper.slideTo(this.current_day, 1200, false);
}, 800);
} }
}); });
}, },
...@@ -382,272 +387,267 @@ export default { ...@@ -382,272 +387,267 @@ export default {
height: 2.68rem; height: 2.68rem;
} }
.have-joined-game-page { .have-joined-game-page-scroll {
// width: 100%; height: 100vh;
min-height: 100vh; overflow-y: scroll;
background-color: rgb(70, 88, 149); .have-joined-game-page {
background-image: url(../images/SignUp/sy_beijing.png); width: 100%;
background-repeat: no-repeat; min-height: 100vh;
background-size: 100%; background-color: rgb(70, 88, 149);
background-position: center top; background-image: url(../images/SignUp/sy_beijing.png);
display: flex; background-repeat: no-repeat;
flex-direction: column; background-size: 100%;
align-items: center; background-position: center top;
overflow: hidden;
position: relative;
padding-bottom: 50px;
.game-rule-container {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
position: absolute; position: relative;
top: 0.3rem; padding-bottom: .3rem;
right: 0.22rem; box-sizing: border-box;
font-size: 0.26rem;
line-height: 1;
color: #465895;
img {
width: 0.3rem;
height: 0.3rem;
margin-right: 0.1rem;
}
.page-title { .page-title {
width: 100%; width: 100%;
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
z-index: 2;
}
.game-rule-container {
display: flex;
align-items: center;
position: fixed;
top: 0.34rem;
right: 0.22rem;
font-size: 0.26rem;
line-height: 1;
color: #465895;
z-index: 3;
img {
width: 0.3rem;
height: 0.3rem;
margin-right: 0.1rem;
}
}
.game-bonus-container {
width: 6.4rem;
padding: 0.3rem 0;
box-sizing: border-box;
background: url("../images/SignUp/shadow-bg.png") no-repeat center center;
background-size: contain;
margin-top: 2.38rem;
.bonus-title {
font-size: 0.3rem;
line-height: 1;
color: #fff;
text-align: center;
}
.bonus-amount {
font-size: 0.64rem;
line-height: 0.8;
color: #ffe253;
text-align: center;
margin-top: 0.26rem;
}
} }
}
.game-bonus-container { .game-title {
width: 6.4rem; font-size: 0.36rem;
padding: 0.3rem 0;
box-sizing: border-box;
background: url("../images/SignUp/shadow-bg.png") no-repeat center center;
background-size: contain;
/*background: linear-gradient(*/
/* 90deg,*/
/* rgba(255, 255, 255, 0),*/
/* #1a285a,*/
/* rgba(255, 255, 255, 0)*/
/*);*/
margin-top: 2.38rem;
.bonus-title {
font-size: 0.3rem;
line-height: 1; line-height: 1;
color: #fff; color: #fff;
text-align: center; font-weight: bold;
margin-top: 0.4rem;
} }
.bonus-amount { .game-time {
font-size: 0.64rem; font-size: 0.24rem;
line-height: 0.8; line-height: 1;
color: #ffe253; color: #d6dfff;
text-align: center; padding: 0.12rem 0.38rem;
margin-top: 0.26rem; border-radius: 0.48rem;
background: #556cb6;
margin-top: 0.14rem;
} }
}
.game-title { .target-people-container {
font-size: 0.36rem; display: flex;
line-height: 1; margin-top: 0.34rem;
color: #fff;
font-weight: bold;
margin-top: 0.4rem;
}
.game-time { .target-img {
font-size: 0.24rem; width: 0.3rem;
line-height: 1; height: 0.26rem;
color: #d6dfff; }
padding: 0.12rem 0.38rem;
border-radius: 0.48rem;
background: #556cb6;
margin-top: 0.14rem;
}
.target-people-container {
display: flex;
margin-top: 0.34rem;
.target-img {
width: 0.3rem;
height: 0.26rem;
}
.people-img { .people-img {
width: 0.28rem; width: 0.28rem;
height: 0.24rem; height: 0.24rem;
margin-left: 0.5rem; margin-left: 0.5rem;
} }
.target-people-text { .target-people-text {
font-size: 0.26rem; font-size: 0.26rem;
line-height: 1; line-height: 1;
color: #fff; color: #fff;
margin-left: 0.08rem; margin-left: 0.08rem;
}
} }
}
.hr { .hr {
width: 3rem; width: 3rem;
height: 0.01rem; height: 0.01rem;
background: #6f82c3; background: #6f82c3;
margin-top: 0.5rem; margin-top: 0.5rem;
}
.game-scroll-container {
width: 100%;
height: 2.68rem;
margin-top: 0.4rem;
padding: 0 0.3rem;
box-sizing: border-box;
overflow-x: scroll;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
&::-webkit-scrollbar {
display: none;
} }
.game-scroll-item { .game-scroll-container {
width: 5.1rem; width: 100%;
height: 2.68rem; height: 2.68rem;
background-image: url(../images/HaveJoinedGame/img_card.png); margin-top: 0.4rem;
background-repeat: no-repeat; padding: 0 0.3rem;
background-size: 100% 100%;
padding-top: 0.24rem;
box-sizing: border-box; box-sizing: border-box;
margin-left: 0.2rem; overflow-x: scroll;
display: inline-block; white-space: nowrap;
vertical-align: top; -webkit-overflow-scrolling: touch;
&::-webkit-scrollbar {
&:first-child { display: none;
margin-left: 0;
} }
.item-title-status { .game-scroll-item {
width: 100%; width: 5.1rem;
padding: 0 0.24rem 0 0.3rem; height: 2.68rem;
background-image: url(../images/HaveJoinedGame/img_card.png);
background-repeat: no-repeat;
background-size: 100% 100%;
padding-top: 0.24rem;
box-sizing: border-box; box-sizing: border-box;
display: flex; margin-left: 0.2rem;
align-items: center; display: inline-block;
justify-content: space-between; vertical-align: top;
.item-title { &:first-child {
font-size: 0.3rem; margin-left: 0;
line-height: 1;
color: #fff;
} }
.item-status0 { .item-title-status {
padding: 0 0.16rem; width: 100%;
padding: 0 0.24rem 0 0.3rem;
box-sizing: border-box; box-sizing: border-box;
background: rgba(255, 255, 255, 0.4); display: flex;
font-size: 0.26rem; align-items: center;
line-height: 0.42rem; justify-content: space-between;
color: #fff;
} .item-title {
font-size: 0.3rem;
line-height: 1;
color: #fff;
}
.item-status1 { .item-status0 {
padding: 0 0.16rem; padding: 0 0.16rem;
box-sizing: border-box; box-sizing: border-box;
background: #fcf776; background: rgba(255, 255, 255, 0.4);
font-size: 0.26rem; font-size: 0.26rem;
line-height: 0.42rem; line-height: 0.42rem;
color: #703e0b; color: #fff;
}
.item-status1 {
padding: 0 0.16rem;
box-sizing: border-box;
background: #fcf776;
font-size: 0.26rem;
line-height: 0.42rem;
color: #703e0b;
}
.item-status2 {
padding: 0 0.16rem;
box-sizing: border-box;
background: #a5a5a5;
font-size: 0.26rem;
line-height: 0.42rem;
color: #fff;
}
} }
.item-status2 { .item-income {
padding: 0 0.16rem; width: 100%;
padding-left: 0.3rem;
box-sizing: border-box; box-sizing: border-box;
background: #a5a5a5; margin-top: 0.4rem;
font-size: 0.26rem; display: flex;
line-height: 0.42rem; align-items: flex-end;
color: #fff;
} .item-amount {
} font-size: 0.48rem;
line-height: 0.8;
color: #fcf776;
}
.item-income { .item-text {
width: 100%; font-size: 0.26rem;
padding-left: 0.3rem; line-height: 1;
box-sizing: border-box; color: #dbf3ff;
margin-top: 0.4rem; margin-left: 0.1rem;
display: flex; }
align-items: flex-end;
.item-amount {
font-size: 0.48rem;
line-height: 0.8;
color: #fcf776;
} }
.item-text { .item-progress-num {
font-size: 0.26rem; width: 100%;
line-height: 1; padding: 0 0.3rem;
color: #dbf3ff; box-sizing: border-box;
margin-left: 0.1rem; margin-top: 0.58rem;
} display: flex;
} align-items: center;
justify-content: space-between;
.item-progress-num { .item-progress {
width: 100%;
padding: 0 0.3rem;
box-sizing: border-box;
margin-top: 0.58rem;
display: flex;
align-items: center;
justify-content: space-between;
.item-progress {
height: 0.06rem;
background: #fff;
position: relative;
&:after {
content: "";
width: 2.46rem;
height: 0.06rem; height: 0.06rem;
background: rgba(255, 255, 255, 0.5); background: #fff;
position: absolute; position: relative;
&:after {
content: "";
width: 2.46rem;
height: 0.06rem;
background: rgba(255, 255, 255, 0.5);
position: absolute;
}
} }
}
.item-num { .item-num {
font-size: 0.26rem; font-size: 0.26rem;
line-height: 1; line-height: 1;
color: #fff; color: #fff;
}
} }
} }
} }
}
.func-btn { .func-btn {
width: 5.6rem; width: 5.6rem;
border-radius: 0.92rem; border-radius: 0.92rem;
background: #fabd21; background: #fabd21;
font-size: 0.4rem; font-size: 0.4rem;
line-height: 0.92rem; line-height: 0.92rem;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
margin-top: 1.2rem; margin-top: 1.2rem;
} }
.green-btn { .green-btn {
background: #1fdbb1; background: #1fdbb1;
} }
.next-func-btn { .next-func-btn {
width: 5.6rem; width: 5.6rem;
border-radius: 0.92rem; border-radius: 0.92rem;
background: #0ebfdf; background: #0ebfdf;
font-size: 0.4rem; font-size: 0.4rem;
line-height: 0.92rem; line-height: 0.92rem;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
margin-top: 0.3rem; margin-top: 0.3rem;
}
} }
} }
......
src/views/Record.vue
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
</div> </div>
<div class="other-info-container"> <div class="other-info-container">
<div class="other-info-item"> <div class="other-info-item">
<div class="title">参赛期数</div> <div class="title">完赛期数</div>
<div class="content">{{recordTotal.total}}</div> <div class="content">{{recordTotal.total}}</div>
</div> </div>
<div class="other-info-item"> <div class="other-info-item">
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
<div class="item-content-point">{{item.money | moneyFormatter}}</div> <div class="item-content-point">{{item.money | moneyFormatter}}</div>
</div> </div>
<div class="detail-item"> <div class="detail-item">
<div class="item-title">{{(item.at_present===1||item.at_present===3)?'结算步数':'当前步数'}}</div> <div class="item-title">{{(item.at_present===0||item.at_present===1)?'结算步数':'当前步数'}}</div>
<div class="item-content">{{item.steps || 0}}</div> <div class="item-content">{{item.steps || 0}}</div>
</div> </div>
<div class="detail-item"> <div class="detail-item">
...@@ -39,10 +39,11 @@ ...@@ -39,10 +39,11 @@
<div class="item-content">{{item.daka_count || 0}}</div> <div class="item-content">{{item.daka_count || 0}}</div>
</div> </div>
</div> </div>
<img class="corner-marker" src="../images/Record/status0.png" v-if="item.at_present === 2"> <!-- at_present => 0: 已淘汰 1:已结束 2:比赛中 3:未开始-->
<img class="corner-marker" src="../images/Record/status0.png" v-if="item.at_present === 0">
<img class="corner-marker" src="../images/Record/status1.png" v-else-if="item.at_present === 1"> <img class="corner-marker" src="../images/Record/status1.png" v-else-if="item.at_present === 1">
<img class="corner-marker" src="../images/Record/status2.png" v-else-if="item.at_present === 3"> <img class="corner-marker" src="../images/Record/status2.png" v-else-if="item.at_present === 2">
<img class="corner-marker" src="../images/Record/status3.png" v-else-if="item.at_present === 0"> <img class="corner-marker" src="../images/Record/status3.png" v-else-if="item.at_present === 3">
</div> </div>
<div class="no-more-list">没有更多数据啦~</div> <div class="no-more-list">没有更多数据啦~</div>
</div> </div>
......
src/views/Rule.vue
...@@ -35,7 +35,6 @@ export default { ...@@ -35,7 +35,6 @@ export default {
data() { data() {
return {}; return {};
}, },
mounted() {},
methods: { methods: {
goback() { goback() {
history.go(-1); history.go(-1);
......
src/views/UserCenter.vue
...@@ -79,31 +79,36 @@ ...@@ -79,31 +79,36 @@
userData: {}, userData: {},
btnList: [ btnList: [
{ {
icon: require("../assets/ic_my_wallet.png"), icon: require("../images/UserCenter/ic_my_wallet.png"),
text: "钱包", text: "钱包",
money: "0", money: "0",
router: "Wallet" router: "Wallet"
}, },
{ {
icon: require("../assets/ic_my_record.png"), icon: require("../images/UserCenter/ic_my_record.png"),
text: "我的打卡记录", text: "我的打卡记录",
router: "Record" router: "Record"
}, },
{ {
icon: require("../assets/ic_my_que.png"), icon: require("../images/UserCenter/ic_my_que.png"),
text: "常见问题", text: "常见问题",
router: "Question" router: "Question"
}, },
{ {
icon: require("../assets/ic_my_connect.png"), icon: require("../images/UserCenter/ic_my_connect.png"),
text: "联系我们", text: "联系我们",
isKefu: 1 isKefu: 1
}, },
{ {
icon: require("../assets/ic_my_code.png"), icon: require("../images/UserCenter/ic_my_code.png"),
text: "关注公众号", text: "关注公众号",
isKefu: 2 isKefu: 2
}, },
{
icon: require("../images/UserCenter/ic_my_daka.png"),
text: "提交今日步数",
router: "GoXCX"
},
] ]
} }
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment