179 lines
4.2 KiB
Vue
179 lines
4.2 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="question">
|
||
<view class="questionLabel">问题描述</view>
|
||
<u--textarea v-model="notesText" placeholder="请输入您要反馈的问题（10~500字以内）" style="background: #FFF;border: none"></u--textarea>
|
||
</view>
|
||
<view class="question">
|
||
<view class="questionLabel" style="margin-bottom: 20rpx;">请提供问题的截图或照片（选填）</view>
|
||
<u-upload
|
||
:fileList="fileList1"
|
||
@afterRead="afterRead"
|
||
@delete="deletePic"
|
||
name="1"
|
||
multiple
|
||
:maxCount="10"
|
||
></u-upload>
|
||
</view>
|
||
<view class="contact flex-between">
|
||
<view>联系方式</view>
|
||
<input v-model="phoneNum" type="text" style="font-size: 28rpx;flex:1;text-align: right;" placeholder="请输入手机号" />
|
||
</view>
|
||
<view class="commitBtn flex-center" @click="feedback">提交</view>
|
||
<view class="tip">您的反馈我们会尽快解决，但无法保证每一条都能及时反馈，如果有紧急咨询，请直接拨打客服电话:400-000-000</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
info:'',
|
||
fileList1: [],
|
||
notesText: '',
|
||
imgList: [],
|
||
phoneNum: ''
|
||
}
|
||
},
|
||
onLoad() {
|
||
|
||
|
||
},
|
||
onReachBottom (){
|
||
|
||
},
|
||
methods: {
|
||
feedback() {
|
||
this.$api.feedback({
|
||
content: this.notesText,
|
||
contact: this.phoneNum,
|
||
images: this.imgList
|
||
},res=>{
|
||
if(res.code == '1'){
|
||
uni.showToast({ title: res.msg , icon: 'success' })
|
||
setTimeout(()=>{
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
}, 2000)
|
||
}
|
||
})
|
||
},
|
||
// 删除图片
|
||
deletePic(event) {
|
||
this[`fileList${event.name}`].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,
|
||
status: "uploading",
|
||
message: "上传中",
|
||
});
|
||
});
|
||
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) {
|
||
console.log(url, 'dfff')
|
||
return new Promise((resolve, reject) => {
|
||
this.$api.uploadImg(url,res=>{
|
||
console.log(res,'=====')
|
||
if(res.code == '1'){
|
||
setTimeout(() => {
|
||
resolve(res.data.data);
|
||
}, 1000);
|
||
// resolve(res.data);
|
||
this.imgList= this.imgList.concat([res.data.full_url])
|
||
console.log(res.data, this.imgList, '-----------')
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'fail' })
|
||
}
|
||
})
|
||
console.log(this.imgList)
|
||
// let a = uni.uploadFile({
|
||
// url: "https://admin.dbcdq.cn/api/feedback/upload", // 仅为示例，非真实的接口地址
|
||
// filePath: url,
|
||
// name: "file",
|
||
// formData: {
|
||
// user: "test",
|
||
// },
|
||
// success: (res) => {
|
||
// setTimeout(() => {
|
||
// resolve(res.data.data);
|
||
// }, 1000);
|
||
// },
|
||
// });
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
// background: #fff;
|
||
background: rgba(243,243,249,1);
|
||
}
|
||
.content{
|
||
padding:20px 35rpx;
|
||
padding-bottom: 208rpx;
|
||
}
|
||
.aimg{
|
||
width: 100%;
|
||
height: 1040upx;
|
||
margin-top: 10upx;
|
||
}
|
||
.aimg image{height:100%;width:100%}
|
||
.question{
|
||
background: #fff;
|
||
padding: 37rpx 35rpx;
|
||
border-radius: 30rpx;
|
||
margin-bottom: 20rpx;
|
||
.questionLabel{
|
||
border-bottom: 1rpx solid #DEDEDE;
|
||
padding-bottom: 20rpx;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
}
|
||
.contact{
|
||
padding: 41rpx 34rpx;
|
||
border-radius: 30rpx;
|
||
background: #fff;
|
||
}
|
||
.commitBtn{
|
||
width: 680rpx;
|
||
height: 90rpx;
|
||
background: linear-gradient(90deg, #FFAD38 0%, #FF884E 100%);
|
||
border-radius: 10rpx;
|
||
ont-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #FFFFFF;
|
||
margin-top: 214rpx;
|
||
}
|
||
.tip{
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
line-height: 36rpx;
|
||
margin-top: 42rpx;
|
||
}
|
||
</style>
|
||
|