问题修改

.env.development

@@ -15,8 +15,8 @@ VUE_APP_DIALOG_POINT = contextmenu
 VUE_APP_ALARM=http://10.220.1.5:6015
 
 
-VUE_APP_API=http://10.220.1.5:6060
-# VUE_APP_API=http://10.220.1.245:6060
+# VUE_APP_API=http://10.220.1.5:6060
+VUE_APP_API=http://10.220.1.244:6060
 
 
 VUE_APP_URL=https://10.220.1.5:5300

src/api/wisdomOverhaul/energy/index.js

@@ -75,7 +75,7 @@ const getCurvefittingmainList = (data) => {
     return request({
         baseURL: process.env.VUE_APP_NEW_WISDOM,
         // url: `leaderboard/curvefittingmainList?isAsc=${data.isAsc}&wpId=${data.wpId}&recorddate=${data.recorddate}&pageNum=${data.pageNum}&pageSize=${data.pageSize}`,
-        url: `leaderboard/curvefittingmainList?wpId=${data.wpId}`,
+        url: `leaderboard/curvefittingmainList?wpId=${data.wpId}&recorddate=${data.recorddate}`,
         // url: `leaderboard/curvefittingmainList`,
         method: "post",
         data: data

src/components/coms/panel/panel-sand-toolbar.vue

@@ -28,7 +28,8 @@
 <style lang="less">
     .com-panel-sand {
         // background: #1a1f2fCC;
-        background: #142446  !important;
+        // background: #142446  !important;
+        background: rgba(41, 45, 53, 0.4) !important;
         padding: 0 1.481vh 1.481vh 1.481vh;
         border-top: 1px solid #15a952;
         position: relative;

src/components/coms/panel/panel-sand.vue

@@ -2,7 +2,10 @@
     <div class="com-panel-sand">
         <div class="com-panel-sand-header font-sm white">
             <span class="com-panel-sand-title">{{ title }}</span>
-            <span class="com-panel-sand-sub-title font-sm gray">{{ subTitle }}</span>
+            <!-- <span class="com-panel-sand-sub-title font-sm gray">{{ subTitle }}</span> -->
+            <div class="com-panel-sand-sub-title">
+                <slot name="tools"></slot>
+            </div>
         </div>
         <div class="com-panel-body">
             <slot></slot>
@@ -32,7 +35,8 @@
     .com-panel-sand {
         // background: #1a1f2fCC;
         // background: rgba(33, 105, 195, .1) !important;
-        background: #142446  !important;
+        // background: #142446 !important;
+        background: rgba(41, 45, 53, 0.4) !important;
         padding: 0 1.481vh 0 1.481vh !important;
         // border-top: 1px solid #15a952;
         border-top: 1px solid #2169c3 !important;

src/components/windDetail/index.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="bodys">
-    <div class="edge" v-if="Object.keys(monitorInfo).length">
+     <!-- v-if="Object.keys(monitorInfo).length" -->
+    <div class="edge" v-if="0">
       <div class="info" style="position: relative">
         <div class="info-wrapper">
           <!-- <div class="ps-info">
@@ -194,51 +195,50 @@
             v-if="current === 'fdj'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/fdj.png"
+            src="@assets/imgs/fdj_b.png"
           />
           <img
             v-if="current === 'clx'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/clx.png"
+            src="@assets/imgs/clx_b.png"
           />
           <img
             v-if="current === 'bj'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/bj.png"
+            src="@assets/imgs/bj_b.png"
           />
           <img
             v-if="current === 'ph'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/ph.png"
+            src="@assets/imgs/ph_b.png"
           />
           <img
             v-if="current === 'yy'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/yy.png"
+            src="@assets/imgs/yy_b.png"
           />
           <img
             v-if="current === 'jc'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/jc.png"
+            src="@assets/imgs/jc_b.png"
           />
           <img
             v-if="current === 'qt'"
             class="wind-part"
             :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/qt.png"
+            src="@assets/imgs/qt_b.png"
           />
         </div>
       </div>
       <div class="part-info">
         <div
           class="part-body"
-          style="max-height: 220px"
-          v-if="partDInfos.length"
+          style="max-height: 25vh"
         >
           <div class="monitoring-item">
             <div class="point point-left bottom"></div>
@@ -264,8 +264,7 @@
         </div>
         <div
           class="part-body"
-          style="max-height: 220px"
-          v-if="partAInfos.length"
+          style="max-height: 25vh"
         >
           <div class="monitoring-item">
             <div class="point point-left bottom"></div>
@@ -300,11 +299,58 @@
         </div>
       </div>
     </div>
+    <div class="problems" style="color: #fff">
+        <div class="problemTit">
+            <div class="point point-left bottom"></div>
+            <div class="point point-right bottom"></div>
+            <span style="font-size: 16px;position: relative;top: -5px;">故障分类</span>
+            <div class="problemSeach">
+                <el-input v-model="inputcv" placeholder="请输入" />
+                <el-button
+                round
+                size="mini"
+                class="buttons"
+                @click="gerWxssl"
+                ><span class="button">搜索</span></el-button>
+                <el-button
+                round
+                size="mini"
+                class="buttons"
+                @click="gerWxssl"
+                ><span class="button">重置</span></el-button>
+            </div>
+        </div>
+        <div class="problemMain">
+            <div class="problemWarn">
+                <div class="warn">
+                    <div class="warnCom">
+                        <div class="warnComImg">
+                            <img src="@/assets/imgs/danger.png" alt="">
+                        </div>
+                        <div class="warnComNum"></div>
+                    </div>
+                    <div class="warnItems" v-for="(it, index) in 7" :key="index">
+                        <div class="warnItemLeft">20</div>
+                        <div class="warnItemRight">防雷保护类</div>
+                    </div>
+                </div>
+                <div class="warn" v-for="(it, index) in 2" :key="index">
+                    <div class="warnItems" v-for="(it, index) in 10" :key="index">
+                        <div class="warnItemLeft">20</div>
+                        <div class="warnItemRight">防雷保护类</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
     <alarmDialog ref="alarmDialog" />
     <powerAndSpeed ref="powerAndSpeed" :tabEvent="-1" />
   </div>
 </template>
 <script>
+import {
+  Search
+} from '@element-plus/icons-vue'
 import { GetWtPoints, GetPointsData } from "@/api/points/index.js";
 import powerAndSpeed from "@/components/powerAndSpeedSearch/index.vue";
 import {
@@ -318,6 +364,7 @@ export default {
   name: "windDetail",
   data() {
     return {
+        inputcv: "",
       current: "fdj",
       windname: "",
       wtid: "",
@@ -343,9 +390,15 @@ export default {
       colorFlag: false,
       timer: "",
       times: "",
+      warnLeft: [
+        {
+            name: "防雷保护类",
+            value: 10
+        }
+      ]
     };
   },
-  components: { svgIcon, alarmDialog, powerAndSpeed },
+  components: { svgIcon, alarmDialog, powerAndSpeed,  },
   apiUrl: "",
   props: {
     wind: {
@@ -858,8 +911,9 @@ export default {
   }
 
   .parts {
-    width: calc(100% - 400px - 20px);
-    margin-left: 20px;
+    // width: calc(100% - 600px - 20px);
+    width: calc(70vw - 20px);
+    margin-right: 20px;
     height: 100%;
     display: flex;
     flex-direction: column;
@@ -869,15 +923,13 @@ export default {
     .part-top {
       flex: 1;
       width: 100%;
-      text-align: center;
     }
     .part-title {
       width: 100%;
       height: 30px;
       display: flex;
-      align-items: center;
+      align-items: flex-start;
       flex-direction: row;
-      justify-content: center;
       .title-item {
         width: 140px;
         height: 100%;
@@ -887,22 +939,22 @@ export default {
         justify-content: center;
         // background: rgba(67, 81, 107, 0.2);
         background: rgba(96, 103, 105, 0.2);
-        border-left: 1px solid #3b6c53;
-        border-top: 1px solid #3b6c53;
-        border-bottom: 1px solid #3b6c53;
+        border-left: 1px solid rgba(0, 70, 199, 0.48);
+        border-top: 1px solid rgba(0, 70, 199, 0.48);
+        border-bottom: 1px solid rgba(0, 70, 199, 0.48);
 
         &.part-left {
           border-radius: 15px 0px 0px 15px;
         }
 
         &.part-right {
-          border-right: 1px solid #3b6c53;
+          border-right: 1px solid rgba(0, 70, 199, 0.48);
           border-radius: 0px 15px 15px 0px;
         }
 
         &.active {
           //   background-color: rgba(0, 70, 199, 0.4);
-          background-color: rgba(0, 199, 19, 0.4);
+          background-color: rgba(0, 70, 199, 0.48);
           color: #ffffff;
         }
       }
@@ -920,7 +972,7 @@ export default {
 
     .part-info {
       width: 100%;
-      max-height: 440px;
+      max-height: 50vh;
       bottom: 0px;
       display: flex;
       flex-direction: column-reverse;
@@ -978,7 +1030,7 @@ export default {
                 width: 8px;
                 height: 8px;
                 border-radius: 50%;
-                background-color: #05bb4c;
+                background-color: rgba(0, 70, 199, 0.48);
                 margin-right: 90px;
               }
 
@@ -999,6 +1051,106 @@ export default {
       }
     }
   }
+
+  .problems{
+    width: 30vw;
+    background: rgba(96, 103, 105, 0.2);
+    border-radius: 5px;
+    padding: 10px;
+    .problemTit{
+        display: flex;
+        justify-content: space-between;
+        position: relative;
+        width: 98%;
+        height: 42px;
+        border-bottom: 1px solid #363b46;
+        display: flex;
+        align-items: center;
+        padding-left: 20px;
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+
+        .problemSeach{
+            display: flex;
+            .el-input{
+                width: 150px;
+                position: relative;
+                top: -4px;
+                margin-right: 5px;
+            }
+            .buttons {
+                background-color: rgba(5, 187, 76, 0.2);
+                border: 1px solid #3b6c53;
+                color: #b3b3b3;
+                font-size: 14px;
+                width: 40px;
+                height: 30px;
+                position: relative;
+                padding: 0 25px !important;
+                .button{
+                    position: absolute;
+                    left: 13px;
+                    top: 7px;
+                }
+
+                &:hover {
+                background-color: rgba(5, 187, 76, 0.5);
+                color: #ffffff;
+                }
+            }
+        }
+    }
+    .problemMain{
+        .problemWarn{
+            margin-top: 10px;
+            display: flex;
+            justify-content: space-between;
+            width: 100%;
+            .warn{
+                width: 32%;
+            }
+            .warnCom{
+                width: 100%;
+                height: 100px;
+                // border: 1px solid rgba(255,0,0,0.8);
+                margin-bottom: 5px;
+                box-shadow: inset 0px 0px 40px 0px red;
+                animation: flash 1s infinite alternate; /* 闪烁动画 */
+            }
+            @keyframes flash {
+                from {
+                box-shadow: inset 0 0 10px #e60101; /* 开始时的内阴影 */
+                }
+                to {
+                box-shadow: inset 0 0 40px #f00; /* 结束时的内阴影，颜色更亮或更大 */
+                }
+            }
+            .warnItems{
+                width: 100%;
+                display: flex;
+                color: #817c7c;
+                margin-bottom: 3px;
+                .warnItemLeft{
+                    height: 32px;
+                    width: 20%;
+                    border: 1px solid #817c7c;
+                    margin-right: 1%;
+                    text-align: center;
+                    line-height: 28px;
+                }
+                .warnItemRight{
+                    height: 32px;
+                    width: 79%;
+                    line-height: 28px;
+                    border: 1px solid #817c7c;
+                    padding-left: 5px;
+                }
+            }
+        }
+    }
+  }
 }
 
 .monitoring-item {
@@ -1077,7 +1229,7 @@ export default {
   .table-value {
     font-family: Arial;
     font-weight: 400;
-    color: #05bb4c;
+    color: rgb(15, 120, 240);
     margin-right: 25px;
   }
 }

src/nxfStyle.less

@@ -5,7 +5,7 @@
 
     // /integratedAlarm/safe/realwarning 卡片
     .card {
-        color     : rgb(228, 236, 255);
+        color: rgb(228, 236, 255);
         background: #142446;
 
         .safeCom {
@@ -36,8 +36,8 @@
     .pickerFifter {
         .buttons {
             background-color: rgba(37, 112, 206, 0.2);
-            border          : 1px solid rgb(37, 112, 206);
-            color           : rgb(37, 112, 206);
+            border: 1px solid rgb(37, 112, 206);
+            color: rgb(37, 112, 206);
         }
     }
 
@@ -50,7 +50,7 @@
         }
 
         .el-button:last-of-type {
-            color           : #fff;
+            color: #fff;
             background-color: rgb(37, 112, 206);
         }
     }
@@ -63,12 +63,12 @@
     }
 
     .buttons {
-        color           : #fff;
+        color: #fff;
         background-color: rgb(37, 112, 206);
-        border          : 0;
+        border: 0;
 
         &:hover {
-            color     : rgb(223, 232, 250);
+            color: rgb(223, 232, 250);
             background: rgb(26, 92, 175);
         }
     }
@@ -91,24 +91,24 @@
 
     // /economicsOperation/thematicAnalysis/windEnergy
     .parcel-box .search .searchColor {
-        color           : #fff;
+        color: #fff;
         background-color: rgb(37, 112, 206);
-        border          : 0;
+        border: 0;
 
         &:hover {
-            color     : rgb(223, 232, 250);
+            color: rgb(223, 232, 250);
             background: rgb(26, 92, 175);
         }
     }
 
     // /economicsOperation/stationAnalyse/WindAndPhotovoltaic
     .windAndPhotovoltaic .wp-search .searchColor {
-        color           : #fff;
+        color: #fff;
         background-color: rgb(37, 112, 206);
-        border          : 0;
+        border: 0;
 
         &:hover {
-            color     : rgb(223, 232, 250);
+            color: rgb(223, 232, 250);
             background: rgb(26, 92, 175);
         }
     }
@@ -117,11 +117,11 @@
     .selections {
         .selections_btn {
             background: rgba(37, 112, 206, 0.2);
-            border    : 1px solid rgba(37, 112, 206, 0.2);
+            border: 1px solid rgba(37, 112, 206, 0.2);
 
             &.active {
                 background: rgb(37, 112, 206);
-                border    : 1px solid rgb(37, 112, 206);
+                border: 1px solid rgb(37, 112, 206);
             }
         }
     }
@@ -148,12 +148,12 @@
     }
 
     .searchColor {
-        color           : #fff;
+        color: #fff;
         background-color: rgb(37, 112, 206);
-        border          : 0;
+        border: 0;
 
         &:hover {
-            color     : rgb(223, 232, 250);
+            color: rgb(223, 232, 250);
             background: rgb(26, 92, 175);
         }
     }
@@ -171,7 +171,7 @@
         }
 
         .mouth {
-            border-top   : 1px solid #67b9ff;
+            border-top: 1px solid #67b9ff;
             border-bottom: 1px solid #67b9ff;
 
             &.active {
@@ -198,11 +198,11 @@
                 outline: none;
 
                 &.active {
-                    color          : #67b9ff;
+                    color: #67b9ff;
                     // background: linear-gradient(to top, rgba(#2169c3, 0.5), rgba(#142446, 0)) !important;
-                    background     : none !important;
+                    background: none !important;
                     // border-color: #2169c3 !important;
-                    border-color   : none !important;
+                    border-color: none !important;
 
                     &:after {
                         // border-color: #2169c3;
@@ -257,12 +257,12 @@
     .form-wrapper {
         .btns {
             .buttons {
-                color           : #fff;
+                color: #fff;
                 background-color: rgb(37, 112, 206);
-                border          : 0;
+                border: 0;
 
                 &:hover {
-                    color     : rgb(223, 232, 250);
+                    color: rgb(223, 232, 250);
                     background: rgb(26, 92, 175);
                 }
             }
@@ -275,12 +275,12 @@
 
         // 左侧导航菜单二级
         .sub-menu {
-            background  : rgba(3, 7, 19, 0.75);
+            background: rgba(3, 7, 19, 0.75);
             border-color: rgba(#2169c3, 0.5);
 
             .menu-item {
-                border    : 0;
-                color     : #777;
+                border: 0;
+                color: #777;
                 background: rgb(8, 23, 44);
 
                 &.active {
@@ -312,7 +312,7 @@
     // el-dialog 弹窗
     .el-dialog {
         background: fade(rgb(3, 7, 19), 95);
-        border    : 1px solid fade(#2169c3, 50);
+        border: 1px solid fade(#2169c3, 50);
         box-shadow: 0px 8px 17px 1px rgba(#2169c3, 0.3);
 
         &.el-dialog--center .el-dialog__body,
@@ -323,7 +323,7 @@
         &.hide-header {
             .el-dialog__header {
                 background: none; // 去除弹窗 header 背景图片
-                border    : none;
+                border: none;
 
                 .el-dialog__title {
                     display: none;
@@ -359,7 +359,7 @@
 
                 .el-icon-close {
                     background-color: transparent;
-                    border          : 1px solid #fff;
+                    border: 1px solid #fff;
                 }
             }
         }
@@ -368,7 +368,7 @@
     // 组件下拉选框
     .el-popper {
         &.el-cascader__dropdown[role="tooltip"] {
-            background  : @picker-bg-color;
+            background: @picker-bg-color;
             border-color: @picker-bg-color;
 
             .el-cascader-menu {
@@ -378,7 +378,7 @@
             .el-cascader-node:not(.is-disabled):focus,
             .el-cascader-node:not(.is-disabled):hover {
                 background: fade(@green, 20);
-                color     : @green;
+                color: @green;
             }
 
             .el-cascader-node.in-active-path,
@@ -390,7 +390,7 @@
 
         &.el-select__popper[role="tooltip"] {
             border-color: @picker-bg-color;
-            background  : @picker-bg-color;
+            background: @picker-bg-color;
 
             .el-cascader-menu {
                 border-color: @gray;
@@ -399,7 +399,7 @@
             .el-select-dropdown__item.hover,
             .el-select-dropdown__item:hover {
                 background: fade(rgb(26, 92, 175), 20);
-                color     : rgb(223, 232, 250);
+                color: rgb(223, 232, 250);
 
                 // color           : #fff;
                 // background-color: rgb(37, 112, 206);
@@ -407,8 +407,8 @@
             }
 
             .el-select-dropdown__item.selected {
-                background  : transparent;
-                color       : rgb(26, 92, 175);
+                background: transparent;
+                color: rgb(26, 92, 175);
                 border-color: rgb(26, 92, 175);
             }
         }
@@ -416,8 +416,8 @@
 
     // 日期选择组件
     .el-picker__popper.el-popper[role="tooltip"] {
-        border-color: @picker-bg-color  !important;
-        background  : @picker-bg-color  !important;
+        border-color: @picker-bg-color !important;
+        background: @picker-bg-color !important;
     }
 
     .el-picker-panel__footer {
@@ -428,7 +428,7 @@
         }
 
         .el-button.is-plain {
-            color       : #67b9ff;
+            color: #67b9ff;
             border-color: #67b9ff;
         }
     }
@@ -462,9 +462,9 @@
 
     .el-picker-panel {
         .el-time-panel {
-            border-color    : #fff;
+            border-color: #fff;
             background-color: rgb(3, 7, 19);
-            box-shadow      : var(--el-box-shadow-light);
+            box-shadow: var(--el-box-shadow-light);
         }
 
         .el-time-spinner__item {
@@ -528,17 +528,17 @@
     // 确认弹窗
     .el-overlay .el-message-box {
         background: rgba(3, 7, 19, 0.95);
-        border    : 1px solid rgba(33, 105, 195, 0.5);
+        border: 1px solid rgba(33, 105, 195, 0.5);
         box-shadow: 0px 8px 17px 1px rgba(33, 105, 195, 0.3);
 
         .el-message-box__btns {
             .el-button.el-button--primary {
-                color           : #fff;
+                color: #fff;
                 background-color: rgb(37, 112, 206);
-                border          : 0;
+                border: 0;
 
                 &:hover {
-                    color     : rgb(223, 232, 250);
+                    color: rgb(223, 232, 250);
                     background: rgb(26, 92, 175);
                 }
             }
@@ -567,7 +567,7 @@
     .el-checkbox .el-checkbox__input.is-checked .el-checkbox__inner,
     .el-checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
         background-color: #2169c3;
-        border-color    : #2169c3;
+        border-color: #2169c3;
     }
 
     .el-checkbox .el-checkbox__input.is-checked+.el-checkbox__label {
@@ -616,14 +616,14 @@
     // 顶部右上角退出登录
     .el-scrollbar__view.el-dropdown__list {
         background: transparent;
-        margin    : 0;
-        padding   : 0;
+        margin: 0;
+        padding: 0;
     }
 
     // el-radio 选中状态
     .el-radio.is-checked {
         .el-radio__inner {
-            background  : #67b9ff;
+            background: #67b9ff;
             border-color: #67b9ff;
         }
 
@@ -634,18 +634,24 @@
 
     // el-popover
     .el-popover {
-        background: rgb(3, 7, 19);
+        background: rgb(11, 29, 66);
+        color: #fff;
+        border: 1px solid rgb(11, 29, 66);
+
+        .el-popover__title {
+            color: #fff;
+        }
     }
 
     // 部分页面顶部搜索条件右侧按钮
     .search-wrapper {
         .buttons {
-            color           : #fff;
+            color: #fff;
             background-color: rgb(37, 112, 206);
-            border          : 0;
+            border: 0;
 
             &:hover {
-                color     : rgb(223, 232, 250);
+                color: rgb(223, 232, 250);
                 background: rgb(26, 92, 175);
             }
         }
@@ -659,7 +665,7 @@
         .el-table,
         .custom-table.el-table {
             background: rgb(3, 7, 19);
-            border    : 0px; // 包裹表格父元素边框
+            border: 0px; // 包裹表格父元素边框
 
 
 
@@ -691,17 +697,17 @@
                 }
 
                 &:hover td {
-                    color           : #67b9ff; // 表格基数行 hover 文字颜色
+                    color: #67b9ff; // 表格基数行 hover 文字颜色
                     background-color: rgb(3, 7, 19) !important; // 表格基数行 hover 背景颜色
                 }
             }
 
             td {
-                border     : 0px; // 表格内部除了最后一行底部以外的上下左右边框
-                padding    : 0;
-                height     : 37px;
+                border: 0px; // 表格内部除了最后一行底部以外的上下左右边框
+                padding: 0;
+                height: 37px;
                 line-height: 37px;
-                color      : rgb(194, 225, 255);
+                color: rgb(194, 225, 255);
 
                 &.light,
                 &.always-light {
@@ -710,15 +716,15 @@
             }
 
             th {
-                border        : 0px;
-                padding       : 0px;
-                height        : 37px;
-                line-height   : 37px;
-                font-weight   : normal;
-                text-align    : center;
+                border: 0px;
+                padding: 0px;
+                height: 37px;
+                line-height: 37px;
+                font-weight: normal;
+                text-align: center;
                 // color      : rgb(85, 113, 166);
-                color         : rgb(255, 255, 255);
-                cursor        : pointer;
+                color: rgb(255, 255, 255);
+                cursor: pointer;
 
                 &.is-leaf {
                     border: 0px;
@@ -733,26 +739,26 @@
             th,
             tr {
                 background-color: transparent;
-                border          : 0px;
+                border: 0px;
             }
 
             thead {
-                color      : @gray-l;
+                color: @gray-l;
                 font-weight: 500;
-                font-size  : 14px;
-                border     : 0px;
+                font-size: 14px;
+                border: 0px;
 
                 th,
                 &.is-group th {
                     &.el-table__cell {
-                        background  : rgb(19, 35, 71);
+                        background: rgb(19, 35, 71);
                         border-color: transparent !important;
                     }
                 }
             }
 
             .el-table__body {
-                border   : 0px; // 表格最外侧除右边以外边框
+                border: 0px; // 表格最外侧除右边以外边框
                 font-size: 14px;
             }
 
@@ -762,7 +768,7 @@
                 }
 
                 &:hover td {
-                    color           : #67b9ff;
+                    color: #67b9ff;
                     background-color: rgb(16, 25, 46) !important; // 表格偶数行 hover 背景颜色
                 }
 

src/views/IntegratedAlarm/DetailMatrix/index.vue

@@ -25,15 +25,22 @@
                         </div>
                     </div>
                     <div class="matrix-status">
-                        <div class="title-status" :class="item.color" v-for="(item, index) in titleList" :key="index">
-                            <div class="status-first" :class="{ active: item.value1 == fillFjzt }"
+                        <div class="title-status" :class="item.color" v-for="(item, index) in titleListNew"
+                            :key="index">
+                            <!-- <div class="status-first" :class="{ active: item.value1 == fillFjzt }"
                                 @click="handleClick(item.value1)">
                                 <div class="matrix-status-left">{{ item.name }}</div>
                                 <div class="matrix-status-right">
                                     {{ sourceMap[item.code] }}
                                 </div>
+                            </div> -->
+                            <div class="status-first">
+                                <div class="matrix-status-left">{{ item.name }}</div>
+                            </div>
+                            <div class="status-end" style="height: 50px">
+                                <span style="margin-left: 5px">{{item.value1}}</span>
                             </div>
-                            <div class="status-end" :class="{ active: item.value2 == fillFjzt }"
+                            <!-- <div class="status-end" :class="{ active: item.value2 == fillFjzt }"
                                 @click="handleClick(item.value2)">
                                 <div class="matrix-status-left">
                                     <i class="svg-icon svg-icon-sm" :class="
@@ -64,7 +71,7 @@
                                 <div class="matrix-status-right">
                                     {{ sourceMap[item.code2] }}
                                 </div>
-                            </div>
+                            </div> -->
                         </div>
                     </div>
                 </div>
@@ -115,24 +122,24 @@
                                     v-for="(item, indexs) in subTitleDatas" :key="indexs"
                                     @click="handleIndicatorClick(value.czlx, value.wpid)">
                                     <span>{{
-                    item.type == value.czlx ? item.text1 : item.text
-                  }}</span>
+                                        item.type == value.czlx ? item.text1 : item.text
+                                    }}</span>
                                     <span class="sub-value" :style="{ color: item.color }">
                                         {{
-                      indexs >= 8
-                        ? item.key1
-                          ? value[item.key1]
-                            ? item.ratio
-                              ? (value[item.key1] / item.ratio).toFixed(2)
-                              : value[item.key1].toFixed(2)
-                            : "0.00"
-                          : value[item.key]
-                          ? item.ratio
-                            ? (value[item.key] / item.ratio).toFixed(2)
-                            : value[item.key].toFixed(2)
-                          : "0.00"
-                        : value[item.key]
-                    }}
+                                        indexs >= 8
+                                            ? item.key1
+                                            ? value[item.key1]
+                                                ? item.ratio
+                                                ? (value[item.key1] / item.ratio).toFixed(2)
+                                                : value[item.key1].toFixed(2)
+                                                : "0.00"
+                                            : value[item.key]
+                                            ? item.ratio
+                                                ? (value[item.key] / item.ratio).toFixed(2)
+                                                : value[item.key].toFixed(2)
+                                            : "0.00"
+                                            : value[item.key]
+                                        }}
                                     </span>
                                 </div>
                             </div>
@@ -140,14 +147,21 @@
                         <!-- wt v-show="value['switch' + index]"-->
                         <div class="matrix-list">
                             <div class="matrix-card" style="cursor: pointer" :class="
-                  val.status !== '' && colorList[Number(val.status)]
-                    ? colorList[Number(val.status)]
-                    : 'gray'
-                " v-for="(val, indexe) in value.wtlist" :key="indexe">
+                                val.status !== '' && colorList[Number(val.status)]
+                                    ? colorList[Number(val.status)]
+                                    : 'gray'
+                                " v-for="(val, indexe) in value.wtlist" :key="indexe">
                                 <div class="info">
                                     <!-- wtname + 状态 -->
                                     <div class="card-left" @click="handleLeftClick(val, value.czlx, value.wpid)">
                                         <!-- <i class="lock" @mouseenter="handleMouse"></i> -->
+                                        <el-popover placement="top-start" title="预警信息" :width="200" trigger="hover"
+                                            content="预警情况说明" v-if="1">
+                                            <template #reference>
+                                                <div class="isWarn"></div>
+                                            </template>
+                                        </el-popover>
+
                                         <div class="card-name">{{ val.wtname }}</div>
                                         <i class="svg-icon svg-icon-sm" :class="
                         val.status === 4 || val.status === 5
@@ -158,8 +172,8 @@
                                         </i>
                                     </div>
                                     <div class="dashed" />
-                                    <!-- 数据项 -->
-                                    <div class="card-right" @click="handleRightClick(value.czlx, val.wtid)">
+                                    <!-- 数据项  @click="handleRightClick(value.czlx, val.wtid)"-->
+                                    <div class="card-right">
                                         <div class="right-item">
                                             <i class="svg-icon svg-icon-sm" :class="
                           val.status === 4 || val.status === 5
@@ -255,15 +269,15 @@
                 </div>
             </el-scrollbar>
             <qushi-dialog ref="child" :chartName="chartName"></qushi-dialog>
-            <el-dialog width="90%" top="40px" v-model="displayMatrix" :show-close="true" destroy-on-close>
+            <el-dialog :fullscreen="true" top="40px" v-model="displayMatrix" :show-close="true" destroy-on-close>
                 <template #title>
                     <div class="dialog-title">
                         <div class="title">设备详情</div>
                     </div>
                 </template>
-                <div class="dialog-body" style="height: 900px">
+                <div class="dialog-body" style="height: 100vh">
                     <img class="dialog-img" src="@assets/imgs/dialog.png" />
-                    <windDetail v-show="wtType == -1" :wind="wind" :flag="flag"></windDetail>
+                    <windDetail v-if="wtType == -1" :wind="wind" :flag="flag"></windDetail>
                     <lightDetail v-show="wtType == -2" :wind="wind" :flag="flag"></lightDetail>
                 </div>
             </el-dialog>
@@ -422,6 +436,49 @@
                         icon2: "svg-unknown",
                     },
                 ],
+                titleListNew: [{
+                        color: "blue",
+                        name: "待机",
+                        value1: "",
+                        code: "djts",
+                    },
+                    {
+                        color: "green",
+                        name: "并网",
+                        value1: "",
+                        code: "bwts",
+                    },
+                    {
+                        color: "red",
+                        name: "故障",
+                        value1: "",
+                        code: "gzts",
+                    },
+                    {
+                        color: "orange",
+                        name: "检修",
+                        value1: "",
+                        code: "jxts",
+                    },
+                    {
+                        color: "pink",
+                        name: "限电",
+                        value1: "",
+                        code: "xdts",
+                    },
+                    {
+                        color: "write",
+                        name: "停机",
+                        value1: "",
+                        code: "slts",
+                    },
+                    {
+                        color: "gray",
+                        name: "离线",
+                        value1: "",
+                        code: "lxts",
+                    },
+                ],
                 //   右侧欠发标签
                 unpaidList: [{
                         id: 1,
@@ -466,7 +523,7 @@
                 ],
                 colorList: [
                     "blue",
-                    "blue",
+                    "write",
                     "green",
                     "green",
                     "red",
@@ -625,23 +682,24 @@
 
         mounted() {
             this.sourceMap = dataJson.sourceMapData
-            this.showMatrixList = dataJson.showMatrixListdata
-            dataJson.showMatrixListdata.forEach((it, index) => {
-                it.wtlist = new Array(125).fill({
-                    wtname: it.wpname,
-                    status: index === 4 ? 6 : index,
-                    // status: 4,
-                    czlx: -1,
-                    wtid: 5,
-                    power: 2514,
-                    speed: 13,
-                    current: 251,
-                    transfer: 21,
-                    voltage: 25,
-                    rate: 395,
-                    ssqfzt: 1
-                })
-            })
+            // this.showMatrixList = dataJson.showMatrixListdata
+            // dataJson.showMatrixListdata.forEach((it, index) => {
+            //     it.wtlist = new Array(125).fill({
+            //         wtname: it.wpname,
+            //         status: index === 4 ? 6 : index,
+            //         // status: 4,
+            //         czlx: -1,
+            //         wtid: 5,
+            //         power: 2514,
+            //         speed: 13,
+            //         current: 251,
+            //         transfer: 21,
+            //         voltage: 25,
+            //         rate: 395,
+            //         ssqfzt: 1
+            //     })
+            // })
+            this.requestData(true)
         },
 
         // 函数
@@ -677,7 +735,10 @@
                         this.BASE.closeLoading();
                         if (Object.values(res.data.data).length) {
                             let sourceMap = res.data.data;
-
+                            let windNumData = res.data.data.powerVos[0]
+                            this.titleListNew.forEach(it => {
+                                it.value1 = windNumData[it.code]
+                            })
                             this.sourceMap = sourceMap;
                             if (first) {
                                 const tempWtArray = this.chunkArray(this.sourceMap.powerVos, 3);
@@ -1702,6 +1763,16 @@
                                 align-items: center;
                                 position: relative;
 
+                                .isWarn {
+                                    position: absolute;
+                                    left: 3px;
+                                    top: 3px;
+                                    width: 10px;
+                                    height: 10px;
+                                    background: #ffd700;
+                                    border-radius: 20px;
+                                }
+
                                 .lock {
                                     width: 0;
                                     height: 0;

src/views/SandTable/SandTable.vue

@@ -7,32 +7,51 @@
             <ThreeModel1 class="three-model-layer" :data="mapSource" @when="when" @clickMapItem="clickMapItem">
             </ThreeModel1>
             <div class="sand-table-left" v-if="showPanel">
-                <PanelSand class="left-panel" title="气象预测" :subTitle="timeStr + '实况'" style="height: 21vh">
+                <!-- <PanelSand class="left-panel" title="气象预测" :subTitle="timeStr + '实况'" style="height: 21vh">
                     <weather style="cursor: pointer" :data="tqmap1" @click="openWeatherDialog" />
                 </PanelSand>
-                <!-- style="height: 42vh"
- style="height: 42vh" -->
                 <PanelSand class="left-panel" title="健康推荐">
-                    <!-- height="32vh" -->
                     <RankTable :data="rmls" @rowClick="clickHealthRow" height="23.2vh"></RankTable>
                 </PanelSand>
                 <PanelSand class="left-panel" title="停机信息">
                     <RankTable :data="sels" @rowClick="clickStopRow" height="23.2vh"></RankTable>
-                    <!-- <ComTable :data="sels"></ComTable> -->
+                </PanelSand> -->
+                <PanelSand class="left-panel" title="停机信息">
+                    <template v-slot:tools>
+                        <div class="exchange" @click="changeBjSwitch">
+                            <span :class="bjSwitch ? 'gray' : 'white'">故障</span>
+                            <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
+                            <span :class="bjSwitch ? 'blue' : 'gray'">检修</span>
+                        </div>
+                    </template>
+                    <RankTable :data="sels" @rowClick="clickStopRow" height="20vh"></RankTable>
                 </PanelSand>
-
+                <PanelSandToolbar class="right-panel mg-t-16" title="预警情况">
+                    <template v-slot:tools>
+                        <div class="exchange">
+                            <span :class="warnSwitch === 'z' ? 'white' : 'gray'" @click="changeWarnSwitch('z')">周</span>
+                            <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
+                            <span :class="warnSwitch === 'y' ? 'white' : 'gray'" @click="changeWarnSwitch('y')">月</span>
+                            <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
+                            <span :class="warnSwitch === 'n' ? 'white' : 'gray'" @click="changeWarnSwitch('n')">年</span>
+                        </div>
+                    </template>
+                    <template v-slot:default>
+                        <RadarPieChart height="18vh" :list="warnChartData" title="预警隐患情况" />
+                    </template>
+                </PanelSandToolbar>
+                <PanelSandToolbar class="right-panel mg-t-16" title="非停时长占比" @click="clickTime" style="cursor: pointer">
+                    <template v-slot:default>
+                        <RadarPieChart height="18vh" :list="warnChartData" title="预警隐患情况" />
+                    </template>
+                </PanelSandToolbar>
             </div>
+            <div></div>
             <div class="sand-table-right" v-if="showPanel">
-                <PanelSand class="right-panel  mg-t-16" title="视频监控">
+                <!-- <PanelSand class="right-panel  mg-t-16" title="视频监控">
                     <el-row v-for="(pItem, pIndex) in videoArray1" :key="pIndex">
                         <el-col :span="12" class="pre-img-box" v-for="(cItem, cIndex) in pItem" :key="cIndex"
                             @click="openVideoDialog1(cItem)">
-                            <!-- <div class="mask"> -->
-                            <!-- <img :src="require('@assets/nxfImg/ship.png')" alt=""> -->
-                            <!-- </div> -->
-                            <!-- <hlsVideo class="pre-img videoBoxiframe" width="95%" height="8.657vh" :code="cItem.code"
-                                :class="cItem.class" v-if="cItem.switch" /> -->
-
                         </el-col>
                     </el-row>
                     <div class="mask"></div>
@@ -40,9 +59,6 @@
                 <PanelSandToolbar class="right-panel mg-t-16" title="预警情况">
                     <template v-slot:tools>
                         <div class="exchange" @click="changeWarnSwitch">
-                            <!-- <span :class="warnSwitch ? 'gray' : 'white'">预警</span> -->
-                            <!-- <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
-                            <span :class="warnSwitch ? 'blue' : 'gray'">故障</span> -->
                         </div>
                     </template>
                     <template v-slot:default>
@@ -52,82 +68,82 @@
                 <PanelSandToolbar class="right-panel mg-t-16" title="故障情况">
                     <template v-slot:tools>
                         <div class="exchange" @click="changeBjSwitch">
-                            <!-- <span :class="bjSwitch ? 'gray' : 'white'">故障</span> -->
-                            <!-- <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
-                            <span :class="bjSwitch ? 'blue' : 'gray'">记录</span> -->
                         </div>
                     </template>
                     <template v-slot:default>
                         <RadarPieChart height="21vh" :list="bjChartData" title="故障隐患情况" />
                     </template>
+                </PanelSandToolbar> -->
+                <PanelSand class="left-panel" title="停机信息">
+                    <template v-slot:tools>
+                        <div class="exchange" @click="changeBjSwitch">
+                            <span :class="bjSwitch ? 'gray' : 'white'">故障</span>
+                            <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
+                            <span :class="bjSwitch ? 'blue' : 'gray'">检修</span>
+                        </div>
+                    </template>
+                    <RankTable :data="sels" @rowClick="clickStopRow" height="20vh"></RankTable>
+                </PanelSand>
+                <PanelSandToolbar class="right-panel mg-t-16" title="预警情况">
+                    <template v-slot:tools>
+                        <div class="exchange">
+                            <span :class="warnSwitch === 'z' ? 'white' : 'gray'" @click="changeWarnSwitch('z')">周</span>
+                            <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
+                            <span :class="warnSwitch === 'y' ? 'white' : 'gray'" @click="changeWarnSwitch('y')">月</span>
+                            <i class="blue fa fa-exchange mg-l-8 mg-r-8"></i>
+                            <span :class="warnSwitch === 'n' ? 'white' : 'gray'" @click="changeWarnSwitch('n')">年</span>
+                        </div>
+                    </template>
+                    <template v-slot:default>
+                        <RadarPieChart height="18vh" :list="warnChartData" title="预警隐患情况" />
+                    </template>
+                </PanelSandToolbar>
+                <PanelSandToolbar class="right-panel mg-t-16" title="非停时长占比">
+                    <template v-slot:default>
+                        <RadarPieChart height="18vh" :list="warnChartData" title="预警隐患情况" />
+                    </template>
                 </PanelSandToolbar>
             </div>
-            <!-- <div class="sand-table-bottom"
-                :style="$store.state.themeName === 'dark' ? 'right: calc(50vw - 545px);' : 'right: calc(50vw - 590px);'"
-                v-if="showPanel">
-                <Ppanel title="利用小时" :data="riseNumber(gxkmap.bg_dxkyss)" dataColor="#0a82f2" :days="gxkmap.ydxkyss"
-                    :data1Icon="
-            gxkmap.tb_dxkyss < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'
-            " :data1IconClass="
-            gxkmap.tb_dxkyss < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            " :data2Icon="
-            gxkmap.hb_dxkyss < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'
-            " :data2IconClass="
-            gxkmap.hb_dxkyss < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            "></Ppanel>
-                <Ppanel title="设备可利用率" class="stb-p" :data="riseNumber(gxkmap.bg_sbklyl)" dataColor="#0a82f2"
-                    daysUnit="%" :days="gxkmap.ysbklyl" :data1Icon="
-            gxkmap.hb_sbklyl < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'
-            " :data1IconClass="
-            gxkmap.hb_sbklyl < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            " :data2Icon="
-            gxkmap.tb_sbklyl < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'
-            " :data2IconClass="
-            gxkmap.tb_sbklyl < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            "></Ppanel>
-                <Ppanel title="MTBF" class="stb-p" :data="'0.1' || riseNumber(gxkmap.bg_mtbf)" dataColor="#0a82f2"
-                    :days="gxkmap.mtbf" :data1Icon="gxkmap.hb_mtbf < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'"
-                    :data1IconClass="
-            gxkmap.hb_mtbf < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            " :data2Icon="gxkmap.tb_mtbf < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'" :data2IconClass="
-            gxkmap.tb_mtbf < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            "></Ppanel>
-                <Ppanel title="MTTR" class="stb-p" :data="'0.1' || riseNumber(gxkmap.bg_mttr)" dataColor="#0a82f2"
-                    :days="gxkmap.mttr" :data1Icon="gxkmap.hb_mttr < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'"
-                    :data1IconClass="
-            gxkmap.hb_mttr < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            " :data2Icon="gxkmap.tb_mttr < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'" :data2IconClass="
-            gxkmap.tb_mttr < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            "></Ppanel>
-                <Ppanel title="MTTF" class="stb-p" :data="'0.1' || riseNumber(gxkmap.bg_mttf)" dataColor="#0a82f2"
-                    :days="gxkmap.mttf" :data1Icon="gxkmap.hb_mttf < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'"
-                    :data1IconClass="
-            gxkmap.hb_mttf < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            " :data2Icon="gxkmap.tb_mttf < 0 ? 'svg-arrow-dpwn-1' : 'svg-arrow-up-1'" :data2IconClass="
-            gxkmap.tb_mttf < 0
-                ? 'svg-icon-sm svg-icon-yellow'
-                : 'svg-icon-sm svg-icon-green'
-            "></Ppanel>
-            </div> -->
-            <el-dialog title="" :custom-class="tableDialogClass" v-model="showHealthDialog" width="80%"
+            <div class="footer">
+                <div class="hover72Power">
+                    <div
+                    id="problem1"
+                    class="cur"
+                    style="width: 100%; height: 100%"
+                    ></div>
+                    <div class="hidBtn" @click="showStHourDialog"></div>
+                </div>
+                <div class="monthPower">
+                    <div
+                    id="problem2"
+                    class="cur"
+                    style="width: 100%; height: 100%"
+                    ></div>
+                    <div class="hidBtn" @click="showYfdlDialog"></div>
+                </div>
+            </div>
+
+            <el-dialog
+                v-model="noTimeDialog"
+                width="80%"
+            >
+                <template #title>
+                    <div class="dialogTitle">
+                        非停时长占比
+                        <i class="jumpBtn el-icon-more" @click="jumpUrl('/health/frist')"></i>
+                    </div>
+                </template>
+                <span>This is a message</span>
+                <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="dialogVisible = false">Cancel</el-button>
+                    <el-button type="primary" @click="dialogVisible = false">
+                    Confirm
+                    </el-button>
+                </div>
+                </template>
+            </el-dialog>
+            <!-- <el-dialog title="" :custom-class="tableDialogClass" v-model="showHealthDialog" width="80%"
                 :destroy-on-close="true" :before-close="
             (done) => {
             tableDialogClass = 'modal animated a1 fadeOutLeftBig';
@@ -163,8 +179,8 @@
                         <el-input v-model="tableItem.typename" readonly></el-input>
                     </el-form-item>
                 </el-form>
-            </el-dialog>
-            <el-dialog title="" :custom-class="tableDialogClass" v-model="showTableDialog" width="80%"
+            </el-dialog> -->
+            <!-- <el-dialog title="" :custom-class="tableDialogClass" v-model="showTableDialog" width="80%"
                 :destroy-on-close="true" :before-close="
             (done) => {
             tableDialogClass = 'modal animated a1 fadeOutLeftBig';
@@ -200,8 +216,8 @@
                         <el-input v-model="tableItem.stopHours" readonly></el-input>
                     </el-form-item>
                 </el-form>
-            </el-dialog>
-            <el-dialog title="天气详情" :custom-class="tableDialogClass" v-model="showWeatherDialog" width="80%"
+            </el-dialog> -->
+            <!-- <el-dialog title="天气详情" :custom-class="tableDialogClass" v-model="showWeatherDialog" width="80%"
                 :destroy-on-close="true" :before-close="
             (done) => {
             tableDialogClass = 'modal animated a1 fadeOutLeftBig';
@@ -209,7 +225,7 @@
             }
         " @closed="tableDialogClass = 'modal animated a1 fadeInLeftBig'">
                 <div class="weatherBox">
-                    <!-- <div class="l">
+                    <div class="l">
                         <DoubleLineChart :height="'100%'" :list="weatherChart" />
                     </div>
                     <div class="r">
@@ -272,32 +288,25 @@
                                 </div>
                             </el-collapse-item>
                         </el-collapse>
-                    </div> -->
+                    </div>
 
                 </div>
-            </el-dialog>
+            </el-dialog> -->
 
-            <weather-dialog ref="weatherDia"></weather-dialog>
+            <!-- <weather-dialog ref="weatherDia"></weather-dialog> -->
 
-            <el-dialog top="50px" title="查看视频" :custom-class="videoDialogClass" v-model="showVideoDialog" width="80%"
-                :destroy-on-close="true" :before-close="
-            (done) => {
-            videoDialogClass = 'modal animated a1 bounceOut';
-            delaylyFn(450, done);
-            }
-        " @closed="
-            dialogVideoUrl = '';
-            videoDialogClass = 'modal animated a1 bounceIn';
-        ">
-                <!-- <iframe
-            class="videoBoxiframe"
-            width="95%"
-            height="800px"
-            :src="dialogVideoUrl"
-        /> -->
+            <!-- <el-dialog top="50px" title="查看视频" :custom-class="videoDialogClass" v-model="showVideoDialog" width="80%"
+                :destroy-on-close="true" :before-close="(done) => {
+                    videoDialogClass = 'modal animated a1 bounceOut';
+                    delaylyFn(450, done);
+                }
+                " @closed="
+                    dialogVideoUrl = '';
+                    videoDialogClass = 'modal animated a1 bounceIn';
+                ">
                 <hlsVideo class="videoBoxiframe" width="95%" height="800px" :code="dialogVideoUrl" />
-            </el-dialog>
-            <el-dialog title="场站综合评分" :custom-class="mainInfoDialogClass" v-model="showMainInfoDialog" width="80%"
+            </el-dialog> -->
+            <!-- <el-dialog title="场站综合评分" :class="mainInfoDialogClass" v-model="showMainInfoDialog" width="80%"
                 :destroy-on-close="true" :before-close="
             (done) => {
             mainInfoDialogClass = 'modal curModal animated a1 fadeOutUpBig';
@@ -327,7 +336,7 @@
                         </el-form-item>
                     </el-form>
                 </div>
-            </el-dialog>
+            </el-dialog> -->
         </div>
         <router-view v-else />
     </div>
@@ -354,6 +363,7 @@
     import {
         alarm_history,
     } from "@/api/zhbj/index.js";
+    import jsonData from "./component/data.json";
     export default {
         // 名称
         name: "SandTable",
@@ -379,15 +389,18 @@
         data() {
             const that = this;
             return {
+                problem1: null,
+                problem2: null,
                 videoShow: true,
                 showPanel: false,
                 bjSwitch: false,
-                warnSwitch: false,
+                warnSwitch: 'z',
                 timmer1: null,
                 showWeatherDialog: false,
                 showTableDialog: false,
                 showHealthDialog: false,
                 showMainInfoDialog: false,
+                noTimeDialog: false,
                 weathercollapse: "",
                 weatherChart: [{
                         title: "温度",
@@ -616,6 +629,221 @@
 
         // 函数
         methods: {
+            init(res) {
+                let that = this
+                // 72小时功率曲线
+                if (res.data["72time"] && res.data["72time"].length > 0) {
+                let xAxis = [];
+                let seriesSpeed = [];
+                res.data["72time"].forEach((it) => {
+                    xAxis.push(dayjs(it.time).format("MM-DD HH:mm"));
+                    seriesSpeed.push(it.speed);
+                });
+                let series = [
+                    {
+                    name: "故障次数",
+                    data: seriesSpeed,
+                    type: "line",
+                    symbol: "none",
+                    }
+                ];
+                that.getPowerLine(
+                    xAxis,
+                    series,
+                    "problem1"
+                );
+                that.getPowerLine2(
+                    xAxis,
+                    series,
+                    "problem2"
+                );
+                }
+            },
+            getPowerLine(
+                xAxis,
+                series,
+                name
+                ) {
+                let myChart;
+                let legendState = {};
+                if (this.problem1?.getOption) {
+                    legendState = this.problem1.getOption().legend[0].selected;
+                }
+
+                let option = {
+                    title: {
+                    text: "故障次数趋势",
+                    left: "5px",
+                    top: "5px",
+                    textStyle: {
+                        fontSize: "16",
+                        fontWeight: 400,
+                        color: "#fff",
+                    },
+                    },
+                    tooltip: {
+                    trigger: "axis",
+                    },
+                    color: ["#7981AF", "#1C99FF", "#E57F25", "#f25656"],
+                    legend: {
+                    right: "25",
+                    top: "5",
+                    itemWidth: 5,
+                    itemHeight: 5,
+                    data: ["故障次数"],
+                    textStyle: {
+                        color: "#fff",
+                    },
+                    selected: legendState,
+                    },
+                    grid: {
+                    left: "2%",
+                    right: "4%",
+                    bottom: "5%",
+                    height: "110px",
+                    containLabel: true,
+                    },
+                    xAxis: {
+                    type: "category",
+                    boundaryGap: false,
+                    data: xAxis,
+                    axisLine: {
+                        lineStyle: {
+                        color: "#fff", // 修改为需要的颜色
+                        },
+                    },
+                    },
+                    yAxis: [
+                    {
+                        type: "value",
+                        splitLine: {
+                        lineStyle: {
+                            color: "#ccc",
+                            type: "dashed", // 修改为虚线
+                            opacity: 0.2,
+                        },
+                        },
+                        name: "单位：次",
+                        axisLine: {
+                        lineStyle: {
+                            color: "#fff",
+                        },
+                        },
+                        axisLabel: {
+                        formatter(value) {
+                            return parseFloat(value.toFixed(1));
+                        },
+                        },
+                    },
+                    ],
+                    series: series,
+                };
+                // 基于准备好的dom，初始化echarts实例
+                let dom = document.getElementById(name);
+                dom && dom.removeAttribute("_echarts_instance_");
+
+                myChart = this.$echarts.init(dom);
+                this.problem1 = myChart;
+
+                myChart.setOption(option);
+
+                window.addEventListener("resize", () => {
+                    myChart.resize();
+                });
+            },
+            getPowerLine2(
+                xAxis,
+                series,
+                name
+                ) {
+                let myChart;
+                let legendState = {};
+                if (this.problem2?.getOption) {
+                    legendState = this.problem2.getOption().legend[0].selected;
+                }
+
+                let option = {
+                    title: {
+                    text: "故障次数趋势",
+                    left: "5px",
+                    top: "5px",
+                    textStyle: {
+                        fontSize: "16",
+                        fontWeight: 400,
+                        color: "#fff",
+                    },
+                    },
+                    tooltip: {
+                    trigger: "axis",
+                    },
+                    color: ["#7981AF", "#1C99FF", "#E57F25", "#f25656"],
+                    legend: {
+                    right: "25",
+                    top: "5",
+                    itemWidth: 5,
+                    itemHeight: 5,
+                    data: ["故障次数"],
+                    textStyle: {
+                        color: "#fff",
+                    },
+                    selected: legendState,
+                    },
+                    grid: {
+                    left: "2%",
+                    right: "4%",
+                    bottom: "5%",
+                    height: "110px",
+                    containLabel: true,
+                    },
+                    xAxis: {
+                    type: "category",
+                    boundaryGap: false,
+                    data: xAxis,
+                    axisLine: {
+                        lineStyle: {
+                        color: "#fff", // 修改为需要的颜色
+                        },
+                    },
+                    },
+                    yAxis: [
+                    {
+                        type: "value",
+                        splitLine: {
+                        lineStyle: {
+                            color: "#ccc",
+                            type: "dashed", // 修改为虚线
+                            opacity: 0.2,
+                        },
+                        },
+                        name: "单位：次",
+                        axisLine: {
+                        lineStyle: {
+                            color: "#fff",
+                        },
+                        },
+                        axisLabel: {
+                        formatter(value) {
+                            return parseFloat(value.toFixed(1));
+                        },
+                        },
+                    },
+                    ],
+                    series: series,
+                };
+                // 基于准备好的dom，初始化echarts实例
+                let dom = document.getElementById(name);
+                dom && dom.removeAttribute("_echarts_instance_");
+
+                myChart = this.$echarts.init(dom);
+                this.problem2 = myChart;
+
+                myChart.setOption(option);
+
+                window.addEventListener("resize", () => {
+                    myChart.resize();
+                });
+            },
+
             openWeatherDialog() {
                 // this.showWeatherDialog = true;
                 this.$refs.weatherDia.showWeaterDialog()
@@ -939,21 +1167,25 @@
 
             changeBjSwitch() {
                 this.bjSwitch = !this.bjSwitch;
-                if (this.bjSwitch) {
-                    this.getRecordMGT();
-                } else {
-                    this.getRepertoryMGT();
-                }
+                // if (this.bjSwitch) {
+                //     this.getRecordMGT();
+                // } else {
+                //     this.getRepertoryMGT();
+                // }
             },
 
-            changeWarnSwitch() {
-                this.warnSwitch = !this.warnSwitch;
-                if (this.warnSwitch) {
-                    this.getStopMGT();
-                } else {
-                    this.getWarnMGT();
-                }
+            changeWarnSwitch(val) {
+                this.warnSwitch = val
+                // if (this.warnSwitch) {
+                //     this.getStopMGT();
+                // } else {
+                //     this.getWarnMGT();
+                // }
             },
+            clickTime() {
+                this.noTimeDialog = true
+                console.log("cscscs===>>>>", "cscs")
+            }
         },
         // 生命周期钩子
         beforeCreate() {
@@ -975,7 +1207,21 @@
         },
         mounted() {
             // 渲染后
+            this.$nextTick(() =>{
+                this.init(jsonData)
+            })
+
+        },
+        watch: {
+            $route: {
+                handler(val) {
+                    this.$nextTick(() =>{
+                        this.init(jsonData)
+                    })
+                },
+            },
         },
+        
         beforeUpdate() {
             // 数据更新前
         },
@@ -1135,6 +1381,44 @@
         .el-overlay {
             overflow: hidden;
         }
+
+        .footer {
+            display: flex;
+            justify-content: space-between;
+            width: 100%;
+            height: 19vh;
+            position: relative;
+            bottom: -80vh;
+            z-index: 111;
+
+            .hover72Power,
+            .monthPower {
+            width: calc(50% - 10px);
+            background: rgba(41, 45, 53, 0.4);
+            border-radius: 6px;
+            position: relative;
+            .hidBtn {
+                position: absolute;
+                left: 5px;
+                top: 5px;
+                width: 0;
+                height: 24px;
+                cursor: pointer;
+            }
+            }
+
+            .hover72Power {
+            .hidBtn {
+                width: 125px;
+            }
+            }
+
+            .monthPower {
+            .hidBtn {
+                width: 75px;
+            }
+            }
+        }
     }
 
     #sandTable.sand-table .curModal .el-dialog__body {

src/views/SandTable/component/rank-table.vue

@@ -4,7 +4,7 @@
             <tr>
                 <!-- <th>排名</th> -->
                 <th v-for="(col, index) of data.column" :key="index" :class="{ light: col.is_light }"
-                    :style="{ width: col.width, height: '4vh' }" @click="onSort(col)">
+                    :style="{ width: col.width, height: '3vh' }" @click="onSort(col)">
                     {{ col.name }}
                 </th>
             </tr>
@@ -16,7 +16,8 @@
             <span>{{ index + 1 }}</span>
           </td> -->
                     <!-- @click="clickRow(row)" -->
-                    <td v-for="(col, i) of data.column" :key="i" :style="{ width: col.width }"
+                    <td v-for="(col, i) of data.column" :key="i"
+                        :style="{ width: col.width, height: '3.8vh', lineHeight: '3.8vh' }"
                         :class="rankcolSty(col, row)" @mouseleave="leave()">
                         <!-- :class="{
               light: hoverRow == row || hoverCol == col,
@@ -244,6 +245,11 @@
         thead tr th {
             color: #ffffff;
         }
+        thead{
+            th{
+                background: transparent !important;
+            }
+        }
 
         .rank {
             background: transparent !important;

src/views/economicsOperation/windAnalyse/powerCurve/index.vue

@@ -50,7 +50,7 @@
                   v-for="item in wtArray"
                   :key="item.id"
                   :value="item.id"
-                  :label="item.name"
+                  :label="item.aname"
                 />
               </el-select>
             </div>
@@ -190,9 +190,9 @@
       </div>
       <div class="search mg-b-8">
         <div class="search-items">
-          <div class="search-item custom">
+          <div class="search-item customsv">
             <div class="lable">筛选条件：</div>
-            <div class="search-content">
+            <div class="search-content" style="width: 50%">
               <el-checkbox-group v-model="checkedList" :min="1">
                 <el-checkbox
                   v-for="item in checkList"
@@ -993,6 +993,9 @@ export default {
         .custom {
           width: auto;
         }
+        .customsv{
+            width: 100%;
+        }
       }
       .search-actions {
         // .el-button {