营销：适配商城装修组件【拼团】（待重写）
owen
parent
cfc04d9c82
commit
8755d64683
|
|
@ -0,0 +1,67 @@
|
|||
import request2 from "@/sheep/request2";
|
||||
|
||||
// 拼团 API
|
||||
const CombinationApi = {
|
||||
// 获得拼团活动列表
|
||||
getCombinationActivityList: (count) => {
|
||||
return request2({
|
||||
url: "promotion/combination-activity/list",
|
||||
method: 'GET',
|
||||
params: {count}
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团活动分页
|
||||
getCombinationActivityPage: (params) => {
|
||||
return request2({
|
||||
url: "promotion/combination-activity/page",
|
||||
method: 'GET',
|
||||
params
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团活动明细
|
||||
getCombinationActivity: (id) => {
|
||||
return request2({
|
||||
url: "promotion/combination-activity/get-detail",
|
||||
method: 'GET',
|
||||
params: {
|
||||
id
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获得最近 n 条拼团记录（团长发起的）
|
||||
getHeadCombinationRecordList: (activityId, status, count) => {
|
||||
return request2({
|
||||
url: "promotion/combination-record/get-head-list",
|
||||
method: 'GET',
|
||||
params: {
|
||||
activityId,
|
||||
status,
|
||||
count
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团记录明细
|
||||
getCombinationRecordDetail: (id) => {
|
||||
return request2({
|
||||
url: "promotion/combination-record/get-detail",
|
||||
method: 'GET',
|
||||
params: {
|
||||
id
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团记录的概要信息
|
||||
getCombinationRecordSummary: () => {
|
||||
return request2({
|
||||
url: "promotion/combination-record/get-summary",
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export default CombinationApi
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
<s-goods-shelves v-if="type === 'ProductList'" :data="data" :styles="styles" />
|
||||
|
||||
<!-- 营销组件：拼团 -->
|
||||
<s-groupon-block v-if="type === 'groupon'" :data="data" :styles="styles" />
|
||||
<s-groupon-block v-if="type === 'PromotionCombination'" :data="data" :styles="styles" />
|
||||
<!-- 营销组件：秒杀 -->
|
||||
<s-seckill-block v-if="type === 'PromotionSeckill'" :data="data" :styles="styles" />
|
||||
<!-- 营销组件：积分商城（模式不一样，无法适配） -->
|
||||
|
|
|
|||
|
|
@ -2,13 +2,13 @@
|
|||
<template>
|
||||
<view>
|
||||
<view
|
||||
v-if="mode === 1"
|
||||
v-if="layoutType === 'threeCol'"
|
||||
class="goods-sm-box ss-flex ss-flex-wrap"
|
||||
:style="[{ margin: '-' + data.space + 'rpx' }]"
|
||||
>
|
||||
<view
|
||||
v-for="item in goodsList"
|
||||
:key="item.id"
|
||||
v-for="product in productList"
|
||||
:key="product.id"
|
||||
class="goods-card-box"
|
||||
:style="[
|
||||
{
|
||||
|
|
@ -19,15 +19,15 @@
|
|||
<s-goods-column
|
||||
class="goods-card"
|
||||
size="sm"
|
||||
:goodsFields="goodsFields"
|
||||
:goodsFields="data.fields"
|
||||
:tagStyle="tagStyle"
|
||||
:data="item"
|
||||
:titleColor="goodsFields.title?.color"
|
||||
:data="product"
|
||||
:titleColor="data.fields.name?.color"
|
||||
:topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom"
|
||||
@click="
|
||||
sheep.$router.go('/pages/goods/groupon', {
|
||||
id: item.id,
|
||||
id: product.id,
|
||||
activity_id: props.data.activityId,
|
||||
})
|
||||
"
|
||||
|
|
@ -35,33 +35,33 @@
|
|||
</view>
|
||||
</view>
|
||||
<!-- 样式2 一行一个 图片左 文案右 -->
|
||||
<view class="goods-box" v-if="mode == 2">
|
||||
<view class="goods-box" v-if="layoutType === 'oneCol'">
|
||||
<view
|
||||
class="goods-list"
|
||||
v-for="(item, index) in goodsList"
|
||||
v-for="(product, index) in productList"
|
||||
:key="index"
|
||||
:style="[{ marginBottom: space + 'px' }]"
|
||||
>
|
||||
<s-goods-column
|
||||
class="goods-card"
|
||||
size="lg"
|
||||
:includes="goodsFields"
|
||||
:goodsFields="data.fields"
|
||||
:tagStyle="tagStyle"
|
||||
:data="item"
|
||||
:titleColor="goodsFields.title?.color"
|
||||
:subTitleColor="goodsFields.subtitle.color"
|
||||
:data="product"
|
||||
:titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction?.color"
|
||||
:topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom"
|
||||
@click="
|
||||
sheep.$router.go('/pages/goods/groupon', {
|
||||
id: item.id,
|
||||
id: product.id,
|
||||
activity_id: props.data.activityId,
|
||||
})
|
||||
"
|
||||
>
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
|
||||
{{ buyNowStyle.mode === 1 ? buyNowStyle.text : '' }}
|
||||
{{ btnBuy?.type === 'text' ? btnBuy.text : '' }}
|
||||
</button>
|
||||
</template>
|
||||
</s-goods-column>
|
||||
|
|
@ -73,13 +73,11 @@
|
|||
<script setup>
|
||||
/**
|
||||
* 拼团
|
||||
*
|
||||
* @property {Array} list - 商品列表
|
||||
*
|
||||
*
|
||||
*/
|
||||
import { computed, onMounted, ref } from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import SpuApi from "@/sheep/api/product/spu";
|
||||
import CombinationApi from "@/sheep/api/promotion/combination";
|
||||
|
||||
// 接收参数
|
||||
const props = defineProps({
|
||||
|
|
@ -93,32 +91,34 @@
|
|||
},
|
||||
});
|
||||
|
||||
let { mode, tagStyle, buyNowStyle, goodsFields, space } = props.data;
|
||||
let { layoutType, tagStyle, btnBuy, space } = props.data;
|
||||
let { marginLeft, marginRight } = props.styles;
|
||||
|
||||
// 购买按钮样式
|
||||
const buyStyle = computed(() => {
|
||||
let buyNowStyle = props.data.buyNowStyle;
|
||||
if (buyNowStyle.mode == 1) {
|
||||
let btnBuy = props.data.btnBuy;
|
||||
if (btnBuy?.type === 'text') {
|
||||
return {
|
||||
background: `linear-gradient(to right, ${buyNowStyle.color1}, ${buyNowStyle.color2})`,
|
||||
background: `linear-gradient(to right, ${btnBuy.bgBeginColor}, ${btnBuy.bgEndColor})`,
|
||||
};
|
||||
}
|
||||
|
||||
if (buyNowStyle.mode == 2) {
|
||||
if (btnBuy?.type === 'img') {
|
||||
return {
|
||||
width: '54rpx',
|
||||
height: '54rpx',
|
||||
background: `url(${sheep.$url.cdn(buyNowStyle.src)}) no-repeat`,
|
||||
background: `url(${sheep.$url.cdn(btnBuy.imgUrl)}) no-repeat`,
|
||||
backgroundSize: '100% 100%',
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
const goodsList = ref([]);
|
||||
const productList = ref([]);
|
||||
onMounted(async () => {
|
||||
let { data } = await sheep.$api.goods.activity({ activity_id: props.data.activityId });
|
||||
goodsList.value = data;
|
||||
// todo：@owen 与Yudao结构不一致，待重构
|
||||
const { data: activity } = await CombinationApi.getCombinationActivity(props.data.activityId);
|
||||
const { data: spu } = await SpuApi.getSpuDetail(activity.spuId)
|
||||
productList.value = [spu];
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -100,12 +100,12 @@
|
|||
// 购买按钮样式
|
||||
const buyStyle = computed(() => {
|
||||
let btnBuy = props.data.btnBuy;
|
||||
if (btnBuy.type === 'text') {
|
||||
if (btnBuy?.type === 'text') {
|
||||
return {
|
||||
background: `linear-gradient(to right, ${btnBuy.bgBeginColor}, ${btnBuy.bgEndColor})`,
|
||||
};
|
||||
}
|
||||
if (btnBuy.type === 'img') {
|
||||
if (btnBuy?.type === 'img') {
|
||||
return {
|
||||
width: '54rpx',
|
||||
height: '54rpx',
|
||||
|
|
|
|||
Loading…
Reference in New Issue