fix-感叹号

app/src/api/index.js

@@ -261,3 +261,11 @@ export function getFhzdType(params) {
     params
   })
 }
+// 区县详情
+export function getQyrs(params) {
+  return request({
+    url: 'system/qyrs/pageList',
+    method: 'GET',
+    params
+  })
+}

app/src/views/Home/components/NewMapChartsCategory.vue

@@ -20,6 +20,10 @@
     </div>
     </div>
     <img v-if="showTip" class="imgs" src="../../../assets/images/dd_wh.png" alt="" @click="getShoeInfo('whFxModal')">
+    <img class="imgs-w" src="../../../assets/images/wenh.png" alt="" @click="showModuls">
+    <basic-modal top="120px" ref="basicInfoModals" name="区县详情">
+      <UnitInformation :qy="unitQx"/>
+    </basic-modal>
   </div>
   <!-- 风险问号弹窗 -->
   
@@ -30,10 +34,11 @@ import * as echarts from "echarts";
 import jsonCq from "@/assets/json/cq.json";
 import toolUtils from "@/utils/echartsTooltip";
 import { toInt } from '@/utils'
-
+import UnitInformation from "./UnitInformation.vue";
 
 export default {
   name: "MapCharts",
+  components:{UnitInformation},
   props: {
     qx: String,
     mapHeatData: {
@@ -270,11 +275,14 @@ export default {
         '黄色': '#fbff3d',
         '蓝色': '#35c2ff',
         '绿色': '#5aed9f'
-      }
+      },
+      showType:false,
+      unitQx:null
     };
   },
   watch: {
     qx(val) {
+      this.unitQx=val
       this.mapChart.dispatchAction({
         type: "select",
         name: val
@@ -591,6 +599,9 @@ export default {
     getShoeInfo(name){
       this.showModal(name);
     },
+    showModuls(){
+      this.showModal("basicInfoModals");
+    }
   },
 };
 </script>
@@ -599,7 +610,7 @@ export default {
 
 .legend {
   position: absolute;
-  bottom: 30px;
+  bottom: 50px;
   right: 20px;
 }
 .legend-item1{
@@ -644,7 +655,13 @@ export default {
 .imgs{
  position: absolute;
  right: 76px;
- bottom: 5px;
+ bottom: 25px;
+ cursor: pointer;
+}
+.imgs-w{
+  position: absolute;
+ right: 76px;
+ bottom: 0px;
  cursor: pointer;
 }
 </style>

app/src/views/Home/components/UnitInformation.vue

@@ -0,0 +1,326 @@
+<script>
+import { getQyrs } from "@/api/index.js";
+import { area } from "@/api/area";
+import punishmentMixin from "@/mixin/unit.js";
+import { hzfxLsit } from "@/api/hzfx.js";
+import moment from "moment";
+export default {
+  mixins: [punishmentMixin],
+  props: {
+    qy: String,
+    default: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      options: [],
+      options1: [
+        {
+          value: "是",
+          label: "是",
+        },
+        {
+          value: "否",
+          label: "否",
+        },
+      ],
+      fxdjList: [],
+      tableData: [],
+      unitList: [],
+      value: "重庆市",
+      params: {
+        pageSize: 10,
+        pageNum: 1,
+      },
+      total: 0,
+      times: [],
+    };
+  },
+  watch: {
+    qy: {
+      handler(val) {
+        this.value = val;
+        this.funUnitList();
+      },
+      immediate: true,
+    },
+    default: {
+      handler() {
+        let params = {};
+        if (this.default) {
+          Object.assign(params, this.default);
+        }
+        this.params = params;
+        this.funUnitList();
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
+  methods: {
+    rowClickHandler(val) {
+      // this.$router.push(`/detail?id=${val.id}`);
+    },
+    funUnitList() {
+      getQyrs({
+        ...this.params,
+        qx: this.value === "重庆市" ? "" : this.value,
+      }).then((res) => {
+        let list = res.data.rows;
+        console.log('--------->>.',list);
+        list.map((item) => {
+          if (item.zjccss) {
+            // item.zjccss
+            item.zjccss = (item.zjccss / 10000).toFixed(2);
+          }
+        });
+        this.tableData = list;
+        this.total = res.data.total;
+      });
+    },
+    handleSizeChange(val) {
+      this.params.pageSize = val;
+      this.funUnitList();
+    },
+    handleCurrentChange(val) {
+      this.params.pageNum = val;
+      this.funUnitList();
+    },
+    resetForm() {
+      this.qhyy1 = "";
+      this.zqsj = "";
+      this.sw = "";
+      this.value = "";
+      this.search = "";
+      this.qhsd = null;
+      (this.params = {
+        pageSize: 10,
+        pageNum: 1,
+      }),
+        // this.params.Unittype = ""; // 建筑分类
+        // this.params.year = ""; // 年代
+        // this.params.hnum = ""; //高度
+        // this.params.management = ""; //管理形式
+        // this.params.subject = ""; //管理主体
+        // this.params.maintenance = ""; //维保形式
+        // this.params.risklevel = ""; //风险等级
+        this.funUnitList();
+    },
+  },
+  created() {
+    area({
+      pageNum: 1,
+      pageSize: 100,
+    }).then((res) => {
+      this.options = res.data.rows;
+      let params = {};
+      if (this.default) {
+        Object.assign(params, this.default);
+      }
+      this.params = params;
+      this.funUnitList();
+    });
+  },
+};
+</script>
+
+<template>
+  <div>
+    <!-- 搜索 -->
+    <div class="maintenance-supervision">
+      <div class="maintenance-supervision_header">
+        <div class="select-item">
+          <el-select v-model="value" placeholder="请选择">
+            <el-option
+              :value="item.areaTitle"
+              :label="item.areaTitle"
+              v-for="(item, index) in options"
+              :key="index"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="btn-item">
+          <el-button @click="funUnitList">搜索</el-button>
+          <el-button @click="resetForm">重置</el-button>
+        </div>
+      </div>
+    </div>
+
+    <basic-table
+      :data="tableData"
+      @row-click="rowClickHandler"
+      style="text-align: center"
+    >
+      <el-table-column type="index" label="序号"> </el-table-column>
+      <el-table-column prop="qx" label="区县" show-overflow-tooltip>
+      </el-table-column>
+      <el-table-column prop="zqdd" label="高层建筑名称" show-overflow-tooltip>
+      </el-table-column>
+      <el-table-column prop="zqsj" label="起火时间" show-overflow-tooltip>
+      </el-table-column>
+      <el-table-column prop="rysws" label="亡人数（人）" show-overflow-tooltip>
+      </el-table-column>
+      <el-table-column prop="srs" label="伤人数（人）" show-overflow-tooltip>
+      </el-table-column>
+      <el-table-column prop="zjccss" label="直接经济损失（万元）">
+      </el-table-column>
+      <el-table-column prop="qhyy1" label="起火原因" show-overflow-tooltip>
+      </el-table-column>
+    </basic-table>
+    <br />
+    <basic-pagination
+      layout="total,->,prev, pager, next, sizes,jumper"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="params.pageSize"
+      :current-page="params.PageNum"
+      :total="total"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<style scoped lang="less">
+.maintenance-supervision {
+  // padding: 10px 10px 0px 20px;
+  ::v-deep(.el-input__inner) {
+    border: none;
+    background: linear-gradient(
+      360deg,
+      rgba(0, 148, 255, 0.5) 0%,
+      rgba(0, 148, 255, 0.31) 100%
+    );
+    color: #fff;
+  }
+
+  ::v-deep(.el-button) {
+    border: none;
+    background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
+    color: #fff;
+  }
+
+  .maintenance-supervision_header {
+    display: flex;
+    flex-wrap: wrap;
+    // justify-content: space-around;
+    // border-bottom: 1px solid #154956;
+    padding-bottom: 10px;
+    font-size: 12px;
+    color: rgb(79, 149, 186);
+  }
+
+  .btn-item {
+    margin-bottom: 10px;
+    margin-left: 20px;
+  }
+
+  .warp {
+    height: 520px;
+    margin: 0 auto;
+    overflow: hidden;
+
+    .item {
+      list-style: none;
+      padding: 0;
+      margin: 0 auto;
+      cursor: pointer;
+    }
+    &:hover {
+      overflow: auto;
+    }
+  }
+
+  /deep/.el-input__inner {
+    background-color: #184254;
+    width: 150px;
+    height: 30px;
+    margin-bottom: 5px;
+  }
+
+  /deep/.el-button {
+    width: 100px;
+    height: 32px;
+    font-size: 14px;
+    line-height: 2px;
+    // margin: 0 20px 0 30px;
+    color: #fff;
+    border-radius: 5px;
+    border: none;
+  }
+
+  /deep/.el-button:hover {
+    color: rgb(80, 147, 224);
+  }
+
+  /deep/.select_btn {
+    position: absolute;
+    top: 225px;
+    right: 320px;
+    //下拉框
+  }
+
+  /deep/.el-input {
+    width: 150px;
+    // margin-left: 20px;
+  }
+
+  .header {
+    color: #fff;
+    height: 33px !important;
+    line-height: 33px !important;
+    background-color: rgba(0, 163, 255, 0.3) !important;
+    color: #61dbff;
+    margin-top: 15px;
+    margin-bottom: 6px;
+  }
+
+  .row,
+  li,
+  a {
+    display: block;
+    height: 39px;
+    line-height: 39px;
+    margin-bottom: 4px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 16px;
+    background-color: rgba(0, 0, 0, 0.2);
+
+    .time,
+    .num,
+    .person,
+    .result {
+      flex: 0.33;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+
+    .num {
+      flex: 0.15;
+    }
+  }
+}
+
+.unit-bulid {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 20px;
+  font-size: 18px;
+}
+
+.unit-num {
+  width: 200px;
+  height: 109px;
+  border: 1px solid #0463a7;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-items: center;
+  line-height: 59px;
+}
+</style>