【代码优化】差满减活动时间外,from 岳琳红 26a18e7e9a

pull/102/MERGE
YunaiV 2024-09-16 08:18:32 +08:00
parent e93322959e
commit 5a66e71809
2 changed files with 80 additions and 69 deletions

View File

@ -57,7 +57,6 @@
<view>优惠券类型</view> <view>优惠券类型</view>
<view>{{ state.coupon.discountType === 1 ? '满减券' : '折扣券' }}</view> <view>{{ state.coupon.discountType === 1 ? '满减券' : '折扣券' }}</view>
</view> </view>
<!-- TODO 芋艿可优化增加优惠劵的描述 -->
<uni-collapse> <uni-collapse>
<uni-collapse-item title="优惠券说明" v-if="state.coupon.description"> <uni-collapse-item title="优惠券说明" v-if="state.coupon.description">
<view class="content ss-p-b-20"> <view class="content ss-p-b-20">

View File

@ -6,13 +6,26 @@
<!-- 骨架屏 --> <!-- 骨架屏 -->
<detailSkeleton v-if="state.skeletonLoading" /> <detailSkeleton v-if="state.skeletonLoading" />
<!-- 下架/售罄提醒 --> <!-- 下架/售罄提醒 -->
<s-empty v-else-if="state.goodsInfo === null || state.goodsInfo.activity_type !== 'seckill'" text="活动不存在或已结束" <s-empty
icon="/static/soldout-empty.png" showAction actionText="再逛逛" actionUrl="/pages/goods/list" /> v-else-if="state.goodsInfo === null || state.goodsInfo.activity_type !== 'seckill'"
text="活动不存在或已结束"
icon="/static/soldout-empty.png"
showAction
actionText="再逛逛"
actionUrl="/pages/goods/list"
/>
<block v-else> <block v-else>
<view class="detail-swiper-selector"> <view class="detail-swiper-selector">
<!-- 商品图轮播 --> <!-- 商品图轮播 -->
<su-swiper class="ss-m-b-14" isPreview :list="state.goodsSwiper" dotStyle="tag" imageMode="widthFix" <su-swiper
dotCur="bg-mask-40" :seizeHeight="750" /> class="ss-m-b-14"
isPreview
:list="state.goodsSwiper"
dotStyle="tag"
imageMode="widthFix"
dotCur="bg-mask-40"
:seizeHeight="750"
/>
<!-- 价格+标题 --> <!-- 价格+标题 -->
<view class="title-card ss-m-y-14 ss-m-x-20 ss-p-x-20 ss-p-y-34"> <view class="title-card ss-m-y-14 ss-m-x-20 ss-p-x-20 ss-p-y-34">
@ -59,9 +72,14 @@
<detail-cell-sku :sku="state.selectedSku" @tap="state.showSelectSku = true" /> <detail-cell-sku :sku="state.selectedSku" @tap="state.showSelectSku = true" />
</view> </view>
<!-- 规格与数量弹框 --> <!-- 规格与数量弹框 -->
<s-select-seckill-sku v-model="state.goodsInfo" :show="state.showSelectSku" <s-select-seckill-sku
:single-limit-count="activity.singleLimitCount" @buy="onBuy" @change="onSkuChange" v-model="state.goodsInfo"
@close="state.showSelectSku = false" /> :show="state.showSelectSku"
:single-limit-count="activity.singleLimitCount"
@buy="onBuy"
@change="onSkuChange"
@close="state.showSelectSku = false"
/>
</view> </view>
<!-- 评价 --> <!-- 评价 -->
@ -73,25 +91,36 @@
<detail-tabbar v-model="state.goodsInfo"> <detail-tabbar v-model="state.goodsInfo">
<!-- TODO: 缺货中 已售罄 判断 设计--> <!-- TODO: 缺货中 已售罄 判断 设计-->
<view class="buy-box ss-flex ss-col-center ss-p-r-20"> <view class="buy-box ss-flex ss-col-center ss-p-r-20">
<button class="ss-reset-button origin-price-btn ss-flex-col" v-if="state.goodsInfo.marketPrice" <button
@tap="sheep.$router.go('/pages/goods/index', { id: state.goodsInfo.id })"> class="ss-reset-button origin-price-btn ss-flex-col"
v-if="state.goodsInfo.marketPrice"
@tap="sheep.$router.go('/pages/goods/index', { id: state.goodsInfo.id })"
>
<view> <view>
<view class="btn-price">{{ fen2yuan(state.goodsInfo.marketPrice) }}</view> <view class="btn-price">{{ fen2yuan(state.goodsInfo.marketPrice) }}</view>
<view>原价购买</view> <view>原价购买</view>
</view> </view>
</button> </button>
<button v-else class="ss-reset-button origin-price-btn ss-flex-col"> <button v-else class="ss-reset-button origin-price-btn ss-flex-col">
<view class="no-original" :class=" <view
class="no-original"
:class="
state.goodsInfo.stock === 0 || timeStatusEnum !== TimeStatusEnum.STARTED ? '' : '' state.goodsInfo.stock === 0 || timeStatusEnum !== TimeStatusEnum.STARTED ? '' : ''
"> "
>
秒杀价 秒杀价
</view> </view>
</button> </button>
<button class="ss-reset-button btn-box ss-flex-col" @tap="state.showSelectSku = true" :class=" <button
class="ss-reset-button btn-box ss-flex-col"
@tap="state.showSelectSku = true"
:class="
timeStatusEnum === TimeStatusEnum.STARTED && state.goodsInfo.stock != 0 timeStatusEnum === TimeStatusEnum.STARTED && state.goodsInfo.stock != 0
? 'check-btn-box' ? 'check-btn-box'
: 'disabled-btn-box' : 'disabled-btn-box'
" :disabled="state.goodsInfo.stock === 0 || timeStatusEnum !== TimeStatusEnum.STARTED"> "
:disabled="state.goodsInfo.stock === 0 || timeStatusEnum !== TimeStatusEnum.STARTED"
>
<view class="btn-price">{{ fen2yuan(state.goodsInfo.price) }}</view> <view class="btn-price">{{ fen2yuan(state.goodsInfo.price) }}</view>
<view v-if="timeStatusEnum === TimeStatusEnum.STARTED"> <view v-if="timeStatusEnum === TimeStatusEnum.STARTED">
<view v-if="state.goodsInfo.stock === 0"></view> <view v-if="state.goodsInfo.stock === 0"></view>
@ -106,26 +135,11 @@
</template> </template>
<script setup> <script setup>
import { import { reactive, computed, ref, unref } from 'vue';
reactive, import { onLoad, onPageScroll } from '@dcloudio/uni-app';
computed,
ref,
unref
} from 'vue';
import {
onLoad,
onPageScroll
} from '@dcloudio/uni-app';
import sheep from '@/sheep'; import sheep from '@/sheep';
import { import { isEmpty, min } from 'lodash-es';
isEmpty, import { useDurationTime, formatGoodsSwiper, fen2yuan } from '@/sheep/hooks/useGoods';
min
} from 'lodash-es';
import {
useDurationTime,
formatGoodsSwiper,
fen2yuan
} from '@/sheep/hooks/useGoods';
import detailNavbar from './components/detail/detail-navbar.vue'; import detailNavbar from './components/detail/detail-navbar.vue';
import detailCellSku from './components/detail/detail-cell-sku.vue'; import detailCellSku from './components/detail/detail-cell-sku.vue';
import detailTabbar from './components/detail/detail-tabbar.vue'; import detailTabbar from './components/detail/detail-tabbar.vue';
@ -135,10 +149,7 @@
import detailProgress from './components/detail/detail-progress.vue'; import detailProgress from './components/detail/detail-progress.vue';
import SeckillApi from '@/sheep/api/promotion/seckill'; import SeckillApi from '@/sheep/api/promotion/seckill';
import SpuApi from '@/sheep/api/product/spu'; import SpuApi from '@/sheep/api/product/spu';
import { import { getTimeStatusEnum, TimeStatusEnum } from '@/sheep/util/const';
getTimeStatusEnum,
TimeStatusEnum
} from '@/sheep/util/const';
const headerBg = sheep.$url.css('/static/img/shop/goods/seckill-bg.png'); const headerBg = sheep.$url.css('/static/img/shop/goods/seckill-bg.png');
const btnBg = sheep.$url.css('/static/img/shop/goods/seckill-btn.png'); const btnBg = sheep.$url.css('/static/img/shop/goods/seckill-btn.png');
@ -175,10 +186,12 @@
order_type: 'goods', order_type: 'goods',
buy_type: 'seckill', buy_type: 'seckill',
seckillActivityId: activity.value.id, seckillActivityId: activity.value.id,
items: [{ items: [
{
skuId: sku.id, skuId: sku.id,
count: sku.count, count: sku.count,
}, ], },
],
}), }),
}); });
} }
@ -186,20 +199,23 @@
// //
const shareInfo = computed(() => { const shareInfo = computed(() => {
if (isEmpty(unref(activity))) return {}; if (isEmpty(unref(activity))) return {};
return sheep.$platform.share.getShareInfo({ return sheep.$platform.share.getShareInfo(
{
title: activity.value.name, title: activity.value.name,
image: sheep.$url.cdn(state.goodsInfo.picUrl), image: sheep.$url.cdn(state.goodsInfo.picUrl),
params: { params: {
page: '4', page: '4',
query: activity.value.id, query: activity.value.id,
}, },
}, { },
{
type: 'goods', // type: 'goods', //
title: activity.value.name, // title: activity.value.name, //
image: sheep.$url.cdn(state.goodsInfo.picUrl), // image: sheep.$url.cdn(state.goodsInfo.picUrl), //
price: state.goodsInfo.price, // price: state.goodsInfo.price, //
marketPrice: state.goodsInfo.marketPrice, // marketPrice: state.goodsInfo.marketPrice, //
}, ); },
);
}); });
const activity = ref(); const activity = ref();
@ -207,21 +223,17 @@
// //
const getActivity = async (id) => { const getActivity = async (id) => {
const { const { data } = await SeckillApi.getSeckillActivity(id);
data
} = await SeckillApi.getSeckillActivity(id);
activity.value = data; activity.value = data;
timeStatusEnum.value = getTimeStatusEnum(activity.value.startTime, activity.value.endTime); timeStatusEnum.value = getTimeStatusEnum(activity.value.startTime, activity.value.endTime);
state.percent = 100 - data.stock / data.totalStock * 100; state.percent = 100 - (data.stock / data.totalStock) * 100;
// //
await getSpu(data.spuId); await getSpu(data.spuId);
}; };
// //
const getSpu = async (id) => { const getSpu = async (id) => {
const { const { data } = await SpuApi.getSpuDetail(id);
data
} = await SpuApi.getSpuDetail(id);
data.activity_type = 'seckill'; data.activity_type = 'seckill';
state.goodsInfo = data; state.goodsInfo = data;
// //