feat:货品banner兼容
This commit is contained in:
@@ -2,15 +2,16 @@
|
|||||||
<view class="product_info_warp">
|
<view class="product_info_warp">
|
||||||
<!-- <image v-if="tmpImg" :src="tmpImg" style="width:620rpx;height:960rpx"></image> -->
|
<!-- <image v-if="tmpImg" :src="tmpImg" style="width:620rpx;height:960rpx"></image> -->
|
||||||
<!-- 头部产品描述图 -->
|
<!-- 头部产品描述图 -->
|
||||||
<view class="product_info_header_warp">
|
<view class="product_info_header_warp" :style="{ height: swiperHeight + 'rpx' }">
|
||||||
<up-swiper :list="swiperList" class="product_info_header_swiper" @click="onSwiper"
|
<up-swiper :list="swiperList" class="product_info_header_swiper" @click="onSwiper"
|
||||||
@change="(e) => (currentNum = e.current)">
|
@change="(e) => (currentNum = e.current)" :height="swiperHeight + 'rpx'" img-mode="widthFix">
|
||||||
<template #indicator>
|
<template #indicator>
|
||||||
<view class="indicator-num">
|
<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>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
</up-swiper>
|
</up-swiper>
|
||||||
|
|
||||||
<view class="img_comm left_warp">
|
<view class="img_comm left_warp">
|
||||||
<up-image src="/static/common/left_b_st.png" width="30" height="30" bgColor="#f1f6ff00" v-if="!isShareUrl"
|
<up-image src="/static/common/left_b_st.png" width="30" height="30" bgColor="#f1f6ff00" v-if="!isShareUrl"
|
||||||
@click="jumpLeft"></up-image>
|
@click="jumpLeft"></up-image>
|
||||||
@@ -399,6 +400,7 @@ export default {
|
|||||||
tuiList: ["破损", "污渍", "划痕", "标签", "其他"],
|
tuiList: ["破损", "污渍", "划痕", "标签", "其他"],
|
||||||
swiperList: [],
|
swiperList: [],
|
||||||
currentNum: 0,
|
currentNum: 0,
|
||||||
|
swiperHeight: 800,
|
||||||
specificationShow: false,
|
specificationShow: false,
|
||||||
specificationShowType: "", // 弹框类型
|
specificationShowType: "", // 弹框类型
|
||||||
orderInfo: {},
|
orderInfo: {},
|
||||||
@@ -518,6 +520,19 @@ export default {
|
|||||||
}
|
}
|
||||||
return `${Math.floor(num / 10000)}万+`;
|
return `${Math.floor(num / 10000)}万+`;
|
||||||
},
|
},
|
||||||
|
async calcSwiperHeight() {
|
||||||
|
if (!this.swiperList || this.swiperList.length === 0) return;
|
||||||
|
try {
|
||||||
|
const imgUrl = this.swiperList[0];
|
||||||
|
const res = await uni.getImageInfo({
|
||||||
|
src: imgUrl
|
||||||
|
});
|
||||||
|
const ratio = res.height / res.width;
|
||||||
|
this.swiperHeight = Math.round(750 * ratio);
|
||||||
|
} catch (e) {
|
||||||
|
console.error('calcSwiperHeight error:', e);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
onOpenApp() {
|
onOpenApp() {
|
||||||
//https://download.tbmall.xin/1002/apppacket/20251113/20251113183449483.apk
|
//https://download.tbmall.xin/1002/apppacket/20251113/20251113183449483.apk
|
||||||
@@ -923,6 +938,7 @@ export default {
|
|||||||
// 商品图
|
// 商品图
|
||||||
if (data.goodsGraph) {
|
if (data.goodsGraph) {
|
||||||
this.swiperList = data.goodsGraph.split(",");
|
this.swiperList = data.goodsGraph.split(",");
|
||||||
|
this.calcSwiperHeight();
|
||||||
}
|
}
|
||||||
data.addressObj = {}; // 收件人地址
|
data.addressObj = {}; // 收件人地址
|
||||||
data.quantity = 1; // 数量
|
data.quantity = 1; // 数量
|
||||||
@@ -981,6 +997,7 @@ export default {
|
|||||||
currentThumb = domain + "/static/upload/" + objData.thumb;
|
currentThumb = domain + "/static/upload/" + objData.thumb;
|
||||||
}
|
}
|
||||||
this.swiperList = [currentThumb]; // 封面图
|
this.swiperList = [currentThumb]; // 封面图
|
||||||
|
this.calcSwiperHeight();
|
||||||
this.orderInfo = orderInfo;
|
this.orderInfo = orderInfo;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -1338,20 +1355,18 @@ export default {
|
|||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
.product_info_header_swiper {
|
.product_info_header_swiper {
|
||||||
height: 800rpx !important;
|
|
||||||
|
|
||||||
.u-swiper {
|
.u-swiper {
|
||||||
height: 800rpx !important;
|
height: 100% !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep(.u-swiper__wrapper) {
|
::v-deep(.u-swiper__wrapper) {
|
||||||
height: 800rpx !important;
|
height: 100% !important;
|
||||||
|
|
||||||
.u-swiper__wrapper {
|
.u-swiper__wrapper {
|
||||||
height: 800rpx !important;
|
height: 100% !important;
|
||||||
|
|
||||||
.u-swiper__wrapper__item__wrapper__image {
|
.u-swiper__wrapper__item__wrapper__image {
|
||||||
height: 800rpx !important;
|
height: 100% !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user