Home Explore Help
Register Sign In
TwoKe
/
zhgkpt-datav
1
0
Fork 0
Files Issues 0 Wiki
Browse Source

Merge branch 'master' into liuxing

liuxing 1 year ago
parent
01a6ae20fe 5ba9d5ae34
commit
254d43b8dc
28 changed files with 446 additions and 345 deletions
Split View Show Diff Stats
  1. 1 1
      app/index.html
  2. 1 1
      app/src/api/management.js
  3. 13 14
      app/src/assets/css/base.css
  4. 5 4
      app/src/assets/css/main.css
  5. 1 1
      app/src/components/PieChart3D.vue
  6. 10 4
      app/src/views/Basic/components/BuildingStatistics.vue
  7. 3 2
      app/src/views/Basic/components/ChronologicDistributionStatistics.vue
  8. 27 8
      app/src/views/Basic/components/Regional.vue
  9. 8 3
      app/src/views/Basic/index.vue
  10. 26 12
      app/src/views/Fire/components/Management.vue
  11. 10 2
      app/src/views/Fire/components/UnitInfo.vue
  12. 7 1
      app/src/views/FireCondition/components/FireDistribution.vue
  13. 5 0
      app/src/views/FireCondition/components/FireHistory.vue
  14. 10 6
      app/src/views/Home/components/AlarmingSituationDynamics.vue
  15. 4 7
      app/src/views/Home/components/BasicInfo.vue
  16. 58 48
      app/src/views/Home/components/FirstHight.vue
  17. 4 4
      app/src/views/Home/components/HiddenDangerDetection/HiddenDangerType.vue
  18. 5 5
      app/src/views/Home/components/HiddenDangerDetection/RectificationChart.vue
  19. 29 17
      app/src/views/Iot/components/AlarmHandling.vue
  20. 27 12
      app/src/views/Iot/components/RegionalDistribution.vue
  21. 18 17
      app/src/views/Iot/index.vue
  22. 1 1
      app/src/views/PoliceSituation/components/MobilizeStrength.vue
  23. 6 6
      app/src/views/PoliceSituation/index.vue
  24. 37 48
      app/src/views/Risk/components/Investigation.vue
  25. 5 0
      app/src/views/Risk/components/RiskDanger.vue
  26. 123 117
      app/src/views/Risk/components/Riskdistribution.vue
  27. 1 3
      app/vite.config.js
  28. 1 1
      utils/request.js

+ 1 - 1
app/index.html
View File 

@@ -1,5 +1,5 @@
 
 <!DOCTYPE html>
 
-<html lang="en">
 
+<html lang="zh-CN">
 
   <head>
 
     <meta charset="UTF-8" />
 
     <link rel="icon" href="/favicon.ico" />

+ 1 - 1
app/src/api/management.js
View File 

