From 737a5478ab7f423acd7750003b0df9705ebbaecd Mon Sep 17 00:00:00 2001
From: yangdelong <828900aaa>
Date: 星期六, 29 五月 2021 17:37:46 +0800
Subject: [PATCH] 企业应急-事件处置-事件信息页面

---
 src/assets/css/map/map-panel-style.less                         |   21 +++++
 src/components/base-page/enterprise-emergency/DisposalEvent.vue |  195 +++++++++++++++++++++++++++++++-----------------
 2 files changed, 147 insertions(+), 69 deletions(-)

diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less
index 7ae3d48..1ec2a41 100644
--- a/src/assets/css/map/map-panel-style.less
+++ b/src/assets/css/map/map-panel-style.less
@@ -829,6 +829,27 @@
   padding: 5px;
   color: #f2f2f2;
 }
+.el-collapse-item__header {
+  display: flex;
+  align-items: center;
+  height: 48px;
+  line-height: 48px;
+  background-color: @background-color;
+  color: @color;
+  cursor: pointer;
+  border-bottom: 1px solid @color;
+  font-size: 13px;
+  font-weight: 500;
+  transition: border-bottom-color .3s;
+  outline: 0;
+}
+.el-collapse-item__wrap{
+  background-color: @background-color;
+
+}
+.el-collapse-item__content{
+  color: @color;
+}
 
 /************鎼滅储鏁版嵁鍒嗛〉鍔熻兘鎬绘暟閲忔牱寮忔坊鍔�************/
 .page_total {
diff --git a/src/components/base-page/enterprise-emergency/DisposalEvent.vue b/src/components/base-page/enterprise-emergency/DisposalEvent.vue
index e7eb185..6185a2f 100644
--- a/src/components/base-page/enterprise-emergency/DisposalEvent.vue
+++ b/src/components/base-page/enterprise-emergency/DisposalEvent.vue
@@ -1,72 +1,104 @@
 <template>
-  <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>
-          &nbsp;&nbsp;&nbsp;&nbsp;
-          <a class="link-btn" href="javascript:">闄勪欢</a>
-        </el-col>
-      </el-row>
+  <div>
+    <el-scrollbar >
+    <div class="disposal-event">
+<!--      <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 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>
+                  &nbsp;&nbsp;&nbsp;&nbsp;
+                  <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 class="link-btn" href="javascript:">棰勬</a>
+                </template>
+              </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>
-    <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>
+    </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>
@@ -77,6 +109,7 @@
   name: 'DisposalEvent',
   data () {
     return {
+      activeNames: ['1'],
       form: {
         nameOfEvent: '***************浜嬩欢',
         eventLocation: '**********瑁呯疆',
@@ -116,6 +149,23 @@
           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: ''
+        }
+
       ]
     }
   },
@@ -123,6 +173,15 @@
     // 寮�濮嬪垎鏋�
     ToManagement () {
       eventBus.$emit('event-handling', {})
+    },
+    handleClickView (item) {
+      console.log(item)
+    },
+    handleClickDownload (item) {
+      console.log(item)
+    },
+    handleChange (val) {
+      console.log(val)
     }
   }
 }
@@ -131,7 +190,7 @@
 <style lang="less" scoped>
 .disposal-event {
   padding: 5px;
-
+height: 400px;
   .fixed-width {
     width: 3.2459893rem;
     min-width: 3.2459893rem;
@@ -144,11 +203,6 @@
   /deep/ .el-form-item__label {
     color: @color;
     font-size: 0.08rem;
-  }
-
-  .event-management {
-    text-align: right;
-    margin: 15px;
   }
 
   .sub-title {
@@ -170,5 +224,8 @@
     text-align: left;
   }
 }
-
+.event-management {
+  text-align: right;
+  margin: 15px;
+}
 </style>

--
Gitblit v1.8.0