charles/frontend-app
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

feat：优惠券

Browse Source
This commit is contained in:
charles
2026-06-15 14:20:38 +08:00
parent cac63ff675
commit 3523cc3a21
14 changed files with 688 additions and 1137 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/other_package/productInfo/productInfo.vue
+160 -252
View File
@@ -3,73 +3,52 @@
<!-- <image v-if="tmpImg" :src="tmpImg" style="width:620rpx;height:960rpx"></image> -->
<!-- 头部产品描述图 -->
<view class="product_info_header_warp">
<up-swiper
:list="swiperList"
class="product_info_header_swiper"
@click="onSwiper"
@change="(e) => (currentNum = e.current)"
>
<up-swiper :list="swiperList" class="product_info_header_swiper" @click="onSwiper"
@change="(e) => (currentNum = e.current)">
<template #indicator>
<view class="indicator-num">
<text class="indicator-num__text"
>{{ currentNum + 1 }}/{{ swiperList.length }}</text
>
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
</view>
</template>
</up-swiper>
<view class="img_comm left_warp">
<up-image
src="/static/common/left_b_st.png"
width="30"
height="30"
bgColor="#f1f6ff00"
v-if="!isShareUrl"
@click="jumpLeft"
></up-image>
<up-image src="/static/common/left_b_st.png" width="30" height="30" bgColor="#f1f6ff00" v-if="!isShareUrl"
@click="jumpLeft"></up-image>
</view>
<view class="img_comm right_warp">
<up-image
v-if="!isShareUrl"
src="/static/common/share_st.png"
width="30"
height="30"
bgColor="#f1f6ff00"
@click="jumpShare"
></up-image>
<up-image v-if="!isShareUrl" src="/static/common/share_st.png" width="30" height="30" bgColor="#f1f6ff00"
@click="jumpShare"></up-image>
</view>
</view>
<!-- 数据详情 -->
<view class="product_content_warp">
<!-- 标题，系列 -->
<view class="content_data">
<view
style="
<view style="
display: flex;
align-items: center;
justify-content: space-between;
"
>
<view class="content_data_price">
">
<view class="content_data_price buy_deduction" v-if="orderInfo.buyDeductionValue">
<view class="buy_deduction_value">
<text class="text-38 text-bold mr-10">{{ orderInfo.buyDeductionValue }}抵扣券</text>
<text class="text-24">+{{ orderInfo.minPrice }}元</text>
</view>
<view class="buy_deduction_label">
兑后抵扣券不退
</view>
</view>
<view class="content_data_price" v-else>
<text>￥</text>
<text
style="font-size: 60rpx"
v-if="orderInfo.minPrice && orderInfo.maxPrice"
>{{ orderInfo.minPrice }} - {{ orderInfo.maxPrice }}</text
>
<text style="font-size: 60rpx" v-if="orderInfo.minPrice && orderInfo.maxPrice">{{ orderInfo.minPrice }} - {{
orderInfo.maxPrice }}</text>
<text style="font-size: 60rpx" v-else>{{
orderInfo.minPrice
}}</text>
<text class="price_o">￥{{ orderInfo.adPrice }}</text>
</view>
<view
class="text-24"
style="color: #ff5a5a; width: 120rpx; height: 38rpx"
v-if="orderInfo.tag"
>
<image
src="/static/shopping/tg.png"
style="width: 120rpx; height: 38rpx"
></image>
<view class="text-24" style="color: #ff5a5a; width: 120rpx; height: 38rpx" v-if="orderInfo.tag">
<image src="/static/shopping/tg.png" style="width: 120rpx; height: 38rpx"></image>
</view>
</view>
<view class="content_data_title">
@@ -85,34 +64,21 @@
<!-- 具体规格 -->
<view class="content_concrete">
<view
class="concrete_item concrete_item_but"
@click="checkSpecification(true, 'n')"
>
<view class="concrete_item concrete_item_but" @click="checkSpecification(true, 'n')">
<view class="concrete_item_">
<view class="concrete_item_title">规格</view>
<view class="concrete_item_value">
{{ selectSpecificationTempl.combTypes || "暂未选择规格" }}
</view>
</view>
<up-image
src="/static/common/right.png"
width="20"
height="20"
bgColor="#f1f6ff00"
></up-image>
<up-image src="/static/common/right.png" width="20" height="20" bgColor="#f1f6ff00"></up-image>
</view>
<view class="concrete_item">
<view class="concrete_item_">
<view class="concrete_item_title">收货地址</view>
<view class="concrete_item_value" @click="jumpAddAddress">
<view class="address_warp" v-if="!adressInfo">
<up-image
src="/static/common/address2.png"
width="10"
height="10"
bgColor="#f1f6ff00"
></up-image>
<up-image src="/static/common/address2.png" width="10" height="10" bgColor="#f1f6ff00"></up-image>
<view style="margin-left: 10rpx">请填写地址</view>
</view>
<view class="address_warp" v-else>{{ adressInfo }}</view>
@@ -138,21 +104,11 @@
<view class="concrete_item_title">购物保障</view>
<view class="concrete_item_value concrete_item_bz">
<view class="concrete_item_bz concrete_item_bz_item">
<up-image
src="/static/product/product_b.png"
width="10"
height="12"
bgColor="#f1f6ff00"
></up-image>
<up-image src="/static/product/product_b.png" width="10" height="12" bgColor="#f1f6ff00"></up-image>
<view class="concrete_item_bz_item_left">品质严保</view>
</view>
<view class="concrete_item_bz">
<up-image
src="/static/product/product_js.png"
width="10"
height="10"
bgColor="#f1f6ff00"
></up-image>
<up-image src="/static/product/product_js.png" width="10" height="10" bgColor="#f1f6ff00"></up-image>
<view class="concrete_item_bz_item_left">极速退款</view>
</view>
</view>
@@ -163,9 +119,7 @@
<view class="tui-view">
<text class="text-32 text-zu">退货提示</text>
<text class="text-28 text-fu1"
>拆封后影响品质”或“影响二次销售的”不予退货。</text
>
<text class="text-28 text-fu1">拆封后影响品质”或“影响二次销售的”不予退货。</text>
<view class="tui-list">
<view class="tui-box" :key="index" v-for="(item, index) in tuiList">
<image :src="`/static/new/tui_${index}.png`"></image>
@@ -186,67 +140,35 @@
<view class="product_but_warp">
<view class="product_but_left">
<view class="left_item">
<up-image
src="/static/product/home.png"
width="20"
height="20"
bgColor="#f1f6ff00"
@click="jumpOther('home')"
></up-image>
<up-image src="/static/product/home.png" width="20" height="20" bgColor="#f1f6ff00"
@click="jumpOther('home')"></up-image>
<view>首页</view>
</view>
<view class="left_item">
<up-image
src="/static/product/kefu.png"
width="20"
height="20"
bgColor="#f1f6ff00"
@click="onZiXun"
></up-image>
<up-image src="/static/product/kefu.png" width="20" height="20" bgColor="#f1f6ff00"
@click="onZiXun"></up-image>
<view>咨询</view>
</view>
<view class="left_item" v-if="!ji">
<up-image
src="/static/product/cart.png"
width="24"
height="20"
bgColor="#f1f6ff00"
@click="jumpOther('cart')"
></up-image>
<view class="left_item" v-if="!isShowCart && !isCoupon">
<up-image src="/static/product/cart.png" width="24" height="20" bgColor="#f1f6ff00"
@click="jumpOther('cart')"></up-image>
<view>购物车</view>
</view>
</view>
<view class="product_but_right" v-if="!isShareUrl">
<view
v-if="!ji"
class="but_comm join_warp"
@click="checkSpecification(true, 'addCart')"
>加入购物车</view
>
<view
class="but_comm buy_warp"
:class="{ 'border-16': ji }"
@click="checkSpecification(true, 'buy')"
>立即购买</view
>
<view v-if="!isShowCart && !isCoupon" class="but_comm join_warp" @click="checkSpecification(true, 'addCart')">
加入购物车
</view>
<view class="but_comm buy_warp" :class="{ 'border-16': isShowCart || isCoupon }"
@click="checkSpecification(true, 'buy')">
立即购买
</view>
</view>
<MyBtn
v-if="isShareUrl"
mh="88rpx"
text="打开APP"
wd="200rpx"
@ok="onOpenApp"
></MyBtn>
<MyBtn v-if="isShareUrl" mh="88rpx" text="打开APP" wd="200rpx" @ok="onOpenApp"></MyBtn>
</view>
<!-- 选择规格的弹框 -->
<up-popup
:show="specificationShow"
:round="10"
:closeOnClickOverlay="false"
:closeable="true"
@close="specificationShow = false"
mode="bottom"
>
<up-popup :show="specificationShow" :round="10" :closeOnClickOverlay="false" :closeable="true"
@close="specificationShow = false" mode="bottom">
<view class="specification_warp">
<!-- 选择地址 -->
<view class="specification_adress_warp">
@@ -263,43 +185,36 @@
</view>
<!-- 商品 -->
<view class="specification_product_warp">
<up-image
:src="orderInfo.mainGraph"
width="100"
height="100"
bgColor="#f1f6ff00"
></up-image>
<up-image :src="orderInfo.mainGraph" width="100" height="100" bgColor="#f1f6ff00"></up-image>
<view class="product_content">
<view class="price_warp">
<view class="price_content_warp">
<!-- 优惠券价格 -->
<view class="price_content_warp" v-if="isCoupon">
<text class="text-38 text-bold mr-10">{{ orderInfo.buyDeductionValue }}抵扣券</text>
<text class="text-24" v-if="
selectSpecificationTempl &&
Object.keys(selectSpecificationTempl).length !== 0">+{{ selectSpecificationTempl.price }}元</text>
<text v-else>+{{ orderInfo.minPrice }}元</text>
</view>
<view class="price_content_warp" v-else>
<view>￥</view>
<text
style="font-size: 50rpx"
v-if="
selectSpecificationTempl &&
Object.keys(selectSpecificationTempl).length !== 0
"
>
<text style="font-size: 50rpx" v-if="
selectSpecificationTempl &&
Object.keys(selectSpecificationTempl).length !== 0
">
{{ selectSpecificationTempl.price }}
</text>
<view style="font-size: 50rpx" v-else>
{{ orderInfo.minPrice }}
<text v-if="orderInfo.maxPrice"
>- {{ orderInfo.maxPrice }}</text
>
<text v-if="orderInfo.maxPrice">- {{ orderInfo.maxPrice }}</text>
</view>
<view
class="price_content_coupon_warp"
v-if="orderInfo.couponPrice && orderInfo.couponPrice !== 0"
>优惠卷{{ orderInfo.couponPrice }}</view
>
<view class="price_content_coupon_warp" v-if="orderInfo.couponPrice && orderInfo.couponPrice !== 0">
优惠券{{
orderInfo.couponPrice }}</view>
</view>
<view class="oOrice_content_warp">￥{{ orderInfo.adPrice }}</view>
<view
class="coupon_content_warp"
v-if="orderInfo.couponPrice && orderInfo.couponPrice !== 0"
>优惠卷已优惠￥{{ orderInfo.couponPrice }}</view
>
<view class="oOrice_content_warp" v-if="!isCoupon">￥{{ orderInfo.adPrice }}</view>
<view class="coupon_content_warp" v-if="orderInfo.couponPrice && orderInfo.couponPrice !== 0">优惠卷已优惠￥{{
orderInfo.couponPrice }}</view>
</view>
<view class="inventory_warp">
<view>库存</view>
@@ -310,25 +225,16 @@
<!-- 规格 -->
<view class="specification_list_warp">
<view
v-for="(item, index) in specificationList"
:key="item.id"
class="list_warp"
>
<view v-for="(item, index) in specificationList" :key="item.id" class="list_warp">
<view class="list_title_warp">{{ item.type }}</view>
<view class="specification_item_warp">
<view
:class="
oItem.inventory === 0
? 'item_Warp item_Warp_no_warp'
: item.selectVal === oItem.n
? 'item_Warp item_Warp_yes_warp'
: 'item_Warp'
"
v-for="(oItem, oIndex) in item.items"
:key="oItem.n"
@click="clickSpecification(oIndex, item, oItem)"
>
<view :class="oItem.inventory === 0
? 'item_Warp item_Warp_no_warp'
: item.selectVal === oItem.n
? 'item_Warp item_Warp_yes_warp'
: 'item_Warp'
" v-for="(oItem, oIndex) in item.items" :key="oItem.n"
@click="clickSpecification(oIndex, item, oItem)">
{{ oItem.n }}
</view>
</view>
@@ -344,26 +250,14 @@
<view class="quantity_but" @click="quantityFun('add')">+</view>
</view>
</view>
<view
v-if="specificationShowType === 'buy'"
class="specification_buy_but"
@click="addCart(true)"
>去支付</view
>
<view
v-else-if="specificationShowType === 'addCart'"
class="specification_buy_but"
@click="addCart(false)"
>加入购物车</view
>
<view v-if="specificationShowType === 'buy'" class="specification_buy_but" @click="addCart(true)">去支付</view>
<view v-else-if="specificationShowType === 'addCart'" class="specification_buy_but" @click="addCart(false)">
加入购物车
</view>
<view v-else class="product_but_right popup_buts">
<view class="but_comm join_warp" @click="addCart(false)"
>加入购物车</view
>
<view class="but_comm buy_warp" @click="addCart(true)"
>立即购买</view
>
<view class="but_comm join_warp" @click="addCart(false)">加入购物车</view>
<view class="but_comm buy_warp" @click="addCart(true)">立即购买</view>
</view>
</view>
</view>
@@ -372,12 +266,7 @@
<up-modal :show="serviceShow" :showConfirmButton="false">
<view class="slot-content">
<view class="close_warp" @click="serviceShow = false">
<up-image
src="/static/common/close.png"
width="20"
height="20"
bgColor="#f1f6ff00"
></up-image>
<up-image src="/static/common/close.png" width="20" height="20" bgColor="#f1f6ff00"></up-image>
</view>
<view class="content_">
<view class="content_1">{{
@@ -390,17 +279,13 @@
}}</view>
</view>
<view class="but_">
<view
class="but_copy"
@click="
copyMobile(
source === 'supply_chain'
? CLOUD_SERVICE_PHONE_NUMBER
: CUSTOMER_SERVICE_PHONE_NUMBER
)
"
>复制号码</view
>
<view class="but_copy" @click="
copyMobile(
source === 'supply_chain'
? CLOUD_SERVICE_PHONE_NUMBER
: CUSTOMER_SERVICE_PHONE_NUMBER
)
">复制号码</view>
<view class="but_close" @click="serviceShow = false">取消</view>
</view>
</view>
@@ -411,61 +296,36 @@
<view class="uni-banner">
<view class="banner_box">
<view class="title_">温馨提示</view>
<view class="msg_"
>该商家暂未开通供应链权限，请联系供应链客服开通授权。</view
>
<view class="msg_">该商家暂未开通供应链权限，请联系供应链客服开通授权。</view>
<view class="phone_">{{ CLOUD_SERVICE_PHONE_NUMBER }}</view>
<view class="but_">
<view
class="but_b"
@click="copyMobile(CLOUD_SERVICE_PHONE_NUMBER)"
>立即联系</view
>
<view class="but_b" @click="copyMobile(CLOUD_SERVICE_PHONE_NUMBER)">立即联系</view>
</view>
</view>
</view>
</view>
</up-overlay>
<!-- 选择地址 -->
<up-popup
v-model:show="addressShow"
:round="10"
:closeOnClickOverlay="false"
:closeable="true"
:safeAreaInsetBottom="false"
@close="checkAddressShow(false, null, 0, 0)"
>
<up-popup v-model:show="addressShow" :round="10" :closeOnClickOverlay="false" :closeable="true"
:safeAreaInsetBottom="false" @close="checkAddressShow(false, null, 0, 0)">
<view class="address_popup_warp">
<view class="address_popup_title">收件地址</view>
<view class="address_popup_content">
<view class="address_popup_content_add" @click="addAdress">
+ 新增地址</view
>
+ 新增地址</view>
<Address @valueFunc="getAddressValueFunc" />
</view>
<view class="popup_but" @click="addressOk"> 确认 </view>
</view>
</up-popup>
<SharePopup
ref="share"
v-if="shareOpen"
:show="shareShow"
@close="onClose"
@share="onShare"
:id="id"
:text="orderInfo.name ? orderInfo.name : ''"
:price="orderInfo.minPrice ? orderInfo.minPrice : ''"
:tu="swiperList.length && swiperList[0]"
></SharePopup>
<SharePopup ref="share" v-if="shareOpen" :show="shareShow" @close="onClose" @share="onShare" :id="id"
:text="orderInfo.name ? orderInfo.name : ''" :price="orderInfo.minPrice ? orderInfo.minPrice : ''"
:tu="swiperList.length && swiperList[0]"></SharePopup>
<view class="hideCanvasView">
<canvas
id="myCanvas"
canvas-id="myCanvas"
:style="{
height: bgObj.height + 'px',
width: bgObj.width + 'px',
}"
></canvas>
<canvas id="myCanvas" canvas-id="myCanvas" :style="{
height: bgObj.height + 'px',
width: bgObj.width + 'px',
}"></canvas>
</view>
</view>
</template>
@@ -526,7 +386,7 @@ export default {
serviceShow: false, // 联系客服弹框
openShow: false,
source: null, // 来源：供应链，自营
ji: 0,
isShowCart: 0,
selectAddress: {}, // 选择的地址
postage: null, // 邮费
adressInfo: "",
@@ -542,10 +402,12 @@ export default {
tmpImg: "",
isShareUrl: false,
isSplash: false,
isCoupon: false, // 是否是优惠券商品
curAmount: 0, // 当前人剩余优惠券金额
};
},
onBackPress(options) {
console.log("我是侧滑",options)
console.log("我是侧滑", options)
// #ifdef APP-PLUS
if (options.from === 'backbutton' && this.isSplash) {
// 1. 阻止默认 pop
@@ -557,6 +419,10 @@ export default {
},
onLoad(options) {
const id = options.id;
this.isCoupon = options.isPar;
if (this.isCoupon && options.curAmount) {
this.curAmount = options.curAmount;
}
const source = options.source;
this.isSplash = options.isSplash;
console.log("isSplash", this.isSplash == "true");
@@ -588,7 +454,7 @@ export default {
this
);
},
onHide() {
timer && clearTimeout(timer);
timer = null;
@@ -599,9 +465,9 @@ export default {
},
methods: {
assembleAddress,
limit999(n) {
return n > 999 ? '999+' : String(n);
},
limit999(n) {
return n > 999 ? '999+' : String(n);
},
onOpenApp() {
//https://download.tbmall.xin/1002/apppacket/20251113/20251113183449483.apk
@@ -965,10 +831,13 @@ export default {
const params = {
id: this.id,
};
if(this.isCoupon){
params.type = -1;
}
const resp = await getGoodsDetail(params);
if (resp && resp.bizcode === 100) {
const data = resp.data;
this.ji = data.type == 3 ? 1 : 0;
this.isShowCart = data.type == 3 ? 1 : 0;
// 商品图
if (data.goodsGraph) {
this.swiperList = data.goodsGraph.split(",");
@@ -1034,7 +903,7 @@ export default {
return;
}
const source = this.source;
if (type == "n" && this.ji == 1) {
if (type == "n" && (this.isShowCart == 1 || this.isCoupon)) {
type = "buy";
}
console.log("afsdfsd", source, type);
@@ -1075,6 +944,9 @@ export default {
const params = {
id: this.id,
};
if(this.isCoupon){
params.type = -1;
}
const resp = await getGoodsSpecs(params);
if (resp && resp.bizcode === 100) {
const data = resp.data;
@@ -1189,12 +1061,24 @@ export default {
goodsNum: this.orderInfo.quantity, // 商品数量
};
console.log("selectTempl", selectTempl);
if (this.ji == 1) {
if (this.isShowCart == 1 || this.isCoupon) {
params["specsId"] = selectTempl;
console.log("----------", params, this.isCoupon, this.orderInfo.buyDeductionValue, this.orderInfo.quantity, this.curAmount);
const buyCouponvalue = Number((this.orderInfo.buyDeduction * (this.orderInfo.quantity || 1)).toFixed(2)) || 0;
if (this.isCoupon && buyCouponvalue > this.curAmount) {
uni.showToast({
title: `您当前优惠券金额不足`,
icon: "none", // 可选 success/loading/none
duration: 2000, // 持续时长，单位ms
});
return;
}
uni.navigateTo({
url: `/pages/order_package/order_submit/order_submit?sed=${JSON.stringify(
params
)}&address=${this.selectAddress?.id}`,
)}&address=${this.selectAddress?.id}&isCoupon=${this.isCoupon}`,
});
return;
}
@@ -1308,6 +1192,24 @@ export default {
text-decoration-line: line-through;
margin-left: 10rpx;
}
&.buy_deduction {
width: 100%;
display: flex;
justify-content: space-between;
.buy_deduction_value {
font-weight: 500;
font-size: 26rpx;
color: #7A35F6;
margin-left: 10rpx;
}
.buy_deduction_label {
font-size: 24rpx;
color: #E88900;
}
}
}
.content_data_title {
@@ -1338,6 +1240,7 @@ export default {
padding: 32rpx;
box-sizing: border-box;
margin-top: 24rpx;
.tui-list {
width: 100%;
height: 104rpx;
@@ -1347,6 +1250,7 @@ export default {
justify-content: space-between;
align-items: center;
margin-top: 24rpx;
.tui-box {
width: 64rpx;
min-height: 100%;
@@ -1354,6 +1258,7 @@ export default {
flex-direction: column;
align-items: center;
justify-content: space-between;
image {
width: 64rpx;
height: 64rpx;
@@ -1536,7 +1441,7 @@ export default {
.product_content {
margin-left: 10rpx;
display: grid;
// display: grid;
}
.price_content_warp {
@@ -1578,6 +1483,7 @@ export default {
font-weight: 500;
font-size: 24rpx;
color: #808080;
margin-top: 16rpx;
}
}
@@ -1668,6 +1574,7 @@ export default {
}
.open_Show {
/* 弹出层形式的广告 */
.uni-banner {
display: flex;
@@ -1731,6 +1638,7 @@ export default {
}
}
}
.hideCanvasView {
width: 100%;
height: 100%;