From 737a5478ab7f423acd7750003b0df9705ebbaecd Mon Sep 17 00:00:00 2001
From: yangdelong <828900aaa>
Date: 星期六, 29 五月 2021 17:37:46 +0800
Subject: [PATCH] 企业应急-事件处置-事件信息页面
---
src/components/base-page/enterprise-emergency/DisposalEvent.vue | 236 +++++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 157 insertions(+), 79 deletions(-)
diff --git a/src/components/base-page/enterprise-emergency/DisposalEvent.vue b/src/components/base-page/enterprise-emergency/DisposalEvent.vue
index 8cbb9b1..6185a2f 100644
--- a/src/components/base-page/enterprise-emergency/DisposalEvent.vue
+++ b/src/components/base-page/enterprise-emergency/DisposalEvent.vue
@@ -1,62 +1,104 @@
<template>
+ <div>
+ <el-scrollbar >
<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-collapse v-model="activeNames" @change="handleChange">-->
+<!-- <el-collapse-item title="浜嬩欢鍩烘湰淇℃伅" name="1">-->
+ <div>
+ <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 :span="12">
- <el-form-item label="浣嶇疆鎻忚堪锛�" prop="positionDesc">
- <label>{{ form.positionDesc }}</label>
- </el-form-item>
+ <el-col class="info-text" :span="18">
+ <label>{{ form.eventLocation }}</label>
</el-col>
- </el-row>
- <el-row>
- <el-col :span="12">
- <el-form-item label="浜嬩欢鍗曚綅锛�" prop="incidentUnit">
- <label>{{ form.incidentUnit }}</label>
- </el-form-item>
+ </el-row>
+ <el-row>
+ <el-col class="info-label" :span="6">
+ 浣嶇疆鎻忚堪锛�
</el-col>
- <el-col :span="12">
- <el-form-item label="浜嬪彂鏃堕棿锛�" prop="atTime">
- <label>{{ form.atTime }}</label>
- </el-form-item>
+ <el-col class="info-text" :span="18">
+ <label>{{ form.positionDesc }}</label>
</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="闄勪欢">
+ </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>
+ </div>
+<!-- </el-collapse-item>-->
+<!-- <el-collapse-item title="棰勬鍖归厤" name="2">-->
+ <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 href="javascript:;">棰勬</a>
+ <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" @click="close()">鍏抽棴</el-button>
- </div>
+ </el-table-column>
+ </el-table>
+ </div>
+<!-- </el-collapse-item>-->
+<!-- <el-collapse-item title="鐜鍒嗘瀽鎶ュ憡" name="3">-->
+ <div>
+ <h3 class="sub-title">鐜鍒嗘瀽鎶ュ憡</h3>
+ <el-table :data="envTableData" style="width: 100%">
+ <el-table-column prop="no" label="搴忓彿"></el-table-column>
+ <el-table-column prop="radius" label="鏌ヨ鍗婂緞"></el-table-column>
+ <el-table-column prop="reporterTime" label="鐢熸垚鎶ュ憡鏃堕棿"></el-table-column>
+ <el-table-column prop="classification" label="鎿嶄綔">
+ <template slot-scope="scope" >
+ <el-button class="link-btn" @click="handleClickView(scope.row)" type="text" size="small">鏌ョ湅</el-button>
+ <el-button class="link-btn" @click="handleClickDownload(scope.row)" type="text" size="small">涓嬭浇</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+<!-- </el-collapse-item>-->
+<!-- </el-collapse>-->
+
</div>
+ </el-scrollbar>
+ <div class="event-management">
+ <el-button type="primary" size="mini" @click="ToManagement">寮�濮嬪垎鏋�</el-button>
+ <!-- <el-button size="mini">鍏抽棴</el-button>-->
+ </div>
+ </div>
+
</template>
<script>
@@ -67,6 +109,7 @@
name: 'DisposalEvent',
data () {
return {
+ activeNames: ['1'],
form: {
nameOfEvent: '***************浜嬩欢',
eventLocation: '**********瑁呯疆',
@@ -106,48 +149,83 @@
hierarchy: '鍩哄眰鍗曚綅',
classification: '鐢熶骇'
}
+ ],
+ envTableData: [
+ {
+ no: '1',
+ radius: '500m',
+ reporterTime: '2021-6-1 18:00:00',
+ data: [],
+ downloadUrl: ''
+ },
+ {
+ no: '2',
+ radius: '1km',
+ reporterTime: '2021-6-1 18:00:00',
+ data: [],
+ downloadUrl: ''
+ }
+
]
}
},
methods: {
- // 浜嬩欢绠＄悊椤甸潰璺宠浆
+ // 寮�濮嬪垎鏋�
ToManagement () {
- eventBus.$emit('events-reported', true)
+ eventBus.$emit('event-handling', {})
},
- // 椤甸潰鍏抽棴
- close () {
- window.$layer.open({
- content: {
- comp: '',
- parent: this,
- data: { // 浼犻�掔殑鍙傛暟
- // info: this.info
- }
- },
- title: ''
- })
+ handleClickView (item) {
+ console.log(item)
+ },
+ handleClickDownload (item) {
+ console.log(item)
+ },
+ handleChange (val) {
+ console.log(val)
}
}
}
</script>
<style lang="less" scoped>
- .fixed-width {
- width: 3.2459893rem;
- min-width: 3.2459893rem;
- }
+.disposal-event {
+ padding: 5px;
+height: 400px;
+ .fixed-width {
+ width: 3.2459893rem;
+ min-width: 3.2459893rem;
+ }
- /deep/ .el-form-item {
- margin: 5px 0;
- }
+ /deep/ .el-form-item {
+ margin: 5px 0;
+ }
- /deep/ .el-form-item__label {
- color: @color;
- font-size: 0.08rem;
- }
+ /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;
+ }
+}
+.event-management {
+ text-align: right;
+ margin: 15px;
+}
</style>
--
Gitblit v1.8.0