|
|
|
@ -1,92 +1,124 @@ |
|
|
|
<template> |
|
|
|
<div class=""> |
|
|
|
<el-card :class="{'box-card':source==='visiual'}" |
|
|
|
v-if="showType==''"> |
|
|
|
<h3 v-if="source==='manage'">事件详情</h3> |
|
|
|
<el-card |
|
|
|
:class="{ 'box-card': source === 'visiual' }" |
|
|
|
v-if="showType == ''" |
|
|
|
> |
|
|
|
<h3 v-if="source === 'manage'">事件详情</h3> |
|
|
|
<div class="m-row"> |
|
|
|
<div class="m-info"> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">所属网格：</span> |
|
|
|
<span>{{ info.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">发生时间：</span> |
|
|
|
<span>{{ info.happenTime }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">事件内容：</span> |
|
|
|
<span>{{ info.eventContent }}</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-if="info.imageList&&info.imageList.length>0" |
|
|
|
:class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
v-if="info.imageList && info.imageList.length > 0" |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">图片：</span> |
|
|
|
<img :src="src" |
|
|
|
:key="src" |
|
|
|
style="width:150px;height:150px;padding-right:10px" |
|
|
|
v-for="src in info.imageList" |
|
|
|
@click="watchImg(src)" /> |
|
|
|
<img |
|
|
|
:src="src" |
|
|
|
:key="src" |
|
|
|
style="width: 150px; height: 150px; padding-right: 10px" |
|
|
|
v-for="src in info.imageList" |
|
|
|
@click="watchImg(src)" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-if="info.voiceList&&info.voiceList.length>0" |
|
|
|
:class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
v-if="info.voiceList && info.voiceList.length > 0" |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">语音：</span> |
|
|
|
<audio controls> |
|
|
|
<source :src="item.url" |
|
|
|
type="" |
|
|
|
:key="item.url" |
|
|
|
v-for="item in info.voiceList" /> |
|
|
|
<source |
|
|
|
:src="item.url" |
|
|
|
type="" |
|
|
|
:key="item.url" |
|
|
|
v-for="item in info.voiceList" |
|
|
|
/> |
|
|
|
</audio> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">反映渠道：</span> |
|
|
|
<span>{{ info.sourceTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">地址：</span> |
|
|
|
<span>{{ info.address }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">报事人：</span> |
|
|
|
<span>{{ info.name }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">手机号：</span> |
|
|
|
<span>{{ info.mobile }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">身份证号：</span> |
|
|
|
<span>{{ info.idCard?info.idCard:'--' }}</span> |
|
|
|
<span>{{ info.idCard ? info.idCard : "--" }}</span> |
|
|
|
</div> |
|
|
|
<div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">痛点难点：</span> |
|
|
|
<span>{{ info.difficultPointName }}</span> |
|
|
|
</div> |
|
|
|
<div v-if="info.operationType==='1'" |
|
|
|
:class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
v-if="info.operationType === '1'" |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">已立项：</span> |
|
|
|
<div class="line" |
|
|
|
@click="handleToProject">查看项目</div> |
|
|
|
<div class="line" @click="handleToProject">查看项目</div> |
|
|
|
</div> |
|
|
|
<div v-if="info.operationType==='2'" |
|
|
|
:class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
v-if="info.operationType === '2'" |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">已转需求：</span> |
|
|
|
<div class="line" |
|
|
|
@click="handleToDemand">查看需求</div> |
|
|
|
<div class="line" @click="handleToDemand">查看需求</div> |
|
|
|
</div> |
|
|
|
<div v-if="info.operationType==='3'" |
|
|
|
:class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
v-if="info.operationType === '3'" |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">已转议题：</span> |
|
|
|
<div class="line" |
|
|
|
@click="handleToIssue">查看议题</div> |
|
|
|
<div class="line" @click="handleToIssue">查看议题</div> |
|
|
|
</div> |
|
|
|
<div v-if="info.satisfactionName" |
|
|
|
:class="['info-prop',{'info-prop-vis':source==='visiual'}]"> |
|
|
|
<div |
|
|
|
v-if="info.satisfactionName || info.satisfaction" |
|
|
|
:class="['info-prop', { 'info-prop-vis': source === 'visiual' }]" |
|
|
|
> |
|
|
|
<span class="info-title-2">满意度：</span> |
|
|
|
<div @click="handleToDemand">{{info.satisfactionName}}</div> |
|
|
|
<!-- @click="handleToDemand" --> |
|
|
|
<div>{{ satisfactionNameM(info) }}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- |
|
|
|
@ -94,23 +126,25 @@ |
|
|
|
1、状态=完成 (已评价)||(没评价&&不是本人) |
|
|
|
|
|
|
|
2、状态=未完成 （有操作id） --> |
|
|
|
<div v-if="(info.status==='processing'&&info.operationId)||(info.status==='closed_case'&&(info.satisfactionName||(!info.satisfactionName && user.id!=info.createdUserId)))" |
|
|
|
class="div-btn "> |
|
|
|
<el-button size="small" |
|
|
|
@click="handleCloseEvent">关闭</el-button> |
|
|
|
|
|
|
|
<div |
|
|
|
v-if=" |
|
|
|
(info.status === 'processing' && info.operationId) || |
|
|
|
(info.status === 'closed_case' && |
|
|
|
(info.satisfactionName || |
|
|
|
(!info.satisfactionName && user.id != info.createdUserId))) |
|
|
|
" |
|
|
|
class="div-btn" |
|
|
|
> |
|
|
|
<el-button size="small" @click="handleCloseEvent">关闭</el-button> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-card> |
|
|
|
|
|
|
|
<el-card :class="{'box-card':source==='visiual'}" |
|
|
|
v-if="info.status==='closed_case'&&!info.satisfactionName && user.id===info.createdUserId"> |
|
|
|
<!-- --> |
|
|
|
<el-card :class="{ 'box-card': source === 'visiual' }" v-if="info.status==='closed_case'&&!info.satisfactionName && !info.satisfaction&& user.id===info.createdUserId"> |
|
|
|
<h3>满意度评价</h3> |
|
|
|
<div class="m-row"> |
|
|
|
<div class="m-info"> |
|
|
|
|
|
|
|
<div class="div-satisfy"> |
|
|
|
<div> |
|
|
|
<!-- <div> |
|
|
|
<img :src="selBad?badurl_light:badurl" |
|
|
|
@click="clickSatisfy('bad')" /> |
|
|
|
<div class="tip-satisfy">不满意</div> |
|
|
|
@ -118,48 +152,52 @@ |
|
|
|
<div> |
|
|
|
<img :src="selGood?goodurl_light:goodurl" |
|
|
|
@click="clickSatisfy('good')" /> |
|
|
|
<div class="tip-satisfy">满意</div> |
|
|
|
<div class="tip-satisfy">基本满意</div> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<img :src="selPerfect?perfecturl_light:perfecturl" |
|
|
|
@click="clickSatisfy('perfect')" /> |
|
|
|
<div class="tip-satisfy">非常满意</div> |
|
|
|
</div> --> |
|
|
|
<div style="display: flex; justify-content: center !important"> |
|
|
|
<el-rate v-model="starClocr" @change="handelChangeStar"></el-rate> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="div-btn "> |
|
|
|
<el-button size="small" |
|
|
|
@click="handleCloseEvent">关闭</el-button> |
|
|
|
<el-button style="margin-left:20px" |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
@click="handleComfirmSatisfy">确定</el-button> |
|
|
|
<div class="div-btn"> |
|
|
|
<el-button size="small" @click="handleCloseEvent">关闭</el-button> |
|
|
|
<el-button |
|
|
|
style="margin-left: 20px" |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
@click="handleComfirmSatisfy" |
|
|
|
>确定</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-card> |
|
|
|
<el-dialog :visible.sync="showSatisfy" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:close-on-press-escape="false" |
|
|
|
title="满意度评价" |
|
|
|
width="550px" |
|
|
|
top="15vh" |
|
|
|
class="dialog-h" |
|
|
|
@closed="showSatisfy=false"> |
|
|
|
|
|
|
|
<div class="div-btn "> |
|
|
|
<el-button size="small" |
|
|
|
@click="showSatisfy=false">关闭</el-button> |
|
|
|
<el-button style="margin-left:20px" |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
@click="handleComfirmSatisfy">确定</el-button> |
|
|
|
<el-dialog |
|
|
|
:visible.sync="showSatisfy" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:close-on-press-escape="false" |
|
|
|
title="满意度评价" |
|
|
|
width="550px" |
|
|
|
top="15vh" |
|
|
|
class="dialog-h" |
|
|
|
@closed="showSatisfy = false" |
|
|
|
> |
|
|
|
<div class="div-btn"> |
|
|
|
<el-button size="small" @click="showSatisfy = false">关闭</el-button> |
|
|
|
<el-button |
|
|
|
style="margin-left: 20px" |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
@click="handleComfirmSatisfy" |
|
|
|
>确定</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -169,16 +207,17 @@ import foldText from "@/views/components/foldText"; |
|
|
|
import projectInfo from "../../xiangmu/cpts/project-info"; |
|
|
|
import dateFormat from "dai-js/tools/dateFormat"; |
|
|
|
|
|
|
|
function iniData () { |
|
|
|
function iniData() { |
|
|
|
return { |
|
|
|
user: {}, |
|
|
|
projectPageType: 'info', |
|
|
|
starClocr: 5, |
|
|
|
projectPageType: "info", |
|
|
|
|
|
|
|
info: {}, |
|
|
|
eventDetailCopy: {}, |
|
|
|
showType: '', |
|
|
|
showType: "", |
|
|
|
|
|
|
|
projectId: '', |
|
|
|
projectId: "", |
|
|
|
|
|
|
|
demandForm: { |
|
|
|
gridId: "", |
|
|
|
@ -200,12 +239,12 @@ function iniData () { |
|
|
|
selBad: false, |
|
|
|
selGood: false, |
|
|
|
selPerfect: false, |
|
|
|
badurl: require('@/assets/img/satisfy-images/face1.png'), |
|
|
|
badurl_light: require('@/assets/img/satisfy-images/face1_light.png'), |
|
|
|
goodurl: require('@/assets/img/satisfy-images/face2.png'), |
|
|
|
goodurl_light: require('@/assets/img/satisfy-images/face2_light.png'), |
|
|
|
perfecturl: require('@/assets/img/satisfy-images/face3.png'), |
|
|
|
perfecturl_light: require('@/assets/img/satisfy-images/face3_light.png'), |
|
|
|
badurl: require("@/assets/img/satisfy-images/face1.png"), |
|
|
|
badurl_light: require("@/assets/img/satisfy-images/face1_light.png"), |
|
|
|
goodurl: require("@/assets/img/satisfy-images/face2.png"), |
|
|
|
goodurl_light: require("@/assets/img/satisfy-images/face2_light.png"), |
|
|
|
perfecturl: require("@/assets/img/satisfy-images/face3.png"), |
|
|
|
perfecturl_light: require("@/assets/img/satisfy-images/face3_light.png"), |
|
|
|
}; |
|
|
|
} |
|
|
|
|
|
|
|
@ -222,36 +261,50 @@ export default { |
|
|
|
}, |
|
|
|
|
|
|
|
eventDetailData: { |
|
|
|
|
|
|
|
type: Object, |
|
|
|
default () { |
|
|
|
return {} |
|
|
|
} |
|
|
|
default() { |
|
|
|
return {}; |
|
|
|
}, |
|
|
|
}, |
|
|
|
source: {//展示来源：manage 管理平台 visiual 可视化平台 |
|
|
|
source: { |
|
|
|
//展示来源：manage 管理平台 visiual 可视化平台 |
|
|
|
type: String, |
|
|
|
default: 'manage' |
|
|
|
} |
|
|
|
default: "manage", |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
components: { |
|
|
|
foldText, projectInfo |
|
|
|
foldText, |
|
|
|
projectInfo, |
|
|
|
}, |
|
|
|
|
|
|
|
data: iniData, |
|
|
|
|
|
|
|
computed: {}, |
|
|
|
|
|
|
|
watch: { |
|
|
|
|
|
|
|
computed: { |
|
|
|
satisfactionNameM() { |
|
|
|
return function (row) { |
|
|
|
let text = "--"; |
|
|
|
if (row.satisfactionName) { |
|
|
|
text = row.satisfactionName; |
|
|
|
} else if (row.satisfaction == 1) { |
|
|
|
text = "不满意"; |
|
|
|
} else if (row.satisfaction == 5) { |
|
|
|
text = "非常满意"; |
|
|
|
} else if (row.satisfaction < 5 && row.satisfaction > 1) { |
|
|
|
text = "基本满意"; |
|
|
|
} else { |
|
|
|
text = "--"; |
|
|
|
} |
|
|
|
return text; |
|
|
|
}; |
|
|
|
}, |
|
|
|
}, |
|
|
|
created () { |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
watch: {}, |
|
|
|
created() {}, |
|
|
|
|
|
|
|
mounted () { |
|
|
|
this.user = this.$store.state.user |
|
|
|
mounted() { |
|
|
|
this.user = this.$store.state.user; |
|
|
|
if (this.eventId) { |
|
|
|
this.info = JSON.parse(JSON.stringify(this.eventDetailData)); |
|
|
|
|
|
|
|
@ -261,27 +314,25 @@ export default { |
|
|
|
// } |
|
|
|
} |
|
|
|
// this.getApiData(); |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
watchImg (src) { |
|
|
|
watchImg(src) { |
|
|
|
window.open(src); |
|
|
|
}, |
|
|
|
|
|
|
|
handleClose () { |
|
|
|
this.showType = '' |
|
|
|
handleClose() { |
|
|
|
this.showType = ""; |
|
|
|
}, |
|
|
|
|
|
|
|
handleCloseEvent () { |
|
|
|
handleCloseEvent() { |
|
|
|
this.$emit("handleClose"); |
|
|
|
}, |
|
|
|
|
|
|
|
async getApiData () { |
|
|
|
}, |
|
|
|
async getApiData() {}, |
|
|
|
|
|
|
|
handleToProject () { |
|
|
|
this.$emit("handleToProject") |
|
|
|
handleToProject() { |
|
|
|
this.$emit("handleToProject"); |
|
|
|
// if (this.info.status === 'processing') { |
|
|
|
// this.projectPageType = 'edit' |
|
|
|
// } else { |
|
|
|
@ -290,76 +341,76 @@ export default { |
|
|
|
|
|
|
|
// this.showType = 'project' |
|
|
|
}, |
|
|
|
handleToDemand () { |
|
|
|
this.$emit("handleToDemand") |
|
|
|
handleToDemand() { |
|
|
|
this.$emit("handleToDemand"); |
|
|
|
}, |
|
|
|
handleToIssue () { |
|
|
|
this.$emit("handleToIssue") |
|
|
|
handleToIssue() { |
|
|
|
this.$emit("handleToIssue"); |
|
|
|
}, |
|
|
|
|
|
|
|
//满意度评价 |
|
|
|
handleSatisfy () { |
|
|
|
|
|
|
|
this.showSatisfy = true |
|
|
|
handleSatisfy() { |
|
|
|
this.showSatisfy = true; |
|
|
|
}, |
|
|
|
|
|
|
|
clickSatisfy (type) { |
|
|
|
handelChangeStar(val) { |
|
|
|
this.starClocr = val; |
|
|
|
this.changeSatisfyType(val); |
|
|
|
}, |
|
|
|
clickSatisfy(type) { |
|
|
|
if (this.info.satisfactionName) { |
|
|
|
return false |
|
|
|
return false; |
|
|
|
} |
|
|
|
|
|
|
|
this.changeSatisfyType(type) |
|
|
|
|
|
|
|
this.changeSatisfyType(type); |
|
|
|
}, |
|
|
|
changeSatisfyType (type) { |
|
|
|
if (type === 'bad') { |
|
|
|
this.selGood = false |
|
|
|
this.selPerfect = false |
|
|
|
this.selBad = true |
|
|
|
} else if (type === 'good') { |
|
|
|
this.selGood = true |
|
|
|
this.selPerfect = false |
|
|
|
this.selBad = false |
|
|
|
} else if (type === 'perfect') { |
|
|
|
this.selGood = false |
|
|
|
this.selPerfect = true |
|
|
|
this.selBad = false |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
async handleComfirmSatisfy () { |
|
|
|
let satisfyLevel = '' |
|
|
|
if (!this.selBad && !this.selGood && !this.selPerfect) { |
|
|
|
// changeSatisfyType(num) { |
|
|
|
// // if (type === 'bad') { |
|
|
|
// // this.selGood = false |
|
|
|
// // this.selPerfect = false |
|
|
|
// // this.selBad = true |
|
|
|
// // } else if (type === 'good') { |
|
|
|
// // this.selGood = true |
|
|
|
// // this.selPerfect = false |
|
|
|
// // this.selBad = false |
|
|
|
// // } else if (type === 'perfect') { |
|
|
|
// // this.selGood = false |
|
|
|
// // this.selPerfect = true |
|
|
|
// // this.selBad = false |
|
|
|
// // } |
|
|
|
// this.starClocr = num; |
|
|
|
// }, |
|
|
|
|
|
|
|
async handleComfirmSatisfy() { |
|
|
|
let satisfyLevel = ""; |
|
|
|
if (this.starClocr == 0) { |
|
|
|
this.$message.info("请选择评价级别"); |
|
|
|
} else { |
|
|
|
if (this.selBad) { |
|
|
|
satisfyLevel = 'bad' |
|
|
|
} else if (this.selGood) { |
|
|
|
satisfyLevel = 'good' |
|
|
|
} else if (this.selPerfect) { |
|
|
|
satisfyLevel = 'perfect' |
|
|
|
} |
|
|
|
} |
|
|
|
const url = "/gov/project/icEvent/comment" |
|
|
|
// else { |
|
|
|
// if (this.selBad) { |
|
|
|
// satisfyLevel = "bad"; |
|
|
|
// } else if (this.selGood) { |
|
|
|
// satisfyLevel = "good"; |
|
|
|
// } else if (this.selPerfect) { |
|
|
|
// satisfyLevel = "perfect"; |
|
|
|
// } |
|
|
|
// } |
|
|
|
const url = "/gov/project/icEvent/comment"; |
|
|
|
|
|
|
|
let params = { |
|
|
|
icEventId: this.eventId, |
|
|
|
satisfaction: satisfyLevel |
|
|
|
} |
|
|
|
satisfaction: this.starClocr, |
|
|
|
}; |
|
|
|
|
|
|
|
const { data, code, msg } = await requestPost(url, params) |
|
|
|
const { data, code, msg } = await requestPost(url, params); |
|
|
|
|
|
|
|
if (code === 0) { |
|
|
|
this.$message.success("评价成功"); |
|
|
|
this.info.satisfactionName = '111' |
|
|
|
this.showSatisfy = false |
|
|
|
|
|
|
|
this.info.satisfactionName = "111"; |
|
|
|
this.showSatisfy = false; |
|
|
|
} else { |
|
|
|
this.$message.error(msg) |
|
|
|
this.$message.error(msg); |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
