Pārlūkot izejas kodu

Merge branch 'zz-test' into master

LAPTOP-U5GOA5HA\zz 1 gadu atpakaļ
vecāks
revīzija
8c3aff76d3

+ 107 - 76
app/src/views/FireCondition/components/FireDistribution.vue

@@ -1,158 +1,189 @@
-<template >
-  <div style="padding: 6px;">
+<template>
+  <div style="padding: 6px">
     <div>
       <button-group @change="changeHandler">
-        <button-group-item> <span style="color: #79e7ff;"> 火灾起数</span> </button-group-item>
-        <button-group-item> <span style="color: #79e7ff;"> 死亡人数 </span> </button-group-item>
+        <button-group-item>
+          <span style="color: #79e7ff"> 火灾起数</span>
+        </button-group-item>
+        <button-group-item>
+          <span style="color: #79e7ff"> 死亡人数 </span>
+        </button-group-item>
       </button-group>
     </div>
     <div>
       <div class="row header">
         <span class="type">序号</span>
         <span class="count">区县</span>
-        <span class="time">{{ ['火灾总数', '死亡人数'][idx]}}</span>
+        <span class="time">{{ ["火灾总数", "死亡人数"][idx] }}</span>
         <span class="unit">同比</span>
       </div>
-      <VueSeamlessScroll v-if="reload" :data="list" :class-option="classOption" class="warp">
+      <VueSeamlessScroll
+        v-if="reload"
+        :data="list"
+        :class-option="classOption"
+        class="warp"
+      >
         <ul class="item">
-          <li class="row" :class="{
-            active: item.isActive
-          }" v-for="(item, index) in list" :key="index" @click="openBasicModal1(item)">
+          <li
+            class="row"
+            :class="{
+              active: item.isActive,
+            }"
+            v-for="(item, index) in list"
+            :key="index"
+            @click="openBasicModal1(item)"
+          >
             <span class="type">{{ index + 1 }}</span>
             <span class="count">{{ item.qx }}</span>
-            <span class="time">{{ [item.bnhzqs, item.bnwrs ][idx] }}</span>
-            <span class="unit">{{ [item.hzPercent, item.wrPercent ][idx] }}
-              <img v-if="[item.hzIcon, item.wrIcon ][idx]" :src="[item.hzIcon, item.wrIcon ][idx]" alt="" />
+            <span class="time">{{ [item.bnhzqs, item.bnwrs][idx] }}</span>
+            <span class="unit"
+              >{{ [item.hzPercent, item.wrPercent][idx] }}
+              <img
+                v-if="[item.hzIcon, item.wrIcon][idx]"
+                :src="[item.hzIcon, item.wrIcon][idx]"
+                alt=""
+              />
             </span>
           </li>
         </ul>
       </VueSeamlessScroll>
     </div>
     <basic-modal top="120px" ref="basicInfoModal1" name="历史火灾查询">
-			<hzfbCont :qy="units" />
-		</basic-modal>
+      <hzfbCont :qy="units" />
+    </basic-modal>
   </div>
 </template>
 
 <script>
 import VueSeamlessScroll from "vue-seamless-scroll";
