【功能完善】商品列表，增加满减送提示（优化）
YunaiV
parent
9df0194aeb
commit
ff6769001d
|
|
@ -60,12 +60,14 @@
|
|||
</s-layout>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive, toRaw, ref } from 'vue';
|
||||
import { reactive } from 'vue';
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import _ from 'lodash-es';
|
||||
import RewardActivityApi from '@/sheep/api/promotion/rewardActivity';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
import { appendSettlementProduct } from '@/sheep/hooks/useGoods';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
|
||||
const state = reactive({
|
||||
activityId: 0, // 获得编号
|
||||
|
|
@ -105,128 +107,36 @@
|
|||
|
||||
// 加载商品信息
|
||||
async function getList() {
|
||||
// state.loadStatus = 'loading';
|
||||
// 处理拓展参数
|
||||
const params = {};
|
||||
if (state.activityInfo.productScope === 2) {
|
||||
// const params = toRaw(state.activityInfo.productScopeValues)
|
||||
// 请求数据
|
||||
const { code, data } = await SpuApi.getSpuListByIds(
|
||||
state.activityInfo.productScopeValues.join(','),
|
||||
);
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
// 使用 map 提取每个对象的 id 属性
|
||||
const ids = data.map((item) => item.id);
|
||||
// 使用 join 方法将 id 数组连接成一个用逗号分隔的字符串
|
||||
const idsString = ids.join(',');
|
||||
// 获取结算信息
|
||||
settleData.value = await getSettlementByIds(idsString);
|
||||
// 处理获得的数据
|
||||
const ms = enrichDataWithSkus(data, settleData.value);
|
||||
state.pagination.list = ms;
|
||||
// state.pagination.total = data.total;
|
||||
// state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
params.ids = state.activityInfo.productSpuIds.join(',');
|
||||
} else if (state.activityInfo.productScope === 3) {
|
||||
params.categoryIds = state.activityInfo.productScopeValues.join(',');
|
||||
state.loadStatus = 'loading';
|
||||
const { code, data } = await SpuApi.getSpuPage({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
...params,
|
||||
});
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
// 使用 map 提取每个对象的 id 属性
|
||||
const ids = data.list.map((item) => item.id);
|
||||
// 使用 join 方法将 id 数组连接成一个用逗号分隔的字符串
|
||||
const idsString = ids.join(',');
|
||||
// 获取结算信息
|
||||
settleData.value = await getSettlementByIds(idsString);
|
||||
// 处理获得的数据
|
||||
const ms = enrichDataWithSkus(data.list, settleData.value);
|
||||
state.pagination.list = _.concat(state.pagination.list, ms);
|
||||
state.pagination.total = data.total;
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
} else {
|
||||
state.loadStatus = 'loading';
|
||||
const { code, data } = await SpuApi.getSpuPage({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
});
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
// 使用 map 提取每个对象的 id 属性
|
||||
const ids = data.list.map((item) => item.id);
|
||||
// 使用 join 方法将 id 数组连接成一个用逗号分隔的字符串
|
||||
const idsString = ids.join(',');
|
||||
// 获取结算信息
|
||||
settleData.value = await getSettlementByIds(idsString);
|
||||
// 处理获得的数据
|
||||
const ms = enrichDataWithSkus(data.list, settleData.value);
|
||||
state.pagination.list = _.concat(state.pagination.list, ms);
|
||||
state.pagination.total = data.total;
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
params.categoryIds = state.activityInfo.productSpuIds.join(',');
|
||||
}
|
||||
// 请求数据
|
||||
state.loadStatus = 'loading';
|
||||
const { code, data } = await SpuApi.getSpuPage({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
...params,
|
||||
});
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
// 拼接结算信息（营销）
|
||||
await OrderApi.getSettlementProduct(data.list.map((item) => item.id).join(',')).then((res) => {
|
||||
if (res.code !== 0) {
|
||||
return;
|
||||
}
|
||||
appendSettlementProduct(data.list, res.data);
|
||||
});
|
||||
state.pagination.list = _.concat(state.pagination.list, data.list);
|
||||
state.pagination.total = data.total;
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
mountMasonry();
|
||||
}
|
||||
//获取结算信息
|
||||
const settleData = ref();
|
||||
async function getSettlementByIds(ids) {
|
||||
const { data } = await SpuApi.getSettlementProduct(ids);
|
||||
return data;
|
||||
}
|
||||
//计算展示价格的函数
|
||||
function enrichDataWithSkus(data, array) {
|
||||
// 创建一个映射，以 id 为键，存储 data 数组中的对象
|
||||
const dataMap = new Map(
|
||||
data.map((item) => [
|
||||
item.id,
|
||||
{
|
||||
...item,
|
||||
},
|
||||
]),
|
||||
);
|
||||
|
||||
// 遍历 array 数组
|
||||
array.forEach((item) => {
|
||||
// 初始化 discountPrice 和 vipPrice 为 null
|
||||
let discountPrice = null;
|
||||
let vipPrice = null;
|
||||
let foundType4 = false;
|
||||
let foundType6 = false;
|
||||
|
||||
// 遍历 skus 数组，寻找 type 为 4 和 6 的首个条目
|
||||
item.skus.forEach((sku) => {
|
||||
if (!foundType4 && sku.type === 4) {
|
||||
discountPrice = sku.price;
|
||||
foundType4 = true;
|
||||
}
|
||||
if (!foundType6 && sku.type === 6) {
|
||||
vipPrice = sku.price;
|
||||
foundType6 = true;
|
||||
}
|
||||
|
||||
// 如果已经找到 type 为 4 和 6 的条目，则不需要继续遍历
|
||||
if (foundType4 && foundType6) {
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
// 更新 dataMap 中对应的对象
|
||||
if (dataMap.has(item.id)) {
|
||||
dataMap.get(item.id).discountPrice = discountPrice;
|
||||
dataMap.get(item.id).vipPrice = vipPrice;
|
||||
dataMap.get(item.id).reward = item.reward;
|
||||
}
|
||||
});
|
||||
|
||||
// 返回更新后的数据数组
|
||||
return Array.from(dataMap.values());
|
||||
}
|
||||
// 加载活动信息
|
||||
async function getActivity(id) {
|
||||
const { code, data } = await RewardActivityApi.getRewardActivity(id);
|
||||
|
|
@ -252,32 +162,28 @@
|
|||
onLoad(async (options) => {
|
||||
state.activityId = options.activityId;
|
||||
await getActivity(state.activityId);
|
||||
await getList();
|
||||
await getList(state.activityId);
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.goods-list-box {
|
||||
width: 50%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.left-list {
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.right-list {
|
||||
margin-left: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tip-box {
|
||||
background: #fff0e7;
|
||||
padding: 20rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
|
||||
.activity-left-image {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
|
|
@ -285,7 +191,6 @@
|
|||
width: 58rpx;
|
||||
height: 36rpx;
|
||||
}
|
||||
|
||||
.activity-right-image {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
@ -293,14 +198,12 @@
|
|||
width: 72rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
|
||||
.type-text {
|
||||
font-size: 26rpx;
|
||||
font-weight: 500;
|
||||
color: #ff6000;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
|
||||
.tip-content {
|
||||
font-size: 26rpx;
|
||||
font-weight: 500;
|
||||
|
|
|
|||
|
|
@ -217,6 +217,7 @@
|
|||
|
||||
onPageScroll(() => {});
|
||||
import countDown from '@/sheep/components/countDown/index.vue';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
|
||||
const bgColor = {
|
||||
bgColor: '#E93323',
|
||||
|
|
@ -323,7 +324,7 @@
|
|||
}
|
||||
|
||||
async function getSettlementByIds(ids) {
|
||||
let { data, code } = await SpuApi.getSettlementProduct(ids);
|
||||
let { data, code } = await OrderApi.getSettlementProduct(ids);
|
||||
if (code !== 0 || data.length !== 1) {
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -124,6 +124,8 @@
|
|||
import _ from 'lodash-es';
|
||||
import { resetPagination } from '@/sheep/util';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
import { appendSettlementProduct } from '@/sheep/hooks/useGoods';
|
||||
|
||||
const sys_navBar = sheep.$platform.navbar;
|
||||
const emits = defineEmits(['close', 'change']);
|
||||
|
|
@ -277,15 +279,14 @@
|
|||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
// 使用 map 提取每个对象的 id 属性
|
||||
const ids = data.list.map((item) => item.id);
|
||||
// 使用 join 方法将 id 数组连接成一个用逗号分隔的字符串
|
||||
const idsString = ids.join(',');
|
||||
// 获取结算信息
|
||||
settleData.value = await getSettlementByIds(idsString);
|
||||
// 处理获得的数据
|
||||
const ms = enrichDataWithSkus(data.list, settleData.value);
|
||||
state.pagination.list = _.concat(state.pagination.list, ms);
|
||||
// 拼接结算信息（营销）
|
||||
await OrderApi.getSettlementProduct(data.list.map((item) => item.id).join(',')).then((res) => {
|
||||
if (res.code !== 0) {
|
||||
return;
|
||||
}
|
||||
appendSettlementProduct(data.list, res.data);
|
||||
});
|
||||
state.pagination.list = _.concat(state.pagination.list, data.list);
|
||||
state.pagination.total = data.total;
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
mountMasonry();
|
||||
|
|
@ -300,57 +301,6 @@
|
|||
getList(state.currentSort, state.currentOrder);
|
||||
}
|
||||
|
||||
//获取结算信息
|
||||
const settleData = ref();
|
||||
async function getSettlementByIds(ids) {
|
||||
const { data } = await SpuApi.getSettlementProduct(ids);
|
||||
return data;
|
||||
}
|
||||
|
||||
//计算展示价格的函数
|
||||
function enrichDataWithSkus(data, array) {
|
||||
// 创建一个映射，以 id 为键，存储 data 数组中的对象
|
||||
const dataMap = new Map(data.map((item) => [item.id, { ...item }]));
|
||||
|
||||
// 遍历 array 数组
|
||||
array.forEach((item) => {
|
||||
// 初始化 discountPrice 和 vipPrice 为 null
|
||||
let discountPrice = null;
|
||||
let vipPrice = null;
|
||||
let foundType4 = false;
|
||||
let foundType6 = false;
|
||||
|
||||
// 遍历 skus 数组，寻找 type 为 4 和 6 的首个条目
|
||||
item.skus.forEach((sku) => {
|
||||
debugger;
|
||||
if (!foundType4 && sku.promotionType === 4) {
|
||||
discountPrice = sku.payPrice;
|
||||
foundType4 = true;
|
||||
}
|
||||
if (!foundType6 && sku.promotionType === 6) {
|
||||
vipPrice = sku.payPrice;
|
||||
foundType6 = true;
|
||||
}
|
||||
|
||||
// 如果已经找到 type 为 4 和 6 的条目，则不需要继续遍历
|
||||
if (foundType4 && foundType6) {
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
// 更新 dataMap 中对应的对象
|
||||
if (dataMap.has(item.spuId)) {
|
||||
debugger;
|
||||
dataMap.get(item.spuId).discountPrice = discountPrice;
|
||||
dataMap.get(item.spuId).vipPrice = vipPrice;
|
||||
dataMap.get(item.spuId).reward = item.rewardActivity;
|
||||
}
|
||||
});
|
||||
|
||||
// 返回更新后的数据数组
|
||||
return Array.from(dataMap.values());
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
state.categoryId = options.categoryId;
|
||||
state.keyword = options.keyword;
|
||||
|
|
|
|||
|
|
@ -53,6 +53,18 @@ const OrderApi = {
|
|||
},
|
||||
});
|
||||
},
|
||||
// 获得商品结算信息
|
||||
getSettlementProduct: (spuIds) => {
|
||||
return request({
|
||||
url: '/trade/order/settlement-product',
|
||||
method: 'GET',
|
||||
params: { spuIds },
|
||||
custom: {
|
||||
showLoading: false,
|
||||
showError: false,
|
||||
},
|
||||
});
|
||||
},
|
||||
// 创建订单
|
||||
createOrder: (data) => {
|
||||
return request({
|
||||
|
|
|
|||
|
|
@ -141,9 +141,11 @@
|
|||
/**
|
||||
* 商品卡片
|
||||
*/
|
||||
import { computed, reactive, onMounted, ref } from 'vue';
|
||||
import { computed, reactive, onMounted } from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
import { appendSettlementProduct } from '@/sheep/hooks/useGoods';
|
||||
|
||||
// 布局类型
|
||||
const LayoutTypeEnum = {
|
||||
|
|
@ -234,61 +236,19 @@
|
|||
return data;
|
||||
}
|
||||
|
||||
//获取结算信息
|
||||
const settleData = ref()
|
||||
async function getSettlementByIds(ids) {
|
||||
const { data } = await SpuApi.getSettlementProduct(ids);
|
||||
return data;
|
||||
}
|
||||
|
||||
//计算展示价格的函数
|
||||
async function enrichDataWithSkus(data, array) {
|
||||
// 创建一个映射，以 id 为键，存储 data 数组中的对象
|
||||
const dataMap = new Map(data.map(item => [item.id, { ...item }]));
|
||||
|
||||
// 遍历 array 数组
|
||||
array.forEach(item => {
|
||||
// 初始化 discountPrice 和 vipPrice 为 null
|
||||
let discountPrice = null;
|
||||
let vipPrice = null;
|
||||
let foundType4 = false;
|
||||
let foundType6 = false;
|
||||
|
||||
// 遍历 skus 数组，寻找 type 为 4 和 6 的首个条目
|
||||
item.skus.forEach(sku => {
|
||||
if (!foundType4 && sku.type === 4) {
|
||||
discountPrice = sku.price;
|
||||
foundType4 = true;
|
||||
}
|
||||
if (!foundType6 && sku.type === 6) {
|
||||
vipPrice = sku.price;
|
||||
foundType6 = true;
|
||||
}
|
||||
|
||||
// 如果已经找到 type 为 4 和 6 的条目，则不需要继续遍历
|
||||
if (foundType4 && foundType6) {
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
// 更新 dataMap 中对应的对象
|
||||
if (dataMap.has(item.id)) {
|
||||
dataMap.get(item.id).discountPrice = discountPrice;
|
||||
dataMap.get(item.id).vipPrice = vipPrice;
|
||||
dataMap.get(item.id).reward = item.reward;
|
||||
}
|
||||
});
|
||||
|
||||
// 返回更新后的数据数组
|
||||
return Array.from(dataMap.values());
|
||||
}
|
||||
|
||||
// 初始化
|
||||
onMounted(async () => {
|
||||
// 加载商品列表
|
||||
const ms = await getGoodsListByIds(spuIds.join(','));
|
||||
settleData.value = await getSettlementByIds(spuIds.join(','))
|
||||
state.goodsList = await enrichDataWithSkus(ms,settleData.value)
|
||||
state.goodsList = await getGoodsListByIds(spuIds.join(','));
|
||||
// 拼接结算信息（营销）
|
||||
await OrderApi.getSettlementProduct(state.goodsList.map((item) => item.id).join(',')).then(
|
||||
(res) => {
|
||||
if (res.code !== 0) {
|
||||
return;
|
||||
}
|
||||
appendSettlementProduct(state.goodsList, res.data);
|
||||
},
|
||||
);
|
||||
// 只有双列布局时需要
|
||||
if (layoutType === LayoutTypeEnum.TWO_COL) {
|
||||
// 分列
|
||||
|
|
|
|||
|
|
@ -11,11 +11,7 @@
|
|||
<view v-if="tagStyle.show" class="tag-icon-box">
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)"></image>
|
||||
</view>
|
||||
<image
|
||||
class="xs-img-box"
|
||||
:src="sheep.$url.cdn(data.image || data.picUrl)"
|
||||
mode="aspectFit"
|
||||
></image>
|
||||
<image class="xs-img-box" :src="sheep.$url.cdn(data.image || data.picUrl)" mode="aspectFit" />
|
||||
<view
|
||||
v-if="goodsFields.title?.show || goodsFields.name?.show || goodsFields.price?.show"
|
||||
class="xs-goods-content ss-flex-col ss-row-around"
|
||||
|
|
@ -27,23 +23,24 @@
|
|||
>
|
||||
{{ data.title || data.name }}
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠 -->
|
||||
<view class="iconBox" v-if="data.discountPrice || data.vipPrice || data.reward">
|
||||
<view class="card" v-if="iconShow">{{ iconShow }}</view>
|
||||
<view class="card2" v-if="data.reward">{{ data.reward.ruleDescriptions[0] }}</view>
|
||||
<!-- 活动信息 -->
|
||||
<view class="iconBox" v-if="data.promotionType > 0 || data.rewardActivity">
|
||||
<view class="card" v-if="discountText">{{ discountText }}</view>
|
||||
<view class="card2" v-if="data.rewardActivity">
|
||||
{{ data.rewardActivity.ruleDescriptions[0] }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠结束 -->
|
||||
<view
|
||||
v-if="goodsFields.price?.show"
|
||||
class="xs-goods-price font-OPPOSANS"
|
||||
:style="[{ color: goodsFields.price.color }]"
|
||||
>
|
||||
<text class="price-unit ss-font-24">{{ priceUnit }}</text>
|
||||
<text v-if="iconShow == '限时优惠'">{{ fen2yuan(data.discountPrice) }}</text>
|
||||
<text v-else-if="iconShow == '会员价'">{{ fen2yuan(data.vipPrice) }}</text>
|
||||
<text v-else>{{
|
||||
isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price)
|
||||
}}</text>
|
||||
<!-- 活动价格 -->
|
||||
<text v-if="data.promotionPrice > 0">{{ fen2yuan(data.promotionPrice) }}</text>
|
||||
<text v-else>
|
||||
{{ isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price) }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -70,23 +67,24 @@
|
|||
>
|
||||
{{ data.title || data.name }}
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠 -->
|
||||
<view class="iconBox" v-if="data.discountPrice || data.vipPrice || data.reward">
|
||||
<view class="card" v-if="iconShow">{{ iconShow }}</view>
|
||||
<view class="card2" v-if="data.reward">{{ data.reward.ruleDescriptions[0] }}</view>
|
||||
<!-- 活动信息 -->
|
||||
<view class="iconBox" v-if="data.promotionType > 0 || data.rewardActivity">
|
||||
<view class="card" v-if="discountText">{{ discountText }}</view>
|
||||
<view class="card2" v-if="data.rewardActivity">
|
||||
{{ data.rewardActivity.ruleDescriptions[0] }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠结束 -->
|
||||
<view
|
||||
v-if="goodsFields.price?.show"
|
||||
class="sm-goods-price font-OPPOSANS"
|
||||
:style="[{ color: goodsFields.price.color }]"
|
||||
>
|
||||
<text class="price-unit ss-font-24">{{ priceUnit }}</text>
|
||||
<text v-if="iconShow == '限时优惠'">{{ fen2yuan(data.discountPrice) }}</text>
|
||||
<text v-else-if="iconShow == '会员价'">{{ fen2yuan(data.vipPrice) }}</text>
|
||||
<text v-else>{{
|
||||
isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price)
|
||||
}}</text>
|
||||
<!-- 活动价格 -->
|
||||
<text v-if="data.promotionPrice > 0">{{ fen2yuan(data.promotionPrice) }}</text>
|
||||
<text v-else>
|
||||
{{ isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price) }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -94,13 +92,9 @@
|
|||
<!-- md卡片：竖向，一行放两个，图上内容下 -->
|
||||
<view v-if="size === 'md'" class="md-goods-card ss-flex-col" :style="[elStyles]" @tap="onClick">
|
||||
<view v-if="tagStyle.show" class="tag-icon-box">
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)"></image>
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)" />
|
||||
</view>
|
||||
<image
|
||||
class="md-img-box"
|
||||
:src="sheep.$url.cdn(data.image || data.picUrl)"
|
||||
mode="widthFix"
|
||||
></image>
|
||||
<image class="md-img-box" :src="sheep.$url.cdn(data.image || data.picUrl)" mode="widthFix" />
|
||||
<view
|
||||
class="md-goods-content ss-flex-col ss-row-around ss-p-b-20 ss-p-t-20 ss-p-x-16"
|
||||
:id="elId"
|
||||
|
|
@ -130,12 +124,13 @@
|
|||
</view>
|
||||
</view>
|
||||
</slot>
|
||||
<!-- 这里是新加的会员价和限时优惠 -->
|
||||
<view class="iconBox" v-if="data.discountPrice || data.vipPrice || data.reward">
|
||||
<view class="card" v-if="iconShow">{{ iconShow }}</view>
|
||||
<view class="card2" v-if="data.reward">{{ data.reward.ruleDescriptions[0] }}</view>
|
||||
<!-- 活动信息 -->
|
||||
<view class="iconBox" v-if="data.promotionType > 0 || data.rewardActivity">
|
||||
<view class="card" v-if="discountText">{{ discountText }}</view>
|
||||
<view class="card2" v-if="data.rewardActivity">
|
||||
{{ data.rewardActivity.ruleDescriptions[0] }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠结束 -->
|
||||
<view class="ss-flex ss-col-bottom">
|
||||
<view
|
||||
v-if="goodsFields.price?.show"
|
||||
|
|
@ -143,13 +138,12 @@
|
|||
:style="[{ color: goodsFields.price.color }]"
|
||||
>
|
||||
<text class="price-unit ss-font-24">{{ priceUnit }}</text>
|
||||
<text v-if="iconShow == '限时优惠'">{{ fen2yuan(data.discountPrice) }}</text>
|
||||
<text v-else-if="iconShow == '会员价'">{{ fen2yuan(data.vipPrice) }}</text>
|
||||
<text v-else>{{
|
||||
isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price)
|
||||
}}</text>
|
||||
<!-- 活动价格 -->
|
||||
<text v-if="data.promotionPrice > 0">{{ fen2yuan(data.promotionPrice) }}</text>
|
||||
<text v-else>
|
||||
{{ isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price) }}
|
||||
</text>
|
||||
</view>
|
||||
|
||||
<view
|
||||
v-if="
|
||||
(goodsFields.original_price?.show || goodsFields.marketPrice?.show) &&
|
||||
|
|
@ -193,7 +187,7 @@
|
|||
class="lg-img-box"
|
||||
:src="sheep.$url.cdn(data.image || data.picUrl)"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
/>
|
||||
<view class="lg-goods-content ss-flex-1 ss-flex-col ss-row-between ss-p-b-10 ss-p-t-20">
|
||||
<view>
|
||||
<view
|
||||
|
|
@ -219,12 +213,13 @@
|
|||
</view>
|
||||
</view>
|
||||
</slot>
|
||||
<!-- 这里是新加的会员价和限时优惠 -->
|
||||
<view class="iconBox" v-if="data.discountPrice || data.vipPrice || data.reward">
|
||||
<view class="card" v-if="iconShow">{{ iconShow }}</view>
|
||||
<view class="card2" v-if="data.reward">{{ data.reward.ruleDescriptions[0] }}</view>
|
||||
<!-- 活动信息 -->
|
||||
<view class="iconBox" v-if="data.promotionType > 0 || data.rewardActivity">
|
||||
<view class="card" v-if="discountText">{{ discountText }}</view>
|
||||
<view class="card2" v-if="data.rewardActivity">
|
||||
{{ data.rewardActivity.ruleDescriptions[0] }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠结束 -->
|
||||
<view class="ss-flex ss-col-bottom ss-m-t-10">
|
||||
<view
|
||||
v-if="goodsFields.price?.show"
|
||||
|
|
@ -243,11 +238,11 @@
|
|||
:style="[{ color: originPriceColor }]"
|
||||
>
|
||||
<text class="price-unit ss-font-20">{{ priceUnit }}</text>
|
||||
<text v-if="iconShow == '限时优惠'">{{ fen2yuan(data.discountPrice) }}</text>
|
||||
<text v-else-if="iconShow == '会员价'">{{ fen2yuan(data.vipPrice) }}</text>
|
||||
<text v-else>{{
|
||||
isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price)
|
||||
}}</text>
|
||||
<!-- 活动价格 -->
|
||||
<text v-if="data.promotionPrice > 0">{{ fen2yuan(data.promotionPrice) }}</text>
|
||||
<text v-else>
|
||||
{{ isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price) }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ss-m-t-8 ss-flex ss-col-center ss-flex-wrap">
|
||||
|
|
@ -264,15 +259,13 @@
|
|||
<!-- sl卡片：竖向型，一行放一个，图片上内容下边 -->
|
||||
<view v-if="size === 'sl'" class="sl-goods-card ss-flex-col" :style="[elStyles]" @tap="onClick">
|
||||
<view v-if="tagStyle.show" class="tag-icon-box">
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)"></image>
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)" />
|
||||
</view>
|
||||
|
||||
<image
|
||||
class="sl-img-box"
|
||||
:src="sheep.$url.cdn(data.image || data.picUrl)"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
|
||||
/>
|
||||
<view class="sl-goods-content">
|
||||
<view>
|
||||
<view
|
||||
|
|
@ -302,20 +295,21 @@
|
|||
</view>
|
||||
</view>
|
||||
</slot>
|
||||
<!-- 这里是新加的会员价和限时优惠 -->
|
||||
<view class="iconBox" v-if="data.discountPrice || data.vipPrice || data.reward">
|
||||
<view class="card" v-if="iconShow">{{ iconShow }}</view>
|
||||
<view class="card2" v-if="data.reward">{{ data.reward.ruleDescriptions[0] }}</view>
|
||||
<!-- 活动信息 -->
|
||||
<view class="iconBox" v-if="data.promotionType > 0 || data.rewardActivity">
|
||||
<view class="card" v-if="discountText">{{ discountText }}</view>
|
||||
<view class="card2" v-if="data.rewardActivity">
|
||||
{{ data.rewardActivity.ruleDescriptions[0] }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- 这里是新加的会员价和限时优惠结束 -->
|
||||
<view v-if="goodsFields.price?.show" class="ss-flex ss-col-bottom font-OPPOSANS">
|
||||
<view class="sl-goods-price ss-m-r-12" :style="[{ color: goodsFields.price.color }]">
|
||||
<text class="price-unit ss-font-24">{{ priceUnit }}</text>
|
||||
<text v-if="iconShow == '限时优惠'">{{ fen2yuan(data.discountPrice) }}</text>
|
||||
<text v-else-if="iconShow == '会员价'">{{ fen2yuan(data.vipPrice) }}</text>
|
||||
<text v-else>{{
|
||||
isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price)
|
||||
}}</text>
|
||||
<!-- 活动价格 -->
|
||||
<text v-if="data.promotionPrice > 0">{{ fen2yuan(data.promotionPrice) }}</text>
|
||||
<text v-else>
|
||||
{{ isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price) }}
|
||||
</text>
|
||||
</view>
|
||||
<view
|
||||
v-if="
|
||||
|
|
@ -371,14 +365,11 @@
|
|||
* @event {Function()} click - 点击卡片
|
||||
*
|
||||
*/
|
||||
import { computed, reactive, getCurrentInstance, onMounted, nextTick, ref } from 'vue';
|
||||
import { computed, getCurrentInstance, onMounted, nextTick } from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import { fen2yuan, formatSales } from '@/sheep/hooks/useGoods';
|
||||
import { formatStock } from '@/sheep/hooks/useGoods';
|
||||
import goodsCollectVue from '@/pages/user/goods-collect.vue';
|
||||
import { isArray } from 'lodash-es';
|
||||
// 数据
|
||||
const state = reactive({});
|
||||
|
||||
// 接收参数
|
||||
const props = defineProps({
|
||||
|
|
@ -478,25 +469,18 @@
|
|||
default: false,
|
||||
},
|
||||
});
|
||||
//判断限时优惠和会员价标签内容暂时导致页面出错，又舍不得丢，等着把新的数据整合到商品信息中，也用起来
|
||||
const iconShow = handle();
|
||||
|
||||
function handle() {
|
||||
if (props.data.discountPrice === null && props.data.vipPrice === null) {
|
||||
// 如果两个值都为 null，则不展示任何内容
|
||||
return '';
|
||||
} else if (props.data.discountPrice === null) {
|
||||
// 如果 discountPrice 为 null，展示 vipPrice
|
||||
return '会员价';
|
||||
} else if (props.data.vipPrice === null) {
|
||||
// 如果 vipPrice 为 null，展示 discountPrice
|
||||
// 优惠文案
|
||||
const discountText = computed(() => {
|
||||
const promotionType = props.data.promotionType;
|
||||
if (promotionType === 4) {
|
||||
return '限时优惠';
|
||||
} else if (props.data.discountPrice < props.data.vipPrice) {
|
||||
return '限时优惠';
|
||||
} else if (props.data.discountPrice > props.data.vipPrice) {
|
||||
} else if (promotionType === 6) {
|
||||
return '会员价';
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
});
|
||||
|
||||
// 组件样式
|
||||
const elStyles = computed(() => {
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -382,3 +382,27 @@ export function convertProductPropertyList(skus) {
|
|||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
export function appendSettlementProduct(spus, settlementInfos) {
|
||||
if (!settlementInfos || settlementInfos.length === 0) {
|
||||
return;
|
||||
}
|
||||
for (const spu of spus) {
|
||||
const settlementInfo = settlementInfos.find((info) => info.spuId === spu.id);
|
||||
if (!settlementInfo) {
|
||||
return;
|
||||
}
|
||||
// 选择价格最小的 SKU 设置到 SPU 上
|
||||
const settlementSku = settlementInfo.skus
|
||||
.filter((sku) => sku.promotionPrice > 0)
|
||||
.reduce((prev, curr) => (prev.promotionPrice < curr.promotionPrice ? prev : curr));
|
||||
if (settlementSku) {
|
||||
spu.promotionType = settlementSku.promotionType;
|
||||
spu.promotionPrice = settlementSku.promotionPrice;
|
||||
}
|
||||
// 设置【满减送】活动
|
||||
if (settlementInfo.rewardActivity) {
|
||||
spu.rewardActivity = settlementInfo.rewardActivity;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue