From 977955d716039c91fd6292b159e50e15c62100a1 Mon Sep 17 00:00:00 2001
From: yangdelong <828900aaa>
Date: 星期六, 29 五月 2021 16:25:59 +0800
Subject: [PATCH] 企业应急-事件处置-事件信息页面
---
src/components/panel/RightSearchPanel.vue | 2
src/components/layer/src/layer.vue | 8
src/assets/css/map/map-panel-style.less | 9 +
src/views/MapTemplate.vue | 3
src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue | 19 +++
src/components/LayerController/LayerController.vue | 2
src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue | 24 +---
src/components/base-page/enterprise-emergency/event-handling/ResInfo.vue | 42 ++++++-
src/components/base-page/enterprise-emergency/DisposalEvent.vue | 182 +++++++++++++++++++++--------------
9 files changed, 179 insertions(+), 112 deletions(-)
diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less
index 133719f..7ae3d48 100644
--- a/src/assets/css/map/map-panel-style.less
+++ b/src/assets/css/map/map-panel-style.less
@@ -545,7 +545,7 @@
.panel-title {
color: @color-title;
font-size: 18px;
- padding: 10px;
+ padding: 5px 10px;
text-align: center;
border-bottom: 1px solid @background-color-split;
}
@@ -591,13 +591,14 @@
padding: 7px 15px;
}
- .el-button:hover {
+.el-button:hover{
background: @background-color;
color: @color-highlight;
border-color: @color-highlight;
}
- .el-input__inner {
+
+ .el-input__inner {
color: #fff;
text-align: center;
}
@@ -834,4 +835,4 @@
text-align: right;
margin: 5px 0;
color: @color;
-}
\ No newline at end of file
+}
diff --git a/src/components/LayerController/LayerController.vue b/src/components/LayerController/LayerController.vue
index 3a49054..37af978 100644
--- a/src/components/LayerController/LayerController.vue
+++ b/src/components/LayerController/LayerController.vue
@@ -265,7 +265,7 @@
background:@background-color4;
color:@color-tool;
position: absolute;
- top:24px;
+ top:20px;
right:0.02rem;
border:none;//1px solid @color-tool;
width: 0.2rem;
diff --git a/src/components/base-page/enterprise-emergency/DisposalEvent.vue b/src/components/base-page/enterprise-emergency/DisposalEvent.vue
index 5e6358c..e7eb185 100644
--- a/src/components/base-page/enterprise-emergency/DisposalEvent.vue
+++ b/src/components/base-page/enterprise-emergency/DisposalEvent.vue
@@ -1,62 +1,72 @@
<template>
- <div class="disposal-event">
- <h3 class="panel-title">浜嬩欢鍩烘湰淇℃伅</h3>
- <el-form ref="form" :model="form" label-width="100px">
- <el-form-item label="浜嬩欢鍚嶇О锛�" prop="nameOfEvent">
- <label>{{ form.nameOfEvent }}</label>
- </el-form-item>
- <el-row>
- <el-col :span="12">
- <el-form-item label="浜嬩欢浣嶇疆锛�" prop="eventLocation">
- <label>{{ form.eventLocation }}</label>
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="浣嶇疆鎻忚堪锛�" prop="positionDesc">
- <label>{{ form.positionDesc }}</label>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row>
- <el-col :span="12">
- <el-form-item label="浜嬩欢鍗曚綅锛�" prop="incidentUnit">
- <label>{{ form.incidentUnit }}</label>
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="浜嬪彂鏃堕棿锛�" prop="atTime">
- <label>{{ form.atTime }}</label>
- </el-form-item>
- </el-col>
- </el-row>
- <el-form-item label="浜嬩欢鎻忚堪锛�" prop="eventDesc" class="fixed-width">
- <label>{{ form.eventDesc }}</label>
- </el-form-item>
- <el-form-item label="闄勪欢锛�" prop="upload">
- <label>
- <a href="javascript:">闄勪欢</a>
-
- <a href="javascript:">闄勪欢</a>
- </label>
- </el-form-item>
- </el-form>
- <h3 class="panel-title">棰勬鍖归厤</h3>
- <el-table :data="tableData" style="width: 100%">
- <el-table-column prop="name" label="棰勬鍚嶇О"></el-table-column>
- <el-table-column prop="define" label="棰勬瀹氫箟"></el-table-column>
- <el-table-column prop="hierarchy" label="棰勬灞傜骇"></el-table-column>
- <el-table-column prop="classification" label="棰勬鍒嗙被"></el-table-column>
- <el-table-column label="闄勪欢">
- <template>
- <a href="javascript:">棰勬</a>
- </template>
- </el-table-column>
- </el-table>
- <div class="event-management">
- <el-button type="primary" size="mini" @click="ToManagement">浜嬩欢澶勭疆</el-button>
- <el-button size="mini">鍏抽棴</el-button>
- </div>
+ <div class="disposal-event">
+ <h4 class="sub-title ">浜嬩欢鍩烘湰淇℃伅</h4>
+ <div :model="form">
+ <el-row>
+ <el-col class="info-label" :span="6">浜嬩欢鍚嶇О锛�</el-col>
+ <el-col class="info-text" :span="18">{{ form.nameOfEvent }}</el-col>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" :span="6">
+ 浜嬩欢浣嶇疆锛�
+ </el-col>
+ <el-col class="info-text" :span="18">
+ <label>{{ form.eventLocation }}</label>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" :span="6">
+ 浣嶇疆鎻忚堪锛�
+ </el-col>
+ <el-col class="info-text" :span="18">
+ <label>{{ form.positionDesc }}</label>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" :span="6">
+ 浜嬩欢鍗曚綅锛�
+ </el-col>
+ <el-col class="info-text" :span="18">
+ {{ form.incidentUnit }}
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" :span="6">
+ 浜嬪彂鏃堕棿锛�
+ </el-col>
+ <el-col class="info-text" :span="18">
+ {{ form.atTime }}
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" :span="6">浜嬩欢鎻忚堪锛�</el-col>
+ <el-col class="info-text" :span="18">{{ form.eventDesc }}</el-col>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" span="6">闄勪欢锛�</el-col>
+ <el-col class="info-text" :span="18"><a class="link-btn" href="javascript:">闄勪欢</a>
+
+ <a class="link-btn" href="javascript:">闄勪欢</a>
+ </el-col>
+ </el-row>
</div>
+ <h3 class="sub-title">棰勬鍖归厤</h3>
+ <el-table :data="tableData" style="width: 100%">
+ <el-table-column prop="name" label="棰勬鍚嶇О"></el-table-column>
+ <el-table-column prop="define" label="棰勬瀹氫箟"></el-table-column>
+ <el-table-column prop="hierarchy" label="棰勬灞傜骇"></el-table-column>
+ <el-table-column prop="classification" label="棰勬鍒嗙被"></el-table-column>
+ <el-table-column label="闄勪欢">
+ <template>
+ <a class="link-btn" href="javascript:">棰勬</a>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="event-management">
+ <el-button type="primary" size="mini" @click="ToManagement">寮�濮嬪垎鏋�</el-button>
+ <!-- <el-button size="mini">鍏抽棴</el-button>-->
+ </div>
+ </div>
</template>
<script>
@@ -110,31 +120,55 @@
}
},
methods: {
- // 浜嬩欢绠＄悊椤甸潰璺宠浆
+ // 寮�濮嬪垎鏋�
ToManagement () {
- eventBus.$emit('events-reported', true)
+ eventBus.$emit('event-handling', {})
}
}
}
</script>
<style lang="less" scoped>
- .fixed-width {
- width: 3.2459893rem;
- min-width: 3.2459893rem;
- }
+.disposal-event {
+ padding: 5px;
- /deep/ .el-form-item {
- margin: 5px 0;
- }
+ .fixed-width {
+ width: 3.2459893rem;
+ min-width: 3.2459893rem;
+ }
- /deep/ .el-form-item__label {
- color: @color;
- font-size: 0.08rem;
- }
+ /deep/ .el-form-item {
+ margin: 5px 0;
+ }
- .event-management {
- text-align: right;
- margin: 15px;
- }
+ /deep/ .el-form-item__label {
+ color: @color;
+ font-size: 0.08rem;
+ }
+
+ .event-management {
+ text-align: right;
+ margin: 15px;
+ }
+
+ .sub-title {
+
+ //color: @color-title;
+ padding: 5px;
+ font-size: 16px;
+ }
+
+ .link-btn {
+ color: @color-highlight;
+ }
+
+ .info-label {
+ text-align: right;
+ }
+
+ .info-text {
+ text-align: left;
+ }
+}
+
</style>
diff --git a/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue b/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue
index 5a36cb3..a4ec6ef 100644
--- a/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue
+++ b/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue
@@ -1,5 +1,6 @@
<template>
- <div>
+ <el-dialog :visible.sync="isShow" class="effect-vol-calc" title="鍒嗘瀽" :modal="false" v-dialog-drag
+ :before-close="handleClose">
<!--<!– 鍩烘湰淇℃伅–>-->
<!-- <event-base-info>-->
@@ -20,7 +21,7 @@
<effective-volume-calc ref="effectVolCalc"></effective-volume-calc>
<event-report-doc ref="eventReportDoc" :reportItemCon="reportItemCon"> </event-report-doc>
<res-info ref="resInfo"></res-info>
- </div>
+ </el-dialog>
</template>
@@ -30,15 +31,23 @@
import EffectiveVolumeCalc from '@components/base-page/enterprise-emergency/EffectiveVolumeCalc'
import EventReportDoc from '@components/base-page/enterprise-emergency/event-handling/EventReportDoc'
import ResInfo from '@components/base-page/enterprise-emergency/event-handling/ResInfo'
+import eventBus from '../../../../eventBus'
export default {
name: 'EventHandling',
components: { ResInfo, EventReportDoc, DisposalProposed, EffectiveVolumeCalc },
data () {
return {
+ isShow: false,
reportItemCon: {
popupType: 'aaa'
}
}
+ },
+ mounted () {
+ // this.wfsHelper = new WfsHelper()
+ eventBus.$on('event-handling', () => {
+ this.isShow = !this.isShow
+ })
},
methods: {
toggleShowCalc () {
@@ -56,7 +65,11 @@
report () {
console.log('鐢熸垚鎶ュ憡')
},
- close () { console.log('杩斿洖') }
+ close () { console.log('杩斿洖') },
+
+ handleClose () {
+ this.isShow = false
+ }
}
}
diff --git a/src/components/base-page/enterprise-emergency/event-handling/ResInfo.vue b/src/components/base-page/enterprise-emergency/event-handling/ResInfo.vue
index 4203ea9..f0c72f7 100644
--- a/src/components/base-page/enterprise-emergency/event-handling/ResInfo.vue
+++ b/src/components/base-page/enterprise-emergency/event-handling/ResInfo.vue
@@ -1,10 +1,10 @@
<template>
- <el-dialog :visible.sync="isShow" class="effect-vol-calc" title="鍛ㄨ竟璧勬簮淇℃伅" :modal="false" v-dialog-drag
+ <el-dialog :visible.sync="isShow" class="res-info-container" title="鍛ㄨ竟璧勬簮淇℃伅" :modal="false" v-dialog-drag
width="400" >
<el-row>
<el-col :span="3" style="text-align: center;">
- <el-row v-for="item in menuList" :key="item.id">
- <el-button type="primary" size="mini" @click="menuClickHandle(item)">{{ item.name }}</el-button>
+ <el-row v-for="(item,index) in menuList" :key="index">
+ <el-button type="primary" size="mini" :class="index===btnActive?'hover':''" @click="menuClickHandle(item,index)">{{ item.name }}</el-button>
</el-row>
<!--<el-row> <el-button type="primary" size="mini" @click="menuClickHandle">鍦ㄧ嚎鐩戞祴</el-button></el-row>-->
<!--<el-row> <el-button type="primary" size="mini" @click="menuClickHandle">搴旀�ヨ祫婧�</el-button></el-row>-->
@@ -13,7 +13,7 @@
</el-col>
<el-col :span="21">
<el-row>
- <el-button v-for="item in subMenuList" :key="item.name" type="primary" size="mini" @click="subMenuClickHandle(item)">{{ item.name }}</el-button>
+ <el-button v-for="(item,index) in subMenuList" :class="index===subBtnActive?'hover':''" :key="item.name" type="primary" size="mini" @click="subMenuClickHandle(item,index)">{{ item.name }}</el-button>
<!-- <el-button type="primary" size="mini" @click="subMenuClickHandle">澶栨帓鍙�(1)</el-button>-->
<!-- <el-button type="primary" size="mini" @click="subMenuClickHandle">闅旀补姹�(1)</el-button>-->
<!-- <el-button type="primary" size="mini" @click="subMenuClickHandle">鑺傛祦闃�(1)</el-button>-->
@@ -46,6 +46,8 @@
data () {
return {
isShow: false,
+ btnActive: 0,
+ subBtnActive: 0,
menuList: ResInfo.data,
subMenuList: ResInfo.data[0].child,
tableData: [
@@ -160,17 +162,41 @@
getVisible () {
return this.isShow
},
- menuClickHandle (item) {
- console.log(item)
+ menuClickHandle (item, index) {
+ this.btnActive = index
+ this.subBtnActive = 0
this.subMenuList = item.child
},
- subMenuClickHandle (subItem) {
+ subMenuClickHandle (subItem, index) {
+ this.subBtnActive = index
this.currentTableData.column = subItem.column
}
}
}
</script>
-<style scoped>
+<style lang="less">
+.res-info-container{
+ /deep/ .el-dialog {
+ left: 810px;
+ }
+
+ .el-dialog__header {
+ padding: 4px 10px;
+ }
+
+ .el-dialog__headerbtn {
+ top: 10px;
+ }
+ .hover{
+ color: @color-highlight;
+ border-color:@color-highlight;
+ }
+ .el-button:active .el-button--primary.is-active, .el-button--primary:active ,.el-button--primary:focus, .el-button--primary:hover{
+ background: @background-color;
+ color: @color-highlight;
+ border-color:@color-highlight;
+ }
+}
</style>
diff --git a/src/components/layer/src/layer.vue b/src/components/layer/src/layer.vue
index 03400c7..56522c5 100644
--- a/src/components/layer/src/layer.vue
+++ b/src/components/layer/src/layer.vue
@@ -2,7 +2,7 @@
<div class="public-bounced map-background" v-drag :style="style">
<div class="public-bounced-title panel-title" ref="publicBounced">
<span>{{ title }}</span>
- <i class="el-icon-close" @click="close"></i>
+ <i class="el-icon-close" style="font-size: 16px;" @click="close"></i>
</div>
<div class="public-bounced-content" :id="id"></div>
</div>
@@ -86,8 +86,8 @@
.public-bounced-title {
cursor: move;
- height: 0.1rem;
- padding: 10px 0;
+ //height: 0.1rem;
+ //padding: 10px 0;
display: flex;
align-items: center;
justify-content: space-between;
@@ -95,7 +95,7 @@
span {
color: #f4f7ff;
margin: 0 15px;
- font-size: 14px;
+ font-size: 16px;
}
i {
diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue
index b8fa510..6df7286 100644
--- a/src/components/panel/RightSearchPanel.vue
+++ b/src/components/panel/RightSearchPanel.vue
@@ -327,7 +327,7 @@
background: @background-color4;
color: @color-tool;
position: absolute;
- top: 24px;
+ top: 20px;
left: 0.02rem;
border: none; //1px solid @color-tool;
width: 0.2rem;
diff --git a/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue b/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
index cbe1309..860f6e1 100644
--- a/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
+++ b/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
@@ -108,8 +108,8 @@
// import WfsHelper from '@components/helpers/WfsHelper'
// import AjaxUtils from '@utils/AjaxUtils'
-// import DisposalEvent from '../../../base-page/enterprise-emergency/DisposalEvent'
-import EventHandling from '@components/base-page/enterprise-emergency/event-handling/EventHandling'
+import DisposalEvent from '../../../base-page/enterprise-emergency/DisposalEvent'
+// import EventHandling from '@components/base-page/enterprise-emergency/event-handling/EventHandling'
import eventBus from '../../../../eventBus'
import EventsReported from '../../../base-page/enterprise-emergency/events-reported/EventsReported'
@@ -162,29 +162,19 @@
},
// 寮�濮嬪垎鏋�
startAnalysis () {
- // eventBus.$emit('start-analysis', true)
+ eventBus.$emit('event-handling', {})
+ },
+ disposalfx () {
window.$layer.open({
content: {
- comp: EventHandling, // 缁勪欢
+ comp: DisposalEvent, // 缁勪欢
parent: this, // 鐖剁粍浠�
data: { // 浼犻�掔殑鍙傛暟
// info: this.info
}
},
- title: '浜嬩欢澶勭疆'
+ title: '浜嬩欢淇℃伅'
})
- },
- disposalfx () {
- // window.$layer.open({
- // content: {
- // comp: DisposalEvent, // 缁勪欢
- // parent: this, // 鐖剁粍浠�
- // data: { // 浼犻�掔殑鍙傛暟
- // // info: this.info
- // }
- // },
- // title: '浜嬩欢澶勭疆'
- // })
},
// radio鏁版嵁閫夋嫨
redioChange (item) {
diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue
index cfd9a1c..dd3b6ed 100644
--- a/src/views/MapTemplate.vue
+++ b/src/views/MapTemplate.vue
@@ -21,6 +21,7 @@
<Emergency ref="Emergency"></Emergency>
<Message></Message>
<EventsReported></EventsReported>
+ <event-handling></event-handling>
</div>
</template>
@@ -45,10 +46,12 @@
import MapManager from '../components/helpers/MapManager'
import Message from '@components/message/index'
import EventsReported from '../components/base-page/enterprise-emergency/events-reported/EventsReported'
+import EventHandling from '@components/base-page/enterprise-emergency/event-handling/EventHandling'
export default {
name: 'MapTemplate',
components: {
+ EventHandling,
// Enterprise,
LegendPanel,
// MenuSpecial,
--
Gitblit v1.8.0