From ed5d47ad987f2a20f33fbd5cc64dbcdb208f5e15 Mon Sep 17 00:00:00 2001
From: xuxueyang <xuxy@fengyuntec.com>
Date: 星期一, 26 八月 2024 11:31:53 +0800
Subject: [PATCH] add 意见反馈
---
sub_pages/customer/self/feedback.vue | 214 +++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 174 insertions(+), 40 deletions(-)
diff --git a/sub_pages/customer/self/feedback.vue b/sub_pages/customer/self/feedback.vue
index 87060aa..ee79494 100644
--- a/sub_pages/customer/self/feedback.vue
+++ b/sub_pages/customer/self/feedback.vue
@@ -13,6 +13,10 @@
<view class="name">回复内容：{{ item.reply || '-'}}</view>
<view class="name">回复时间：{{ item.replyTime || '-' }}</view>
</view>
+ <view class="line-gray"></view>
+ <view class="component-buttons">
+ <view class="button-1" @click="toDetail(item)">查看详情</view>
+ </view>
</view>
</view>
<footer-msg :more="page.total>0&&page.total>page.current*page.size&&list.length>0"></footer-msg>
@@ -25,30 +29,65 @@
</view>
- <!-- <uni-popup ref="popup" type="bottom">
+ <uni-popup ref="popup" type="bottom">
<view class="component-popup_input_all">
- <view class="text-center m-b-40" style="font-size: 48rpx;font-weight: 600;">填写投诉/反馈内容</view>
- <view v-for="(item,i) in level_columns" :key="i" class="m-t-20">
- <view class="m-t-12 flex value-items">
- <view class="value-item" @click="()=>{
- if(each.value!==query.value){
- query.level = each.value
- query.levelStr = each.label
- refreshList()
- $refs.popup.close()
- }
- }" :class="[query.level==each.value?'cur':'']" v-for="(each, j) in item" :key="j">
- {{ each.label || '-' }}
+
+
+ <view class="close-parent">
+ 填写投诉/反馈内容
+ <uni-icons class="close" type="closeempty" @click="$refs.popup.close()"></uni-icons>
+ </view>
+
+ <view class="submit form">
+ <view class="form-item" style="height: unset;">
+ <view class="form-item-label require" style="min-width: 120rpx;margin-right: 10rpx;">
+ 类型
+ </view>
+ <view class="form-item-value flex value-items">
+ <view class="value-item" @click="()=>{
+ if(submitForm.type!==each.value){
+ submitForm.type = each.value
+ }
+ }" :class="[submitForm.type==each.value?'cur':'']" v-for="(each, j) in type_columns" :key="j">
+ {{ each.label || '-' }}
+ </view>
+ </view>
+ </view>
+
+ <view class="form-item">
+ <view class="form-item-label require">
+ 内容
+ </view>
+ <view class="form-item-value">
+ <input v-model="submitForm.feedBack" placeholder="填写投诉/反馈内容" class="form-input"></input>
+ </view>
+ </view>
+ <view class="form-item">
+ <view class="form-item-label require">
+ 图片
+ </view>
+ <view class="form-item-value m-l-a m-r-0">
+ <view class="t-red" @click="uploadCheckImage()">上传</view>
+ </view>
+ </view>
+ <view class="flex p20" v-if="submitForm.pictures&&submitForm.pictures.length>0">
+ <view class="m-t-12 m-r-10 " v-for="(timg,index) of submitForm.pictures" :key="index">
+ <image class="check-img" :src="timg" @click.stop="previewImg(timg)">
+ </image>
+ <view class="t-red text-center" @click.stop="deleteCheckImage(index)">删除</view>
</view>
</view>
</view>
- <view class="button-space"></view>
- <view>
- <view class="button-green" @click="$refs.popup.close()">关闭
- </view>
+
+ <!-- <view class="line-gray"></view> -->
+
+ <view class="component-buttons m-t-20" style="width: unset;">
+ <view class="button-1 m-auto" @click="$refs.popup.close()">关闭</view>
+ <view class="button-0 m-auto" @click="submit">提交</view>
</view>
</view>
- </uni-popup> -->
+
+ </uni-popup>
</view>
</template>
@@ -56,7 +95,10 @@
<script>
export default {
data() {
- return {}
+ return {
+ submitForm: {},
+ type_columns: [],
+ }
},
async onPullDownRefresh() {
await this.refreshList()
@@ -68,36 +110,120 @@
async onLoad() {
this.listApi = '/api/feedback/my/feedback/list'
this.getList()
+ this.$http.request('get', '/api/code/value', {
+ params: {
+ type: 'feedback_type'
+ }
+ }).then(res => {
+ var data = res.data
+ this.type_columns = data || []
+
+ })
},
methods: {
- async addFeedback() {
- const res = await this.$message.confirm('', {
- editable: true,
- title: '请填写投诉/反馈内容'
+ toDetail(item) {
+ uni.navigateTo({
+ url: `/sub_pages/customer/self/feedback-detail?id=${item.id}`
})
- if (res.content && res.confirm) {
- // 发送请求
- if (!res.content) {
- this.$message.showToast('未填写内容')
- } else {
- this.$message.showLoading()
- const {
- code
- } = await this.$http.request('post', '', {
- data: {
- feedBack: res.content
+ },
+ async deleteCheckImage(index) {
+ await this.$message.confirm('确定删除吗')
+ this.submitForm.pictures.splice(index, 1)
+ },
+ uploadCheckImage() {
+ let that = this
+ uni.chooseImage({
+ count: 1, // 最多可以选择的图片张数，默认9
+ sizeType: ['compressed'], //original 原图，compressed 压缩图，默认二者都有
+ sourceType: ['camera', 'album'], //album 从相册选图，camera 使用相机，默认二者都有。如需直接开相机或直接选相册，请只使用一个选项
+ success: function(res) {
+ let errMsg = res.errMsg
+ let tempFiles = res.tempFiles
+ if (errMsg === 'chooseImage:ok') {
+ if (tempFiles[0].size > 1024 * 1024 * 5) {
+ that.$message.confirm('图片最多支持5M大小,超出大小限制')
+ return
}
- })
- this.$message.hideLoading()
- if (code == 0) {
- await this.refreshList()
- this.$message.showToast('提交成功')
+ that.$message.showLoading()
+ that.$http.upload(tempFiles[0].path).then(async res => {
+ console.log('res1', res)
+ var pic = res.data && res.data.length > 0 && res.data[
+ 0]
+ .url || ''
+ that.$message.hideLoading()
+ that.submitForm.pictures.push(pic)
+ that.$forceUpdate()
+ }).catch(res => {
+ that.$message.hideLoading()
+ console.error(res)
+ })
}
}
+ })
+ },
+ async addFeedback() {
+ this.submitForm = {
+ feedBack: '',
+ type: '',
+ pictures: [],
+ }
+ this.$refs.popup.open()
+
+ // const res = await this.$message.confirm('', {
+ // editable: true,
+ // title: '请填写投诉/反馈内容'
+ // })
+ // if (res.content && res.confirm) {
+ // // 发送请求
+ // if (!res.content) {
+ // this.$message.showToast('未填写内容')
+ // } else {
+ // this.$message.showLoading()
+ // const {
+ // code
+ // } = await this.$http.request('post', '', {
+ // data: {
+ // feedBack: res.content
+ // }
+ // })
+ // this.$message.hideLoading()
+ // if (code == 0) {
+ // await this.refreshList()
+ // this.$message.showToast('提交成功')
+ // }
+ // }
- } else {
+ // } else {
+ // }
+ },
+
+ async submit() {
+ console.log('submitForm',this.submitForm)
+ if (!this.submitForm.type) {
+ this.$message.showToast('未选择类型')
+ return
+ }
+ if (!this.submitForm.feedBack) {
+ this.$message.showToast('未填写内容')
+ return
+ }
+ this.$message.showLoading()
+ const {
+ code
+ } = await this.$http.request('post', '/api/feedback/page/new', {
+ data: {
+ feedBack: this.submitForm.feedBack,
+ type: this.submitForm.type,
+ pictures: JSON.stringify(this.submitForm.pictures)
+ }
+ })
+ this.$message.hideLoading()
+ if (code == 0) {
+ this.$refs.popup.close()
+ await this.refreshList()
+ this.$message.showToast('提交成功')
}
}
@@ -163,4 +289,12 @@
}
}
}
+ .component-popup_input_all{
+ .check-img {
+ width: 96rpx;
+ height: 96rpx;
+ border-radius: 4rpx;
+ border: 2rpx dashed #CECECE;
+ }
+ }
</style>
\ No newline at end of file
--
Gitblit v1.9.3