diff --git a/config/index.js b/config/index.js
index f2faac0..6d5aaf6 100644
--- a/config/index.js
+++ b/config/index.js
@@ -11,7 +11,7 @@ module.exports = {
     assetsPublicPath: '/',
     proxyTable: {
       '/api': {
-        target: 'http://192.168.0.35:8089/',
+        target: 'http://192.168.0.112:8085',
         changeOrigin: true,
         pathRewrite: {
           '^/api': ''
diff --git a/src/assets/map/emergency_rescue/i1.png b/src/assets/map/emergency_rescue/i1.png
new file mode 100644
index 0000000..a661849
Binary files /dev/null and b/src/assets/map/emergency_rescue/i1.png differ
diff --git a/src/assets/map/emergency_rescue/i10.png b/src/assets/map/emergency_rescue/i10.png
new file mode 100644
index 0000000..c99f84a
Binary files /dev/null and b/src/assets/map/emergency_rescue/i10.png differ
diff --git a/src/assets/map/emergency_rescue/i10_on.png b/src/assets/map/emergency_rescue/i10_on.png
new file mode 100644
index 0000000..cfc6d7d
Binary files /dev/null and b/src/assets/map/emergency_rescue/i10_on.png differ
diff --git a/src/assets/map/emergency_rescue/i11.png b/src/assets/map/emergency_rescue/i11.png
new file mode 100644
index 0000000..26429f1
Binary files /dev/null and b/src/assets/map/emergency_rescue/i11.png differ
diff --git a/src/assets/map/emergency_rescue/i11_on.png b/src/assets/map/emergency_rescue/i11_on.png
new file mode 100644
index 0000000..2c791ef
Binary files /dev/null and b/src/assets/map/emergency_rescue/i11_on.png differ
diff --git a/src/assets/map/emergency_rescue/i12.png b/src/assets/map/emergency_rescue/i12.png
new file mode 100644
index 0000000..081fc3b
Binary files /dev/null and b/src/assets/map/emergency_rescue/i12.png differ
diff --git a/src/assets/map/emergency_rescue/i12_on.png b/src/assets/map/emergency_rescue/i12_on.png
new file mode 100644
index 0000000..2c88e57
Binary files /dev/null and b/src/assets/map/emergency_rescue/i12_on.png differ
diff --git a/src/assets/map/emergency_rescue/i13.png b/src/assets/map/emergency_rescue/i13.png
new file mode 100644
index 0000000..23a974d
Binary files /dev/null and b/src/assets/map/emergency_rescue/i13.png differ
diff --git a/src/assets/map/emergency_rescue/i13_on.png b/src/assets/map/emergency_rescue/i13_on.png
new file mode 100644
index 0000000..98d2639
Binary files /dev/null and b/src/assets/map/emergency_rescue/i13_on.png differ
diff --git a/src/assets/map/emergency_rescue/i1_on.png b/src/assets/map/emergency_rescue/i1_on.png
new file mode 100644
index 0000000..6ed2b3e
Binary files /dev/null and b/src/assets/map/emergency_rescue/i1_on.png differ
diff --git a/src/assets/map/emergency_rescue/i2.png b/src/assets/map/emergency_rescue/i2.png
new file mode 100644
index 0000000..2f1ba2c
Binary files /dev/null and b/src/assets/map/emergency_rescue/i2.png differ
diff --git a/src/assets/map/emergency_rescue/i2_on.png b/src/assets/map/emergency_rescue/i2_on.png
new file mode 100644
index 0000000..20ea12d
Binary files /dev/null and b/src/assets/map/emergency_rescue/i2_on.png differ
diff --git a/src/assets/map/emergency_rescue/i3.png b/src/assets/map/emergency_rescue/i3.png
new file mode 100644
index 0000000..638740f
Binary files /dev/null and b/src/assets/map/emergency_rescue/i3.png differ
diff --git a/src/assets/map/emergency_rescue/i3_on.png b/src/assets/map/emergency_rescue/i3_on.png
new file mode 100644
index 0000000..91fa012
Binary files /dev/null and b/src/assets/map/emergency_rescue/i3_on.png differ
diff --git a/src/assets/map/emergency_rescue/i4.png b/src/assets/map/emergency_rescue/i4.png
new file mode 100644
index 0000000..d6b10b0
Binary files /dev/null and b/src/assets/map/emergency_rescue/i4.png differ
diff --git a/src/assets/map/emergency_rescue/i4_on.png b/src/assets/map/emergency_rescue/i4_on.png
new file mode 100644
index 0000000..243d01e
Binary files /dev/null and b/src/assets/map/emergency_rescue/i4_on.png differ
diff --git a/src/assets/map/emergency_rescue/i5.png b/src/assets/map/emergency_rescue/i5.png
new file mode 100644
index 0000000..23ffce2
Binary files /dev/null and b/src/assets/map/emergency_rescue/i5.png differ
diff --git a/src/assets/map/emergency_rescue/i5_on.png b/src/assets/map/emergency_rescue/i5_on.png
new file mode 100644
index 0000000..041a138
Binary files /dev/null and b/src/assets/map/emergency_rescue/i5_on.png differ
diff --git a/src/assets/map/emergency_rescue/i6.png b/src/assets/map/emergency_rescue/i6.png
new file mode 100644
index 0000000..089e138
Binary files /dev/null and b/src/assets/map/emergency_rescue/i6.png differ
diff --git a/src/assets/map/emergency_rescue/i6_on.png b/src/assets/map/emergency_rescue/i6_on.png
new file mode 100644
index 0000000..bfa2465
Binary files /dev/null and b/src/assets/map/emergency_rescue/i6_on.png differ
diff --git a/src/assets/map/emergency_rescue/i7.png b/src/assets/map/emergency_rescue/i7.png
new file mode 100644
index 0000000..2a7d764
Binary files /dev/null and b/src/assets/map/emergency_rescue/i7.png differ
diff --git a/src/assets/map/emergency_rescue/i7_on.png b/src/assets/map/emergency_rescue/i7_on.png
new file mode 100644
index 0000000..eb2c5f2
Binary files /dev/null and b/src/assets/map/emergency_rescue/i7_on.png differ
diff --git a/src/assets/map/emergency_rescue/i8.png b/src/assets/map/emergency_rescue/i8.png
new file mode 100644
index 0000000..2382598
Binary files /dev/null and b/src/assets/map/emergency_rescue/i8.png differ
diff --git a/src/assets/map/emergency_rescue/i8_on.png b/src/assets/map/emergency_rescue/i8_on.png
new file mode 100644
index 0000000..f2aff73
Binary files /dev/null and b/src/assets/map/emergency_rescue/i8_on.png differ
diff --git a/src/assets/map/emergency_rescue/i9.png b/src/assets/map/emergency_rescue/i9.png
new file mode 100644
index 0000000..be2c4ff
Binary files /dev/null and b/src/assets/map/emergency_rescue/i9.png differ
diff --git a/src/assets/map/emergency_rescue/i9_on.png b/src/assets/map/emergency_rescue/i9_on.png
new file mode 100644
index 0000000..33b18f1
Binary files /dev/null and b/src/assets/map/emergency_rescue/i9_on.png differ
diff --git a/src/assets/map/emergency_rescue/ico1.png b/src/assets/map/emergency_rescue/ico1.png
index 5741164..b868fbf 100644
Binary files a/src/assets/map/emergency_rescue/ico1.png and b/src/assets/map/emergency_rescue/ico1.png differ
diff --git a/src/assets/map/emergency_rescue/ico1_on.png b/src/assets/map/emergency_rescue/ico1_on.png
index 2fcc9ee..3d83464 100644
Binary files a/src/assets/map/emergency_rescue/ico1_on.png and b/src/assets/map/emergency_rescue/ico1_on.png differ
diff --git a/src/assets/map/emergency_rescue/ico2.png b/src/assets/map/emergency_rescue/ico2.png
index 44b4387..4b1506d 100644
Binary files a/src/assets/map/emergency_rescue/ico2.png and b/src/assets/map/emergency_rescue/ico2.png differ
diff --git a/src/assets/map/emergency_rescue/ico2_on.png b/src/assets/map/emergency_rescue/ico2_on.png
index 8447b3e..867d861 100644
Binary files a/src/assets/map/emergency_rescue/ico2_on.png and b/src/assets/map/emergency_rescue/ico2_on.png differ
diff --git a/src/assets/map/emergency_rescue/ico3.png b/src/assets/map/emergency_rescue/ico3.png
index 3277fcd..945abd3 100644
Binary files a/src/assets/map/emergency_rescue/ico3.png and b/src/assets/map/emergency_rescue/ico3.png differ
diff --git a/src/assets/map/emergency_rescue/ico3_on.png b/src/assets/map/emergency_rescue/ico3_on.png
index fb6c516..084ac6f 100644
Binary files a/src/assets/map/emergency_rescue/ico3_on.png and b/src/assets/map/emergency_rescue/ico3_on.png differ
diff --git a/src/assets/map/emergency_rescue/ico4.png b/src/assets/map/emergency_rescue/ico4.png
new file mode 100644
index 0000000..dd89344
Binary files /dev/null and b/src/assets/map/emergency_rescue/ico4.png differ
diff --git a/src/assets/map/emergency_rescue/ico4_on.png b/src/assets/map/emergency_rescue/ico4_on.png
new file mode 100644
index 0000000..c416438
Binary files /dev/null and b/src/assets/map/emergency_rescue/ico4_on.png differ
diff --git a/src/assets/map/emergency_rescue/ico5.png b/src/assets/map/emergency_rescue/ico5.png
new file mode 100644
index 0000000..a1d3900
Binary files /dev/null and b/src/assets/map/emergency_rescue/ico5.png differ
diff --git a/src/assets/map/emergency_rescue/ico5_on.png b/src/assets/map/emergency_rescue/ico5_on.png
new file mode 100644
index 0000000..1d1961b
Binary files /dev/null and b/src/assets/map/emergency_rescue/ico5_on.png differ
diff --git a/src/assets/map/emergency_rescue/img1.png b/src/assets/map/emergency_rescue/img1.png
deleted file mode 100644
index e4a4bde..0000000
Binary files a/src/assets/map/emergency_rescue/img1.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img10.png b/src/assets/map/emergency_rescue/img10.png
deleted file mode 100644
index d10cb4f..0000000
Binary files a/src/assets/map/emergency_rescue/img10.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img10_on.png b/src/assets/map/emergency_rescue/img10_on.png
deleted file mode 100644
index e29765b..0000000
Binary files a/src/assets/map/emergency_rescue/img10_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img1_on.png b/src/assets/map/emergency_rescue/img1_on.png
deleted file mode 100644
index 2719bad..0000000
Binary files a/src/assets/map/emergency_rescue/img1_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img2.png b/src/assets/map/emergency_rescue/img2.png
deleted file mode 100644
index 3201858..0000000
Binary files a/src/assets/map/emergency_rescue/img2.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img2_on.png b/src/assets/map/emergency_rescue/img2_on.png
deleted file mode 100644
index 3d2d2c5..0000000
Binary files a/src/assets/map/emergency_rescue/img2_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img3.png b/src/assets/map/emergency_rescue/img3.png
deleted file mode 100644
index 18d94f0..0000000
Binary files a/src/assets/map/emergency_rescue/img3.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img3_on.png b/src/assets/map/emergency_rescue/img3_on.png
deleted file mode 100644
index f31e992..0000000
Binary files a/src/assets/map/emergency_rescue/img3_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img4.png b/src/assets/map/emergency_rescue/img4.png
deleted file mode 100644
index 0ac8083..0000000
Binary files a/src/assets/map/emergency_rescue/img4.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img4_on.png b/src/assets/map/emergency_rescue/img4_on.png
deleted file mode 100644
index 1ad0558..0000000
Binary files a/src/assets/map/emergency_rescue/img4_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img5.png b/src/assets/map/emergency_rescue/img5.png
deleted file mode 100644
index 1fe78a2..0000000
Binary files a/src/assets/map/emergency_rescue/img5.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img5_on.png b/src/assets/map/emergency_rescue/img5_on.png
deleted file mode 100644
index 3ca7142..0000000
Binary files a/src/assets/map/emergency_rescue/img5_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img6.png b/src/assets/map/emergency_rescue/img6.png
deleted file mode 100644
index f033faa..0000000
Binary files a/src/assets/map/emergency_rescue/img6.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img6_on.png b/src/assets/map/emergency_rescue/img6_on.png
deleted file mode 100644
index 43b2b49..0000000
Binary files a/src/assets/map/emergency_rescue/img6_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img7.png b/src/assets/map/emergency_rescue/img7.png
deleted file mode 100644
index f55dece..0000000
Binary files a/src/assets/map/emergency_rescue/img7.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img7_on.png b/src/assets/map/emergency_rescue/img7_on.png
deleted file mode 100644
index e140491..0000000
Binary files a/src/assets/map/emergency_rescue/img7_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img8.png b/src/assets/map/emergency_rescue/img8.png
deleted file mode 100644
index 9ae1279..0000000
Binary files a/src/assets/map/emergency_rescue/img8.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img8_on.png b/src/assets/map/emergency_rescue/img8_on.png
deleted file mode 100644
index 55c267c..0000000
Binary files a/src/assets/map/emergency_rescue/img8_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img9.png b/src/assets/map/emergency_rescue/img9.png
deleted file mode 100644
index 0781aab..0000000
Binary files a/src/assets/map/emergency_rescue/img9.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/img9_on.png b/src/assets/map/emergency_rescue/img9_on.png
deleted file mode 100644
index f464a51..0000000
Binary files a/src/assets/map/emergency_rescue/img9_on.png and /dev/null differ
diff --git a/src/assets/map/emergency_rescue/menubg.png b/src/assets/map/emergency_rescue/menubg.png
new file mode 100644
index 0000000..b2e6b22
Binary files /dev/null and b/src/assets/map/emergency_rescue/menubg.png differ
diff --git a/src/assets/map/emergency_rescue/navbg.png b/src/assets/map/emergency_rescue/navbg.png
new file mode 100644
index 0000000..d196eb6
Binary files /dev/null and b/src/assets/map/emergency_rescue/navbg.png differ
diff --git a/src/assets/map/emergency_rescue/navbg_bak.png b/src/assets/map/emergency_rescue/navbg_bak.png
new file mode 100644
index 0000000..f42527e
Binary files /dev/null and b/src/assets/map/emergency_rescue/navbg_bak.png differ
diff --git a/src/assets/map/emergency_rescue/point/img1.png b/src/assets/map/emergency_rescue/point/img1.png
new file mode 100644
index 0000000..e1345ca
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img1.png differ
diff --git a/src/assets/map/emergency_rescue/point/img10.png b/src/assets/map/emergency_rescue/point/img10.png
new file mode 100644
index 0000000..f29dd17
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img10.png differ
diff --git a/src/assets/map/emergency_rescue/point/img11.png b/src/assets/map/emergency_rescue/point/img11.png
new file mode 100644
index 0000000..c8921fe
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img11.png differ
diff --git a/src/assets/map/emergency_rescue/point/img12.png b/src/assets/map/emergency_rescue/point/img12.png
new file mode 100644
index 0000000..8fdf4ce
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img12.png differ
diff --git a/src/assets/map/emergency_rescue/point/img13.png b/src/assets/map/emergency_rescue/point/img13.png
new file mode 100644
index 0000000..3871a42
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img13.png differ
diff --git a/src/assets/map/emergency_rescue/point/img2.png b/src/assets/map/emergency_rescue/point/img2.png
new file mode 100644
index 0000000..768be46
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img2.png differ
diff --git a/src/assets/map/emergency_rescue/point/img3.png b/src/assets/map/emergency_rescue/point/img3.png
new file mode 100644
index 0000000..396a10e
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img3.png differ
diff --git a/src/assets/map/emergency_rescue/point/img4.png b/src/assets/map/emergency_rescue/point/img4.png
new file mode 100644
index 0000000..efff498
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img4.png differ
diff --git a/src/assets/map/emergency_rescue/point/img5.png b/src/assets/map/emergency_rescue/point/img5.png
new file mode 100644
index 0000000..ccc9768
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img5.png differ
diff --git a/src/assets/map/emergency_rescue/point/img6.png b/src/assets/map/emergency_rescue/point/img6.png
new file mode 100644
index 0000000..778ddf5
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img6.png differ
diff --git a/src/assets/map/emergency_rescue/point/img7.png b/src/assets/map/emergency_rescue/point/img7.png
new file mode 100644
index 0000000..511806b
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img7.png differ
diff --git a/src/assets/map/emergency_rescue/point/img8.png b/src/assets/map/emergency_rescue/point/img8.png
new file mode 100644
index 0000000..117baa7
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img8.png differ
diff --git a/src/assets/map/emergency_rescue/point/img9.png b/src/assets/map/emergency_rescue/point/img9.png
new file mode 100644
index 0000000..24e7d71
Binary files /dev/null and b/src/assets/map/emergency_rescue/point/img9.png differ
diff --git a/src/assets/map/emergency_rescue/reset_point.png b/src/assets/map/emergency_rescue/reset_point.png
deleted file mode 100644
index 260a3d5..0000000
Binary files a/src/assets/map/emergency_rescue/reset_point.png and /dev/null differ
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index a897638..2cd8eb9 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -26,6 +26,7 @@ export default {
 .app-main {
   /* 50= navbar  50  */
   min-height: calc(100vh - 50px);
+  // height: 100vh;
   width: 100%;
   position: relative;
   overflow: hidden;
diff --git a/src/views/emergen_cyrescue/emergency_map/components/baseTable.vue b/src/views/emergen_cyrescue/emergency_map/components/baseTable.vue
new file mode 100644
index 0000000..13b4b27
--- /dev/null
+++ b/src/views/emergen_cyrescue/emergency_map/components/baseTable.vue
@@ -0,0 +1,239 @@
+<template>
+  <div class="infomation_area">
+    <div class="infomation_title" @click="clickIntoDutyInfoDialog">{{ titleType }}</div>
+    <table v-if="!isReservePlan" class="infomation_table" cellspacing="0">
+      <thead class="infomation_table_thead">
+        <tr class="infomation_table_thead_tr">
+          <th class="infomation_table_th">岗位</th>
+          <th class="infomation_table_th">姓名</th>
+          <th class="infomation_table_th">{{ phoneType }}</th>
+        </tr>
+      </thead>
+      <tbody class="infomation_table_tbody">
+        <tr v-for="(item, index) in showInfomationType" :key="index" class="infomation_table_tbody_tr">
+          <td>{{ item.job }}</td>
+          <td>{{ item.name }}</td>
+          <td>{{ item.phone }}</td>
+        </tr>
+      </tbody>
+    </table>
+
+    <div v-if="isReservePlan" class="reserve_plan">
+      <div class="reserve_plan_title">应急预案名称: {{ infomations.reservePlan.应急预案名称 }}</div>
+      <div class="scroll-box">
+        <ul class="reserve_plan_ul">
+          <li>预案编号: {{ infomations.reservePlan.预案编号 }}</li>
+          <li>适用领域: {{ infomations.reservePlan.适用领域 }}</li>
+        </ul>
+        <ul class="reserve_plan_ul">
+          <li>预案类别: {{ infomations.reservePlan.预案类别 }}</li>
+          <li>预案级别: {{ infomations.reservePlan.预案级别 }}</li>
+        </ul>
+        <ul class="reserve_plan_ul">
+          <li>编制单位: {{ infomations.reservePlan.编制单位 }}</li>
+          <li>编制人: {{ infomations.reservePlan.编制人 }}</li>
+        </ul>
+        <ul class="reserve_plan_ul">
+          <li>发布日期: {{ formatTime }}</li>
+          <li>发布文号: {{ infomations.reservePlan.发布文号 }}</li>
+        </ul>
+      </div>
+    </div>
+
+    <dialog-index :visible.sync="dutyInfoDialog.visible" />
+  </div>
+</template>
+
+<script>
+import dayjs from 'dayjs'
+import DialogIndex from './dialog.vue'
+
+export default {
+  components: { DialogIndex },
+  props: {
+    useType: {
+      type: String,
+      required: true
+    },
+    isReservePlan: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    infomations: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {
+      dutyInfoDialog: {
+        visible: false,
+        id: ''
+      }
+    }
+  },
+  computed: {
+    titleType: {
+      get: function() {
+        switch (this.useType) {
+          case 'dutyInfo': {
+            return '值班信息'
+          }
+          case 'reservePlanInfo': {
+            return '预案信息'
+          }
+          case 'addressBook': {
+            return '通讯录'
+          }
+          default:
+            return '标题'
+        }
+      }
+    },
+    phoneType: {
+      get: function() {
+        return this.useType === 'dutyInfo' ? '电话' : '手机号'
+      }
+    },
+    showInfomationType: {
+      get: function() {
+        return this.useType === 'dutyInfo' ? this.infomations.dutyInfoData : this.infomations.addressBook
+      }
+    },
+    formatTime: {
+      get: function() {
+        return dayjs(this.infomations.reservePlan.发布日期).format('YYYY-MM-DD')
+      }
+    }
+  },
+  methods: {
+    clickIntoDutyInfoDialog() {
+      this.dutyInfoDialog.visible = true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.infomation_area {
+  box-sizing: border-box;
+  padding: 12px;
+
+  .infomation_title {
+    cursor: pointer;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    padding-left: 51px;
+    color: #ffffff;
+    font-weight: 600;
+    height: 45px;
+    background-image: url('../../../../assets/map/emergency_rescue/navbg.png');
+    background-repeat: no-repeat;
+  }
+
+  .infomation_table {
+    width: 100%;
+
+    .infomation_table_thead {
+      height: 32px;
+      color: #ffffff;
+      background-image: linear-gradient(to right, rgba(255, 0, 0, 0), #0c305b, rgba(255, 0, 0, 0));
+
+      .infomation_table_thead_tr {
+        text-align: center;
+        padding: 10px 0;
+
+        &>th:nth-child(1) {
+          transform: translateX(-8px);
+        }
+
+        &>th:nth-child(3) {
+          transform: translateX(-15px);
+        }
+      }
+    }
+
+    .infomation_table_tbody {
+      height: 32px;
+      width: 100%;
+      color: #ffffff;
+      background: linear-gradient(90deg, rgba(44, 62, 80, 0) 20%, rgba(3, 39, 78, 0.75) 50%, rgba(3, 39, 78, 0) 80%);
+
+      .infomation_table_tbody_tr {
+        text-align: center;
+        height: 34px;
+        border-bottom: 1px solid rgba(3, 39, 78, 1);
+
+        &>td:nth-child(1) {
+          text-align: start;
+          transform: translateX(21px);
+        }
+
+        &>td:nth-child(3) {
+          transform: translateX(8px);
+        }
+      }
+    }
+  }
+
+  .infomation_table .infomation_table_tbody {
+    display: block;
+    height: 155px;
+    overflow-y: scroll;
+
+    &::-webkit-scrollbar {
+      display: none;
+    }
+  }
+
+  .infomation_table .infomation_table_thead,
+  .infomation_table_tbody .infomation_table_tbody_tr {
+    text-align: center;
+    display: table;
+    width: 100%;
+    table-layout: fixed;
+  }
+
+  .reserve_plan {
+    display: flex;
+    flex-direction: column;
+    gap: 5px;
+    justify-content: center;
+    align-items: flex-start;
+    padding: 8px;
+    color: #ffffff;
+    font-size: 15px;
+
+    .reserve_plan_title {
+      font-size: 16px;
+      display: flex;
+      width: 100%;
+      height: 40px;
+      border-bottom: 1px solid #0c2d53;
+      justify-content: flex-start;
+      align-items: center
+    }
+
+    .scroll-box {
+      height: 145px;
+      overflow-x: hidden;
+      overflow-y: auto;
+
+      &::-webkit-scrollbar {
+        display: none;
+      }
+
+      .reserve_plan_ul {
+        width: 100%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        height: 43px;
+        border-bottom: 1px solid #0c2d53;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/emergen_cyrescue/emergency_map/components/dialog.vue b/src/views/emergen_cyrescue/emergency_map/components/dialog.vue
new file mode 100644
index 0000000..1a333c9
--- /dev/null
+++ b/src/views/emergen_cyrescue/emergency_map/components/dialog.vue
@@ -0,0 +1,273 @@
+<template>
+  <el-dialog
+    :visible="visible"
+    :title="title"
+    :width="width"
+    append-to-body
+    custom-class="bi_enterprise_dialog"
+    top="5vh"
+    @close="handlerClose">
+    弹出框体内容
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    visible: {
+      type: Boolean,
+      required: true
+    },
+    value: {
+      type: Object,
+      default: () => ({})
+    },
+    title: {
+      type: String,
+      required: false,
+      default: '弹窗默认标题'
+    },
+    width: {
+      type: String,
+      default: '1350px'
+    }
+  },
+  data() {
+    return {}
+  },
+  methods: {
+    handlerClose() {
+      this.$emit('update:visible', false)
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.bi_enterprise_dialog {
+  background-color: #034cd473 !important;
+  border-radius: 8px !important;
+  width: 1600px;
+  min-height: 500px;
+  height: 600px;
+
+  .el-dialog__header {
+    border: none !important;
+  }
+
+  .el-dialog__headerbtn .el-dialog__close {
+    color: #cac7c7 !important;
+  }
+
+  .el-dialog__title {
+    color: #fff !important;
+  }
+
+  .el-table {
+    background-color: transparent !important;
+  }
+
+  .el-table tr {
+    background-color: #202e89 !important;
+    color: #fff !important;
+  }
+
+  .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
+    background-color: #202e89 !important;
+  }
+
+  .el-table th.el-table__cell.is-leaf,
+  .el-table td.el-table__cell {
+    border-bottom: 1px solid rgba(36, 81, 192, 0.48) !important;
+  }
+
+  .el-table--border .el-table__cell {
+    border-right: 1px solid rgba(36, 81, 192, 0.48) !important;
+  }
+
+  .el-table--group,
+  .el-table--border {
+    border-color: rgba(36, 81, 192, 0.48) !important;
+  }
+
+  .el-table::before,
+  .el-table--group::after,
+  .el-table--border::after {
+    background-color: rgba(36, 81, 192, 0.48) !important;
+  }
+
+  .el-table .el-table__header-wrapper tr th {
+    background-color: #1c2c96 !important;
+    color: #fff !important;
+  }
+
+  .pagination-container {
+    background-color: #202e89 !important;
+  }
+
+  .el-pagination {
+    color: #fff !important;
+  }
+
+  .el-pagination__total,
+  .el-pagination__jump {
+    color: #fff !important;
+  }
+
+  .el-input__inner {
+    background: #202e89;
+    color: #FFFFFF;
+    border: 1px solid #ffffff60 !important;
+  }
+
+  .el-pagination.is-background .btn-prev,
+  .el-pagination.is-background .btn-next,
+  .el-pagination.is-background .el-pager li {
+    margin: 0 5px;
+    background-color: #4174d1 !important;
+    color: #ffffff !important;
+    min-width: 30px;
+    border-radius: 2px;
+  }
+
+  .ui-foot {
+    position: absolute;
+    width: 100%;
+    bottom: 0;
+    height: 60px;
+    line-height: 60px;
+    background: none;
+    text-align: center;
+    z-index: 99;
+  }
+
+  .el-table--border th.el-table__cell {
+    border-bottom: 1px solid rgba(36, 81, 192, .48) !important;
+  }
+
+  .level-title {
+    color: #FFFFFF !important;
+  }
+
+  .el-dialog__body {
+    color: #fffdf4 !important;
+  }
+
+  .table-ui .tbg {
+    background: none;
+  }
+
+  .table-ui .tit {
+    background: none;
+    color: #FFFFFF;
+  }
+
+  .el-table__body tr.current-row>td.el-table__cell {
+    background: #1c2c96 !important;
+  }
+
+  .el-picker-panel {
+    color: #ffffff;
+    border: 1px solid #dfe4ed;
+    -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
+    background: #333aa8 !important;
+    border-radius: 4px;
+    line-height: 30px;
+    margin: 5px 0;
+  }
+
+  .el-card {
+    background: none !important;
+    color: #FFFFFF !important;
+  }
+
+  .el-card__header {
+    color: #FFFFFF !important;
+
+  }
+
+  .el-tree,
+  .el-tree-node:focus>.el-tree-node__content,
+  .el-tree-node__content:hover {
+    background-color: #202e89 !important;
+    color: #fff !important;
+  }
+
+  .bbg {
+    background: #202e89 !important;
+  }
+
+  .el-dialog__title {
+    font-size: 22px !important;
+  }
+
+  .el-table--small {
+    font-size: 20px !important;
+  }
+
+  .el-dialog__title {
+    font-size: 26px !important;
+  }
+
+  .el-button--mini {
+    font-size: 24px !important;
+  }
+
+  .el-table__cell {
+    font-size: 24px !important;
+  }
+
+  .table-ui td {
+    font-size: 24px !important;
+  }
+
+  .el-button--small {
+    font-size: 24px !important;
+  }
+
+  .el-card__header {
+    color: #fff !important;
+    font-size: 24px !important;
+  }
+
+  .app-container {
+    padding-bottom: 50px !important;
+  }
+
+  .level-title h1 {
+    font-size: 24px !important;
+  }
+
+  .el-pagination span:not([class*=suffix]),
+  .el-pagination button {
+    font-size: 24px;
+  }
+
+  .el-pagination__sizes .el-input .el-input__inner {
+    font-size: 24px;
+    padding-left: 8px;
+  }
+
+  .el-pagination .el-select .el-input {
+    width: 130px;
+    margin: 0 5px;
+  }
+
+  .el-input--small {
+    font-size: 24px;
+  }
+
+  .el-dialog__body {
+    font-size: 24px;
+  }
+
+  .el-table .cell {
+    line-height: 36px !important;
+  }
+
+  .el-scrollbar__wrap {
+    overflow-x: hidden !important;
+  }
+}
+</style>
diff --git a/src/views/emergen_cyrescue/emergency_map/components/mapAssembly.vue b/src/views/emergen_cyrescue/emergency_map/components/mapAssembly.vue
index 771ff3f..bb20536 100644
--- a/src/views/emergen_cyrescue/emergency_map/components/mapAssembly.vue
+++ b/src/views/emergen_cyrescue/emergency_map/components/mapAssembly.vue
@@ -1,132 +1,380 @@
 <template>
-  <div id="mapAssembly_container" class="mapAssembly-container">
+  <div class="map_assembly_container">
+
     <!-- 地图 -->
     <div id="map" />
 
-    <!-- 悬浮框主体 -->
-    <div class="mainer">
-
-      <div v-if="currentSelectPointAccident" class="center">
-        <div v-for="(item, index) in pointsList" :key="index" class="point" @click="handlePoint(item, index)">
-          <div class="rescue-box">
-            <img :src="item.check ? item.check_img : item.img" class="rescue-img" alt="">
-            <p class="rescue-text"> {{ item.label }} </p>
-          </div>
+    <div id="mapAssembly_container" class="body_container">
+      <div class="body_flex_box">
+        <!-- 左侧面板 -->
+        <div class="left">
+          <base-table :infomations="infomations" use-type="dutyInfo" />
+          <base-table :infomations="infomations" use-type="reservePlanInfo" is-reserve-plan />
+          <base-table :infomations="infomations" use-type="addressBook" />
+        </div>
+        <!-- 右侧面板 -->
+        <div class="right">
+          <!-- <chat /> -->
+          <sysChat :chat-data="chatData" @orderMessage="handlerOrderMessage" />
         </div>
       </div>
-
-      <div class="left">
-        <!-- 应急机构 -->
-        <div class="emergency-department">
-          <h2 class="department-title">应急机构</h2>
-          <div class="department-body">
-            <ul
-              v-for="(item, index) in expertGroupInfo"
-              :key="index"
-              class="department-ul"
-              @click="expertInfoItemClick(item, index)">
-              <li class="department-li">专家组名称: {{ item.EXPERT_GROUP_NAME }}</li>
-              <li class="department-li">联系电话: {{ item.CONTACT_TELEPHONE }}</li>
-            </ul>
-          </div>
+      <div class="top_search">
+        <span
+          v-for="(item, index) in rangeList"
+          :class="{ active: activeIndex === index }"
+          :key="index"
+          class="range_item"
+          @click="setActive(item, index)"
+        >{{ item }} 米</span>
+      </div>
+      <div class="bottom-center">
+        <div class="secon_modal">
+          <span v-for="(sos, ind) in currSubControlPoint" :key="ind" @click="subToggleCheck(sos, ind)">
+            <img :src="!sos.check ? sos.imgUrl : sos.check_img" alt="">
+            <p>{{ sos.label }}</p>
+          </span>
         </div>
-        <div class="line" />
-        <!-- 联系人方式 -->
-        <div class="contact-information">
-          <h2 class="contact-title">联系人方式</h2>
-          <div v-if="varList.length > 0">
-            <ul v-for="(item, index) in varList" :key="index" class="contact-ul">
-              <li class="contact-li">专家姓名: {{ item.GENDER }}</li>
-              <li class="contact-li">性别: {{ item.EXPERT_NAME }}</li>
-              <li class="contact-li">专家类型: {{ item.EXPERT_TYPE }}</li>
-              <li class="contact-li">专家姓名: {{ item.EXPERT_NAME }}</li>
-              <li class="contact-li">办公电话: {{ item.OFFICE_TELEPHONE }}</li>
-              <li class="contact-li">移动电话: {{ item.MOBILE_TELEPHONE }}</li>
-            </ul>
-          </div>
-          <div v-else class="contact-empty">
-            <span>暂无数据</span>
-          </div>
+        <div class="control_pointer">
+          <span v-for="(item, index) in controlPoint" :key="index" style="cursor: pointer;" @click="toggleCheck(item, index)">
+            <img :src="!item.check ? item.imgUrl : item.check_img" alt="">
+            <p>{{ item.label }}</p>
+          </span>
         </div>
       </div>
-
-      <!-- 对话框 -->
-      <div class="right">
-        <!-- 对话框组件渲染 -->
-        <chat />
-      </div>
-
     </div>
+
+    <dialog-index :visible.sync="infoDialog.visible" :value="{ id:infoDialog.id }" title="企业信息" />
   </div>
 </template>
 
 <script>
 import { requestFN } from '@/utils/request'
-import autofit from 'autofit.js'
-import chat from './chat.vue'
+import baseTable from './baseTable.vue'
+import sysChat from './sysChat.vue'
+import DialogIndex from './dialog.vue'
 
 let mapInstance
 
 export default {
-  components: { chat },
+  components: { baseTable, sysChat, DialogIndex },
   data() {
     return {
-      config: config,
-      pointsList: [
+      infomations: {
+        dutyInfoData: [
+          {
+            job: '值班领导',
+            name: '张三',
+            phone: '12939029382'
+          },
+          {
+            job: '值班员',
+            name: '李四',
+            phone: '14939029382'
+          },
+          {
+            job: '值班司机',
+            name: '玩股份',
+            phone: '10939029382'
+          },
+          {
+            job: '值班领导',
+            name: '张三',
+            phone: '12939029382'
+          },
+          {
+            job: '值班员',
+            name: '李四',
+            phone: '14939029382'
+          },
+          {
+            job: '值班司机',
+            name: '玩股份',
+            phone: '10939029382'
+          },
+          {
+            job: '值班领导',
+            name: '张三',
+            phone: '12939029382'
+          },
+          {
+            job: '值班员',
+            name: '李四',
+            phone: '14939029382'
+          },
+          {
+            job: '值班司机',
+            name: '玩股份',
+            phone: '10939029382'
+          }
+        ],
+        reservePlan: {
+          应急预案名称: '项目突发事件处理应急预案',
+          预案编号: '24590823424',
+          适用领域: '医疗行业',
+          预案类别: '自然灾害应急预案',
+          预案级别: '三级预案',
+          编制单位: '秦皇岛卓云科技',
+          编制人: '藏下午',
+          发布日期: '1722576942074',
+          发布文号: '234235423'
+        },
+        addressBook: [
+          {
+            job: '总经理',
+            name: '张三',
+            phone: '12939029382'
+          },
+          {
+            job: '总经理',
+            name: '李四',
+            phone: '14939029382'
+          },
+          {
+            job: '总经理',
+            name: '玩股份',
+            phone: '10939029382'
+          },
+          {
+            job: '总经理',
+            name: '张三',
+            phone: '12939029382'
+          },
+          {
+            job: '总经理',
+            name: '李四',
+            phone: '14939029382'
+          },
+          {
+            job: '总经理',
+            name: '玩股份',
+            phone: '10939029382'
+          }
+        ]
+      },
+      infoDialog: {
+        visible: false,
+        id: ''
+      },
+      activeIndex: 0,
+      rangeList: [20, 50, 100, 500, 1000, 5000],
+      mapIco: [
+        { id: 'e1899a925eb7478653007a9e7d17d588', ico: require('../../../../assets/map/emergency_rescue/point/img1.png') },
+        { id: 'ea3555185c6498b2d3d07023de723806', ico: require('../../../../assets/map/emergency_rescue/point/img2.png') },
+        { id: '52ddb251b528987c58c4d84fe0d83952', ico: require('../../../../assets/map/emergency_rescue/point/img3.png') },
+        { id: '7f3d41464cdf450422ffe385c3aa870e', ico: require('../../../../assets/map/emergency_rescue/point/img4.png') },
+        { id: '2ef8327624adad89b2dbf6b2e03ac6ef', ico: require('../../../../assets/map/emergency_rescue/point/img5.png') },
+        { id: 'e1899a925eb7478653007a9e7d17d588', ico: require('../../../../assets/map/emergency_rescue/point/img6.png') },
+        { id: '122abe9858feaecae1c80d2d851fcd57', ico: require('../../../../assets/map/emergency_rescue/point/img7.png') },
+        { id: '637b70684bddcfbee0421db1443a972a', ico: require('../../../../assets/map/emergency_rescue/point/img8.png') },
+        { id: '950700c9cd80c5e1b22a6c6cdf63a61d', ico: require('../../../../assets/map/emergency_rescue/point/img9.png') },
+        { id: '1edb69abc25785c02e2e475162d65b17', ico: require('../../../../assets/map/emergency_rescue/point/img10.png') },
+        { id: 'd25f2cae07902e373b72e74757e7a6ea', ico: require('../../../../assets/map/emergency_rescue/point/img11.png') },
+        { id: 'be31acea122c423a9dbb431cc66a1351', ico: require('../../../../assets/map/emergency_rescue/point/img12.png') },
+        { id: '759d323be34eae4bd83289b36af9ea47', ico: require('../../../../assets/map/emergency_rescue/point/img13.png') }
+      ],
+      controlPoint: [
         {
-          img: require('@/assets/map/emergency_rescue/ico1.png'),
-          check_img: require('@/assets/map/emergency_rescue/ico1_on.png'),
-          label: '分类一',
-          check: true,
-          type: 1
+          id: '0',
+          label: '应急资源',
+          imgUrl: require('../../../../assets/map/emergency_rescue/ico1.png'),
+          check_img: require('../../../../assets/map/emergency_rescue/ico1_on.png'),
+          check: true
         },
         {
-          img: require('@/assets/map/emergency_rescue/ico2.png'),
-          check_img: require('@/assets/map/emergency_rescue/ico2_on.png'),
-          label: '分类二',
-          check: false,
-          type: 2
+          id: '1',
+          label: '消防信息',
+          imgUrl: require('../../../../assets/map/emergency_rescue/ico2.png'),
+          check_img: require('../../../../assets/map/emergency_rescue/ico2_on.png'),
+          check: false
         },
         {
-          img: require('@/assets/map/emergency_rescue/ico3.png'),
-          check_img: require('@/assets/map/emergency_rescue/ico3_on.png'),
-          label: '更多',
-          check: false,
-          type: 3
+          id: '2',
+          label: '人员定位',
+          imgUrl: require('../../../../assets/map/emergency_rescue/ico3.png'),
+          check_img: require('../../../../assets/map/emergency_rescue/ico3_on.png'),
+          check: false
         },
         {
-          img: require('@/assets/map/emergency_rescue/reset_point.png'),
-          check_img: null,
-          label: '重置',
-          check: false,
-          type: 4
+          id: '3',
+          label: '视频监控',
+          imgUrl: require('../../../../assets/map/emergency_rescue/ico4.png'),
+          check_img: require('../../../../assets/map/emergency_rescue/ico4_on.png'),
+          check: false
+        },
+        {
+          id: '4',
+          label: '气象监测',
+          imgUrl: require('../../../../assets/map/emergency_rescue/ico5.png'),
+          check_img: require('../../../../assets/map/emergency_rescue/ico5_on.png'),
+          check: false
         }
       ],
-      // 列表查询参数
-      listQuery: {
-        page: 1,
-        limit: 10
+      ctlActiveIndex: 0,
+      subControlPoint: {
+        '0': [
+          {
+            id: '9b3b9451cf9a86b1e8a44c9a9b0de826',
+            label: '资料装备库',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i1.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i1_on.png'),
+            check: true
+          },
+          {
+            id: 'f61af43a0af59c86187913f9fe084588',
+            label: '应急避难场所',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i2.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i2_on.png'),
+            check: false
+          },
+          {
+            id: '7a38cf58e55995c0a5ce2c8e1f5bcc79',
+            label: '排水井',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i3.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i3_on.png'),
+            check: false
+          },
+          {
+            id: 'a0fd60946978e28dac5b8a2965e00a2b',
+            label: '封闭卡口',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i4.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i4_on.png'),
+            check: false
+          }
+        ],
+        '1': [
+          {
+            id: '1768cf2b0fb0844dedbb6db1dca3cc79',
+            label: '消防控制室',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i5.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i5_on.png'),
+            check: false
+          },
+          {
+            id: '18849e29cce63a9408117ca26186203b',
+            label: '消防泵房',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i6.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i6_on.png'),
+            check: false
+          },
+          {
+            id: 'da52ba25c3f15ad932b18fbd4d028062',
+            label: '消防水源',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i7.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i7_on.png'),
+            check: false
+          },
+          {
+            id: 'e241e3ef479ac7fb217c7b496816dc7e',
+            label: '消防点位',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i8.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i8_on.png'),
+            check: false
+          }
+        ],
+        '2': [
+          {
+            id: '93f7e01c8e4d906053916d314e1d3a2a',
+            label: '人员定位',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i9.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i9_on.png'),
+            check: false
+          },
+          {
+            id: '30fcda69c3eae93adbab78dea360b6b0',
+            label: '人员轨迹',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i10.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i10_on.png'),
+            check: false
+          }
+        ],
+        '3': [
+          {
+            id: '6ac1fc24fde38671ee70d7aebeed5276',
+            label: '摄像头',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i11.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i11_on.png'),
+            check: false
+          }
+        ],
+        '4': [
+          {
+            id: '3f858ab418dbf791353ba6ff87c59e85',
+            label: '气象站',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i12.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i12_on.png'),
+            check: false
+          },
+          {
+            id: '997392774d64efd8507c7c518c23fc44',
+            label: '风速站',
+            imgUrl: require('../../../../assets/map/emergency_rescue/i13.png'),
+            check_img: require('../../../../assets/map/emergency_rescue/i13_on.png'),
+            check: false
+          }
+        ]
       },
-      KEYWORDS: '',
-      /** 应急救援专家组状态变量 */
-      expertGroupInfo: [],
-      /** 存储某个专家组的所在成员 */
-      varList: [],
-      /** 当前选择的事故信息 */
-      currentSelectPointAccident: ''
+      // 当前点击后选择的二级坐标点位分类集合
+      currSubControlPoint: [],
+      subControlPointIndex: 0,
+      chatData: [
+        [
+          {
+            title: '刘大拿0',
+            content: '7月29日晚，清华毕业生马翔宇发出消息称：“感谢大家转发，目前我仍然是安全的。”并披露了部分录音',
+            isRead: true,
+            answers: [
+              {
+                personnal: '王晋升',
+                content: '上班第一天,没有红包怎么开启工作模式?',
+                isReady: false
+              },
+              {
+                personnal: '六大少',
+                content: '新年快乐,龙年大吉',
+                isReady: true
+              },
+              {
+                personnal: '王紧生',
+                content: '和张云雷送辅助喝',
+                isReady: false
+              }
+            ]
+          }
+        ],
+        [
+          {
+            title: '李彬',
+            content: '7月29日晚，清华毕业生马翔宇发出消息称：“感谢大家转发，目前我仍然是安全的。”并披露了部分录音',
+            isRead: true,
+            answers: [
+              {
+                personnal: '张晓武',
+                content: '上班第一天,没有红包怎么开启工作模式?',
+                isReady: false
+              },
+              {
+                personnal: '里核心',
+                content: '新年快乐,龙年大吉',
+                isReady: true
+              },
+              {
+                personnal: '干呼气',
+                content: '和张云雷送辅助喝',
+                isReady: true
+              }
+            ]
+          }
+        ]
+      ]
     }
   },
   mounted() {
-    // 使用 autofit 第三方库实现PC自适应屏幕
-    autofit.init({
-      el: '#mapAssembly_container',
-      resize: true
-    })
     /** 调用地图初始化方法 */
     this.mapInit()
     /** 调用初始化点位绘制方法 */
     this.initPoints()
-    this.getYjExpertGroupInfo()
+    /** 初始化选中首个二级坐标点位分类 */
+    this.currSubControlPoint = this.subControlPoint['0']
   },
   methods: {
     /** 地图初始化 */
@@ -135,6 +383,11 @@ export default {
       mapInstance.centerAndZoom(new window.BMapGL.Point('119.645516', '39.934547'), 15) // 创建点坐标
       mapInstance.enableScrollWheelZoom(true) // 开启鼠标滚轮缩放能力
     },
+    setActive(item, index) {
+      console.log('item :>> ', item)
+      // 设置被选中项的索引
+      this.activeIndex = index
+    },
     /** 扎点方法 */
     addPoint(anchor) {
       if (!anchor.iconUrl) throw new Error('请传入图标')
@@ -145,46 +398,21 @@ export default {
       const icon = new window.BMapGL.Icon(config.fileUrl + anchor.iconUrl, imageSize, { imageSize })
       const point = new window.BMapGL.Point(anchor.longitude, anchor.latitude)
       const marker = new window.BMapGL.Marker(point, { icon }) // 创建标注
-      const anchorOpts = {
-        width: 90,
-        height: 70,
-        title: '资源信息'
-      }
-      const infoWindow = new window.BMapGL.InfoWindow(`<p">资源名称: ${anchor.name || '无'}</p>`, anchorOpts)
-      marker.addEventListener('mouseover', () => {
-        mapInstance.openInfoWindow(infoWindow, point)
+      // const anchorOpts = {
+      //   width: 90,
+      //   height: 70,
+      //   title: '资源信息'
+      // }
+      // const infoWindow = new window.BMapGL.InfoWindow(`<p">资源名称: ${anchor.name || '无'}</p>`, anchorOpts)
+      // marker.addEventListener('mouseover', () => {
+      //   mapInstance.openInfoWindow(infoWindow, point)
+      // })
+
+      marker.addEventListener('click', async() => {
+        this.infoDialog.visible = true
       })
       mapInstance.addOverlay(marker) // 将标注添加到地图中
     },
-    handleClickInfo() {
-      console.log('你惦记了')
-    },
-    /** 标点的信息窗口控制器 */
-    infoWindowPointerController(config) {
-      const { point, marker, info } = config
-      var opts = {
-        width: 300,
-        height: 200,
-        title: '事故点位信息'
-      }
-      const sContent = `
-      <div>
-        <ul>
-          <li>机主姓名: ${info.accident.OWNER_NAME || '无'}</li>
-          <li>访问模式: ${info.accident.ACCESS_MODE || '无'}</li>
-          <li>呼入电话: ${info.accident.INCOMING_PHONE || '无'}</li>
-          <li>事件类型: ${info.accident.EVENT_TYPE || '无'}</li>
-          <li>接报时间: ${info.accident.REPORT_TIME || '无'}</li>
-          <li>发生时间: ${info.accident.OCCURRENCE_TIME || '无'}</li>
-          <li>救援情况: ${info.accident.RESCUE_SITUATION || '无'}</li>
-        </ul>  
-      </div>
-      `
-      const infoWindow = new window.BMapGL.InfoWindow(sContent, opts)
-      marker.addEventListener('mouseover', () => {
-        mapInstance.openInfoWindow(infoWindow, point)
-      })
-    },
     /** 给地图扎点标记事件事故 */
     addPointCallback(anchor) {
       if (!anchor.iconUrl) throw new Error('请传入图标')
@@ -202,9 +430,7 @@ export default {
         let nearbyResourcesList = []
         // 获取指定点位所对应的范围等详细信息
         this.currentSelectPointAccident = anchor
-
         const result = await this.getQueryScopeAsync(anchor)
-
         if (result.code === 200) {
           mapInstance.clearOverlays() // 清除地图上所有覆盖物
           const { accident, nearbyResources } = result.data
@@ -222,6 +448,31 @@ export default {
         }
       })
     },
+    infoWindowPointerController(config) {
+      const { point, marker, info } = config
+      var opts = {
+        width: 300,
+        height: 200,
+        title: '事故点位信息'
+      }
+      const sContent = `
+      <div>
+        <ul>
+          <li>机主姓名: ${info.accident.OWNER_NAME || '无'}</li>
+          <li>访问模式: ${info.accident.ACCESS_MODE || '无'}</li>
+          <li>呼入电话: ${info.accident.INCOMING_PHONE || '无'}</li>
+          <li>事件类型: ${info.accident.EVENT_TYPE || '无'}</li>
+          <li>接报时间: ${info.accident.REPORT_TIME || '无'}</li>
+          <li>发生时间: ${info.accident.OCCURRENCE_TIME || '无'}</li>
+          <li>救援情况: ${info.accident.RESCUE_SITUATION || '无'}</li>
+        </ul>
+      </div>
+      `
+      const infoWindow = new window.BMapGL.InfoWindow(sContent, opts)
+      marker.addEventListener('mouseover', () => {
+        mapInstance.openInfoWindow(infoWindow, point)
+      })
+    },
     /** 获取指定点位所在周围范围等详细信息 */
     getQueryScopeAsync(enterParams) {
       return new Promise((resolve, reject) => {
@@ -236,14 +487,6 @@ export default {
         })
       })
     },
-    /** 初始化定位点 */
-    getInfo(id) {
-      requestFN('/dictionaries/listTree').then((data) => {
-        this.treeData = JSON.parse(data.zTreeNodes)
-      }).catch((e) => {
-        console.error('获取树形数据失败', e)
-      })
-    },
     /** 初始化点位绘制方法 */
     async initPoints() {
       const result = await this.getAccidentList()
@@ -260,267 +503,201 @@ export default {
           }).catch((e) => { })
       })
     },
-    /** 初始化获取应急救援专家组 */
-    getYjExpertGroupInfo() {
-      requestFN(
-        '/yjExpertGroup/list?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page,
-        {
-          name: this.KEYWORDS
+    // 一级坐标点位点击事件
+    toggleCheck(item, index) {
+      // 遍历所有项，将点击项的 check 设置为 true，其他项的 check 设置为 false
+      this.controlPoint.forEach((item, idx) => {
+        if (idx === index) {
+          item.check = true
+        } else {
+          item.check = false
         }
-      ).then((data) => {
-        this.expertGroupInfo = data.varList
       })
-        .catch((e) => {
-          this.listISLOADing = false
-        })
+      console.log('item :>> ', item)
+      console.log('index :>> ', index)
+      this.currSubControlPoint = this.subControlPoint[index]
     },
-    /** 点击某一项专家组的处理事件 */
-    async expertInfoItemClick(item, index) {
-      requestFN(
-        '/yjExpertGroup/groupExpertlist?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page,
-        {
-          name: null,
-          id: item.EXPERT_GROUP_ID
+    // 二级坐标点位点击事件
+    subToggleCheck(sos, ind) {
+      this.currSubControlPoint.forEach((item, idx) => {
+        if (idx === ind) {
+          item.check = true
+        } else {
+          item.check = false
         }
-      ).then((data) => {
-        this.varList = data.varList
       })
-        .catch((e) => { })
+      console.log('sos :>> ', sos)
     },
-    /** 处理分类下的扎点坐标渲染任务 */
-    async baseClassifyPointer(type) {
-      mapInstance.clearOverlays() // 清除地图上所有覆盖物
-      let accidentParams = {}
-      let nearbyResourcesList = []
-      const response = await this.getQueryScopeAsync({
-        id: this.currentSelectPointAccident.id,
-        type
-      })
-      const { accident, nearbyResources } = response.data
-      accidentParams = accident
-      nearbyResourcesList = nearbyResources
-      const imageSize = new window.BMapGL.Size(33, 40)
-      const icon = new window.BMapGL.Icon(config.fileUrl + this.currentSelectPointAccident.iconUrl, imageSize, { imageSize }) // 创建 icon 图标
-      const point = new window.BMapGL.Point(accidentParams.LONGITUDE, accidentParams.LATITUDE)
-      const marker = new window.BMapGL.Marker(point, { icon })
-      mapInstance.addOverlay(marker)
-
-      if (nearbyResourcesList.length === 0) return
-      nearbyResourcesList.forEach(item => {
-        this.addPoint(item)
-      })
-    },
-    /** 处理点坐标 */
-    async handlePoint(item, index) {
-      switch (index) {
-        case 0: {
-          this.pointsList[index].check = !this.pointsList[index].check
-          this.baseClassifyPointer(item.type)
-          break
-        }
-        case 1: {
-          this.pointsList[index].check = !this.pointsList[index].check
-          this.baseClassifyPointer(item.type)
-          break
-        }
-        case 2: {
-          this.pointsList[index].check = !this.pointsList[index].check
-          this.baseClassifyPointer(item.type)
-          break
-        }
-        case 3: {
-          mapInstance.clearOverlays()
-          this.initPoints()
-        }
-      }
+    // 接收子组件传递出来的指令发送的事件
+    handlerOrderMessage() {
+      this.infoDialog.visible = true
     }
   }
 }
 </script>
 
 <style scoped lang="scss">
-.mapAssembly-container {
-  width: 100vw;
-  height: 100vh;
-  font-family: '微软雅黑', "宋体", "Arial Narrow", Helvetica, sans-serif;
-  overflow: hidden;
-  margin: 0;
+.map_assembly_container {
+  height: 100%;
+
+  position: relative;
 
   // 地图的宽高样式限制
   #map {
+    position: fixed;
+    left: 0;
+    top: 0;
     width: 100%;
-    height: 91%;
+    height: 100%;
   }
 
-  .mainer {
-    box-sizing: border-box;
+  .body_container {
+    position: absolute;
+    left: 0;
+    top: 0;
+    padding: 18px;
     width: 100%;
     height: 100%;
 
-    .center {
-      width: 340px;
-      position: absolute;
-      left: 50%;
-      top: 765px;
-      transform: translateX(-170px);
-      z-index: 99;
+    .body_flex_box {
+      height: 100%;
       display: flex;
-      flex-direction: row;
-      justify-content: space-between;
       align-items: center;
+      justify-content: space-between;
 
-      .point {
-        display: flex;
-        justify-content: center;
-        align-items: center;
+      .left,
+      .right {
+        box-sizing: border-box;
+        z-index: 99;
+        width: 380px;
+        height: 100%;
+        background-color: #000d27bd;
+        border-radius: 6px;
+        border: 2px solid #034383;
+      }
+
+      .left {
+        .scroll-box {
+          height: 40px;
+          overflow-x: hidden;
+          overflow-y: auto;
+        }
+      }
+
+      .right {
+        position: relative;
+        width: 410px;
+      }
+    }
+
+    .top_search {
+      z-index: 99;
+      position: absolute;
+      left: 405px;
+      top: 18px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      .range_item {
+        overflow: hidden;
         cursor: pointer;
-        width: 50px;
+        border-right: 1px solid #183c70;
+        display: inline-block;
+        width: 67px;
+        text-align: center;
+        height: 34px;
+        line-height: 34px;
+        color: #fff;
+        background-color: #223050;
+
+        &:first-child {
+          border-top-left-radius: 6px;
+          border-bottom-left-radius: 6px;
+        }
+
+        &:last-child {
+          border-top-right-radius: 6px;
+          border-bottom-right-radius: 6px;
+          border-right: none;
+        }
+
+        &.active {
+          background-color: #06417d;
+          color: #4aecff;
+        }
+      }
+    }
+
+    .bottom-center {
+      z-index: 99;
+      position: absolute;
+      bottom: 18px;
+      left: 50%;
+      transform: translateX(-50%);
+      width: calc(100% - 1123px);
+      min-width: 335px;
+      height: 80px;
+      background-image: url('../../../../assets/map/emergency_rescue/menubg.png');
+      background-repeat: no-repeat;
+      background-size: contain;
+      background-size: 100% 77px;
+
+      .secon_modal {
+        gap: 23px;
+        padding: 0 18px;
         height: 60px;
-      }
-
-      .rescue-box {
+        border-radius: 6px;
+        border: 1px solid #364260;
+        background-color: #214e8caf;
+        position: absolute;
+        left: 0px;
+        top: -75px;
         display: flex;
-        justify-content: center;
         align-items: center;
-        flex-direction: column;
-        width: 45px;
-        height: 45px;
+        justify-content: space-evenly;
 
-        .rescue-img {
-          width: 100%;
-          height: 100%;
-        }
-
-        .rescue-text {
-          margin: 0;
-          padding: 0;
-          color: rgb(0, 52, 221);
-          font-weight: 800;
-          font-size: 14px;
-        }
-      }
-    }
-
-    .left {
-      width: 477px;
-      height: 850px;
-      max-height: 850px;
-      background: rgba(20, 31, 168, .7);
-      border: 1px solid #0060d7;
-      z-index: 99;
-      position: absolute;
-      top: 20px;
-      left: 18px;
-      border-radius: 8px;
-      box-sizing: border-box;
-      padding: 12px;
-
-      // 应急机构样式
-      .emergency-department {
-        max-height: 420px;
-        overflow: auto;
-        border-radius: 8px;
-        width: 100%;
-
-        .department-title {
-          padding: 0;
-          margin: 0;
-          color: rgba(255, 255, 255, 1);
-          padding: 5px 0 5px 6px;
-          font-size: 21px;
-        }
-
-        .department-body {
-          height: 85%;
-          overflow: auto;
-
-          &::-webkit-scrollbar {
-            display: none;
-          }
-
-          .department-ul {
-            width: 100%;
-            margin-bottom: 9px;
-            border-radius: 8px;
-            padding: 5px;
-            display: flex;
-            flex-direction: column;
-            gap: 5px;
-            cursor: pointer;
-
-            &:hover {
-              box-shadow:
-                inset -1px -3px 4px rgba(255, 255, 255, .9), inset 8px 6px 12px rgba(0, 0, 0, .4);
-            }
-
-            .department-li {
-              color: rgb(255, 255, 255);
-            }
-          }
-        }
-      }
-
-      // 分割线条
-      .line {
-        width: 100%;
-        height: 1px;
-        border-bottom: 1px solid #fff;
-        margin: 10px 0;
-      }
-
-      // 联系人方式样式
-      .contact-information {
-        border-radius: 8px;
-        width: 100%;
-
-        .contact-title {
-          padding: 0;
-          margin: 0;
-          color: rgba(255, 255, 255, 1);
-          padding: 5px 0 5px 6px;
-          font-size: 21px;
-        }
-
-        .contact-ul {
-          max-height: 420px;
-          overflow: auto;
-          width: 100%;
-          margin-bottom: 9px;
-          border-radius: 8px;
-          padding: 5px;
+        & span {
+          cursor: pointer;
           display: flex;
-          flex-direction: column;
-          gap: 5px;
-
-          .contact-li {
-            color: rgb(255, 255, 255);
-          }
-        }
-
-        .contact-empty {
-          width: 100%;
-          height: 600px;
-          display: flex;
-          justify-content: center;
           align-items: center;
-          color: white;
+          justify-content: center;
+          flex-direction: column;
+        }
+
+        & img {
+          width: 30px;
+          height: 30px;
+          margin-bottom: 4px;
+        }
+
+        & p {
+          color: #ffffff;
+          margin: 0;
+          padding: 0;
+          font-size: 12px;
         }
       }
-    }
 
-    .right {
-      box-sizing: border-box;
-      z-index: 99;
-      background: rgba(20, 31, 168, .7);
-      border: 1px solid #0060d7;
-      width: 477px;
-      height: 850px;
-      max-height: 850px;
-      position: absolute;
-      top: 20px;
-      right: 265px;
-      border-radius: 8px;
-      padding: 12px;
+      .control_pointer {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: space-evenly;
+        position: absolute;
+        top: -23px;
+
+        & img {
+          width: 70px;
+          height: 70px;
+        }
+
+        & p {
+          color: #ffffff;
+          margin: 0;
+          padding: 0;
+        }
+      }
     }
   }
 }
diff --git a/src/views/emergen_cyrescue/emergency_map/components/sysChat.vue b/src/views/emergen_cyrescue/emergency_map/components/sysChat.vue
new file mode 100644
index 0000000..67e2344
--- /dev/null
+++ b/src/views/emergen_cyrescue/emergency_map/components/sysChat.vue
@@ -0,0 +1,167 @@
+<template>
+  <div class="sys_chat_container">
+    <div v-for="(item, ind) in chatData" :key="ind">
+      <div v-for="(itemChild, index) in item" :key="index" class="chat_body">
+        <p class="chat_title">{{ itemChild.title }}</p>
+        <p :class="{ 'ready': itemChild.isRead }" class="chat_content">{{ itemChild.content }}</p>
+
+        <p v-for="(answer, indx) in itemChild.answers" :key="indx" :class="{ 'ready': answer.isReady}" class="chat_item">
+          <span class="chat_item_head">{{ answer.personnal }}回复: </span>
+          <span class="chat_item_content">{{ answer.content }}</span>
+          <span v-if="answer.isReady" class="chat_ready">已读</span>
+        </p>
+      </div>
+    </div>
+    <div class="order">
+      <button @click="sendOrderBtn">发送指令</button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+
+  props: {
+    chatData: {
+      type: Array,
+      required: true
+    }
+  },
+  data() {
+    return {}
+  },
+  mounted() {
+    console.log(this.chatData, 'this.chatData')
+  },
+  methods: {
+    sendOrderBtn() {
+      this.$emit('orderMessage')
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.sys_chat_container {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 12px;
+  height: 100%;
+  overflow-x: hidden;
+  overflow-y: auto;
+  &::-webkit-scrollbar {
+    display: none;
+  }
+  color: #ffffff;
+  font-size: 15px;
+  position: relative;
+
+  & > h5, p, span {
+    padding: 0;
+    margin: 0;
+  }
+
+  .chat_body {
+    border-radius: 6px;
+    background: #0021649c;
+    width: 100%;
+    padding: 6px 0 0 18px;
+
+    .chat_title {
+      font-size: 16px;
+      padding: 8px 0;
+    }
+
+    .chat_content {
+      position: relative;
+      color: rgb(255, 255, 255);
+      // 小圆点伪类样式
+      &::before {
+        content: "";
+        display: block;
+        width: 8px;
+        height: 8px;
+        background-color: rgb(255, 0, 0);
+        position: absolute;
+        left: -12px;
+        top: 5px;
+        border-radius: 50%;
+      }
+    }
+
+    .chat_content.ready::before {
+      background-color: rgb(19, 223, 0);
+    }
+
+    .chat_item {
+      padding: 10px 0;
+      position: relative;
+      border-bottom: 1px solid rgb(15 57 123);
+
+      // 小圆点伪类样式
+      &::before {
+        content: "";
+        display: block;
+        width: 8px;
+        height: 8px;
+        background-color: rgb(255, 0, 0);
+        position: absolute;
+        left: -12px;
+        top: 14px;
+        border-radius: 50%;
+      }
+
+      .chat_item_head {
+        color: #1b6fae;
+      }
+
+      .chat_item_content {
+        font-size: 14px;
+      }
+
+      .chat_ready {
+        margin-left: 3px;
+        font-size: 12px;
+        background-color: #2b82cd;
+        color: #ffffff;
+        display: inline-block;
+        padding: 3px;
+        justify-content: center;
+        align-items: center;
+        border-radius: 4px;
+      }
+    }
+
+    .chat_item.ready::before {
+      background-color: rgb(19, 223, 0);
+    }
+
+    & > p:last-child {
+      border-bottom: none;
+    }
+  }
+
+  .order {
+    position: fixed;
+    bottom: 25px;
+    right: 25px;
+
+     & > button {
+      transition: all ease-in-out .3s;
+      cursor: pointer;
+      padding: 7px;
+      border-radius: 3px;
+      border: none;
+      background-color: #5f78ff47;
+      color: #fff;
+      font-weight: 600;backdrop-filter: blur(16px);
+
+      &:hover {
+        background-color: #5f77ff75;
+      }
+     }
+  }
+}
+</style>
diff --git a/src/views/emergen_cyrescue/emergency_map/index.vue b/src/views/emergen_cyrescue/emergency_map/index.vue
index 392c125..dae2aa2 100644
--- a/src/views/emergen_cyrescue/emergency_map/index.vue
+++ b/src/views/emergen_cyrescue/emergency_map/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <div>
-    <mapAssembly/>
+  <div class="emergency_map_container">
+    <mapAssembly />
   </div>
 </template>
 
@@ -15,5 +15,9 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.emergency_map_container {
+  box-sizing: border-box;
+  height: calc(100vh - 84px);
+}
 </style>