150 lines
4.0 KiB
Vue
150 lines
4.0 KiB
Vue
<template>
|
|
<!-- 拼团详情 -->
|
|
<view class="doing" v-if="processItem.length">
|
|
<view class="rd-14rpx bg--w111-fff mt-20 p-24">
|
|
<view class="flex fs-24 notice pb-24 border-bottom mb-38">
|
|
<image class="laba" src="../../static/images/laba.png" mode=""></image>
|
|
<text class="text-red">已拼{{groupBuyActivityResponse.latestBuyCount||0}}件</text>
|
|
<text v-if="groupBuyActivityResponse.groupBuyUserActivityDoneList">丨</text>
|
|
<view class='swiper'>
|
|
<swiper :indicator-dots="false" autoplay interval="2500" duration="500" vertical="true"
|
|
circular="true">
|
|
<block v-for="(item,index) in groupBuyActivityResponse.groupBuyUserActivityDoneList"
|
|
:key='index'>
|
|
<swiper-item>
|
|
<view class='line1'>{{item.groupNickname}}拼团成功</view>
|
|
</swiper-item>
|
|
</block>
|
|
</swiper>
|
|
</view>
|
|
</view>
|
|
<!-- <swiper :indicator-dots="false" display-multiple-items="5" autoplay interval="2500" duration="1000" vertical="true"
|
|
circular="true">
|
|
<swiper-item class="flex-between-center swiper-item-box" v-for='(item,index) in processItem' :key='index'>
|
|
<block class="swiper-item">
|
|
<view class="flex-1 flex-y-center swiper-doing">
|
|
<image :src='item.orderDoneUserImages[0].groupAvatar' class="w-64 h-64 rd-50-p111-"></image>
|
|
<view class="flex-y-center fs-26 pl-24">
|
|
<text>还差 <text class="text-red">{{item.needSomeTogetherCount}}</text>人,</text>
|
|
<text class="pl-8">还剩</text>
|
|
<text class="time-box">
|
|
<count-down :is-day="false" tip-text=" " day-text="" :hour-text="' : '" :minute-text="' : '"
|
|
second-text=" " colors="#333" dotColor="#333" :datatime="item.recordEndTime|dataTime"
|
|
:bgColor="bgColor" :isBg="true">
|
|
</count-down>
|
|
</text>
|
|
</view>
|
|
</view>
|
|
<view class="w-120 h-56 rd-30rpx bg-red flex-center text--w111-fff fs-24 "
|
|
@click="$emit('toGroup',item.orderDoneUserImages[0].groupRecordId)">去拼团</view>
|
|
</block>
|
|
</swiper-item>
|
|
</swiper> -->
|
|
<view class="flex-between-center pink-cell" v-for='(item,index) in processItem' :key='index'
|
|
v-if="index < 5">
|
|
<view class="flex-1 flex-y-center">
|
|
<image :src='item.orderDoneUserImages[0].groupAvatar' class="w-64 h-64 rd-50-p111-"></image>
|
|
<view class="flex-y-center fs-26 pl-24">
|
|
<text>还差 <text class="text-red">{{item.needSomeTogetherCount}}</text>人,</text>
|
|
<text class="pl-8">还剩</text>
|
|
<view class="time-box">
|
|
<countDown :is-day="true" :tip-text="' '" :day-text="' : '" :hour-text="' : '"
|
|
:minute-text="' : '" :second-text="' '" :isCol="false" :datatime="item.recordEndTime|dataTime"
|
|
:bgColor="bgColor" :isBg="true">
|
|
</countDown>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="w-120 h-56 rd-30rpx bg-red flex-center text--w111-fff fs-24"
|
|
@click="$emit('toGroup',item.orderDoneUserImages[0].groupRecordId)">去拼团</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import countDown from "@/components/countDown";
|
|
export default {
|
|
components: {
|
|
countDown,
|
|
},
|
|
props: {
|
|
processItem: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
groupBuyActivityResponse: {
|
|
type: Object,
|
|
default: () => {},
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
bgColor: {
|
|
'bgColor': '#fff',
|
|
'Color': '',
|
|
'width': '36rpx',
|
|
'timeTxtwidth': '6rpx',
|
|
'isDay': true,
|
|
'txtColor': '#999'
|
|
},
|
|
}
|
|
},
|
|
created() {
|
|
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.doing {
|
|
padding: 0 26rpx;
|
|
margin: 22rpx 0;
|
|
}
|
|
|
|
.notice .swiper {
|
|
width: 360rpx;
|
|
overflow: hidden;
|
|
margin-left: 8rpx;
|
|
}
|
|
|
|
.notice .swiper swiper {
|
|
height: 30rpx;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
font-size: 24rpx;
|
|
color: #282828;
|
|
}
|
|
|
|
.border-bottom {
|
|
border-bottom: 1rpx solid #eee;
|
|
}
|
|
|
|
.text-red {
|
|
color: #e93323;
|
|
}
|
|
|
|
.pink-cell~.pink-cell {
|
|
margin-top: 64rpx;
|
|
}
|
|
|
|
.time-box {
|
|
margin-top: 2rpx;
|
|
}
|
|
|
|
.laba {
|
|
width: 46rpx;
|
|
height: 40rpx;
|
|
}
|
|
|
|
/deep/.swiper-item {
|
|
height: 100rpx !important;
|
|
}
|
|
|
|
.swiper-item-box {
|
|
height: auto !important;
|
|
}
|
|
</style> |