Browse Source

新增事件处理转服务

feature
战立标 2 years ago
parent
commit
756444eab6
  1. 4
      src/views/dataBoard/overview/components/EventDetail.vue
  2. 598
      src/views/dataBoard/overview/components/EventDispatchOrder.vue
  3. 348
      src/views/dataBoard/overview/components/EventDispatchOrder/Assign.vue
  4. 636
      src/views/dataBoard/overview/components/EventDispatchOrder/TransferService.vue
  5. 380
      src/views/dataBoard/overview/components/EventDispatchOrder/index.vue
  6. 2
      src/views/dataBoard/overview/components/MapDialog/List12345.vue
  7. 2
      src/views/dataBoard/overview/components/MapDialog/Njjwtqk.vue
  8. 2
      src/views/dataBoard/overview/dissatisfiedProblemNumber/12345Hotline.vue

4
src/views/dataBoard/overview/components/EventDetail.vue

@ -79,7 +79,7 @@
</div>
<div class="eventItem">
<div class="label">办结时限</div>
<div class="value">{{ item.latestOperatedTime }}</div>
<div class="value">{{ item.timeLimit }}</div>
</div>
<div class="eventItem">
<div class="label">满意度评价</div>
@ -222,7 +222,7 @@ import Title from "@/views/dataBoard/satisfactionEval/components/Title";
import CallPhone from "@/views/dataBoard/cpts/CallPhone.vue";
import ResourceScheduling from "@/views/dataBoard/overview/components/ResourceScheduling.vue";
import Supervision from "@/views/dataBoard/overview/components/Supervision.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder/index.vue";
export default {

598
src/views/dataBoard/overview/components/EventDispatchOrder.vue

@ -1,598 +0,0 @@
<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 class="contents" v-if="dialogVisible">
<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="12">
<div class="items" style="align-items: center">
<div class="label">处理方式</div>
<el-radio-group v-model="form.operationType" class="select" popper-class="selectPopClass"
text-color="#fff">
<el-radio label="5" value="5">指派</el-radio>
<!-- <el-radio disabled label="" value="">转财务</el-radio>-->
</el-radio-group>
</div>
</el-col>
<el-col :span="12">
<div class="items" style="align-items: center">
<div class="label">事件分类</div>
<el-cascader
:key="iscascaderShow"
ref="myCascader"
v-model="selCategoryArray"
:options="casOptions"
:props="optionProps"
:show-all-levels="false"
class="select"
clearable
popper-class="selectPopClass"
@change="handleChangeCate"
/>
</div>
</el-col>
<el-col :span="12">
<div class="items">
<div class="label">处理部门</div>
<el-cascader
ref="agencyIdArray"
v-model="agencyIdArray"
:options="orgOptions"
:props="orgOptionProps"
:show-all-levels="false"
class="select"
popper-class="selectPopClass"
@change="handleChangeAgency"
/>
<!-- <div class="value">{{ detail.gridName }} {{ detail.name }}</div>-->
</div>
</el-col>
<el-col :span="24">
<div class="items">
<div class="label">转办意见</div>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<el-input
v-model="form.content"
:autosize="{ minRows: 5, maxRows: 10}"
class="input"
maxlength="500"
placeholder="请输入转办意见"
type="textarea"/>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<div class="label">图片/附件</div>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<!-- <el-upload
:auto-upload="false"
action="#"
list-type="picture-card">
<div slot="default">
<i class="el-icon-plus"></i>
<div class="text">添加图片</div>
</div>
<div slot="file" slot-scope="{file}">
<img
:src="file.url"
alt="" class="el-upload-list__item-thumbnail"
>
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<i class="el-icon-zoom-in"></i>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDownload(file)">
<i class="el-icon-download"></i>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
<i class="el-icon-delete"></i>
</span>
</span>
</div>
</el-upload>-->
<el-upload
:action="uploadUlr"
:before-upload="beforeUpload"
:file-list="fileList"
:headers="$getElUploadHeaders()"
:limit="3"
:on-preview="handleFileDownload"
:on-remove="handleFileRemove"
:on-success="handleFileSuccess"
accept=".doc,.pdf,.xls,.docx,.xlsx,.jpg,.png,.jpeg,.bmp,.mp4,.wma,.m4a,.mp3"
class="upload-demo">
<el-button :disabled="fileList.length === 3" size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">支持图片wordpdf</div>
</el-upload>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<div class="label">办结时限</div>
<el-date-picker
v-model="form.timeLimit"
:append-to-body="false"
format="yyyy-MM-dd"
placeholder="开始日期"
popper-class="date-current-weiyi"
value-format="yyyy-MM-dd HH:mm:ss"
/>
</div>
</el-col>
</el-row>
<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 {requestPost} from "@/js/dai/request";
export default {
name: "EventDispatchOrder",
components: {Title, CallPhone},
data() {
return {
dialogVisible: false,
form: {
operationType: "5", //[0: 5 6]
content: "",//
timeLimit: "",//
categoryId: "",//
deptId: "", //
deptName: "",
categoryList: [],
files: [] //
},
dialogImageUrl: '',
imageVisible: false,
disabled: false,
detail: {},
orgOptions: [],
orgOptionProps: {
multiple: false,
value: 'agencyId',
label: 'agencyName',
children: 'subAgencyList',
checkStrictly: true
},
agencyIdArray: [],
status: false,
okflag: false,
eventDetailCopy: {},
selCategoryArray: [],
casOptions: [],
fileList: [],
uploadUlr: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile",
iscascaderShow: 0,
optionProps: {
multiple: false,
value: "id",
label: "categoryName",
children: "children",
checkStrictly: true
},
dataRule: {
content: [
{required: true, message: "回复内容不能为空", trigger: "blur"},
],
categoryId: [
{required: true, message: "事件分类不能为空", trigger: "blur"},
],
deptId: [
{required: true, message: "处理部门不能为空", trigger: "blur"},
],
timeLimit: [
{required: true, message: "办结时限不能为空", trigger: "blur"},
],
categoryList: [
{required: true, message: '事件分类不能为空', trigger: 'blur'},
]
},
selCateObj: {
id: ""
},
};
},
async mounted() {
},
methods: {
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.getOrgTreeList();
this.getCategoryList();
},
handleCancel() {
this.handleClose()
},
handleSure() {
console.log(this.form)
this.$http.post('/governance/icEventOld/reply', {
...this.form,
files: this.fileList,
icEventId: this.detail.icEventId,
status:"processing",
}).then(res => {
this.handleClose()
this.$message.success('操作成功')
this.$emit('ok')
})
},
beforeUpload(file) {
const array = file.name.split(".");
const extension = array[array.length - 1];
const formatarray = [
"jpg",
"png",
"jpeg",
"bmp",
"mp4",
"wma",
"m4a",
"mp3",
"doc",
"docx",
"xls",
"xlsx",
"pdf",
];
if (formatarray.indexOf(extension) === -1) {
this.$message.error("只支持图片、word、pdf");
return false;
}
},
handleFileRemove(file) {
if (file && file.status === "success") {
this.fileList.splice(
this.fileList.findIndex((item) => item.uid === file.uid),
1
);
}
},
handleFileSuccess(res, file) {
if (res.code === 0 && res.msg === "success") {
const array = file.name.split(".");
const fileType = array[array.length - 1];
const picArray = ["jpg", "png", "jpeg", "bmp"];
const videoarray = ["mp4", "wma", "m4a"];
const docArray = ["doc", "docx", "xls", "xlsx", "pdf"];
const mp3Array = ["mp3"];
if (picArray.indexOf(fileType) > -1) {
file.attachmentFormat = "image";
} else if (videoarray.indexOf(fileType) > -1) {
file.attachmentFormat = "video";
} else if (docArray.indexOf(fileType) > -1) {
file.attachmentFormat = "doc";
} else if (mp3Array.indexOf(fileType) > -1) {
file.attachmentFormat = "voice";
}
file.url = res.data.url;
file.type = fileType;
file.attachmentName = file.name;
file.attachmentType = file.type;
file.attachmentUrl = file.url;
this.fileList.push(file);
} else this.$message.error(res.msg);
},
//
handleFileDownload(file) {
var a = document.createElement("a");
var event = new MouseEvent("click");
a.download = file.name;
a.target = '_blank';
a.href = file.url;
a.dispatchEvent(event);
},
handleChangeCate() {
if (this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0]) {
this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0].data
this.form.categoryList = this.selCateObj
this.form.categoryId = this.selCateObj.id
} else {
this.selCateObj = {}
}
},
handleChangeAgency(val) {
let obj = this.$refs["agencyIdArray"].getCheckedNodes()[0].data
if (obj) {
this.form.orgType = obj.level === 'grid' ? 'grid' : 'agency'
this.form.deptId = obj.agencyId
this.form.deptName = obj.agencyName
} else {
this.form.orgType = ''
this.form.orgId = ''
}
},
//
async getOrgTreeList() {
const url = "/gov/org/customeragency/agencygridtree"
let params = {
agencyId: this.agencyId,
purpose: "query"
}
const {data, code, msg} = await requestPost(url, params)
if (code === 0) {
this.orgOptions = []
this.orgOptions.push(data)
} else {
this.$message.error(msg)
}
},
async getCategoryList() {
const url = '/governance/icEvent/getCategoryTree';
let params = {};
const {data, code, msg} = await requestPost(url, params);
if (code === 0) {
let treeDataNew = this.deepTree(data, "children");
++this.iscascaderShow;
this.casOptions = [];
this.casOptions = treeDataNew;
} else {
this.$message.error(msg);
}
if (this.eventDetailCopy.parentCategoryId) {
const pids = this.eventDetailCopy.parentCategoryId.split(',');
pids.push(this.eventDetailCopy.categoryId);
let nodes = this.casOptions;
for (let i = 0; i < pids.length; i++) {
nodes = this.buildNode(nodes, pids[i])
}
if (nodes) {
this.form.categoryList.push(nodes)
this.selCateObj = nodes
}
}
},
//
deepTree(arr, children) {
if (Array.isArray(arr) && arr.length > 0) {
return arr.map((item) => {
return {
...item,
[children]:
(item[children] &&
item[children].length > 0 &&
this.deepTree(item[children], children)) ||
null,
};
});
}
},
},
};
</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__inner {
width: 360px;
height: 40px;
color: #fff;
border: 1px solid #0E3978;
border-radius: 20px;
background: rgba(0, 23, 66, 0.72);
}
/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;
}
}
</style>

