提交广州AI页面

src/pages/gzaiBox/index.vue

@@ -8,21 +8,17 @@
               style="transform: scale(0.8); position: relative; top: -40px; left: -70px"
             > -->
             <project-overview-chart
-              :key="'ai1' + overviewDay"
+              :key="'ai1' + overview"
               :sp="''"
-              txtTop="12"
-              gifTop="8px"
               :maintitle="overviewTotalDay"
               :legend-opt="legendOpt1"
               :typedata="typeDistributionDataDay"
               :text="overviewTextDay"
-              :width="580"
-              :height="180"
-              :fn="changeChart1"
+              :height="230"
             ></project-overview-chart>
             <!-- </div> -->
           </module-one-1-1>
-          <module-one-2-1 label="预警概况" style="position: relative">
+          <module-one-2-1 label="预警概况">
             <!-- <div
               class="scroll"
               style="max-height: 580px; overflow-y: auto; margin-top: 20px"
@@ -54,9 +50,7 @@
               :legend-opt="legendOpt2"
               :typedata="typeDistributionData"
               :text="overviewText"
-              :width="580"
-              :height="180"
-              :fn="changeChart1"
+              :height="230"
             ></project-overview-chart>
           </module-one-2-1>
         </el-col>
@@ -203,29 +197,28 @@ export default {
       legendOpt1: {
         icon: "rect",
         textStyle: {
-          fontSize: 9,
           color: "#c3dbfd",
+          fontSize: 15,
           rich: {
             name: {
               color: "#c3dbfd",
-              padding: [0, 0, 0, 0],
+              padding: [0, 20, 0, 0],
             },
             percent: {
-              color: "#f73647",
+              color: "#4676FD",
             },
           },
         },
       },
       legendOpt2: {
         icon: "rect",
-        padding: [0, 0, 0, 0],
         textStyle: {
-          fontSize: 9,
           color: "#c3dbfd",
+          fontSize: 14,
           rich: {
             name: {
               color: "#c3dbfd",
-              padding: [0, 0, 0, 0],
+              padding: [0, 20, 0, 0],
             },
             percent: {
               color: "#4676FD",
@@ -289,6 +282,7 @@ export default {
           },
         ],
       },
+      intervalTimes: null
     };
   },
   mounted() {
@@ -318,18 +312,22 @@ export default {
       this.listPage.pageIndex = 1;
       this.loadList();
     },
-    changeChart1(opt) {
-      opt.title.padding = [60, 0, 0, 145];
-      return opt;
-    },
     init() {
-      this.getAiVideoAlertorTypeCount();
-      //this.groupCountByProject();
       this.todayPage.pageIndex = 1;
-      this.loadTodayList();
       this.listPage.pageIndex = 1;
       this.selType = 0;
+      this.getAiVideoAlertorTypeCount();
+      this.loadTodayList();
       this.loadList();
+      this.initIntervalTimes();
+    },
+    myInit(){
+      this.getAiVideoAlertorTypeCount();
+      this.loadTodayList();
+      this.loadList();
+    },
+    initIntervalTimes(){
+      this.intervalId = setInterval(this.myInit, 150000); // 每2.5分钟刷新一次
     },
     handleTodayCurrentChange(n) {
       this.todayPage.pageIndex = n;
@@ -430,11 +428,6 @@ body.no-header {
   }
 }
 .project-aivideo {
-  .chart-overview-gif {
-    top: 37px !important;
-    left: 93px;
-  }
-
   .tb-list1 {
     margin: 12px;
     width: calc(100% - 24px);