-import upIcon from '../../../assets/images/up-icon.svg';
-import downIcon from '../../../assets/images/down-icon.svg';
-import { fireDistribution } from '@/api/hzfx'
-import { toFirst } from '@/utils'
+import upIcon from "../../../assets/images/up-icon.svg";
+import downIcon from "../../../assets/images/down-icon.svg";
+import { fireDistribution } from "@/api/hzfx";
+import { toFirst } from "@/utils";
 import hzfbCont from "./hzfbCont.vue";
 
 export default {
-  name: 'FireDistribution',
+  name: "FireDistribution",
   components: {
     VueSeamlessScroll,
-    hzfbCont
+    hzfbCont,
   },
   props: {
-    qx: String
+    qx: String,
   },
   data() {
     return {
       idx: 0,
       list: [],
       reload: true,
-      units:''
+      units: "",
     };
   },
   created() {
-    this.loadData()
+    this.loadData();
   },
   watch: {
     qx() {
       this.loadData();
-    }
+    },
   },
   methods: {
     changeHandler(idx) {
       this.idx = idx;
-      this.list = toFirst(this.sortData(this.list), this.qx, 'qx')
+      this.list = toFirst(this.sortData(this.list), this.qx, "qx");
     },
     getPercent(bn, tq) {
       if (bn - tq === 0) {
-        return '—'
+        return "—";
       }
       if (tq === 0) {
-        return '—'
+        return "—";
       }
-      return `${(parseInt((Math.abs(bn - tq) / tq).toFixed(2) * 100 ))}%`
+      return `${parseInt((Math.abs(bn - tq) / tq).toFixed(2) * 100)}%`;
     },
     getIcon(bn, tq) {
-      if(tq === 0) {
+      if (tq === 0) {
         return null;
       }
-      if (bn -tq > 0) {
+      if (bn - tq > 0) {
         return upIcon;
-      } else if (bn - tq < 0){
+      } else if (bn - tq < 0) {
         return downIcon;
       } else {
         return null;
       }
     },
     sortData(tempData) {
-      const sub1 = tempData.filter(item => {
-        if (this.idx === 0) {
-          return item.hzIcon === upIcon
-        } else {
-          return item.wrIcon === upIcon
-        }
-      }).sort((a,b) => parseInt(b.hzPercent.replace("%", "")) - parseInt(a.hzPercent.replace("%", "")))
-      const sub2 = tempData.filter(item => {
-        if (this.idx === 0) {
-          return item.hzIcon === null
-        } else {
-          return item.wrIcon === null
-        }
-      })
-      const sub3 = tempData.filter(item => {
+      const sub1 = tempData
+        .filter((item) => {
+          if (this.idx === 0) {
+            return item.hzIcon === upIcon;
+          } else {
+            return item.wrIcon === upIcon;
+          }
+        })
+        .sort(
+          (a, b) =>
+            parseInt(b.hzPercent.replace("%", "")) -
+            parseInt(a.hzPercent.replace("%", ""))
+        );
+      const sub2 = tempData.filter((item) => {
         if (this.idx === 0) {
-          return item.hzIcon === downIcon
+          return item.hzIcon === null;
         } else {
-          return item.wrIcon === downIcon
+          return item.wrIcon === null;
         }
-      }).sort((a,b) =>  parseInt(a.hzPercent.replace("%", "")) - parseInt(b.hzPercent.replace("%", "")))
-      return [...sub1, ...sub2, ...sub3]
+      });
+      const sub3 = tempData
+        .filter((item) => {
+          if (this.idx === 0) {
+            return item.hzIcon === downIcon;
+          } else {
+            return item.wrIcon === downIcon;
+          }
+        })
+        .sort(
+          (a, b) =>
+            parseInt(a.hzPercent.replace("%", "")) -
+            parseInt(b.hzPercent.replace("%", ""))
+        );
+      return [...sub1, ...sub2, ...sub3];
     },
     loadData() {
-      this.reload = false
+      this.reload = false;
       fireDistribution({
         pageSize: 100,
         pageNum: 1,
-      }).then(res => {
-        let tempData = res.data.rows.map(item => ({...item,
+      }).then((res) => {
+        let tempData = res.data.rows.map((item) => ({
+          ...item,
           hzPercent: this.getPercent(item.bnhzqs, item.tqhzqs || 0),
           wrPercent: this.getPercent(item.bnwrs, item.tqwrs || 0),
           hzIcon: this.getIcon(item.bnhzqs, item.tqhzqs || 0),
           wrIcon: this.getIcon(item.bnwrs, item.tqwrs || 0),
-          isActive: item.qx === this.qx
-        }))
-        this.list = toFirst(this.sortData(tempData), this.qx, 'qx')
-        this.reload = true
-      })
+          isActive: item.qx === this.qx,
+        }));
+        this.list = toFirst(this.sortData(tempData), this.qx, "qx");
+        this.reload = true;
+      });
     },
     openBasicModal1(val) {
-     this.units=val.qx
-
-				this.showModal("basicInfoModal1");
-			}
+      this.units = val.qx;
+      this.showModal("basicInfoModal1");
+    },
   },
   computed: {
     classOption() {
       return {
         singleHeight: 51,
-        autoPlay: this.qx === "重庆市"
+        autoPlay: this.qx === "重庆市",
       };
     },
   },
-}
+};
 </script>
 
