ソースを参照

Merge remote-tracking branch 'origin/V0.0.2' into V0.0.2

jingyuanchao 2 年 前
コミット
df737212b1

+ 14 - 14
src/views/board/charts/map/report.vue

@@ -251,20 +251,20 @@ export default {
               // color:'#fff',
               show:false
             },
-             tooltip:{
-              position: "right",              
-              textStyle:{
-                // color:'#fff',
-              },
-              // backgroundColor:'rgba(184,189,192,1)',
-              formatter:function(param){               
-                return `<div >
-                <div> ${param.data.name} </div>
-                <div>履职总数:85 </div>
-                <div> 已完成:67 </div>
-                </div>`
-              }
-            },
+            //  tooltip:{
+            //   position: "right",              
+            //   textStyle:{
+            //     // color:'#fff',
+            //   },
+            //   // backgroundColor:'rgba(184,189,192,1)',
+            //   formatter:function(param){               
+            //     return `<div >
+            //     <div> ${param.data.name} </div>
+            //     <div>履职总数:85 </div>
+            //     <div> 已完成:67 </div>
+            //     </div>`
+            //   }
+            // },
             itemStyle: {
               color: "#ddb926",
             },           

+ 99 - 411
src/views/board/charts/org/report.vue

@@ -1,96 +1,38 @@
 <!--  -->
 <template>
   <div
-    class="chart-template map-template"
-    style="display: flex; flex-direction: row"
+    class="chart-template"
   >
-    <div>机构统计</div>
-    <!-- <div>
-      <div>
-        <span>营业网点</span>
-        <span>
-          <span>总数:</span>
-          <span>3020</span>
-        </span>
-        <span>
-          <span>达标数:</span>
-          <span>500</span>
-        </span>
-        <span>
-          <span>自有产权数:</span>
-          <span>1500</span>
-        </span>
-        <span>
-          <span>区域外网数:</span>
-          <span>80</span>
-        </span>
+    <p>机构统计</p>    
+    <div>
+      <div class="content">       
+        <span> 行社 56 </span>
+        <span> 营业网点 2968 </span>
+        <span> 离行 1202 </span>
+        <span> 监控中心 100 </span>
       </div>
-      <div>
-        <span>自助设备</span>
-        <span>
-          <span>总数:</span>
-          <span>4000</span>
-        </span>
-        <span>
-          <span>在行式穿墙机具:</span>
-          <span>2000</span>
-        </span>
-        <span>
-          <span>在行式堂式机具:</span>
-          <span>1500</span>
-        </span>
-        <span>
-          <span>离行式穿墙机具:</span>
-          <span>2000</span>
-        </span>
-        <span>
-          <span>离行式堂式机具:</span>
-          <span>1500</span>
-        </span>
+      <div class="content">
+        <span> 达标数 3000 </span>
+        <span> GA38-2021 2000  </span>
+        <span> GA38-2015 1000 </span>
       </div>
-      <div>
-        <span>自助银行</span>
-        <span>
-          <span>总数:</span>
-          <span>4000</span>
-        </span>
-        <span>
-          <span>在行式自助银行:</span>
-          <span>2000</span>
-        </span>
-        <span>
-          <span>离行式自助银行:</span>
-          <span>1500</span>
-        </span>
+      <div class="content">
+        <span> 业务库 2101 </span>
+        <span> 一类库 300 </span>
+        <span> 二类库 457 </span>
+        <span> 三类库 400 </span>
+        <span> 四类库 557 </span>
       </div>
-      <div>
-        <span>业务库</span>
-        <span>
-          <span>总数:</span>
-          <span>3020</span>
-        </span>
-        <span>
-          <span>一类库:</span>
-          <span>2000</span>
-        </span>
-        <span>
-          <span>二类库:</span>
-          <span>1500</span>
-        </span>
-        <span>
-          <span>三类库:80</span>
-          <span>80</span>
-        </span>
-        <span>
-          <span>四类库</span>
-          <span>80</span>
-        </span>
+      <div class="content">
+        <span> 自助银行 4000 </span>
+        <span> 离行式自助银行  2100 </span>
+        <span> 在行式自助银行 1900 </span>
       </div>
-    </div> -->
-    <div id="org_Chart"></div>
+      
+    </div>
+    <!-- <div id="commAlarmEvent_Chart"></div> -->
   </div>
 </template>
-
 <script>
 import "./../../board.scss";
 import * as echarts from "echarts";
@@ -100,16 +42,40 @@ import {
   getNextPeriod,
   getPeriodText,
 } from "../../utils.js";
