mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2025-12-22 02:15:55 +08:00
适配重构促销
This commit is contained in:
paulGao
@@ -4,12 +4,21 @@
|
||||
<view class="goods-detail">
|
||||
<view class="detail_padding">
|
||||
<div class="goods-detail-box">
|
||||
<div class="goods-detail-item goods-active">商品介绍
|
||||
</div>
|
||||
<div class="goods-detail-item goods-active">商品介绍</div>
|
||||
</div>
|
||||
<u-empty class="empty" text="暂无商品介绍" mode="data" v-if="!res.mobileIntro"></u-empty>
|
||||
<u-parse class="vhtml" :lazy-load="true" :use-cache="true" :show-with-animation="true"
|
||||
:html="res.mobileIntro"></u-parse>
|
||||
<u-empty
|
||||
class="empty"
|
||||
text="暂无商品介绍"
|
||||
mode="data"
|
||||
v-if="!res.mobileIntro"
|
||||
></u-empty>
|
||||
<u-parse
|
||||
class="vhtml"
|
||||
:lazy-load="true"
|
||||
:use-cache="true"
|
||||
:show-with-animation="true"
|
||||
:html="res.mobileIntro"
|
||||
></u-parse>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -24,12 +33,22 @@
|
||||
<div class="param-list" v-if="goodsParams.length == 0">
|
||||
<u-empty text="暂无商品参数" mode="list"></u-empty>
|
||||
</div>
|
||||
<div class="params-group" v-for="(group,groupIndex) in goodsParams" :key="groupIndex">
|
||||
<view style="font-weight: bold;margin-left: 10px;">{{group.groupName}}</view>
|
||||
<div
|
||||
class="params-group"
|
||||
v-for="(group, groupIndex) in goodsParams"
|
||||
:key="groupIndex"
|
||||
>
|
||||
<view style="font-weight: bold; margin-left: 10px">{{
|
||||
group.groupName
|
||||
}}</view>
|
||||
<div class="param-list">
|
||||
<div class="param-item" v-for="(param,index) in group.goodsParamsItemDTOList" :key="index">
|
||||
<div class="param-left">{{param.paramName}}</div>
|
||||
<div class="param-right">{{param.paramValue}}</div>
|
||||
<div
|
||||
class="param-item"
|
||||
v-for="(param, index) in group.goodsParamsItemDTOList"
|
||||
:key="index"
|
||||
>
|
||||
<div class="param-left">{{ param.paramName }}</div>
|
||||
<div class="param-right">{{ param.paramValue }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -49,7 +68,6 @@ export default {
|
||||
},
|
||||
props: ["res", "goodsId", "goodsParams"],
|
||||
async mounted() {
|
||||
console.log(this.res);
|
||||
let res = await getGoodsMessage(this.goodsId);
|
||||
if (res.data.success) {
|
||||
this.goodsDetail = res.data.result;
|
||||
@@ -131,11 +149,7 @@ export default {
|
||||
width: 52rpx;
|
||||
height: 6rpx;
|
||||
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
$price-color,
|
||||
$price-light-color
|
||||
);
|
||||
background-image: linear-gradient(90deg, $price-color, $price-light-color);
|
||||
}
|
||||
}
|
||||
> .goods-detail-item {
|
||||
|
||||
@@ -1,23 +1,23 @@
|
||||
<template>
|
||||
<view class="group-list">
|
||||
<view class="group-name">拼购列表</view>
|
||||
<view v-if="assembleOrder.length !=0">
|
||||
<view class="group-item" v-for="(order,index) in assembleOrder" :key="index">
|
||||
<view v-if="assembleOrder.length != 0">
|
||||
<view class="group-item" v-for="(order, index) in assembleOrder" :key="index">
|
||||
<view class="group-item-user">
|
||||
<u-image shape="circle" width="40px" height="40px" :src="order.face"></u-image>
|
||||
<span class="group-item-name">{{order.nickName | noPassByName}}</span>
|
||||
<span class="group-item-name">{{ order.nickName | noPassByName }}</span>
|
||||
</view>
|
||||
<view>
|
||||
<span class="group-item-name">还差{{ order.toBeGroupedNum}}人成团</span>
|
||||
<span class="group-item-name">还差{{ order.toBeGroupedNum }}人成团</span>
|
||||
</view>
|
||||
<view>
|
||||
<u-button size="mini" :custom-style="customStyle" @click="buy(order)">去参团</u-button>
|
||||
<u-button size="mini" :custom-style="customStyle" @click="buy(order)"
|
||||
>去参团</u-button
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view v-else class="nomore">
|
||||
|
||||
<u-empty text="暂无拼团信息" mode="list"></u-empty>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -1,61 +1,105 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
<div v-for="(promotion, promotion_index) in res" :key="promotion_index">
|
||||
<div class="showBox" v-if="promotion.__key == 'SECKILL' || promotion.__key =='GROUPBUY' || promotion.__key == 'PINTUAN'">
|
||||
<div
|
||||
class="showBox"
|
||||
v-if="
|
||||
promotion.__key == 'SECKILL' ||
|
||||
promotion.__key == 'GROUPBUY' ||
|
||||
promotion.__key == 'PINTUAN'
|
||||
"
|
||||
>
|
||||
<view class="group-wrapper">
|
||||
<div class="u-group-row">
|
||||
<view :span="8" class="showBox_L">
|
||||
<view class="u-group-flex">
|
||||
|
||||
<!-- 限时抢购 -->
|
||||
<view class="u-group-flex-left" v-if="promotion.__key == 'SECKILL' ">
|
||||
|
||||
<span class="u-group-flex-left-span" v-if="detail.promotionPrice!=undefined">
|
||||
￥ <span class="flex-price"> {{ formatPrice(detail.promotionPrice)[0]}}.{{ formatPrice(detail.promotionPrice)[1]}}</span>
|
||||
|
||||
<view class="u-group-flex-left" v-if="promotion.__key == 'SECKILL'">
|
||||
<span
|
||||
class="u-group-flex-left-span"
|
||||
v-if="detail.promotionPrice != undefined"
|
||||
>
|
||||
￥
|
||||
<span class="flex-price">
|
||||
{{ formatPrice(detail.promotionPrice)[0] }}.{{
|
||||
formatPrice(detail.promotionPrice)[1]
|
||||
}}</span
|
||||
>
|
||||
</span>
|
||||
<view class="u-group-flex" v-if="detail.price!=undefined">
|
||||
<span class="old-price">￥{{ formatPrice(detail.price)[0]}}.{{ formatPrice(detail.price)[1]}}</span>
|
||||
<view class="u-group-flex" v-if="detail.price != undefined">
|
||||
<span class="old-price"
|
||||
>￥{{ formatPrice(detail.price)[0] }}.{{
|
||||
formatPrice(detail.price)[1]
|
||||
}}</span
|
||||
>
|
||||
<view class="promotion">限时抢购</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 团购 -->
|
||||
<view class="u-group-flex-left" v-if="promotion.__key == 'GROUPBUY' ">
|
||||
<view class="u-group-flex-left" v-if="promotion.__key == 'GROUPBUY'">
|
||||
<span class="u-group-flex-left-span">
|
||||
<span class="flex-price"
|
||||
v-if="promotion.groupbuy_goods_vo.price !=undefined">￥{{ formatPrice(promotion.groupbuy_goods_vo.price )[0]}}.{{ formatPrice(promotion.groupbuy_goods_vo.price )[1]}}</span>
|
||||
<span
|
||||
class="flex-price"
|
||||
v-if="promotion.groupbuy_goods_vo.price != undefined"
|
||||
>￥{{ formatPrice(promotion.groupbuy_goods_vo.price)[0] }}.{{
|
||||
formatPrice(promotion.groupbuy_goods_vo.price)[1]
|
||||
}}</span
|
||||
>
|
||||
<!-- <span v-if="promotion.point">+{{promotion.point}}积分</span> -->
|
||||
</span>
|
||||
<view class="u-group-flex">
|
||||
<span class="old-price"
|
||||
v-if="promotion.groupbuy_goods_vo.original_price!=undefined">￥{{ formatPrice(promotion.groupbuy_goods_vo.original_price)[0]}}.{{ formatPrice(promotion.groupbuy_goods_vo.original_price)[1]}}</span>
|
||||
<span
|
||||
class="old-price"
|
||||
v-if="promotion.groupbuy_goods_vo.original_price != undefined"
|
||||
>￥{{
|
||||
formatPrice(promotion.groupbuy_goods_vo.original_price)[0]
|
||||
}}.{{
|
||||
formatPrice(promotion.groupbuy_goods_vo.original_price)[1]
|
||||
}}</span
|
||||
>
|
||||
<view class="promotion">团购活动</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-group-flex-left" v-if="promotion.__key == 'PINTUAN' ">
|
||||
|
||||
<span class="u-group-flex-left-span" v-if="detail.promotionPrice != undefined">
|
||||
￥<span class="flex-price"> {{ formatPrice(detail.promotionPrice)[0]}}.</span>{{ formatPrice(detail.promotionPrice)[1]}}
|
||||
<view class="u-group-flex-left" v-if="promotion.__key == 'PINTUAN'">
|
||||
<span
|
||||
class="u-group-flex-left-span"
|
||||
v-if="detail.promotionPrice != undefined"
|
||||
>
|
||||
￥<span class="flex-price">
|
||||
{{ formatPrice(detail.promotionPrice)[0] }}.</span
|
||||
>{{ formatPrice(detail.promotionPrice)[1] }}
|
||||
</span>
|
||||
<view class="u-group-flex" v-if="detail.price != undefined">
|
||||
<span class="old-price">￥{{ formatPrice(detail.price)[0]}}.{{ formatPrice(detail.price)[1]}}</span>
|
||||
<span class="old-price"
|
||||
>￥{{ formatPrice(detail.price)[0] }}.{{
|
||||
formatPrice(detail.price)[1]
|
||||
}}</span
|
||||
>
|
||||
<view class="promotion">拼团活动</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 拼团右侧 -->
|
||||
<view class="u-group-flex-right" v-if="promotion.__key == 'PINTUAN' ">
|
||||
<span class="group-bag">{{promotion.requiredNum}}人拼团 </span>
|
||||
<span class="group-bag">限购{{promotion.limitNum}}件</span>
|
||||
<view class="u-group-flex-right" v-if="promotion.__key == 'PINTUAN'">
|
||||
<span class="group-bag">{{ promotion.requiredNum }}人拼团 </span>
|
||||
<span class="group-bag">限购{{ promotion.limitNum }}件</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="showBox_R" v-if="promotion && promotion.endTime">
|
||||
<u-tag :text="getIsTimer(promotion)" size="mini" type="error" />
|
||||
<u-count-down :hide-zero-day="true" font-size="25" color="#fff" bg-color="#f71471" separator-size="25" separator-color="#f71471" :show-hours="true" :show-minutes="true"
|
||||
:timestamp="getCountDownTime(promotion.endTime)"></u-count-down>
|
||||
<u-count-down
|
||||
:hide-zero-day="true"
|
||||
font-size="25"
|
||||
color="#fff"
|
||||
bg-color="#f71471"
|
||||
separator-size="25"
|
||||
separator-color="#f71471"
|
||||
:show-hours="true"
|
||||
:show-minutes="true"
|
||||
:timestamp="getCountDownTime(promotion.endTime)"
|
||||
></u-count-down>
|
||||
</view>
|
||||
</div>
|
||||
</view>
|
||||
@@ -105,13 +149,12 @@ export default {
|
||||
return val.toFixed(2).split(".");
|
||||
},
|
||||
getCountDownTime(val) {
|
||||
let date = new Date(val.replace(/-/g, "/"))
|
||||
let date = new Date(val.replace(/-/g, "/"));
|
||||
let timeSimple = new Date(date).getTime() / 1000;
|
||||
return timeSimple - new Date().getTime() / 1000;
|
||||
},
|
||||
getIsTimer(val) {
|
||||
var timestamp = new Date().getTime();
|
||||
|
||||
|
||||
if (timestamp < val.start_time) {
|
||||
this.startTimer = true;
|
||||
|
||||
@@ -1,33 +1,37 @@
|
||||
<template>
|
||||
<view class="wrapper">
|
||||
|
||||
<div class="coupon-empty" v-if="!res">暂无优惠券</div>
|
||||
<view class="coupon-List" v-if="res && item.__key=='COUPON'" v-for="(item, index) in res" :key="index">
|
||||
|
||||
<view class="coupon-List" v-for="(item, index) in couponRes" :key="index">
|
||||
<view class="coupon-item">
|
||||
<view class="top">
|
||||
<div class="price">
|
||||
|
||||
<span v-if="item.couponType == 'DISCOUNT'">{{ item.couponDiscount }}折</span>
|
||||
<span v-if="item.couponType == 'PRICE'">￥{{ item.price | unitPrice }}</span>
|
||||
</div>
|
||||
<view class="text">
|
||||
|
||||
<div class="coupon-List-title">
|
||||
<view v-if="item.scopeType">
|
||||
<span v-if="item.scopeType == 'ALL' && item.id == 'platform'">全平台</span>
|
||||
<span v-if="item.scopeType == 'ALL' && item.id == 'platform'"
|
||||
>全平台</span
|
||||
>
|
||||
<span v-if="item.scopeType == 'PORTION_CATEGORY'">仅限品类</span>
|
||||
<view v-else>{{ item.storeName == 'platform' ? '全平台' :item.storeName+'店铺' }}使用</view>
|
||||
<view v-else
|
||||
>{{
|
||||
item.storeName == "platform" ? "全平台" : item.storeName + "店铺"
|
||||
}}使用</view
|
||||
>
|
||||
</view>
|
||||
</div>
|
||||
<div>满{{ item.consumeThreshold | unitPrice }}可用</div>
|
||||
</view>
|
||||
<view class="lingqu-btn" @click="getCoupon(item)">
|
||||
<div :class="yhqFlag ? 'cur' : ''">{{ yhqFlag ? '已领取或领完' : '立即领取' }}</div>
|
||||
<view class="lingqu-btn" @click="getCoupon(item, index)">
|
||||
<div :class="yhqFlag[index] ? 'cur' : ''">
|
||||
{{ yhqFlag[index] ? "已领取或领完" : "立即领取" }}
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="time">{{ item.startTime }} - {{item.endTime }}</view>
|
||||
<view class="time">{{ item.startTime }} - {{ item.endTime }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -37,7 +41,8 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
yhqFlag: false, //获取优惠券判断是否点击
|
||||
yhqFlag: [], //获取优惠券判断是否点击
|
||||
couponRes: {},
|
||||
};
|
||||
},
|
||||
props: {
|
||||
@@ -52,7 +57,9 @@ export default {
|
||||
if (this.res && this.res.length != 0) {
|
||||
Object.keys(this.res).forEach((item) => {
|
||||
let key = item.split("-")[0];
|
||||
this.res[item].__key = key;
|
||||
if (key === "COUPON") {
|
||||
this.couponRes[item] = this?.res[item];
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
@@ -61,9 +68,8 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
// 提交优惠券
|
||||
getCoupon(item) {
|
||||
this.yhqFlag = true;
|
||||
|
||||
getCoupon(item, index) {
|
||||
this.yhqFlag[index] = true;
|
||||
this.$emit("getCoupon", item);
|
||||
},
|
||||
},
|
||||
|
||||
@@ -1,50 +1,65 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
<view v-for="(promotionItem,promotionIndex) in promotion" :key="promotionIndex" class="promotion_row" @click="shutMask(1)">
|
||||
<view v-if="res!=null" v-for="(item, index) in Object.keys(res)" :key="index">
|
||||
<div class="promotion_col" v-if="item.split('-')[0] == promotionItem.value && item.split('-')[0] == 'FULL_DISCOUNT'">
|
||||
<view
|
||||
v-for="(promotionItem, promotionIndex) in promotion"
|
||||
:key="promotionIndex"
|
||||
class="promotion_row"
|
||||
@click="shutMask(1)"
|
||||
>
|
||||
<view v-if="res != null" v-for="(item, index) in Object.keys(res)" :key="index">
|
||||
<div
|
||||
class="promotion_col"
|
||||
v-if="
|
||||
item.split('-')[0] == promotionItem.value &&
|
||||
item.split('-')[0] == 'FULL_DISCOUNT'
|
||||
"
|
||||
>
|
||||
<!-- 满减，折扣 -->
|
||||
<div class="flex">
|
||||
<view class="deg_tag">{{promotionItem.title}}</view>
|
||||
<view class="deg_tag">{{ promotionItem.title }}</view>
|
||||
<div class="text proText">满{{ res[item].fullMoney }}元，立享优惠</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="promotion_col" v-if="item.split('-')[0] == promotionItem.value && item.split('-')[0] == 'PINTUAN'">
|
||||
<div
|
||||
class="promotion_col"
|
||||
v-if="
|
||||
item.split('-')[0] == promotionItem.value && item.split('-')[0] == 'PINTUAN'
|
||||
"
|
||||
>
|
||||
<!-- 拼团 -->
|
||||
<div class="flex">
|
||||
<view class="deg_tag">{{promotionItem.title}}</view>
|
||||
<view class="deg_tag">{{ promotionItem.title }}</view>
|
||||
<div class="text proText">{{ res[item].promotionName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="promotion_col" v-if="item.split('-')[0] == promotionItem.value && item.split('-')[0] == 'SECKILL'">
|
||||
<div
|
||||
class="promotion_col"
|
||||
v-if="
|
||||
item.split('-')[0] == promotionItem.value && item.split('-')[0] == 'SECKILL'
|
||||
"
|
||||
>
|
||||
<!-- 限时抢购 -->
|
||||
<div class="flex">
|
||||
<view class="deg_tag">{{promotionItem.title}}</view>
|
||||
<view class="deg_tag">{{ promotionItem.title }}</view>
|
||||
<div class="text proText">{{ res[item].promotionName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="promotion_row" style="display:inline;">
|
||||
<view class="promotion_row" style="display: inline">
|
||||
<view>
|
||||
<div class="promotion_col coupon" v-if="couponList && promotionIndex ==1">
|
||||
<div class="promotion_col coupon" v-if="couponList && promotionIndex == 1">
|
||||
<!-- 优惠券 -->
|
||||
|
||||
<div>
|
||||
<view class="deg_tag">优惠券</view>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if=" this.res != null && Object.keys(res).length == 0">
|
||||
暂无促销信息
|
||||
</view>
|
||||
|
||||
<view v-if="this.res != null && Object.keys(res).length == 0"> 暂无促销信息 </view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@@ -69,7 +84,6 @@ export default {
|
||||
handler() {
|
||||
if (this.res && this.res.length != 0 && this.res != null) {
|
||||
Object.keys(this.res).forEach((item) => {
|
||||
|
||||
let key = item.split("-")[0];
|
||||
this.res[item].__key = key;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user