feat: 新增商品下架提示框,在原有的下架提示中优化商品展示页面,弹出下架提示,展示其他商品功能。

master
Yer 2023-05-10 10:46:23 +08:00
parent 7b8e954555
commit ca4e458db1
3 changed files with 76 additions and 17 deletions

View File

@ -0,0 +1,34 @@
<template>
<div>
<u-popup v-model="show" mode="bottom" height="800rpx" border-radius="14">
<div class="wrapper">
<view class="down-goods-tips">该商品已下架</view>
<scroll-view scroll-y="true" style="height: 670rpx">
<goodsRecommend title="其他商品" />
</scroll-view>
</div>
</u-popup>
</div>
</template>
<script>
import goodsRecommend from "@/components/m-goods-recommend/index.vue";
export default {
data() {
return {
show: true, //
};
},
components: { goodsRecommend },
};
</script>
<style lang="scss" scoped>
.down-goods-tips {
font-size: 36rpx;
text-align: center;
font-weight: bold;
padding: 40rpx 0;
}
</style>

View File

@ -88,14 +88,14 @@
<span>¥</span><span class="price">{{ <span>¥</span><span class="price">{{
$options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length - 1].price)[0] $options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length - 1].price)[0]
}}</span>.{{ }}</span>.{{
$options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length - 1].price)[1] $options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length - 1].price)[1]
}} }}
~ ~
<span>¥</span><span class="price">{{ <span>¥</span><span class="price">{{
$options.filters.goodsFormatPrice(wholesaleList[0].price)[0] $options.filters.goodsFormatPrice(wholesaleList[0].price)[0]
}}</span>.{{ }}</span>.{{
$options.filters.goodsFormatPrice(wholesaleList[0].price)[1] $options.filters.goodsFormatPrice(wholesaleList[0].price)[1]
}} }}
</span> </span>
<span v-else> <span v-else>
<span>¥</span><span class="price">{{ <span>¥</span><span class="price">{{
@ -105,7 +105,12 @@
</span> </span>
</view> </view>
<view class="-goods-price" v-else> <view class="-goods-price" v-else>
<div v-if="takeDownFromSale" class="price down-goods">
暂无报价
</div>
<span v-else>
¥<span class="price">0 </span>.00 ¥<span class="price">0 </span>.00
</span>
</view> </view>
<view class="icons share" @click="shareChange()"> <view class="icons share" @click="shareChange()">
@ -189,6 +194,7 @@
</view> </view>
</scroll-view> </scroll-view>
<view class="page-bottom mp-iphonex-bottom" id="pageBottom"> <view class="page-bottom mp-iphonex-bottom" id="pageBottom">
<view class="icon-btn"> <view class="icon-btn">
<view class="icon-btn-item" @click="navigateToStore(goodsDetail.storeId)"> <view class="icon-btn-item" @click="navigateToStore(goodsDetail.storeId)">
@ -205,15 +211,20 @@
<view v-if="nums && nums > 0" class="num-icon">{{ nums }}</view> <view v-if="nums && nums > 0" class="num-icon">{{ nums }}</view>
</view> </view>
</view> </view>
<!-- 下架展示 -->
<div class="detail-btn" v-if="takeDownFromSale">
<view class="to-store-car to-store-btn" @click="reStartTakeDownSale">
查看类似商品</view>
</div>
<!-- 正常结算页面 --> <!-- 正常结算页面 -->
<view class="detail-btn" v-if="!isGroup"> <view class="detail-btn" v-if="!isGroup && !takeDownFromSale">
<view class="to-store-car to-store-btn" v-if="goodsDetail.goodsType != 'VIRTUAL_GOODS'" @click="shutMask(4)"> <view class="to-store-car to-store-btn" v-if="goodsDetail.goodsType != 'VIRTUAL_GOODS'" @click="shutMask(4)">
加入购物车</view> 加入购物车</view>
<view class="to-buy to-store-btn" @click="shutMask(4, 'buy')">立即购买</view> <view class="to-buy to-store-btn" @click="shutMask(4, 'buy')">立即购买</view>
<view class="to-store-car to-store-btn" v-if="startTimer"></view> <view class="to-store-car to-store-btn" v-if="startTimer"></view>
</view> </view>
<!-- 拼团结算 --> <!-- 拼团结算 -->
<view class="detail-btn" v-else> <view class="detail-btn" v-else-if="isGroup">
<view class="to-store-car pt-buy to-store-btn" @click="shutMask(4, 'buy')"> <view class="to-store-car pt-buy to-store-btn" @click="shutMask(4, 'buy')">
<view>{{ goodsDetail.price | unitPrice }}</view> <view>{{ goodsDetail.price | unitPrice }}</view>
<view>单独购买</view> <view>单独购买</view>
@ -253,6 +264,10 @@
@queryCart="cartCount()" :goodsDetail="goodsDetail" :goodsSpec="goodsSpec" :isGroup="isGroup" :id="productId" @queryCart="cartCount()" :goodsDetail="goodsDetail" :goodsSpec="goodsSpec" :isGroup="isGroup" :id="productId"
v-if="goodsDetail.id" :pointDetail="pointDetail" :wholesaleList="wholesaleList" @handleClickSku="selectSku" v-if="goodsDetail.id" :pointDetail="pointDetail" :wholesaleList="wholesaleList" @handleClickSku="selectSku"
:buyMask="buyMask" /> :buyMask="buyMask" />
<!-- 下架框 -->
<takeDownFormSaleGoods ref="takeDownSale" v-if="takeDownFromSale" />
</view> </view>
</view> </view>
</div> </div>
@ -284,6 +299,7 @@ import popupGoods from "@/components/m-buy/goods"; //购物车商品的模块
import popupAddress from "./product/popup/address"; // import popupAddress from "./product/popup/address"; //
import shares from "@/components/m-share/index"; // import shares from "@/components/m-share/index"; //
import popups from "@/components/popups/popups"; // import popups from "@/components/popups/popups"; //
import takeDownFormSaleGoods from "@/components/m-take-down-sale-goods/index"; //
import setup from "./product/popup/popup"; import setup from "./product/popup/popup";
export default { export default {
@ -302,6 +318,7 @@ export default {
GoodsSwiper, GoodsSwiper,
popupGoods, popupGoods,
popupAddress, popupAddress,
takeDownFormSaleGoods
}, },
data () { data () {
return { return {
@ -385,10 +402,8 @@ export default {
tabScrollTop: null, tabScrollTop: null,
scrollArr: [], scrollArr: [],
scrollId: "1", scrollId: "1",
scrollFlag: true, scrollFlag: true,
current: "1", // current: "1", //
goodsDetail: {}, // goodsDetail: {}, //
goodsSpec: "", // goodsSpec: "", //
imgList: [], // imgList: [], //
@ -398,12 +413,9 @@ export default {
goodsInfo: false, // goodsInfo: false, //
addressFlag: false, // addressFlag: false, //
buyMask: false, // buyMask: false, //
num: 1, // num: 1, //
skuId: "", // skuId: "", //
storeDetail: "", //, storeDetail: "", //,
// //
storeParams: { storeParams: {
pageNumber: 1, pageNumber: 1,
@ -413,7 +425,6 @@ export default {
likeGoodsList: "", // likeGoodsList: "", //
PromotionList: "", //, PromotionList: "", //,
specList: [], specList: [],
skusCombination: [],
selectedSpec: [], selectedSpec: [],
nums: 0, nums: 0,
delivery: "", delivery: "",
@ -425,7 +436,8 @@ export default {
routerVal: "", routerVal: "",
IMLink: "", // IM IMLink: "", // IM
wholesaleList: [] wholesaleList: [],
takeDownFromSale: false, //
}; };
}, },
@ -504,6 +516,10 @@ export default {
}, },
methods: { methods: {
//
reStartTakeDownSale(){
this.$refs.takeDownSale.show = true
},
share () { share () {
return `/pages/product/goods?id=${this.routerVal.id}&goodsId=${this.routerVal.goodsId}`; return `/pages/product/goods?id=${this.routerVal.id}&goodsId=${this.routerVal.goodsId}`;
}, },
@ -538,11 +554,16 @@ export default {
// //
let response = await getGoods(id, goodsId); let response = await getGoods(id, goodsId);
//
if (!response.data.success) { if (!response.data.success) {
setTimeout(() => { //
uni.navigateBack(); if(response.data.code == 11001){
}, 500); this.takeDownFromSale = true
}
// setTimeout(() => {
// uni.navigateBack();
// }, 500);
} }
// //
if (distributionId || this.$store.state.distributionId) { if (distributionId || this.$store.state.distributionId) {

View File

@ -62,3 +62,7 @@
color: #262626; color: #262626;
font-weight: 700; font-weight: 700;
} }
.down-goods{
font-size: 50rpx !important;
}