修改了安全界面的布局

src/components/mining/monitor/safety_statistics.vue

@@ -12,7 +12,6 @@
         <el-col span="19">
           <el-progress
             :percentage="88"
-            :format="format"
           ></el-progress>
         </el-col>
       </el-row>
@@ -27,7 +26,6 @@
         <el-col span="19">
           <el-progress
             :percentage="88"
-            :format="format"
           ></el-progress>
         </el-col>
       </el-row>
@@ -42,7 +40,6 @@
         <el-col span="19">
           <el-progress
             :percentage="92"
-            :format="format"
           ></el-progress>
         </el-col>
       </el-row>
@@ -72,4 +69,7 @@ export default {};
   font-size: 16px;
   color: #4ADEFE;
 }
+.el-progress__text {
+	  color: #F3DB5C; 
+}
 </style>

src/views/monitor/configImg/configImg.vue

@@ -1,128 +1,19 @@
 <template>
-  <div class="detaild">
-    <el-row :gutter="20">
-      <el-col :span="8">
-        <div class="home">
-          <left @fatherMethodData="fatherMethodData"></left>
-        </div>
-      </el-col>
-      <el-col span="8">
-        <div class="home">
-          <div style="width: 100%;text-align: center;margin: 30px;font-size: 18px;font-weight: 600;">总体安全评价</div>
-          <div style="width: 97%;height: 200px; border: #dcdee2 1px solid;margin: 40px 10px;">
-            <div style="display: grid;grid-template-columns: 1fr 1fr 1fr;text-align: center;margin-top: 20px;">
-              <div>
-                <div style="margin-bottom:10px">人员评分</div>
-                <rate></rate>
-              </div>
-              <div>
-                <div style="margin-bottom:10px">设备评分</div>
-                <rate></rate>
-              </div>
-              <div>
-                <div style="margin-bottom:10px">灾害评分</div>
-                <rate></rate>
-              </div>
-            </div>
-          </div>
-          <!-- 进度条显示灾害评分 -->
-          <div style="width:97%;height: 250px; border: #dcdee2 1px solid;margin: 10px;line-height: 2.5;padding: 10px;">
-            <el-row :gutter="10">
-              <el-col
-                span="4"
-                style="text-align: center"
-              >
-                水害评分
-              </el-col>
-              <el-col span="20">
-                <el-progress :percentage="95" :format="format"></el-progress>
-            
-              </el-col>
-            </el-row>
-            <el-row :gutter="10">
-              <el-col
-                span="4"
-                style="text-align: center"
-              >
-                火灾评分
-              </el-col>
-              <el-col span="20">
-               <el-progress :percentage="90" :format="format"></el-progress>
-              </el-col>
-            </el-row>
-            <el-row :gutter="10">
-              <el-col
-                span="4"
-                style="text-align: center"
-              >
-                矿压灾害
-              </el-col>
-              <el-col span="20">
-               <el-progress :percentage="88" :format="format"></el-progress>
-              </el-col>
-            </el-row>
-            <el-row :gutter="16">
-              <el-col
-                span="4"
-                style="text-align: center"
-              >
-                粉尘
-              </el-col>
-              <el-col span="20">
-                <el-progress :percentage="90" :format="format"></el-progress>
-              </el-col>
-            </el-row>
-            <el-row :gutter="10">
-              <el-col
-                span="4"
-                style="text-align: center"
-              >
-                通风情况
-              </el-col>
-              <el-col span="20">
-                <el-progress :percentage="95" :format="format"></el-progress>
-              </el-col>
-            </el-row>
-            <el-row :gutter="10">
-              <el-col
-                span="4"
-                style="text-align: center"
-              >
-                瓦斯状况
-              </el-col>
-              <el-col span="20">
-                <el-progress :percentage="90" :format="format"></el-progress>
-              </el-col>
-            </el-row>
-          </div>
-        </div>
-      </el-col>
-      <el-col span="8">
-        <div class="home">
-          <right-table ref="rightTable"></right-table>
-        </div>
-      </el-col>
-    </el-row>
-    <!-- 下半部分区域显示 -->
-    <div class="bottom_01">
-      <el-row :gutter="16">
-        <el-col span="12">
-          <div style="width: 100%;text-align: center;margin: 10px;font-size: 16px;font-weight: 600;">情况明细表</div>
-          <div class="bottom_02">
-            <detailed-table
-              ref="detailedTable"
-              @fatherMethod="fatherMethod"
-            ></detailed-table>
-          </div>
-        </el-col>
-        <el-col span="12">
-          <div style="width: 100%;text-align: center;margin: 10px;font-size: 16px;font-weight: 600;">情况明细图</div>
-          <div class="bottom_02">
-            <detailed-view ref="mychild"></detailed-view>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
+  <div class="detail">
+    <el-select
+      style="margin-top: 10px"
+      v-model="currentChartId"
+      placeholder="请选择"
+      @change="selectParm"
+    >
+      <el-option
+        v-for="item in parmOptions"
+        :key="item.id + ''"
+        :label="item.label"
+        :value="item.id"
+      >
+      </el-option>
+    </el-select>
   </div>
 </template>
 