-
+const types = [
+  {
+    text: "今天",
+    value: "0",
+  },
+  {
+    text: "近7天",
+    value: "1",
+  },
+  {
+    text: "近30天",
+    value: "2",
+  },
+  {
+    text: "近90天",
+    value: "3",
+  },
+  {
+    text: "本年",
+    value: "4",
+  },
+];
 export default {
   props: ["orgId"],
   data() {
     return {
       data: {
-        all: [],
-        completed: [],
-        name: [],
+        safetyCheck: {},
+        edu: {},
+        drill: {},
+        monitor: {},
+        visit: {},
       },
+      activeName: types[0].value,
     };
   },
 
@@ -121,23 +87,17 @@ export default {
     orgId: {
       deep: true,
       handler(val) {
-        // this.resetTimer();
+        this.resetTimer();
         this.getData();
       },
-    },
-    data: {
-      deep: true,
-      handler() {
-        this.initMap();
-      },
-    },
+    },   
   },
 
   created() {
-    // this.types = types;
+    this.types = types;
     this.maxDisplay = 16;
-    // this.refreshTime = 1 * 10 * 1000;
-    // this.isMouseOver = false;
+    this.refreshTime = 1 * 10 * 1000;
+    this.isMouseOver = false;
   },
 
   async mounted() {
@@ -162,337 +122,65 @@ export default {
       this.isMouseOver = false;
     },
     async getData() {
-      // let bs = parseInt(this.activeName) + 1;
+      let bs = parseInt(this.activeName) + 1;
       this.data = {
-        all: 500,
-        unconfirm: 112, //未确认
-        auditing: 20, //异议审批中
-        unreform: 50, //待整改
-        notQuestion: 4,
-        reformed: 500 - 112 - 20 - 50 - 4,
+        safetyCheck: {
+          all: 18 * bs,
+          completed: 16 * bs,
+        },
+        edu: { all: 2 * bs, completed: 1 * bs },
+        drill: { all: 3 * bs, completed: 2 * bs },
+        monitor: { all: 66 * bs, completed: 65 * bs },
+        visit: {
+          times: 5 * bs,
+          personCount: 6 * bs,
+          accompanyCount: 2 * bs,
+        },
       };
     },
 
     windowResize() {
       this.myChart && this.myChart.resize();
     },
-    initMap() {
-      this.myChart && this.myChart.dispose();
-
-      // 基于准备好的dom,初始化echarts实例
-      this.myChart = echarts.init(document.getElementById("org_Chart"));
-
-      let t = this;
-      // 指定图表的配置项和数据
-      var option = {
-        backgroundColor: "rgba(0,0,0,0)",
-        // color: ["#C0FBB5", "#46557B"],
-        legend: {
-          show: false,
-          icon: "circle",
-          //   data: ["达标数", "自有产权数","区域外网数"],
-          textStyle: {
-            color: "#fff",
-            // fontSize:18
-          },
-          left: "center",
-          top: "5%",
-        },
-        tooltip: {
-          trigger: "item",
-        },
-        series: [
-          {
-            name: "营业网点",
-            type: "pie",
-            radius: ["65%", "85%"],
-            center: [`12.5%`, "50%"],
-            data: [
-              {
-                name: "达标数",
-                value: 2000,
-              },
-              {
-                name: "自有产权数",
-                value: 1500,
-              },
-              {
-                name: "区域外网数",
-                value: 80,
-              },
-            ],
-            label: {
-              show: true,
-              position: "center",
-              color: "#fff",
-              fontSize: 14,
-              formatter: function (value) {
-                return "3020\n" + "\n营业网点";
-              },
-            },
-            tooltip: {
-              show: true,
-              trigger: "item",
-              backgroundColor: "#b8bdc0",
-              textStyle: {
-                color: "#000",
-              },
-              confine:true,
-              formatter: function (value) {
-                let html=`<div style="z-index:999;">
-                        <div>营业网点</div>
-                        <div>总数:3020</div>
-                        <div>达标数:2000</div>
-                        <div>自有产权数:1500</div>
-                        <div>区域外网数:80</div>
-                    </div>`
-                return html;
-              },
-            },
-
-            //   alignTo: 'none',
-            //   bleedMargin: 5,
-
-            // left: 0,
-            // right: 0,
-            // top: 0,
-            // bottom: 0,
-          },
-          {
-            name: "业务库",
-            type: "pie",
-            radius: ["65%", "85%"],
-            center: [`37.5%`, "50%"],
-            data: [
-              {
-                name: "一类库",
-                value: 2000,
-              },
-              {
-                name: "二类库",
-                value: 1500,
-              },
-              {
-                name: "三类库",
-                value: 80,
-              },
-              {
-                name: "四类库",
-                value: 80,
-              },
-            ],
-            label: {
-              show: true,
-              position: "center",
-              color: "#fff",
-              fontSize: 14,
-              formatter: function (value) {
-                return "2000\n" + "\n业务库";
-              },
-            },
-            tooltip: {
-              show: true,
-              trigger: "item",
-              backgroundColor: "#b8bdc0",
-              textStyle: {
-                color: "#000",
-              },
-              confine: true,
-              formatter: function (value) {
-                let html = `<div style="z-index:999;">
-                        <div>业务库</div>
-                        <div>总数:3020</div>
-                        <div>一类库:2000</div>                        
-                        <div>二类库:1500</div>
-                        <div>三类库:80</div>
-                        <div>四类库:80</div>
-                    </div>`;
-                return html;
-              },
-            },
-
-            //   alignTo: 'none',
-            //   bleedMargin: 5,
-
-            // left: 0,
-            // right: 0,
-            // top: 0,
-            // bottom: 0,
-          },
-          {
-            name: "自助银行",
-            type: "pie",
-            radius: ["62%", "85%"],
-            center: [`62.5%`, "50%"],
-            data: [
-              {
-                name: "在行式自助银行",
-                value: 2000,
-              },
-              {
-                name: "离行式自助银行",
-                value: 1500,
-              },
-            ],
-            label: {
-              show: true,
-              position: "center",
-              color: "#fff",
-              fontSize: 14,
-              formatter: function (value) {
-                return "4000\n" + "\n自助银行";
-              },
-            },
-            tooltip: {
-              show: true,
-              trigger: "item",
-              backgroundColor: "#b8bdc0",
-              textStyle: {
-                color: "#000",
-              },
-              confine: true,
-              formatter: function (value) {
-                let html = `<div style="z-index:999;">
-                        <div>自助银行</div>
-                        <div>总数:4000</div>
-                        <div>在行式自助银行:2000</div>                        
-                        <div>离行式自助银行:1500</div>
-                    </div>`;
-                return html;
-              },
-            },
-          },
-          {
-            name: "自助设备",
-            type: "pie",
-            radius: ["62%", "85%"],
-            center: [`87.5%`, "50%"],
-            data: [
-              {
-                name: "在行式穿墙机具",
-                value: 2000,
-              },
-              {
-                name: "在行式堂式机具",
-                value: 1500,
-              },
-              {
-                name: "离行式穿墙机具",
-                value: 2000,
-              },
-              {
-                name: "离行式堂式机具",
-                value: 1500,
-              },
-            ],
-            label: {
-              show: true,
-              position: "center",
-              color: "#fff",
-              fontSize: 14,
-              formatter: function (value) {
-                return "10000\n" + "\n自助设备";
-              },
-            },
-            tooltip: {
-              show: true,
-              trigger: "item",
-              backgroundColor: "#b8bdc0",
-              textStyle: {
-                color: "#000",
-              },
-              confine: true,
-              formatter: function (value) {
-                let html = `<div style="z-index:999;">
-                        <div>自助设备</div>
-                        <div>总数:4000</div>
-                        <div>在行式穿墙机具:2000</div>                        
-                        <div>在行式堂式机具:1500</div>
-                        <div>离行式穿墙机具:2000</div>                        
-                        <div>离行式堂式机具:1500</div>
-                    </div>`;
-                return html;
-              },
-            },
-          },
-        ],
-      };
-      if (option && typeof option === "object") {
-        this.myChart.setOption(option);
-      }
-    },
 
     resetTimer() {
-      // this.timer && clearInterval(this.timer);
-      // this.timer = setInterval(() => {
-      //   if (this.isMouseOver) {
-      //     return;
-      //   }
-      //   this.activeName = getNextPeriod(this.types, this.activeName);
-      //   this.getData();
-      // }, this.refreshTime);
+      this.timer && clearInterval(this.timer);
+      this.timer = setInterval(() => {
+        if (this.isMouseOver) {
+          return;
+        }
+        this.activeName = getNextPeriod(this.types, this.activeName);
+        this.getData();
+      }, this.refreshTime);
     },
   },
 };
 </script>
