|
@@ -10,7 +10,7 @@
|
|
|
<div class="con_left" style="height: 83%;top: 141px;">
|
|
|
<!-- 全年应急事件总数 -->
|
|
|
<div class="eventTotalYear_contain">
|
|
|
- <div>全年应急事件总数 <span>{{ }}</span> </div>
|
|
|
+ <div>全年应急事件总数 <span>{{ eventTotalCountYear }}</span> </div>
|
|
|
</div>
|
|
|
<div class="list_tit">应急中心</div>
|
|
|
<el-input
|
|
@@ -113,6 +113,7 @@
|
|
|
custom-class="emergencyEventDialog"
|
|
|
style="margin-top: 5vh !important;"
|
|
|
>
|
|
|
+ <div class="continueForm_contain" @click="getDescriptionByContingency">继续填写</div>
|
|
|
<div class="transferBg d1">
|
|
|
<h3>事件基本信息</h3>
|
|
|
<div class="eventInfo_contain">
|
|
@@ -199,7 +200,7 @@
|
|
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
|
<h3 style="margin-left: 1%;">事件基本信息</h3>
|
|
|
<div style="margin-top: 2%;"></div>
|
|
|
- <div style="display: flex;width: 100%;height: 30%;flex-wrap: wrap;align-content: flex-start;">
|
|
|
+ <div style="display: flex;width: 100%;height: 50%;flex-wrap: wrap;align-content: flex-start;">
|
|
|
<el-form-item label="事件名称" prop="eventTitle" style="width: 350px;height: 40px;">
|
|
|
<el-input v-model="ruleForm.eventTitle">
|
|
|
<template #prepend></template>
|
|
@@ -215,52 +216,15 @@
|
|
|
<el-input v-model="ruleForm.latitude"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="图片" prop="fileList" style="width: 1200px;height: 40px;">
|
|
|
- <el-upload
|
|
|
- multiple
|
|
|
- :action="uploadFileUrl"
|
|
|
- :before-upload="handleBeforeUpload"
|
|
|
- :file-list="fileList"
|
|
|
- :limit="limit"
|
|
|
- accept="image/*"
|
|
|
- :on-error="handleUploadError"
|
|
|
- :on-exceed="handleExceed"
|
|
|
- :on-success="handleUploadSuccess"
|
|
|
- :show-file-list="false"
|
|
|
- :headers="headers"
|
|
|
- class="upload-file-uploader"
|
|
|
- ref="upload"
|
|
|
- >
|
|
|
- <!-- 上传按钮 -->
|
|
|
- <el-button size="mini" type="primary">选取图片</el-button>
|
|
|
-
|
|
|
- <!-- 文件列表 -->
|
|
|
- <transition-group class="upload-file-list el-upload-list el-upload-list--text fileUls" name="el-fade-in-linear" tag="ul">
|
|
|
- <li :key="file.url" class="el-upload-list__item ele-upload-list__item-content"
|
|
|
- v-for="(file, index) in fileList">
|
|
|
- <el-link :href="file.url" :underline="false" target="_blank">
|
|
|
- <span class="el-icon-document"> {{ file.webName }} </span>
|
|
|
- </el-link>
|
|
|
- <div class="ele-upload-list__item-content-action">
|
|
|
- <el-link :underline="false" @click="handleDelete(index)" type="danger">删除</el-link>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </transition-group>
|
|
|
- <!-- 上传提示 -->
|
|
|
- <div class="el-upload__tip" slot="tip" v-if="showTip">
|
|
|
- 请上传
|
|
|
- <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b></template>
|
|
|
- <!-- <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b></template>-->
|
|
|
- 的文件
|
|
|
- </div>
|
|
|
- </el-upload>
|
|
|
+ <ImageUpload :fileType="['jpg', 'png','jpeg']" :limit="5" :value="fileList" @input="getUrl"></ImageUpload>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="事件描述" prop="eventDescription" style="width: 1000px;height: 100px;">
|
|
|
+ <el-form-item label="事件描述" prop="eventDescription" style="width: 1000px;height: 100px;margin-top: 9%;">
|
|
|
<el-input type="textarea" v-model="ruleForm.eventDescription" class="descInput"></el-input>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<h3 style="margin:2% 0 0 1%;">现场状况信息</h3>
|
|
|
<div style="margin-top: 2%;"></div>
|
|
|
- <div style="display: flex;width: 100%;height: 44%;flex-wrap: wrap;align-content: flex-start;">
|
|
|
+ <div style="display: flex;width: 100%;height: 23%;flex-wrap: wrap;align-content: flex-start;">
|
|
|
<el-form-item label="事件发生位置" prop="contingencyDetail.eventLocation" style="width: 350px;height: 40px;">
|
|
|
<el-input v-model="ruleForm.contingencyDetail.eventLocation">
|
|
|
<template #prepend></template>
|
|
@@ -301,6 +265,7 @@
|
|
|
:before-upload="handleVideoBeforeUpload"
|
|
|
:file-list="videoList"
|
|
|
limit="1"
|
|
|
+ accept="video/*"
|
|
|
:on-error="handleUploadError"
|
|
|
:on-exceed="handleExceed"
|
|
|
:on-success="handleVideoUploadSuccess"
|
|
@@ -350,13 +315,15 @@
|
|
|
getEventList,
|
|
|
getPlanList,
|
|
|
getDescriptionByContingency,
|
|
|
- eventReport
|
|
|
+ eventReport,
|
|
|
+ getEmergencyStatisticsByYear
|
|
|
} from "@/api/event.js"
|
|
|
import {
|
|
|
listDeviceAll,
|
|
|
selectByDeviceId,
|
|
|
selectDailyThreshold
|
|
|
} from "@/api/sentinel"
|
|
|
+ import ImageUpload from '@/components/ImageUpload'
|
|
|
|
|
|
import '../assets/styles/sb_body.css';
|
|
|
|
|
@@ -369,6 +336,7 @@
|
|
|
name:'MyChart',
|
|
|
components: {
|
|
|
supermap,
|
|
|
+ ImageUpload
|
|
|
},
|
|
|
metaInfo () {
|
|
|
return {
|
|
@@ -390,6 +358,9 @@
|
|
|
// this.getSuperMapUrl();
|
|
|
this.getEventList()
|
|
|
this.getPlanList()
|
|
|
+ getEmergencyStatisticsByYear().then(res => {
|
|
|
+ this.eventTotalCountYear = res.data.countSum || ''
|
|
|
+ })
|
|
|
setTimeout(() => {
|
|
|
this.title = '四平市智慧哨兵监管平台'
|
|
|
}, 1000);
|
|
@@ -469,6 +440,7 @@
|
|
|
videoPath:''
|
|
|
}
|
|
|
},
|
|
|
+ eventId:'',
|
|
|
rules: {
|
|
|
eventTitle: [
|
|
|
{ required: true, message: '请输入事件名称', trigger: 'blur' },
|
|
@@ -478,11 +450,13 @@
|
|
|
{ required: true, message: '请填写事件描述', trigger: 'blur' }
|
|
|
]
|
|
|
},
|
|
|
+ eventTotalCountYear:'',
|
|
|
reportParams:{}, // 发起事件参数
|
|
|
planTotal:null,
|
|
|
planList:[],
|
|
|
planListSearch:[],
|
|
|
emergencyEventDetails:{}, // 应急事件详情信息
|
|
|
+ attachExamine:[]
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
@@ -490,7 +464,52 @@
|
|
|
setEmergencyEvent(){
|
|
|
this.setEventDialogVisible = true
|
|
|
},
|
|
|
+ getDescriptionByContingency(){
|
|
|
+ let form = {
|
|
|
+ eventTitle: this.emergencyEventDetails.eventTitle || '',
|
|
|
+ latitude: this.emergencyEventDetails.latitude || '',
|
|
|
+ longitude: this.emergencyEventDetails.longitude || '',
|
|
|
+ eventStatus: "event_report", //事件状态
|
|
|
+ eventSource: 'artificial',
|
|
|
+ eventDescription: this.emergencyEventDetails.eventDescription || '',
|
|
|
+ eventType: {
|
|
|
+ eventTypeCode: "2" //内部自定义编码
|
|
|
+ },
|
|
|
+ "deptList": [
|
|
|
+ {
|
|
|
+ "mapDeptId": "370", //部门id
|
|
|
+ "mapDeptName": "铁东区" //部门名称
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "mapDeptId": "365", //部门id
|
|
|
+ "mapDeptName": "四平市" //部门名称
|
|
|
+ }
|
|
|
+ ], //事件接受部门集合
|
|
|
+ contingencyDetail:{
|
|
|
+ eventLocation: this.emergencyEventDetails.eventLocation || '',
|
|
|
+ eventReason : this.emergencyEventDetails.eventReason || '',
|
|
|
+ eventCasualties : this.emergencyEventDetails.eventCasualties || '',
|
|
|
+ eventEarlyWarning : this.emergencyEventDetails.eventEarlyWarning || '',
|
|
|
+ processingPerson : this.emergencyEventDetails.processingPerson || '',
|
|
|
+ personPhone : this.emergencyEventDetails.personPhone || '',
|
|
|
+ eventResolutionTime : this.emergencyEventDetails.eventResolutionTime || '',
|
|
|
+ videoPath : this.emergencyEventDetails.videoPath || ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.fileList = this.emergencyEventDetails.attachPath || []
|
|
|
+ this.videoList = [this.emergencyEventDetails.videoPath] || [],
|
|
|
+ this.videoUploadList = [this.emergencyEventDetails.videoPath] || []
|
|
|
+
|
|
|
+ console.log('this.fileList',this.fileList)
|
|
|
+ setTimeout(() => {
|
|
|
+ this.ruleForm = form
|
|
|
+ this.emergencyEventDetails = {}
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.setEventDialogVisible = true
|
|
|
+ })
|
|
|
+ },
|
|
|
getEventDetail(eventId,latitude,longitude){
|
|
|
+ this.eventId = eventId
|
|
|
getDescriptionByContingency(eventId).then(res => {
|
|
|
if(res.code == 200){
|
|
|
this.emergencyEventDetails = res.data
|
|
@@ -504,47 +523,45 @@
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
- return
|
|
|
this.dropLocation(latitude ,longitude)
|
|
|
},
|
|
|
submitForm(formName) {
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- this.reportParams = this.ruleForm
|
|
|
- // 整理附件
|
|
|
- let attachList = []
|
|
|
- if(this.fileList.length > 0){
|
|
|
- this.fileList.forEach(e => {
|
|
|
- attachList.push({
|
|
|
- attachPath:e.url,
|
|
|
- fileName:e.webName
|
|
|
+ if (valid) {
|
|
|
+ this.reportParams = this.ruleForm
|
|
|
+ // 整理附件
|
|
|
+ let attachList = []
|
|
|
+ if(this.fileList.length > 0){
|
|
|
+ this.fileList.forEach(e => {
|
|
|
+ attachList.push({
|
|
|
+ attachPath:e.url,
|
|
|
+ fileName:e.webName
|
|
|
+ })
|
|
|
})
|
|
|
+ } else {
|
|
|
+ attachList = []
|
|
|
+ }
|
|
|
+ // 整理上传视频
|
|
|
+ if(this.videoList.length > 0){
|
|
|
+ this.reportParams.contingencyDetail.videoPath = this.videoList[0].url
|
|
|
+ }
|
|
|
+ this.reportParams.attachList = this.attachExamine
|
|
|
+ // return
|
|
|
+ eventReport(this.reportParams).then(res => {
|
|
|
+ this.setEventDialogVisible = false
|
|
|
+ // 重置表单状态
|
|
|
+ this.resetForm('ruleForm');
|
|
|
+ if(res.code == 200){
|
|
|
+ this.fileList = [],
|
|
|
+ this.videoList = [],
|
|
|
+ this.uploadList = [],
|
|
|
+ this.videoUploadList = []
|
|
|
+ }
|
|
|
})
|
|
|
} else {
|
|
|
- attachList = []
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
}
|
|
|
- // 整理上传视频
|
|
|
- if(this.videoList.length > 0){
|
|
|
- this.reportParams.contingencyDetail.videoPath = this.videoList[0].url
|
|
|
- }
|
|
|
- this.reportParams.attachList = attachList
|
|
|
- console.log('this.params',this.reportParams)
|
|
|
- // return
|
|
|
- eventReport(this.reportParams).then(res => {
|
|
|
- this.setEventDialogVisible = false
|
|
|
- // 重置表单状态
|
|
|
- this.$refs.ruleForm.resetFields();
|
|
|
- if(res.code == 200){
|
|
|
- this.fileList = [],
|
|
|
- this.videoList = [],
|
|
|
- this.uploadList = [],
|
|
|
- this.videoUploadList = []
|
|
|
- }
|
|
|
- })
|
|
|
- } else {
|
|
|
- console.log('error submit!!');
|
|
|
- return false;
|
|
|
- }
|
|
|
});
|
|
|
},
|
|
|
resetForm(formName) {
|
|
@@ -559,6 +576,36 @@
|
|
|
this.deviceList = res.rows
|
|
|
this.deviceListSearch = res.rows
|
|
|
this.deviceTotal = res.total
|
|
|
+ let deviceMarkersList = []
|
|
|
+ if (res.rows != null && res.rows.length > 0) {
|
|
|
+ for (let i = 0; i < res.rows.length; i++) {
|
|
|
+ let markersMap = {
|
|
|
+ lng: 124.59,
|
|
|
+ lat: 43.02,
|
|
|
+ icon: "warning",
|
|
|
+ bindPopupHtml: "",
|
|
|
+ click: "",
|
|
|
+ parameter: {
|
|
|
+ id:res.rows[i].id || '',
|
|
|
+ },
|
|
|
+ keepBindPopup: false,
|
|
|
+ isAggregation: false,
|
|
|
+ };
|
|
|
+ markersMap.lng = res.rows[i].longitude*1;
|
|
|
+ markersMap.lat = res.rows[i].latitude*1;
|
|
|
+ markersMap.radius = res.rows[i].cameraRadius || '';
|
|
|
+ deviceMarkersList.push(markersMap);
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$parent.$refs.supermap.clearM();
|
|
|
+ this.$parent.$refs.supermap.setMarkers(deviceMarkersList);
|
|
|
+ }, 3000);
|
|
|
+ } else {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$parent.$refs.supermap.clearM();
|
|
|
+ this.$parent.$refs.supermap.clearMRadius();
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
getPlanList(){
|
|
@@ -568,6 +615,16 @@
|
|
|
this.planTotal = res.total
|
|
|
})
|
|
|
},
|
|
|
+ getUrl(urlList) {
|
|
|
+ this.fileList = urlList
|
|
|
+ this.attachExamine = []
|
|
|
+ urlList.forEach(item => {
|
|
|
+ var attachPath = {
|
|
|
+ attachPath: item.name
|
|
|
+ }
|
|
|
+ this.attachExamine.push(attachPath)
|
|
|
+ });
|
|
|
+ },
|
|
|
closeDetail(){
|
|
|
this.isDetailVisible = false
|
|
|
this.isVisible = false
|
|
@@ -1045,6 +1102,14 @@
|
|
|
background: linear-gradient(to bottom, rgba(29,57,58,.9) ,rgba(35,42,48,.9));
|
|
|
border-radius: 10px;
|
|
|
}
|
|
|
+ .continueForm_contain{
|
|
|
+ position: absolute;
|
|
|
+ right: 3%;
|
|
|
+ top: 10%;
|
|
|
+ color: #2878FF;
|
|
|
+ text-decoration: underline;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
.d1{
|
|
|
height: 20%;
|
|
|
.eventInfo_contain{
|
|
@@ -1267,7 +1332,7 @@
|
|
|
}
|
|
|
.fileUls{
|
|
|
position: absolute;
|
|
|
- width: 1200px;
|
|
|
+ width: 900px;
|
|
|
height: 60px;
|
|
|
left: 6%;
|
|
|
top: -26%;
|
|
@@ -1280,7 +1345,7 @@
|
|
|
|
|
|
.videoUls{
|
|
|
position: absolute;
|
|
|
- width: 800px;
|
|
|
+ width: 300px;
|
|
|
height: 60px;
|
|
|
left: 35%;
|
|
|
top: -26%;
|