elink-star
/
epmet-oper-pc-chengyang
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

用户反馈

preview
jiangyy 5 years ago
parent
9bb5e08da0
commit
a6640987e6
2 changed files with 399 additions and 210 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 605
      epmet-oper-web/src/views/modules/customer/feedback/DetailForm.vue
  2. 4
      epmet-oper-web/src/views/modules/customer/feedback/FeedbackList.vue

605
epmet-oper-web/src/views/modules/customer/feedback/DetailForm.vue
View File

@ -2,182 +2,332 @@
<div>
<c-dialog :title="'建议详情'"
:visible="diaVisible"
:width="70"
:width="dialogWidth"
:confirm="'回复'"
:showConfirm="showConfirm"
@ok="save"
@cancel="diaCancel">
<el-form :inline="true"
:model="adviceData"
:rules="dataRule"
ref="ref_form"
style="margin:0 auto;width:90%"
:label-width="'100px'">
<div class="div_total">
<el-tag type="info"
class="eltag"
size="medium"
style="width:100%;margin-top:10px">建议详情</el-tag>
<div class="div_form">
<el-form-item prop="customerName"
label="客户名"
class="form_item_half">
<span>{{adviceData.customerName}}</span>
</el-form-item>
<el-form-item prop="agencyName"
label="组织名"
class="form_item_half">
<span>{{adviceData.agencyName}}</span>
</el-form-item>
<el-form-item prop="gridName"
label="网格名"
class="form_item_half ">
<span>{{adviceData.gridName}}</span>
</el-form-item>
<el-form-item prop="regPhone"
label="注册手机"
class="form_item_half ">
<span>{{adviceData.regPhone}}</span>
</el-form-item>
<el-form-item prop="adviceType"
label="问题分类"
class="form_item_half">
<span>{{adviceData.adviceType}}</span>
</el-form-item>
<el-form-item prop="adviceTime"
label="提出时间"
class="form_item_half">
<span>{{adviceData.adviceTime}}</span>
</el-form-item>
<el-form-item prop="userName"
label="提出者"
class="form_item_half ">
<span>{{adviceData.userName}}</span>
</el-form-item>
<el-form-item prop="phone"
label="联系方式"
class="form_item_half ">
<span>{{adviceData.phone}}</span>
</el-form-item>
<el-form-item prop="adviceContent"
label="建议内容"
class="form_item_total">
<span>{{adviceData.adviceContent}}</span>
</el-form-item>
<el-form-item v-if="adviceData.imgList.length>0"
prop="imgList"
label="建议图片">
<img v-for="(item,index) in adviceData.imgList"
:key="index"
:src="item"
style="width:70px;height:70px;margin-right:15px"
class="function-icon">
</el-form-item>
<div>
<!-- 第一行 -->
<el-row type="flex"
:gutter="gutterPro">
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'客&nbsp&nbsp户&nbsp&nbsp名'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.customerName}}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'组&nbsp&nbsp织&nbsp&nbsp名'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.agencyName}}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'网&nbsp&nbsp格&nbsp&nbsp名'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.gridName}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<!-- 第二行 -->
<el-row type="flex"
:gutter="gutterPro">
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'注册手机'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.regPhone}}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'问题分类'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.adviceType}}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'提出时间'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.adviceTime}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<!-- 第三行 -->
<el-row type="flex"
:gutter="gutterPro">
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'提&nbsp&nbsp出&nbsp&nbsp者'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.userName}}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'提出时间'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.phone}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<!-- 第四行 -->
<el-row type="flex"
:gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'建议内容'}}</div>
</el-col>
<el-col :span="span2Con">
<div class="form-content bg-gray">{{adviceData.adviceContent}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<!-- 第五行 -->
<el-row type="flex"
:gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'建议图片'}}</div>
</el-col>
<el-col :span="span2Con">
<img v-for="(item,index) in adviceData.imgList"
:key="index"
:src="item"
style="width:70px;height:70px;margin-right:15px"
class="function-icon">
</el-col>
</el-row>
</el-col>
</el-row>
</div>
<el-tag type="info"
class="eltag"
size="medium"
style="width:100%;margin-top:10px">回复详情</el-tag>
<div>
<div v-if="!showConfirm">
<el-row type="flex"
:gutter="gutterPro">
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'回&nbsp&nbsp&nbsp&nbsp复&nbsp&nbsp&nbsp&nbsp者'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.replyUserName}}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="spanThree">
<el-row :gutter="gutterCon">
<el-col :span="spanTitle">
<div class="form-title">{{'回&nbsp&nbsp复&nbsp&nbsp时&nbsp&nbsp间'}}</div>
</el-col>
<el-col :span="spanCon">
<div class="form-content">{{adviceData.replyTime}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row :gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'回&nbsp&nbsp复&nbsp&nbsp内&nbsp&nbsp容'}}</div>
</el-col>
<el-col :span="span2Con">
<div class="form-content">{{adviceData.replyContent}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row :gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'政府回复文本'}}</div>
</el-col>
<el-col :span="span2Con">
<div class="form-content">{{adviceData.govContent}}</div>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row :gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'政府回复取证'}}</div>
</el-col>
<el-col :span="span2Con">
<img v-for="(item,index) in adviceData.govImgList"
:key="index"
:src="item"
style="width:70px;height:70px;margin-right:15px"
class="function-icon">
</el-col>
</el-row>
</el-col>
</el-row>
</div>
<div v-if="showConfirm">
<el-row :gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'回&nbsp&nbsp复&nbsp&nbsp内&nbsp&nbsp容'}}</div>
</el-col>
<el-col :span="span2Con">
<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>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row :gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'政府回复文本'}}</div>
</el-col>
<el-col :span="span2Con">
<el-input type="textarea"
:rows="4"
resize="none"
maxlength="500"
style="width:600px"
show-word-limit
placeholder='请输入政府回复文本'
v-model="adviceData.govContent"></el-input>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row :gutter="gutterPro">
<el-col :span="spanOne">
<el-row :gutter="gutterCon">
<el-col :span="span2Title">
<div class="form-title margin2">{{'政府回复取证'}}</div>
</el-col>
<el-col :span="span2Con">
<el-upload class="avatar-uploader"
ref="uploadPic"
:action="uploadUlr"
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>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
<div class="div_form"
v-if="showConfirm">
<el-form-item prop="replyContent"
label="回复内容"
label-width="100px"
class="form_item_total ">
<el-input type="textarea"
:rows="4"
resize="none"
maxlength="500"
show-word-limit
style="width:600px"
placeholder='请输入回复内容'
v-model="adviceData.replyContent">
</el-input>
</el-form-item>
<el-form-item label="政府回复文本"
label-width="100px"
class="form_item_total ">
<el-input type="textarea"
:rows="4"
resize="none"
maxlength="500"
style="width:600px"
show-word-limit
placeholder='请输入回复内容'
v-model="adviceData.govContent">
</el-input>
</el-form-item>
<el-form-item prop="govImgList"
label="政府回复取证"
class="form_item_total ">
<el-upload class="avatar-uploader"
ref="uploadPic"
:action="uploadUlr"
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="el-upload__tip">最多上传3张图片，图片支持jpg、jpeg、bmp、git或png格式</div>
</el-upload>
</el-form-item>
</div>
<div class="div_form"
v-else>
<el-form-item prop="replyUserName"
label="回复者"
class="form_item_half ">
<span>{{adviceData.replyUserName}}</span>
</el-form-item>
<el-form-item prop="replyTime"
label="回复时间"
class="form_item_half ">
<span>{{adviceData.replyTime}}</span>
</el-form-item>
<el-form-item prop="replyContent"
label="回复内容"
class="form_item_total">
<span>{{adviceData.replyContent}}</span>
</el-form-item>
<el-form-item prop="govContent"
label="政府回复内容"
class="form_item_total">
<span>{{adviceData.govContent}}</span>
</el-form-item>
<el-form-item v-if="adviceData.govImgList.length>0"
prop="govImgList"
label="政府图片取证">
<img v-for="(item,index) in adviceData.govImgList"
:key="index"
:src="item"
style="width:70px;height:70px;margin-right:15px"
class="function-icon">
</el-form-item>
</div>
</el-form>
</div>
</c-dialog>
</div>
@ -195,6 +345,16 @@ let loading // 加载动画
export default {
data () {
return {
gutterPro: 10,//每个属性的列间隔
gutterCon: 5,//标题和内容的列间隔
spanThree: 8,//每行三列的列宽
spanOne: 24,
spanTitle: 9,//标题列宽
spanCon: 15,//内容列宽
span2Title: 3,
span2Con: 20,
diaVisible: false,
adviceId: '',//建议id，父组件传来
adviceData: {
@ -229,17 +389,13 @@ export default {
mounted () {
},
computed: {
dialogWidth () {
return this.resolution === 'small' ? 70 : 60
},
tableHeight () {
return this.clientHeight - 60 - 80 - 80 - 50 - 400
},
...mapGetters(['clientHeight']),
dataRule () {
return {
replyContent: [
{ required: true, message: "回复不能为空", trigger: 'blur' }
]
}
}
...mapGetters(['clientHeight', 'resolution'])
},
methods: {
// eslint-disable-next-line
@ -276,7 +432,7 @@ export default {
},
removePic (file, fileList) {
debugger
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)
@ -287,47 +443,44 @@ export default {
},
handleSuccess (response, file, fileList) {
debugger
this.replayImgList.push(file)
this.adviceData.govImgList.push(response.data.url)
},
save () {
this.$refs['ref_form'].validate((valid) => {
if (valid) {
// if (!this.adviceData.replyContent || this.adviceData.replyContent === '') {
// this.$message.error('请填写')
// return false
// }
this.startLoading()
// let url = 'https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/epmetuser/useradvice/replyadvice'
let url = '/epmetuser/useradvice/replyadvice'
// 表单对象
let _data = {
adviceId: this.adviceData.adviceId,
replyContent: this.adviceData.replyContent,
govContent: this.adviceData.govContent,
govImgList: this.adviceData.govImgList
}
if (this.adviceData.replyContent === "" || this.adviceData.replyContent === null) {
this.$message.warning("请填写回复内容")
return
}
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)
})
this.startLoading()
// let url = 'https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/epmetuser/useradvice/replyadvice'
let url = '/epmetuser/useradvice/replyadvice'
// 表单对象
let _data = {
adviceId: this.adviceData.adviceId,
replyContent: this.adviceData.replyContent,
govContent: this.adviceData.govContent,
govImgList: this.adviceData.govImgList
}
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)
})
}
})
},
diaCancel () {
this.replayImgList = []
@ -353,16 +506,52 @@ export default {
</script>
<style scope>
.div_form {
margin: 10px 0 0 0;
.div_total {
margin: 0 10px;
}
.el-row {
margin-bottom: 5px;
margin-top: 5px;
display: flex;
flex-wrap: wrap;
/* &:last-child {
margin-bottom: 0;
} */
}
.form_item_half {
width: 30%;
.el-col {
border-radius: 4px;
height: 100%;
}
.form_item_total {
width: 90%;
.margin2 {
margin-left: 10px;
}
.bg-gray {
background: #ececec;
border-radius: 4px;
}
.form_item_block {
display: block;
.form-title {
margin-left: 10px;
text-align: center;
border-radius: 4px;
line-height: 30px;
}
.form-content {
padding: 0 5px;
text-align: left;
border-radius: 4px;
line-height: 30px;
}
.input_tip {
color: #e60000;
margin: 10px 0 0 0;
}
.upload_tip {
color: #7a7a7a;
margin: 10px 0 0 0;
}
</style>

4
epmet-oper-web/src/views/modules/customer/feedback/FeedbackList.vue
View File

@ -45,7 +45,7 @@
<el-form-item label="开始时间"
:label-width="labelWidth">
<el-date-picker v-model="tableParams.startTime"
style="width:200px;margin-left:10px"
style="width:150px;margin-left:10px"
type="datetime"
format="yyyy-MM-dd hh:mm:ss"
value-format="yyyy-MM-dd hh:mm:ss"
@ -55,7 +55,7 @@
<el-form-item label="结束时间"
:label-width="labelWidth">
<el-date-picker v-model="tableParams.endTime"
style="width:200px;margin-left:10px"
style="width:150px;margin-left:10px"
type="datetime"
format="yyyy-MM-dd hh:mm:ss"
value-format="yyyy-MM-dd hh:mm:ss"

Write Preview
Loading…
Cancel
Save