|
|
|
@ -6,16 +6,16 @@ |
|
|
|
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true"> |
|
|
|
|
|
|
|
<view class="flex justify-between align-start padding-top-sm padding-lr"> |
|
|
|
<image src="@/static/tu.png" mode="aspectFill" style="width: 150rpx; height: 150rpx;"></image> |
|
|
|
<image :src="applyDetails.order.goods.cover" mode="aspectFill" style="width: 150rpx; height: 150rpx;"></image> |
|
|
|
<view class="flex-sub padding-left-sm"> |
|
|
|
<view class="bref-box margin-top-xs"> |
|
|
|
网红辣椒棒 魔鬼辣椒挑战全网第一辣 网红优惠季 |
|
|
|
{{applyDetails.order.goods.name}} |
|
|
|
</view> |
|
|
|
<text class="block margin-top-sm text-gray text-sm">数量 <text class="margin-left text-gray">x1</text></text> |
|
|
|
<text class="block margin-top-sm text-gray text-sm">数量 <text class="margin-left text-gray">x{{applyDetails.order.number}}</text></text> |
|
|
|
|
|
|
|
<view class="flex justify-between margin-top-sm"> |
|
|
|
<view class="text-red text-price text-lg"> |
|
|
|
19.90 |
|
|
|
{{applyDetails.order.selling_price}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -30,19 +30,19 @@ |
|
|
|
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center"> |
|
|
|
<text class="text-gray">订单金额</text> |
|
|
|
<view class="text-price"> |
|
|
|
19.90 |
|
|
|
{{applyDetails.order.amount}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center"> |
|
|
|
<text class="text-gray">扣费率</text> |
|
|
|
<view> |
|
|
|
<text>30%</text> |
|
|
|
<text>{{applyDetails.order.refund_rate}}%</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center"> |
|
|
|
<text class="text-gray">扣费金额</text> |
|
|
|
<view class="text-price"> |
|
|
|
3.90 |
|
|
|
{{applyDetails.order.refund_rate_amount}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -55,19 +55,19 @@ |
|
|
|
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center"> |
|
|
|
<text class="text-gray">可退金额</text> |
|
|
|
<view class="text-price"> |
|
|
|
16.00 |
|
|
|
{{applyDetails.order.refund_amount}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center"> |
|
|
|
<text class="text-gray">订单编号</text> |
|
|
|
<view> |
|
|
|
<text class="margin-right">67432428794847982374</text> |
|
|
|
<text class="text-orange text-sm" @tap="copy('67432428794847982374')">复制</text> |
|
|
|
<text class="margin-right">{{applyDetails.order.order_sn}}</text> |
|
|
|
<text class="text-orange text-sm" @tap="copy(applyDetails.order.order_sn)">复制</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="cu-bar padding-lr solid-bottom"> |
|
|
|
<text class="text-gray">退款说明</text> |
|
|
|
<input type="text" class="text-right text-df" placeholder="请输入反馈信息" /> |
|
|
|
<input type="text" v-model="applyInfo" class="text-right text-df" placeholder="请输入反馈信息" /> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</skeleton> |
|
|
|
@ -76,7 +76,7 @@ |
|
|
|
<view class="padding-top padding-lr bg-white"> |
|
|
|
<view class="cu-self menu"> |
|
|
|
<view class="text-gray"> |
|
|
|
由于产品的特殊性，在申请的过程中，供应商会向您收取部分费用。如有疑问可参与产品的《售后说明》或咨询客服 |
|
|
|
{{applyDetails.agreement.tips}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -87,17 +87,28 @@ |
|
|
|
</view> |
|
|
|
<view class="cu-form-group solid-bottom"> |
|
|
|
<view class="grid col-4 grid-square flex-sub"> |
|
|
|
<view class="bg-img" v-for="(item,index) in img_list" :key="index" @tap="showImg(item)" :data-url="img_list[index]"> |
|
|
|
<image :src="img_list[index]" mode="aspectFill"></image> |
|
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg(index)" :data-index="index"> |
|
|
|
<text class='cuIcon-close'></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="solids" @tap="ChooseImage" v-if="img_list.length<3"> |
|
|
|
<text class='cuIcon-cameraadd'></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- <view class="grid col-4 grid-square flex-sub"> |
|
|
|
<view class="solids" @tap="ChooseImage" v-if="hostImg == ''"><text class="cuIcon-cameraadd"></text></view> |
|
|
|
|
|
|
|
<view class="bg-img" v-else> |
|
|
|
<image :src="hostImg" @tap="showImg" mode="aspectFill"></image> |
|
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg"><text class="cuIcon-close"></text></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="padding-top-sm padding-lr-lg"> |
|
|
|
<button class="cu-btn block bg-orange lg margin-top round" @tap="$routerGo('/pages/order/apply-details')"> |
|
|
|
<button class="cu-btn block bg-orange lg margin-top round" @tap="subimitApply()"> |
|
|
|
<text class="cuIcon-loading2 cuIconfont-spin margin-right-xs text-white" v-if="loading"></text> |
|
|
|
<text class="text-df text-white">确认申请</text> |
|
|
|
</button> |
|
|
|
@ -116,56 +127,194 @@ |
|
|
|
hostImg: '', |
|
|
|
// 已上传服务器的图片名称 |
|
|
|
serverImg:'', |
|
|
|
orderId: 1, |
|
|
|
applyDetails: {}, |
|
|
|
applyInfo: '', |
|
|
|
imageOnline: '', |
|
|
|
is_wx_reduce: true, |
|
|
|
img_list: [], // 反馈问题图片 |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
|
|
|
|
}, |
|
|
|
onLoad(e) { |
|
|
|
this.orderId = e.orderId |
|
|
|
if(this.orderId) { |
|
|
|
this.getApplyDetails() |
|
|
|
} |
|
|
|
setTimeout(()=>{ |
|
|
|
this.skeletonLoading = false |
|
|
|
},1000) |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
getApplyDetails() { |
|
|
|
this.$http(this.API.API_APPLY_DETAILS, {order_id: this.orderId}).then(res => { |
|
|
|
if(res.code == 0) { |
|
|
|
this.applyDetails = res.data |
|
|
|
this.skeletonLoading = false |
|
|
|
console.log(this.applyDetails) |
|
|
|
} |
|
|
|
|
|
|
|
}).catch(err => { |
|
|
|
|
|
|
|
}); |
|
|
|
}, |
|
|
|
checkImgInfo(tempFilePath, suc){ |
|
|
|
uni.getImageInfo({ |
|
|
|
src: tempFilePath, |
|
|
|
success (res) { |
|
|
|
let type = res.type; |
|
|
|
console.log('checkImgInfo...', type); |
|
|
|
if(type == 'png' || type == 'jpeg' || type == 'jpg'){ |
|
|
|
suc && suc(true); |
|
|
|
} else { |
|
|
|
suc && suc(false); |
|
|
|
} |
|
|
|
}, |
|
|
|
fail(err) { |
|
|
|
suc && suc(false); |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
subimitApply() { |
|
|
|
if(!this.applyInfo) { |
|
|
|
this.$msg('请先输入反馈信息!') |
|
|
|
return |
|
|
|
} |
|
|
|
this.upload() |
|
|
|
}, |
|
|
|
// 选择图片 |
|
|
|
ChooseImage(e) { |
|
|
|
let that = this; |
|
|
|
uni.chooseImage({ |
|
|
|
count: 1, |
|
|
|
success: e => { |
|
|
|
this.hostImg = e.tempFilePaths[0]; |
|
|
|
this.upload(this.hostImg) |
|
|
|
sizeType: ['original'], // 可以指定是原图original还是压缩图compressed ，默认二者都有 |
|
|
|
sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有 |
|
|
|
success: res => { |
|
|
|
that.hostImg = res.tempFilePaths[0]; |
|
|
|
console.log('元数据') |
|
|
|
console.log(res) |
|
|
|
// this.upload(this.hostImg) |
|
|
|
|
|
|
|
|
|
|
|
let tempFile = res.tempFiles.shift(); |
|
|
|
let tempFilePath = res.tempFilePaths.shift(); |
|
|
|
that.checkImgInfo(tempFilePath, (res) => { |
|
|
|
// 过滤不是图片不是png、jpeg 格式 |
|
|
|
if(res){ |
|
|
|
if(tempFile.size > 10000000){ |
|
|
|
uni.showModal({ |
|
|
|
title: '', |
|
|
|
content: '您选择的图片过大：'+ (tempFile.size / 1024000).toFixed(2) +"M，请点击确定重新上传", |
|
|
|
success: res2 => { |
|
|
|
if(res2.confirm){ |
|
|
|
uni.chooseImage({ |
|
|
|
count: 1, |
|
|
|
sizeType: ['compressed'], |
|
|
|
sourceType: ['album', 'camera'], |
|
|
|
success: (res3) => { |
|
|
|
let tempFilePath = res3.tempFilePaths.shift(); |
|
|
|
that.is_wx_reduce = true; |
|
|
|
that.img_list.push(tempFilePath); |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
} else{ |
|
|
|
that.img_list.push(tempFilePath); |
|
|
|
} |
|
|
|
} else { |
|
|
|
uni.showModal({ |
|
|
|
title: '', |
|
|
|
content: '选择的图片须为jpg、jpeg或png格式', |
|
|
|
showCancel: false, |
|
|
|
confirmColor: '#1697EE' |
|
|
|
}) |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 上传图片到服务器 |
|
|
|
upload(url){ |
|
|
|
this.$http.upload({ |
|
|
|
url: '/user/api/file/image', |
|
|
|
data: url, |
|
|
|
}).then(res=>{ |
|
|
|
let imgurl = JSON.parse(res.data) |
|
|
|
this.serverImg=imgurl.data; |
|
|
|
let that = this; |
|
|
|
let uploads = []; |
|
|
|
// 商品banner图上传 |
|
|
|
if (that.img_list.length > 0) { |
|
|
|
for (let i = 0; i < that.img_list.length; i++) { |
|
|
|
let upload_img = new Promise((resolve, reject) => { |
|
|
|
that.uploadFile(that.img_list[i], (res) => { |
|
|
|
resolve(res); |
|
|
|
}, (err) => { |
|
|
|
reject(err); |
|
|
|
}); |
|
|
|
}) |
|
|
|
uploads.push(upload_img); |
|
|
|
} |
|
|
|
} |
|
|
|
Promise.all(uploads).then((result) => { |
|
|
|
console.log('图片上传...', result) |
|
|
|
let img_url_list = []; |
|
|
|
if(result.length > 0){ |
|
|
|
img_url_list = JSON.stringify(result); |
|
|
|
} |
|
|
|
if(img_url_list) { |
|
|
|
that.realSubmitInfo(img_url_list); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}).catch(err => { |
|
|
|
console.log(err) |
|
|
|
that.is_publish = false; // 恢复提交按钮 |
|
|
|
uni.showModal({ |
|
|
|
title: '', |
|
|
|
content: '图片上传失败，请重新提交', |
|
|
|
confirmColor: '#1697EE' |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 提交反馈 |
|
|
|
realSubmitInfo(img_url_list){ |
|
|
|
let that = this; |
|
|
|
uni.showToast({ |
|
|
|
title: '请求中', |
|
|
|
icon: "loading", |
|
|
|
duration: 10000 |
|
|
|
}) |
|
|
|
that.$http(that.API.API_SUBMIT_APPLY, {order_id: that.orderId,comment: that.applyInfo,images:img_url_list}).then(res => { |
|
|
|
if(res.code == 0) { |
|
|
|
that.$msg('提交成功') |
|
|
|
that.img_list = [] |
|
|
|
that.applyInfo = '' |
|
|
|
setTimeout(() => { |
|
|
|
that.$routerGo('/pages/order/apply-details?orderId='+that.orderId) |
|
|
|
},1000) |
|
|
|
} |
|
|
|
|
|
|
|
}).catch(err => { |
|
|
|
|
|
|
|
}); |
|
|
|
}, |
|
|
|
// 预览图片 |
|
|
|
showImg() { |
|
|
|
showImg(image) { |
|
|
|
// let image = this.img_list[index]; |
|
|
|
uni.previewImage({ |
|
|
|
urls: [this.hostImg] |
|
|
|
urls: [image], |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 删除图片 |
|
|
|
DelImg() { |
|
|
|
DelImg(index) { |
|
|
|
uni.showModal({ |
|
|
|
title: '提示', |
|
|
|
content: '即将取消上传这张图片，请确认？', |
|
|
|
success: e => { |
|
|
|
if (!e.confirm) return; |
|
|
|
this.hostImg = ''; |
|
|
|
this.serverImg = ''; |
|
|
|
this.img_list.splice(index, 1); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
邓平艺
4 years ago