From f29b9dee3aa4c05fc36e8d89ec96f60efe71196e Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期二, 30 七月 2024 17:54:55 +0800 Subject: [PATCH] 1 --- sub_pages/customer/trade/detail.vue | 96 ++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 76 insertions(+), 20 deletions(-) diff --git a/sub_pages/customer/trade/detail.vue b/sub_pages/customer/trade/detail.vue index af290b5..0b17700 100644 --- a/sub_pages/customer/trade/detail.vue +++ b/sub_pages/customer/trade/detail.vue @@ -3,18 +3,24 @@ <view class="top-img-container"> <image :src="dto.cover" class="top-img" mode="aspectFill"></image> <view class="icon-container"> - <image src="../../../static/common/icon-sc.png" @click="collectItem(dto)" class="icon-sc"></image> + <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="submitShopping(dto)" class="icon-shop"> + <image src="../../../static/common/icon-shop.png" @click="toShopping(dto)" class="icon-shop"> + <view class="image-shop-number" v-if="shopnum">{{shopnum||''}}</view> </image> </view> </view> <view class="trade-info-container"> <view class="title flex"> - <view class="level m-r-15">{{ dto.levelStr || '-' }}级</view> + <view class="level m-r-15">{{ dto.levelStr || '-' }}</view> <view class=""> {{ dto.name || '-' }} </view> @@ -47,7 +53,12 @@ <view class="label">{{ param.name}}:</view> <view class="value">{{ param.value || '-'}}</view> </view> - <!-- <view class="flex m-t-8">--> + <view v-if="!dto.params"> + <view class="flex m-t-8"> + <view class="label">暂无</view> + </view> + </view> + <!-- <view class="flex m-t-8"> <!-- <view class="label">枝粗:</view>--> <!-- <view class="value">中等粗细</view>--> <!-- </view>--> @@ -123,7 +134,8 @@ data() { return { id: '', - dto: {} + dto: {}, + shopnum: 0, } }, onLoad(options) { @@ -131,30 +143,50 @@ if (this.id) { this.getDetail() } + this.refreshShopNum() }, methods: { - async collectItem(dto){ - await this.$message.confirm('是否添加到收藏') + async refreshShopNum() { + this.shopnum = await this.$store.dispatch('countShopping'); + }, + async collectItem(dto) { + if (!this.currentInfo.id) { + this.$message.showToast('请先登录') + return + } + await this.$message.confirm(`是否${dto.collection?'移除':'添加到'}收藏`) this.$message.showLoading() const { code, data - } = await this.$http.request('post', '/api/collect/add', { - data: { - flowerId: dto.id - } - }) + } = await this.$http.request(dto.collection ? "get" : 'post', dto.collection ? '/api/collect/delete' : + '/api/collect/add', { + data: { + flowerId: dto.id + }, + params: { + flowerId: dto.id + } + }) if (code === 0) { - this.$message.showToast('收藏成功') + this.$message.showToast('操作成功') + dto.collection = !dto.collection + this.$forceUpdate() } - + this.$message.hideLoading() }, async submitShopping(dto) { //提交到购物车中 - this.$message.showLoading() - await this.$store.dispatch('submitShopping', dto); - this.$message.hideLoading() + // this.$message.showLoading() + const { + code + } = await this.$store.dispatch('submitShopping', dto); + // this.$message.hideLoading() + if (code == 0) { + this.refreshShopNum() + + } }, async getDetail() { this.$message.showLoading() @@ -175,6 +207,11 @@ this.$message.hideLoading() }, + toShopping() { + uni.navigateTo({ + url: '/sub_pages/customer/shopping/shopping' + }) + }, openbrand() { uni.navigateTo({ url: '/sub_pages/customer/shop/shop?id=' + (this.dto.id || '') @@ -187,6 +224,21 @@ <style lang="scss" scoped> .trade-detail { background-color: #FFFFFF; + + .image-shop-number { + width: 30rpx; + height: 30rpx; + background: #F20000; + line-height: 30rpx; + text-align: center; + position: absolute; + right: 0rpx; + top: -6rpx; + color: #FFFFFF; + border-radius: 50%; + font-size: 24rpx; + } + .trade-info-container { padding: 46rpx 30rpx; @@ -353,9 +405,11 @@ position: absolute; top: 20rpx; width: 80rpx; - left: 40rpx; + right: 140rpx; height: 80rpx; - background: rgba(0, 0, 0, 0); + background: rgba(0, 0, 0, 0.42); + border-radius: 50%; + display: flex; .icon-sc { width: 54rpx; @@ -371,6 +425,8 @@ margin: 0 auto; margin-top: 12rpx; display: inline-block; + margin-left: 12rpx; + position: relative; } @@ -386,7 +442,7 @@ } .icon-container:last-child { - left: 100rpx; + right: 20rpx; } // .icon-container:first-child { -- Gitblit v1.9.3