@@ -135,7 +26,24 @@ import rate from "@/components/monitor/rate";
 export default {
   data() {
     return {
-      fullHeight: document.documentElement.clientHeight,
+      parmOptions: [
+        {
+          id: 1,
+          label: "负荷",
+        },
+        {
+          id: 2,
+          label: "电压",
+        },
+        {
+          id: 3,
+          label: "电流",
+        },
+        {
+          id: 4,
+          label: "功率因数",
+        },
+      ],
     };
   },
   components: {
@@ -145,67 +53,30 @@ export default {
     rightTable,
     rate,
   },
-  watch: {
-    fullHeight(val) {
-      //监控浏览器高度变化
-      if (!this.timer) {
-        this.fullHeight = val;
-        this.timer = true;
-        const that = this;
-        setTimeout(function () {
-          that.timer = false;
-        }, 400);
-      }
-    },
-  },
-  mounted() {
-    this.getBodyHeight();
-  },
-  methods: {
-    //data传送
-    fatherMethod(data) {
-      //调用子组件的方法，点击左侧区域的测点，展示右侧特定曲线图
-      this.$refs.mychild.parentHandleclick(data);
-    },
-    fatherMethodData(data) {
-      this.$refs.detailedTable.parentHandleclick(data);
-      this.$refs.rightTable.parentHandleclick(data);
-    },
-
-    getBodyHeight() {
-      //动态获取浏览器高度
-      const that = this;
-      window.onresize = () => {
-        return (() => {
-          window.fullHeight = document.documentElement.clientHeight;
-          that.fullHeight = window.fullHeight;
-        })();
-      };
-    },
-  },
+  methods: {},
 };
 </script>
 
 <style scoped>
-.detaild {
-  background-color: #100C2A;
-  color: white;
+.detail {
+  width: 100%;
+  height: 850px;
+  position: relative;
+  background-image: linear-gradient(
+    to right,
+    #06133c 0%,
+    #011669 50%,
+    #06133c 100%
+  );
 }
-.home {
-  border: #dcdee2 1px solid;
-  height: 600px;
+.detail .el-select {
+  width: 100px;
+  margin-left: 10px;
 }
-
-.bottom_01 {
-  margin-top: 10px;
-  border: #dcdee2 1px solid;
+.detail >>> .el-input--small .el-input__inner {
+  background: none;
 }
-
-.bottom_02 {
-  margin: 10px;
-  border: #dcdee2 1px solid;
-  height: 250px;
-  width: 97%;
-  padding: 5px;
+.detail >>> .el-input__inner {
+  border: 0;
 }
 </style>

src/views/power_supply/dataBoard/leftChart.vue

@@ -8,7 +8,7 @@
       @change="selectParm"
     >
       <el-option
-        v-for="item in parmoptions"
+        v-for="item in parmOptions"
         :key="item.id+''"
         :label="item.label"
         :value="item.id"