标题弹窗样式

src/components/StatusBar.vue

@@ -2,11 +2,11 @@
 <template>
   <div class="status-bar" onselectstart="return false">
     <el-row>
-      <el-col :span="18" style="margin-top: 5px">
+      <el-col :span="18" style="margin-top: 8px">
         <span style="color: white; margin-left: 20px">系统时间：</span>
         <span style="color: white">{{ currentTime }}</span>
       </el-col>
-      <el-col :span="6" style="margin-top: 5px">
+      <el-col :span="6" style="margin-top: 8px">
         <el-popover
           placement="top-start"
           :width="521"
@@ -282,6 +282,22 @@ export default {
           { lastUpdateTime: "-", stationName: "-", alertText: "-" },
         ];
       }
+      if (this.hiddenDangerData.length <= 0) {
+        this.hiddenDangerData = [
+          { lastUpdateTime: "-", stationName: "-", alertText: "-" },
+        ];
+      }
+      if (this.defectData.length <= 0) {
+        this.defectData = [
+          { lastUpdateTime: "-", stationName: "-", alertText: "-" },
+        ];
+      }
+      if (this.malfunctionData.length <= 0) {
+        this.malfunctionData = [
+          { lastUpdateTime: "-", stationName: "-", alertText: "-" },
+        ];
+      }
+
     },
   },
 };

src/components/TitleBar.vue

@@ -77,13 +77,12 @@
       <el-col :span="19">
             <el-popover
           placement="bottom"
-          :width="1500"
+          :width="1416"
           trigger="hover"
           :show-arrow="false"
         >
           <template #reference>
-            <el-row>
-            <el-col :span="2.1">
+            <div class="titleinfoall">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -95,8 +94,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -108,8 +105,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -121,8 +116,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -134,8 +127,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3.3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -147,8 +138,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3.3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -160,8 +149,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -173,8 +160,6 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            <el-col :span="3.3">
               <div class="titleinfo">
                 <ul>
                   <li>
@@ -186,90 +171,118 @@
                   </li>
                 </ul>
               </div>
-            </el-col>
-            </el-row>
+            </div>
           </template>
 
           <el-table
             :data="tableData"
-            style="width: 100%">
+            border
+            border-color="rgb(36,36,36)"
+            :header-cell-style="{
+              background: 'Black',
+              color: 'rgb(220,220,220)',
+              'border-bottom':'solid 1px rgb(36,36,36)',
+              fontSize:'14px',
+              'padding-top':'7px',
+              'padding-bottom':'7px'
+            }"
+            :cell-style="{ background: 'Black', color: 'rgb(220,220,220)','border-bottom':'solid 1px rgb(36,36,36)',fontSize:'14px','padding-top':'5px','padding-bottom':'5px'}"
+            >
         <el-table-column
+              align="center"
               prop="station"
               label="站点"
-              width="80">
+              width="80px">
           </el-table-column>
         <el-table-column
+              align="center"
               prop="date"
               label="运行指标"
-              width="80">
+              width="120px">
             <el-table-column
+              align="center"
               prop="date"
-              label="日发电量（万kwh）"
-              width="80">
+              label="日发电量(万kwh)"
+              width="135px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
-              label="平均风速(m/s)\n日照强度(w/m²)"
-              width="80">
+              label="&ensp;平均风速(m/s)&ensp;日照强度(w/m²)"
+              width="130px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="address"
-              label="实时功率（MW)">
+              label="实时功率(MW)"
+              width="120px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
               label="AGC有功设定(MW)"
-              width="80">
+              width="150px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
-              label="理论功率（MW）"
-              width="80">
+              label="理论功率(MW)"
+              width="120px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
-              label="预测功率（MW）"
-              width="80">
+              label="预测功率(MW)"
+              width="120px">
             </el-table-column>
         </el-table-column>
         
         <el-table-column
+              align="center"
               prop="date"
               label="发电设备状态汇总"
-              width="80">
+              width="80px">
             <el-table-column
+              align="center"
               prop="date"
               label="接入"
-              width="80">
+              width="80px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
               label="运行"
-              width="80">
+              width="80px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="address"
-              label="待机">
+              label="待机"
+              width="80px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
               label="维护"
-              width="80">
+              width="80px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
               label="故障"
-              width="80">
+              width="80px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
               label="限电"
-              width="80">
+              width="80px">
             </el-table-column>
             <el-table-column
+              align="center"
               prop="name"
               label="离线"
-              width="80">
+              width="80px">
             </el-table-column>
         </el-table-column>
           </el-table>
@@ -337,6 +350,32 @@ export default {
       monthlyPowerGeneration: 0, // 月发电量
       annualPowerGeneration: 0, // 年发电量
       installedCapacity: 734, // 装机容量
+      tableData: [{
+            station:'麻黄山',
+          }, {
+            station:'牛首山',
+          }, {
+            station:'青山',
+          }, {
+            station:'石板泉',
+          }, {
+            station:'香山',
+          }, {
+            station:'风场汇总',
+          }, {
+            station:'大武口',
+          }, {
+            station:'平罗',
+          }, {
+            station:'宣和',
+          }, {
+            station:'马场湖',
+          }, {
+            station:'海子井',
+          }, {
+            station:'光伏汇总',
+          }
+          ]
     };
   },
   computed: {
@@ -445,7 +484,7 @@ export default {
 }
 .logo {
   position: relative;
-  top: 33%;
+  top: 32%;
   margin-left: 10px;
 }
 .titleinfo {
@@ -467,4 +506,7 @@ export default {
   border-radius: 8px;
   border: none;
 }
+.titleinfoall{
+  display: flex;;
+}
 </style>

src/components/area/windturbine/control/ControlMatrixCard.vue

@@ -237,15 +237,14 @@ export default {
 .card-unselect-0 {
   border: 2px solid rgb(255, 255, 255);
 }
-.card-select-0 {
-  border: 2px solid rgb(255, 255, 255, 0.5);
-}
 /*  左边卡片选中和未选中 */
 .card-left-select-0 {
   background-color: rgb(255, 255, 255, 0.5);
+  color:rgb(0, 0, 0,0.5);
 }
 .card-left-unselect-0 {
   background-color: rgb(255, 255, 255);
+  color:rgb(0, 0, 0);
 }
 /*  右边卡片选中和未选中 */
 .card-right-select-0 {
@@ -434,7 +433,7 @@ export default {
   background-color: rgb(159, 163, 165, 0.5);
 }
 .card-left-unselect-7 {
-  background-color: rgb(2159, 163, 165);
+  background-color: rgb(159, 163, 165);
 }
 /*  右边卡片选中和未选中 */
 .card-right-select-7 {

src/components/area/windturbine/problem/ProblemMatrixCard.vue

@@ -229,15 +229,14 @@ export default {
 .card-unselect-0 {
   border: 2px solid rgb(255, 255, 255);
 }
-.card-select-0 {
-  border: 2px solid rgb(255, 255, 255, 0.5);
-}
 /*  左边卡片选中和未选中 */
 .card-left-select-0 {
   background-color: rgb(255, 255, 255, 0.5);
+  color:rgb(0, 0, 0,0.5);
 }
 .card-left-unselect-0 {
   background-color: rgb(255, 255, 255);
+  color:rgb(0, 0, 0);
 }
 /*  右边卡片选中和未选中 */
 .card-right-select-0 {