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.
260 lines
8.1 KiB
260 lines
8.1 KiB
2 years ago
|
<template>
|
||
|
<div>
|
||
|
<div class="block container">
|
||
|
<div class="title fw500">{{ detail.content }}</div>
|
||
|
|
||
|
<div class="time">{{ detail.happenTime || detail.reportTime }}</div>
|
||
|
<div class="imgs">
|
||
|
<van-image
|
||
|
fit="cover"
|
||
|
v-for="(item2, index2) in detail.imageList"
|
||
|
@click.prevent.stop="previewImage(index2, detail.imageList)"
|
||
|
:src="item2"
|
||
|
:key="index2"
|
||
|
/>
|
||
|
</div>
|
||
|
<div class="address">详细地址:{{ detail.address }}</div>
|
||
|
</div>
|
||
|
|
||
|
<div class="block container">
|
||
|
<div class="title">满意度评价</div>
|
||
|
<div class="btns">
|
||
|
<van-button
|
||
|
round
|
||
|
size="small"
|
||
|
@click="setEvaluate('perfect')"
|
||
|
:type="evaluate == 'perfect' ? 'info' : 'default'"
|
||
|
plain
|
||
|
block
|
||
|
>满意</van-button
|
||
|
>
|
||
|
<van-button
|
||
|
round
|
||
|
size="small"
|
||
|
@click="setEvaluate('good')"
|
||
|
:type="evaluate === 'good' ? 'info' : 'default'"
|
||
|
style="margin: 0 37px"
|
||
|
plain
|
||
|
block
|
||
|
>基本满意</van-button
|
||
|
>
|
||
|
<van-button
|
||
|
round
|
||
|
size="small"
|
||
|
@click="setEvaluate('bad')"
|
||
|
:type="evaluate === 'bad' ? 'info' : 'default'"
|
||
|
plain
|
||
|
block
|
||
|
>不满意</van-button
|
||
|
>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="block container">
|
||
|
<div class="title">处理进展</div>
|
||
|
<van-divider />
|
||
|
<van-steps v-if="process.length > 0 && detail.pageType === 'event'" direction="vertical" :active="0">
|
||
|
<van-step v-for="(item, index) in process" :key="index">
|
||
|
<div class="step-title" v-if="item.agencyId">【指派】</div>
|
||
|
<div class="step-title" v-if="!item.timeLimit">【完成并回复】</div>
|
||
|
<div class="step-title" v-if="!item.agencyId && item.timeLimit">【{{ item.processName }}】</div>
|
||
|
<div class="step-time">{{ item.processTime ? getTrueTime(item.processTime) : '' }}</div>
|
||
|
<template v-if="item.type === 'event'">
|
||
|
<template v-if="item.agencyId">
|
||
|
<div class="content">
|
||
|
<div class="label">指派人:</div>
|
||
|
<div class="value">
|
||
|
{{ item.departmentName }}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="content">
|
||
|
<div class="label">指派部门:</div>
|
||
|
<div class="value">
|
||
|
{{ item.agencyName }}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="content">
|
||
|
<div class="label">转办意见:</div>
|
||
|
<div class="value">
|
||
|
{{ item.publicReply }}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="content">
|
||
|
<div class="label">办结时限:</div>
|
||
|
<div class="value">
|
||
|
{{ item.timeLimit }}
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
<template v-else>
|
||
|
<div class="content">
|
||
|
<div class="label">回复人:</div>
|
||
|
<div class="value">
|
||
|
{{ item.departmentName }}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="content">
|
||
|
<div class="label">回复内容:</div>
|
||
|
<div class="value">
|
||
|
{{ item.publicReply }}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="content" v-if="item.timeLimit">
|
||
|
<div class="label">办结时限:</div>
|
||
|
<div class="value">
|
||
|
{{ getTrueTime(item.timeLimit) }}
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
</template>
|
||
|
</van-step>
|
||
|
</van-steps>
|
||
|
|
||
|
<van-steps v-if="process.length > 0 && detail.pageType === 'demand'" direction="vertical" :active="0">
|
||
|
<van-step v-for="(item, index) in process" :key="index">
|
||
|
<div class="step-title">
|
||
|
【
|
||
|
{{
|
||
|
item.actionCode === 'create'
|
||
|
? '创建需求'
|
||
|
: item.actionCode === 'update'
|
||
|
? '更新需求'
|
||
|
: item.actionCode === 'cancel'
|
||
|
? '撤销需求'
|
||
|
: item.actionCode === 'assign'
|
||
|
? '指派'
|
||
|
: item.actionCode === 'take_order'
|
||
|
? '接单'
|
||
|
: item.actionCode === 'finish'
|
||
|
? '完成'
|
||
|
: item.actionCode === 'evaluate'
|
||
|
? '评价'
|
||
|
: ''
|
||
|
}}
|
||
|
】
|
||
|
</div>
|
||
|
<div class="step-time">{{ item.oprateTime }}</div>
|
||
|
<template v-if="item.actionCode === 'create'">
|
||
|
<div class="content">
|
||
|
<div class="label">上报人:</div>
|
||
|
<div class="value">{{ item.reportUserName }} {{ item.roleName }}</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
<template v-if="item.actionCode === 'assign'">
|
||
|
<div class="content">
|
||
|
<div class="label">办理人:</div>
|
||
|
<div class="value">
|
||
|
{{ item.assignUser }}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="content">
|
||
|
<div class="label">指派给服务方:</div>
|
||
|
<div class="value">
|
||
|
{{ item.serverName }} ({{
|
||
|
item.serviceType === 'volunteer'
|
||
|
? '志愿者'
|
||
|
: item.serviceType === 'social_org'
|
||
|
? '社会组织'
|
||
|
: item.serviceType === 'community_org'
|
||
|
? '社区自组织'
|
||
|
: item.serviceType === 'party_unit'
|
||
|
? '区域党建单位'
|
||
|
: item.serviceType === 'enterprise'
|
||
|
? '企业,商家'
|
||
|
: ''
|
||
|
}})
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<template v-if="item.actionCode === 'finish'">
|
||
|
<div class="content">
|
||
|
<div class="label">服务方:</div>
|
||
|
<div class="value">
|
||
|
{{ item.serverName }} ({{
|
||
|
item.serviceType === 'volunteer'
|
||
|
? '志愿者'
|
||
|
: item.serviceType === 'social_org'
|
||
|
? '社会组织'
|
||
|
: item.serviceType === 'community_org'
|
||
|
? '社区自组织'
|
||
|
: item.serviceType === 'party_unit'
|
||
|
? '区域党建单位'
|
||
|
: item.serviceType === 'enterprise'
|
||
|
? '企业,商家'
|
||
|
: ''
|
||
|
}})
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
</van-step>
|
||
|
</van-steps>
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { ImagePreview } from 'vant'
|
||
|
import { process, updateEvent } from '@/api/event'
|
||
|
import { getUserDemandUnSolvedDetail } from '@/api/demand'
|
||
|
|
||
|
export default {
|
||
|
name: 'appealDetail',
|
||
|
components: {
|
||
|
[ImagePreview.Component.name]: ImagePreview.Component
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
evaluate: 0,
|
||
|
detail: {},
|
||
|
process: []
|
||
|
}
|
||
|
},
|
||
|
mounted() {
|
||
|
this.detail = this.$route.query
|
||
|
this.getProcess()
|
||
|
console.log(this.detail)
|
||
|
},
|
||
|
methods: {
|
||
|
setEvaluate(val) {
|
||
|
if (this.detail.pageType === 'event') {
|
||
|
updateEvent({
|
||
|
id: this.detail.id,
|
||
|
satisfaction: val
|
||
|
}).then(() => {
|
||
|
this.evaluate = val
|
||
|
this.$toast.success('评价成功')
|
||
|
})
|
||
|
}
|
||
|
},
|
||
|
previewImage(index, urls) {
|
||
|
ImagePreview({
|
||
|
images: urls,
|
||
|
startPosition: index
|
||
|
})
|
||
|
},
|
||
|
getProcess() {
|
||
|
if (this.detail.pageType === 'event') {
|
||
|
process({
|
||
|
icEventId: this.detail.id
|
||
|
}).then(res => {
|
||
|
this.process = res
|
||
|
})
|
||
|
} else {
|
||
|
getUserDemandUnSolvedDetail({
|
||
|
id: this.detail.id
|
||
|
}).then(res => {
|
||
|
this.process = res.logList
|
||
|
})
|
||
|
}
|
||
|
},
|
||
|
getTrueTime(time) {
|
||
|
return this.$moment(time * 1000).format('YYYY-MM-DD hh:mm')
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style scoped lang="less">
|
||
|
@import './index';
|
||
|
</style>
|