| xqd
@@ -2,7 +2,7 @@
|
|
|
<view class="active-detail">
|
|
|
<!-- 背景图 -->
|
|
|
<view class="active-detail-img">
|
|
|
- <image style="width: 100%; height: 720rpx;" src="http://t9.9026.com/imgs/swiper01.png" mode=""></image>
|
|
|
+ <image style="width: 100%; height: 720rpx;" :src="activeDeatil.banners" mode=""></image>
|
|
|
</view>
|
|
|
|
|
|
<!--投票数 -->
|
| xqd
@@ -12,6 +12,15 @@
|
|
|
<text style="width: 80rpx; height: 2rpx; background-color: rgba(204, 204, 204, .7); "></text>
|
|
|
<view class="vote-detail-top-main">
|
|
|
<text>距活动结束:</text>
|
|
|
+ <view class="time">
|
|
|
+ <text>还剩</text>
|
|
|
+ <view class="shijian">{{countdownh}}</view>
|
|
|
+ <text>时</text>
|
|
|
+ <view class="shijian">{{countdownm}}</view>
|
|
|
+ <text>分</text>
|
|
|
+ <view class="shijian">{{countdowns}}</view>
|
|
|
+ <text>秒</text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<text style="width: 80rpx; height: 2rpx; background-color: rgba(204, 204, 204, .7); "></text>
|
|
|
</view>
|
| xqd
@@ -85,7 +94,8 @@
|
|
|
<view class="ListItem" v-for="item in voteList" @click="activeDetail">
|
|
|
<image src="http://t9.9026.com/imgs/Kudosbg.png" style="width: 640rpx;height:420rpx;"></image>
|
|
|
<view class="kudosicon" :style="{backgroundImage:'url('+hotelImageUrl+')'}">
|
|
|
- <text style="width: 36rpx;height: 52rpx; display: flex;align-items: center;justify-content: center;color: #FFF;font-size: 24rpx;font-weight: bold; ">{{item.rank}}</text>
|
|
|
+ <text
|
|
|
+ style="width: 36rpx;height: 52rpx; display: flex;align-items: center;justify-content: center;color: #FFF;font-size: 24rpx;font-weight: bold; ">{{item.rank}}</text>
|
|
|
</view>
|
|
|
<view class="nav">
|
|
|
<view class="events">
|
| xqd
@@ -95,13 +105,13 @@
|
|
|
<text>{{item.ticket_num}}票</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="foot" @click.stop="goVoteDetail(item.activity_id)">
|
|
|
+ <view class="foot" @click.stop="goVoteDetail(item.id)">
|
|
|
<text>投票</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <view class="rank-detail" :style="{backgroundImage:'url('+backImageUrl+')'}" v-if="isActive==1">
|
|
|
+ <view class="rank-detail" :style="{backgroundImage:'url('+backImageUrl+')'}" v-if="isActive==1">
|
|
|
<view class="rank-detail-rank">
|
|
|
<image style="width: 92rpx; height: 92rpx; border-radius: 50%; " src="/static/icon/avatar.png" mode="">
|
|
|
</image>
|
| xqd
@@ -180,11 +190,13 @@
|
|
|
<text>点击加入会员可多3次机会</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 分割线 -->
|
|
|
- <view style="width: 94%; height: 2rpx; background-color:rgba(240, 240, 240, .7);margin: 64rpx auto 80rpx; "></view>
|
|
|
+ <view
|
|
|
+ style="width: 94%; height: 2rpx; background-color:rgba(240, 240, 240, .7);margin: 64rpx auto 80rpx; ">
|
|
|
+ </view>
|
|
|
<view class=" introduce-top">
|
|
|
<text class="introduce-top-rule1"></text>
|
|
|
<text style="margin-right: 8rpx; margin-left: 12rpx; ">活动介绍</text>
|
| xqd
@@ -193,15 +205,15 @@
|
|
|
<view class="introduce-btn-text">
|
|
|
<text>由中国最佳酒店评选委员会、洲际酒店共同打造的国内</text>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 声明 -->
|
|
|
<view class="introduce-btn">
|
|
|
<text>活动声明</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 触底 -->
|
|
|
- <view class="home-bottom" v-if="isActive==0" >
|
|
|
- <uni-load-more :status="status" color="#CCCCCC" :content-text="contentText"/>
|
|
|
+ <view class="home-bottom" v-if="isActive==0">
|
|
|
+ <uni-load-more :status="status" color="#CCCCCC" :content-text="contentText" />
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
| xqd
@@ -211,14 +223,21 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ //活动结束倒计时
|
|
|
+ endTime:'',
|
|
|
+ countdownh: '',
|
|
|
+ countdownm: '',
|
|
|
+ countdowns: '',
|
|
|
+ timer: null, //重复执行
|
|
|
+
|
|
|
// 搜索
|
|
|
- search:'',
|
|
|
+ search: '',
|
|
|
// 活动id
|
|
|
- id:'',
|
|
|
+ id: '',
|
|
|
// 活动详情
|
|
|
- activeDeatil:'',
|
|
|
+ activeDeatil: '',
|
|
|
// 投票列表
|
|
|
- voteList:[],
|
|
|
+ voteList: [],
|
|
|
//酒店排名背景图片
|
|
|
hotelImageUrl: require('../../../static/icon/tip01.png'),
|
|
|
//排行榜背景图片
|
| xqd
@@ -253,69 +272,96 @@
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- onLoad(op) {
|
|
|
- this.id=op.id
|
|
|
- this.getList(op.id)
|
|
|
- this.getActiveDetail(op.id)
|
|
|
- this.getCategoryList(op.id)
|
|
|
+ onLoad(o) {
|
|
|
+ this.id = o.id
|
|
|
+ this.getList(o.id)
|
|
|
+ this.getActiveDetail(o.id)
|
|
|
+ this.getCategoryList(o.id)
|
|
|
},
|
|
|
methods: {
|
|
|
+ showtime(time) {
|
|
|
+ var nowtime = new Date(), //获取当前时间
|
|
|
+ // endtime = new Date("2021/12/10"); //定义结束时间
|
|
|
+ endtime = new Date(time); //定义结束时间
|
|
|
+ var lefttime = endtime.getTime() - nowtime.getTime(), //距离结束时间的毫秒数
|
|
|
+ leftd = Math.floor(lefttime / (1000 * 60 * 60 * 24)), //计算天数
|
|
|
+ lefth = Math.floor((lefttime / (1000 * 60 * 60) % 24) + leftd * 24) < 10 ? "0" + Math.floor((lefttime /
|
|
|
+ (1000 * 60 * 60) % 24) + leftd * 24) : Math.floor((lefttime / (1000 * 60 * 60) % 24) + leftd *
|
|
|
+ 24), //计算小时数
|
|
|
+ leftm = Math.floor(lefttime / (1000 * 60) % 60) < 10 ? "0" + Math.floor(lefttime / (1000 * 60) % 60) :
|
|
|
+ Math.floor(lefttime / (1000 * 60) % 60), //计算分钟数
|
|
|
+ lefts = Math.floor(lefttime / 1000 % 60) < 10 ? "0" + Math.floor(lefttime / 1000 % 60) : Math.floor(
|
|
|
+ lefttime / 1000 % 60); //计算秒数
|
|
|
+ this.countdownh = lefth //返回倒计时的字符串
|
|
|
+ this.countdownm = leftm //返回倒计时的字符串
|
|
|
+ this.countdowns = lefts //返回倒计时的字符串
|
|
|
+ // 倒计时结束时,显示00:00:00
|
|
|
+ if (lefttime < 0) {
|
|
|
+ this.countdownh = this.countdownm = this.countdowns = "00"
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
// 获取活动项目列表
|
|
|
- getList(id){
|
|
|
+ getList(id) {
|
|
|
this.$api.active.getActiveProjectList({
|
|
|
- activity_id:id,
|
|
|
- page:1,
|
|
|
- }).then(res=>{
|
|
|
- console.log(res,"活动项目列表")
|
|
|
- if(res.code==0){
|
|
|
- this.voteList=res.data.data
|
|
|
+ activity_id: id,
|
|
|
+ page: 1,
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, "活动项目列表")
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.voteList = res.data.data
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
// 获取活动详情
|
|
|
- getActiveDetail(id){
|
|
|
+ getActiveDetail(id) {
|
|
|
this.$api.active.getActiveDetail({
|
|
|
- activity_id:id
|
|
|
- }).then(res=>{
|
|
|
- console.log(res,"活动详情")
|
|
|
- if(res.code==0){
|
|
|
- this.activeDeatil=res.data
|
|
|
+ activity_id: id
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, "活动详情")
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.activeDeatil = res.data
|
|
|
+ this.endTime = res.data.end_time
|
|
|
+ this.timer = setInterval(() => {
|
|
|
+ this.showtime(this.endTime)
|
|
|
+ })
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
// 获取活动投票项分类
|
|
|
- getCategoryList(id){
|
|
|
+ getCategoryList(id) {
|
|
|
this.$api.category.getCategoryList({
|
|
|
- page:1,
|
|
|
- type:3,
|
|
|
- activity_id:id
|
|
|
- }).then(res=>{
|
|
|
- console.log(res,"活动投票项分类")
|
|
|
- if(res.code==0){
|
|
|
+ page: 1,
|
|
|
+ type: 3,
|
|
|
+ activity_id: id
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, "活动投票项分类")
|
|
|
+ if (res.code == 0) {
|
|
|
// this.areaList=res.data.data
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
//购票详情
|
|
|
- goVoteDetail(id){
|
|
|
+ goVoteDetail(id) {
|
|
|
+ console.log(id,'--->id')
|
|
|
uni.navigateTo({
|
|
|
- url:'/pages/index/vote-detail/index?id='+id
|
|
|
+ url: '/pages/index/vote-detail/index?id=' + id
|
|
|
})
|
|
|
},
|
|
|
// 搜索防抖
|
|
|
- searchText:util.debounce(function(){
|
|
|
+ searchText: util.debounce(function() {
|
|
|
this.goSearch()
|
|
|
- },1000),
|
|
|
+ }, 1000),
|
|
|
// 搜索
|
|
|
- goSearch(){
|
|
|
+ goSearch() {
|
|
|
this.$api.active.getActiveProjectList({
|
|
|
- activity_id:this.id,
|
|
|
- page:1,
|
|
|
- keyword:this.search
|
|
|
- }).then(res=>{
|
|
|
- console.log(res,"搜索活动项目列表")
|
|
|
- if(res.code==0){
|
|
|
- this.voteList=res.data.data
|
|
|
+ activity_id: this.id,
|
|
|
+ page: 1,
|
|
|
+ keyword: this.search
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, "搜索活动项目列表")
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.voteList = res.data.data
|
|
|
}
|
|
|
})
|
|
|
},
|
| xqd
@@ -345,6 +391,7 @@
|
|
|
height: 100%;
|
|
|
background: #F9F9F9;
|
|
|
}
|
|
|
+
|
|
|
.home-bottom {
|
|
|
background-color: #fff;
|
|
|
padding-bottom: 84rpx;
|
| xqd
@@ -363,8 +410,9 @@
|
|
|
::v-deep .u-input__content__field-wrapper {
|
|
|
padding-left: 36rpx;
|
|
|
}
|
|
|
- ::v-deep .u-input__content__field-wrapper__field{
|
|
|
- color:#999999 !important;
|
|
|
+
|
|
|
+ ::v-deep .u-input__content__field-wrapper__field {
|
|
|
+ color: #999999 !important;
|
|
|
font-size: 28rpx !important;
|
|
|
}
|
|
|
}
|
| xqd
@@ -386,31 +434,37 @@
|
|
|
font-size: 32rpx;
|
|
|
font-weight: bold;
|
|
|
letter-spacing: 2rpx;
|
|
|
+
|
|
|
.introduce-top-rule1 {
|
|
|
width: 56rpx;
|
|
|
height: 4rpx;
|
|
|
background: linear-gradient(90deg, #FFFFFF 0%, #D9A94D 100%);
|
|
|
}
|
|
|
+
|
|
|
.introduce-top-rule2 {
|
|
|
width: 56rpx;
|
|
|
height: 4rpx;
|
|
|
background: linear-gradient(-90deg, #FFFFFF 0%, #D9A94D 100%);
|
|
|
}
|
|
|
}
|
|
|
- .introduce-main{
|
|
|
+
|
|
|
+ .introduce-main {
|
|
|
margin-top: 46rpx;
|
|
|
padding: 0 30rpx;
|
|
|
font-size: 28rpx;
|
|
|
font-weight: bold;
|
|
|
color: #333;
|
|
|
- .introduce-main-start{
|
|
|
+
|
|
|
+ .introduce-main-start {
|
|
|
margin-bottom: 24rpx;
|
|
|
}
|
|
|
- .introduce-main-rule{
|
|
|
+
|
|
|
+ .introduce-main-rule {
|
|
|
display: flex;
|
|
|
align-items: flex-start;
|
|
|
justify-content: flex-start;
|
|
|
- .introduce-main-rule-left{
|
|
|
+
|
|
|
+ .introduce-main-rule-left {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: flex-start;
|
| xqd
@@ -419,7 +473,8 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .introduce-btn-text{
|
|
|
+
|
|
|
+ .introduce-btn-text {
|
|
|
padding: 0 30rpx;
|
|
|
margin-top: 40rpx;
|
|
|
text-indent: 2em;
|
| xqd
@@ -428,7 +483,8 @@
|
|
|
font-weight: bold;
|
|
|
line-height: 56rpx;
|
|
|
}
|
|
|
- .introduce-btn{
|
|
|
+
|
|
|
+ .introduce-btn {
|
|
|
margin-top: 72rpx;
|
|
|
padding-bottom: 80rpx;
|
|
|
width: 100%;
|
| xqd
@@ -562,6 +618,15 @@
|
|
|
margin-left: 20rpx;
|
|
|
color: #333;
|
|
|
font-size: 28rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+
|
|
|
+ .time {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
| xqd
@@ -735,10 +800,10 @@
|
|
|
|
|
|
.kudosicon {
|
|
|
background-repeat: no-repeat;
|
|
|
- background-size:36rpx 52rpx;
|
|
|
+ background-size: 36rpx 52rpx;
|
|
|
position: absolute;
|
|
|
top: 20rpx;
|
|
|
- left:60rpx;
|
|
|
+ left: 60rpx;
|
|
|
|
|
|
@include flexlayout() image {
|
|
|
width: 32rpx;
|