207 lines
4.1 KiB
Vue
207 lines
4.1 KiB
Vue
<template>
|
||
<view class="content">
|
||
<!-- <view class="container"> -->
|
||
<!-- <view class="my-header">
|
||
<view class="my-icons" @click="goBack"> <uni-icons type="left" color="#ffffff" size="16"></uni-icons>
|
||
</view>
|
||
<view class="my-text">意见反馈</view>
|
||
<view class="my-icons"></view>
|
||
</view> -->
|
||
|
||
<!-- 顶部区域 -->
|
||
<view class="top-title">您提交的意见反馈，将鼓励我们做得更好~</view>
|
||
|
||
<view class="box-top">
|
||
<view class="title_">
|
||
反馈内容
|
||
</view>
|
||
<u--textarea v-model="value5" placeholder="请填写您的反馈和建议" border="bottom"></u--textarea>
|
||
<view class="title_" style="border-bottom: none;">
|
||
相关截图（选填）
|
||
</view>
|
||
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
|
||
:maxCount="5"></u-upload>
|
||
<view class="anniu" @click="submitFeedback">
|
||
<text>提交反馈</text>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<!-- </view> -->
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import upload from '@/utils/upload.js'
|
||
import request from '../../utils/request'
|
||
export default {
|
||
data() {
|
||
return {
|
||
title: '',
|
||
value5: '',
|
||
fileList1: [],
|
||
images:[],
|
||
feedback:{
|
||
screenshotUrl:"",
|
||
content:"",
|
||
storeId:uni.getStorageSync("storeId")
|
||
},
|
||
}
|
||
},
|
||
|
||
components: {
|
||
|
||
},
|
||
methods: {
|
||
// 提交反馈
|
||
submitFeedback(){
|
||
if (!this.value5){
|
||
uni.showToast({
|
||
title:"请填写反馈信息",
|
||
icon:"none"
|
||
})
|
||
return;
|
||
}
|
||
this.feedback.content = this.value5
|
||
this.feedback.screenshotUrl = JSON.stringify(this.images)
|
||
request({
|
||
url: "business/userManager/feedback",
|
||
method: 'post',
|
||
data:this.feedback,
|
||
}).then((res) => {
|
||
if (res.code==200){
|
||
uni.showToast({
|
||
title:"反馈成功！",
|
||
icon:"none",
|
||
})
|
||
this.reset()
|
||
}
|
||
})
|
||
},
|
||
// 重置数据
|
||
reset(){
|
||
this.value5= ''
|
||
this.fileList1= []
|
||
this.images=[]
|
||
this.feedback={
|
||
screenshotUrl:"",
|
||
content:"",
|
||
storeId:uni.getStorageSync("storeId"),
|
||
}
|
||
},
|
||
deletePic(event) {
|
||
this[`fileList${event.name}`].splice(event.index, 1)
|
||
this.images.splice(event.index, 1)
|
||
},
|
||
// 新增图片
|
||
async afterRead(event) {
|
||
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
|
||
let lists = [].concat(event.file)
|
||
let fileListLen = this[`fileList${event.name}`].length
|
||
lists.map((item) => {
|
||
this[`fileList${event.name}`].push({
|
||
...item,
|
||
|
||
})
|
||
})
|
||
for (let i = 0; i < lists.length; i++) {
|
||
const result = await this.uploadFilePromise(lists[i].url)
|
||
let item = this[`fileList${event.name}`][fileListLen]
|
||
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||
status: 'success',
|
||
message: '',
|
||
url: result
|
||
}))
|
||
fileListLen++
|
||
}
|
||
},
|
||
uploadFilePromise(url) {
|
||
upload({
|
||
url: '/clientApi/file/upload',
|
||
filePath: url,
|
||
header:"",
|
||
}).then((res) => {
|
||
this.images.push(res.data.fileName)
|
||
console.log('images', this.images);
|
||
})
|
||
|
||
},
|
||
goBack() {
|
||
uni.navigateBack()
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.content {
|
||
background: #ffffff;
|
||
}
|
||
|
||
.container {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding-top: 88px;
|
||
z-index: 999999999;
|
||
}
|
||
|
||
.my-header {
|
||
width: 100%;
|
||
height: 88px;
|
||
background: #1678ff;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
color: #ffffff;
|
||
box-sizing: border-box;
|
||
padding: 0px 15px;
|
||
padding-top: 40px;
|
||
|
||
.my-icons {
|
||
width: 20px;
|
||
|
||
}
|
||
|
||
position: fixed;
|
||
top: 0px;
|
||
}
|
||
|
||
.box-top {
|
||
width: 100%;
|
||
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
}
|
||
|
||
.top-title {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 10px 0px;
|
||
border-bottom: 1px solid #e6e6e6;
|
||
}
|
||
|
||
.anniu {
|
||
width: 95%;
|
||
height: 40px;
|
||
margin: 10px auto;
|
||
margin-top: 50px;
|
||
border-radius: 4px;
|
||
background: #FA6400;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
|
||
}
|
||
|
||
|
||
.title_ {
|
||
margin: 10px 0px;
|
||
}
|
||
|
||
.top-title {
|
||
background: rgba(255, 150, 85, 0.15);
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
}
|
||
</style> |