348
src/views/dataBoard/overview/components/EventDispatchOrder/Assign.vue

@ -0,0 +1,348 @@
<template>
<el-row>
<el-col :span="12">
<div class="items" style="align-items: center">
<div class="label required">事件分类</div>
<el-cascader
:key="iscascaderShow"
ref="myCascader"
v-model="selCategoryArray"
:options="casOptions"
:props="optionProps"
:show-all-levels="false"
class="select"
clearable
popper-class="selectPopClass"
@change="handleChangeCate"
/>
</div>
</el-col>
<el-col :span="12">
<div class="items">
<div class="label required">处理部门</div>
<el-cascader
ref="agencyIdArray"
v-model="agencyIdArray"
:options="orgOptions"
:props="orgOptionProps"
:show-all-levels="false"
class="select"
popper-class="selectPopClass"
@change="handleChangeAgency"
/>
<!-- <div class="value">{{ detail.gridName }} {{ detail.name }}</div>-->
</div>
</el-col>
<el-col :span="24">
<div class="items">
<div class="label required">转办意见</div>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<el-input
v-model="form.content"
:autosize="{ minRows: 5, maxRows: 10}"
class="input"
maxlength="500"
placeholder="请输入转办意见"
type="textarea"/>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<div class="label">图片/附件</div>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<el-upload
:action="uploadUlr"
:before-upload="beforeUpload"
:file-list="fileList"
:headers="$getElUploadHeaders()"
:limit="3"
:on-preview="handleFileDownload"
:on-remove="handleFileRemove"
:on-success="handleFileSuccess"
accept=".doc,.pdf,.xls,.docx,.xlsx,.jpg,.png,.jpeg,.bmp,.mp4,.wma,.m4a,.mp3"
class="upload-demo">
<el-button :disabled="fileList.length === 3" size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">支持图片wordpdf</div>
</el-upload>
</div>
</el-col>
<el-col :span="24">
<div class="items">
<div class="label required">办结时限</div>
<el-date-picker
v-model="form.timeLimit"
:append-to-body="false"
format="yyyy-MM-dd"
placeholder="请选择办结时限"
popper-class="date-current-weiyi"
value-format="yyyy-MM-dd HH:mm:ss"
/>
</div>
</el-col>
</el-row>
</template>
<script>
import {requestPost} from "@/js/dai/request";
export default {
name: "assign",
data() {
return {
form: {
operationType: "5", //[0: 5 6]
content: "",//
timeLimit: "",//
categoryId: "",//
deptId: "", //
deptName: "",
categoryList: [],
files: [] //
},
orgOptions: [],
orgOptionProps: {
multiple: false,
value: 'agencyId',
label: 'agencyName',
children: 'subAgencyList',
checkStrictly: true
},
agencyIdArray: [],
status: false,
okflag: false,
eventDetailCopy: {},
selCategoryArray: [],
casOptions: [],
fileList: [],
uploadUlr: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile",
iscascaderShow: 0,
optionProps: {
multiple: false,
value: "id",
label: "categoryName",
children: "children",
checkStrictly: true
},
selCateObj: {
id: ""
}
}
},
props: {
eventDetailData: {
type: Object,
default: () => {
}
}
},
watch: {
form: {
handler(val) {
this.$emit('change', val)
},
deep: true
},
eventDetailData(val) {
this.form.categoryId = val.categoryId
}
},
mounted() {
this.getOrgTreeList();
this.getCategoryList();
this.eventDetailCopy = JSON.parse(JSON.stringify(this.eventDetailData));
// eventDetailCopy
if (this.eventDetailCopy.parentCategoryId && this.eventDetailCopy.categoryId) {
this.selCategoryArray = this.eventDetailCopy.parentCategoryId.split(",");
this.selCategoryArray.push(this.eventDetailCopy.categoryId);
this.handleChangeCate(this.selCategoryArray)
}
},
methods: {
beforeUpload(file) {
const array = file.name.split(".");
const extension = array[array.length - 1];
const formatarray = [
"jpg",
"png",
"jpeg",
"bmp",
"mp4",
"wma",
"m4a",
"mp3",
"doc",
"docx",
"xls",
"xlsx",
"pdf",
];
if (formatarray.indexOf(extension) === -1) {
this.$message.error("只支持图片、word、pdf");
return false;
}
},
handleFileRemove(file) {
if (file && file.status === "success") {
this.fileList.splice(
this.fileList.findIndex((item) => item.uid === file.uid),
1
);
}
},
handleFileSuccess(res, file) {
if (res.code === 0 && res.msg === "success") {
const array = file.name.split(".");
const fileType = array[array.length - 1];
const picArray = ["jpg", "png", "jpeg", "bmp"];
const videoarray = ["mp4", "wma", "m4a"];
const docArray = ["doc", "docx", "xls", "xlsx", "pdf"];
const mp3Array = ["mp3"];
if (picArray.indexOf(fileType) > -1) {
file.attachmentFormat = "image";
} else if (videoarray.indexOf(fileType) > -1) {
file.attachmentFormat = "video";
} else if (docArray.indexOf(fileType) > -1) {
file.attachmentFormat = "doc";
} else if (mp3Array.indexOf(fileType) > -1) {
file.attachmentFormat = "voice";
}
file.url = res.data.url;
file.type = fileType;
file.attachmentName = file.name;
file.attachmentType = file.type;
file.attachmentUrl = file.url;
this.fileList.push(file);
} else this.$message.error(res.msg);
},
//
handleFileDownload(file) {
var a = document.createElement("a");
var event = new MouseEvent("click");
a.download = file.name;
a.target = '_blank';
a.href = file.url;
a.dispatchEvent(event);
},
handleChangeCate() {
if (this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0]) {
this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0].data
this.form.categoryList = this.selCateObj
this.form.categoryId = this.selCateObj.id
} else {
this.selCateObj = {}
}
},
handleChangeAgency(val) {
let obj = this.$refs["agencyIdArray"].getCheckedNodes()[0].data
if (obj) {
this.form.orgType = obj.level === 'grid' ? 'grid' : 'agency'
this.form.deptId = obj.agencyId
this.form.deptName = obj.agencyName
} else {
this.form.orgType = ''
this.form.orgId = ''
}
},
//
async getOrgTreeList() {
const url = "/gov/org/customeragency/agencygridtree"
let params = {
agencyId: this.agencyId,
purpose: "query"
}
const {data, code, msg} = await requestPost(url, params)
if (code === 0) {
this.orgOptions = []
this.orgOptions.push(data)
} else {
this.$message.error(msg)
}
},
async getCategoryList() {
const url = '/governance/icEvent/getCategoryTree';
let params = {};
const {data, code, msg} = await requestPost(url, params);
if (code === 0) {
let treeDataNew = this.deepTree(data, "children");
++this.iscascaderShow;
this.casOptions = [];
this.casOptions = treeDataNew;
} else {
this.$message.error(msg);
}
if (this.eventDetailCopy.parentCategoryId) {
const pids = this.eventDetailCopy.parentCategoryId.split(',');
pids.push(this.eventDetailCopy.categoryId);
let nodes = this.casOptions;
for (let i = 0; i < pids.length; i++) {
nodes = this.buildNode(nodes, pids[i])
}
if (nodes) {
this.form.categoryList.push(nodes)
this.selCateObj = nodes
}
}
},
//
deepTree(arr, children) {
if (Array.isArray(arr) && arr.length > 0) {
return arr.map((item) => {
return {
...item,
[children]:
(item[children] &&
item[children].length > 0 &&
this.deepTree(item[children], children)) ||
null,
};
});
}
},
}
}
</script>
<style lang="scss" scoped>
.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;
}
}
.required:before {
margin-right: 5px;
content: '*';
color: #f00;
}
</style>

