From f8e8ad7f92b351154ebfbda6380a3254ac76a3ae Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期五, 26 七月 2024 17:04:09 +0800 Subject: [PATCH] update --- sub_pages/customer/shopping/shopping.vue | 261 +++++++++++++++++++++++++++++---------------------- 1 files changed, 148 insertions(+), 113 deletions(-) diff --git a/sub_pages/customer/shopping/shopping.vue b/sub_pages/customer/shopping/shopping.vue index 54ca191..df79d8b 100644 --- a/sub_pages/customer/shopping/shopping.vue +++ b/sub_pages/customer/shopping/shopping.vue @@ -1,67 +1,73 @@ <template> <view class="shopping-container"> - <view class="top-title"> 苏州市一价全含,市区内包邮派送到店 + <view class="top-title"><span class="t-red">*</span> 苏州市一价全含,市区内包邮派送到店 </view> <view class="top-desc"> 全程鲜花冷链专线,时效快,损耗小 </view> - <view class="flex"> - <image class="icon-clock m-r-6" src="../../../static/common/icon-call.png"></image> + <view class="flex top-kf"> + <image class="icon-clock m-r-6" src="../../../static/common/icon-kf.png"></image> <view class="name"> - 客服电话 : <span class="topic-gray">{{ tel }}</span> + 15974805814 </view> </view> <view class=""> <no-data v-if="!list||list.length===0" style="width: 100%;"></no-data> <view class="shopping-item m-t-20" v-for="(item,index) of list" :key="index"> - <u-swipe-action> - <u-swipe-action-item - :options="options1" - @click="(e)=>{clickSwipeButton(item)}" - > - <view class="sup-title"> - <radio :checked="ids.indexOf(item.id)>=0" @change="changeItem(item,'supplier')">></radio> - {{ item.supplierName || '-' }} - </view> - <u-divider></u-divider> - <view v-for="(dto,j) of item.flowerList" :key="j"> - <u-divider v-if="j>0"></u-divider> + + + <view class="sup-title"> + <radio :checked="ids.indexOf(item.id)>=0" @click="changeItem(item,'supplier')"></radio> + {{ item.supplierName || '-' }} + </view> + <u-divider></u-divider> + <view v-for="(dto,j) of item.flowerList" :key="j"> + <u-divider v-if="j>0"></u-divider> + <u-swipe-action> + <u-swipe-action-item + :options="options1" + @click="(e)=>{clickSwipeButton(dto)}" + > <view class="item-each flex"> - <radio :checked="ids.indexOf(dto.id)>=0" @change="changeItem(dto,'flower')"></radio> + <radio :checked="ids.indexOf(dto.id)>=0" @click="changeItem(dto,'flower')"></radio> <image class="img img100 m-r-6" :src="dto.url||dto.cover"></image> - <view> + <view class="flex1"> <view class="title"><span>{{ dto.levelStr || '-' }}</span> {{ dto.name || '-' }}</view> <view class="price"> {{ dto.price || '-' }}元/扎 </view> - <view class="desc m-t-12"> - <view class="m-r-15">剩余:{{ dto.stock || 0 }}</view> - </view> - <view class="button-icons flex"> - <uni-icons v-if="dto.num&&dto.num>=1" type="minus" size="32" - @click="addnum(dto,-1)"></uni-icons> - <view class="curnums" v-if="dto.num&&dto.num>=1">{{ dto.num }}</view> - <uni-icons type="plus-filled" size="32" @click="addnum(dto,1)"></uni-icons> + <view class="flex"> + <view class="desc m-t-12"> + <view class="m-r-15">剩余:{{ dto.stock || 0 }}</view> + </view> + <view class="button-icons flex m-l-a m-r-0"> + <uni-icons v-if="dto.num&&dto.num>=1" type="minus" size="32" + @click="addnum(dto,-1)"></uni-icons> + <view class="curnums" v-if="dto.num&&dto.num>=1">{{ dto.num }}</view> + <uni-icons type="plus-filled" size="32" @click="addnum(dto,1)"></uni-icons> + </view> </view> </view> </view> - </view> - </u-swipe-action-item> - </u-swipe-action> + </u-swipe-action-item> + </u-swipe-action> + </view> + + </view> </view> <view style="min-height:200rpx"> </view> <view class="bottom-price flex"> - <view> - <radio :checked="checkall" @change="selectAll"></radio> + <view class="m-t-12"> + <radio :checked="checkall" @click="selectAll"></radio> 全选 </view> - <view> - 合计:¥ {{ totalprice }} 元 + <view class="m-t-12 m-l-a m-r-20 text-center"> + 合计:<span class="t-red">¥ {{ totalprice || 0 }}</span> 元 </view> - <view class="button-green-1"> + <view class="button-green-1 m-l-a m-r-0" style="min-width: 240rpx" @click="submitPay"> 提交订单 </view> </view> @@ -82,7 +88,8 @@ checkall: false, options1: [{ text: '删除' - }] + }], + list: [] } }, onShow() { @@ -90,15 +97,15 @@ this.init() } }, - onLoad() { + mounted() { this.init() }, computed: { totalprice() { let totalprice = 0 - this.list.forEach(dto => { - dto.flowerList.forEach(item => { + this.list && this.list.forEach(dto => { + dto.flowerList && dto.flowerList.forEach(item => { if (this.ids.indexOf(item.id) >= 0) { totalprice += item.price * item.num } @@ -106,84 +113,95 @@ }) return totalprice.toFixed(2) }, - methods: { - async submitPay() { - // order/confirm/info - var arr = [] - for (var j = 0; j < this.list.flowerList; j++) { - - if (this.ids.indexOf(this.list.flowerList[j].id) >= 0) { + }, + methods: { + async submitPay() { + // order/confirm/info + var arr = [] + for (var j = 0; j < this.list.length; j++) { + if(!this.list[j].flowerList){ + continue + } + for (var k = 0; k < this.list[j].flowerList.length; k++) { + if (this.ids.indexOf(this.list[j].flowerList[k].id) >= 0) { arr.push({ - id: this.list.flowerList[j].id, - num: this.list.flowerList[j].num + id: this.list[j].flowerList[k].id, + num: this.list[j].flowerList[k].num }) + } else { + // console.log('skip', arr, this.list.flowerList[j],this.list.flowerList[j].id) } } - if (this.arr.length < 1) { - return - } - this.$message.showLoading() - const {code, data} = await http.request('post', '/api/api/customer/order/confirm/info', { - data: { - flowers: arr, - } - } - ) - this.$message.hideLoading() - if (code === 0) { - uni.navigateTo({ - url: '/sub_pages/customer/shopping/confirm?dto=' + +encodeURIComponent(JSON.stringify(data)) - }) - } - }, - async clickSwipeButton(item) { - //删除商品,重新加载数据? - this.$message.showLoading() - const {code} = await http.request('post', '/api/api/customer/flower/cart/change-num', { - data: { - id: dto.id, - num: addnum - } + } + if (arr.length < 1) { + console.log('请选择商品', arr, this.ids) + return + } + this.$message.showLoading() + const {code, data} = await http.request('post', '/api/customer/flower/order/confirm/info', { + data: { + flowers: arr, } - ) - this.$message.hideLoading() - if (code === 0) { - if (this.ids.indexOf(item.id) >= 0) { - this.ids.splice(this.ids.indexOf(item.id), 1) } - for (var i = 0; i < this.list.length; i++) { - if (this.list[i].id === dto.supplierId) { - this.list[i].splice(i, 1) - if (this.list.flowerList.length === 1) { - if (this.ids.indexOf(this.list[i].id) >= 0) { - this.ids.splice(this.ids.indexOf(this.list[i].id), 1) - } - this.list[i].flowerList.splice(0, 1) - this.list.splice(i, 1) - } else { - //只需要清楚这个元素 - var k = -1 - for (var j = 0; j < this.list[i].flowerList.length; j++) { - if (this.list[i][j].id === item.id) { - k = j; - break - } - } - this.list[i].flowerList.splice(k, 1) - } - break + ) + this.$message.hideLoading() + if (code === 0) { + this.$storage.setItem('_cache_shopping_dto',JSON.stringify(data)) + uni.navigateTo({ + url: '/sub_pages/customer/shopping/confirm' + }) + } + }, + async clickSwipeButton(item) { + //删除商品,重新加载数据? + + this.$message.showLoading() + const {code} = await http.request('get', '/api/customer/flower/cart/delete', { + params: { + id: item.id, } + } + ) + this.$message.hideLoading() + if (code === 0) { + if (this.ids.indexOf(item.id) >= 0) { + this.ids.splice(this.ids.indexOf(item.id), 1) + } + for (var i = 0; i < this.list.length; i++) { + if (this.list[i].id === item.supplierId) { + this.list[i].splice(i, 1) + if (this.list[i].flowerList.length === 1) { + if (this.ids.indexOf('supplier@' + this.list[i].supplierId) >= 0) { + this.ids.splice(this.ids.indexOf('supplier@' + this.list[i].supplierId), 1) + } + this.list[i].flowerList.splice(0, 1) + this.list.splice(i, 1) + } else { + //只需要清楚这个元素 + var k = -1 + for (var j = 0; j < this.list[i].flowerList.length; j++) { + if (this.list[i][j].id === item.id) { + k = j; + break + } + } + this.list[i].flowerList.splice(k, 1) + } + break } } } }, + selectAll() { + console.log('selectAll', this.checkall) if (this.checkall) { this.ids = [] this.checkall = false + // this.$forceUpdate() } else { - list.for(dto => { + this.list.forEach(dto => { if (this.ids.indexOf(dto.id) < 0) { this.ids.push(dto.id) } @@ -193,13 +211,15 @@ } }) }) + this.checkall = true } }, changeItem(dto, type) { + console.log('click changeItem', dto, type, this.ids) if (type === 'supplier') { //全选上 - if (this.ids.indexOf(dto.id) < 0) { - this.ids.push(dto.id) + if (this.ids.indexOf('supplier@' + dto.supplierId) < 0) { + this.ids.push('supplier@' + dto.supplierId) dto.flowerList.forEach(item => { if (this.ids.indexOf(item.id) < 0) { this.ids.push(item.id) @@ -207,9 +227,9 @@ }) } else { this.checkall = false - this.ids.splice(this.ids.indexOf(dto.id), 1) + this.ids.splice(this.ids.indexOf('supplier@' + dto.supplierId), 1) dto.flowerList.forEach(item => { - this.ids.splice(this.ids.indexOf(item.id), 1) + this.ids.splice(this.ids.indexOf('supplier@' + item.supplierId), 1) }) } @@ -220,8 +240,8 @@ } else { this.checkall = false - if (this.ids.indexOf(dto.supplierId) >= 0) { - this.ids.splice(this.ids.indexOf(dto.supplierId), 1) + if (this.ids.indexOf(dto.id) >= 0) { + this.ids.splice(this.ids.indexOf(dto.id), 1) } } @@ -234,7 +254,7 @@ return } this.$message.showLoading() - const {code} = await http.request('post', '/api/api/customer/flower/cart/change-num', { + const {code} = await http.request('post', '/api/customer/flower/cart/change-num', { data: { id: dto.id, num: addnum @@ -247,13 +267,17 @@ } }, async init() { + if (!this.currentInfo.customerDTO) { + this.$message.showToast('请先前往个人中心补充个人信息') + return + } this.$message.showLoading() await this.$store.dispatch('sign_clear', 'shopping'); const {code, data} = await this.$http.request('get', '/api/customer/flower/cart/list', {}) this.$message.hideLoading() this.list = [] if (code === 0) { - this.list = data.list || [] + this.list = data || [] } } @@ -268,6 +292,7 @@ .bottom-price { position: fixed; + background-color: #ffffff; left: 0rpx; padding: 20rpx; right: 0rpx; @@ -277,13 +302,15 @@ .shopping-item { padding: 28rpx 22rpx; position: relative; + background-color: #ffffff; .sup-title { - + margin-left: 10rpx; + margin-top: 10rpx; } .item-each { - padding-left: 88rpx; + padding-left: 40rpx; .img { width: 124rpx; @@ -318,20 +345,27 @@ } .button-icons { - position: absolute; + //position: absolute; + //z-index: 10; + line-height: 40rpx; + + .curnums { + margin-left: 10rpx; + margin-right: 10rpx; + } } } .top-title { - font-size: 28rpx; + font-size: 32rpx; color: #000000; line-height: 40rpx; } .top-desc { - font-size: 24rpx; + font-size: 28rpx; color: #666666; - line-height: 34rpx; + line-height: 40rpx; } .top-kf { @@ -339,6 +373,7 @@ border-radius: 8rpx; font-weight: 400; font-size: 24rpx; + margin-top: 10rpx; color: #20613D; line-height: 52rpx; height: 52rpx; -- Gitblit v1.9.3