-<style lang="scss" scoped>
-.map-template {
-  & > div {
-    margin: 0px;
-    padding: 0px;
-  }
 
-  & > div:first-child {
-    // display: none;
-    width: 30px;
-    height: 100%;
+<style lang="scss" scope>
+.content {
+  display: flex;
+
+  margin-bottom: 20px;
+  margin-left: 5px;
+  margin-right: 5px;
+  border: solid 1px #b8bdc088;
+
+  & > span {
+    margin-right: 10px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    height: 30px;
     color: rgb(245, 245, 245);
-    background-color: #b8bdc088;
-    text-align: center;
     font-size: 14px;
-    writing-mode: vertical-lr;
-    padding-left: 5px;
-    padding-right: 5px;
   }
 
-  // & > div:nth-child(2) {
-  //   height: 100%;
-  //   width: calc(100% - 30px);
-  //   font-size: 14px;
-  //   line-height: 23px;
-  //   display: flex;
-  //   flex-direction: row;
-
-  //   & > div {
-  //     border: solid 1px #b8bdc088;
-  //     background-color: #b8bdc055;
-  //     display: flex;
-  //     flex-direction: column;
-  //     width:calc(25% - 20px);
-  //     margin: 10px;
-      
-
-  //     & > span:first-child {
-  //       background-color: #b8bdc088;
-  //       text-align: center;
-  //     }
-  //     & > span:not(:nth-child(1)) {
-  //       & > span {
-  //         display: inline-block;
-  //       }
-  //       & > span:first-child {
-  //         width: calc(100% - 60px);
-  //         text-align: right;
-  //       }
-  //       & > span:last-child {
-  //         width: 60px;
-  //       }
-  //     }
-  //   }
-  // }
-  & > div:last-child {
-    height: 100%;
-    width: calc(100% - 30px);
+  & > span:first-child {
+    width: 100px;
+    background-color: #b8bdc088;
+    text-align: center;
   }
 }
+
+
 </style>

+ 498 - 0
src/views/board/charts/org/report_pie.vue

@@ -0,0 +1,498 @@
+<!--  -->
+<template>
+  <div
+    class="chart-template map-template"
+    style="display: flex; flex-direction: row"
+  >
+    <div>机构统计</div>
+    <!-- <div>
+      <div>
+        <span>营业网点</span>
+        <span>
+          <span>总数:</span>
+          <span>3020</span>
+        </span>
+        <span>
+          <span>达标数:</span>
+          <span>500</span>
+        </span>
+        <span>
+          <span>自有产权数:</span>
+          <span>1500</span>
+        </span>
+        <span>
+          <span>区域外网数:</span>
+          <span>80</span>
+        </span>
+      </div>
+      <div>
+        <span>自助设备</span>
+        <span>
+          <span>总数:</span>
+          <span>4000</span>
+        </span>
+        <span>
+          <span>在行式穿墙机具:</span>
+          <span>2000</span>
+        </span>
+        <span>
+          <span>在行式堂式机具:</span>
+          <span>1500</span>
+        </span>
+        <span>
+          <span>离行式穿墙机具:</span>
+          <span>2000</span>
+        </span>
+        <span>
+          <span>离行式堂式机具:</span>
+          <span>1500</span>
+        </span>
+      </div>
+      <div>
+        <span>自助银行</span>
+        <span>
+          <span>总数:</span>
+          <span>4000</span>
+        </span>
+        <span>
+          <span>在行式自助银行:</span>
+          <span>2000</span>
+        </span>
+        <span>
+          <span>离行式自助银行:</span>
+          <span>1500</span>
+        </span>
+      </div>
+      <div>
+        <span>业务库</span>
+        <span>
+          <span>总数:</span>
+          <span>3020</span>
+        </span>
+        <span>
+          <span>一类库:</span>
+          <span>2000</span>
+        </span>
+        <span>
+          <span>二类库:</span>
+          <span>1500</span>
+        </span>
+        <span>
+          <span>三类库:80</span>
+          <span>80</span>
+        </span>
+        <span>
+          <span>四类库</span>
+          <span>80</span>
+        </span>
+      </div>
+    </div> -->
+    <div id="org_Chart"></div>
+  </div>
+</template>
+
+<script>
+import "./../../board.scss";
+import * as echarts from "echarts";
+import {
+  findMaxIndex,
+  getChartDOMSize,
+  getNextPeriod,
+  getPeriodText,
+} from "../../utils.js";
+
+export default {
+  props: ["orgId"],
+  data() {
+    return {
+      data: {
+        all: [],
+        completed: [],
+        name: [],
+      },
+    };
+  },
+
+  components: {},
+
+  computed: {},
+
+  watch: {
+    orgId: {
+      deep: true,
+      handler(val) {
+        // this.resetTimer();
+        this.getData();
+      },
+    },
+    data: {
+      deep: true,
+      handler() {
+        this.initMap();
+      },
+    },
+  },
+
+  created() {
+    // this.types = types;
+    this.maxDisplay = 16;
+    // this.refreshTime = 1 * 10 * 1000;
+    // this.isMouseOver = false;
+  },
+
+  async mounted() {
+    window.addEventListener("resize", this.windowResize);
+  },
+  beforeDestroy() {
+    this.timer && clearInterval(this.timer);
+    this.timer = null;
+
+    window.removeEventListener("resize", this.windowResize);
+  },
+
+  methods: {
+    handleClick() {
+      this.resetTimer();
+      this.getData();
+    },
+    handleMouseEnter() {
+      this.isMouseOver = true;
+    },
+    handleMouseLeave() {
+      this.isMouseOver = false;
+    },
+    async getData() {
+      // let bs = parseInt(this.activeName) + 1;
+      this.data = {
+        all: 500,
+        unconfirm: 112, //未确认
+        auditing: 20, //异议审批中
+        unreform: 50, //待整改
+        notQuestion: 4,
+        reformed: 500 - 112 - 20 - 50 - 4,
+      };
+    },
+
+    windowResize() {
+      this.myChart && this.myChart.resize();
+    },
+    initMap() {
+      this.myChart && this.myChart.dispose();
+
+      // 基于准备好的dom,初始化echarts实例
+      this.myChart = echarts.init(document.getElementById("org_Chart"));
+
+      let t = this;
+      // 指定图表的配置项和数据
+      var option = {
+        backgroundColor: "rgba(0,0,0,0)",
+        // color: ["#C0FBB5", "#46557B"],
+        legend: {
+          show: false,
+          icon: "circle",
+          //   data: ["达标数", "自有产权数","区域外网数"],
+          textStyle: {
+            color: "#fff",
+            // fontSize:18
+          },
+          left: "center",
+          top: "5%",
+        },
+        tooltip: {
+          trigger: "item",
+        },
+        series: [
+          {
+            name: "营业网点",
+            type: "pie",
+            radius: ["65%", "85%"],
+            center: [`12.5%`, "50%"],
+            data: [
+              {
+                name: "达标数",
+                value: 2000,
+              },
+              {
+                name: "自有产权数",
+                value: 1500,
+              },
+              {
+                name: "区域外网数",
+                value: 80,
+              },
+            ],
+            label: {
+              show: true,
+              position: "center",
+              color: "#fff",
+              fontSize: 14,
+              formatter: function (value) {
+                return "3020\n" + "\n营业网点";
+              },
+            },
+            tooltip: {
+              show: true,
+              trigger: "item",
+              backgroundColor: "#b8bdc0",
+              textStyle: {
+                color: "#000",
+              },
+              confine:true,
+              formatter: function (value) {
+                let html=`<div style="z-index:999;">
+                        <div>营业网点</div>
+                        <div>总数:3020</div>
+                        <div>达标数:2000</div>
+                        <div>自有产权数:1500</div>
+                        <div>区域外网数:80</div>
+                    </div>`
+                return html;
+              },
+            },
+
+            //   alignTo: 'none',
+            //   bleedMargin: 5,
+
+            // left: 0,
+            // right: 0,
+            // top: 0,
+            // bottom: 0,
+          },
+          {
+            name: "业务库",
+            type: "pie",
+            radius: ["65%", "85%"],
+            center: [`37.5%`, "50%"],
+            data: [
+              {
+                name: "一类库",
+                value: 2000,
+              },
+              {
+                name: "二类库",
+                value: 1500,
+              },
+              {
+                name: "三类库",
+                value: 80,
+              },
+              {
+                name: "四类库",
+                value: 80,
+              },
+            ],
+            label: {
+              show: true,
+              position: "center",
+              color: "#fff",
+              fontSize: 14,
+              formatter: function (value) {
+                return "2000\n" + "\n业务库";
+              },
+            },
+            tooltip: {
+              show: true,
+              trigger: "item",
+              backgroundColor: "#b8bdc0",
+              textStyle: {
+                color: "#000",
+              },
+              confine: true,
+              formatter: function (value) {
+                let html = `<div style="z-index:999;">
+                        <div>业务库</div>
+                        <div>总数:3020</div>
+                        <div>一类库:2000</div>                        
+                        <div>二类库:1500</div>
+                        <div>三类库:80</div>
+                        <div>四类库:80</div>
+                    </div>`;
+                return html;
+              },
+            },
+
+            //   alignTo: 'none',
+            //   bleedMargin: 5,
+
+            // left: 0,
+            // right: 0,
+            // top: 0,
+            // bottom: 0,
+          },
+          {
+            name: "自助银行",
+            type: "pie",
+            radius: ["62%", "85%"],
+            center: [`62.5%`, "50%"],
+            data: [
+              {
+                name: "在行式自助银行",
+                value: 2000,
+              },
+              {
+                name: "离行式自助银行",
+                value: 1500,
+              },
+            ],
+            label: {
+              show: true,
+              position: "center",
+              color: "#fff",
+              fontSize: 14,
+              formatter: function (value) {
+                return "4000\n" + "\n自助银行";
+              },
+            },
+            tooltip: {
+              show: true,
+              trigger: "item",
+              backgroundColor: "#b8bdc0",
+              textStyle: {
+                color: "#000",
+              },
+              confine: true,
+              formatter: function (value) {
+                let html = `<div style="z-index:999;">
+                        <div>自助银行</div>
+                        <div>总数:4000</div>
+                        <div>在行式自助银行:2000</div>                        
+                        <div>离行式自助银行:1500</div>
+                    </div>`;
+                return html;
+              },
+            },
+          },
+          {
+            name: "自助设备",
+            type: "pie",
+            radius: ["62%", "85%"],
+            center: [`87.5%`, "50%"],
+            data: [
+              {
+                name: "在行式穿墙机具",
+                value: 2000,
+              },
+              {
+                name: "在行式堂式机具",
+                value: 1500,
+              },
+              {
+                name: "离行式穿墙机具",
+                value: 2000,
+              },
+              {
+                name: "离行式堂式机具",
+                value: 1500,
+              },
+            ],
+            label: {
+              show: true,
+              position: "center",
+              color: "#fff",
+              fontSize: 14,
+              formatter: function (value) {
+                return "10000\n" + "\n自助设备";
+              },
+            },
+            tooltip: {
+              show: true,
+              trigger: "item",
+              backgroundColor: "#b8bdc0",
+              textStyle: {
+                color: "#000",
+              },
+              confine: true,
+              formatter: function (value) {
+                let html = `<div style="z-index:999;">
+                        <div>自助设备</div>
+                        <div>总数:4000</div>
+                        <div>在行式穿墙机具:2000</div>                        
+                        <div>在行式堂式机具:1500</div>
+                        <div>离行式穿墙机具:2000</div>                        
+                        <div>离行式堂式机具:1500</div>
+                    </div>`;
+                return html;
+              },
+            },
+          },
+        ],
+      };
+      if (option && typeof option === "object") {
+        this.myChart.setOption(option);
+      }
+    },
+
+    resetTimer() {
+      // this.timer && clearInterval(this.timer);
+      // this.timer = setInterval(() => {
+      //   if (this.isMouseOver) {
+      //     return;
+      //   }
+      //   this.activeName = getNextPeriod(this.types, this.activeName);
+      //   this.getData();
+      // }, this.refreshTime);
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.map-template {
+  & > div {
+    margin: 0px;
+    padding: 0px;
+  }
+
+  & > div:first-child {
+    // display: none;
+    width: 30px;
+    height: 100%;
+    color: rgb(245, 245, 245);
+    background-color: #b8bdc088;
+    text-align: center;
+    font-size: 14px;
+    writing-mode: vertical-lr;
+    padding-left: 5px;
+    padding-right: 5px;
+  }
+
+  // & > div:nth-child(2) {
+  //   height: 100%;
+  //   width: calc(100% - 30px);
+  //   font-size: 14px;
+  //   line-height: 23px;
+  //   display: flex;
+  //   flex-direction: row;
+
+  //   & > div {
+  //     border: solid 1px #b8bdc088;
+  //     background-color: #b8bdc055;
+  //     display: flex;
+  //     flex-direction: column;
+  //     width:calc(25% - 20px);
+  //     margin: 10px;
+      
+
+  //     & > span:first-child {
+  //       background-color: #b8bdc088;
+  //       text-align: center;
+  //     }
+  //     & > span:not(:nth-child(1)) {
+  //       & > span {
+  //         display: inline-block;
+  //       }
+  //       & > span:first-child {
+  //         width: calc(100% - 60px);
+  //         text-align: right;
+  //       }
+  //       & > span:last-child {
+  //         width: 60px;
+  //       }
+  //     }
+  //   }
+  // }
+  & > div:last-child {
+    height: 100%;
+    width: calc(100% - 30px);
+  }
+}
+</style>

+ 2 - 0
src/views/board/charts/otherTask/report.vue

@@ -194,4 +194,6 @@ export default {
     text-align: center;
   }
 }
+
+
 </style>

+ 43 - 24
src/views/board/charts/resumption/report.vue

@@ -2,7 +2,7 @@
 <template>
   <div class="chart-template chart-template-withperiod">
     <p>
-      <span> 日常安全履职 </span>
+      <span> {{title}} </span>
     </p>
     <div>
       <el-tabs v-model="activeName" @tab-click="handleClick">
@@ -14,7 +14,7 @@
         ></el-tab-pane>
       </el-tabs>
     </div>
-    <div id="commAlarmEvent_Chart"></div>
+    <div ref='chart'></div>
   </div>
 </template>
 
@@ -50,7 +50,16 @@ const types = [
   },
 ];
 export default {
-  props: ["orgId"],
+  props: {
+    orgId:{
+      type:String,
+      isRequired:true
+    },
+    title:{
+      type:String,
+      isRequired:true
+    }
+  },
   data() {
     return {
       data: {
@@ -117,6 +126,11 @@ export default {
         completed: [155 * bs, 99 * bs, 110 * bs, 78 * bs, 104 * bs, 102 * bs],
         name: ["福州", "漳州", "泉州", "三明", "南平", "宁德"],
       };
+      this.data.rate=[];
+      this.data.all.forEach((v,i)=>{
+        this.data.rate[i]=this.data.completed[i]/this.data.all[i]*100
+      })
+      console.info(this.data)
     },
 
     windowResize() {
@@ -124,21 +138,25 @@ export default {
     },
     initMap() {
       this.myChart && this.myChart.dispose();
+let c=this.$refs["chart"];
 
       // 基于准备好的dom,初始化echarts实例
       this.myChart = echarts.init(
-        document.getElementById("commAlarmEvent_Chart")
+       c
+        // document.getElementById("commAlarmEvent_Chart")
       );
 
       let t = this;
       // 指定图表的配置项和数据
       var option = {
-        color: ["#008CD6", "#82D5AE"],
+        //  color: ["#82D5AE"],
         tooltip: {
           trigger: "axis",
+          confine: true,
           axisPointer: {
             type: "shadow",
           },
+          formatter:"{c}%"
         },
         legend: {
           show:true,
@@ -150,7 +168,7 @@ export default {
           left: "3%",
           right: "4%",
           bottom: "2%",
-          top: "30px",
+          top: "40px",
           containLabel: true,
         },
 
@@ -188,35 +206,36 @@ export default {
           },
         ],
         series: [
+          // {
+          //   name: "总数",
+          //   type: "bar",
+          //   barWidth: "14",
+          //   // label: {
+          //   //   show: true,
+          //   //   position: 'top',
+          //   // },
+          //   data: this.data.all,
+          // },
           {
-            name: "总数",
-            type: "bar",
-            barWidth: "14",
-            // label: {
-            //   show: true,
-            //   position: 'top',
-            // },
-            data: this.data.all,
-          },
-          {
-            name: "已完成",
+            name: "完成率",
             type: "bar",
             barWidth: "14",
             // label: {
             //   show: true,
             //   position: 'top',
             // },
-            data: this.data.completed,
+            data: this.data.rate,
             itemStyle: {
               normal: {
                 label: {
                   formatter: function (param) {
-                    if (t.data.all[param.dataIndex]) {
-                      let rate = param.value / t.data.all[param.dataIndex];
-                      return (Math.floor(rate * 1000) / 10).toFixed(1) + "%";
-                    } else {
-                      return "";
-                    }
+                    // if (t.data.all[param.dataIndex]) {
+                    //   let rate = param.value / t.data.all[param.dataIndex];
+                    //   return (Math.floor(rate * 1000) / 10).toFixed(1) + "%";
+                    // } else {
+                    //   return "";
+                    // }
+                    return param.value.toFixed(1) + "%"
                   },
                   show: true,
                   position: "top",

+ 50 - 25
src/views/board/index.vue

@@ -31,10 +31,16 @@
     <div class="main">
       <div>
         <div>
-          <resumptionReport :orgId="selectedOrg.id" />
+          <resumptionReport :orgId="selectedOrg.id" title="日常安全履职"/>
         </div>
-        <div>
+        <!-- <div>
           <otherTask :orgId="selectedOrg.id" />
+        </div> -->
+        <div>
+          <resumptionReport :orgId="selectedOrg.id" title="监控调阅"/>
+        </div>
+        <div>
+          <resumptionReport :orgId="selectedOrg.id" title="日常安全检查"/>
         </div>
       </div>
       <div>
@@ -47,15 +53,19 @@
       </div>
       <div>
         <div>
-          <div>
-            <question :orgId="selectedOrg.id" />
-          </div>
+          <resumptionReport :orgId="selectedOrg.id" title="预案演练"/>
         </div>
         <div>
+          <resumptionReport :orgId="selectedOrg.id" title="教育培训"/>
+        </div>
+        <div>          
+            <question :orgId="selectedOrg.id" />
+        </div>
+        <!-- <div>
           <div>
             <safetyIndex :orgId="selectedOrg.id" />
           </div>
-        </div>
+        </div> -->
       </div>
     </div>
   </div>
@@ -428,7 +438,7 @@ export default {
 .main {
   padding: 0 20px;
   padding-top: 5px;
-  height: calc(100% - 90px);
+  height: calc(100% - 65px);
   display: flex;
   flex-direction: row;
   justify-content: space-between;
@@ -477,13 +487,16 @@ export default {
       margin: 0.5rem;
       background-image: url(@/assets/board/area_border.png);
       background-size: 100% 100%;
+      display: flex;
+      flex-direction: column;
+      height: 100%;
     }
 
     &:first-child {
       display: flex;
       flex-direction: column;
       height: 100%;
-      width: 30%;
+      width: 27%;
       & > div {
         width: calc(100% - 10px);
       }
@@ -494,7 +507,7 @@ export default {
         display: flex;
         flex-direction: row;
         justify-content: space-between;
-        height: 34%;
+        height: calc(33% - 16px);
         // padding: 0;
         // margin-bottom: 0px;
         // padding-bottom: 10px;
@@ -520,7 +533,15 @@ export default {
 
       & > div:nth-child(2) {
         // width: 100%;
-        height: calc(66% - 10px);
+        height: calc(34% - 16px);
+        display: flex;
+        justify-content: space-between;
+        // border: none;
+        // padding: 0;
+      }
+      & > div:nth-child(3) {
+        // width: 100%;
+        height: calc(33% - 16px);
         display: flex;
         justify-content: space-between;
         // border: none;
@@ -532,7 +553,7 @@ export default {
       display: flex;
       flex-direction: column;
       height: 100%;
-      width: 45%;
+      width: 46%;
       & > div {
         width: calc(100% - 10px);
       }
@@ -545,7 +566,7 @@ export default {
       }
 
       & > div:first-child {
-        height: 80%;
+        height: calc(67% - 16px);
         display: flex;
         background-image: none;
         flex-direction: column;
@@ -559,34 +580,38 @@ export default {
       }
 
       & > div:nth-child(2) {
-        height: 20%;
+        height:  calc(33% - 16px);
       }
     }
 
     &:nth-child(3) {
-      display: flex;
-      flex-direction: column;
-      height: 100%;
-      width: 25%;
+      width: 27%;
 
       & > div:first-child {
         width: 100%;
-        height: 34%;
+        height: calc(33% - 16px);
 
-        & > div {
-          height: calc(100% - 21px);
-        }
+        // & > div {
+        //   height: calc(100% - 21px);
+        // }
       }
 
       & > div:nth-child(2) {
         width: 100%;
-        height: 66%;
+        height: calc(34% - 16px);
 
-        & > div {
-          height: calc(100% - 21px);
-        }
+        // & > div {
+        //   height: calc(100% - 21px);
+        // }
       }
+      & > div:nth-child(3) {
+        width: 100%;
+        height: calc(33% - 16px);
 
+        // & > div {
+        //   height: calc(100% - 21px);
+        // }
+      }
       // & > div:nth-child(3) {
       //   width: 100%;
       //   height: 34%;

+ 24 - 2
src/views/check/dialog.edit.vue

@@ -256,8 +256,14 @@
           </el-form-item>
         </el-form>
         <el-button @click="openSelect">新增检查内容</el-button>
-
-        <el-table :data="tableData" style="width: 100%" height="400px">
+        <el-button @click="deleteSelected">批量删除</el-button>
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          height="400px"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection"></el-table-column>
           <el-table-column label="是否扫描">
             <template v-slot="{ row }">
               <el-switch
@@ -364,6 +370,7 @@ export default {
       planExec: null,
       count: 0,
       description: null,
+      selectedRows: [],
       propItem: "",
       row: "",
       tableData: [],
@@ -398,6 +405,21 @@ export default {
     ...mapGetters(["orgId", "orgName"]),
   },
   methods: {
+    // 监听行选中事件,将选中的行数据存入 selectedRows 数组中
+    handleSelectionChange(selection) {
+      // console.log(selection, "selection");
+      this.selectedRows = selection;
+    },
+    deleteSelected() {
+      // 在这里执行批量删除操作,使用 this.selectedRows 数组中的数据
+      // console.log("删除选中的数据:", this.selectedRows);
+      // 从数据数组中移除选中的行数据
+      this.tableData = this.tableData.filter(
+        (row) => !this.selectedRows.includes(row)
+      );
+      // 清空选中的行数据
+      this.selectedRows = [];
+    },
     //省联社内容不能删除
     getshenglianshe(row) {
       if (row.ofOrgId == this.orgId) {

+ 1 - 1
src/views/check/task/index.vue

@@ -235,7 +235,7 @@
           </el-table-column>
 
           <el-table-column
-            prop="submitName"
+            prop="submitBy"
             label="检查人"
             min-width="100"
             v-if="columns[7].visible"

+ 26 - 2
src/views/resumption/plan/dialog.edit.vue

@@ -198,8 +198,15 @@
           </el-form-item>
         </el-form>
         <el-button @click="openSelect">新增履职内容</el-button>
+        <el-button @click="deleteSelected">批量删除</el-button>
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          height="400px"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection"></el-table-column>
 
-        <el-table :data="tableData" style="width: 100%" height="400px">
           <el-table-column label="是否扫描">
             <template v-slot="{ row }">
               <el-switch
@@ -337,6 +344,7 @@ export default {
       row: "",
       tableData: [],
       id: null,
+      selectedRows: [],
       isShow: false,
       formData: {},
       formDataRules: {
@@ -367,6 +375,21 @@ export default {
     ...mapGetters(["orgId", "orgName"]),
   },
   methods: {
+    // 监听行选中事件,将选中的行数据存入 selectedRows 数组中
+    handleSelectionChange(selection) {
+      // console.log(selection, "selection");
+      this.selectedRows = selection;
+    },
+    deleteSelected() {
+      // 在这里执行批量删除操作,使用 this.selectedRows 数组中的数据
+      console.log("删除选中的数据:", this.selectedRows);
+      // 从数据数组中移除选中的行数据
+      this.tableData = this.tableData.filter(
+        (row) => !this.selectedRows.includes(row)
+      );
+      // 清空选中的行数据
+      this.selectedRows = [];
+    },
     changeBuildTime() {
       // console.log(this.formData.planCycle, "this.formData.planCycle");
       const dateObj = new Date(); // 获取当前时间对象
@@ -400,7 +423,7 @@ export default {
         case "5":
           const year2 = dateObj.getFullYear(); // 获取年份
           const month2 = String(dateObj.getMonth() + 1).padStart(2, "0"); // 获取月份,并补齐两位数
-          const day2 = String(dateObj.getDate()).padStart(2, "0"); // 获取日期,并补齐两位数
+          const day2 = "01"; // 获取日期,并补齐两位数
           var month3 = month2;
           month3++;
           for (var i = 0; i < 12; i++) {
@@ -668,6 +691,7 @@ export default {
           this.tableData = res.data.itemList;
         });
       }
+      this.changeBuildTime();
       this.isShow = true;
     },
     removeRow(row) {

+ 4 - 4
src/views/system/dept/index.vue

@@ -217,8 +217,8 @@
             <el-table-column
               label="操作"
               align="center"
-              fixed="right"
-              width="160"
+            width="300"
+            fixed="right"
               class-name="small-padding fixed-width"
             >
               <template slot-scope="scope">
@@ -240,7 +240,7 @@
                     >补充信息</el-button
                   >
                 <!-- </router-link> -->
-
+                <el-divider direction="vertical"></el-divider>
                 <el-button
                   size="mini"
                   type="text"
@@ -248,7 +248,7 @@
                   @click="handleUpdate(scope.row)"
                   v-hasPermi="['system:dept:edit']"
                   >编辑</el-button
-                >
+                ><el-divider direction="vertical"></el-divider>
                 <el-button
                   v-if="!scope.row.source"
                   size="mini"

+ 16 - 14
src/views/system/device/index.vue

@@ -21,26 +21,18 @@
             <el-form-item label="资产类别" prop="assetType">
 
               <el-select style="width: 100%;"  v-model="queryParams.assetType" placeholder="请选择"
-                @change="changeSelectDevice">
+                @change="searchChangeSelectDevice">
                 <el-option v-for="dict in dict.type.sys_asset_type" :key="dict.value" :label="dict.label"
                   :value="`${dict.value}`"></el-option>
               </el-select>
             </el-form-item>
 
           <el-form-item label="设备分类" prop="deviceType">
-            <el-select
-              style="width: 100%"
-              v-model="queryParams.deviceType"
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in devices"
-                :key="item.dictValue"
-                :label="item.dictLabel"
-                :value="item.dictValue"
-              ></el-option>
-            </el-select>
-          </el-form-item>
+              <el-select style="width: 100%;"  v-model="queryParams.deviceType" placeholder="请选择">
+                <el-option v-for="item in searchDevices" :key="item.dictValue" :label="item.dictLabel"
+                  :value="item.dictValue"></el-option>
+              </el-select>
+            </el-form-item>
 
           <el-form-item>
             <el-button
@@ -436,6 +428,7 @@ export default {
       // 【请填写功能名称】表格数据
       deviceList: [],
       devices: null,
+      searchDevices:null,
       //主机集合
       hostList: [],
       deviceType: 0,
@@ -698,6 +691,15 @@ export default {
         });
       }
     },
+    searchChangeSelectDevice(val) {
+      if (val) {
+        getDeviceType(val).then(response => {
+          this.searchDevices = response.data;
+          this.form.deviceType = null;
+          this.queryParams.deviceType = null;
+        })
+      }
+    },
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();

+ 11 - 12
src/views/system/user/extend.vue

@@ -32,6 +32,14 @@
                   :value="dict.value" />
               </el-select>
             </el-form-item>
+          </el-col> 
+
+          <el-col :xs="24" :sm="12" :md="8" :lg="8">
+            <el-form-item label="初级以上相关专业技术职业资格" v-if="formData.certificateWork != 0" label-width="240" prop="professionalQualifications">
+              <el-input style="width: 280px;" maxlength="50" v-model="formData.professionalQualifications"
+                placeholder="请输入初级以上相关专业技术职业资格">
+              </el-input>
+            </el-form-item>
           </el-col>
         </el-row>
         <el-row>
@@ -82,25 +90,16 @@
             </el-form-item>
           </el-col>
 
-          <el-col :xs="24" :sm="12" :md="8" :lg="8">
-            <el-form-item label="初级以上相关专业技术职业资格" label-width="240" prop="professionalQualifications">
+          <!-- <el-col :xs="24" :sm="12" :md="8" :lg="8">
+            <el-form-item label="初级以上相关专业技术职业资格" v-if="formData.certificateWork != 0" label-width="240" prop="professionalQualifications">
               <el-input style="width: 280px;" maxlength="50" v-model="formData.professionalQualifications"
                 placeholder="请输入初级以上相关专业技术职业资格">
               </el-input>
             </el-form-item>
-          </el-col>
+          </el-col> -->
         </el-row>
-
         <el-row>
 
-          <!-- <el-col :xs="24" :sm="12" :md="8" :lg="6">
-            <el-form-item label="持证上岗未通过原因" v-if="formData.certificateWork==0" label-width="180" prop="certificateFailReason">
-              <el-select style="width: 190px;" v-model="formData.certificateFailReason" placeholder="请选择持证上岗未通过原因">
-                <el-option v-for="dict in dict.type.post_no_pass" :key="dict.value" :label="dict.label"
-                  :value="dict.value" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
             <el-col :xs="24" :sm="12" :md="8" :lg="6">
             <el-form-item prop="bornTime" label="出生日期">
               <el-date-picker v-model="formData.bornTime" @change="startDateChanged"

+ 1 - 0
src/views/system/user/index.vue

@@ -797,6 +797,7 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
+      this.queryParams.roleId=null;
       this.resetForm("queryForm");
       this.queryParams.onlyManager = false;
       this.handleQuery();