Browse Source

事件

master
dai 2 years ago
parent
commit
66606e999e
  1. 674
      src/assets/scss/modules/shequzhili/event-info.scss
  2. 98
      src/views/modules/shequzhili/event/cpts/add.vue
  3. 132
      src/views/modules/shequzhili/event/cpts/categoryArray.vue
  4. 897
      src/views/modules/shequzhili/event/cpts/edit.vue
  5. 1417
      src/views/modules/shequzhili/event/cpts/event-info.vue
  6. 625
      src/views/modules/shequzhili/event/cpts/process-form-replay.vue
  7. 479
      src/views/modules/shequzhili/event/cpts/process-form.vue
  8. 8
      src/views/modules/shequzhili/event/cpts/replyOptions.js
  9. 39
      src/views/modules/shequzhili/event/eventList.vue
  10. 2
      vue.config.js

674
src/assets/scss/modules/shequzhili/event-info.scss

@ -1,109 +1,104 @@
@import "../../c/config"; @import "../../c/config";
@import "../../c/function"; @import "../../c/function";
.g-add{ .g-add {
.g-add-page {
.g-add-page{
display: flex; display: flex;
.g-left { .g-left {
box-sizing: border-box; box-sizing: border-box;
width:40%; width: 40%;
padding: 5px 10px; padding: 5px 10px;
} }
.g-right { .g-right {
box-sizing: border-box; box-sizing: border-box;
width: 60%; width: 60%;
padding: 5px 10px; padding: 5px 10px;
} }
.form{ .form {
.cell-width-1{ .cell-width-1 {
width: 250px width: 250px;
} }
.avatar-uploader { .avatar-uploader {
margin: 0 0 0 20px; margin: 0 0 0 20px;
// /deep/ .el-upload--picture-card{ // /deep/ .el-upload--picture-card{
// width: 100px; // width: 100px;
// height: 100px; // height: 100px;
// } // }
// /deep/ .el-upload{ // /deep/ .el-upload{
// width: 100px; // width: 100px;
// height: 100px; // height: 100px;
// line-height: 100px; // line-height: 100px;
// } // }
// /deep/ .el-upload-list--picture-card .el-upload-list__item{ // /deep/ .el-upload-list--picture-card .el-upload-list__item{
// width: 100px; // width: 100px;
// height: 100px; // height: 100px;
// line-height: 100px; // line-height: 100px;
// } // }
// /deep/ .el-upload-list--picture-card .el-upload-list__item-thumbnail{ // /deep/ .el-upload-list--picture-card .el-upload-list__item-thumbnail{
// width: 100px; // width: 100px;
// height: 100px; // height: 100px;
// line-height: 100px; // line-height: 100px;
// } // }
// /deep/ .avatar{ // /deep/ .avatar{
// width: 100px; // width: 100px;
// height: 100px; // height: 100px;
// } // }
// /deep/ .el-upload-list__item-status-label { // /deep/ .el-upload-list__item-status-label {
// display: block; // display: block;
// position: absolute; // position: absolute;
// right: -15px; // right: -15px;
// top: -6px; // top: -6px;
// width: 40px; // width: 40px;
// height: 24px; // height: 24px;
// background: #13ce66; // background: #13ce66;
// text-align: center; // text-align: center;
// -webkit-transform: rotate(45deg); // -webkit-transform: rotate(45deg);
// transform: rotate(45deg); // transform: rotate(45deg);
// -webkit-box-shadow: 0 0 1pc 1px rgba(0, 0, 0, 0.2); // -webkit-box-shadow: 0 0 1pc 1px rgba(0, 0, 0, 0.2);
// box-shadow: 0 0 1pc 1px rgba(0, 0, 0, 0.2); // box-shadow: 0 0 1pc 1px rgba(0, 0, 0, 0.2);
// } // }
// /deep/ .el-upload-list__item-actions { // /deep/ .el-upload-list__item-actions {
// position: absolute; // position: absolute;
// width: 100%; // width: 100%;
// height: 100%; // height: 100%;
// left: 0; // left: 0;
// top: 0; // top: 0;
// cursor: default; // cursor: default;
// text-align: center; // text-align: center;
// color: #fff; // color: #fff;
// opacity: 0; // opacity: 0;
// font-size: 20px; // font-size: 20px;
// background-color: rgba(0, 0, 0, 0.5); // background-color: rgba(0, 0, 0, 0.5);
// -webkit-transition: opacity .3s; // -webkit-transition: opacity .3s;
// transition: opacity .3s; // transition: opacity .3s;
// } // }
} }
} }
} }
} }
.g-page { .g-page {
display: flex; display: flex;
width:100%; width: 100%;
.g-total{ .g-total {
width:100%; width: 100%;
} }
.g-left { .g-left {
box-sizing: border-box; box-sizing: border-box;
width: 55%; width: 55%;
padding: 5px 10px; padding: 5px 10px;
} }
.g-right { .g-right {
box-sizing: border-box; box-sizing: border-box;
width: 45%; width: 45%;
padding: 5px 10px; padding: 5px 10px;
} }
} }
.cell-width-area {
.cell-width-area{ width: 450px;
width: 450px
} }
.div_map { .div_map {
@ -116,8 +111,8 @@
left: 5px; left: 5px;
} }
.div-btn{ .div-btn {
margin-top:50px; margin-top: 50px;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -125,7 +120,7 @@
font-size: 14px; font-size: 14px;
padding: 8px 16px; padding: 8px 16px;
cursor: pointer; cursor: pointer;
color:#fff; color: #fff;
border: 1px dashed #0c81fe; border: 1px dashed #0c81fe;
border-radius: 6px; border-radius: 6px;
@ -136,14 +131,14 @@
margin-left: 20px; margin-left: 20px;
} }
} }
.cell-width-1{ .cell-width-1 {
width: 250px width: 250px;
} }
.cell-width-long{ .cell-width-long {
width: 450px width: 450px;
} }
.cell-width-2{ .cell-width-2 {
width: 300px width: 300px;
} }
.cell-width-map { .cell-width-map {
@ -154,8 +149,8 @@
width: 150px; width: 150px;
} }
.process-form{ .process-form {
margin-top:20px; margin-top: 20px;
.process-title { .process-title {
margin-bottom: 25px; margin-bottom: 25px;
@ -167,22 +162,20 @@
line-height: 18px; line-height: 18px;
} }
.process-title-vis{ .process-title-vis {
color: #fff; color: #fff;
} }
} }
.m-card { .m-card {
overflow-x: auto; overflow-x: auto;
} }
.m-btns { .m-btns {
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.m-info { .m-info {
padding-left: 30px; padding-left: 30px;
font-size: 14px; font-size: 14px;
@ -193,68 +186,67 @@
// width: 500px; // width: 500px;
.info-title { .info-title {
margin-top: 30px; margin-top: 30px;
font-size: 20px; font-size: 20px;
font-family: PingFang SC; font-family: PingFang SC;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
line-height: 30px; line-height: 30px;
} }
.info-content { .info-content {
margin: 20px 0; margin: 20px 0;
} }
.info-pics { .info-pics {
display: flex; display: flex;
margin: 20px 0; margin: 20px 0;
img { img {
display: block; display: block;
width: 32%; width: 32%;
height: 90px; height: 90px;
margin-right: 9px; margin-right: 9px;
object-fit: cover; object-fit: cover;
} }
} }
.info-prop { .info-prop {
position: relative; position: relative;
margin: 10px 0; margin: 10px 0;
display: flex; display: flex;
padding-left: 15px; padding-left: 15px;
.line{
text-decoration:underline;
color: #3e8ef7;
}
.line:hover{
cursor:pointer
}
.info-title-2 {
flex: 0 0 100px; .line {
font-size: 14px; text-decoration: underline;
} color: #3e8ef7;
}
.line:hover {
cursor: pointer;
}
.info-title-2 {
flex: 0 0 100px;
font-size: 14px;
}
> span, > span,
> div { > div {
display: block; display: block;
// max-width: 300px; // max-width: 300px;
} }
&::before { &::before {
content: ""; content: "";
display: block; display: block;
position: absolute; position: absolute;
top: 9px; top: 9px;
left: 0; left: 0;
width: 7px; width: 7px;
height: 7px; height: 7px;
background: #0c81fe; background: #0c81fe;
border-radius: 3px; border-radius: 3px;
margin-right: 10px; margin-right: 10px;
} }
} }
.info-prop-vis{ .info-prop-vis {
color:#fff; color: #fff;
} }
} }
@ -267,7 +259,7 @@
.m-row { .m-row {
// display: flex; // display: flex;
justify-content: space-between; justify-content: space-between;
width:100%; width: 100%;
} }
.m-hint { .m-hint {
@ -276,12 +268,12 @@
// 暂无数据 // 暂无数据
img { img {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
margin: auto; margin: auto;
} }
} }
@ -289,217 +281,225 @@
min-width: 400px; min-width: 400px;
.stat { .stat {
margin: 20px 0 10px; margin: 20px 0 10px;
display: flex; display: flex;
.stat-item { .stat-item {
width: 33%; width: 33%;
text-align: center; text-align: center;
div { div {
font-size: 17px; font-size: 17px;
font-family: Source Han Serif SC; font-family: Source Han Serif SC;
font-weight: 500; font-weight: 500;
color: rgba(#000, 0.5); color: rgba(#000, 0.5);
line-height: 24px; line-height: 24px;
&.z-weak { &.z-weak {
font-size: 12px; font-size: 12px;
font-family: Source Han Serif SC; font-family: Source Han Serif SC;
font-weight: 500; font-weight: 500;
color: rgba(#000, 0.5); color: rgba(#000, 0.5);
line-height: 24px; line-height: 24px;
} }
}
} }
}
} }
} }
.m-process { .m-process {
margin-top: 30px; margin-top: 30px;
margin-left: 15px; margin-left: 15px;
width: 400px; width: 400px;
.process-title { .process-title {
margin-bottom: 25px; margin-bottom: 25px;
margin-left: -5px; margin-left: -5px;
font-size: 16px; font-size: 16px;
font-family: PingFang SC; font-family: PingFang SC;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
line-height: 18px; line-height: 18px;
} }
.process-title-vis{ .process-title-vis {
color: #fff; color: #fff;
}
.list {
position: relative;
box-sizing: border-box;
margin-top: 30px/2;
margin-left: 50px/2;
padding: 0 0 0 30px/2;
width: 680px/2;
border-left: 3px solid #0c81fe;
padding-right: 10px;
&::before {
content: "";
position: absolute;
z-index: 1;
display: block;
top: -2px/2;
left: -2px/2;
width: 5px/2;
height: 20px/2;
background-color: #333;
} }
.list { .item {
position: relative; position: relative;
box-sizing: border-box; z-index: 2;
margin-top: 30px/2; margin-bottom: 8px;
margin-left: 50px/2; padding-bottom: 8px;
padding: 0 0 0 30px/2; font-size: 16px;
width: 680px/2; font-family: PingFang SC;
border-left: 3px solid #0c81fe; font-weight: 400;
padding-right: 10px; color: #333;
line-height: 24px;
padding-left: 20px;
padding-top: 1px;
&::before {
content: "";
display: block;
position: absolute;
top: -5px;
left: -11px;
width: 18px;
height: 18px;
background: #0c81fe;
border: 4px solid lighten(#0c81fe, 15);
border-radius: 100%;
}
&.z-on {
&::before { &::before {
content: ""; background: #e08400;
position: absolute; border-color: lighten(#e08400, 15);
z-index: 1;
display: block;
top: -2px/2;
left: -2px/2;
width: 5px/2;
height: 20px/2;
background-color: #333;
} }
}
.item { &:last-child {
position: relative; margin-bottom: 0;
z-index: 2; padding-bottom: 0;
margin-bottom: 8px; border-bottom: none;
padding-bottom: 8px; }
font-size: 16px;
font-family: PingFang SC; .item-row {
font-weight: 400; margin-top: -10px;
color: #333; margin-bottom: 10px;
line-height: 24px; display: flex;
padding-left: 20px; }
padding-top: 1px;
.name {
&::before { position: relative;
content: ""; padding: 0 10px;
display: block; font-size: 12px;
position: absolute; font-family: PingFang SC;
top: -5px; font-weight: 500;
left: -11px; color: #fff;
width: 18px; line-height: 22px;
height: 18px; height: 22px;
background: #0c81fe; border-radius: 10px 0 10px 0;
border: 4px solid lighten(#0c81fe, 15); background-color: #0c81fe;
border-radius: 100%; // background-color: #e08400;
} }
&.z-on { .date {
&::before { margin-left: 10px;
background: #e08400; font-size: 12px;
border-color: lighten(#e08400, 15); font-family: PingFang SC;
} font-weight: 500;
} color: #7ca1d2;
line-height: 25px;
&:last-child { }
margin-bottom: 0;
padding-bottom: 0; .btn {
border-bottom: none; margin-left: 30px;
} color: #999;
font-size: 12px;
.item-row {
margin-top: -10px; &:hover {
margin-bottom: 10px; color: #39e;
display: flex; cursor: pointer;
}
.name {
position: relative;
padding: 0 10px;
font-size: 12px;
font-family: PingFang SC;
font-weight: 500;
color: #fff;
line-height: 22px;
height: 22px;
border-radius: 10px 0 10px 0;
background-color: #0c81fe;
// background-color: #e08400;
}
.date {
margin-left: 10px;
font-size: 12px;
font-family: PingFang SC;
font-weight: 500;
color: #7ca1d2;
line-height: 25px;
}
.detail {
@include cs;
font-size: 14px;
line-height: 20px;
margin-bottom: 5px;
display: flex;
.detail-field {
flex:0 0 100px;
text-align: justify;
text-align-last: justify;
}
.detail-value {
// width: 78%;
.detail-link {
display: inline;
}
}
}
.attachement-list {
padding-left: 80px;
a {
display: block;
cursor: pointer;
color: #4df0ff;
font-size: 14px;
i {
color: #333;
}
}
}
} }
}
.item-vis{ .detail {
color:#fff @include cs;
font-size: 14px;
line-height: 20px;
margin-bottom: 5px;
display: flex;
.detail-field {
flex: 0 0 100px;
text-align: justify;
text-align-last: justify;
}
.detail-value {
// width: 78%;
.detail-link {
display: inline;
}
} }
}
.attachement-list {
padding-left: 80px;
a {
display: block;
cursor: pointer;
color: #4df0ff;
font-size: 14px;
i {
color: #333;
}
}
}
}
.item-vis {
color: #fff;
} }
}
} }
.m-top { .m-top {
display: flex; display: flex;
} }
.m-chart { .m-chart {
min-height: 200px; min-height: 200px;
} }
.div-satisfy{ .div-satisfy {
padding:10px 0 0; padding: 10px 0 0;
display:flex ; display: flex;
justify-content: flex-start; justify-content: flex-start;
text-align: center; text-align: center;
>div{ > div {
margin-left:50px; margin-left: 50px;
} }
img{ img {
width:80px; width: 80px;
height:80px; height: 80px;
} }
.tip-satisfy{ .tip-satisfy {
text-align: center; text-align: center;
margin-top:10px margin-top: 10px;
} }
} }
.box-card {
.box-card{
padding: 0px; padding: 0px;
border: 0px solid #EBEEF5; border: 0px solid #ebeef5;
background-color:transparent; background-color: transparent;
-webkit-box-shadow:none; -webkit-box-shadow: none;
box-shadow:none box-shadow: none;
} }
.form-item::v-deep .el-form-item__label { .form-item::v-deep .el-form-item__label {
@ -519,6 +519,4 @@
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
width: 250px; width: 250px;
} }

98
src/views/modules/shequzhili/event/cpts/add.vue

@ -82,21 +82,46 @@
v-model="formData.idCard" v-model="formData.idCard"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item
label="响应级别"
label-width="150px"
prop="eventType"
>
<el-select
v-model="formData.eventType"
placeholder="请选择"
size="small"
clearable
class="cell-width-1"
>
<el-option
v-for="item in eventTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item <el-form-item
label="事件分类" label="事件分类"
label-width="150px" label-width="150px"
:class="{ 'form-item': source === 'visiual' }" :class="{ 'form-item': source === 'visiual' }"
prop="categoryList"> prop="categoryList"
<div :class="{ 'visiual-form': source === 'visiual'}"> >
<categoryArray <div :class="{ 'visiual-form': source === 'visiual' }">
v-model="formData.categoryList" <categoryArray
:casOptions="casOptions" v-model="formData.categoryList"
:props="optionProps" :casOptions="casOptions"
:optionProps="optionProps" :props="optionProps"
@handleChangeCate="handleChangeCate" :optionProps="optionProps"
></categoryArray> @handleChangeCate="handleChangeCate"
></categoryArray>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item <el-form-item
label="反应渠道" label="反应渠道"
label-width="150px" label-width="150px"
@ -312,7 +337,7 @@ import { requestPost } from "@/js/dai/request";
import formVltHelper from "dai-js/tools/formVltHelper"; import formVltHelper from "dai-js/tools/formVltHelper";
import daiMap from "@/utils/dai-map"; import daiMap from "@/utils/dai-map";
import { isCard } from "@/utils/validate"; import { isCard } from "@/utils/validate";
import categoryArray from "./categoryArray.vue" import categoryArray from "./categoryArray.vue";
let loading; // let loading; //
var map; var map;
@ -332,10 +357,13 @@ function iniFmData() {
happenTime: "", // happenTime: "", //
eventContent: "", // eventContent: "", //
imageList: [], // imageList: [], //
categoryList: [],// categoryList: [], //
address: "", // address: "", //
latitude: "", // latitude: "", //
longitude: "", // longitude: "", //
//
eventType: "",
}; };
} }
@ -343,6 +371,7 @@ export default {
data() { data() {
return { return {
formType: "add", // addeditdetail formType: "add", // addeditdetail
searchOptions: [], searchOptions: [],
searchValue: "", searchValue: "",
resultList: [], resultList: [],
@ -357,7 +386,7 @@ export default {
// oss/file/uploadvariedfile // oss/file/uploadvariedfile
dialogImageUrl: "oss/file/uploadvariedfile", dialogImageUrl: "oss/file/uploadvariedfile",
uploadUlr: uploadUlr:
window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile", window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile",
// upload_url: '', // URL // upload_url: '', // URL
upload_name: "", // upload_name: "", //
replayImgList: [], replayImgList: [],
@ -371,7 +400,7 @@ export default {
selPersonIndex: "", selPersonIndex: "",
selPerson: {}, selPerson: {},
demandUserList: [], demandUserList: [],
casOptions:[], casOptions: [],
optionProps: { optionProps: {
multiple: false, multiple: false,
value: "id", value: "id",
@ -379,10 +408,24 @@ export default {
children: "subCategory", children: "subCategory",
}, },
hideUploadBtn: false, hideUploadBtn: false,
eventTypeOptions: [
{
label: "红灯事件",
value: 1,
},
{
label: "黄灯事件",
value: 2,
},
{
label: "蓝灯事件",
value: 3,
},
],
}; };
}, },
components: { components: {
categoryArray categoryArray,
}, },
computed: { computed: {
dataRule() { dataRule() {
@ -419,13 +462,20 @@ export default {
trigger: "blur", trigger: "blur",
}, },
], ],
categoryList:[ categoryList: [
{ {
required: true, required: true,
message: "事件分类不能为空", message: "事件分类不能为空",
trigger: "blur", trigger: "blur",
}, },
], ],
eventType: [
{
required: true,
message: "响应级别不能为空",
trigger: "blur",
},
],
sourceType: [ sourceType: [
{ {
required: true, required: true,
@ -465,10 +515,11 @@ export default {
}, },
}, },
props: { props: {
source: {//manage visiual source: {
//manage visiual
type: String, type: String,
default: 'manage' default: "manage",
} },
}, },
watch: { watch: {
"formData.name": function (val) { "formData.name": function (val) {
@ -508,14 +559,11 @@ export default {
methods: { methods: {
handleChangeCate(obj) { handleChangeCate(obj) {
this.selCateObj = obj this.selCateObj = obj;
this.formData.categoryList = []; this.formData.categoryList = [];
let flag = JSON.stringify(obj) == '{}' let flag = JSON.stringify(obj) == "{}";
if(flag) if (flag) this.formData.categoryList = [];
this.formData.categoryList = [] else this.formData.categoryList.push(this.selCateObj);
else
this.formData.categoryList.push(this.selCateObj);
}, },
async handleShowPersonList() { async handleShowPersonList() {
if (this.formData.gridId) { if (this.formData.gridId) {

132
src/views/modules/shequzhili/event/cpts/categoryArray.vue

@ -1,62 +1,78 @@
<template> <template>
<div> <div>
<el-form :model="form" > <el-form :model="form">
<el-form-item> <el-form-item>
<el-cascader class="cell-width-2" <el-cascader
ref="myCascader" class="cell-width-2"
v-model="form.selCategoryArray" ref="myCascader"
:key="iscascaderShow" v-model="form.selCategoryArray"
:options="casOptions" :key="iscascaderShow"
:props="optionProps" :options="casOptions"
:show-all-levels="false" :props="optionProps"
clearable :show-all-levels="false"
@change="handleChangeCate"></el-cascader> clearable
</el-form-item> @change="handleChangeCate"
</el-form> ></el-cascader>
</div> </el-form-item>
</template> </el-form>
</div>
</template>
<script> <script>
export default { export default {
data() { data() {
return { return {
form:{ form: {
selCategoryArray:{} selCategoryArray: "",
}, },
selCateObj:{}, selCateObj: {},
iscascaderShow:0 iscascaderShow: 0,
}; };
}, },
props:{ props: {
casOptions:{ casOptions: {
type:Array, type: Array,
default:()=>[] default: () => [],
}, },
optionProps:{ optionProps: {
type:Object, type: Object,
default:()=>{} default: () => {},
} },
}, iniValue: String,
created() {}, },
methods: { components: {},
handleChangeCate(){ computed: {},
if(this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0]){ watch: {
this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0].data iniValue(val) {
}else{ // console.log('watch iniValue', val)
this.selCateObj = {} if (val) {
} this.form.selCategoryArray = val;
}
},
},
mounted() {
++this.iscascaderShow;
if (this.iniValue) {
// console.log('mounted iniValue', this.iniValue)
this.form.selCategoryArray = this.iniValue;
}
},
methods: {
handleChangeCate() {
let nodes = this.$refs["myCascader"].getCheckedNodes();
if (nodes && nodes.length > 0) {
this.selCateObj =
this.$refs["myCascader"].getCheckedNodes()[0].data;
} else {
this.selCateObj = {};
}
this.$emit('handleChangeCate',this.selCateObj) // console.log(nodes, this.form.selCategoryArray);
}
},
mounted(){
++this.iscascaderShow;
},
components: {},
computed: {},
watch: {},
};
</script>
<style lang="scss" scoped>
</style>> this.$emit("handleChangeCate", this.selCateObj);
},
},
};
</script>
<style lang="scss" scoped></style>
>

897
src/views/modules/shequzhili/event/cpts/edit.vue

@ -0,0 +1,897 @@
<template>
<div class="g-add">
<div class="g-add-page">
<div class="g-left">
<el-form
ref="ref_form1"
:inline="true"
:model="formData"
:rules="dataRule"
class="form"
>
<el-form-item
label="所属网格 "
prop="gridId"
label-width="150px"
style="display: block"
>
<el-select
v-model.trim="formData.gridId"
placeholder="请选择"
clearable
class="cell-width-1"
>
<el-option
v-for="item in gridList"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label="报事人"
prop="name"
label-width="150px"
style="display: block"
>
<el-input
class="cell-width-1"
maxlength="10"
placeholder="请输入报事人姓名"
v-model="formData.name"
>
</el-input>
<div>
<el-button
style="margin-top: 10px"
type="primary"
size="mini"
@click="handleShowPersonList"
>居民信息中选择</el-button
>
</div>
</el-form-item>
<el-form-item
label="手机号"
prop="mobile"
label-width="150px"
style="display: block"
>
<el-input
class="cell-width-1"
maxlength="30"
placeholder="请输入手机号 "
v-model="formData.mobile"
>
</el-input>
</el-form-item>
<el-form-item
label="身份证号"
prop="idCard"
label-width="150px"
style="display: block"
>
<el-input
class="cell-width-1"
maxlength="30"
placeholder="请输入身份证号"
v-model="formData.idCard"
></el-input>
</el-form-item>
<el-form-item
label="响应级别"
label-width="150px"
prop="eventType"
>
<el-select
v-model="formData.eventType"
placeholder="请选择"
size="small"
clearable
class="cell-width-1"
>
<el-option
v-for="item in eventTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label="事件分类"
label-width="150px"
:class="{ 'form-item': source === 'visiual' }"
prop="categoryList"
>
<div :class="{ 'visiual-form': source === 'visiual' }">
<categoryArray
:ini-value="formData.iniCategoryId"
v-model="formData.categoryList"
:casOptions="casOptions"
:props="optionProps"
:optionProps="optionProps"
@handleChangeCate="handleChangeCate"
></categoryArray>
</div>
</el-form-item>
<el-form-item
label="反应渠道"
label-width="150px"
prop="sourceType"
>
<el-select
v-model="formData.sourceType"
placeholder="请选择"
size="small"
clearable
class="cell-width-1"
>
<el-option
v-for="item in qudaoArray"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label="发生时间"
prop="happenTime"
label-width="150px"
style="display: block"
>
<el-date-picker
v-model="formData.happenTime"
class="cell-width-1"
type="datetime"
placeholder="发生时间"
value-format="yyyy-MM-dd HH:mm:ss"
>
</el-date-picker>
</el-form-item>
<el-form-item
label="事件内容"
prop="eventContent"
label-width="150px"
style="display: block"
>
<el-input
class="cell-width-2"
type="textarea"
maxlength="500"
show-word-limit
:rows="5"
placeholder="请输入事件内容,不超过500字"
v-model="formData.eventContent"
></el-input>
</el-form-item>
</el-form>
</div>
<div class="g-right">
<el-form
ref="ref_form2"
:inline="true"
:model="formData"
:rules="dataRule"
class="form"
>
<el-form-item
label="图片"
label-width="150px"
style="display: block"
>
<el-upload
:headers="$getElUploadHeaders()"
:class="[
'avatar-uploader',
{ hide: hideUploadBtn },
]"
ref="uploadPic"
:action="uploadUlr"
list-type="picture-card"
:on-exceed="exceedPic"
:on-remove="removePic"
:file-list="replayImgList"
:on-change="handleEditChange"
:on-success="handleSuccess"
:limit="3"
>
<span class="font-14">选择图片</span>
<div slot="tip" class="upload_tip">
最多上传3张图片图片支持jpgjpegbmpgit或png格式
</div>
</el-upload>
</el-form-item>
<el-form-item
label="地图位置"
prop="longitude"
label-width="150px"
style="display: block"
>
<div style="width: 500px">
<el-select
v-model="searchValue"
filterable
style="width: 500px"
remote
:reserve-keyword="true"
placeholder="请输入关键词"
:remote-method="remoteMethod"
:loading="loading"
>
<el-option
v-for="(item, index) in searchOptions"
@click.native="handleClickKey(index)"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<div id="app_event" class="div_map"></div>
</div>
</el-form-item>
<el-form-item
label="详细地址"
prop="address"
label-width="150px"
style="display: block"
>
<el-input
class="cell-width-1"
v-model="formData.address"
>
</el-input>
</el-form-item>
</el-form>
</div>
</div>
<!-- 新增弹出框 -->
<el-dialog
:visible.sync="personTableShow"
:close-on-click-modal="false"
:close-on-press-escape="false"
:destroy-on-close="true"
title="选择居民"
width="550px"
top="5vh"
class="dialog-h"
@closed="diaClose"
>
<div style="padding: 10px 30px">
<el-form
:inline="false"
ref="ref_formSearch"
:label-width="'90px'"
>
<el-form-item label="所属网格" label-width="150px">
<el-select
class="cell-width-1"
v-model.trim="selGridId"
placeholder="请选择"
clearable
>
<el-option
v-for="item in gridList"
@click.native="handleChangeGrid"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label="居民"
label-width="150px"
prop="selPersonIndex"
>
<el-select
v-model="selPersonIndex"
class="cell-width-1"
filterable
placeholder="请选择"
clearable
>
<el-option
v-for="(item, index) in demandUserList"
:key="item.demandUserId"
:label="item.label"
:value="index"
>
</el-option>
</el-select>
</el-form-item>
</el-form>
<div class="div-btn">
<el-button
style="margin-left: 20px"
type="primary"
size="small"
@click="handleComfirmSelPerson"
>确定</el-button
>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import { Loading } from "element-ui"; // Loading
import { requestPost } from "@/js/dai/request";
import formVltHelper from "dai-js/tools/formVltHelper";
import daiMap from "@/utils/dai-map";
import { isCard } from "@/utils/validate";
import categoryArray from "./categoryArray.vue";
let loading; //
var map;
var search;
var markers;
var infoWindowList;
var geocoder; //
function iniFmData() {
return {
gridId: "", //
reportUserId: "", // ID
name: "", //
mobile: "", //
idCard: "", //
sourceType: "", //
happenTime: "", //
eventContent: "", //
imageList: [], //
categoryList: [], //
address: "", //
latitude: "", //
longitude: "", //
//
eventType: "",
};
}
export default {
data() {
return {
formType: "edit", // addeditdetail
searchOptions: [],
searchValue: "",
resultList: [],
loading: false,
btnDisable: false,
gridList: [], //list--
qudaoArray: [],
formData: iniFmData(),
//
keyWords: "",
isFirst: true, //
// oss/file/uploadvariedfile
dialogImageUrl: "oss/file/uploadvariedfile",
uploadUlr:
window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile",
// upload_url: '', // URL
upload_name: "", //
replayImgList: [],
okflag: false,
formDataSearch: {
gridId: "",
name: "",
},
personTableShow: false,
selGridId: "",
selPersonIndex: "",
selPerson: {},
demandUserList: [],
casOptions: [],
optionProps: {
multiple: false,
value: "id",
label: "name",
children: "subCategory",
checkStrictly: true,
emitPath: false,
},
hideUploadBtn: false,
eventTypeOptions: [
{
label: "红灯事件",
value: 1,
},
{
label: "黄灯事件",
value: 2,
},
{
label: "蓝灯事件",
value: 3,
},
],
};
},
components: {
categoryArray,
},
computed: {
dataRule() {
let checkIdCard = (rule, value, callback) => {
if (value === "") {
callback(new Error("请输入身份证"));
} else {
if (!isCard(value)) {
callback(new Error("身份证号格式不正确"));
}
callback();
}
};
return {
gridId: [
{
required: true,
message: "所属网格不能为空",
trigger: "blur",
},
],
name: [
{
required: true,
message: "报事人不能为空",
trigger: "blur",
},
],
mobile: [
{
required: true,
message: "手机号不能为空",
trigger: "blur",
},
],
categoryList: [
{
required: true,
message: "事件分类不能为空",
trigger: "blur",
},
],
eventType: [
{
required: true,
message: "响应级别不能为空",
trigger: "blur",
},
],
sourceType: [
{
required: true,
message: "反映渠道不能为空",
trigger: "blur",
},
],
eventContent: [
{
required: true,
message: "事件内容不能为空",
trigger: "blur",
},
],
happenTime: [
{
required: true,
message: "发生时间不能为空",
trigger: "blur",
},
],
address: [
{
required: true,
message: "事件地址不能为空",
trigger: "blur",
},
],
longitude: [
{
required: true,
message: "坐标位置不能为空",
trigger: "blur",
},
],
};
},
},
props: {
source: {
//manage visiual
type: String,
default: "manage",
},
eventId: String,
eventDetailData: Object,
},
watch: {
"formData.name": function (val) {
this.$emit("changeName", val);
},
"formData.mobile": function (val) {
this.$emit("changeMobile", val);
},
"formData.reportUserId": function (val) {
this.$emit("changeUserId", val);
},
"formData.gridId": function (val) {
this.selGridId = val;
this.$emit("changeGridId", val);
},
eventDetailData(obj) {
this.syncDetail(obj);
},
},
async created() {
const { user } = this.$store.state;
this.agencyId = user.agencyId;
this.syncDetail();
this.loadGrid();
this.getCategoryList();
this.getQudaoOptions();
},
async mounted() {
this.initMap(this.formData.latitude, this.formData.longitude);
},
methods: {
syncDetail() {
const { eventDetailData: info } = this;
let obj = {
gridId: info.gridId, //
reportUserId: info.reportUserId, // ID
name: info.name, //
mobile: info.mobile, //
idCard: info.idCard, //
sourceType: info.sourceType, //
happenTime: info.happenTime, //
eventContent: info.eventContent, //
imageList: info.imageList || [], //
categoryList: [info.categoryId], //
iniCategoryId: info.categoryId, //
address: info.address, //
latitude: info.latitude, //
longitude: info.longitude, //
//
eventType: info.eventType,
};
this.formData = { ...this.formData, ...obj };
console.log("=syncDetail", this.formData);
},
handleChangeCate(obj) {
this.selCateObj = obj;
this.formData.categoryList = [];
let flag = JSON.stringify(obj) == "{}";
if (flag) this.formData.categoryList = [];
else this.formData.categoryList.push(this.selCateObj);
},
async handleShowPersonList() {
if (this.formData.gridId) {
await this.handleChangeGrid();
this.personTableShow = true;
} else {
this.$message.info("请先选择网格");
}
},
diaClose() {
this.personTableShow = false;
},
handleComfirmSelPerson() {
if (this.selPersonIndex === 0 || this.selPersonIndex) {
let selPerson = this.demandUserList[this.selPersonIndex];
this.formData.name = selPerson.demandUserName;
this.formData.mobile = selPerson.demandUserMobile;
this.formData.reportUserId = selPerson.demandUserId;
this.formData.idCard = selPerson.idCard;
this.personTableShow = false;
} else {
this.$message.info("请选择人员");
}
},
async handleChangeGrid() {
const url = "/epmetuser/icresiuser/demandusers";
// const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/epidemicPrevention/page"
let params = {
agencyId: "",
gridId: this.selGridId,
name: "",
};
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
this.demandUserList = data;
} else {
this.$message.error(msg);
}
this.tableLoading = false;
},
async loadGrid() {
const url = "/gov/org/customergrid/gridoption";
let params = {
agencyId: this.agencyId,
purpose: "addorupdate",
};
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
this.gridList = data;
} else {
this.$message.error(msg);
}
},
async getCategoryList() {
const url = "/gov/issue/issueprojectcategorydict/list";
let params = {};
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
let treeDataNew = this.filterTree(data);
++this.iscascaderShow;
this.casOptions = [];
this.selCategoryArray = [];
this.casOptions = treeDataNew;
} else {
this.$message.error(msg);
}
},
async getQudaoOptions() {
const url = "/sys/dict/data/dictlist";
const { data, code, msg } = await requestPost(url, {
dictType: "ic_event_source_type",
});
if (code === 0) {
this.qudaoArray = data;
} else {
this.$message.error(msg);
}
},
//
filterTree(arr) {
let childs = arr;
for (let i = childs.length; i--; i > 0) {
if (childs[i].subCategory) {
if (childs[i].subCategory.length) {
this.filterTree(childs[i].subCategory);
} else {
delete childs[i].subCategory;
}
}
}
return arr;
},
handleChangeAgency(value) {
// this.agencyName = this.$refs["myCascader"].getCheckedNodes()[0].label
// this.orgId = this.selCategoryArray.length > 0 ? this.selCategoryArray[this.selCategoryArray.length - 1] : ''
},
async getEventInfo() {
this.okflag = false;
this.$refs["ref_form1"].validate((valid, messageObj) => {
if (!valid) {
app.util.validateRule(messageObj);
return false;
} else {
this.$refs["ref_form2"].validate((valid, messageObj) => {
if (!valid) {
app.util.validateRule(messageObj);
return false;
} else {
if (
!formVltHelper.userOrMobile(
this.formData.mobile
)
) {
this.$message({
type: "error",
message: "手机号格式有误",
});
return false;
}
const regCard = /(^\d{15}$)|(^\d{17}(\d|X)$)/; //1518151817X
if (
this.formData.idCard &&
regCard.test(this.formData.idCard) === false
) {
this.$message({
type: "warning",
message: "请输入正确的身份证号码",
});
return false;
}
this.okflag = true;
}
});
}
});
},
removePic(file, fileList) {
this.formData.imageList.splice(
this.formData.imageList.findIndex((item) => item === file.url),
1
);
this.replayImgList.splice(
this.replayImgList.findIndex((item) => item.uid === file.uid),
1
);
this.hideUploadBtn = fileList.length >= 3;
},
// 3
handleEditChange(file, fileList) {
this.hideUploadBtn = fileList.length >= 3;
},
exceedPic() {
this.$message.warning("最多上传3张预览图片");
},
handleSuccess(response, file, fileList) {
this.replayImgList.push(file);
this.formData.imageList.push(response.data.url);
},
// init
initMap(latitude, longitude) {
map = new daiMap(
document.getElementById("app_event"),
{ latitude, longitude },
{
zoom: 16.2, //
pitch: 43.5, //
rotation: 45, //
}
);
//
map.on("dragend", (e) => {
this.handleMoveCenter(e);
});
map.setCenter(latitude, longitude);
map.setMarker(latitude, longitude);
},
async handleMoveCenter() {
//
const { lat, lng } = map.getCenter();
this.formData.latitude = lat;
this.formData.longitude = lng;
map.setMarker(lat, lng);
let { msg, data } = await map.getAddress(lat, lng);
if (msg == "success") {
this.formData.address = data.address;
this.searchValue = data.address;
this.searchOptions = [];
}
},
async remoteMethod(query) {
if (query !== "") {
this.loading = true;
const { msg, data } = await map.searchNearby(query);
this.loading = false;
this.resultList = [];
if (
msg == "success" &&
data.resultList &&
data.resultList.length > 0
) {
if (data.resultList && data.resultList.length > 0) {
this.resultList = data.resultList;
this.searchOptions = this.resultList.map((item) => {
return {
value: `${item.hotPointID}`,
label: `${item.address + item.name}`,
};
});
}
} else {
this.searchOptions = [
{
value: "0",
label: "未检索到结果",
},
];
}
} else {
this.searchOptions = [];
}
},
handleClickKey(index) {
let selPosition = this.resultList[index];
let lonlat = selPosition.lonlat.split(" ");
map.setCenter(lonlat[1], lonlat[0]);
map.setMarker(lonlat[1], lonlat[0]);
this.formData.latitude = lonlat[1];
this.formData.longitude = lonlat[0];
this.formData.address = selPosition.address + selPosition.name;
},
resetData() {
this.formData = iniFmData();
this.replayImgList = [];
this.searchValue = "";
this.searchOptions = [];
this.resultList = [];
},
//
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>
@import "@/assets/scss/modules/shequzhili/event-info.scss";
.item_width_4 {
width: 350px;
}
.div_map {
margin-top: 10px;
}
</style>
<style lang="scss">
.el-dialog__body {
padding: 0 10px 20px !important;
}
.hide {
.el-upload--picture-card {
display: none !important;
}
}
</style>

1417
src/views/modules/shequzhili/event/cpts/event-info.vue

File diff suppressed because it is too large

625
src/views/modules/shequzhili/event/cpts/process-form-replay.vue

@ -1,11 +1,12 @@
<template> <template>
<div class="search"> <div class="search">
<el-form
<el-form ref="ref_form1" ref="ref_form1"
:inline="false" :inline="false"
:model="formData" :model="formData"
:rules="dataRule"> :rules="dataRule"
<!-- <el-form-item label="事件分类" >
<!-- <el-form-item label="事件分类"
label-width="150px" label-width="150px"
:class="{'form-item':source==='visiual'}" :class="{'form-item':source==='visiual'}"
prop="categoryList"> prop="categoryList">
@ -20,92 +21,109 @@
@change="handleChangeCate"></el-cascader> @change="handleChangeCate"></el-cascader>
</div> </div>
</el-form-item> --> </el-form-item> -->
<!-- 0上报 1阅收 3完结 4审核 5事件评价 6结案归档--> <!-- 0上报 1阅收 3完结 4审核 5事件评价 6结案归档-->
<el-form-item label="办理状态" <el-form-item
prop="manageStatus" label="办理状态"
label-width="150px" prop="manageStatus"
:class="{'form-item':source==='visiual'}" label-width="150px"
style="display: block"> :class="{ 'form-item': source === 'visiual' }"
<div :class="{'visiual-form':source==='visiual'}"> style="display: block"
<el-select v-model="formData.manageStatus" placeholder="请选择办理状态"> >
<el-option <div :class="{ 'visiual-form': source === 'visiual' }">
v-for="item in statusOption" <el-select
:label="item.label" v-model="formData.manageStatus"
:value="item.value" placeholder="请选择办理状态"
clearable
:key="item.value">
</el-option>
</el-select>
</div>
</el-form-item>
<el-form-item
label="办理时间"
prop="manageTime"
label-width="150px"
style="display: block"
> >
<el-date-picker <el-option
v-model="formData.manageTime" v-for="item in statusOption"
class="cell-width-1" :label="item.label"
type="datetime" :value="item.value"
placeholder="办理时间" clearable
value-format="yyyy-MM-dd HH:mm:ss" :key="item.value"
> >
</el-date-picker> </el-option>
</el-form-item> </el-select>
<el-form-item label="办理人" </div>
prop="manageResi" </el-form-item>
label-width="150px" <el-form-item
:class="{'form-item':source==='visiual'}" label="办理时间"
style="display: block"> prop="manageTime"
<div :class="{'visiual-form':source==='visiual'}"> label-width="150px"
<el-input class="cell-width-area" style="display: block"
placeholder="请输入办理人" >
v-model="formData.manageResi"></el-input> <el-date-picker
</div> v-model="formData.manageTime"
class="cell-width-1"
</el-form-item> type="datetime"
<el-form-item label="办理人电话" placeholder="办理时间"
prop="manageResiTel" value-format="yyyy-MM-dd HH:mm:ss"
label-width="150px" >
:class="{'form-item':source==='visiual'}" </el-date-picker>
style="display: block"> </el-form-item>
<div :class="{'visiual-form':source==='visiual'}"> <el-form-item
<el-input class="cell-width-area" label="办理人"
placeholder="请输入办理人" prop="manageResi"
v-model="formData.manageResiTel"></el-input> label-width="150px"
</div> :class="{ 'form-item': source === 'visiual' }"
style="display: block"
</el-form-item> >
<el-form-item label="办理意见" <div :class="{ 'visiual-form': source === 'visiual' }">
prop="content" <el-input
label-width="150px" class="cell-width-area"
:class="{'form-item':source==='visiual'}" placeholder="请输入办理人"
style="display: block"> v-model="formData.manageResi"
<div :class="{'visiual-form':source==='visiual'}"> ></el-input>
<el-input class="cell-width-area" </div>
type="textarea" </el-form-item>
maxlength="500" <el-form-item
show-word-limit label="办理人电话"
:rows="5" prop="manageResiTel"
placeholder="请输入回复内容,不超过500字" label-width="150px"
v-model="formData.content"></el-input> :class="{ 'form-item': source === 'visiual' }"
</div> style="display: block"
>
</el-form-item> <div :class="{ 'visiual-form': source === 'visiual' }">
<el-form-item label="" <el-input
label-width="150px" class="cell-width-area"
:class="{'form-item':source==='visiual'}" placeholder="请输入办理人"
style="display: block"> v-model="formData.manageResiTel"
<el-checkbox :class="{'form-item':source==='visiual'}" ></el-input>
v-model="status">已完成</el-checkbox> </div>
</el-form-item> </el-form-item>
<el-form-item
</el-form> label="办理意见"
prop="content"
</div> label-width="150px"
:class="{ 'form-item': source === 'visiual' }"
style="display: block"
>
<div :class="{ 'visiual-form': source === 'visiual' }">
<el-input
class="cell-width-area"
type="textarea"
maxlength="500"
show-word-limit
:rows="5"
placeholder="请输入回复内容,不超过500字"
v-model="formData.content"
></el-input>
</div>
</el-form-item>
<el-form-item
label=""
label-width="150px"
:class="{ 'form-item': source === 'visiual' }"
style="display: block"
>
<el-checkbox
:class="{ 'form-item': source === 'visiual' }"
v-model="status"
>已完成</el-checkbox
>
</el-form-item>
</el-form>
</div>
</template> </template>
<script> <script>
import { Loading } from "element-ui"; // Loading import { Loading } from "element-ui"; // Loading
@ -113,220 +131,241 @@ import { requestPost } from "@/js/dai/request";
import formVltHelper from "dai-js/tools/formVltHelper"; import formVltHelper from "dai-js/tools/formVltHelper";
import { isCard } from "@/utils/validate"; import { isCard } from "@/utils/validate";
import replyOptions from "./replyOptions";
let loading; // let loading; //
export default { export default {
data () { data() {
return { return {
btnDisable: false, btnDisable: false,
formData: { formData: {
operationType: '0',//[0: 1: 2:] operationType: "0", //[0: 1: 2:]
content: '', content: "",
manageStatus: '', manageStatus: "",
manageTime:'', manageTime: "",
manageResi:'', manageResi: "",
manageResiTel:'' manageResiTel: "",
}, },
status: false, status: false,
okflag: false, okflag: false,
// <!-- 0 1 2 3 4 5--> // <!-- 0 1 2 3 4 5-->
eventDetailCopy: {}, eventDetailCopy: {},
statusOption:[ statusOption: replyOptions,
{label:'上报',value:0}, casOptions: [],
{label:'阅收',value:1}, iscascaderShow: 0,
{label:'完结',value:2}, selCategoryArray: [],
{label:'审核',value:3}, selCateObj: {},
{label:'事件评价',value:4}, optionProps: {
{label:'结案归档',value:5} multiple: false,
], value: "id",
casOptions: [], label: "name",
iscascaderShow: 0, children: "subCategory",
selCategoryArray: [], },
selCateObj: {}, };
optionProps: { },
multiple: false, components: {},
value: 'id', computed: {
label: 'name', dataRule() {
children: 'subCategory', return {
}, content: [
{
}; required: true,
}, message: "办理意见不能为空",
components: {}, trigger: "blur",
computed: { },
dataRule () { ],
manageStatus: [
return { {
content: [ required: true,
{ required: true, message: "办理意见不能为空", trigger: "blur" }, message: "办理状态能为空",
], trigger: "blur",
manageStatus: [ },
{ required: true, message: "办理状态能为空", trigger: "blur" }, ],
], manageTime: [
manageTime: [ {
{ required: true, message: "办理时间不能为空", trigger: "blur" }, required: true,
], message: "办理时间不能为空",
manageResi: [ trigger: "blur",
{ required: true, message: "办理人不能为空", trigger: "blur" }, },
], ],
manageResiTel: [ manageResi: [
{ required: true, message: "办理人电话不能为空", trigger: "blur" }, {
], required: true,
}; message: "办理人不能为空",
}, trigger: "blur",
},
],
}, manageResiTel: [
props: { {
eventId: { required: true,
type: String, message: "办理人电话不能为空",
default: "", trigger: "blur",
}, },
eventDetailData: { ],
type: Object, };
default () { },
return {} },
} props: {
}, eventId: {
source: {//manage visiual type: String,
type: String, default: "",
default: 'manage' },
} eventDetailData: {
}, type: Object,
watch: {}, default() {
return {};
created () { },
},
console.log(this.source) processData: Object,
source: {
}, //manage visiual
type: String,
async mounted () { default: "manage",
},
this.getCategoryList() },
if (this.eventId) { watch: {
this.eventDetailCopy = JSON.parse(JSON.stringify(this.eventDetailData)); processData() {
this.syncProcessData();
if (this.eventDetailCopy.parentCategoryId && this.eventDetailCopy.categoryId) { },
this.selCategoryArray = [] },
this.selCategoryArray.push(this.eventDetailCopy.parentCategoryId)
this.selCategoryArray.push(this.eventDetailCopy.categoryId) created() {
console.log(this.source);
this.selCateObj = { this.syncProcessData();
name: this.eventDetailCopy.categoryName, },
id: this.eventDetailCopy.categoryId
} async mounted() {
} this.getCategoryList();
} if (this.eventId) {
}, this.eventDetailCopy = JSON.parse(
JSON.stringify(this.eventDetailData)
methods: { );
async getCategoryList () {
const url = "/gov/issue/issueprojectcategorydict/list" if (
this.eventDetailCopy.parentCategoryId &&
let params = {} this.eventDetailCopy.categoryId
) {
const { data, code, msg } = await requestPost(url, params) this.selCategoryArray = [];
this.selCategoryArray.push(
if (code === 0) { this.eventDetailCopy.parentCategoryId
);
let treeDataNew = this.filterTree(data) this.selCategoryArray.push(this.eventDetailCopy.categoryId);
// this.selCateObj = {
++this.iscascaderShow name: this.eventDetailCopy.categoryName,
this.casOptions = [] id: this.eventDetailCopy.categoryId,
};
this.casOptions = treeDataNew }
}
} else { },
this.$message.error(msg)
} methods: {
syncProcessData() {
}, const { processData } = this;
this.formData = {
handleChangeCate () { processId: processData.processId,
console.log(this.$refs["myCascader"].getCheckedNodes()[0].data) operationType: "0", //[0: 1: 2:]
this.selCateObj = this.$refs["myCascader"].getCheckedNodes()[0].data content: processData.publicReply,
manageStatus: processData.manageStatus,
}, manageTime: processData.manageTime,
manageResi: processData.manageResi,
// manageResiTel: processData.manageResiTel,
filterTree (arr) { };
let childs = arr },
for (let i = childs.length; i--; i > 0) { async getCategoryList() {
if (childs[i].subCategory) { const url = "/gov/issue/issueprojectcategorydict/list";
if (childs[i].subCategory.length) {
this.filterTree(childs[i].subCategory) let params = {};
} else {
delete childs[i].subCategory const { data, code, msg } = await requestPost(url, params);
}
} if (code === 0) {
} let treeDataNew = this.filterTree(data);
return arr
}, //
async getReplayInfo () { ++this.iscascaderShow;
this.okflag = false this.casOptions = [];
this.$refs["ref_form1"].validate((valid, messageObj) => {
if (!valid) { this.casOptions = treeDataNew;
app.util.validateRule(messageObj); } else {
this.$message.error(msg);
} else { }
},
if (this.status) {
handleChangeCate() {
if (!this.selCateObj || !this.selCateObj.id) { console.log(this.$refs["myCascader"].getCheckedNodes()[0].data);
this.$message.info("请填写事件分类"); this.selCateObj =
return false this.$refs["myCascader"].getCheckedNodes()[0].data;
} },
this.formData.status = 'closed_case'
} else { //
this.formData.status = 'processing' filterTree(arr) {
} let childs = arr;
this.formData.categoryId = this.selCateObj.id for (let i = childs.length; i--; i > 0) {
this.formData.categoryList = [] if (childs[i].subCategory) {
this.formData.categoryList.push(this.selCateObj) if (childs[i].subCategory.length) {
this.filterTree(childs[i].subCategory);
this.okflag = true } else {
} delete childs[i].subCategory;
}); }
}, }
}
resetData () { return arr;
},
}, async getReplayInfo() {
// this.okflag = false;
startLoading () { this.$refs["ref_form1"].validate((valid, messageObj) => {
loading = Loading.service({ if (!valid) {
lock: true, // app.util.validateRule(messageObj);
text: "正在加载……", // } else {
background: "rgba(0,0,0,.7)", // if (this.status) {
}); if (!this.selCateObj || !this.selCateObj.id) {
}, this.$message.info("请填写事件分类");
// return false;
endLoading () { }
// clearTimeout(timer); this.formData.status = "closed_case";
if (loading) { } else {
loading.close(); this.formData.status = "processing";
} }
}, this.formData.categoryId = this.selCateObj.id;
}, this.formData.categoryList = [];
this.formData.categoryList.push(this.selCateObj);
this.okflag = true;
}
});
},
resetData() {},
//
startLoading() {
loading = Loading.service({
lock: true, //
text: "正在加载……", //
background: "rgba(0,0,0,.7)", //
});
},
//
endLoading() {
// clearTimeout(timer);
if (loading) {
loading.close();
}
},
},
}; };
</script> </script>
<style lang="scss" scoped>
<style lang='scss' scoped>
@import "@/assets/scss/modules/visual/a_customize.scss"; @import "@/assets/scss/modules/visual/a_customize.scss";
@import "@/assets/scss/modules/shequzhili/event-info.scss"; @import "@/assets/scss/modules/shequzhili/event-info.scss";
</style> </style>
<style> <style>
.el-dialog__body { .el-dialog__body {
padding: 0 10px 20px !important; padding: 0 10px 20px !important;
} }
</style> </style>

479
src/views/modules/shequzhili/event/cpts/process-form.vue

@ -1,67 +1,73 @@
<template> <template>
<div class=""> <div class="">
<div> <div>
<el-form
<el-form ref="ref_form1" ref="ref_form1"
:inline="false" :inline="false"
:rules="dataRule" :rules="dataRule"
class="form"> class="form"
>
<el-form-item label="处理方式" <el-form-item
label-width="150px" label="处理方式"
:class="{'form-item':source==='visiual'}" label-width="150px"
prop="operationType"> :class="{ 'form-item': source === 'visiual' }"
<el-radio-group :class="{'form-item':source==='visiual'}" prop="operationType"
v-model="operationType" >
@change="handleChangeOperationType"> <el-radio-group
<el-radio v-if="!eventId" :class="{ 'form-item': source === 'visiual' }"
label="">暂不处理</el-radio> v-model="operationType"
<el-radio label="0">回复</el-radio> @change="handleChangeOperationType"
<!-- <el-radio label="1">立项</el-radio> >
<el-radio v-if="!eventId" label="">暂不处理</el-radio>
<el-radio label="0">回复</el-radio>
<!-- <el-radio label="1">立项</el-radio>
<el-radio label="2">转服务</el-radio> <el-radio label="2">转服务</el-radio>
<el-radio label="3">转议题</el-radio> --> <el-radio label="3">转议题</el-radio> -->
</el-radio-group>
</el-radio-group> </el-form-item>
</el-form-item> </el-form>
</el-form> <div v-if="operationType === '0'">
<process-form-replay
<div v-if="operationType==='0'"> ref="ref_process_form_replay"
<process-form-replay ref="ref_process_form_replay" :source="source"
:source="source" :processData="processData"
:eventDetailData="eventDetailData" :eventDetailData="eventDetailData"
:eventId="eventId"></process-form-replay> :eventId="eventId"
</div> ></process-form-replay>
</div>
<div v-if="operationType==='1'">
<process-form-project ref="ref_process_form_project" <div v-if="operationType === '1'">
:source="source" <process-form-project
:eventDetailData="eventDetailData" ref="ref_process_form_project"
:gridId="gridId" :source="source"
:eventId="eventId"></process-form-project> :eventDetailData="eventDetailData"
</div> :gridId="gridId"
:eventId="eventId"
<div v-if="operationType==='2'"> ></process-form-project>
<process-form-demand ref="ref_process_form_demond" </div>
:source="source"
:eventId="eventId" <div v-if="operationType === '2'">
:demandUserId="demandUserId" <process-form-demand
:demandUserName="demandUserName" ref="ref_process_form_demond"
:demandUserMobile="demandUserMobile" :source="source"
:eventDetailData="eventDetailData"></process-form-demand> :eventId="eventId"
:demandUserId="demandUserId"
</div> :demandUserName="demandUserName"
<div v-if="operationType==='3'"> :demandUserMobile="demandUserMobile"
<process-form-issue ref="ref_process_form_issue" :eventDetailData="eventDetailData"
:source="source" ></process-form-demand>
:eventDetailData="eventDetailData" </div>
:eventId="eventId"></process-form-issue> <div v-if="operationType === '3'">
<process-form-issue
</div> ref="ref_process_form_issue"
:source="source"
</div> :eventDetailData="eventDetailData"
:eventId="eventId"
</div> ></process-form-issue>
</div>
</div>
</div>
</template> </template>
<script> <script>
@ -72,199 +78,186 @@ import processFormProject from "./process-form-project";
import processFormDemand from "./process-form-demand"; import processFormDemand from "./process-form-demand";
import processFormIssue from "./process-form-issue"; import processFormIssue from "./process-form-issue";
let loading; // let loading; //
export default { export default {
data () { data() {
return { return {
casOptions: [],
casOptions: [], iscascaderShow: 0,
iscascaderShow: 0, selCategoryArray: [],
selCategoryArray: [], selCateObj: {},
selCateObj: {}, optionProps: {
optionProps: { multiple: false,
multiple: false, value: "id",
value: 'id', label: "name",
label: 'name', children: "subCategory",
children: 'subCategory', },
},
operationType: "",
operationType: '',
replayInfo: {},
demand: {},
replayInfo: {}, project: {},
demand: {}, issueInfo: {},
project: {}, okflag: false,
issueInfo: {},
okflag: false, eventDetailCopy: {},
};
eventDetailCopy: {} },
components: {
}; processFormReplay,
}, processFormProject,
components: { processFormDemand,
processFormReplay, processFormIssue,
processFormProject, },
processFormDemand, computed: {
processFormIssue dataRule() {
}, return {
computed: { operationType: [
dataRule () { {
return { required: true,
message: "处理方式不能为空",
operationType: [ trigger: "blur",
{ required: true, message: "处理方式不能为空", trigger: "blur" }, },
], ],
};
}; },
}, },
props: {
demandUserId: {
}, type: String,
props: { default: "",
demandUserId: { },
type: String, demandUserName: {
default: "", type: String,
}, default: "",
demandUserName: { },
type: String, demandUserMobile: {
default: "", type: String,
}, default: "",
demandUserMobile: { },
type: String, gridId: {
default: "", type: String,
}, default: "",
gridId: { },
type: String, eventId: {
default: "", type: String,
}, default: "",
eventId: { },
type: String, eventDetailData: {
default: "", type: Object,
}, default() {
eventDetailData: { return {};
type: Object, },
default () { },
return {} processData: Object,
} source: {
}, //manage visiual
source: {//manage visiual type: String,
type: String, default: "manage",
default: 'manage' },
} },
},
watch: {
watch: { processData(val) {
if (val && val.processId) {
}, if (val.processName == "回复") {
this.operationType = "0";
created () { }
}
console.log(this.source) },
},
},
created() {
async mounted () { console.log(this.source);
const { user } = this.$store.state },
this.agencyId = user.agencyId
async mounted() {
if (this.eventId) { const { user } = this.$store.state;
this.eventDetailCopy = JSON.parse(JSON.stringify(this.eventDetailData)); this.agencyId = user.agencyId;
} if (this.eventId) {
this.eventDetailCopy = JSON.parse(
}, JSON.stringify(this.eventDetailData)
);
methods: { }
handleChangeOperationType (val) { },
}, methods: {
async getProcessInfo () { handleChangeOperationType(val) {},
this.okflag = false async getProcessInfo() {
if (this.operationType === '0') { this.okflag = false;
this.$refs.ref_process_form_replay.getReplayInfo() if (this.operationType === "0") {
if (this.$refs.ref_process_form_replay.okflag) { this.$refs.ref_process_form_replay.getReplayInfo();
this.replayInfo = this.$refs.ref_process_form_replay.formData if (this.$refs.ref_process_form_replay.okflag) {
this.replayInfo =
this.okflag = true this.$refs.ref_process_form_replay.formData;
} else { this.okflag = true;
return false } else {
} return false;
}
} else if (this.operationType === '1') { } else if (this.operationType === "1") {
this.$refs.ref_process_form_project.getProjectInfo() this.$refs.ref_process_form_project.getProjectInfo();
if (this.$refs.ref_process_form_project.okflag) { if (this.$refs.ref_process_form_project.okflag) {
this.project = this.$refs.ref_process_form_project.formData;
this.project = this.$refs.ref_process_form_project.formData
//
// this.okflag = true;
this.okflag = true } else {
return false;
} else { }
return false } else if (this.operationType === "2") {
} this.$refs.ref_process_form_demond.getDemandInfo();
} else if (this.operationType === '2') { if (this.$refs.ref_process_form_demond.okflag) {
this.$refs.ref_process_form_demond.getDemandInfo() this.demand = this.$refs.ref_process_form_demond.formData;
if (this.$refs.ref_process_form_demond.okflag) {
this.demand = this.$refs.ref_process_form_demond.formData this.okflag = true;
} else {
this.okflag = true return false;
}
} else { } else if (this.operationType === "3") {
return false this.$refs.ref_process_form_issue.getIssueInfo();
} if (this.$refs.ref_process_form_issue.okflag) {
} else if (this.operationType === '3') { this.issueInfo = this.$refs.ref_process_form_issue.formData;
this.$refs.ref_process_form_issue.getIssueInfo()
if (this.$refs.ref_process_form_issue.okflag) { this.okflag = true;
this.issueInfo = this.$refs.ref_process_form_issue.formData } else {
return false;
this.okflag = true }
}
} else { },
return false
} handleCancle() {
} this.resetData();
},
}, resetData() {},
//
startLoading() {
handleCancle () { loading = Loading.service({
this.resetData(); lock: true, //
text: "正在加载……", //
}, background: "rgba(0,0,0,.7)", //
resetData () { });
},
}, //
// endLoading() {
startLoading () { // clearTimeout(timer);
loading = Loading.service({ if (loading) {
lock: true, // loading.close();
text: "正在加载……", // }
background: "rgba(0,0,0,.7)", // },
}); },
},
//
endLoading () {
// clearTimeout(timer);
if (loading) {
loading.close();
}
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/assets/scss/modules/shequzhili/event-info.scss"; @import "@/assets/scss/modules/shequzhili/event-info.scss";
</style> </style>
<style> <style>
.el-dialog__body { .el-dialog__body {
padding: 0 10px 20px !important; padding: 0 10px 20px !important;
} }
</style> </style>

8
src/views/modules/shequzhili/event/cpts/replyOptions.js

@ -0,0 +1,8 @@
export default [
{ label: "上报", value: 0 },
{ label: "阅收", value: 1 },
{ label: "完结", value: 2 },
{ label: "审核", value: 3 },
{ label: "事件评价", value: 4 },
{ label: "结案归档", value: 5 },
];

39
src/views/modules/shequzhili/event/eventList.vue

@ -181,7 +181,7 @@
size="small" size="small"
>导出</el-button >导出</el-button
> >
<!-- <!--
<el-button <el-button
@click="handleMarkDiffcult" @click="handleMarkDiffcult"
class="diy-button--export" class="diy-button--export"
@ -394,13 +394,22 @@
fixed="right" fixed="right"
label="操作" label="操作"
align="center" align="center"
width="100" width="200"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-button
@click="handleUpdate(scope.row)"
type="text"
size="small"
class="div-table-button--edit"
>修改</el-button
>
<el-button <el-button
v-if=" v-if="
scope.row.status === 'processing' && true ||
!scope.row.operationId (scope.row.status === 'processing' &&
!scope.row.operationId)
" "
@click="handleDispose(scope.row)" @click="handleDispose(scope.row)"
type="text" type="text"
@ -455,7 +464,10 @@
</div> </div>
<div <div
v-if=" v-if="
pageType == 'dispose' || pageType == 'info' || pageType == 'add' pageType == 'dispose' ||
pageType == 'info' ||
pageType == 'add' ||
pageType == 'edit'
" "
> >
<event-info <event-info
@ -826,6 +838,23 @@ export default {
} }
}, },
//
async handleUpdate(row) {
this.eventId = row.icEventId;
const url = "/gov/project/icEvent/detail";
const { data, code, msg } = await requestPost(url, {
icEventId: this.eventId,
});
if (code === 0) {
this.eventDetailData = { ...data };
this.pageType = "edit";
} else {
this.$message.error(msg);
}
},
// //
handleShowVoice(url) { handleShowVoice(url) {
this.selVoiceUrl = url; this.selVoiceUrl = url;

2
vue.config.js

@ -27,7 +27,7 @@ module.exports = {
assetsDir: 'static', assetsDir: 'static',
devServer: { devServer: {
open: true, open: true,
port: 9004, port: 9005,
overlay: { overlay: {
errors: true, errors: true,
warnings: true warnings: true

Loading…
Cancel
Save