@@ -42,7 +42,7 @@ export function getGlzts(params) {
 
  */
 
 export function getWbxxs(params) {
 
   return request({
 
-    url: '/system/wbxx/list',
 
+    url: '/system/xfgl/gcjzgl/wbxx/list',
 
     method: 'get',
 
     params
 
   })

+ 13 - 14
app/src/assets/css/base.css
View File 

@@ -23,22 +23,21 @@ a,a:hover{color:#333;}
 
 input {
 
   border: none;
 
   -moz-appearance: none;
 
-  -webkit-appearance: none; /*解决ios上按钮的圆角问题*/
 
-  border-radius: 0; /*解决ios上输入框圆角问题*/
 
-  outline: medium; /*去掉鼠标点击的默认黄色边框*/
 
+  -webkit-appearance: none;
 
+  border-radius: 0;
 
+  outline: medium;
 
   background-color: transparent;
 
 
-  &:-webkit-autofill {
 
+  
+}
 
+input:-webkit-autofill {
 
     -webkit-box-shadow: 0 0 0px 1000px white inset;
 
   }
 
-
 
-  &[type=number] {
 
-    -moz-appearance: textfield;
 
-  }
 
-
 
-  &[type=number]::-webkit-inner-spin-button,
 
-  &[type=number]::-webkit-outer-spin-button {
 
-    -webkit-appearance: none;
 
-    margin: 0;
 
-  }
 
+input[type=number] {
 
+  -moz-appearance: textfield;
 
+}
 
+input[type=number]::-webkit-inner-spin-button,
 
+input[type=number]::-webkit-outer-spin-button {
 
+  -webkit-appearance: none;
 
+  margin: 0;
 
 }

+ 5 - 4
app/src/assets/css/main.css
View File 

@@ -1,11 +1,11 @@
 
 @import "./base.css";
 
 
 @font-face {
 
-  font-family: 'abel';/*声明一个名为iconfont的字体变量*/
 
+  font-family: 'abel';
 
   src: url('../fonts/Abel-Regular.ttf') format('truetype');
 
 }
 
 @font-face {
 
-  font-family: 'YouSheBiaoTiHei';/*声明一个名为iconfont的字体变量*/
 
+  font-family: 'YouSheBiaoTiHei';
 
   src: url('../fonts/YouSheBiaoTiHei.ttf') format('truetype');
 
 }
 
 
@@ -14,8 +14,6 @@ html,body {
 
   width: 100vw;
 
   font-family: 'abel';
 
   color: #fff;
 
-  /* background: url("@/assets/images/homebg.png") center no-repeat; */
 
-  /* background-size: 100% 100%; */
 
   background-color: #070b13;
 
 }
 
 
@@ -61,3 +59,6 @@ html,body {
 
 .amap-copyright {
 
   display: none !important;
 
 }
 
+
 
+
 
+

+ 1 - 1
app/src/components/PieChart3D.vue
View File 

@@ -275,7 +275,7 @@ function getPie3D(pieData, internalDiameterRatio) {
 
   }
 
   // 准备待返回的配置项，把准备好的 legendData、series 传入。
 
   const option = {
 
-    color: ["#1162fe", "#3fc865", "#a8fce3", "#5ef8c9", "#5ed3f8", "#5e92f8"],
 
+    color: ["#1162fe", "#3fc865", "#FF7A00", "#5ef8c9", "#5ed3f8", "#5e92f8"],
 
     legend: {
 
       // type: "scroll",
 
       data: legendData,

+ 10 - 4
app/src/views/Basic/components/BuildingStatistics.vue
View File 

@@ -74,7 +74,6 @@ export default {
 
   watch: {
 
     list: {
 
       handler(val) {
 
-        console.log('00000000',val);
 
         this.dataList = val;
 
       },
 
       immediate: true,
 
@@ -201,13 +200,20 @@ a {
 
     display: flex;
 
     justify-content: center;
 
     align-items: center;
 
+    display: inline-block;
 
+    overflow: hidden;
 
+    text-overflow: ellipsis;
 
+    white-space: nowrap;
 
+    text-align: center;
 
   }
 
 
   .time {
 
     cursor: pointer;
 
-    flex: 0.2;
 
+    flex: 0.15;
 
+  }
 
+  .count {
 
+    flex:1;
 
   }
 
-
 
   .type {
 
     flex: 0.12;
 
   }
 
@@ -218,7 +224,7 @@ a {
 
 
   .unit {
 
     cursor: pointer;
 
-    flex: 0.35;
 
+    flex: 0.19;
 
   }
 
 }

+ 3 - 2
app/src/views/Basic/components/ChronologicDistributionStatistics.vue
View File 

@@ -10,7 +10,7 @@ export default {
 
   props: {
 
     list: {
 
       type: Array,
 
-      default: [],
 
+      default: () => [],
 
     },
 
   },
 
   watch: {
 
@@ -40,6 +40,7 @@ export default {
 
         const iData = [new Date(`${p.jcnd}-01-01 00:00:00`), p.sl];
 
         data.push(iData);
 
       });
 
+      console.log(data.length)
 
       chart.setOption({
 
         tooltip: {
 
           trigger: "axis",
 
@@ -81,7 +82,7 @@ export default {
 
           {
 
             type: "time",
 
             gridIndex: 0,
 
-            splitNumber: data.length / 10,
 
+            splitNumber: 5,
 
             splitLine: {
 
               show: true,
 
               lineStyle: {

+ 27 - 8
app/src/views/Basic/components/Regional.vue
View File 

@@ -7,9 +7,11 @@
 
       <span class="unit">有物联网(栋)</span>
 
       <span class="is_notice">占比%</span>
 
     </div>
 
-    <VueSeamlessScroll :class-option="classOption" :data="dataList" class="warp">
 
+    <VueSeamlessScroll v-if="reload" :class-option="classOption" :data="dataList" class="warp">
 
       <ul class="item">
 
-        <li class="row" v-for="(item, index) in dataList" :key="index">
 
+        <li class="row" :class="{
 
+          active: item.isActive
 
+        }" v-for="(item, index) in dataList" :key="index">
 
           <span class="type">{{ index + 1 }}</span>
 
           <span class="count">{{ item.qx }}</span>
 
           <span class="time">{{ item.zs }}</span>
 
@@ -31,18 +33,25 @@ export default {
 
   props: {
 
     list: {
 
       type: Array,
 
-      default: [],
 
+      default: () => [],
 
     },
 
+    qx: String
 
   },
 
   data() {
 
 	return {
 
-		dataList: []
 
+		dataList: [],
 
+    reload: true
 
 	}
 
   },
 
   watch:{
 
 	list: {
 
 		handler(val) {
 
+      this.reload = false
 
 			this.dataList = val
 
+      let timer = setTimeout(() => {
 
+       this.reload = true
 
+       timer && clearTimeout(timer)
 
+      }, 100);
 
 		},immediate: true,
 
 		deep: true
 
 	}
 
@@ -51,6 +60,7 @@ export default {
 
     classOption() {
 
       return {
 
         singleHeight: 51,
 
+        autoPlay: this.qx === '重庆市'
 
       };
 
     },
 
   },
 
@@ -82,7 +92,9 @@ export default {
 
     font-size: 10px;
 
   }
 
 }
 
-
 
+li.row.active {
 
+  background-color: rgba(0, 213, 255, 0.2);
 
+}
 
 li.row > span {
 
   text-align: center;
 
   font-size: 14x;
 
@@ -111,12 +123,14 @@ a {
 
 
   .time,
 
   .type,
 
-  .count,
 
+
 
   .unit,
 
   .is_notice {
 
     display: flex;
 
+    flex: 0.15;
 
     justify-content: center;
 
     align-items: center;
 
+    text-align: center;
 
   }
 
 
   .time {
 
@@ -128,12 +142,17 @@ a {
 
   }
 
 
   .count {
 
-    flex: 0.2;
 
+    flex: 0.25;
 
+    // display: inline-block;
 
+      overflow: hidden ;
 
+      text-overflow: ellipsis ;
 
+      white-space:nowrap;
 
+      text-align: center;
 
   }
 
 
   .unit {
 
     color: #61dbff;
 
-    flex: 0.35;
 
+    flex: 0.25;
 
   }
 
 
   .is_notice {

+ 8 - 3
app/src/views/Basic/index.vue
View File 

@@ -47,7 +47,7 @@
 
     </div>
 
     <div>
 
       <border-panel height="521px" style="margin-bottom: 6px" title="区域分布">
 
-        <Regional :list="qyfbList" v-if="qyfbList && qyfbList.length > 0" />
 
+        <Regional :list="qyfbList" :qx="qy" v-if="qyfbList && qyfbList.length > 0" />
 
       </border-panel>
 
       <border-panel height="421px" style="margin-bottom: 6px" title="建筑统计">
 
         <BuildingStatistics
 
@@ -66,6 +66,7 @@ import HeightDistribution from "./components/HeightDistribution.vue";
 
 import ChronologicDistributionStatistics from "./components/ChronologicDistributionStatistics.vue";
 
 import MapCharts from "../Home/components/MapCharts.vue";
 
 import SearchBox from "@/components/SearchBox.vue";
 
+import { toFirst } from '../../utils'
 
 import {
 
   getJztj,
 
   getQyfbList,
 
@@ -119,9 +120,12 @@ export default {
 
       );
 
       getQyfbList({
 
         ...this.params,
 
-        qx: this.qy === "重庆市" ? "" : this.qy,
 
       }).then((res) => {
 
-        this.qyfbList = res.data.rows;
 
+        const data = res.data.rows.map(item => ({
 
+          ...item,
 
+          isActive: item.qx === this.qy
 
+        }));
 
+        this.qyfbList = toFirst(data, this.qy, 'qx')
 
       });
 
       getNdfbtj({
 
         ...this.params,
 
@@ -137,6 +141,7 @@ export default {
 
       });
 
       getGdfbtj({
 
         ...this.params,
 
+        pageSize: 1000,
 
         qx: this.qy === "重庆市" ? "" : this.qy,
 
       }).then((res) => {
 
         this.gdfbtjList = res.data.rows;

+ 26 - 12
app/src/views/Fire/components/Management.vue
View File 

@@ -19,12 +19,16 @@
 
         <span class="time">管理单位名称</span>
 
         <span class="result">管理建筑数</span>
 
       </div>
 
-      <VueSeamlessScroll :data="gldListL" :class-option="classOption" class="warp">
 
+      <VueSeamlessScroll
 
+        :data="gldListL"
 
+        :class-option="classOption"
 
+        class="warp"
 
+      >
 
         <ul class="item">
 
           <li class="row" v-for="(item, index) in gldListL" :key="index">
 
             <span class="num">{{ index + 1 }}</span>
 
-            <span class="time">{{ item.glzthztjzd}}</span>
 
-            <span class="person" >{{ item.gljzs}}</span>
 
+            <span class="time">{{ item.glzthztjzd }}</span>
 
+            <span class="person">{{ item.gljzs }}</span>
 
             <!-- <span class="result"
 
                   :style="{
 
                     color: resultType(item[2])
 
@@ -42,7 +46,11 @@
 
         <span class="time">维保单位名称</span>
 
         <span class="person">维保建筑数</span>
 
       </div>
 
-      <VueSeamlessScroll :data="wbdwList" :class-option="classOption" class="warp">
 
+      <VueSeamlessScroll
 
+        :data="wbdwList"
 
+        :class-option="classOption"
 
+        class="warp"
 
+      >
 
         <ul class="item">
 
           <li class="row" v-for="(item, index) in wbdwList" :key="index">
 
             <span class="num">{{ index + 1 }}</span>
 
@@ -65,7 +73,11 @@
 
         <span class="person">入住单位数</span>
 
         <!-- <span class="result">是否存在隐患</span> -->
 
       </div>
 
-      <VueSeamlessScroll :data="JzrzdList" :class-option="classOption" class="warp">
 
+      <VueSeamlessScroll
 
+        :data="JzrzdList"
 
+        :class-option="classOption"
 
+        class="warp"
 
+      >
 
         <ul class="item">
 
           <li class="row" v-for="(item, index) in JzrzdList" :key="index">
 
             <span class="num">{{ index + 1 }}</span>
 
@@ -89,14 +101,13 @@ import VueSeamlessScroll from "vue-seamless-scroll";
 
 export default {
 
   name: "MaintenanceSupervision",
 
   props: {
 
-    gldListL:Array,
 
-    JzrzdList:Array,
 
-    wbdwList:Array
 
+    gldListL: Array,
 
+    JzrzdList: Array,
 
+    wbdwList: Array,
 
   },
 
   data() {
 
     return {
 
       checked: 0,
 
-     
     };
 
   },
 
   components: {
 
@@ -121,9 +132,7 @@ export default {
 
         否: "#df575b",
 
       }[text];
 
     },
 
-   
   },
 
-
 
 };
 
 </script>
 
 
@@ -185,11 +194,16 @@ export default {
 
     }
 
     .time {
 
       flex: 1;
 
+      text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
     }
 
     .result {
 
       flex: 0.35;
 
     }
 
-    .person{
 
+    .person {
 
       color: #61dbff;
 
     }
 
   }

+ 10 - 2
app/src/views/Fire/components/UnitInfo.vue
View File 

@@ -96,8 +96,8 @@
 
         <ul class="item">
 
           <li class="row" v-for="(item, index) in list4" :key="index">
 
             <span class="time">{{ item[0] }}</span>
 
-            <span class="person">{{ item[1] }}</span>
 
-            <span class="result">{{ item[2] }}</span>
 
+            <span class="person ellipsis">{{ item[1] }}</span>
 
+            <span class="result ellipsis">{{ item[2] }}</span>
 
           </li>
 
         </ul>
 
       </VueSeamlessScroll>
 
@@ -235,6 +235,7 @@ export default {
 
     margin-bottom: 6px;
 
   }
 
 
+ 
   .row,
 
   li,
 
   a {
 
@@ -255,7 +256,13 @@ export default {
 
       display: flex;
 
       justify-content: center;
 
       align-items: center;
 
+      // 超出隐藏
 
+      display: inline-block;
 
+      overflow: hidden ;
 
+      text-overflow: ellipsis ;
 
+      white-space:nowrap;
 
     }
 
+
 
     .num {
 
       flex: 0.15;
 
     }
 
@@ -263,6 +270,7 @@ export default {
 
 }
 
 
 
+
 
 /deep/.el-input__inner {
 
   background-color: #184254;
 
   width: 120px;

+ 7 - 1
app/src/views/FireCondition/components/FireDistribution.vue
View File 

@@ -182,7 +182,13 @@ a {
 
       margin-left: 5px;
 
     }
 
   }
 
-
 
+.count{
 
+  text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
+}
 
   .time {
 
     color: #61DBFF;
 
   }

+ 5 - 0
app/src/views/FireCondition/components/FireHistory.vue
View File 

@@ -137,6 +137,11 @@ a {
 
   .name {
 
     flex: 0.2;
 
     font-size: 12px;
 
+    text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
   }
 
   .count {
 
     flex: 0.2;

+ 10 - 6
app/src/views/Home/components/AlarmingSituationDynamics.vue
View File 

@@ -23,7 +23,11 @@
 
         <li class="row" v-for="(item, index) in PoliceList" :key="index">
 
           <span class="time">{{ item.fssj }}</span>
 
           <span class="address">{{ item.szxq }}</span>
 
-          <span class="name" style="overflow: hidden; text-overflow: ellipsis;">{{ item.gcjzmc}}</span>
 
+          <span
 
+            class="name"
 
+            style="overflow: hidden; text-overflow: ellipsis"
 
+            >{{ item.gcjzmc }}</span
 
+          >
 
           <span class="type">{{ item.jqlx }}</span>
 
           <span class="org">{{ item.zgjg }}</span>
 
           <span class="state">{{ item.czzt }}</span>
 
@@ -52,8 +56,7 @@ export default {
 
     VueSeamlessScroll,
 
   },
 
   data() {
 
-    return {
 
-    };
 
+    return {};
 
   },
 
   computed: {
 
     classOption() {
 
@@ -162,12 +165,13 @@ a {
 
     justify-content: center;
 
     align-items: center;
 
   }
 
-  .org{
 
+  .org {
 
     flex: 0.4;
 
     overflow: hidden;
 
-    text-overflow: ellipsis !important;
 
+    text-overflow: ellipsis !important; // 超出隐藏
 
+    white-space: nowrap;
 
   }
 
-  .name{
 
+  .name {
 
     flex: 0.3;
 
   }
 
 }

+ 4 - 7
app/src/views/Home/components/BasicInfo.vue
View File 

@@ -23,7 +23,7 @@ export default {
 
       unitcNum:'',
 
       unitgNum:'',
 
       unitjNum:'',
 
-
 
+      allNum:0
 
     }
 
   },
 
   watch:{
 
@@ -35,19 +35,16 @@ export default {
 
     // 基础信息
 
     BasicInfo(){
 
       getInfo({...this.params,qy:this.qy==="重庆市"?"":this.qy}).then(res=>{
 
+      
         if(res.data.code==200){
 
         this.BasicLsit=res.data.rows
 
         res.data.rows.map(item=>{
 
           this.unitcNum=item.cggjz
 
           this.unitgNum=item.ljzzgc
 
           this.unitjNum=item.ljgcszhht
 
+          this.allNum=item.gyjz+item.zzjz+item.ggjz
 
         })
 
        }
 
-      }).catch(error=>{
 
-        this.$message({
 
-            message: res.data.msg,
 
-            type: "error"
 
-          });
 
       })
 
     }
 
   },
 
@@ -61,7 +58,7 @@ export default {
 
 <template>
 
   <div class="basic-info">
 
     <div class="__left">
 
-      <FirstHight :BasicLsit="BasicLsit" />
 
+      <FirstHight :BasicLsit="BasicLsit" :allNum="allNum" />
 
     </div>
 
     <div class="__right">
 
       <linear-text

+ 58 - 48
app/src/views/Home/components/FirstHight.vue
View File 

@@ -1,5 +1,5 @@
 
 <template>
 
-  <div ref="chart" class="item" style="width: 220px; height: 180px" />
 
+  <div ref="chart" class="item" style="width: 220px; height: 200px" />
 
 </template>
 
 
 <script>
 
@@ -7,6 +7,7 @@ import * as echarts from "echarts";
 
 export default {
 
   props: {
 
     BasicLsit: Array,
 
+    allNum: Number,
 
   },
 
   data() {
 
     return {
 
@@ -20,9 +21,9 @@ export default {
 
           this.$nextTick(() => {
 
             // 获取dom容器
 
             const chartDom = this.$refs.chart;
 
-    //   // 初始化图表实例
 
-    this.chart = echarts.init(chartDom);
 
-    this.initChart(this.BasicLsit);
 
+            //   // 初始化图表实例
 
+            this.chart = echarts.init(chartDom);
 
+            this.initChart(this.BasicLsit);
 
           });
 
         }
 
       },
 
@@ -37,6 +38,28 @@ export default {
 
       var outerRidus1 = 0.7;
 
       var outerRidus2 = 0.75;
 
       const option = {
 
+        title: [
 
+          {
 
+            text: this.allNum ,
 
+            top: "40%",
 
+            textAlign: "center",
 
+            left: "49%",
 
+            textStyle: {
 
+              color: "#fff",
 
+              fontSize: 12,
 
+            },
 
+          },
 
+          {
 
+            text: "高层建筑总数",
 
+            top: "49%",
 
+            textAlign: "center",
 
+            left: "49%",
 
+            textStyle: {
 
+              color: "#fff",
 
+              fontSize: 10,
 
+            },
 
+          },
 
+        ],
 
         legend: {
 
           right: "0",
 
           bottom: "-10px",
 
@@ -60,8 +83,8 @@ export default {
 
             hoverAnimation: false,
 
             data: [
 
               {
 
-                value: data.map(item=>{
 
-                  return item.ggjz
 
+                value: data.map((item) => {
 
+                  return item.ggjz;
 
                 }),
 
                 //   name: '运行中',
 
                 itemStyle: {
 
@@ -83,8 +106,8 @@ export default {
 
                 },
 
               },
 
               {
 
-                value: data.map(item=>{
 
-                  return item.gyjz
 
+                value: data.map((item) => {
 
+                  return item.gyjz;
 
                 }),
 
                 //   name: '已停止',
 
                 itemStyle: {
 
@@ -106,8 +129,8 @@ export default {
 
                 },
 
               },
 
               {
 
-                value: data.map(item=>{
 
-                  return item.zzjz
 
+                value: data.map((item) => {
 
+                  return item.zzjz;
 
                 }),
 
                 //   name: '未上线',
 
                 itemStyle: {
 
@@ -119,10 +142,10 @@ export default {
 
                           offset: 0,
 
                           color: "#FFA600", // 0% 处的颜色
 
                         },
 
-                        {
 
-                          offset: 1,
 
-                          color: "#FEDB65", // 100% 处的颜色
 
-                        },
 
+                        // {
 
+                        //   offset: 1,
 
+                        //   color: "#FEDB65", // 100% 处的颜色
 
+                        // },
 
                       ],
 
                     },
 
                   },
 
@@ -153,8 +176,8 @@ export default {
 
             z: 10,
 
             data: [
 
               {
 
-                value: data.map(item=>{
 
-                  return item.ggjz
 
+                value: data.map((item) => {
 
+                  return item.ggjz;
 
                 }),
 
                 name: "公共建筑",
 
                 itemStyle: {
 
@@ -166,19 +189,19 @@ export default {
 
                           offset: 0,
 
                           color: "#0060FF", // 0% 处的颜色
 
                         },
 
-                        {
 
-                          offset: 1,
 
-                          color: "#00EFFE", // 100% 处的颜色
 
-                        },
 
+                        // {
 
+                        //   offset: 1,
 
+                        //   color: "#00EFFE", // 100% 处的颜色
 
+                        // },
 
                       ],
 
                     },
 
-                    opacity: 0.5,
 
+                    // opacity: 0.5,
 
                   },
 
                 },
 
               },
 
               {
 
-                value: data.map(item=>{
 
-                  return item.zzjz
 
+                value: data.map((item) => {
 
+                  return item.zzjz;
 
                 }),
 
                 name: "居民建筑",
 
                 itemStyle: {
 
@@ -186,23 +209,23 @@ export default {
 
                     color: {
 
                       // 完成的圆环的颜色
 
                       colorStops: [
 
-                        {
 
-                          offset: 0,
 
-                          color: "#44D7B6", // 0% 处的颜色
 
-                        },
 
+                        // {
 
+                        //   offset: 0,
 
+                        //   color: "#44D7B6", // 0% 处的颜色
 
+                        // },
 
                         {
 
                           offset: 1,
 
                           color: "#6DD400", // 100% 处的颜色
 
                         },
 
                       ],
 
                     },
 
-                    opacity: 0.5,
 
+                    // opacity: 0.5,
 
                   },
 
                 },
 
               },
 
               {
 
-                value: data.map(item=>{
 
-                  return item.gyjz
 
+                value: data.map((item) => {
 
+                  return item.gyjz;
 
                 }),
 
                 name: "工业建筑",
 
                 itemStyle: {
 
@@ -214,13 +237,13 @@ export default {
 
                           offset: 0,
 
                           color: "#FFA600", // 0% 处的颜色
 
                         },
 
-                        {
 
-                          offset: 1,
 
-                          color: "#FEDB65", // 100% 处的颜色
 
-                        },
 
+                        // {
 
+                        //   offset: 1,
 
+                        //   color: "#FEDB65", // 100% 处的颜色
 
+                        // },
 
                       ],
 
                     },
 
-                    opacity: 0.5,
 
+                    // opacity: 0.5,
 
                   },
 
                 },
 
               },
 
@@ -376,19 +399,6 @@ export default {
 
           y: y1,
 
         };
 
       }
 
-
 
-      // const draw = () => {
 
-      //   angle = angle + 3;
 
-      //   this.chart.setOption(option, true);
 
-      //   //window.requestAnimationFrame(draw);
 
-      // };
 
-      // if (timerId) {
 
-      //   clearInterval(timerId);
 
-      // }
 
-      // timerId = setInterval(function () {
 
-      //   //用setInterval做动画感觉有问题
 
-      //   draw();
 
-      // }, 100);
 
       this.chart.setOption(option);
 
       //自适应图表
 
       window.onresize = this.chart.resize;

+ 4 - 4
app/src/views/Home/components/HiddenDangerDetection/HiddenDangerType.vue
View File 

@@ -71,7 +71,7 @@ export default {
 
           },
 
           data: ["消防设施", "生命通道", "用电用气", "消防管理"],
 
         },
 
-        color: ["#00a2ff", "#00eaff", "#16c843", "#99f7ff"],
 
+        color: ["#00a2ff", "#00eaff", "#16c843", "#C3C71B"],
 
         series: [
 
           // 数据展示层
 
           {
 
@@ -127,9 +127,9 @@ export default {
 
               value: item.value,
 
               name: item.name,
 
                 itemStyle: {
 
-                  normal: {
 
-                    color: 'rgba(0,0,0, .3)'
 
-                  }
 
+                  // normal: {
 
+                  //   color: 'rgba(0,0,0, .3)'
 
+                  // }
 
                 }
 
             })),
 
             labelLine: {

+ 5 - 5
app/src/views/Home/components/HiddenDangerDetection/RectificationChart.vue
View File 

@@ -133,11 +133,11 @@ export default {
 
             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,

+ 29 - 17
app/src/views/Iot/components/AlarmHandling.vue
View File 

@@ -31,13 +31,15 @@
 
         <span class="person">未处理</span>
 
         <span class="result">已处理</span>
 
       </div>
 
-      <VueSeamlessScroll :data="list1" :class-option="classOption" class="warp">
 
+      <VueSeamlessScroll v-if="reload" :data="list1" :class-option="classOption" class="warp">
 
         <ul class="item">
 
-          <li class="row" v-for="(item, index) in list1" :key="index">
 
+          <li class="row" :class="{
 
+            active: item.isActive
 
+          }" v-for="(item, index) in list1" :key="index">
 
             <span class="num">{{ index + 1 }}</span>
 
-            <span class="time">{{ item[0] }}</span>
 
-            <span class="person">{{ item[1] }}</span>
 
-            <span class="result">{{ item[2] }}</span>
 
+            <span class="time">{{ item.qx }}</span>
 
+            <span class="person">{{ item.ycl }}</span>
 
+            <span class="result">{{ item.wcl }}</span>
 
           </li>
 
         </ul>
 
       </VueSeamlessScroll>
 
@@ -47,15 +49,16 @@
 
   <script>
 
 import VueSeamlessScroll from "vue-seamless-scroll";
 
 import { getGqcz, getType } from "@/api/iot.js";
 
+import { toFirst } from "../../../utils";
 
 export default {
 
   name: "MaintenanceSupervision",
 
   props: ["qx"],
 
   data() {
 
     return {
 
       search: "",
 
+      reload: true,
 
       param: {
 
         czzt: null,
 
-        qx: this.qx,
 
         warningType: null,
 
         pageNum: 1,
 
         pageSize: 100,
 
@@ -94,28 +97,23 @@ export default {
 
     classOption() {
 
       return {
 
         singleHeight: 43,
 
+        autoPlay: this.qx === '重庆市'
 
       };
 
     },
 
   },
 
   methods: {
 
-    resultType(text) {
 
-      return {
 
-        合格: "#23f59d",
 
-        不合格: "#df575b",
 
-        是: "#23f59d",
 
-        否: "#df575b",
 
-      }[text];
 
-    },
 
     getList() {
 
+      this.reload = false
 
       getGqcz(this.param).then((res) => {
 
         // console.log(res);
 
-        const list1 = [];
 
+        const tempList = [];
 
         if (res.data.rows) {
 
           res.data.rows.forEach(p => {
 
-            list1.push([p.qx, p.wcl, p.ycl])
 
+            tempList.push({...p, isActive: p.qx === this.qx })
 
           })
 
         }
 
-        this.list1 = list1;
 
+        this.list1 = toFirst(tempList, this.qx, 'qx');
 
+        this.reload = true
 
       });
 
     },
 
     getTypes() {
 
@@ -134,6 +132,11 @@ export default {
 
       });
 
     },
 
   },
 
+  watch: {
 
+    qx() {
 
+      this.getList();
 
+    }
 
+  },
 
   created() {
 
     this.getTypes();
 
     this.getList();
 
@@ -176,6 +179,7 @@ export default {
 
       padding: 0;
 
       margin: 0 auto;
 
       cursor: pointer;
 
+      
     }
 
   }
 
 
@@ -188,6 +192,9 @@ export default {
 
     margin-top: 15px;
 
     margin-bottom: 6px;
 
   }
 
+  li.row.active {
 
+  background-color: rgba(0, 213, 255, 0.2);
 
+}
 
 
   .row,
 
   li,
 
@@ -209,6 +216,11 @@ export default {
 
       display: flex;
 
       justify-content: center;
 
       align-items: center;
 
+      text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
     }
 
     .result {
 
       color: #68d1ff;

+ 27 - 12
app/src/views/Iot/components/RegionalDistribution.vue
View File 

@@ -19,9 +19,11 @@
 
         <span class="tim">终端数量（个）</span>
 
         <span class="percent">覆盖率</span>
 
       </div>
 
-      <VueSeamlessScroll :data="list" :class-option="classOption" class="warp">
 
+      <VueSeamlessScroll v-if="reload" :data="list" :class-option="classOption" class="warp">
 
         <ul class="item">
 
-          <li class="row" v-for="(item, index) in list" :key="index">
 
+          <li class="row" :class="{
 
+            active: item[4]
 
+          }" v-for="(item, index) in list" :key="index">
 
             <span class="idx">{{ index + 1 }}</span>
 
             <span class="area">{{ item[0] }}</span>
 
             <span class="build">{{ item[1] }}</span>
 
@@ -37,6 +39,7 @@
 
 <script>
 
 import VueSeamlessScroll from "vue-seamless-scroll";
 
 import { getRank } from "@/api/iot.js";
 
+import { toFirst } from "../../../utils";
 
 export default {
 
   name: "RegionalDistribution",
 
   components: {
 
@@ -65,42 +68,45 @@ export default {
 
         { label: "已建消防控制室人员离岗监控排名", value: "xfkzs" },
 
       ],
 
       selectOption: "wlw",
 
+      reload: true
 
     };
 
   },
 
   computed: {
 
     classOption() {
 
       return {
 
         singleHeight: 43,
 
+        autoPlay: this.qx === '重庆市'
 
       };
 
     },
 
   },
 
   methods: {
 
     getList() {
 
+      this.reload = false
 
       const param = {
 
         pageNum: 1,
 
-        pageSize: 100,
 
-        qx: this.qx,
 
+        pageSize: 100
 
       };
 
       getRank(this.selectOption, param).then((res) => {
 
         const list = [];
 
         if (res.data.rows) {
 
           res.data.rows.forEach((p) => {
 
             if (this.selectOption === "wlw") {
 
-              list.push([p.qx, p.ldsl, p.jrsbzs, p.fgl]);
 
+              list.push([p.qx, p.ldsl, p.jrsbzs, p.fgl, p.qx === this.qx]);
 
             } else if (this.selectOption === "sy") {
 
-              list.push([p.qx, p.ldsl, p.syzs, p.fgl]);
 
+              list.push([p.qx, p.ldsl, p.syzs, p.fgl, p.qx === this.qx]);
 
             } else if (this.selectOption === "dq") {
 
-              list.push([p.qx, p.ldsl, p.dqhzzs, p.fgl]);
 
+              list.push([p.qx, p.ldsl, p.dqhzzs, p.fgl, p.qx === this.qx]);
 
             } else if (this.selectOption === "smtd") {
 
-              list.push([p.qx, p.ldsl, p.smtdzs, p.fgl]);
 
+              list.push([p.qx, p.ldsl, p.smtdzs, p.fgl, p.qx === this.qx]);
 
             } else if (this.selectOption === "hz") {
 
-              list.push([p.qx, p.ldsl, p.hzbjzjzs, p.fgl]);
 
+              list.push([p.qx, p.ldsl, p.hzbjzjzs, p.fgl, p.qx === this.qx]);
 
             } else if (this.selectOption === "xfkzs") {
 
-              list.push([p.qx, p.ldsl, p.xfkzszs, p.fgl]);
 
+              list.push([p.qx, p.ldsl, p.xfkzszs, p.fgl, p.qx === this.qx]);
 
             }
 
           });
 
         }
 
-        this.list = list;
 
+        this.list = toFirst(list, this.qx, '0');
 
+        this.reload = true
 
       });
 
     },
 
   },
 
@@ -156,6 +162,10 @@ export default {
 
   }
 
 }
 
 
+li.row.active {
 
+  background-color: rgba(0, 213, 255, 0.2);
 
+}
 
+
 
 li.row > span {
 
   text-align: center;
 
   font-size: 14x;
 
@@ -195,7 +205,12 @@ a {
 
   }
 
 
   .area {
 
-    flex: 0.25;
 
+    flex: 0.3;
 
+    text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
   }
 
   .build {
 
     flex: 0.25;

+ 18 - 17
app/src/views/Iot/index.vue
View File 

@@ -27,9 +27,10 @@
 
         />
 
       </border-panel>
 
     </div>
 
-    <div style="">
 
-      <div class="map-container cover">
 
-        <MapCharts />
 
+    <div class="map-container cover">
 
+      <MapCharts />
 
+      <div style="position: absolute;width: 500px; left:90px; top: 10px;">
 
+        <SearchBox :area.sync="qx" />
 
       </div>
 
     </div>
 
     <div style="z-index: 100">
 
@@ -60,6 +61,7 @@ import IotVideo from "./components/IotVideo.vue";
 
 import AlarmHandling from "./components/AlarmHandling.vue";
 
 import RegionalDistribution from "./components/RegionalDistribution.vue";
 
 import MapCharts from "../Home/components/MapCharts.vue";
 
+import SearchBox from '../../components/SearchBox.vue'
 
 import {
 
   getZtqk,
 
   getZtqkDwtj,
 
@@ -68,17 +70,18 @@ import {
 
 } from "@/api/iot.js";
 
 
 export default {
 
-  name: "Iot",
 
+  name: "IotPage",
 
   components: {
 
     TotalityInfo,
 
     RegionalDistribution,
 
     IotVideo,
 
     AlarmHandling,
 
-    MapCharts
 
+    MapCharts,
 
+    SearchBox
 
   },
 
   data() {
 
     return {
 
-      qx: null,
 
+      qx: "重庆市",
 
       ztqkData: null,
 
       ztqkDwtjData: null,
 
       caremaData: [],
 
@@ -90,7 +93,7 @@ export default {
 
       const ztqkParam = {
 
         pageNum: 1,
 
         pageSize: 100,
 
-        name: this.qx,
 
+        name: this.qx === '重庆市' ? "" : this.qx,
 
       };
 
       getZtqk(ztqkParam).then((res) => {
 
         this.ztqkData = res.data.rows[0];
 
@@ -100,7 +103,7 @@ export default {
 
       const ztqkDwtjParam = {
 
         pageNum: 1,
 
         pageSize: 100,
 
-        name: this.qx,
 
+        name: this.qx === '重庆市' ? "" : this.qx,
 
       };
 
       getZtqkDwtj(ztqkDwtjParam).then((res) => {
 
         this.ztqkDwtjData = res.data.rows[0];
 
@@ -111,7 +114,7 @@ export default {
 
       const deviceParam = {
 
         pageNum: 1,
 
         pageSize: 100,
 
-        qx: this.qx,
 
+        qx: this.qx === '重庆市' ? "" : this.qx,
 
         zt: "在线",
 
         sblx: "生命通道监测",
 
       };
 
@@ -121,7 +124,7 @@ export default {
 
       const deviceParam2 = {
 
         pageNum: 1,
 
         pageSize: 100,
 
-        qx: this.qx,
 
+        qx: this.qx === '重庆市' ? "" : this.qx,
 
         zt: "在线",
 
         sblx: "消防控制室监控",
 
       };
 
@@ -146,13 +149,14 @@ export default {
 
 
 <style scoped lang="less">
 
 .map-container {
 
-  z-index: 50;
 
   position: fixed;
 
-  top: 25%;
 
+  z-index: 50;
 
   left: 50%;
 
   transform: translateX(-50%);
 
-  width: 1100px;
 
-  height: 90%;
 
+  display: flex;
 
+  padding-top: 150px;
 
+  align-items: center;
 
+  width: 920px;
 
 }
 
 
 // .map-container::after {
 
@@ -166,7 +170,4 @@ export default {
 
 //   pointer-events: none;
 
 // }
 
 
-iframe {
 
-  border: none;
 
-}
 
 </style>

+ 1 - 1
app/src/views/PoliceSituation/components/MobilizeStrength.vue
View File 

@@ -33,7 +33,7 @@ white-space: nowrap;">{{ item.yjddsj || '-'}}</span>
 
 				<div class="wenshuTxt">最新文书</div>
 
 				<img src="../../../assets/images/img14.png" />
 
 			</div>
 
-			<div class="content">
 
+			<div class="content" v-if="hcws">
 
 				<div>
 
 					<div style="">
 
 						<div class="contFlex">

+ 6 - 6
app/src/views/PoliceSituation/index.vue
View File 

@@ -49,7 +49,7 @@
 
 					qy: null,
 
 					id: null
 
 				},
 
-				ajId: '',
 
+				ajid: '',
 
 				bjxxList: [], //报警信息
 
 				cdxxList: [], //出动信息列表
 
 				zlxx: [], //出动信息总览
 
@@ -73,7 +73,7 @@
 
 			getOtherData() {
 
 				// 出警力量
 
 				const cdxxId = {
 
-					ajId: this.params.id
 
+					ajid: this.params.id
 
 				}
 
 				getCdllxx(cdxxId).then(res => {
 
 					console.log(res);
 
@@ -86,7 +86,7 @@
 
 				})
 
 				// 火场文书
 
 				const hcwsId = {
 
-					ajid:this.params.id
 
+					jqTywysbm:this.params.id
 
 				}
 
 				getHcws(hcwsId).then(res => {
 
 					console.log(res);
 
@@ -100,7 +100,7 @@
 
 				})
 
 				// 事故单位建筑信息
 
 				const jzxxid = {
 
-					ajId: this.params.id
 
+					ajid: this.params.id
 
 				}
 
 				getJzxx(jzxxid).then(res => {
 
 					console.log(res);
 
@@ -108,7 +108,7 @@
 
 				})
 
 				// 风险隐患信息 
 				const fxyhId = {
 
-					ajId: this.params.id
 
+					ajid: this.params.id
 
 				}
 
 				getFxyhxx(fxyhId).then(res => {
 
 					console.log(res);
 
@@ -117,7 +117,7 @@
 
 				})
 
 				// 物联网设备信息
 
 				const wlwId = {
 
-					ajId: this.params.id
 
+					ajid: this.params.id
 
 				}
 
 				getWlwsb(wlwId).then(res => {
 
 					console.log(res);

+ 37 - 48
app/src/views/Risk/components/Investigation.vue
View File 

@@ -22,13 +22,20 @@
 
           <span class="person">正常数</span>
 
           <span class="result">异常数</span>
 
         </div>
 
+        <ul class="item">
 
+            <li class="row" >
 
+              <span class="time">{{ generalSituation.name }}</span>
 
+              <span class="person">{{ generalSituation.normalNum  }}</span>
 
+              <span class="result">{{ generalSituation.errorNum  }}</span>
 
+            </li>
 
+        </ul>
 
         <VueSeamlessScroll
 
-          :data="list1"
 
+          :data="list"
 
           :class-option="classOption"
 
           class="warp"
 
         >
 
           <ul class="item">
 
-            <li class="row" v-for="(item, index) in list1" :key="index">
 
+            <li class="row" v-for="(item, index) in list" :key="index">
 
                 <span class="time">{{ item[0] }}</span>
 
                 <span class="person">{{ item[1] }}</span>
 
                 <span class="result"
 
@@ -51,46 +58,20 @@
 
     name: 'MaintenanceSupervision',
 
     data() {
 
       return {
 
-        list1: [
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "王小强", "不合格"],
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "王小强", "不合格"],
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "王小强", "不合格"],
 
-          ["09:23 05-14", "王小强", "不合格"]
 
-        ],
 
-        list2: [
 
-          ["09:23 05-14", "沙坪坝支队", "合格"],
 
-          ["09:23 05-14", "两江支队", "不合格"],
 
-          ["09:23 05-14", "城口大队", "合格"],
 
-          ["09:23 05-14", "永川支队", "不合格"],
 
-          ["09:23 05-14", "城口大队", "合格"],
 
-          ["09:23 05-14", "永川支队", "合格"],
 
-          ["09:23 05-14", "永川支队", "不合格"],
 
-          ["09:23 05-14", "永川支队", "不合格"]
 
-        ],
 
-        list3: [
 
-          ["09:23 05-14", "张三", "是"],
 
-          ["09:23 05-14", "王小强", "否"],
 
-          ["09:23 05-14", "张三", "是"],
 
-          ["09:23 05-14", "王小强", "否"],
 
-          ["09:23 05-14", "张三", "是"],
 
-          ["09:23 05-14", "张三", "是"],
 
-          ["09:23 05-14", "王小强", "否"],
 
-          ["09:23 05-14", "王小强", "否"]
 
-        ],
 
-        list4: [
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "王小强", "不合格"],
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "王小强", "不合格"],
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "张三", "合格"],
 
-          ["09:23 05-14", "王小强", "不合格"],
 
-          ["09:23 05-14", "王小强", "不合格"]
 
+        list: [
 
+          ["防火卷帘", 41, 4],
 
+          ["室内消火栓系统", 106, 22],
 
+          ["机械防、排烟系统", 365, 65],
 
+          ["火灾自动报警系统", 365, 65],
 
+          ["室内消火栓系统", 365, 65],
 
+          ["室内消火栓系统", 365, 65],
 
+          ["室内消火栓系统", 365, 65],
 
         ],
 
+        generalSituation: {
 
+          name: '整体情况',
 
+          normalNum: 3700,
 
+          errorNum: 653,
 
+        },
 
         checked: 0,
 
       }
 
     },
 
@@ -100,7 +81,7 @@
 
     computed: {
 
       classOption() {
 
         return {
 
-          singleHeight: 43,
 
+          singleHeight: 36,
 
         };
 
       },
 
     },
 
@@ -141,27 +122,31 @@
 
     }
 
   
   .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;
 
+    span {
 
+      color: #98DFE9 !important;
 
+    }
 
+    border: none !important;
 
   }
 
   
   .row,
 
   li,
 
   a {
 
     display: block;
 
-    height: 39px;
 
-    line-height: 39px;
 
-    margin-bottom: 4px;
 
+    height: 36px;
 
+    line-height: 36px;
 
     display: flex;
 
     justify-content: space-between;
 
     align-items: center;
 
-    font-size: 16px;
 
+    box-sizing: border-box;
 
+    font-size: 12px;
 
+    color: #D2F3F8;
 
     background-color: rgba(0, 0, 0, 0.2);
 
+    border-bottom: 1px dashed #516B7A;
 
     .time,
 
     .person,
 
     .result {
 
@@ -170,6 +155,10 @@
 
       justify-content: center;
 
       align-items: center;
 
     }
 
+
 
+    .result {
 
+      color: #FF4F4F;
 
+    }
 
   }
 
   }
 
   </style>

+ 5 - 0
app/src/views/Risk/components/RiskDanger.vue
View File 

@@ -148,6 +148,11 @@
 
     }
 
     .count {
 
       flex: 0.5;
 
+      text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
     }
 
     .unit {
 
       flex: 0.2;

+ 123 - 117
app/src/views/Risk/components/Riskdistribution.vue
View File 

@@ -1,138 +1,138 @@
 
-<template >
 
-    <div class="maintenance-supervision">
 
-      <div class="maintenance-supervision_header">
 
-        <button-group @change="change">
 
-          <button-group-item >
 
-            重大风险
 
-          </button-group-item>
 
-          <button-group-item >
 
-            较大风险
 
-          </button-group-item>
 
-          <button-group-item >
 
-            一般风险
 
-          </button-group-item>
 
-          <button-group-item >
 
-            低风险
 
-          </button-group-item>
 
-        </button-group>
 
-      </div>
 
-      <div >
 
-        <div class="row header">
 
-          <span class="type">序号</span>
 
-          <span class="person">区域</span>
 
-          <span class="result">风险数(栋)</span>
 
-        </div>
 
-        <VueSeamlessScroll
 
-          :data="list"
 
-          v-if="reload"
 
-          :class-option="classOption"
 
-          class="warp"
 
-        >
 
-          <ul class="item">
 
-            <li class="row" :class="{
 
-              active: item.isActive
 
-            }" v-for="(item, index) in list" :key="index">
 
-                <span class="type">{{ index+1}}</span>
 
-                <span class="person">{{ item.qy }}</span>
 
-                <span class="result">{{ item.sl }}</span>
 
-              </li>
 
-            </ul>
 
-          </VueSeamlessScroll>
 
+<template>
 
+  <div class="maintenance-supervision">
 
+    <div class="maintenance-supervision_header">
 
+      <button-group @change="change">
 
+        <button-group-item> 重大风险 </button-group-item>
 
+        <button-group-item> 较大风险 </button-group-item>
 
+        <button-group-item> 一般风险 </button-group-item>
 
+        <button-group-item> 低风险 </button-group-item>
 
+      </button-group>
 
+    </div>
 
+    <div>
 
+      <div class="row header">
 
+        <span class="type">序号</span>
 
+        <span class="person">区域</span>
 
+        <span class="result">风险数(栋)</span>
 
       </div>
 
-      
+      <VueSeamlessScroll
 
+        :data="list"
 
+        v-if="reload"
 
+        :class-option="classOption"
 
+        class="warp"
 
+      >
 
+        <ul class="item">
 
+          <li
 
+            class="row"
 
+            :class="{
 
+              active: item.isActive,
 
+            }"
 
+            v-for="(item, index) in list"
 
+            :key="index"
 
+          >
 
+            <span class="type">{{ index + 1 }}</span>
 
+            <span class="person">{{ item.qy }}</span>
 
+            <span class="result">{{ item.sl }}</span>
 
+          </li>
 
+        </ul>
 
+      </VueSeamlessScroll>
 
     </div>
 
-  </template>
 
-  <script>
 
-  import VueSeamlessScroll from "vue-seamless-scroll";
 
-  import { fxfb } from '@/api/risk'
 
-  import { toFirst } from '@/utils'
 
+  </div>
 
+</template>
 
+<script>
 
+import VueSeamlessScroll from "vue-seamless-scroll";
 
+import { fxfb } from "@/api/risk";
 
+import { toFirst } from "@/utils";
 
 
-  export default {
 
-    name: 'MaintenanceSupervision',
 
-    props: {
 
-      qx: String
 
-    },
 
-    data() {
 
+export default {
 
+  name: "MaintenanceSupervision",
 
+  props: {
 
+    qx: String,
 
+  },
 
+  data() {
 
+    return {
 
+      list: [],
 
+      originData: [],
 
+      reload: true,
 
+      checked: 0,
 
+      type: ["重大风险", "较大风险", "一般风险", "低风险"],
 
+    };
 
+  },
 
+  components: {
 
+    VueSeamlessScroll,
 
+  },
 
+  computed: {
 
+    classOption() {
 
       return {
 
-        list: [],
 
-        originData: [],
 
-        reload: true,
 
-        checked: 0,
 
-        type: ['重大风险', '较大风险', '一般风险', '低风险']
 
-      }
 
-    },
 
-    components: {
 
-      VueSeamlessScroll
 
+        singleHeight: 43,
 
+        autoPlay: this.qx === "重庆市",
 
+      };
 
     },
 
-    computed: {
 
-      classOption() {
 
-        return {
 
-          singleHeight: 43,
 
-          autoPlay: this.qx === "重庆市"
 
-        };
 
+  },
 
+  watch: {
 
+    qx: {
 
+      handler() {
 
+        this.loadData();
 
       },
 
+      immediate: true,
 
     },
 
-    watch: {
 
-      qx: {
 
-        handler() {
 
-          this.loadData()
 
-        },
 
-        immediate: true
 
+  },
 
+  methods: {
 
+    change(idx) {
 
+      if (this.checked !== idx) {
 
+        this.checked = idx;
 
+        let tempData = this.originData.filter(
 
+          (item) => item.fxdj === this.type[idx]
 
+        );
 
+        this.list = toFirst(tempData, this.qx, "qy");
 
       }
 
     },
 
-    methods: {
 
-      change(idx) {
 
-        if (this.checked !== idx) {
 
-          this.checked = idx
 
-          let tempData = this.originData.filter(item => item.fxdj === this.type[idx])
 
-          this.list = toFirst(tempData, this.qx, 'qy')
 
-        }
 
-      },
 
-      loadData() {
 
-        this.reload = false
 
-        fxfb({
 
-          pageNum: 1,
 
-          pageSize: 100
 
-        }).then(res => {
 
-          this.originData = res.data.rows.map(item => ({
 
-            ...item,
 
-            isActive: item.qy === this.qx
 
-          }))
 
-          let tempData = this.originData.filter(item => item.fxdj === this.type[this.checked])
 
-          this.list = toFirst(tempData, this.qx, 'qy')
 
-          this.reload = true
 
-        })
 
-      }
 
-    }
 
+    loadData() {
 
+      this.reload = false;
 
+      fxfb({
 
+        pageNum: 1,
 
+        pageSize: 100,
 
+      }).then((res) => {
 
+        this.originData = res.data.rows.map((item) => ({
 
+          ...item,
 
+          isActive: item.qy === this.qx,
 
+        }));
 
+        let tempData = this.originData.filter(
 
+          (item) => item.fxdj === this.type[this.checked]
 
+        );
 
+        this.list = toFirst(tempData, this.qx, "qy");
 
+        this.reload = true;
 
+      });
 
+    },
 
+  },
 
+};
 
+</script>
 
+<style scoped lang="less">
 
+.maintenance-supervision {
 
+  .maintenance-supervision_header {
 
+    border-bottom: 1px solid #154956;
 
+    padding-bottom: 2px;
 
   }
 
-  </script>
 
-  <style scoped lang='less'>
 
-  .maintenance-supervision {
 
-    .maintenance-supervision_header {
 
-      border-bottom: 1px solid #154956;
 
-      padding-bottom: 2px;
 
-    }
 
-    .warp {
 
+  .warp {
 
     height: 520px;
 
     margin: 0 auto;
 
     overflow: hidden;
 
-      .item {
 
-        list-style: none;
 
-        padding: 0;
 
-        margin: 0 auto;
 
-        cursor: pointer;
 
-      }
 
+    .item {
 
+      list-style: none;
 
+      padding: 0;
 
+      margin: 0 auto;
 
+      cursor: pointer;
 
     }
 
-  
+  }
 
+
 
   .header {
 
     color: #fff;
 
     height: 33px !important;
 
     line-height: 33px !important;
 
     background-color: rgba(0, 163, 255, 0.3) !important;
 
-    color: #61DBFF;
 
+    color: #61dbff;
 
     margin-top: 15px;
 
     margin-bottom: 6px;
 
-    }
 
+  }
 
   li.row.active {
 
     background-color: rgba(0, 213, 255, 0.2);
 
   }
 
@@ -158,10 +158,16 @@
 
       justify-content: center;
 
       align-items: center;
 
     }
 
+    .person {
 
+      text-align: center;
 
+      display: inline-block;
 
+      overflow: hidden;
 
+      text-overflow: ellipsis !important; // 超出隐藏
 
+      white-space: nowrap;
 
+    }
 
     .type {
 
       flex: 0.15;
 
     }
 
   }
 
-  }
 
-  </style>
 
-  
+}
 
+</style>

+ 1 - 3
app/vite.config.js
View File 

@@ -11,7 +11,7 @@ export default defineConfig({
 
     vue2(),
 
     vue2Jsx(),
 
     legacy({
 
-      targets: ["ie >= 11"],
 
+      targets: ['IE 11'],
 
       additionalLegacyPolyfills: ["regenerator-runtime/runtime"],
 
     }),
 
   ],
 
@@ -41,8 +41,6 @@ export default defineConfig({
 
     },
 
   },
 
   build: {
 
-    // 设置最终构建的浏览器兼容目标
 
-    target: "es2015",
 
     // 构建后是否生成 source map 文件
 
     sourcemap: false,
 
     //  chunk 大小警告的限制（以 kbs 为单位）

+ 1 - 1
utils/request.js
View File 

@@ -25,4 +25,4 @@ instance.interceptors.response.use(config => {
 
 }, err => {
 
   return Promise.reject(err)
 
 })
 
-export default instance;
 
+export default instance;