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.
378 lines
9.0 KiB
378 lines
9.0 KiB
<template>
|
|
<div>
|
|
|
|
<el-dialog
|
|
:before-close="handleClose"
|
|
:modal="true"
|
|
:modal-append-to-body="false"
|
|
:visible.sync="dialogVisible"
|
|
class="dissatisfied-detail"
|
|
title=""
|
|
width="1118px"
|
|
>
|
|
<div class="content">
|
|
<div class="main-title main-title2">
|
|
<Title text="事件派单"/>
|
|
</div>
|
|
<div v-if="dialogVisible" class="contents">
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<div class="items">
|
|
<div class="label">事件类型：</div>
|
|
<div class="value">{{ detail.categoryName }}</div>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<div class="items">
|
|
<div class="label">接收时间：</div>
|
|
<div class="value">{{ detail.happenTime }}</div>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<div class="items">
|
|
<div class="label">发生地点：</div>
|
|
<div class="value">{{ detail.address }}</div>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<div class="items">
|
|
<div class="label">事件描述：</div>
|
|
<div class="value">
|
|
{{ detail.eventContent }}
|
|
</div>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<div class="items" style="align-items: center">
|
|
<div class="label required">处理方式：</div>
|
|
<el-radio-group
|
|
v-model.trim="form.operationType"
|
|
class="select"
|
|
popper-class="selectPopClass"
|
|
text-color="#fff">
|
|
<el-radio label="5" value="5">指派</el-radio>
|
|
<el-radio label="2" value="2">转服务</el-radio>
|
|
</el-radio-group>
|
|
</div>
|
|
</el-col>
|
|
</el-row>
|
|
<template v-if="form.operationType == '5'">
|
|
<Assign :eventDetailData="detail" @change="setForm"/>
|
|
</template>
|
|
<template v-if="form.operationType == '2'">
|
|
<TransferService
|
|
:transferObj="transferObj"
|
|
@change="setForm"
|
|
:demandUserId="detail.demandUserId"
|
|
:demandUserName="detail.demandUserName"
|
|
:demandUserMobile="detail.demandUserMobile"
|
|
:eventId="detail.icEventId"
|
|
:eventDetailData="detail"
|
|
/>
|
|
</template>
|
|
<div class="btn-group">
|
|
<el-button class="cancel" plain round type="success" @click="handleCancel">取消</el-button>
|
|
<el-button class="sure" plain round type="warning" @click="handleSure">确定</el-button>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
<el-dialog :visible.sync="imageVisible" append-to-body width="300px">
|
|
<img :src="dialogImageUrl" alt="" width="100%">
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Title from "@/views/dataBoard/satisfactionEval/components/Title";
|
|
import CallPhone from "@/views/dataBoard/cpts/CallPhone";
|
|
import Assign from "@/views/dataBoard/overview/components/EventDispatchOrder/Assign.vue";
|
|
import TransferService from "@/views/dataBoard/overview/components/EventDispatchOrder/TransferService.vue";
|
|
|
|
export default {
|
|
name: "EventDispatchOrder",
|
|
components: {Assign, Title, CallPhone, TransferService},
|
|
data() {
|
|
return {
|
|
dialogVisible: false,
|
|
form: {
|
|
operationType: "5", //处理方式[0:已回复 5、指派 6、完成并回复]
|
|
},
|
|
dialogImageUrl: '',
|
|
imageVisible: false,
|
|
disabled: false,
|
|
detail: {},
|
|
transferObj: {}
|
|
};
|
|
},
|
|
async mounted() {
|
|
|
|
},
|
|
methods: {
|
|
setForm(val) {
|
|
this.form = {
|
|
...this.form,
|
|
...val
|
|
}
|
|
},
|
|
handleClose(done) {
|
|
this.dialogVisible = false;
|
|
this.$emit('close')
|
|
},
|
|
open(detail) {
|
|
this.dialogVisible = true;
|
|
this.detail = detail
|
|
const {user} = this.$store.state;
|
|
this.agencyId = user.agencyId;
|
|
this.$EventBus.$on('map', (val) => {
|
|
this.transferObj.latitude = val.lat
|
|
this.transferObj.longitude = val.lng
|
|
})
|
|
},
|
|
handleCancel() {
|
|
this.handleClose()
|
|
},
|
|
handleSure() {
|
|
if (!this.form.operationType) {
|
|
|
|
this.$message.error('请选择处理方式')
|
|
return;
|
|
}
|
|
let url = "/governance/icEventOld/reply"
|
|
|
|
if (this.form.operationType == "5") {
|
|
if (!this.form.categoryId) {
|
|
this.$message.error('请选择事件分类')
|
|
return;
|
|
}
|
|
if (!this.form.deptId) {
|
|
this.$message.error('请选择处理部门')
|
|
return;
|
|
}
|
|
if (!this.form.content) {
|
|
this.$message.error('请选择转办意见')
|
|
return;
|
|
}
|
|
if (!this.form.timeLimit) {
|
|
this.$message.error('请选择办结时限')
|
|
return;
|
|
}
|
|
this.form.files = this.fileList
|
|
this.form.status = "processing"
|
|
}
|
|
if (this.form.operationType == "2") {
|
|
url = "/governance/icEventOld/icEventToDemand";
|
|
if (!this.form.content) {
|
|
this.$message.error('服务内容不能为空')
|
|
return;
|
|
}
|
|
if (!this.form.categoryCode) {
|
|
this.$message.error("服务类型不能为空")
|
|
return;
|
|
}
|
|
if (!this.form.wantServiceTime) {
|
|
this.$message.error("服务时间不能为空")
|
|
return;
|
|
}
|
|
if (!this.form.demandUserName) {
|
|
this.$message.error("需求人不能为空")
|
|
return;
|
|
}
|
|
if (!this.form.demandUserMobile) {
|
|
this.$message.error("联系电话不能为空")
|
|
return;
|
|
}
|
|
if (!this.form.serviceLocation) {
|
|
this.$message.error("服务地点不能为空")
|
|
return;
|
|
}
|
|
if (!this.form.serverId) {
|
|
this.$message.error("服务组织不能为空")
|
|
return;
|
|
}
|
|
}
|
|
this.$http.post(url, {
|
|
...this.form,
|
|
icEventId: this.detail.icEventId,
|
|
}).then(res => {
|
|
this.handleClose()
|
|
this.$message.success('操作成功')
|
|
this.$emit('ok')
|
|
})
|
|
},
|
|
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "~@/assets/scss/dataBoard/dialog.scss";
|
|
|
|
.contents {
|
|
padding: 40px 50px;
|
|
|
|
.items {
|
|
font-size: 14px;
|
|
line-height: 34px;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
margin-bottom: 17px;
|
|
|
|
.label {
|
|
white-space: nowrap;
|
|
color: #9CB4D3;
|
|
}
|
|
|
|
.value {
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
}
|
|
|
|
.hr {
|
|
height: 1px;
|
|
margin: 25px 0;
|
|
opacity: .4;
|
|
border-bottom: 1px #0E79D6 dashed;
|
|
}
|
|
|
|
|
|
.btn-group {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-top: 20px;
|
|
|
|
.green {
|
|
color: #00CD96;
|
|
border: 1px solid #00CD96;
|
|
background: rgba(39, 189, 127, 0.3);
|
|
}
|
|
|
|
.el-button {
|
|
width: 136px;
|
|
height: 36px;
|
|
margin: 0 20px;
|
|
}
|
|
|
|
.orange {
|
|
color: #FD8904;
|
|
border: 1px solid #FD8904;
|
|
background: rgba(253, 137, 4, 0.3);
|
|
}
|
|
|
|
.sure {
|
|
color: #8ED3FF;
|
|
border: 1px solid #006CFF;
|
|
background: rgba(0, 108, 255, 0.5);
|
|
}
|
|
|
|
.cancel {
|
|
color: #B6D2FF;
|
|
border: 1px solid #6496E8;
|
|
background: rgba(116, 146, 194, 0.6);
|
|
}
|
|
|
|
}
|
|
|
|
.select {
|
|
margin-right: 16px;
|
|
}
|
|
|
|
/deep/ .el-date-editor .el-range-separator {
|
|
color: #fff;
|
|
}
|
|
|
|
/deep/ .el-radio {
|
|
color: #fff;
|
|
}
|
|
|
|
/deep/ .el-input--medium .el-input__icon {
|
|
line-height: 40px !important;
|
|
}
|
|
|
|
/deep/ .el-date-editor.el-input {
|
|
width: 360px !important;
|
|
}
|
|
|
|
/deep/ .el-input .el-input__inner {
|
|
width: 360px !important;
|
|
height: 40px !important;
|
|
color: #fff !important;
|
|
border: 1px solid #0E3978 !important;
|
|
border-radius: 20px !important;
|
|
background: rgba(0, 23, 66, 0.72) !important;
|
|
}
|
|
|
|
/deep/ .el-range-editor .el-range-input {
|
|
color: #fff;
|
|
background: none;
|
|
}
|
|
|
|
::v-deep .date-current-weiyi {
|
|
border-color: #006cff;
|
|
background: rgba(3, 19, 51, 0.9);
|
|
box-shadow: inset 0px 0px 16px 0px rgba(0, 145, 255, 1);
|
|
|
|
.el-date-picker__header-label {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.el-picker-panel__icon-btn {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.el-month-table {
|
|
td {
|
|
.cell {
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.el-month-table td.current:not(.disabled) .cell {
|
|
color: #fff;
|
|
background-color: #409eff;
|
|
}
|
|
|
|
.el-month-table td.today:not(.disabled) .cell {
|
|
color: #0056d6;
|
|
}
|
|
|
|
.el-date-picker__header--bordered {
|
|
border-bottom: solid 1px #006cff;
|
|
}
|
|
}
|
|
|
|
/deep/ .el-textarea__inner {
|
|
color: #fff;
|
|
border: 1px solid #0E3978;
|
|
border-radius: 2px;
|
|
background: rgba(0, 23, 66, 0.72);
|
|
}
|
|
|
|
/deep/ .el-upload--picture-card {
|
|
line-height: normal;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
opacity: 0.72;
|
|
color: #fff;
|
|
border: 1px solid #0E3978;
|
|
border-radius: 2px;
|
|
background: rgb(0, 23, 66);
|
|
|
|
.text {
|
|
margin-top: 10px;
|
|
}
|
|
}
|
|
|
|
.required:before {
|
|
margin-right: 5px;
|
|
content: '*';
|
|
color: #f00;
|
|
}
|
|
</style>
|
|
|