From 33988b65f7818207e4cf2686cb9be46e3976958c Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期一, 29 七月 2024 18:16:04 +0800 Subject: [PATCH] update 售后、合伙人绑定二维码 --- pages/order/order-detail.vue | 218 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 200 insertions(+), 18 deletions(-) diff --git a/pages/order/order-detail.vue b/pages/order/order-detail.vue index f0e61f5..4aab10e 100644 --- a/pages/order/order-detail.vue +++ b/pages/order/order-detail.vue @@ -4,6 +4,8 @@ return { id: '', dto: {}, + showSales: false, + submitForm: {}, type: '', // #ifdef PUB_CUSTOMER type: 'customer', @@ -106,7 +108,7 @@ } break case 'payAgain': { - await this.$message.confirm('是否确定重新') + await this.$message.confirm('是否确定重新支付') // 发送请求 this.$message.showLoading() const { @@ -143,7 +145,7 @@ case 'evaluate': { const res = await this.$message.confirm('', { editable: true, - title:'请输入评价信息' + title: '请输入评价信息' }) if (res.content && res.confirm) { // 发送请求 @@ -163,20 +165,127 @@ } } break - case 'couldRefund': { + case 'sales': { + //新增售后单 + //去新的页面加上这些选择? + this.submitForm = { + orderId: this.id, + imageList: [], + videoList: [], + reason: [], + orderItems: [], + } + this.showSales = true } default: break } - } + }, + changeSalesOrderItem(dto) { + if (this.submitForm.orderItems.indexOf(dto.id) < 0) { + this.submitForm.orderItems.push(dto.id) + } else { + this.submitForm.orderItems.splice(this.submitForm.orderItems.indexOf(dto.id), 1) + } + }, + deleteCheckImage(key, index) { + this.submitForm[key].splice(index, 1) + this.$forceUpdate() + }, + uploadIcon(key) { + console.log('that dto key', key) + const that = this + if (key === 'video') { + uni.chooseVideo({ + maxDuration: 30, + sourceType: ['camera', 'album'], + success: function(res) { + if (res.size > 1024 * 1024 * 50) { + that.$message.confirm('视频最多支持50M大小,超出大小限制') + return + } + if (res.tempFilePath) { + console.log('res.tempFilePath', res.tempFilePath) + that.$message.showLoading() + that.$http.upload(res.tempFilePath).then(async res => { + var pic = res.data && res.data.length > 0 && res.data[ + 0] + .url || '' + that.$message.hideLoading() + that.submitForm.videoList.push(pic || '') + + that.$forceUpdate() + }).catch(res => { + that.$message.hideLoading() + console.error(res) + }) + } + } + }); + } else { + + uni.chooseImage({ + count: 1, // 最多可以选择的图片张数,默认9 + sizeType: ['compressed'], //original 原图,compressed 压缩图,默认二者都有 + sourceType: ['camera', 'album'], //album 从相册选图,camera 使用相机,默认二者都有。如需直接开相机或直接选相册,请只使用一个选项 + success: function(res) { + let errMsg = res.errMsg + let tempFiles = res.tempFiles + if (errMsg === 'chooseImage:ok') { + // console.log(tempFiles[0]) + if (tempFiles[0].size > 1024 * 1024 * 5) { + that.$message.confirm('图片最多支持5M大小,超出大小限制') + return + } + that.$message.showLoading() + that.$http.upload(tempFiles[0].path).then(async res => { + console.log('res1', res) + var pic = res.data && res.data.length > 0 && res.data[ + 0] + .url || '' + that.$message.hideLoading() + that.submitForm.imageList.push(pic) + + that.$forceUpdate() + }).catch(res => { + that.$message.hideLoading() + console.error(res) + }) + } + } + }) + } + }, + + async submitSales() { + if (this.submitForm.orderItems.length < 1) { + this.$message.showToast('未选择需要售后的商品') + return + } + await this.$message.confirm('确定申请售后吗') + this.$message.showLoading() + const { + code, + data + } = await this.$http.request('post', '/api/customer/sales/add', { + data: { + ...this.submitForm + } + }) + this.$message.hideLoading() + if (code == 0) { + this.$message.showToast('提交成功') + this.showSales = false + } + }, }, } </script> <template> <view class="order-detail-page"> - <view class="top-tip flex "> + <view class="top-tip flex " v-if="!showSales"> <image src="/static/common/icon-order-status-SEND.png" class="icon-car m-r-6 img100"></image> <view> <view>{{ @@ -189,10 +298,10 @@ <view class="desc-gray">支付时间:{{dto.paymentTime}}</view> </view> </view> - <view class="address-container bg-white br-4 m-t-12"> + <view class="address-container bg-white br-4 m-t-12" v-if="!showSales"> <view class="flex"> <image src="/static/common/icon-loc.png" class="image m-r-10"></image> - + <view class="info"> <view class="title"> {{ dto.customer }} @@ -208,6 +317,8 @@ {{ item.supplierName }} </view> <view class="flex m-t-12"> + <radio :checked="submitForm.orderItems.indexOf(item.id)>=0" @click="changeSalesOrderItem(item)"></radio> + <image class="flower-img img100 m-r-6" :src="item.flowerCover" @click="previewImg(item.flowerCover)"> </image> <view class="flex1"> @@ -215,9 +326,6 @@ <view class="title"><span class="level">{{ item.flowerCategory }}</span><span class="level">{{ item.flowerLevelStr }}</span>{{ item.flowerName }} </view> - <!-- <view class="m-l-a m-r-0">--> - <!-- {{item.flowerCategory || '-'}}--> - <!-- </view>--> </view> <view class="each-list"> <view class="each-item"> @@ -248,7 +356,7 @@ </view> </view> - <view class="info-container bg-white br-4"> + <view class="info-container bg-white br-4" v-if="!showSales"> <view class="form-item"> <view class="label">订单编号:</view> <view class="value">{{ dto.orderNo || '-' }}</view> @@ -302,7 +410,7 @@ <view class="value">{{ dto.remarks || '-' }}</view> </view> </view> - <view class="info-container bg-white br-4 m-t-12"> + <view class="info-container bg-white br-4 m-t-12" v-if="!showSales"> <view class="form-item"> <view class="label">订单金额:</view> <view class="value">{{ dto.totalAmount || '-' }}</view> @@ -322,7 +430,7 @@ </view> - <view class="info-container bg-white br-4 m-t-12"> + <view class="info-container bg-white br-4 m-t-12" v-if="!showSales"> <view class="icon-view"> <image src="/static/common/icon-kf.png" class="icon-kf m-r-10 img100 icon"></image> 我的客服 @@ -339,11 +447,54 @@ </view> </view> + + <view class="info-container form bg-white br-4 m-t-12" v-if="showSales"> + <!-- 表单更新 --> + <view class="form-item"> + <view class="form-item-label"> + 理由 + </view> + <view class="form-item-value"> + <input v-model="submitForm.reason" clearable placeholder="请输入理由" class="form-input"></input> + </view> + </view> + <view class="form-item"> + <view class="form-item-label"> + 图片 + </view> + <view class="form-item-value m-l-a m-r-0"> + <view class="t-red" @click="uploadIcon('image')">上传</view> + </view> + </view> + <view class="flex p20" v-if="submitForm.imageList&&submitForm.imageList.length>0"> + <view class="m-t-12 m-r-10 " v-for="(timg,index) of submitForm.imageList" :key="index"> + <image class="check-img" :src="timg" @click.stop="previewImg(timg)"> + </image> + <view class="t-red text-center" @click.stop="deleteCheckImage('imageList',index)">删除</view> + </view> + </view> + <view class="form-item"> + <view class="form-item-label"> + 视频 + </view> + <view class="form-item-value m-l-a m-r-0"> + <view class="t-red" @click="uploadIcon('video')">上传</view> + </view> + </view> + <view class="flex p20" v-if="submitForm.videoList&&submitForm.videoList.length>0"> + <view class="m-t-12 m-r-10 " v-for="(timg,index) of submitForm.videoList" :key="index"> + <video :src="timg" style="display: block;margin: 0 auto;"></video> + + <view class="t-red text-center" @click.stop="deleteCheckImage('videoList',index)">删除</view> + </view> + </view> + </view> + <!-- #ifdef PUB_CUSTOMER --> <view class="button-space"></view> - <view class="buttons-bottom flex"> + <view class="buttons-bottom flex" v-if="!showSales"> <view class="button button-1" @click="buttonClick('refund')" v-if="dto.couldRefund">申请退款 </view> <view class="button button-1" @click="buttonClick('confirm')" v-if="dto.status ==='RECEIVE'"> 确认收货 @@ -352,10 +503,18 @@ </view> <view class="button button-1" @click="buttonClick('evaluate')" v-if=" dto.status === 'EVALUATE'"> 评价 </view> - <!-- <view class="button button-1" @click="buttonClick('couldRefund')" - v-if="dto.couldRefund"> 退款 - </view> --> - + <view class="button button-1" @click="buttonClick('sales')" + v-if=" dto.status === 'EVALUATE'||dto.status=='COMPLETED'"> 申请售后 + </view> + </view> + <view v-if="showSales"> + <view style="min-height:200rpx"> + </view> + <view class="bottom-price flex"> + <view class="button-green-1 m-l-a m-r-0" style="min-width: 240rpx" @click="submitSales"> + 提交售后申请({{submitForm.orderItems&&submitForm.orderItems.length||0}}) + </view> + </view> </view> <!-- #endif --> <!-- @@ -369,6 +528,29 @@ background: #F7F7F7; padding: 30rpx; + .check-img { + width: 96rpx; + height: 96rpx; + border-radius: 4rpx; + border: 2rpx dashed #CECECE; + } + + .bottom-price { + position: fixed; + background-color: #ffffff; + left: 0rpx; + padding: 20rpx; + padding-bottom: 40rpx; + right: 0rpx; + bottom: 0rpx; + + .button-green-1 { + min-width: 400rpx; + padding-left: 20rpx; + padding-right: 20rpx; + } + } + .button-space { min-height: 140rpx; } -- Gitblit v1.9.3