636
src/views/dataBoard/overview/components/EventDispatchOrder/TransferService.vue

@ -0,0 +1,636 @@
<template>
<el-row class="tansfer">
<el-form ref="ref_form_demand" :inline="false" :model="formData" :rules="dataRule">
<el-form-item label="" label-width="0" prop="content">
<div class="items">
<div class="label required">服务内容</div>
<div class="value">
<el-input
v-model="formData.content"
:autosize="{ minRows: 2, maxRows: 10 }"
class="cell-width-area"
clearable
placeholder="请输入内容"
type="textarea"
/>
</div>
</div>
</el-form-item>
<el-col :span="12">
<el-form-item label="" prop="categoryCode">
<div class="items">
<div class="label required">服务类型</div>
<div class="value">
<el-cascader
v-model="formData.categoryCode"
:options="demandOptions"
class="cell-width-1"
clearable
@change="handleCateSlect"
/>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="" prop="wantServiceTime">
<div class="items">
<div class="label required">服务时间</div>
<div class="value">
<el-date-picker
v-model="formData.wantServiceTime"
class="cell-width-1"
clearable placeholder="选择日期时间"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
/>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="" prop="demandUserName">
<div class="items">
<div class="label required">需求人</div>
<div class="value">
<el-input v-model="formData.demandUserName" class="cell-width-1"/>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="" prop="demandUserMobile">
<div class="items">
<div class="label required">联系电话</div>
<div class="value">
<el-input v-model="formData.demandUserMobile" class="cell-width-1"/>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="" prop="serviceLocation" style="display: block">
<div class="items">
<div class="label required">服务地点</div>
<div class="value">
<el-input v-model="formData.serviceLocation" class="cell-width-1"/>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="" prop="longitude">
<div class="items">
<div class="label required">位置坐标</div>
<div class="value">
<!-- <div class="div_searchmap">
<el-input
v-model="keyWords"
class="cell-width-map"
maxlength="50"
placeholder="请输入关键字"
size="mini"
/>
<el-button size="mini" style="margin-left: 10px" type="primary" @click="handleSearchMap">
查询
</el-button>
</div>-->
<div id="app_map" style="width: 100%"></div>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="" prop="locationDetail">
<div class="items">
<div class="label">门牌号</div>
<div class="value">
<el-input v-model="formData.locationDetail" class="cell-width-1"/>
</div>
</div>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="" prop="serverId">
<div class="items">
<div class="label required">服务组织</div>
<div class="value serviceOrg">
<el-select
v-model="formData.serviceType"
class="cell-width-1"
clearable placeholder="请选择"
@change="handleServiceChange('add', $event)"
>
<el-option
v-for="item in serviceOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<div class="line">-</div>
<el-select
v-model="formData.serverId"
class="cell-width-1"
clearable
filterable
placeholder="请选择"
>
<el-option
v-for="item in serviceOptiondList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</div>
</div>
</el-form-item>
</el-col>
</el-form>
</el-row>
</template>
<script>
import {Loading} from "element-ui"; // Loading
import {requestPost} from "@/js/dai/request";
let loading; //
var map
var search
var markers
var infoWindowList
var geocoder //
function iniFmData() {
return {
operationType: '2',//[0: 1: 2:]
icEventId: '',//Id
gridId: '',//
categoryCode: '',//
parentCode: '',//
content: '',// 1000
reportType: 'community',// communitybuilding_caption;party;self_help
reportUserName: '',//
reportUserMobile: '',//
reportTime: '',//
demandUserId: '',// user.idic_resi_user.id
demandUserName: '',//
demandUserMobile: '',//
wantServiceTime: '',//
serviceType: '',
serverId: '',
locationDetail: '',
serviceLocation: '',//
latitude: '',//
longitude: '',//
// categoryId: ''
};
}
export default {
data() {
return {
btnDisable: false,
customerId: localStorage.getItem("customerId"),
demandOptions: [],
serviceOptions: [],
serviceOptiondList: [],
// casOptions: [],
iscascaderShow: 0,
// selCategoryArray: [],
// selCateObj: {},
// optionProps: {
// value: "id",
// label: "categoryName",
// children: "children",
// level: 'categoryType',
// checkStrictly: true
// },
formData: iniFmData(),
okflag: false,
//
keyWords: '',
eventDetailCopy: {}
};
},
components: {},
computed: {
dataRule() {
return {
content: [
{required: true, message: "服务内容不能为空", trigger: "blur"},
],
categoryCode: [
{required: true, message: "服务类型不能为空", trigger: "blur"},
],
wantServiceTime: [
{required: true, message: "服务时间不能为空", trigger: "blur"},
],
demandUserName: [
{required: true, message: "需求人不能为空", trigger: "blur"},
],
demandUserMobile: [
{required: true, message: "联系电话不能为空", trigger: "blur"},
],
serviceLocation: [
{required: true, message: "服务地点不能为空", trigger: "blur"},
],
serverId: [
{required: true, message: "服务组织不能为空", trigger: "blur"},
],
};
},
},
props: {
demandUserId: {
type: String,
default: "",
},
demandUserName: {
type: String,
default: "",
},
demandUserMobile: {
type: String,
default: "",
},
eventId: {
type: String,
default: "",
},
eventDetailData: {
type: Object,
default() {
return {}
}
},
transferObj: {
type: Object,
default() {
return {}
}
},
source: {//manage visiual
type: String,
default: 'manage'
}
},
watch: {
demandUserName: function (val) {
this.formData.reportUserName = val
this.formData.demandUserName = val
},
demandUserMobile: function (val) {
this.formData.reportUserMobile = val
this.formData.demandUserMobile = val
},
"transferObj.longitude": {
handler(newVal, oldVal) {
console.log(this.transferObj, 'transferObj')
this.$nextTick(() => {
var center = new window.TMap.LatLng(this.transferObj.latitude || 36.0722275, this.transferObj.longitude || 120.38945519)
map.setCenter(center)
})
},
immediate: true //
},
demandUserId: function (val) {
this.formData.demandUserId = val
},
formData: {
handler(val) {
this.$emit('change', val)
},
deep: true
}
},
created() {
},
async mounted() {
const {user} = this.$store.state
this.agencyId = user.agencyId
// this.getCategoryList();
console.log(this.eventId, this.eventDetailData, 'eventDetailDataeventDetailDataeventDetailDataeventDetailData')
if (this.eventId) {
this.eventDetailCopy = JSON.parse(JSON.stringify(this.eventDetailData));
this.formData.reportUserMobile = this.eventDetailCopy.mobile
this.formData.reportUserName = this.eventDetailCopy.name
this.formData.reportTime = this.eventDetailCopy.happenTime
this.formData.gridId = this.eventDetailCopy.gridId
this.formData.demandUserId = this.eventDetailCopy.reportUserId
this.formData.demandUserName = this.eventDetailCopy.name
this.formData.demandUserMobile = this.eventDetailCopy.mobile
} else {
this.formData.demandUserName = this.demandUserName
this.formData.demandUserMobile = this.demandUserMobile
this.formData.demandUserId = this.demandUserId
}
this.getDemandOptions();
this.getServiceOption()
this.initMap()
},
methods: {
async getDemandOptions() {
const url = "/governance/icresidemanddict/demandoption"
let params = {}
const {data, code, msg} = await requestPost(url, params)
if (code === 0) {
this.demandOptions = this.getFlagData(
this.getTreeData(data),
"usableFlag"
);
} else {
this.$message.error(msg)
}
},
async getServiceOption() {
const url = "/sys/dict/data/dictlist"
let params = {dictType: "user_demand_service_type",}
const {data, code, msg} = await requestPost(url, params)
if (code === 0) {
this.serviceOptions = data;
} else {
this.$message.error(msg)
}
},
getTreeData(data) {
if (!Array.isArray(data)) return [];
let arr = data.map((item) => {
let _item = {};
if (item.children) {
if (item.children.length === 0)
_item = {...item, children: undefined};
else _item = {...item, children: this.getTreeData(item.children)};
} else {
_item = {...item};
}
return _item;
});
return arr;
},
getFlagData(data, flag) {
if (!Array.isArray(data)) return [];
let arr1 = data.filter((item) => item[flag]);
let arr2 = arr1.map((item) => {
if (item.children)
return {...item, children: this.getFlagData(item.children, flag)};
else return item;
});
// console.log('arrr-oppp', arr2)
return arr2;
},
handleCateSlect(val) {
if (val.length === 1) {
this.demandOptions.forEach((item) => {
if (item.value == val[0]) this.formData.parentCode = item.pvalue;
});
this.formData.categoryCode = val[0];
} else {
this.formData.parentCode = val[0];
this.formData.categoryCode = val[1];
}
},
async handleServiceChange(serverOrgType, val) {
if (!val) return false;
if (this.formData.categoryCode == "") {
this.$message.error("请先选择服务类型!");
return;
}
const url = "/actual/base/serviceitem/listServerOrg";
let params = {
serviceTypeId: this.formData.categoryCode,
serverOrgType: val,
businessType: "resi_service",
};
let {data, code, msg} = await requestPost(url, params);
if (code == 0) {
this.serviceOptiondList = data;
} else if (code >= 8000) {
this.$message.error(msg);
}
},
async getServiceuserList(serviceType) {
if (!serviceType) return false;
const {demandUserId} = this.formData;
const params = {
serviceName: this.formData.categoryCode,
serviceType: serviceType,
queryPurpose: 'query',
};
const url = "/governance/userdemand/servicelist"
const {data, code, msg} = await requestPost(url, params)
if (code === 0) {
this.serviceOptiondList = data.filter(
(item) => item.value != demandUserId
);
} else {
this.$message.error(msg)
}
},
async getDemandInfo() {
this.okflag = false
this.$refs["ref_form_demand"].validate((valid, messageObj) => {
if (!valid) {
app.util.validateRule(messageObj);
// this.formData.categoryId = this.selCateObj.id
} else {
this.okflag = true
}
});
},
resetData() {
},
// init
initMap() {
//
console.log(this.transferObj, 'this.transferObjthis.transferObj')
var center = new window.TMap.LatLng(this.transferObj.latitude || 36.0722275, this.transferObj.longitude || 120.38945519)
// map TMap.Map()
map = new window.TMap.Map(document.getElementById('app_map'), {
center: center, //
zoom: 17.2, //
pitch: 43.5, //
rotation: 45 //
})
search = new window.TMap.service.Search({pageSize: 10})
//
markers = new TMap.MultiMarker({
map: map,
geometries: []
})
infoWindowList = Array(10)
geocoder = new TMap.service.Geocoder(); //
//
map.on('click', (e) => {
this.handleMoveCenter(e)
})
this.handleMoveCenter()
this.convert()
},
setMarker(lat, lng) {
markers.setGeometries([])
markers.add([
{
id: '4',
styleId: 'marker',
position: new TMap.LatLng(lat, lng),
properties: {
title: 'marker4'
}
}
])
},
handleSearchMap() {
infoWindowList.forEach((infoWindow) => {
infoWindow.close()
})
infoWindowList.length = 0
markers.setGeometries([])
//
search.searchRectangle({
keyword: this.keyWords,
bounds: map.getBounds()
}).then((result) => {
let {data} = result
if (Array.isArray(data) && data.length > 0) {
const {location: {lat, lng}} = data[0]
map.setCenter(new TMap.LatLng(lat, lng))
this.setMarker(lat, lng)
this.formData.latitude = lat
this.formData.longitude = lng
this.convert()
} else {
this.$message.error('未检索到相关位置坐标')
}
})
},
handleMoveCenter(e) {
//
const center = e.latLng;
const lat = center.getLat()
const lng = center.getLng()
this.formData.latitude = lat
this.formData.longitude = lng
this.setMarker(lat, lng)
this.convert(lat, lng)
},
convert(lat, lng) {
markers.setGeometries([]);
// var input = document.getElementById('location').value.split(',');
let location
if (lat && lng) {
location = new TMap.LatLng(lat, lng);
} else {
location = new TMap.LatLng(this.formData.latitude, this.formData.longitude);
}
// map.setCenter(location);
markers.updateGeometries([
{
id: 'main', //
position: location,
},
]);
//
geocoder.getAddress({location: location}).then((result) => {
this.formData.serviceLocation = result.result.address
//
});
},
//
startLoading() {
loading = Loading.service({
lock: true, //
text: "正在加载……", //
background: "rgba(0,0,0,.7)", //
});
},
//
endLoading() {
// clearTimeout(timer);
if (loading) {
loading.close();
}
},
},
};
</script>
<style lang='scss' scoped>
.tansfer {
.items {
font-size: 14px;
line-height: 34px;
position: relative;
display: flex;
align-items: flex-start;
margin-bottom: 17px;
.label {
width: 100px;
white-space: nowrap;
color: #9CB4D3;
}
.value {
color: #FFFFFF;
}
}
.required:before {
margin-right: 5px;
content: '*';
color: #f00;
}
.serviceOrg {
display: flex;
align-items: center;
}
/deep/ .el-input .el-input__inner {
width: 100% !important;
}
.cell-width-1 {
width: 100%;
}
.value {
width: calc(100% - 120px);
}
.cell-width-area {
width: 100% !important;
}
.line {
margin: 0 20px;
}
.div_searchmap {
position: static;
display: flex;
align-items: center;
}
.cell-width-map {
width: 100%;
}
}
</style>

