153 lines
4.1 KiB
Vue
153 lines
4.1 KiB
Vue
<template>
|
||
<!-- popup -->
|
||
<view>
|
||
<uni-popup ref="deliveryOrderPopup" type="bottom" @change="changePopup">
|
||
<view class="text-bold text-gray text-lg text-center left-top-sm-bar" data-popup="deliveryOrderPopup" @click="closePopup"><text
|
||
class="cuIcon-close"></text></view>
|
||
<view class="bg-white padding" style="padding-top: 74rpx; min-height: 1000rpx;">
|
||
<view class="text-xxl text-center">交货记录</view>
|
||
<view class="text-lg text-left">上传交货照片（非必填）:</view>
|
||
<view>
|
||
<div class="grid col-3 grid-square">
|
||
<view class="bg-img" v-for="(item,index) in imgList" :key="index"
|
||
@tap="viewImage($event, imgList)" :data-url="item">
|
||
<image :src="item" mode="aspectFill"></image>
|
||
<view class="cu-tag bg-red" @tap.stop="delImg($event, imgList)" :data-index="index">
|
||
<text class='cuIcon-close'></text>
|
||
</view>
|
||
</view>
|
||
<view class="solids" @tap="chooseImage" v-if="imgList.length < 6">
|
||
<text class='cuIcon-cameraadd'></text>
|
||
</view>
|
||
</div>
|
||
</view>
|
||
<view class="text-lg text-left">备注:</view>
|
||
<view style="margin-bottom: 10rpx;">
|
||
<textarea style="width: 100%;box-sizing: border-box;" class="custom-input radius-input" placeholder="温馨提示：服务过程中有分歧存在客诉隐患或未能及时处理彻底的，请急报说明情况，将由平台客服一起协调沟通，否则造成你有责任的客诉将不利于服务评价。" cols="30" rows="10" v-model="form.handoverRemark"></textarea>
|
||
</view>
|
||
<view class="cu-bar bg-white solid-top">
|
||
<view class="action margin-0 flex-sub text-black" @tap="closePopup">取消</view>
|
||
<view class="action margin-0 flex-sub text-main-color solid-left" @click="Submit">提交</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
emits: ['confirmFeedback', 'close'],
|
||
props: {
|
||
show: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
data: {
|
||
type: Object,
|
||
default: () => {}
|
||
}
|
||
},
|
||
watch: {
|
||
show: {
|
||
handler(newVal) {
|
||
if(newVal) {
|
||
this.$nextTick(() => {
|
||
this.$refs.deliveryOrderPopup.open()
|
||
})
|
||
}
|
||
},
|
||
immediate: true
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
form: {
|
||
handoverRemark: '',
|
||
handoverImages: '',
|
||
},
|
||
imgList: [],
|
||
}
|
||
},
|
||
methods: {
|
||
chooseImage(e) {
|
||
uni.chooseMedia({
|
||
count: 1, //默认9
|
||
mediaType: ['image'],
|
||
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
||
sourceType: ['album'], //从相册选择
|
||
success: (res) => {
|
||
uni.showLoading({
|
||
title: '上传中',
|
||
mask: true
|
||
});
|
||
res.tempFiles.forEach((fileObj, index) => {
|
||
this.$request.uploadFile(fileObj.tempFilePath).then((url) => {
|
||
this.imgList.push(url);
|
||
if (index === res.tempFiles.length - 1) {
|
||
uni.hideLoading();
|
||
}
|
||
});
|
||
});
|
||
}
|
||
});
|
||
},
|
||
viewImage(e, imgList) {
|
||
uni.previewImage({
|
||
urls: imgList,
|
||
current: e.currentTarget.dataset.url
|
||
});
|
||
},
|
||
delImg(e, imgList) {
|
||
uni.showModal({
|
||
title: '',
|
||
content: '确定要删除这张图片吗？',
|
||
cancelText: '取消',
|
||
confirmText: '确定',
|
||
success: res => {
|
||
if (res.confirm) {
|
||
imgList.splice(e.currentTarget.dataset.index, 1)
|
||
}
|
||
}
|
||
})
|
||
},
|
||
changePopup(e) {
|
||
console.log(e);
|
||
if(!e.show) {
|
||
this.closePopup()
|
||
}
|
||
},
|
||
closePopup() {
|
||
this.$emit('close')
|
||
},
|
||
async Submit() {
|
||
// 确定方法名
|
||
let reqFunName = "updateOrder", id;
|
||
if (this.data.orderDetailId == null) {
|
||
id = this.data.orderMasterId;
|
||
} else {
|
||
reqFunName = "updateDetailOrder";
|
||
id = this.data.orderDetailId;
|
||
}
|
||
const updateOrderParams = {
|
||
...this.form,
|
||
id: id,
|
||
handoverImages: this.imgList.length ? this.imgList.toString() : ''
|
||
}
|
||
|
||
let res = await this.$request[reqFunName](updateOrderParams);
|
||
if (res.code === 0) {
|
||
this.$emit('confirmFeedback')
|
||
} else {
|
||
uni.showToast({
|
||
title: '操作失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
</style> |