提交 904df773 authored 作者: matian's avatar matian

fix:代码优化

上级 475b8cf3
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
<swiper id="swiperBox" v-bind:options="swiperOption" ref="mySwiper"> <swiper id="swiperBox" v-bind:options="swiperOption" ref="mySwiper">
<!-- 第一页 --> <!-- 第一页 -->
<swiper-slide class="swiper-slide1"> <swiper-slide class="swiper-slide1">
<img :src="signInfo.background_img" alt="" class="background_img">
<div class="top"> <div class="top">
<img :src="signInfo.market_background_img || defaultImg" alt="" /> <img :src="signInfo.market_background_img || defaultImg" alt="" />
<div class="sign_state"> <div class="sign_state">
...@@ -13,7 +14,7 @@ ...@@ -13,7 +14,7 @@
</div> </div>
<div class="bottom" v-if="signInfo.market_other_img !== ''"> <div class="bottom" v-if="signInfo.market_other_img !== ''">
<img :src="detail_icon" alt="" /> <img :src="detail_icon" alt="" />
<div class="detail_text">查看详情</div> <!-- <div class="detail_text">查看详情</div> -->
</div> </div>
</swiper-slide> </swiper-slide>
<!-- 第二页 --> <!-- 第二页 -->
...@@ -52,6 +53,7 @@ export default { ...@@ -52,6 +53,7 @@ export default {
status: false, //签到状态 status: false, //签到状态
defaultImg: "https://webapp-pub.ezijing.com/marketing/signIn_img.png", //默认签到背景图 defaultImg: "https://webapp-pub.ezijing.com/marketing/signIn_img.png", //默认签到背景图
detail_icon: "https://webapp-pub.ezijing.com/marketing/detail_img.png", //查看详情图标 detail_icon: "https://webapp-pub.ezijing.com/marketing/detail_img.png", //查看详情图标
// background_img:'https://img0.baidu.com/it/u=1437590121,298950426&fm=15&fmt=auto&gp=0.jpg'
}; };
}, },
computed: { computed: {
...@@ -63,24 +65,25 @@ export default { ...@@ -63,24 +65,25 @@ export default {
}, },
}, },
mounted() { mounted() {
this.getSignInDetail(); //获取页面详情 this.getSignInDetail(); //获取页面详情
}, },
methods: { methods: {
getSignInDetail() { getSignInDetail() {
let id = this.$route.query.id; // let id = this.$route.query.id;//从链接上获取活动id
let id = "6833097708249546752";
console.log(id);
signInDetail(id).then((res) => { signInDetail(id).then((res) => {
//调用签到详情接口 //调用签到详情接口
if (res.code == 0) { if (res.code == 0) {
this.signInfo = res.data;//获取签到详情数据 this.signInfo = res.data;//获取签到详情数据
let time = new Date().getTime(); let time = new Date().getTime();
this.signInfo.sign_start_time = new Date(this.signInfo.sign_start_time).getTime(); let sign_start_time = new Date(this.signInfo.sign_start_time).getTime();
this.signInfo.sign_end_time = new Date(this.signInfo.sign_end_time).getTime(); let sign_end_time = new Date(this.signInfo.sign_end_time).getTime();
if(time - this.signInfo.sign_end_time >= 0){ if(time - sign_end_time >= 0){
this.$message.error(`该活动签到时间已于${this.signInfo.sign_end_time}结束`) this.$message.error(`该活动签到时间已于${this.signInfo.sign_end_time}结束`)
}else if(time - this.signInfo.sign_start_time < 0){ }else if(time - sign_start_time < 0){
this.$message.error(`该活动尚未到开始签到时间, 请于${this.signInfo.sign_start_time}之后签到`); this.$message.error(`该活动尚未到开始签到时间, 请于${this.signInfo.sign_start_time}之后签到`);
}else if((time - this.signInfo.sign_start_time > 0 && time - this.signInfo.sign_end_time < 0) ||time - this.sign_start_time == 0){ }else if((time - sign_start_time > 0 && time - sign_end_time < 0) ||time - sign_start_time == 0){
signIn(id).then((res) => { signIn(id).then((res) => {
//调用签到接口 //调用签到接口
if (res.code == 0) { if (res.code == 0) {
...@@ -92,15 +95,13 @@ export default { ...@@ -92,15 +95,13 @@ export default {
} }
} }
}); });
} }
} }
}); });
} }
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.fade-enter-active, .fade-enter-active,
.fade-leave-active { .fade-leave-active {
...@@ -116,20 +117,24 @@ export default { ...@@ -116,20 +117,24 @@ export default {
background-color: #f2f2f2; background-color: #f2f2f2;
overflow: -Scroll; overflow: -Scroll;
overflow-y: hidden; overflow-y: hidden;
.background_img{
width: 100%;
height: 100%;
}
.top { .top {
width: 6.89rem; width: 6.89rem;
height: 10.52rem; height: 7.76rem;
background-color: #fff; background-color: #fff;
border-radius: 20px; border-radius: 20px;
position: absolute; position: absolute;
margin-top: 0.38rem; top: 2.22rem;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
text-align: center; text-align: center;
img { img {
width: 4.59rem; width: 4.59rem;
height: 1.81rem; height: 1.81rem;
margin-top: 1.99rem; margin-top: .70rem;
} }
.sign_state { .sign_state {
margin: auto; margin: auto;
...@@ -137,30 +142,30 @@ export default { ...@@ -137,30 +142,30 @@ export default {
font-weight: bold; font-weight: bold;
color: #333333; color: #333333;
margin-bottom: 0.96rem; margin-bottom: 0.96rem;
margin-top: .99rem;
} }
.remark { .remark {
margin: auto; margin: auto;
font-size: 0.28rem; font-size: 0.28rem;
font-weight: 400; font-weight: 400;
color: #666666; color: #666666;
margin-bottom: 2.39rem; margin-bottom: .92rem;
} }
} }
@keyframes movepoint{from{bottom:1.2rem}to{bottom:1.44rem}}
.bottom { .bottom {
position: absolute; position: fixed;
left: 50%; left: 50%;
bottom:1.44rem;
transform: translateX(-50%); transform: translateX(-50%);
text-align: center; animation: movepoint 2s infinite;
margin-top: 10.63rem; -webkit-animation: movepoint 2s infinite;
img { img {
width: 0.48rem; width: 0.48rem;
height: 0.34rem; height: 0.34rem;
} line-height: 100%;
.detail_text { display: inline-block;
font-size: 0.24rem;
font-weight: 400;
color: #666666;
margin: auto;
} }
} }
.detailPage { .detailPage {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论