380
src/views/dataBoard/overview/components/EventDispatchOrder/index.vue

@ -0,0 +1,380 @@
<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="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) => {
console.log(val, 'valvalval')
this.transferObj.latitude = val.lat
this.transferObj.longitude = val.lng
})
},
handleCancel() {
this.handleClose()
},
handleSure() {
console.log(this.form)
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>

2
src/views/dataBoard/overview/components/MapDialog/List12345.vue

@ -57,7 +57,7 @@ import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination
import CallPhone from "@/views/dataBoard/cpts/CallPhone";
import EventDetails from "@/views/dataBoard/overview/components/EventDetail.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder/index.vue";
export default {
name: "List12345",

2
src/views/dataBoard/overview/components/MapDialog/Njjwtqk.vue

@ -59,7 +59,7 @@
import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
import CallPhone from "@/views/dataBoard/cpts/CallPhone";
import EventDetails from "@/views/dataBoard/overview/components/EventDetail.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder/index.vue";
export default {
name: "Njjwtqk",

2
src/views/dataBoard/overview/dissatisfiedProblemNumber/12345Hotline.vue

@ -55,7 +55,7 @@ import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination
import Title from "@/views/dataBoard/satisfactionEval/components/Title";
import sjwjj from "@/views/dataBoard/overview/components/EventDetail.vue";
import CallPhone from '@/views/dataBoard/cpts/CallPhone.vue'
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder.vue";
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder/index.vue";
import { requestPost } from "@/js/dai/request";
export default {

Loading…
Cancel
Save