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.
440 lines
11 KiB
440 lines
11 KiB
<template>
|
|
<div>
|
|
<div class="dialog-h-content scroll-h">
|
|
<el-tag type="info"
|
|
class="eltag"
|
|
size="medium"
|
|
style="width: 100%; margin-top: 10px">建议详情</el-tag>
|
|
<div class="m-row">
|
|
|
|
<div class="m-row-2">
|
|
<div class="info-prop">
|
|
<span class="info-title-2">客户名：</span>
|
|
<span>{{ adviceData.customerName }}</span>
|
|
</div>
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">组织名：</span>
|
|
<span>{{ adviceData.agencyName}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="m-row-2">
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">网格名：</span>
|
|
<span>{{ adviceData.gridName}}</span>
|
|
</div>
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">注册手机：</span>
|
|
<span>{{ adviceData.regPhone}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="m-row-2">
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">问题分类：</span>
|
|
<span>{{ adviceData.adviceType}}</span>
|
|
</div>
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">提出时间：</span>
|
|
<span>{{ adviceData.adviceTime}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="m-row-2">
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">提出者：</span>
|
|
<span>{{ adviceData.userName}}</span>
|
|
</div>
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-2">联系方式：</span>
|
|
<span>{{ adviceData.phone}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="m-info">
|
|
<div class="info-prop">
|
|
<span class="info-title-2">建议内容：</span>
|
|
<span>{{ adviceData.adviceContent}}</span>
|
|
|
|
</div>
|
|
|
|
<div v-if="adviceData.imgList.length>0"
|
|
class="info-prop">
|
|
<span class="info-title-2">建议图片：</span>
|
|
|
|
<div style="display:flex"
|
|
v-for="(item,index) in adviceData.imgList"
|
|
:key="index">
|
|
|
|
<img class="img_icon"
|
|
:src="item">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<el-tag type="info"
|
|
class="eltag"
|
|
size="medium"
|
|
style="width: 100%; margin-top: 10px">回复详情</el-tag>
|
|
<div v-if="!showConfirm"
|
|
class="m-row">
|
|
|
|
<div class="m-row-2">
|
|
<div class="info-prop">
|
|
<span class="info-title-3">回复者：</span>
|
|
<span>{{ adviceData.replyUserName }}</span>
|
|
</div>
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-3">回复时间：</span>
|
|
<span>{{ adviceData.replyTime}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="m-info">
|
|
<div class="info-prop">
|
|
<span class="info-title-3">回复内容：</span>
|
|
<span>{{ adviceData.replyContent}}</span>
|
|
|
|
</div>
|
|
<div class="info-prop">
|
|
<span class="info-title-3">政府回复文本：</span>
|
|
<span>{{ adviceData.govContent}}</span>
|
|
|
|
</div>
|
|
<div v-if="adviceData.govImgList.length>0"
|
|
class="info-prop">
|
|
<span class="info-title-3">政府回复取证：</span>
|
|
|
|
<div style="display:flex"
|
|
v-for="(item,index) in adviceData.govImgList"
|
|
:key="index">
|
|
|
|
<img class="img_icon"
|
|
:src="item">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div v-if="showConfirm"
|
|
class="m-row">
|
|
|
|
<div class="m-info">
|
|
<div class="info-prop">
|
|
<span class="info-title-3">回复内容：</span>
|
|
<div>
|
|
<el-input type="textarea"
|
|
:rows="4"
|
|
resize="none"
|
|
maxlength="500"
|
|
show-word-limit
|
|
style="width: 600px"
|
|
placeholder="请输入回复内容"
|
|
v-model="adviceData.replyContent"></el-input>
|
|
<div class="input_tip">建议只可回复一次，请谨慎回复</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="info-prop">
|
|
<span class="info-title-3">政府回复文本：</span>
|
|
<el-input type="textarea"
|
|
:rows="4"
|
|
resize="none"
|
|
maxlength="500"
|
|
style="width: 600px"
|
|
show-word-limit
|
|
placeholder="请输入政府回复文本"
|
|
v-model="adviceData.govContent"></el-input>
|
|
|
|
</div>
|
|
<div class="info-prop">
|
|
<span class="info-title-3">政府回复取证：</span>
|
|
|
|
<div>
|
|
<el-upload :headers="$getElUploadHeaders()"
|
|
ref="uploadPic"
|
|
:action="uploadUlr"
|
|
:data="{ customerId: adviceData.customerId }"
|
|
list-type="picture-card"
|
|
:on-exceed="exceedPic"
|
|
:on-remove="removePic"
|
|
:file-list="replayImgList"
|
|
:on-success="handleSuccess"
|
|
:limit="3">
|
|
<span class="font-14">选择图片</span>
|
|
<div slot="tip"
|
|
class="upload_tip">
|
|
最多上传3张图片，图片支持jpg、jpeg、bmp、git或png格式
|
|
</div>
|
|
</el-upload>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="div-btn">
|
|
<el-button size="small"
|
|
@click="handleCancle">关 闭</el-button>
|
|
<el-button v-if="showConfirm"
|
|
size="small"
|
|
type="primary"
|
|
:disabled="btnDisable"
|
|
@click="handleComfirm">回 复</el-button>
|
|
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from 'vuex'
|
|
import { Loading } from 'element-ui' // 引入Loading服务
|
|
import { requestPost } from '@/js/dai/request'
|
|
import daiMap from "@/utils/dai-map";
|
|
|
|
|
|
let loading // 加载动画
|
|
|
|
export default {
|
|
data () {
|
|
|
|
|
|
return {
|
|
initLoading: false,
|
|
btnDisable: false,
|
|
|
|
adviceId: '',
|
|
srcList: [],
|
|
adviceData: {
|
|
customerId: '', //客户id
|
|
customerName: '', //客户名
|
|
agencyName: '', //组织名
|
|
gridName: '', //网格名
|
|
userName: '', //提出人名字
|
|
regPhone: '', //注册时的联系电话
|
|
adviceType: '', //问题分类，后台拼接
|
|
phone: '', //填写的联系电话
|
|
adviceTime: '', //建议时间
|
|
adviceContent: '', //建议内容
|
|
imgList: [], //建议图片列表
|
|
replyContent: '', //回复内容 无为空字符串
|
|
replyTime: '', //回复时间 无为空字符串
|
|
replyUserName: '', //回复人
|
|
govContent: '', //政府回复文本
|
|
govImgList: [] //政府回复取证
|
|
},
|
|
|
|
showConfirm: true,
|
|
replayImgList: [],
|
|
|
|
uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2',
|
|
// upload_url: '', // 上传URL
|
|
upload_name: '' // 图片或视频名称
|
|
|
|
}
|
|
},
|
|
|
|
mounted () {
|
|
|
|
|
|
},
|
|
|
|
methods: {
|
|
diaDestroy () {
|
|
|
|
},
|
|
|
|
async initForm (adviceId) {
|
|
|
|
this.adviceId = adviceId
|
|
await this.loadFormData()
|
|
this.initLoading = true
|
|
|
|
},
|
|
|
|
|
|
//加载form
|
|
async loadFormData () {
|
|
this.startLoading()
|
|
//const url = "https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/epmetuser/useradvice/advicedetail"
|
|
const url = '/epmetuser/useradvice/advicedetail'
|
|
|
|
const params = {
|
|
adviceId: this.adviceId
|
|
}
|
|
const { data, code, msg } = await requestPost(url, params)
|
|
if (code === 0) {
|
|
// this.endLoading()
|
|
if (data) {
|
|
this.adviceData = data
|
|
if (
|
|
this.adviceData.replyContent === '' ||
|
|
this.adviceData.replyContent === null
|
|
) {
|
|
this.showConfirm = true
|
|
} else {
|
|
this.showConfirm = false
|
|
}
|
|
}
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
this.endLoading()
|
|
},
|
|
|
|
|
|
async handleComfirm () {
|
|
if (
|
|
this.adviceData.replyContent === '' ||
|
|
this.adviceData.replyContent === null
|
|
) {
|
|
this.$message.warning('请填写回复内容')
|
|
return
|
|
}
|
|
|
|
this.startLoading()
|
|
// let url = 'https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/epmetuser/useradvice/replyadvice'
|
|
let url = '/epmetuser/useradvice/replyadvice'
|
|
// 表单对象
|
|
|
|
let params = {
|
|
adviceId: this.adviceData.adviceId,
|
|
replyContent: this.adviceData.replyContent,
|
|
govContent: this.adviceData.govContent,
|
|
govImgList: this.adviceData.govImgList
|
|
}
|
|
|
|
const { data, code, msg } = await requestPost(url, params)
|
|
this.endLoading()
|
|
if (code === 0) {
|
|
|
|
if (data) {
|
|
|
|
this.$message.success('回复成功')
|
|
|
|
this.$emit('replayOk')
|
|
}
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
|
|
// window.app.ajax.post(
|
|
// url,
|
|
// _data,
|
|
// (data, rspMsg) => {
|
|
// this.endLoading()
|
|
// this.$message.success('回复成功')
|
|
// this.diaCancel()
|
|
// this.$emit('refresh')
|
|
// },
|
|
// (rspMsg, data) => {
|
|
// this.endLoading()
|
|
// this.$message.error(rspMsg)
|
|
// }
|
|
// )
|
|
},
|
|
|
|
removePic (file, fileList) {
|
|
this.adviceData.govImgList.splice(
|
|
this.adviceData.govImgList.findIndex((item) => item === file.url),
|
|
1
|
|
)
|
|
this.replayImgList.splice(
|
|
this.replayImgList.findIndex((item) => item.uid === file.uid),
|
|
1
|
|
)
|
|
},
|
|
exceedPic () {
|
|
this.$message.warning('最多上传3张预览图片')
|
|
},
|
|
handleSuccess (response, file, fileList) {
|
|
this.replayImgList.push(file)
|
|
this.adviceData.govImgList.push(response.data.url)
|
|
},
|
|
|
|
handleCancle () {
|
|
this.$emit('diaDetailClose')
|
|
|
|
},
|
|
|
|
|
|
// 开启加载动画
|
|
startLoading () {
|
|
loading = Loading.service({
|
|
lock: true, // 是否锁定
|
|
text: '正在加载……', // 加载中需要显示的文字
|
|
background: 'rgba(0,0,0,.7)' // 背景颜色
|
|
})
|
|
},
|
|
// 结束加载动画
|
|
endLoading () {
|
|
// clearTimeout(timer);
|
|
if (loading) {
|
|
loading.close()
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
|
|
|
|
},
|
|
props: {
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped >
|
|
@import "@/assets/scss/modules/management/detail-main.scss";
|
|
</style>
|
|
<style lang="scss" scoped >
|
|
.m-info {
|
|
padding-left: 0px;
|
|
}
|
|
.upload_tip {
|
|
color: #7a7a7a;
|
|
margin: 10px 0 0 0;
|
|
}
|
|
.div-tooltip {
|
|
margin-left: 10px;
|
|
color: red;
|
|
}
|
|
.input_tip {
|
|
color: #e60000;
|
|
margin: 10px 0 0 0;
|
|
}
|
|
|
|
.img_icon {
|
|
margin-right: 10px;
|
|
width: 70px;
|
|
height: 70px;
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss">
|
|
.el-dialog__body {
|
|
padding: 0 10px 20px !important;
|
|
}
|
|
|
|
.hide {
|
|
.el-upload--picture-card {
|
|
display: none !important;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
|