yudao
/
mall-uniapp
mirror of https://gitee.com/yudaocode/yudao-mall-uniapp.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

!91 【综合修复】拼团装修重构、处理无法发布到微信小程序的问题 

Merge pull request !91 from 卢越/master
pull/95/MERGE
芋道源码 2024-09-06 12:56:49 +00:00 committed by Gitee
parent 81cd02bbee 089e0197cd
commit fdca229a77
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
10 changed files with 414 additions and 208 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
manifest.json
View File

@ -3,7 +3,7 @@
"appid": "__UNI__460BC4C", "appid": "__UNI__460BC4C",
"description": "基于 uni-app + Vue3 技术驱动的在线商城系统，内含诸多功能与丰富的活动，期待您的使用和反馈。", "description": "基于 uni-app + Vue3 技术驱动的在线商城系统，内含诸多功能与丰富的活动，期待您的使用和反馈。",
"versionName": "2.1.0", "versionName": "2.1.0",
"versionCode": 183, "versionCode": "183",
"transformPx": false, "transformPx": false,
"app-plus": { "app-plus": {
"usingComponents": true, "usingComponents": true,
@ -188,7 +188,8 @@
"setting": { "setting": {
"urlCheck": false, "urlCheck": false,
"minified": true, "minified": true,
"postcss": true "postcss": false,
"es6": false
}, },
"optimization": { "optimization": {
"subPackages": true "subPackages": true
@ -236,4 +237,4 @@
"_spaceID": "192b4892-5452-4e1d-9f09-eee1ece40639", "_spaceID": "192b4892-5452-4e1d-9f09-eee1ece40639",
"locale": "zh-Hans", "locale": "zh-Hans",
"fallbackLocale": "zh-Hans" "fallbackLocale": "zh-Hans"
} }

17
pages/goods/groupon.vue
View File

@ -90,7 +90,7 @@
<s-select-groupon-sku <s-select-groupon-sku
:show="state.showSelectSku" :show="state.showSelectSku"
:goodsInfo="state.goodsInfo" :goodsInfo="state.goodsInfo"
:selectedSku="state.selectedSku" :selectedSku="state.selectedSku"
:grouponAction="state.grouponAction" :grouponAction="state.grouponAction"
:grouponNum="state.grouponNum" :grouponNum="state.grouponNum"
@buy="onBuy" @buy="onBuy"
@ -126,7 +126,12 @@
:disabled="state.goodsInfo.stock === 0 || state.activity.status !== 0" :disabled="state.goodsInfo.stock === 0 || state.activity.status !== 0"
> >
<view class="btn-price">{{ <view class="btn-price">{{
fen2yuan(state.selectedSku.price * state.selectedSku.count || state.activity.price * state.selectedSku.count || state.goodsInfo.price * state.selectedSku.count || state.goodsInfo.price) fen2yuan(
state.selectedSku.price * state.selectedSku.count ||
state.activity.price * state.selectedSku.count ||
state.goodsInfo.price * state.selectedSku.count ||
state.goodsInfo.price,
)
}}</view> }}</view>
<view v-if="state.activity.startTime > new Date().getTime()">未开始</view> <view v-if="state.activity.startTime > new Date().getTime()">未开始</view>
<view v-else-if="state.activity.endTime <= new Date().getTime()">已结束</view> <view v-else-if="state.activity.endTime <= new Date().getTime()">已结束</view>
@ -263,10 +268,12 @@
// 加载商品信息 // 加载商品信息
const { data: spu } = await SpuApi.getSpuDetail(activity.spuId); const { data: spu } = await SpuApi.getSpuDetail(activity.spuId);
state.goodsId = spu.id; state.goodsId = spu.id;
// 默认显示最低价 // 默认显示最低价
activity.products.forEach((product) => { spu.price = activity.products.reduce((min, product) => {
state.activity.price = Math.min(spu.price, product.combinationPrice); // 设置 SPU 的最低价格 return Math.min(min, product.combinationPrice || Infinity);
}); }, Infinity);
// 价格、库存使用活动的 // 价格、库存使用活动的
spu.skus.forEach((sku) => { spu.skus.forEach((sku) => {
const product = activity.products.find((product) => product.skuId === sku.id); const product = activity.products.find((product) => product.skuId === sku.id);

23
pages/user/goods_details_store/index.vue
View File

@ -1,7 +1,12 @@
<template> <template>
<s-layout title="选择自提门店" :bgStyle="{ color: '#FFF' }"> <s-layout title="选择自提门店" :bgStyle="{ color: '#FFF' }">
<view class="storeBox" ref="container"> <view class="storeBox" ref="container">
<view class="storeBox-box" v-for="(item, index) in state.storeList" :key="index" @tap="checked(item)"> <view
class="storeBox-box"
v-for="(item, index) in state.storeList"
:key="index"
@tap="checked(item)"
>
<view class="store-img"> <view class="store-img">
<image :src="item.logo" class="img" /> <image :src="item.logo" class="img" />
</view> </view>
@ -33,7 +38,9 @@
<!-- #endif --> <!-- #endif -->
</view> </view>
<view class="store-distance ss-flex ss-row-center" @tap.stop="showMaoLocation(item)"> <view class="store-distance ss-flex ss-row-center" @tap.stop="showMaoLocation(item)">
<text class="addressTxt" v-if="item.distance">距离{{ item.distance.toFixed(2) }}千米</text> <text class="addressTxt" v-if="item.distance"
>距离{{ item.distance.toFixed(2) }}千米</text
>
<text class="addressTxt" v-else>查看地图</text> <text class="addressTxt" v-else>查看地图</text>
<view class="iconfont"> <view class="iconfont">
<view class="ss-rest-button"> <view class="ss-rest-button">
@ -75,7 +82,6 @@
const jsWxSdk = sheep.$platform.useProvider('wechat').jsWxSdk; const jsWxSdk = sheep.$platform.useProvider('wechat').jsWxSdk;
if (jsWxSdk.isWechat()) { if (jsWxSdk.isWechat()) {
jsWxSdk.getLocation((res) => { jsWxSdk.getLocation((res) => {
console.log(res);
state.user_latitude = res.latitude; state.user_latitude = res.latitude;
state.user_longitude = res.longitude; state.user_longitude = res.longitude;
uni.setStorageSync(LATITUDE, res.latitude); uni.setStorageSync(LATITUDE, res.latitude);
@ -92,7 +98,8 @@
state.user_longitude = res.longitude; state.user_longitude = res.longitude;
uni.setStorageSync(LATITUDE, res.latitude); uni.setStorageSync(LATITUDE, res.latitude);
uni.setStorageSync(LONGITUDE, res.longitude); uni.setStorageSync(LONGITUDE, res.longitude);
} catch { } catch (e) {
console.error(e);
} }
getList(); getList();
}, },
@ -112,7 +119,7 @@
latitude: Number(e.latitude), latitude: Number(e.latitude),
longitude: Number(e.longitude), longitude: Number(e.longitude),
name: e.name, name: e.name,
address: `${e.areaName}-${e.detailAddress}` address: `${e.areaName}-${e.detailAddress}`,
}); });
} else { } else {
// #endif // #endif
@ -121,7 +128,7 @@
longitude: Number(e.longitude), longitude: Number(e.longitude),
name: e.name, name: e.name,
address: `${e.areaName}-${e.detailAddress}`, address: `${e.areaName}-${e.detailAddress}`,
success: function() { success: function () {
console.log('success'); console.log('success');
}, },
}); });
@ -172,7 +179,7 @@
state.user_latitude = uni.getStorageSync(LATITUDE); state.user_latitude = uni.getStorageSync(LATITUDE);
state.user_longitude = uni.getStorageSync(LONGITUDE); state.user_longitude = uni.getStorageSync(LONGITUDE);
} catch (e) { } catch (e) {
// error console.error(e);
} }
}); });
</script> </script>
@ -180,7 +187,7 @@
.line1 { .line1 {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap white-space: nowrap;
} }
.geoPage { .geoPage {

11
sheep/api/promotion/combination.js
View File

@ -23,6 +23,17 @@ const CombinationApi = {
}); });
}, },
// 获得拼团活动明细列表
getCombinationActivityDetailList: (ids) => {
return request({
url: '/promotion/combination-activity/list-by-ids',
method: 'GET',
params: {
ids
},
});
},
// 获得最近 n 条拼团记录（团长发起的） // 获得最近 n 条拼团记录（团长发起的）
getHeadCombinationRecordList: (activityId, status, count) => { getHeadCombinationRecordList: (activityId, status, count) => {
return request({ return request({

25
sheep/components/s-goods-card/s-goods-card.vue
View File

@ -3,7 +3,10 @@
<!-- 商品卡片 --> <!-- 商品卡片 -->
<view> <view>
<!-- 布局1. 单列大图（上图，下内容）--> <!-- 布局1. 单列大图（上图，下内容）-->
<view v-if="layoutType === LayoutTypeEnum.ONE_COL_BIG_IMG && state.goodsList.length" class="goods-sl-box"> <view
v-if="layoutType === LayoutTypeEnum.ONE_COL_BIG_IMG && state.goodsList.length"
class="goods-sl-box"
>
<view <view
class="goods-box" class="goods-box"
v-for="item in state.goodsList" v-for="item in state.goodsList"
@ -100,7 +103,10 @@
</view> </view>
<!-- 布局3. 单列小图（左图，右内容） --> <!-- 布局3. 单列小图（左图，右内容） -->
<view v-if="layoutType === LayoutTypeEnum.ONE_COL_SMALL_IMG && state.goodsList.length" class="goods-lg-box"> <view
v-if="layoutType === LayoutTypeEnum.ONE_COL_SMALL_IMG && state.goodsList.length"
class="goods-lg-box"
>
<view <view
class="goods-box" class="goods-box"
:style="[{ marginBottom: data.space + 'px' }]" :style="[{ marginBottom: data.space + 'px' }]"
@ -147,7 +153,7 @@
TWO_COL: 'twoCol', TWO_COL: 'twoCol',
// 单列小图 // 单列小图
ONE_COL_SMALL_IMG: 'oneColSmallImg', ONE_COL_SMALL_IMG: 'oneColSmallImg',
} };
const state = reactive({ const state = reactive({
goodsList: [], goodsList: [],
@ -157,16 +163,16 @@
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
default() {}, default: () => ({}),
}, },
styles: { styles: {
type: Object, type: Object,
default() {}, default: () => ({}),
}, },
}); });
const { layoutType, btnBuy, spuIds } = props.data ?? {}; const { layoutType, btnBuy, spuIds } = props.data || {};
const { marginLeft, marginRight } = props.styles ?? {}; const { marginLeft, marginRight } = props.styles || {};
// 购买按钮样式 // 购买按钮样式
const buyStyle = computed(() => { const buyStyle = computed(() => {
@ -215,6 +221,7 @@
// 计数 // 计数
count++; count++;
} }
//endregion //endregion
/** /**
@ -232,7 +239,7 @@
// 加载商品列表 // 加载商品列表
state.goodsList = await getGoodsListByIds(spuIds.join(',')); state.goodsList = await getGoodsListByIds(spuIds.join(','));
// 只有双列布局时需要 // 只有双列布局时需要
if (layoutType === LayoutTypeEnum.TWO_COL){ if (layoutType === LayoutTypeEnum.TWO_COL) {
// 分列 // 分列
calculateGoodsColumn(); calculateGoodsColumn();
} }
@ -247,11 +254,13 @@
.goods-list-box { .goods-list-box {
width: 50%; width: 50%;
box-sizing: border-box; box-sizing: border-box;
.left-list { .left-list {
&:nth-last-child(1) { &:nth-last-child(1) {
margin-bottom: 0 !important; margin-bottom: 0 !important;
} }
} }
.right-list { .right-list {
&:nth-last-child(1) { &:nth-last-child(1) {
margin-bottom: 0 !important; margin-bottom: 0 !important;

63
sheep/components/s-goods-column/s-goods-column.vue
View File

@ -155,7 +155,7 @@
<view v-if="tagStyle.show" class="tag-icon-box"> <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)"></image>
</view> </view>
<view v-if="seckillTag" class="seckill-tag ss-flex ss-row-center"> 秒杀 </view> <view v-if="seckillTag" class="seckill-tag ss-flex ss-row-center">秒杀</view>
<view v-if="grouponTag" class="groupon-tag ss-flex ss-row-center"> <view v-if="grouponTag" class="groupon-tag ss-flex ss-row-center">
<view class="tag-icon">拼团</view> <view class="tag-icon">拼团</view>
</view> </view>
@ -285,9 +285,9 @@
</view> </view>
</view> </view>
<slot name="cart" <slot name="cart">
><view class="buy-box ss-flex ss-col-center ss-row-center">去购买</view></slot <view class="buy-box ss-flex ss-col-center ss-row-center">去购买</view>
> </slot>
</view> </view>
</view> </view>
</template> </template>
@ -297,35 +297,34 @@
* 商品卡片 * 商品卡片
* *
* @property {Array} size = [xs | sm | md | lg | sl ] - 列表数据 * @property {Array} size = [xs | sm | md | lg | sl ] - 列表数据
* @property {String} tag - md及以上才有 * @property {String} tag - md及以上才有
* @property {String} img - 图片 * @property {String} img - 图片
* @property {String} background - 背景色 * @property {String} background - 背景色
* @property {String} topRadius - 上圆角 * @property {String} topRadius - 上圆角
* @property {String} bottomRadius - 下圆角 * @property {String} bottomRadius - 下圆角
* @property {String} title - 标题 * @property {String} title - 标题
* @property {String} titleColor - 标题颜色 * @property {String} titleColor - 标题颜色
* @property {Number} titleWidth = 0 - 标题宽度，默认0，单位rpx * @property {Number} titleWidth = 0 - 标题宽度，默认0，单位rpx
* @property {String} subTitle - 副标题 * @property {String} subTitle - 副标题
* @property {String} subTitleColor - 副标题颜色 * @property {String} subTitleColor - 副标题颜色
* @property {String} subTitleBackground - 副标题背景 * @property {String} subTitleBackground - 副标题背景
* @property {String | Number} price - 价格 * @property {String | Number} price - 价格
* @property {String} priceColor - 价格颜色 * @property {String} priceColor - 价格颜色
* @property {String | Number} originPrice - 原价/划线价 * @property {String | Number} originPrice - 原价/划线价
* @property {String} originPriceColor - 原价颜色 * @property {String} originPriceColor - 原价颜色
* @property {String | Number} sales - 销售数量 * @property {String | Number} sales - 销售数量
* @property {String} salesColor - 销售数量颜色 * @property {String} salesColor - 销售数量颜色
* *
* @slots activity - 活动插槽 * @slots activity - 活动插槽
* @slots cart - 购物车插槽，默认包含文字，背景色，文字颜色 || 图片 || 行为 * @slots cart - 购物车插槽，默认包含文字，背景色，文字颜色 || 图片 || 行为
* *
* @event {Function()} click - 点击卡片 * @event {Function()} click - 点击卡片
* *
*/ */
import { computed, reactive, getCurrentInstance, onMounted, nextTick } from 'vue'; import { computed, reactive, getCurrentInstance, onMounted, nextTick } from 'vue';
import sheep from '@/sheep'; import sheep from '@/sheep';
import { fen2yuan, formatSales } from '@/sheep/hooks/useGoods'; import { fen2yuan, formatSales } from '@/sheep/hooks/useGoods';
import { formatStock } from '@/sheep/hooks/useGoods'; import { formatStock } from '@/sheep/hooks/useGoods';
import goodsCollectVue from '@/pages/user/goods-collect.vue';
import { isArray } from 'lodash-es'; import { isArray } from 'lodash-es';
// 数据 // 数据
@ -354,11 +353,11 @@
}, },
tagStyle: { tagStyle: {
type: Object, type: Object,
default: {}, default: () => ({}),
}, },
data: { data: {
type: Object, type: Object,
default: {}, default: () => ({}),
}, },
size: { size: {
type: String, type: String,
@ -451,6 +450,7 @@
// 获取卡片实时高度 // 获取卡片实时高度
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const elId = `sheep_${Math.ceil(Math.random() * 10e5).toString(36)}`; const elId = `sheep_${Math.ceil(Math.random() * 10e5).toString(36)}`;
function getGoodsPriceCardWH() { function getGoodsPriceCardWH() {
if (props.size === 'md') { if (props.size === 'md') {
const view = uni.createSelectorQuery().in(proxy); const view = uni.createSelectorQuery().in(proxy);
@ -469,6 +469,7 @@
}); });
} }
} }
onMounted(() => { onMounted(() => {
nextTick(() => { nextTick(() => {
getGoodsPriceCardWH(); getGoodsPriceCardWH();
@ -482,11 +483,13 @@
left: 0; left: 0;
top: 0; top: 0;
z-index: 2; z-index: 2;
.tag-icon { .tag-icon {
width: 72rpx; width: 72rpx;
height: 44rpx; height: 44rpx;
} }
} }
.seckill-tag { .seckill-tag {
position: absolute; position: absolute;
left: 0; left: 0;
@ -501,6 +504,7 @@
color: #ffffff; color: #ffffff;
line-height: 32rpx; line-height: 32rpx;
} }
.groupon-tag { .groupon-tag {
position: absolute; position: absolute;
left: 0; left: 0;
@ -515,14 +519,17 @@
color: #ffffff; color: #ffffff;
line-height: 32rpx; line-height: 32rpx;
} }
.goods-img { .goods-img {
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: #f5f5f5; background-color: #f5f5f5;
} }
.price-unit { .price-unit {
margin-right: -4px; margin-right: -4px;
} }
.sales-text { .sales-text {
display: table; display: table;
font-size: 24rpx; font-size: 24rpx;
@ -586,10 +593,12 @@
width: 100%; width: 100%;
height: 208rpx; height: 208rpx;
} }
.sm-goods-content { .sm-goods-content {
padding: 20rpx 16rpx; padding: 20rpx 16rpx;
box-sizing: border-box; box-sizing: border-box;
} }
.sm-goods-title { .sm-goods-title {
font-size: 26rpx; font-size: 26rpx;
color: #333; color: #333;
@ -619,6 +628,7 @@
color: #333; color: #333;
width: 100%; width: 100%;
} }
.md-goods-subtitle { .md-goods-subtitle {
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;
@ -669,6 +679,7 @@
// line-height: 36rpx; // line-height: 36rpx;
// width: 410rpx; // width: 410rpx;
} }
.lg-goods-subtitle { .lg-goods-subtitle {
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;
@ -695,6 +706,7 @@
font-size: 24rpx; font-size: 24rpx;
color: #ffffff; color: #ffffff;
} }
.tag-box { .tag-box {
width: 100%; width: 100%;
} }
@ -708,10 +720,12 @@
z-index: 1; z-index: 1;
width: 100%; width: 100%;
background-color: $white; background-color: $white;
.sl-goods-content { .sl-goods-content {
padding: 20rpx 20rpx; padding: 20rpx 20rpx;
box-sizing: border-box; box-sizing: border-box;
} }
.sl-img-box { .sl-img-box {
width: 100%; width: 100%;
height: 360rpx; height: 360rpx;
@ -722,6 +736,7 @@
color: #333; color: #333;
font-weight: 500; font-weight: 500;
} }
.sl-goods-subtitle { .sl-goods-subtitle {
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;

465
sheep/components/s-groupon-block/s-groupon-block.vue
View File

@ -1,171 +1,326 @@
<!-- 装修组件 - 拼团 --> <!-- 装修商品组件：商品卡片 -->
<template> <template>
<view> <!-- 商品卡片 -->
<view v-if="layoutType === 'threeCol'" class="goods-sm-box ss-flex ss-flex-wrap" :style="[{ margin: '-' + data.space + 'rpx' }]"> <view>
<view v-for="product in productList" class="goods-card-box" :key="product.id" :style="[{padding: data.space + 'rpx',},]"> <!-- 布局1. 单列大图（上图，下内容）-->
<s-goods-column <view
class="goods-card" v-if="layoutType === LayoutTypeEnum.ONE_COL_BIG_IMG && state.spuList.length"
size="sm" class="goods-sl-box"
:goodsFields="goodsFields" >
:tagStyle="badge" <view
:data="product" class="goods-box"
:titleColor="data.fields.name?.color" v-for="item in state.spuList"
:topRadius="data.borderRadiusTop" :key="item.id"
:bottomRadius="data.borderRadiusBottom" :style="[{ marginBottom: data.space * 2 + 'rpx' }]"
@click="sheep.$router.go('/pages/goods/groupon', { id: props.data.activityId, })"> >
</s-goods-column> <s-goods-column
</view> class=""
</view> size="sl"
<!-- 样式2 一行一个 图片左 文案右 --> :goodsFields="data.fields"
<view class="goods-box" v-if="layoutType === 'oneCol'"> :tagStyle="data.badge"
<view class="goods-list" v-for="(product, index) in productList" :key="index" :style="[{ marginBottom: space + 'px' }]"> :data="item"
<s-goods-column :titleColor="data.fields.name?.color"
class="goods-card" size="lg" :subTitleColor="data.fields.introduction.color"
:grouponTag="true" :topRadius="data.borderRadiusTop"
:goodsFields="goodsFields" :bottomRadius="data.borderRadiusBottom"
:tagStyle="badge" @click="sheep.$router.go('/pages/goods/groupon', { id: item.activityId })"
:data="product" >
:titleColor="data.fields.name?.color" <!-- 购买按钮 -->
:subTitleColor="data.fields.introduction?.color" <template v-slot:cart>
:topRadius="data.borderRadiusTop" <button class="ss-reset-button cart-btn" :style="[buyStyle]">
:bottomRadius="data.borderRadiusBottom" {{ btnBuy.type === 'text' ? btnBuy.text : '' }}
@click="sheep.$router.go('/pages/goods/groupon', { id: props.data.activityId, })"> </button>
<template v-slot:cart> </template>
<button class="ss-reset-button cart-btn" :style="[buyStyle]"> </s-goods-column>
{{ btnBuy?.type === 'text' ? btnBuy.text : '去拼团' }} </view>
</button> </view>
</template>
</s-goods-column> <!-- 布局2. 单列小图（左图，右内容） -->
</view> <view
</view> v-if="layoutType === LayoutTypeEnum.ONE_COL_SMALL_IMG && state.spuList.length"
</view> class="goods-lg-box"
>
<view
class="goods-box"
:style="[{ marginBottom: data.space + 'px' }]"
v-for="item in state.spuList"
:key="item.id"
>
<s-goods-column
class="goods-card"
size="lg"
:goodsFields="data.fields"
:data="item"
:tagStyle="data.badge"
:titleColor="data.fields.name?.color"
:subTitleColor="data.fields.introduction.color"
:topRadius="data.borderRadiusTop"
:bottomRadius="data.borderRadiusBottom"
@tap="sheep.$router.go('/pages/goods/groupon', { id: item.activityId })"
>
<!-- 购买按钮 -->
<template v-slot:cart>
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
{{ btnBuy.type === 'text' ? btnBuy.text : '' }}
</button>
</template>
</s-goods-column>
</view>
</view>
<!-- 布局3. 双列（每一列：上图，下内容）-->
<view
v-if="layoutType === LayoutTypeEnum.TWO_COL && state.spuList.length"
class="goods-md-wrap ss-flex ss-flex-wrap ss-col-top"
>
<view class="goods-list-box">
<view
class="left-list"
:style="[{ paddingRight: data.space + 'rpx', marginBottom: data.space + 'px' }]"
v-for="item in state.leftSpuList"
:key="item.id"
>
<s-goods-column
class="goods-md-box"
size="md"
:goodsFields="data.fields"
:tagStyle="data.badge"
:data="item"
:titleColor="data.fields.name?.color"
:subTitleColor="data.fields.introduction.color"
:topRadius="data.borderRadiusTop"
:bottomRadius="data.borderRadiusBottom"
:titleWidth="330 - marginLeft - marginRight"
@click="sheep.$router.go('/pages/goods/groupon', { id: item.activityId })"
@getHeight="calculateGoodsColumn($event, 'left')"
>
<!-- 购买按钮 -->
<template v-slot:cart>
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
{{ btnBuy.type === 'text' ? btnBuy.text : '' }}
</button>
</template>
</s-goods-column>
</view>
</view>
<view class="goods-list-box">
<view
class="right-list"
:style="[{ paddingLeft: data.space + 'rpx', marginBottom: data.space + 'px' }]"
v-for="item in state.rightSpuList"
:key="item.id"
>
<s-goods-column
class="goods-md-box"
size="md"
:goodsFields="data.fields"
:tagStyle="data.badge"
:data="item"
:titleColor="data.fields.name?.color"
:subTitleColor="data.fields.introduction.color"
:topRadius="data.borderRadiusTop"
:bottomRadius="data.borderRadiusBottom"
:titleWidth="330 - marginLeft - marginRight"
@click="sheep.$router.go('/pages/goods/groupon', { id: item.activityId })"
@getHeight="calculateGoodsColumn($event, 'right')"
>
<!-- 购买按钮 -->
<template v-slot:cart>
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
{{ btnBuy.type === 'text' ? btnBuy.text : '' }}
</button>
</template>
</s-goods-column>
</view>
</view>
</view>
</view>
</template> </template>
<script setup> <script setup>
/** /**
* 拼团 * 商品卡片
*/ */
import { import { computed, onMounted, reactive, ref } from 'vue';
computed, import sheep from '@/sheep';
onMounted, import CombinationApi from '@/sheep/api/promotion/combination';
reactive, import SpuApi from '@/sheep/api/product/spu';
ref import spu from '@/sheep/api/product/spu';
} from 'vue';
import sheep from '@/sheep';
import SpuApi from "@/sheep/api/product/spu";
import CombinationApi from "@/sheep/api/promotion/combination";
// 接收参数 // 布局类型
const props = defineProps({ const LayoutTypeEnum = {
// 装修数据 // 单列大图
data: { ONE_COL_BIG_IMG: 'oneColBigImg',
type: Object, // 双列
default: () => ({}), TWO_COL: 'twoCol',
}, // 单列小图
// 装修样式 ONE_COL_SMALL_IMG: 'oneColSmallImg',
styles: { };
type: Object,
default: () => ({}),
},
});
// 设置相关信息是否显示
const goodsFields = reactive({
// 商品价格
price: { show: true },
// 库存
stock: { show: true },
// 商品名称
name: { show: true },
// 商品介绍
introduction: { show: true },
// 市场价
marketPrice: { show: true },
// 销量
salesCount: { show: true },
});
let { const state = reactive({
layoutType, spuList: [],
badge, leftSpuList: [],
btnBuy, rightSpuList: [],
space, });
} = props.data; const props = defineProps({
let { data: {
marginLeft, type: Object,
marginRight default() {},
} = props.styles; },
styles: {
type: Object,
default() {},
},
});
// 购买按钮样式（暂未实现） const { layoutType, btnBuy, activityIds } = props.data || {};
const buyStyle = computed(() => { const { marginLeft, marginRight } = props.styles || {};
let btnBuy = props.data.btnBuy;
if (btnBuy?.type === 'text') {
return {
background: `linear-gradient(to right, ${btnBuy.bgBeginColor}, ${btnBuy.bgEndColor})`,
};
}
if (btnBuy?.type === 'img') { // 购买按钮样式
return { const buyStyle = computed(() => {
width: '54rpx', if (btnBuy.type === 'text') {
height: '54rpx', // 文字按钮：线性渐变背景颜色
background: `url(${sheep.$url.cdn(btnBuy.imgUrl)}) no-repeat`, return {
backgroundSize: '100% 100%', background: `linear-gradient(to right, ${btnBuy.bgBeginColor}, ${btnBuy.bgEndColor})`,
}; };
} }
}); if (btnBuy.type === 'img') {
// 图片按钮
return {
width: '54rpx',
height: '54rpx',
background: `url(${sheep.$url.cdn(btnBuy.imgUrl)}) no-repeat`,
backgroundSize: '100% 100%',
};
}
});
const productList = ref([]); //region 商品瀑布流布局
onMounted(async () => { // 下一个要处理的商品索引
// todo：@owen 与Yudao结构不一致，待重构 let count = 0;
const { // 左列的高度
data: activity let leftHeight = 0;
} = await CombinationApi.getCombinationActivity(props.data.activityId); // 右列的高度
const { let rightHeight = 0;
data: spu
} = await SpuApi.getSpuDetail(activity.spuId) /**
// 循环活动信息，赋值拼团最低价格 * 计算商品在左列还是右列
activity.products.forEach((product) => { * @param height 商品的高度
spu.price = Math.min(spu.price, product.combinationPrice); // 设置 SPU 的最低价格 * @param where 添加到哪一列
}); */
productList.value = [spu]; function calculateGoodsColumn(height = 0, where = 'left') {
}); // 处理完
if (!state.spuList[count]) return;
// 增加列的高度
if (where === 'left') leftHeight += height;
if (where === 'right') rightHeight += height;
// 添加到矮的一列
if (leftHeight <= rightHeight) {
state.leftSpuList.push(state.spuList[count]);
} else {
state.rightSpuList.push(state.spuList[count]);
}
// 计数
count++;
}
//endregion
/**
* 根据商品编号列表，获取商品列表
* @param ids 商品编号列表
* @return {Promise<undefined>} 商品列表
*/
async function getCombinationActivityDetailList(ids) {
const { data } = await CombinationApi.getCombinationActivityDetailList(ids);
return data;
}
/**
* 根据商品编号，获取商品详情
* @param ids 商品编号列表
* @return {Promise<undefined>} 商品列表
*/
async function getSpuDetail(ids) {
const { data: spu } = await SpuApi.getSpuDetail(ids);
return spu;
}
// 初始化
onMounted(async () => {
// 加载活动列表
const activityList = await getCombinationActivityDetailList(activityIds.join(','));
// 循环获取活动商品SPU详情并添加到spuList
for (const activity of activityList) {
state.spuList.push(await getSpuDetail(activity.spuId));
}
// 循环活动列表
activityList.forEach((activity) => {
// 提取活动价格
const combinationPrice = activity.combinationPrice || Infinity;
// 查找对应的 spu 并更新价格
const spu = state.spuList.find((spu) => activity.spuId === spu.id);
if (spu) {
// 赋值最低价格
spu.price = Math.min(combinationPrice, spu.price);
// 赋值活动ID，为了点击跳转详情页
spu.activityId = activity.id;
}
});
// 只有双列布局时需要
if (layoutType === LayoutTypeEnum.TWO_COL) {
// 分列
calculateGoodsColumn();
}
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.goods-list { .goods-md-wrap {
position: relative; width: 100%;
}
.cart-btn { .goods-list-box {
position: absolute; width: 50%;
bottom: 10rpx; box-sizing: border-box;
right: 20rpx;
z-index: 11;
height: 50rpx;
line-height: 50rpx;
padding: 0 20rpx;
border-radius: 25rpx;
font-size: 24rpx;
color: #fff;
background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
}
}
.goods-list { .left-list {
&:nth-last-of-type(1) { &:nth-last-child(1) {
margin-bottom: 0 !important; margin-bottom: 0 !important;
} }
} }
.goods-sm-box { .right-list {
margin: 0 auto; &:nth-last-child(1) {
box-sizing: border-box; margin-bottom: 0 !important;
}
}
}
.goods-card-box { .goods-box {
flex-shrink: 0; &:nth-last-of-type(1) {
overflow: hidden; margin-bottom: 0 !important;
width: 33.3%; }
box-sizing: border-box; }
}
} .goods-md-box,
</style> .goods-sl-box,
.goods-lg-box {
position: relative;
.cart-btn {
position: absolute;
bottom: 18rpx;
right: 20rpx;
z-index: 11;
height: 50rpx;
line-height: 50rpx;
padding: 0 20rpx;
border-radius: 25rpx;
font-size: 24rpx;
color: #fff;
}
}
</style>

4
sheep/components/s-live-block/s-live-block.vue
View File

@ -70,8 +70,8 @@
default() {}, default() {},
}, },
}); });
const { mode, goodsFields, mpliveIds } = props.data ?? {}; const { mode, goodsFields, mpliveIds } = props.data || {};
const { marginLeft, marginRight } = props.styles ?? {}; const { marginLeft, marginRight } = props.styles || {};
async function getLiveListByIds(ids) { async function getLiveListByIds(ids) {
const { data } = await sheep.$api.app.mplive.getRoomList(ids); const { data } = await sheep.$api.app.mplive.getRoomList(ids);

2
sheep/helper/index.js
View File

@ -621,7 +621,7 @@ function setProperty(obj, key, value) {
function page() { function page() {
const pages = getCurrentPages(); const pages = getCurrentPages();
// 某些特殊情况下(比如页面进行redirectTo时的一些时机)，pages可能为空数组 // 某些特殊情况下(比如页面进行redirectTo时的一些时机)，pages可能为空数组
return `/${pages[pages.length - 1]?.route ?? ''}`; return `/${pages[pages.length - 1]?.route || ''}`;
} }
/** /**

5
sheep/platform/share.js
View File

@ -178,7 +178,7 @@ const decryptSpm = (spm) => {
}; };
// 绑定推广员 // 绑定推广员
const bindBrokerageUser = async (val= undefined) => { const bindBrokerageUser = async (val = undefined) => {
try { try {
const shareId = val || uni.getStorageSync('shareId'); const shareId = val || uni.getStorageSync('shareId');
if (!shareId) { if (!shareId) {
@ -186,7 +186,8 @@ const bindBrokerageUser = async (val= undefined) => {
} }
await BrokerageApi.bindBrokerageUser({ bindUserId: shareId }); await BrokerageApi.bindBrokerageUser({ bindUserId: shareId });
uni.removeStorageSync('shareId'); uni.removeStorageSync('shareId');
} catch { } catch (e) {
console.error(e);
} }
}; };