<template>
|
<view>
|
|
<view class="coreshop-padding-10 coreshop-margin-10 coreshop-bg-white coreshop-border-radius-tr-24 coreshop-border-radius-bl-24" v-if="listData && count">
|
|
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-between coreshop-min-height-30">
|
<view class="coreshop-font-16 coreshop-text-black coreshop-font-weight-bold">{{coreshopdata.parameters.title}}</view>
|
<u-icon name="arrow-right-double" size="12" label="查看更多" labelSize="12" labelPos="left" @tap="goServicesList()"></u-icon>
|
</view>
|
<view class="coreshop-divider">
|
<view class="left"></view>
|
<text class="dot">●</text>
|
<view class="right"></view>
|
</view>
|
|
<view class="img-list-item coreshop-flex-direction-row coreshop-margin-bottom-10 bg-main coreshop-text-black" v-for="(item, key) in listData" :key="key" @click="goServicesDetail(item.id)">
|
<view class="img-list-item-l">
|
<u--image :src="item.thumbnail" :index="item.id" width="100px" height="100px"></u--image>
|
</view>
|
<view class="img-list-item-r">
|
<view class="coreshop-font-14 coreshop-text-bold u-line-1 title">{{item.title}}</view>
|
<view class="coreshop-font-12 u-line-2 coreshop-margin-top-10 coreshop-margin-bottom-10">{{item.description}}</view>
|
<view class="item-c coreshop-flex coreshop-justify-between">
|
<view class="red-price coreshop-justify-between">
|
￥{{item.money}}
|
</view>
|
<!--<u-count-down :time="item.lastTime" format="HH:mm:ss"></u-count-down>-->
|
<view class="coreshop-text-right coreshop-time-right" v-if="item.openStatus == 1 && item.lastTime > 0">
|
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
|
<view class="time coreshop-font-11">
|
<view class="coreshop-font-12">仅剩：</view>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.days }}</text>
|
</view>
|
<text class="time__doc">天</text>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.hours>10?item.timeData.hours:'0'+item.timeData.hours}}</text>
|
</view>
|
<text class="time__doc">:</text>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
|
</view>
|
<text class="time__doc">:</text>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
|
</view>
|
</view>
|
</u-count-down>
|
</view>
|
<view class="coreshop-text-right coreshop-time-right" v-if="item.openStatus == 2 && item.lastTime > 0">
|
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
|
<view class="time">
|
<view class="coreshop-font-12">即将开始：</view>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.days }}</text>
|
</view>
|
<text class="time__doc">天</text>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.hours>10?item.timeData.hours:'0'+item.timeData.hours}}</text>
|
</view>
|
<text class="time__doc">:</text>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
|
</view>
|
<text class="time__doc">:</text>
|
<view class="time__custom">
|
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
|
</view>
|
</view>
|
</u-count-down>
|
</view>
|
<view class="coreshop-font-12 red-price" v-if="item.openStatus == 3">已结束</view>
|
|
<!--<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-between">
|
<view class="coreshop-font-12 red-price" v-if="item.status == 3">已结束</view>
|
<view class="coreshop-font-12 red-price" v-if="item.status == 2">即将开始</view>
|
<u-icon name="shopping-cart" color="#2979ff" size="25" class="btnCart"></u-icon>
|
</view>-->
|
</view>
|
</view>
|
</view>
|
|
</view>
|
</view>
|
|
</template>
|
|
<script>
|
export default {
|
name: "coreshopservice",
|
data() {
|
return {
|
listData: [],
|
}
|
},
|
props: {
|
coreshopdata: {
|
// type: Array,
|
required: false,
|
}
|
},
|
mounted() {
|
this.listData = uni.$u.deepClone(this.coreshopdata.parameters.list);
|
},
|
computed: {
|
count() {
|
return (this.listData.length > 0)
|
}
|
},
|
methods: {
|
onChange(e, key) {
|
//this.item.timeData = uni.$u.deepClone(e);
|
this.$set(this.listData[key], 'timeData', e)
|
// this.$forceUpdate();
|
},
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.img-list-item { position: relative; overflow: hidden;
|
.img-list-item-l { width: 100px; height: 100px; display: inline-block; float: left; }
|
.img-list-item-r { width: calc(100% - 120px); display: inline-block; margin-left: 7.5px; float: left; position: relative;
|
.title { line-height: 24px; }
|
.item-c { width: 100%; margin-top: 0;
|
.red-price { color: #FF7159 !important; }
|
.btnCart { float: right; }
|
}
|
}
|
}
|
|
.time { display: flex; align-items: center;
|
.time__custom { min-width: 18px; height: 18px; background-color: #3c9cff; border-radius: 4px; display: flex; justify-content: center; align-items: center;
|
.time__custom__item { color: #fff; font-size: 10px; text-align: center; }
|
}
|
}
|
</style>
|
