100 lines
2.7 KiB
Vue
100 lines
2.7 KiB
Vue
<template>
|
||
<su-fixed bottom placeholder :val="44">
|
||
<view>
|
||
<view v-for="activity in props.activityList" :key="activity.id">
|
||
<!-- TODO 芋艿：拼团 -->
|
||
<view
|
||
class="activity-box ss-p-x-38 ss-flex ss-row-between ss-col-center"
|
||
:class="activity.type === 1 ? 'seckill-box' : 'groupon-box'"
|
||
>
|
||
<view class="activity-title ss-flex">
|
||
<view class="ss-m-r-16">
|
||
<image
|
||
v-if="activity.type === 1"
|
||
:src="sheep.$url.static('/static/img/shop/goods/seckill-icon.png')"
|
||
class="activity-icon"
|
||
/>
|
||
<!-- TODO 芋艿：拼团 -->
|
||
<image
|
||
v-else-if="activity.type === 3"
|
||
:src="sheep.$url.static('/static/img/shop/goods/groupon-icon.png')"
|
||
class="activity-icon"
|
||
/>
|
||
</view>
|
||
<view>该商品正在参与{{ activity.name }}活动</view>
|
||
</view>
|
||
<button class="ss-reset-button activity-go" @tap="onActivity(activity)"> GO </button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</su-fixed>
|
||
</template>
|
||
|
||
<script setup>
|
||
import sheep from '@/sheep';
|
||
|
||
// TODO 芋艿：这里要迁移下；
|
||
const seckillBg = sheep.$url.css('/static/img/shop/goods/seckill-tip-bg.png');
|
||
const grouponBg = sheep.$url.css('/static/img/shop/goods/groupon-tip-bg.png');
|
||
|
||
const props = defineProps({
|
||
activityList: {
|
||
type: Array,
|
||
default() {
|
||
return [];
|
||
},
|
||
},
|
||
});
|
||
|
||
function onActivity(activity) {
|
||
const type = activity.type;
|
||
const typePath = type === 1 ? 'seckill' : type === 2 ? 'TODO 拼团' : 'groupon';
|
||
sheep.$router.go(`/pages/goods/${typePath}`, {
|
||
id: activity.id,
|
||
});
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.activity-box {
|
||
width: 100%;
|
||
height: 80rpx;
|
||
box-sizing: border-box;
|
||
margin-bottom: 10rpx;
|
||
|
||
.activity-title {
|
||
font-size: 26rpx;
|
||
font-weight: 500;
|
||
color: #ffffff;
|
||
line-height: 42rpx;
|
||
|
||
.activity-icon {
|
||
width: 38rpx;
|
||
height: 38rpx;
|
||
}
|
||
}
|
||
|
||
.activity-go {
|
||
width: 70rpx;
|
||
height: 32rpx;
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
font-weight: 500;
|
||
color: #ff6000;
|
||
font-size: 24rpx;
|
||
line-height: normal;
|
||
}
|
||
}
|
||
|
||
//秒杀卡片
|
||
.seckill-box {
|
||
background: url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/0796100444273e747b7afc5778081bf8a1f8373707822cccc272cc205e7ad0f3.png') no-repeat;
|
||
background-size: 100% 100%;
|
||
}
|
||
|
||
.groupon-box {
|
||
background: url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/0796100444273e747b7afc5778081bf8a1f8373707822cccc272cc205e7ad0f3.png') no-repeat;
|
||
background-size: 100% 100%;
|
||
}
|
||
</style>
|