From 7c7fd1a80ad89dd1037f2ee420fed2dcde7290a1 Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期二, 20 八月 2024 16:42:53 +0800 Subject: [PATCH] 1 --- sub_pages/customer/trade/detail.vue | 244 +++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 216 insertions(+), 28 deletions(-) diff --git a/sub_pages/customer/trade/detail.vue b/sub_pages/customer/trade/detail.vue index d31747f..6997b1a 100644 --- a/sub_pages/customer/trade/detail.vue +++ b/sub_pages/customer/trade/detail.vue @@ -1,15 +1,47 @@ <template> <view class="trade-detail"> <view class="top-img-container"> - <image :src="dto.cover" class="top-img" mode="aspectFill"></image> + + <!-- <image :src="dto.cover" class="top-img" mode="aspectFill"></image> --> + <uni-swiper-dot class="uni-swiper-dot-box" :mode="'dot'" field="content"> + <swiper class="swiper-box" :interval="10000" :circular="true" :current="0" :autoplay="true"> + + <swiper-item v-if="dto.video"> + <video :src="dto.video" class="top-img" :auto-pause-if-navigate="true" + style="display: block;margin: 0 auto;"></video> + <view class="index-tag"> + 1/{{(dto.video&&1||0)+(dto.cover&&1||0)+(dto.bannerList&&dto.bannerList.length||0)}} + </view> + </swiper-item> + <swiper-item v-for="(url, index) in dto.bannerList" :key="index"> + <image class="top-img" :lazy-load="true" mode="scaleToFill" @click="previewImg(url)" :src="url"> + </image> + <view class="index-tag"> + {{index+1+(dto.video&&1)}}/{{(dto.video&&1||0)+(dto.cover&&1||0)+(dto.bannerList&&dto.bannerList.length||0)}} + </view> + </swiper-item> + + <swiper-item> + <image :src="dto.cover" :lazy-load="true" @click="previewImg(dto.cover)" class="top-img" + mode="scaleToFill"> + </image> + <view class="index-tag"> + {{(dto.bannerList&&dto.bannerList.length||0)+1+(dto.video&&1||0)}}/{{(dto.video&&1||0)+(dto.cover&&1||0)+(dto.bannerList&&dto.bannerList.length||0)}} + </view> + </swiper-item> + + + </swiper> + </uni-swiper-dot> + + + + <view class="icon-container"> <image v-if="!dto.collection" src="../../../static/common/icon-sc.png" @click="collectItem(dto)" class="icon-sc"></image> <image v-if="dto.collection" src="../../../static/common/icon-sc-fill.png" @click="collectItem(dto)" class="icon-sc"></image> - - - <!-- <view class="num">12</view>--> </view> <view class="icon-container"> <image src="../../../static/common/icon-shop.png" @click="toShopping(dto)" class="icon-shop"> @@ -25,6 +57,15 @@ {{ dto.name || '-' }} </view> </view> + + <view class="tags" v-if="dto.tags||false"> + <!-- <view class="tag red">限时抢购</view> --> + <!-- <view class="tag green">品质严选</view> --> + <view class="tag red" v-for="(tag,k) of dto.tagArr" :class="[k===0?'red':'green']" :key="tag">{{ + tag + }} + </view> + </view> <view class="desc m-t-12"> <view class="m-r-15">已售:{{ dto.sales || 0 }}</view> <view class="m-r-15">剩余:{{ dto.stock || 0 }}</view> @@ -36,7 +77,10 @@ 元/扎 </view> <view class="m-l-a m-r-15"> - <image src="../../../static/common/icon-kf.png" class="icon-kf m-l-15 img100"></image> + <button open-type="contact" class="component-button-contact"> + <image src="../../../static/common/icon-kf.png" class="icon-kf m-l-15 img100"></image> + + </button> </view> <view class="m-r-0 gwc" @click="submitShopping(dto)" v-if="!dto.shopnum"> @@ -68,14 +112,6 @@ <view class="label">暂无</view> </view> </view> - <!-- <view class="flex m-t-8"> - <!-- <view class="label">枝粗:</view>--> - <!-- <view class="value">中等粗细</view>--> - <!-- </view>--> - <!-- <view class="flex m-t-8">--> - <!-- <view class="label">均匀度:</view>--> - <!-- <view class="value">1-2支不均匀</view>--> - <!-- </view>--> </view> <view class="line"> @@ -92,6 +128,34 @@ <view class="store-to m-l-a m-r-0">进入店铺</view> </view> </view> + + <!-- <view class="line" v-if="dto.bannerList&&dto.bannerList.length>0"> + + </view> + <uni-swiper-dot class="uni-swiper-dot-box" :mode="'dot'" field="content" + v-if="dto.bannerList&&dto.bannerList.length>0"> + <swiper class="swiper-box" :interval="10000" :circular="true" :current="0" :autoplay="true"> + <swiper-item v-for="(url, index) in dto.bannerList" :key="index"> + <view class="swiper-item" :class="'swiper-item' + index"> + <image class="home-banner-image m-auto m-t-12 m-b-12" style="display: block;" mode="scaleToFill" + @click="previewImg(url)" :src="url"> + </image> + </view> + </swiper-item> + </swiper> + </uni-swiper-dot> --> + + <!-- <view class="line" v-if="dto.video"> + + </view> + <view class="info-brand m-t-12" v-if="dto.video"> + <video :src="dto.video" :auto-pause-if-navigate="true" style="display: block;margin: 0 auto;"></video> + + </view> --> + + + + <view class="m-t-20 shop-recommend-container" v-if="false"> <view class="shop-recommend-title">店铺推荐</view> <view class="flex"> @@ -158,17 +222,20 @@ onLoad(options) { console.log('trade detail options', options) this.id = options.id || '' - if (this.id) { - this.getDetail() - } - this.refreshShopNum() + // #ifdef PUB_CUSTOMER + if (options.partnerUserId) { - //合伙人绑定的,判断当前用户,是否有登录,登录没绑定,没登录先缓存合伙人id,等注册和登录时候再弄 let tmp = this + tmp.sharePartnerUserId = options.partnerUserId + //合伙人绑定的,判断当前用户,是否有登录,登录没绑定,没登录先缓存合伙人id,等注册和登录时候再弄 setTimeout(() => { + //并且当前用户没有绑定 + if (tmp.currentInfo.id && tmp.currentInfo.customerDTO.partnerId) { + return + } if (tmp.currentInfo.id) { - tmp.bindPartnerUser(tmp.currentInfo.id, '') + tmp.bindPartnerUser(options.partnerUserId, '') } else { tmp.sharePartnerUserId = options.partnerUserId //没有登录到话设置到缓存 @@ -180,6 +247,10 @@ }, 1000) } // #endif + if (this.id) { + this.getDetail() + } + this.refreshShopNum() }, // #ifdef PUB_CUSTOMER @@ -366,18 +437,31 @@ } }, async getDetail() { + var params = { + id: this.id, + } + if (this.sharePartnerUserId && !isNaN(parseInt(this.sharePartnerUserId))) { + params.partnerId = parseInt(this.sharePartnerUserId) + } this.$message.showLoading() const { code, data } = await this.$http.request('get', '/api/customer/flower/list/view', { - params: { - id: this.id - } + params: params }) if (code === 0) { this.dto = { + bannerList: [], ...data, + } + if (!this.dto.bannerList) { + this.dto.bannerList = [] + } + if (this.dto.tags) { + this.dto.tagArr = this.dto.tags.split(",") || [] + } else { + this.dto.tagArr = [] } } @@ -392,14 +476,62 @@ }) return } - uni.navigateTo({ - url: '/sub_pages/customer/shopping/shopping' - }) + //判断堆栈,如果是购物车,就直接返回 + const pages = getCurrentPages(); + //如果上一层就是购物车,那么就返回,而不是跳转 + // console.log('toShopping',pages) + if (pages && pages.length >= 2) { + if (pages[pages.length - 2].route === "sub_pages/customer/shopping/shopping") { + uni.navigateBack() + return + } + } + if (pages.length >= 10) { + //直接强制购物车 + uni.reLaunch({ + url: '/sub_pages/customer/shopping/shopping' + }) + } else { + uni.navigateTo({ + url: '/sub_pages/customer/shopping/shopping' + }) + } + }, openbrand() { - uni.navigateTo({ - url: '/sub_pages/customer/shop/shop?id=' + (this.dto.id || '') - }) + //也要判断一下是否重复进入 + //判断堆栈,如果是店铺,就直接返回 + //或者是:从商铺到列表再到详情,再到商铺,这种也不行 + const pages = getCurrentPages(); + console.log('toShopping', pages) + if (pages && pages.length >= 2) { + if (pages[pages.length - 2].route === "sub_pages/customer/shop/shop") { + uni.navigateBack() + return + } + } + if (pages && pages.length >= 3) { + if (pages[pages.length - 3].route === "sub_pages/customer/shop/shop" && + pages[pages.length - 2].route === "sub_pages/customer/trade/list" + ) { + uni.navigateBack({ + delta: 2 + }) + return + } + } + + if (pages.length >= 10) { + //直接强制购物车 + uni.reLaunch({ + url: '/sub_pages/customer/shop/shop?id=' + (this.dto.supplierId || '') + }) + } else { + uni.navigateTo({ + url: '/sub_pages/customer/shop/shop?id=' + (this.dto.supplierId || '') + }) + } + } } } @@ -408,6 +540,32 @@ <style lang="scss" scoped> .trade-detail { background-color: #FFFFFF; + + swiper { + height: 320rpx; + } + + .swiper-box { + position: relative; + + swiper-item { + background-color: #fff; + border-radius: 8rpx; + position: relative; + + .index-tag { + position: absolute; + color: #fff; + font-size: 22rpx; + right: 10rpx; + bottom: 10rpx; + padding: 10rpx 20rpx; + text-align: center; + background-color: #545454; + border-radius: 30rpx; + } + } + } .image-shop-number { width: 30rpx; @@ -427,6 +585,31 @@ .trade-info-container { padding: 46rpx 30rpx; border-radius: 40rpx 40rpx 0rpx 0rpx; + + .tags { + margin-top: 12rpx; + display: flex; + + .tag { + // min-width: 60rpx; + padding-left: 10rpx; + padding-right: 10rpx; + line-height: 30rpx; + background: #FEE6E6; + border-radius: 10rpx; + font-size: 18rpx; + color: #CD1212; + margin-right: 6rpx; + text-align: center; + } + + .tag.green { + color: rgba(110, 159, 102, 1); + background: rgba(202, 229, 214, 1); + border-radius: 10rpx; + // opacity: 0.57; + } + } .title { font-weight: 600; @@ -589,6 +772,11 @@ .top-img-container { position: relative; + swiper { + width: 750rpx; + height: 764rpx; + } + .top-img { width: 750rpx; height: 764rpx; -- Gitblit v1.9.3