recycapp/pages/feedback/index.vue
2026-01-03 12:26:16 +08:00

182 lines
4.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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">您的反馈我们会尽快解决但无法保证每一条都能及时反馈如果有紧急咨询请直接拨打客服电话:{{servicePhone}}</view>
</view>
</template>
<script>
export default {
data() {
return {
info:'',
fileList1: [],
notesText: '',
imgList: [],
phoneNum: '',
servicePhone: ''
}
},
onLoad() {
this.servicePhone = uni.getStorageSync('servicePhone')
},
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)
}else{
uni.showToast({ title: res.msg , icon: 'none' })
}
})
},
// 删除图片
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>