You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
289 lines
6.9 KiB
289 lines
6.9 KiB
<template>
|
|
<view class="bg">
|
|
<!-- 顶部商品图片、名称 -->
|
|
<view class="top">
|
|
<image :src="showImg(info.specifications_image)" mode=""></image>
|
|
<view class="goods-title text-overflowRows">
|
|
{{info.specifications_name}}
|
|
</view>
|
|
</view>
|
|
<view class="line"></view>
|
|
<!-- <view class="rate-box">
|
|
综合评分
|
|
<img :src="'https://static.ticket.sz-trip.com/dongtai/images/user/' + (starIndex > index ? 'star-seld.png' : 'star.png')"
|
|
v-for="(item,index) in 5" :key="index" @click="changeStar(item)" class="starImg"/>
|
|
</view> -->
|
|
<view class="comment-text">
|
|
<textarea placeholder-style="color:#999;font-size:28rpx;font-weigth:500;" placeholder="请填写您的评价~" style="width: 657rpx;background: #F7F7F7;border-radius: 6px;padding: 28.67rpx 20rpx;" v-model="content"/>
|
|
</view>
|
|
<view class="comment-pic">
|
|
<view class="" style="margin-top: 40.67rpx;margin-bottom: 36.67rpx;">上传图片({{list.length}}/6)</view>
|
|
<uni-file-picker limit="6" file-mediatype="image" return-type="list" ref="files" :auto-upload="false" @select="select" @progress="progress" @success="success" @fail="fail" @delete="del">
|
|
<view class="" style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
|
|
<!-- <image style="width: 40rpx;height: 40rpx;position: absolute;right: 0;top: 0;" src="https://static.ticket.sz-trip.com/tongli/images/order/cha.png" mode=""></image> -->
|
|
<view class="" style="margin-top: 16rpx;font-size: 24rpx;font-weight: 500;color: #999;">
|
|
上传图片
|
|
</view>
|
|
</view>
|
|
</uni-file-picker>
|
|
</view>
|
|
<view class="submit-btn" @click="submit">提交</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import NEWAPIURL from '@/static/js/request.js';
|
|
// import {pathToBase64,base64ToPath} from "../../js_sdk/mmmm-image-tools/index.js";
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
proList: [
|
|
{name: '', img: [], imgList: [], content: ''}
|
|
],
|
|
content:'',
|
|
info: {},
|
|
order_id: '',
|
|
imageStyles: {
|
|
width: 64,
|
|
height: 64,
|
|
border: {
|
|
radius: '50%'
|
|
}
|
|
},
|
|
listStyles: {
|
|
// 是否显示边框
|
|
border: false,
|
|
// 是否显示分隔线
|
|
dividline: false,
|
|
// 线条样式
|
|
// borderStyle: {
|
|
// width: 1,
|
|
// color: 'blue',
|
|
// style: 'dashed',
|
|
// radius: 2
|
|
// }
|
|
},
|
|
fileLists: [],
|
|
list:[],
|
|
starIndex: 5
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
console.log(options);
|
|
if (options.order_id) {
|
|
this.order_id = options.order_id;
|
|
}
|
|
|
|
this.getDetail()
|
|
},
|
|
methods: {
|
|
// 更改评分
|
|
changeStar(item) {
|
|
this.starIndex = item + 1
|
|
},
|
|
del(e) {
|
|
console.log('e',e.tempFile);
|
|
let index = this.list.findIndex(f => f === e.tempFile)
|
|
this.list.splice(index, 1)
|
|
let i = this.fileLists.findIndex(f => f.url === e.tempFile)
|
|
this.fileLists.splice(i, 1)
|
|
this.$forceUpdate()
|
|
console.log('删除后的list',this.list);
|
|
console.log('删除后的fileLists',this.fileLists);
|
|
},
|
|
// 上传照片
|
|
onunload(url){
|
|
console.log('url',url);
|
|
return new Promise((resolve, reject) => {
|
|
uni.uploadFile({
|
|
url: NEWAPIURL+'/api/common/upload',
|
|
filePath: url,
|
|
name: 'file',
|
|
formData: {
|
|
'token': this.$store.state.user.userInfo.token || uni.getStorageSync('userInfo') ? JSON.parse(uni.getStorageSync('userInfo')).token : ''
|
|
},
|
|
success:res => {
|
|
resolve(JSON.parse(res.data).data.url)
|
|
},
|
|
fail:(err)=>{
|
|
uni.hideLoading()
|
|
uni.showToast({
|
|
title: '上传失败，请重新上传',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
})
|
|
})
|
|
},
|
|
// 获取上传状态
|
|
async select(e){
|
|
console.log('选择文件：',e)
|
|
let lists = [].concat(e.tempFiles)
|
|
console.log('lists',lists);
|
|
let fileListLen = this.fileLists
|
|
lists.map((item) => {
|
|
fileListLen.push({
|
|
...item,
|
|
status: 'uploading',
|
|
message: '上传中'
|
|
})
|
|
// console.log('打印',fileListLen);
|
|
})
|
|
// console.log('fileListLen',fileListLen);
|
|
for (var i = 0; i < lists.length; i++) {
|
|
const result = await this.onunload(e.tempFiles[i].url)
|
|
console.log('result',result)
|
|
// let item = fileListLen[fileListLen.length-1]
|
|
// console.log('item',item)
|
|
// this.fileLists.splice(fileListLen.length-1, 1, Object.assign(item, {
|
|
// status: 'success',
|
|
// message: '',
|
|
// url: result
|
|
// }))
|
|
// fileListLen++
|
|
this.list.push(result)
|
|
}
|
|
console.log('fileLists',this.fileLists);
|
|
console.log('list',this.list);
|
|
},
|
|
getDetail() {
|
|
this.Post({
|
|
order_id: this.order_id
|
|
},
|
|
'/api/order/orderDetail'
|
|
).then(res => {
|
|
if (res) {
|
|
let index = res.data.order_child.findIndex(item => item.status == 'WAIT_COMMENT')
|
|
this.info = res.data.order_child[index];
|
|
}
|
|
});
|
|
},
|
|
submit() {
|
|
console.log('content',this.content);
|
|
if (this.content == '') {
|
|
uni.showToast({
|
|
title: '请文字评论后再提交~',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
if (this.fileLists.length != this.list.length) {
|
|
uni.showToast({
|
|
title: '图片上传中，请稍后再提交',
|
|
icon: 'none'
|
|
});
|
|
return
|
|
} else{
|
|
this.list = this.list.map(item => 'https://yjdtadmin.sz-trip.com' + item);
|
|
}
|
|
console.log('-----------',this.list);
|
|
this.Post({
|
|
goods_id: this.info.goods_id,
|
|
child_id: this.info.child_id,
|
|
content: this.content,
|
|
image_list: this.list+'',
|
|
rate: this.starIndex
|
|
},
|
|
'/api/Goods/comment'
|
|
).then(res => {
|
|
if (res.code == 1) {
|
|
uni.navigateTo({
|
|
url: '/subPackages/order/trades'
|
|
})
|
|
}
|
|
});
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.bg {
|
|
padding: 0 26.67rpx;
|
|
background: #fff;
|
|
min-height: 100vh;
|
|
padding-top: 19.33rpx;
|
|
}
|
|
.top {
|
|
display: flex;
|
|
}
|
|
.top image {
|
|
width: 142rpx;
|
|
height: 142rpx;
|
|
flex-shrink: 0;
|
|
margin: .67rpx 20rpx .67rpx 12rpx;
|
|
border-radius: 7rpx;
|
|
}
|
|
.goods-title {
|
|
height: 80rpx;
|
|
font-size: 31rpx;
|
|
font-weight: 500;
|
|
color: #333;
|
|
}
|
|
.line {
|
|
height: 1rpx;
|
|
background: #d8d8d8;
|
|
margin: 20rpx 0;
|
|
}
|
|
|
|
.rate-box {
|
|
display: flex;
|
|
height: 106rpx;
|
|
align-items: center;
|
|
|
|
.starImg {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
|
|
.example-body {
|
|
padding: 10px;
|
|
padding-top: 0;
|
|
}
|
|
|
|
.custom-image-box {
|
|
/* #ifndef APP-NVUE */
|
|
display: flex;
|
|
/* #endif */
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.text {
|
|
font-size: 14px;
|
|
color: #333;
|
|
}
|
|
|
|
.submit-btn {
|
|
width: 697rpx;
|
|
height: 80rpx;
|
|
background: #C3282E;
|
|
border-radius: 40rpx;
|
|
font-size: 36rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
line-height: 80rpx;
|
|
position: fixed;
|
|
bottom: 53.33rpx;
|
|
}
|
|
|
|
/deep/ .uni-file-picker {
|
|
padding-bottom: 165rpx !important;
|
|
}
|
|
|
|
/deep/ .icon-del-box {
|
|
// background: #ed4545 !important;
|
|
}
|
|
|
|
/deep/ .file-picker__progress-item {
|
|
display: none !important;
|
|
}
|
|
|
|
|
|
</style>
|
|
|