-<style scoped lang='less'>
-
+<style scoped lang="less">
 .warp {
   height: 521px;
   margin: 0 auto;
@@ -166,7 +197,7 @@ export default {
 }
 
 .header {
-  color: #61DBFF !important;
+  color: #61dbff !important;
   height: 38px !important;
   background-color: rgba(0, 163, 255, 0.3) !important;
   margin-top: 2px;
@@ -208,7 +239,7 @@ a {
   .time,
   .type,
   .count,
-  .unit{
+  .unit {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -220,15 +251,15 @@ a {
       margin-left: 5px;
     }
   }
-.count{
-  text-align: center;
-      display: inline-block;
-      overflow: hidden;
-      text-overflow: ellipsis !important; // 超出隐藏
-      white-space: nowrap;
-}
+  .count {
+    text-align: center;
+    display: inline-block;
+    overflow: hidden;
+    text-overflow: ellipsis !important; // 超出隐藏
+    white-space: nowrap;
+  }
   .time {
-    color: #61DBFF;
+    color: #61dbff;
   }
 }
 </style>

+ 1 - 0
app/src/views/Home/components/FireIndex/Chart.vue

@@ -128,6 +128,7 @@ export default {
       //   this.chart.clearLoop();
       // }
       // this.chart = loopShowTooltip(this.chart);
+  
       this.chart
     },
     reload() {

+ 13 - 5
app/src/views/Home/components/FireIndex/index.vue

@@ -2,7 +2,7 @@
   <div>
     <div class="fire-list">
     <!-- 火灾总数 -->
-    <div class="fire">
+    <div class="fire" @click="openFire">
       <div>
         <div>
           <span class="fire-num">{{ tbData.hzqs }}</span>
@@ -20,7 +20,7 @@
       </div>
     </div>
     <!--亡人  -->
-    <div class="fire">
+    <div class="fire" @click="openFire">
       <div>
         <div>
           <span class="fire-num">{{ tbData.wrs  }}</span>
@@ -38,7 +38,7 @@
       </div>
     </div>
     <!-- 伤人 -->
-    <div class="fire">
+    <div class="fire" @click="openFire">
       <div>
         <div>
           <span class="fire-num">{{ tbData.srs  }}</span>
@@ -56,7 +56,7 @@
       </div>
     </div>
     <!-- 直接经济损失 -->
-    <div class="fire">
+    <div class="fire" @click="openFire">
       <div>
         <div>
           <span class="fire-num">{{ tbData.zzjjss }}</span>
@@ -90,17 +90,21 @@
         <Chart :items="chartData" :label="chartLabel" />
       </div>
     </div>
+    <basic-modal top="120px" ref="basicInfoModal1" name="历史火灾查询">
+			<hzfbCont :qy="qx" />
+		</basic-modal>
   </div>
 </template>
 
 <script>
 import Chart from './Chart.vue'
 import { getSxzbListToatl, getQhyyListToatl, getHzzbSxzbYoy } from "@/api/index.js";
-
+import hzfbCont from '../../../FireCondition/components/hzfbCont.vue';
 export default {
   name: 'FireIndex',
   components: {
     Chart,
+    hzfbCont
   },
   props: {
     qx: String,
@@ -308,6 +312,9 @@ export default {
           }
         }
       })
+    },
+    openFire(){
+      this.showModal("basicInfoModal1");
     }
   },
   created() {
@@ -357,6 +364,7 @@ export default {
   display: flex;
   justify-content: space-around;
   align-items: center;
+  cursor: pointer;
   padding: 3px 0;
   border-radius: 2px;
   .fire-num {

+ 26 - 28
app/src/views/Home/components/HiddenDangerDetection/HiddenDangerType.vue

@@ -4,11 +4,11 @@
       <span>隐患类型</span>
       <span>单位:条</span>
     </div>
-   <div @click="showYh" style="cursor: pointer;">
-    <div ref="chart" class="item" style="width: 217px; height: 201px" />
-   </div>
-        <!-- 隐患 -->
-        <basic-modal top="120px" ref="yhModal" name="“一楼一策”隐患整治清单">
+    <div @click="showYh" style="cursor: pointer">
+      <div ref="chart" class="item" style="width: 217px; height: 201px" />
+    </div>
+    <!-- 隐患 -->
+    <basic-modal top="120px" ref="yhModal" name="“一楼一策”隐患整治清单">
       <YhModalContent :default="yhModal" />
     </basic-modal>
   </div>
@@ -21,14 +21,13 @@ import toolUtils from "@/utils/echartsTooltip";
 export default {
   props: {
     yhType: Array,
-    
   },
-  components:{YhModalContent},
+  components: { YhModalContent },
   data() {
     return {
       chart: null,
       timer: "",
-      yhModal:{}
+      yhModal: {},
     };
   },
   watch: {
@@ -104,11 +103,11 @@ export default {
                 rich: {
                   value: {
                     fontSize: 15,
-                    color: '#44F1FF',
-                    padding: [0,0,10, 15],
-                  }
+                    color: "#44F1FF",
+                    padding: [0, 0, 10, 15],
+                  },
                 },
-              }
+              },
             },
             labelLine: {
               show: true,
@@ -116,10 +115,10 @@ export default {
               length2: 90,
               lineStyle: {
                 color: "#fff",
-                type: 'dashed'
-              }
+                type: "dashed",
+              },
             },
-            labelLayout:  (params) => {
+            labelLayout: (params) => {
               const isLeft = params.labelRect.x < this.chart.getWidth() / 3;
               const points = params.labelLinePoints;
               // Update the end point.
@@ -127,10 +126,10 @@ export default {
                 ? params.labelRect.x
                 : params.labelRect.x + params.labelRect.width;
               return {
-                labelLinePoints: points
+                labelLinePoints: points,
               };
             },
-            data:data
+            data: data,
           },
           {
             type: "pie",
@@ -139,24 +138,23 @@ export default {
             hoverAnimation: false,
             z: 10,
             label: {
-              show: false
+              show: false,
             },
             tooltip: {
               show: false,
             },
-            data: data.map(item => ({
+            data: data.map((item) => ({
               value: item.value,
               name: item.name,
-                itemStyle: {
-                  // normal: {
-                  //   color: 'rgba(0,0,0, .3)'
-                  // }
-                }
+              itemStyle: {
+                // normal: {
+                //   color: 'rgba(0,0,0, .3)'
+                // }
+              },
             })),
             labelLine: {
               show: false,
             },
-
           },
           // 外边框虚线
           {
@@ -215,9 +213,9 @@ export default {
       }
       return dataArr;
     },
-    showYh(){
-      this.showModal('yhModal')
-    }
+    showYh() {
+      this.showModal("yhModal");
+    },
   },
 };
 </script>

+ 13 - 1
app/src/views/Home/components/HiddenDangerDetection/RectificationChart.vue

@@ -4,22 +4,31 @@
       <span>整改进度</span>
       <span>单位:条</span>
     </div>
-    <div ref="chart" class="item" style="width: 234px; height: 201px" />
+    <div @click="showYh">
+      <div ref="chart" class="item" style="width: 234px; height: 201px" />
+    </div>
+    <!-- 隐患 -->
+    <basic-modal top="120px" ref="yhModal" name="“一楼一策”隐患整治清单">
+      <YhModalContent :default="yhModal" />
+    </basic-modal>
   </div>
 </template>
 
 <script>
 import * as echarts from "echarts";
 import toolUtils from "@/utils/echartsTooltip";
+import YhModalContent from "../../../Detail/components/YhModalContent.vue";
 export default {
   props: {
     ScheduletList: Array,
   },
   name: "RectificationChart",
+  components: { YhModalContent },
   data() {
     return {
       chart: null,
       timer: "",
+      yhModal: {},
     };
   },
   watch: {
@@ -201,6 +210,9 @@ export default {
       }
       return dataArr;
     },
+    showYh() {
+      this.showModal("yhModal");
+    },
   },
 };
 </script>

+ 12 - 5
app/src/views/Home/index.vue

@@ -35,14 +35,14 @@
       </div>
     </div>
     <div>
-      <border-panel height="311px" style="margin-bottom: 6px" title="风险预警">
+      <border-panel height="311px" style="margin-bottom: 6px; cursor: pointer;" title="风险预警" @click="openBasicModal">
         <RiskWarning :riskList="riskList"  />
       </border-panel>
-      <border-panel height="331px" style="margin-bottom: 6px" title="智慧消防">
+      <border-panel height="331px" style="margin-bottom: 6px; cursor: pointer;" title="智慧消防" @click="openFrieModal1" >
         <WisdomFire :frieList="frieList" :iotList="iotList" />
       </border-panel>
       <border-panel height="298px" title="火灾指标">
-        <FireIndex :type="fireIndexType" :qx="qy"/>
+        <FireIndex :type="fireIndexType" :qx="qy" />
         <template #ext-header>
           <button-block :items="['月', '年']" @select-item="selectItemHandler" />
         </template>
@@ -51,6 +51,9 @@
     <basic-modal top="120px" ref="basicInfoModal" name="基础信息">
       <BasicInfoModalContent :qy="qy" />
     </basic-modal>
+    <basic-modal top="120px" ref="feirModal1" name="智慧消防">
+      <fxfbCont :qx="qy" />
+    </basic-modal>
   </div>
 </template>
 <script>
@@ -64,6 +67,7 @@ import WisdomFire from "./components/WisdomFire.vue";
 import FireIndex from "./components/FireIndex/index.vue";
 import BasicInfoModalContent from "./components/BasicInfoModalContent.vue";
 import SearchBox from '@/components/SearchBox.vue';
+import fxfbCont from '../Iot/components/fxfbCont.vue'
 import { totaldata,getJqdt,getZxgjtj ,getJrjzsbs} from "@/api/index.js";
 export default {
   name: "HomePage",
@@ -77,6 +81,7 @@ export default {
     HiddenDangerDetection,
     FireIndex,
     BasicInfoModalContent,
+    fxfbCont,
     SearchBox
   },
   data(){
@@ -130,7 +135,6 @@ export default {
     getFireList(){
       getZxgjtj({...this.params,name:this.qy==="重庆市"?"":this.qy}).then(res=>{
        this.frieList=res.data.rows[0]
-       console.log('------',this.frieList);
       })
     },
     // 物联网栋数
@@ -139,7 +143,10 @@ export default {
         this.iotList=res.data.rows[0]
         
       })
-    }
+    },
+    openFrieModal1() {
+      this.showModal("feirModal1");
+    },
   },
   created(){
     this.getList()