From 89de2bbaf2e81ab3fa7a8c2aad3b76bc81033d3d Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期二, 23 七月 2024 18:44:27 +0800 Subject: [PATCH] update 订单功能(花店端) --- sub_pages/customer/shopping/shopping.vue | 361 +++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 344 insertions(+), 17 deletions(-) diff --git a/sub_pages/customer/shopping/shopping.vue b/sub_pages/customer/shopping/shopping.vue index 63c4619..54ca191 100644 --- a/sub_pages/customer/shopping/shopping.vue +++ b/sub_pages/customer/shopping/shopping.vue @@ -1,25 +1,352 @@ <template> - <view> - - <view style="min-height:200rpx"> - </view> - <common-footer flg="2"></common-footer> - </view> + <view class="shopping-container"> + <view class="top-title"> 苏州市一价全含,市区内包邮派送到店 + </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="name"> + 客服电话 : <span class="topic-gray">{{ tel }}</span> + </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="item-each flex"> + <radio :checked="ids.indexOf(dto.id)>=0" @change="changeItem(dto,'flower')"></radio> + <image class="img img100 m-r-6" :src="dto.url||dto.cover"></image> + <view> + <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> + </view> + </view> + </view> + </u-swipe-action-item> + </u-swipe-action> + </view> + + </view> + <view style="min-height:200rpx"> + </view> + <view class="bottom-price flex"> + <view> + <radio :checked="checkall" @change="selectAll"></radio> + 全选 + </view> + <view> + 合计:¥ {{ totalprice }} 元 + </view> + <view class="button-green-1"> + 提交订单 + </view> + </view> + <view style="min-height:200rpx"> + </view> + <common-footer flg="2"></common-footer> + </view> </template> <script> - export default { - data() { - return { - - } - }, - methods: { - - } - } +import http from "../../../plugins/http"; + +export default { + data() { + return { + tel: '15974805814', + ids: [], + checkall: false, + options1: [{ + text: '删除' + }] + } + }, + onShow() { + if (this.sign['shopping']) { + this.init() + } + }, + onLoad() { + this.init() + }, + computed: { + totalprice() { + + let totalprice = 0 + this.list.forEach(dto => { + dto.flowerList.forEach(item => { + if (this.ids.indexOf(item.id) >= 0) { + totalprice += item.price * item.num + } + }) + }) + 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) { + arr.push({ + id: this.list.flowerList[j].id, + num: this.list.flowerList[j].num + }) + } + } + 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 + } + } + ) + 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 + } + } + } + } + }, + selectAll() { + if (this.checkall) { + this.ids = [] + this.checkall = false + } else { + list.for(dto => { + if (this.ids.indexOf(dto.id) < 0) { + this.ids.push(dto.id) + } + dto.flowerList.forEach(item => { + if (this.ids.indexOf(item.id) < 0) { + this.ids.push(item.id) + } + }) + }) + } + }, + changeItem(dto, type) { + if (type === 'supplier') { + //全选上 + if (this.ids.indexOf(dto.id) < 0) { + this.ids.push(dto.id) + dto.flowerList.forEach(item => { + if (this.ids.indexOf(item.id) < 0) { + this.ids.push(item.id) + } + }) + } else { + this.checkall = false + this.ids.splice(this.ids.indexOf(dto.id), 1) + dto.flowerList.forEach(item => { + this.ids.splice(this.ids.indexOf(item.id), 1) + }) + } + + } else { + //更换个人的 + if (this.ids.indexOf(dto.id) < 0) { + this.ids.push(dto.id) + } else { + this.checkall = false + + if (this.ids.indexOf(dto.supplierId) >= 0) { + this.ids.splice(this.ids.indexOf(dto.supplierId), 1) + } + } + + } + }, + async addnum(dto, addnum) { + if (dto.num + addnum >= 0) { + + } else { + return + } + this.$message.showLoading() + const {code} = await http.request('post', '/api/api/customer/flower/cart/change-num', { + data: { + id: dto.id, + num: addnum + } + } + ) + this.$message.hideLoading() + if (code === 0) { + dto.num += addnum + } + }, + async init() { + 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 || [] + + } + } + } +} </script> -<style> +<style lang="scss" scoped> +.shopping-container { + background-color: rgba(255, 255, 255, 0.4); + padding: 20rpx 30rpx; + .bottom-price { + position: fixed; + left: 0rpx; + padding: 20rpx; + right: 0rpx; + bottom: 160rpx; + } + + .shopping-item { + padding: 28rpx 22rpx; + position: relative; + + .sup-title { + + } + + .item-each { + padding-left: 88rpx; + + .img { + width: 124rpx; + height: 124rpx; + } + + .title { + font-weight: 600; + font-size: 28rpx; + + color: #000000; + line-height: 40rpx; + + .level { + color: #20613D; + } + } + + .price { + font-weight: 400; + font-size: 28rpx; + color: #CF0000; + line-height: 40rpx; + } + + .desc { + font-weight: 400; + font-size: 24rpx; + color: #666666; + line-height: 34rpx; + } + } + + .button-icons { + position: absolute; + } + } + + .top-title { + font-size: 28rpx; + color: #000000; + line-height: 40rpx; + } + + .top-desc { + font-size: 24rpx; + color: #666666; + line-height: 34rpx; + } + + .top-kf { + background: linear-gradient(270deg, rgba(219, 244, 229, 0) 0%, #D5ECDE 100%); + border-radius: 8rpx; + font-weight: 400; + font-size: 24rpx; + color: #20613D; + line-height: 52rpx; + height: 52rpx; + padding-left: 26rpx; + + .icon-clock { + margin-top: 9rpx; + } + } +} </style> -- Gitblit v1.9.3