Parcourir la source

Merge branch 'master' of http://124.70.43.205:3000/yangxiao/sis_zhfx

chenminghua il y a 3 ans
Parent
commit
cf723430bd
40 fichiers modifiés avec 2719 ajouts et 780 suppressions
  1. 13 0
      README.md
  2. 1 0
      package.json
  3. 1 1
      public/index.html
  4. 18 0
      public/static/js/less.min.js
  5. 23 0
      public/static/stylesheet/color.less
  6. 61 7
      src/App.vue
  7. 23 0
      src/assets/styles/common/common.less
  8. 278 0
      src/assets/styles/theme/dark/dark-jsc.less
  9. 6 0
      src/assets/styles/theme/dark/setting.less
  10. 166 0
      src/assets/styles/theme/light/light-jjyx.less
  11. 420 0
      src/assets/styles/theme/light/light-jsc.less
  12. 30 0
      src/assets/styles/theme/light/light-qt.less
  13. 140 0
      src/assets/styles/theme/light/light-sp.less
  14. 6 0
      src/assets/styles/theme/light/setting.less
  15. 13 0
      src/components/arcgis/arcgis.vue
  16. 21 8
      src/components/chart/bar/list-bar-chart2.vue
  17. 44 7
      src/components/chart/bar/multiple-bar-chart.vue
  18. 21 4
      src/components/chart/bar/percent-bar.vue
  19. 25 7
      src/components/chart/line/double-line-chart.vue
  20. 30 6
      src/components/chart/line/multiple-y-line-chart-normal.vue
  21. 45 12
      src/components/chart/pie/dash-pie-chart.vue
  22. 16 5
      src/components/chart/pie/radar-pie-chart.vue
  23. 1 1
      src/components/coms/table/group-table.vue
  24. 286 242
      src/components/other/healthReport/index.vue
  25. 13 2
      src/store/index.js
  26. 3 49
      src/views/Home/Home.vue
  27. 495 66
      src/views/Home/components/map/svg-map-nx.vue
  28. 0 1
      src/views/Home/components/weather.vue
  29. 49 52
      src/views/NewPages/alarm-center-gzfx.vue
  30. 49 51
      src/views/NewPages/alarm-center-yjfx.vue
  31. 63 11
      src/views/NewPages/power-benchmarking.vue
  32. 29 41
      src/views/NewPages/znzhfx.vue
  33. 149 50
      src/views/Others/index.vue
  34. 3 3
      src/views/SandTable/SandTable.vue
  35. 32 22
      src/views/WindSite/pages/Info/Info.vue
  36. 1 1
      src/views/WindSite/pages/Map.vue
  37. 106 45
      src/views/layout/Header.vue
  38. 7 1
      src/views/layout/Menu.vue
  39. 1 46
      src/views/singleAnalysis/index.vue
  40. 31 39
      src/views/singleAnalysis/znzhfx.vue

+ 13 - 0
README.md

@@ -1,6 +1,19 @@
 # 三区综合分析系统[sis_zhfx]
 
 * 注:需创建自己的 GIT 分支进行代码开发,开发完调试完毕后再自行合并至主干分支。
+* 关于主题样式的开发,应遵循以下开发提规章:
+- 通过增加样式的 id class 标签名 来提升权重实现样式替换。
+即:避免使用 !important 修饰符来提升权重(本身需覆盖的样式就有 !important 的除外)
+
+- 个人所负责的模块内的所有样式个人处理解决完。
+包括但不限于模块内所使用但还没进行样式切换修改的组件、工具、弹窗、第三方UI库等。
+
+- 理论上来说只需要亮色主题样式。
+但是部分模块可能还需要再写一份暗色的样式避免切换后亮色主题的部分样式残留问题。如需写两套,所分配任务的个人承担。
+
+- 遵循一个模块一个 less 文件的原则,文件顶部写明当前文件所属模块的名称。
+
+- 提交代码后如果衍生出冲突需要自行解决
 
 ## 项目运行
 ```

+ 1 - 0
package.json

@@ -13,6 +13,7 @@
   "dependencies": {
     "@antv/x6": "^1.24.4",
     "@arcgis/core": "^4.19.3",
+    "@element-plus/icons-vue": "^0.2.4",
     "@open-wc/webpack-import-meta-loader": "git+https://github.com/KmjKoishi/webpack-import-meta-loader-fixed.git",
     "animate.css": "3.5",
     "axios": "^0.21.1",

+ 1 - 1
public/index.html

@@ -32,7 +32,7 @@
   </title>
 </head>
 
-<body>
+<body id="appBody" class="dark">
   <div id="ie_dialog">
     本平台仅支持非ie浏览器使用
   </div>

Fichier diff supprimé car celui-ci est trop grand
+ 18 - 0
public/static/js/less.min.js


+ 23 - 0
public/static/stylesheet/color.less

@@ -0,0 +1,23 @@
+@green: #05bb4c;
+@yellow: #edbf03;
+@blue: #1a93cf;
+@darkBlue: #4b55ae;
+@darkBlue2: #1529E9;
+@darkgray: #606769;
+@gray: #606769;
+@gray-l: #B3BDC0;
+@black: #000000;
+@write: #ffffff;
+@ligntRed: #ff7a7f;
+@red: #BA3237;
+@darkRed: #710f14;
+@purple: #4b55ae;
+@orange: #e17e23;
+@white: #ffffff;
+@pink: #c531c7;
+
+@greenLinearTop: linear-gradient(to top, fade(@green, 50%), fade(@green, 0));
+@greenLinearRight: linear-gradient(to right, fade(@green, 50%), fade(@green, 0));
+@redLinearRight: linear-gradient(to right, fade(@red, 50%), fade(@red, 0));
+
+@font-color: #7a8385;

+ 61 - 7
src/App.vue

@@ -241,9 +241,46 @@ l16.229-16.229l16.229,16.229l42.867-42.867C115.034,45.228,109.133,42.189,102.956
       :class="{ hover: isShowMenu }"
       @mouseenter="showMenu"
       @mouseleave="hideMenu"
+      v-show="$store.state.themeName === 'dark'"
     >
       <Menu :root="root" />
     </div>
+    <div>
+      <el-menu
+        class="lightMenu"
+        :class="$store.state.themeName === 'light' ? 'show' : 'hidden'"
+        :collapse="true"
+        text-color="#ffffff"
+        active-text-color="#6262a2"
+        background-color="#36348e"
+      >
+        <el-sub-menu
+          :index="index"
+          :title="item.text"
+          v-for="(item, index) in menuData"
+          :key="index"
+        >
+          <template #title>
+            <router-link :to="item.path">
+              <el-icon>
+                <SvgIcon :svgid="item.icon" />
+              </el-icon>
+            </router-link>
+          </template>
+          <el-menu-item-group
+            v-for="(menu, idx) in item.children"
+            :index="idx"
+            :key="idx"
+          >
+            <router-link :to="menu.path">
+              <el-menu-item :index="index + '-' + idx">
+                {{ menu.text }}
+              </el-menu-item>
+            </router-link>
+          </el-menu-item-group>
+        </el-sub-menu>
+      </el-menu>
+    </div>
     <div class="main-body">
       <router-view />
     </div>
@@ -265,17 +302,19 @@ l16.229-16.229l16.229,16.229l42.867-42.867C115.034,45.228,109.133,42.189,102.956
 // 导入header.vue文件
 import Menu from "@/views/layout/Menu.vue";
 import Header from "@/views/layout/Header.vue";
-
-import { mapMutations } from "vuex";
-
 import LoginPage from "./views/layout/login-page.vue";
 import sisView from "./views/sisView/index.vue";
+
+import SvgIcon from "@com/coms/icon/svg-icon.vue";
+
+import $ from "jquery";
 export default {
   components: {
     Menu,
     Header,
     LoginPage,
     sisView,
+    SvgIcon,
   },
 
   data() {
@@ -286,11 +325,18 @@ export default {
       isLogined: true,
       showSisView: false,
       memuCloseTimeout: null,
+      menuData: [],
     };
   },
 
   created() {
     let that = this;
+    const themeName = that.$store.state.themeName;
+    $("#appBody").attr(
+      "class",
+      themeName === "dark" || themeName === "light" ? themeName : "dark"
+    );
+
     // that.$nextTick(() => {
     //   that.API.requestData({
     //     isMust: false, // 请求是否携带 token ,默认为 true ,可缺省
@@ -338,12 +384,19 @@ export default {
     login(params) {
       if (params.username && params.password) this.isLogined = true;
     },
+    menuOpen(a, b) {
+      console.log(111, a);
+      console.log(222, b);
+    },
   },
 
   watch: {
     $route(res) {
       this.showSisView = res.fullPath === "/sisView";
     },
+    "$store.state.menuData"(res) {
+      this.menuData = res;
+    },
   },
 };
 </script>
@@ -377,7 +430,8 @@ body {
   margin: 0;
   background: #fff;
   color: #fff;
-  background-image: url("./assets/background.png");
+  // background-image: url("./assets/background.png");
+  background: rgb(4, 12, 11);
   background-size: cover;
   font-size: @fontsize;
   font-family: @defalut-font-family;
@@ -476,13 +530,13 @@ body {
     border-color: #05bb4c;
   }
 }
-.el-tree-node__content{
+.el-tree-node__content {
   height: 40px !important;
 }
-.el-tree-node__label{
+.el-tree-node__label {
   font-size: 18px !important;
 }
-.el-pagination.is-background .el-pager li:not(.disabled).active{
+.el-pagination.is-background .el-pager li:not(.disabled).active {
   background-color: #05bb4c !important;
 }
 </style>

+ 23 - 0
src/assets/styles/common/common.less

@@ -1,2 +1,25 @@
 @import "color.less";
 @import "font.less";
+
+// 关于主题样式的开发,应遵循以下开发提规章:
+// 1. 通过增加样式的 id class 标签名 来提升权重实现样式替换。
+// 即:避免使用 !important 修饰符来提升权重(本身需覆盖的样式就有 !important 的除外)
+
+// 2. 个人所负责的模块内的所有样式个人处理解决完。
+// 包括但不限于模块内所使用但还没进行样式切换修改的组件、工具、弹窗、第三方UI库等。
+
+// 3. 理论上来说只需要亮色主题样式。
+// 但是部分模块可能还需要再写一份暗色的样式避免切换后亮色主题的部分样式残留问题。如需写两套,所分配任务的个人承担。
+
+// 4. 遵循一个模块一个 less 文件的原则,文件顶部写明当前文件所属模块的名称。
+
+// 5. 提交代码后如果衍生出冲突需要自行解决
+
+// 亮色主题
+@import "../theme/light/light-jsc.less"; // 驾驶舱
+@import "../theme/light/light-jjyx.less"; // 经济运行
+@import "../theme/light/light-sp.less"; // 沙盘
+@import "../theme/light/light-qt.less"; // 其他
+
+// 暗色主题
+@import "../theme/dark/dark-jsc.less"; // 驾驶舱

+ 278 - 0
src/assets/styles/theme/dark/dark-jsc.less

@@ -0,0 +1,278 @@
+// 驾驶舱模块黑色主题样式
+
+@import "./setting.less";
+
+#appBody.dark {
+    transition: @transition;
+
+    .gray {
+        transition: @transition;
+    }
+
+    .green {
+        transition: @transition;
+    }
+
+    .white {
+        transition: @transition;
+    }
+
+    #app {
+        transition: @transition;
+    }
+
+    .panel-title {
+        transition: @transition;
+    }
+
+    .panel-tools {
+        transition: @transition;
+    }
+
+    .weather {
+        .other-info {
+            .text {
+                transition: @transition;
+            }
+
+            div.svg-icon svg use {
+                transition: @transition;
+            }
+        }
+    }
+
+    .security-days {
+        .text {
+            transition: @transition;
+        }
+
+        .num {
+            transition: @transition;
+        }
+    }
+
+    .tab-box {
+        .tab-item {
+            span {
+                svg {
+                    use {
+                        transition: @transition;
+                    }
+                }
+            }
+        }
+    }
+
+    .header-body {
+        .header-title {
+            svg {
+                g:nth-child(1) {
+
+                    path,
+                    polygon {
+                        transition: @transition;
+                    }
+                }
+            }
+        }
+    }
+
+    .weather-info {
+        span svg use {
+            transition: @transition;
+        }
+    }
+
+    .map .tab-box .tab-item.active {
+        background-image: linear-gradient(to top,
+                rgba(5, 187, 76, 0.5),
+                rgba(5, 187, 76, 0));
+        transition: @transition;
+    }
+
+    .map .tab-box .tab-item.active::after {
+        transition: @transition;
+    }
+
+    .header-menu .header-menu-list .header-menu-item.active::after {
+        transition: @transition;
+    }
+
+    .header-menu .header-menu-list .header-menu-item.active {
+        background: linear-gradient(to top,
+                rgba(5, 187, 76, 0.5),
+                rgba(5, 187, 76, 0));
+        border    : 0.093vh solid @green;
+        transition: color @transition ease-in-out;
+    }
+
+    .coulometric-analysis {
+        .card-1 {
+            .card-icon {
+                svg use {
+                    transition: @transition;
+                }
+            }
+        }
+    }
+
+    .map .compass {
+        svg g:nth-child(3) {
+            g g path {
+                transition: @transition;
+            }
+        }
+
+        svg g:nth-child(4) {
+            g g path {
+                transition: @transition;
+            }
+        }
+
+        &::after {
+            transition: @transition;
+        }
+    }
+
+    .name-box-period-label {
+        transition: @transition;
+    }
+
+    .name-box-period-value {
+        transition: @transition;
+    }
+
+    .svg-map-nx {
+        .item-label {
+            rect {
+                transition: @transition;
+            }
+
+            .mapKey {
+                transition: @transition;
+            }
+        }
+
+        .popup-layer-svg {
+            .mapKey {
+                transition: @transition;
+            }
+        }
+
+        #popup-box-svg rect {
+            transition: @transition;
+        }
+    }
+
+    .com-panel-3,
+    .com-panel,
+    .header-body {
+        transition: @transition;
+    }
+
+    .com-panel-3 .dot,
+    .com-panel.line:before {
+        transition: @transition;
+    }
+
+    .panel-header {
+        transition: @transition;
+    }
+
+    .fengji-icon {
+        svg use {
+            transition: @transition;
+        }
+    }
+
+    .modal.el-dialog {
+        transition: @transition;
+    }
+
+    .modal.el-dialog .el-dialog__title {
+        transition: @transition;
+    }
+
+    .situation-body {
+        .value span:nth-child(2) {
+            transition: @transition;
+        }
+    }
+
+    .coulometric-analysis .card-title {
+        transition: @transition;
+    }
+
+    .com-panel,
+    .panel-header,
+    .home .table-card,
+    .com-panel-3.situation,
+    .el-menu--collapse,
+    .el-sub-menu,
+    .el-sub-menu__title,
+    .el-menu--popup,
+    .el-menu-item {
+        transition: @transition;
+    }
+
+    .com-panel.line::before {
+        transition: @transition;
+    }
+
+    .lightMenu {
+        width        : 0;
+        height       : calc(100% - 71px);
+        position     : absolute;
+        left         : 0;
+        top          : 57px;
+        z-index      : 100;
+        border-radius: 20px;
+        border       : 0;
+        overflow     : hidden;
+        transition   : @transition;
+    }
+
+    .lightMenu.hidden {
+        width     : 0;
+        transition: @transition;
+    }
+
+    .main-body {
+        margin-left: 0;
+        transition : @transition;
+    }
+
+    .dot.top-left {
+        transition: @transition;
+    }
+
+    .dot.bottom-left {
+        transition: @transition;
+    }
+
+    .dot.top-rignt {
+        transition: @transition;
+    }
+
+    .dot.bottom-right {
+        transition: @transition;
+    }
+
+    .lightMenu .el-menu--collapse {
+        transition: @transition;
+    }
+
+    .lightMenu .el-menu--collapse {
+        height: 100%;
+    }
+
+    .lightMenu .el-sub-menu__title {
+        transition: @transition;
+    }
+
+    .lightMenu .el-sub-menu__title i {
+        transition: @transition;
+    }
+
+    transition: @transition;
+}

+ 6 - 0
src/assets/styles/theme/dark/setting.less

@@ -0,0 +1,6 @@
+// 暗色样式配置
+
+@green     : #05bb4c;
+@deepblue  : #36348e;
+@transition: 0.25s;
+@black     : rgb(13, 30, 28);

+ 166 - 0
src/assets/styles/theme/light/light-jjyx.less

@@ -0,0 +1,166 @@
+// 经济运行模块白色主题样式
+
+@import "./setting.less";
+
+#appBody.light {
+    .static-main {
+        background   : #fff;
+        border-color : @deepblue;
+        border-radius: @borderRaduis;
+        transition   : @transition;
+        flex         : 0 0 130px;
+        margin-right : 5px;
+        transition   : @transition;
+
+        .icon i {
+            background  : @deepblue;
+            border-color: rgb(128, 128, 128);
+            transition  : @transition;
+
+            svg use {
+                fill      : #fff;
+                transition: @transition;
+            }
+        }
+
+        .info .value {
+            color     : @deepblue;
+            transition: @transition;
+        }
+    }
+
+    .static-items {
+        background   : #fff;
+        margin-right : 4px;
+        border-radius: @borderRaduis;
+        transition   : @transition;
+
+        .static-items-title {
+            color      : @deepblue;
+            font-weight: 700;
+            transition : @transition;
+        }
+
+        .items {
+            .item {
+                margin-left  : 4px;
+                border-radius: @borderRaduis;
+                background   : rgba(128, 128, 128, 0.15);
+                transition   : @transition;
+                font-weight  : 700;
+
+                .title {
+                    color      : @deepblue;
+                    font-weight: 700;
+                    transition : @transition;
+                }
+            }
+        }
+    }
+
+    .power-benchmarking-page .top .top-left .top-left-header .header-right>div.active,
+    .power-benchmarking-page .top .top-left .top-left-header .header-right>div:hover {
+        background  : rgba(54, 52, 142, 0.2);
+        border-color: @deepblue;
+        color       : @deepblue;
+        transition  : @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-title::before {
+        background: linear-gradient(135deg, rgba(54, 52, 142, 0.4), transparent, transparent, transparent, rgba(54, 52, 142, 0.4));
+    }
+
+    .power-benchmarking-page .top .top-right .rank-title {
+        border-color: @deepblue;
+        color       : @deepblue;
+        transition  : @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-title .border {
+        border-color: @deepblue;
+        transition  : @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-table.el-table thead tr th {
+        background : rgba(54, 52, 142, 0.05);
+        color      : @black;
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-block {
+        border-color: @deepblue;
+        background  : rgba(54, 52, 142, 0.2);
+        transition  : @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-table {
+        border-color: @deepblue;
+        transition  : @transition;
+    }
+
+    .top-right .el-table__body-wrapper {
+        background: #fff;
+        transition: @transition;
+    }
+
+    .main-body .el-table td,
+    .main-body .custom-table.el-table td {
+        color      : @black;
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .main-body .el-table tr:hover td,
+    .main-body .custom-table.el-table tr:hover td {
+        color      : @deepblue;
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-table.el-table.el-table--striped .el-table__body tr.el-table__row--striped td {
+        background: rgba(54, 52, 142, 0.1);
+        transition: @transition;
+    }
+
+    .power-benchmarking-page .top .top-right .rank-table.el-table.el-table--striped .el-table__body tr.el-table__row--striped:hover td {
+        background: rgba(54, 52, 142, 0.1) !important;
+        transition: @transition;
+    }
+
+    .top-left .el-table {
+        // background: #fff;
+        // transition: @transition;
+
+        table {
+            background: #fff;
+            transition: @transition;
+        }
+
+        th,
+        td {
+            font-weight: bold;
+            font-weight: 700;
+        }
+
+        thead tr:first-child th {
+            background: rgba(128, 128, 128, 0.3);
+            color     : @black;
+            transition: @transition;
+        }
+
+        thead tr:last-child th {
+            background: rgba(128, 128, 128, 0.1);
+            color     : @black;
+            transition: @transition;
+        }
+
+
+
+        th.light,
+        td.light {
+            color     : @deepblue  !important;
+            transition: @transition;
+        }
+    }
+}

+ 420 - 0
src/assets/styles/theme/light/light-jsc.less

@@ -0,0 +1,420 @@
+// 驾驶舱模块白色主题样式
+
+@import "./setting.less";
+
+#appBody.light {
+    color     : @black;
+    transition: @transition;
+
+    .gray {
+        color      : @black;
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .green {
+        color      : @deepblue;
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .white {
+        color     : @black;
+        transition: @transition;
+    }
+
+    #app {
+        background: rgb(220, 221, 223);
+        transition: @transition;
+    }
+
+    .panel-title {
+        color     : @black;
+        transition: @transition;
+    }
+
+    .panel-tools {
+        color     : @black;
+        transition: @transition;
+    }
+
+    .weather {
+        .other-info {
+            .text {
+                color     : @black;
+                transition: @transition;
+            }
+
+            div.svg-icon svg use {
+                fill      : @deepblue;
+                transition: @transition;
+            }
+        }
+    }
+
+    .security-days {
+        .text {
+            color     : @black;
+            transition: @transition;
+        }
+
+        .num {
+            color     : @deepblue;
+            transition: @transition;
+        }
+    }
+
+    .tab-box {
+        .tab-item {
+            span {
+                svg {
+                    use {
+                        fill      : @black;
+                        transition: @transition;
+                    }
+                }
+            }
+        }
+    }
+
+    .header-body {
+        border    : 0;
+        transition: @transition;
+
+        .header-title {
+            svg {
+                g:nth-child(1) {
+
+                    path,
+                    polygon {
+                        fill      : @black;
+                        transition: @transition;
+                    }
+                }
+            }
+        }
+    }
+
+    .weather-info {
+        span svg use {
+            fill      : @black;
+            transition: @transition;
+        }
+    }
+
+    .map .tab-box .tab-item.active {
+        color   : @deepblue;
+        position: relative;
+        background-image: linear-gradient(to top,
+                rgba(57, 54, 143, 0.5),
+                rgba(5, 187, 76, 0));
+        transition: @transition;
+    }
+
+    .map .tab-box .tab-item.active::after {
+        border    : 0.093vh solid @deepblue;
+        transition: @transition;
+    }
+
+    .header-menu .header-menu-list .header-menu-item.active::after {
+        border    : 0.093vh solid @deepblue;
+        transition: @transition;
+    }
+
+    .header-menu .header-menu-list .header-menu-item.active {
+        color   : @deepblue;
+        position: relative;
+        background: linear-gradient(to top,
+                rgba(57, 54, 143, 0.5),
+                rgba(5, 187, 76, 0));
+        border    : 0.093vh solid @deepblue;
+        transition: color @transition ease-in-out;
+    }
+
+    .home .table-card {
+        outline   : none;
+        transition: @transition;
+        overflow  : hidden;
+    }
+
+    .coulometric-analysis {
+        .card-1 {
+            .card-icon {
+                svg use {
+                    fill      : @deepblue;
+                    filter    : drop-shadow(0 0 6px @deepblue);
+                    transition: @transition;
+                }
+            }
+        }
+    }
+
+    .map .compass {
+        svg g:nth-child(3) {
+            g g path {
+                fill      : @deepblue;
+                transition: @transition;
+            }
+        }
+
+        svg g:nth-child(4) {
+            g g path {
+                fill      : @deepblue;
+                transition: @transition;
+            }
+        }
+
+        &::after {
+            box-shadow: inset 0px -5px 10px 0px @deepblue;
+            transition: @transition;
+        }
+    }
+
+    .name-box-period-label {
+        color     : @black;
+        transition: @transition;
+    }
+
+    .name-box-period-value {
+        color     : @deepblue;
+        transition: @transition;
+    }
+
+    .svg-map-nx {
+        .item-label {
+            rect {
+                fill      : @deepblue;
+                transition: @transition;
+            }
+
+            .mapKey {
+                fill      : #fff;
+                transition: @transition;
+            }
+        }
+
+        .popup-layer-svg {
+            .mapKey {
+                fill      : #fff;
+                transition: @transition;
+            }
+        }
+
+        #popup-box-svg rect {
+            fill      : @deepblue;
+            opacity   : 0.8;
+            transition: @transition;
+        }
+
+        .esp-1 {
+            stroke: @deepblue;
+        }
+
+        .esp-6 {
+            stroke: @deepblue;
+        }
+
+        .esp-c {
+            stroke: @deepblue;
+        }
+    }
+
+    .com-panel-3,
+    .com-panel,
+    .header-body {
+        background: #fff;
+        transition: @transition;
+    }
+
+    .com-panel-3 .dot,
+    .com-panel.line:before {
+        background: @black;
+        transition: @transition;
+    }
+
+    .panel-header {
+        background: #fff;
+        transition: @transition;
+    }
+
+    .fengji-icon {
+        svg use {
+            fill      : @deepblue;
+            transition: @transition;
+        }
+    }
+
+    .modal.el-dialog {
+        background   : rgba(255, 255, 255, 0.85);
+        border       : 1px solid rgba(57, 54, 143, 0.5);
+        box-shadow   : 0px 8px 17px 1px rgb(57, 54, 143 / 30%);
+        border-radius: @borderRaduis;
+        transition   : @transition;
+    }
+
+    .modal.el-dialog .el-dialog__title {
+        color     : rgba(0, 0, 0, 0.75);
+        transition: @transition;
+    }
+
+    .situation-body {
+        .value span:nth-child(2) {
+            font-weight: 700;
+            transition : @transition;
+        }
+    }
+
+    .coulometric-analysis .card-title {
+        color     : @black;
+        transition: @transition;
+    }
+
+    .com-panel,
+    .panel-header,
+    .home .table-card,
+    .com-panel-3.situation,
+    .el-menu--collapse,
+    .el-sub-menu,
+    .el-sub-menu__title,
+    .el-menu--popup,
+    .el-menu-item {
+        border-radius: @borderRaduis;
+        transition   : @transition;
+    }
+
+    .com-panel {
+        padding-bottom: 10px;
+        transition    : @transition;
+    }
+
+    .com-panel.line::before {
+        width     : 4px;
+        height    : 4px;
+        background: @black;
+        margin    : 0.85vh 0.556vh 0vh 0.85vh;
+        transition: @transition;
+    }
+
+    .com-panel.line {
+        border-left: 0;
+        transition : @transition;
+    }
+
+    .lightMenu {
+        width        : 0;
+        height       : calc(100% - 71px);
+        position     : absolute;
+        left         : 14px;
+        top          : 57px;
+        z-index      : 100;
+        border-radius: 20px;
+        border       : 0;
+        overflow     : hidden;
+        transition   : @transition;
+    }
+
+    .lightMenu.show {
+        width     : 54px;
+        transition: @transition;
+    }
+
+    .main-body {
+        margin-left: 66px;
+        max-width  : calc(100vw - 54px - 12px);
+        transition : @transition;
+    }
+
+    .dot.top-left {
+        top       : 0.85vh;
+        left      : 0.85vh;
+        background: @black;
+        transition: @transition;
+    }
+
+    .dot.bottom-left {
+        bottom    : 0.85vh;
+        left      : 0.85vh;
+        background: @black;
+        transition: @transition;
+    }
+
+    .dot.top-rignt {
+        top       : 0.85vh;
+        right     : 0.85vh;
+        background: @black;
+        transition: @transition;
+    }
+
+    .dot.bottom-right {
+        bottom    : 0.85vh;
+        right     : 0.85vh;
+        background: @black;
+        transition: @transition;
+    }
+
+    .lightMenu .el-menu--collapse {
+        width     : 54px;
+        transition: @transition;
+    }
+
+    .lightMenu .el-menu--collapse {
+        height: 100%;
+    }
+
+    .lightMenu .el-sub-menu__title {
+        text-align    : center;
+        vertical-align: middle;
+        padding       : 0 20px;
+        transition    : @transition;
+    }
+
+    .lightMenu .el-sub-menu__title i {
+        color     : #fff;
+        transition: @transition;
+    }
+	
+	.el-popper.is-light.is-pure .el-menu--popup {
+	  padding:0;
+	}
+	
+	.el-popper.is-light{
+		background:transparent;
+		border:none;
+	}
+	
+    .com-panel-3 {
+        border    : 0;
+        transition: @transition;
+    }
+
+    .map .return {
+        color     : rgba(0, 0, 0, 0.8);
+        transition: @transition;
+
+        use {
+            fill      : @black;
+            transition: @transition;
+        }
+    }
+
+    .map .return:hover {
+        color       : @deepblue;
+        border-color: @deepblue;
+        transition  : @transition;
+
+        use {
+            fill      : @deepblue;
+            transition: @transition;
+        }
+    }
+
+    .name-box {
+        .name-box-title {
+            color     : @black;
+            transition: @transition;
+        }
+    }
+	
+    background: rgb(220, 221, 223);
+    transition: @transition;
+}

+ 30 - 0
src/assets/styles/theme/light/light-qt.less

@@ -0,0 +1,30 @@
+// 其他模块白色主题样式
+
+@import "./setting.less";
+
+#appBody.light {
+
+    .sjcx-item {
+        color     : @black;
+        transition: @transition;
+    }
+
+    .sjcx-item:hover {
+        color     : @deepblue;
+        transition: @transition;
+    }
+
+    .imgTitle {
+        color     : @black;
+        transition: @transition;
+    }
+
+    .imgItem1:hover .imgTitle {
+        color     : @deepblue;
+        transition: @transition;
+    }
+
+    .el-carousel__item {
+        border-radius: @borderRaduis;
+    }
+}

+ 140 - 0
src/assets/styles/theme/light/light-sp.less

@@ -0,0 +1,140 @@
+// 沙盘模块白色主题样式
+
+@import "./setting.less";
+
+#appBody.light {
+    .com-panel-sand {
+        background   : #fff;
+        border-top   : 1px solid transparent;
+        border-radius: @borderRaduis;
+        transition   : @transition;
+    }
+
+    .com-panel-sand::after {
+        background: transparent;
+        transition: @transition;
+    }
+
+    .com-panel-sand-header {
+        border-color: @deepblue;
+        font-weight : 700;
+        transition  : @transition;
+    }
+
+    .com-panel-sand .com-panel-sand-header::after,
+    .com-panel-sand .com-panel-sand-header::before {
+        background: @deepblue;
+        transition: @transition;
+    }
+
+    .com-panel-sand .com-panel-body .other-info {
+        .value {
+            color      : @black;
+            font-weight: 700;
+            transition : @transition;
+        }
+
+        .text {
+            color      : @black;
+            font-weight: 700;
+            transition : @transition;
+        }
+    }
+
+    .com-panel-sand .rank-table th {
+        color      : @black;
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .com-panel-sand .rank-table td {
+        font-weight: 700;
+        transition : @transition;
+    }
+
+    .sand-table-bottom {
+        .p-panel {
+            background   : #fff;
+            border-radius: @borderRaduis;
+        }
+
+        .p-panel-title {
+            color      : @black;
+            font-weight: 700;
+            transition : @transition;
+        }
+
+        .pp-info-data .gray-l {
+            color      : rgb(128, 128, 128);
+            font-weight: 700;
+            transition : @transition;
+        }
+    }
+
+    .sand-table-right .com-panel-body .com-table {
+        th {
+            color      : rgb(128, 128, 128);
+            font-weight: 700;
+            transition : @transition;
+        }
+
+
+        th.light {
+            color      : @deepblue  !important;
+            font-weight: 700;
+            transition : @transition;
+        }
+
+        td {
+            color      : @black;
+            font-weight: 700;
+            transition : @transition;
+        }
+
+        td.light {
+            color      : @deepblue  !important;
+            font-weight: 700;
+            transition : @transition;
+        }
+    }
+
+    .modal {
+        .el-dialog__body {
+            background: rgba(255, 255, 255, 0.8);
+            transition: @transition;
+
+
+            .el-form-item__label {
+                color     : @black;
+                transition: @transition;
+            }
+
+            .el-input__inner {
+                background   : rgba(0, 0, 0, 0.5);
+                border-color : rgba(0, 0, 0, 0.5);
+                border-radius: @borderRaduis;
+                transition   : @transition;
+            }
+        }
+    }
+
+    .weatherBox {
+        .r {
+            .el-collapse-item__content {
+                background : transparent;
+                color      : @black;
+                font-weight: 700;
+                padding    : 20px;
+                transition : @transition;
+            }
+
+            .el-collapse-item__header {
+                background   : transparent;
+                border-bottom: 1px solid #999;
+                color        : rgba(0, 0, 0, 0.75);
+                transition   : @transition;
+            }
+        }
+
+    }
+}

+ 6 - 0
src/assets/styles/theme/light/setting.less

@@ -0,0 +1,6 @@
+// 亮色样式配置
+
+@black      : #000;
+@transition : 0.25s;
+@deepblue   : #36348e;
+@borderRaduis: 12px;

+ 13 - 0
src/components/arcgis/arcgis.vue

@@ -455,6 +455,19 @@
         },
         mounted() {
             // 渲染后
+			basemap = null;
+            map = null;
+            view = null;
+            point_graphicsLayer = null;
+            line_graphicsLayer = null;
+            text_graphicsLayer = null;
+            img_graphicsLayer = null;
+            html_graphicsLayer = null;
+            point_graphics = [];
+            line_graphics = [];
+            text_graphics = [];
+            img_graphics = [];
+            html_graphics = [];
             this.initMap();
         },
         beforeUpdate() {

+ 21 - 8
src/components/chart/bar/list-bar-chart2.vue

@@ -1,6 +1,11 @@
 <template>
   <div>
-    <div class="chart" v-for="index of list.length" :key="index" :id="id + index"></div>
+    <div
+      class="chart"
+      v-for="index of list.length"
+      :key="index"
+      :id="id + index"
+    ></div>
   </div>
 </template>
 
@@ -128,7 +133,7 @@ export default {
             // silent: true,
             itemStyle: {
               normal: {
-                color: function(params) {
+                color: function (params) {
                   return {
                     type: "linear",
                     x: 0,
@@ -155,11 +160,11 @@ export default {
               normal: {
                 show: true,
                 position: [0, util.vh("-20")],
-                formatter: function(param) {
+                formatter: function (param) {
                   return param.data.name;
                 },
                 textStyle: {
-                  color: "#7a8385",
+                  color: this.$store.state.themeName === "dark" ? "#7a8385" : "#000",
                   fontSize: 12,
                 },
               },
@@ -181,7 +186,7 @@ export default {
             itemStyle: {
               normal: {
                 borderWidth: 0,
-                color: function(params) {
+                color: function (params) {
                   return partten.getColor(currColor);
                 },
                 // shadowBlur: 2,
@@ -194,7 +199,7 @@ export default {
             type: "pictorialBar",
             itemStyle: {
               normal: {
-                color: "#20314f",
+                color: this.$store.state.themeName === "dark" ? "#20314f" : "#000",
               },
             },
             animation: this.firstAnimation,
@@ -229,7 +234,7 @@ export default {
                 },
                 rich: {
                   f: {
-                    color: "#ffffff",
+                    color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
                     fontSize: 14,
                     lineHeight: 20,
                     fontFamily: "Bicubik",
@@ -283,7 +288,7 @@ export default {
       chart.clear();
       chart.setOption(option);
 
-      this.resize = function() {
+      this.resize = function () {
         chart.resize();
       };
 
@@ -314,6 +319,14 @@ export default {
   unmounted() {
     window.removeEventListener("resize", this.resize);
   },
+
+  watch: {
+    "$store.state.themeName"() {
+      this.list.forEach((value, index) => {
+        this.initChart(value, index);
+      });
+    },
+  },
 };
 </script>
 

+ 44 - 7
src/components/chart/bar/multiple-bar-chart.vue

@@ -147,7 +147,7 @@ export default {
       type: Boolean,
       default: true,
     },
-    // 颜色
+    // 颜色#
     color: {
       type: Array,
       default: () => [
@@ -208,11 +208,18 @@ export default {
             axisLabel: {
               formatter: "{value} ",
               fontSize: 12,
+              textStyle: {
+                color:
+                  this.$store.state.themeName === "dark"
+                    ? "rgb(116,124,128)"
+                    : "#000",
+              },
             },
             //分格线
             splitLine: {
               lineStyle: {
-                color: "#5a6162",
+                color:
+                  this.$store.state.themeName === "dark" ? "#5a6162" : "#000",
                 type: "dashed",
               },
             },
@@ -224,6 +231,12 @@ export default {
             axisLabel: {
               formatter: "{value}",
               fontSize: 12,
+              textStyle: {
+                color:
+                  this.$store.state.themeName === "dark"
+                    ? "rgb(116,124,128)"
+                    : "#000",
+              },
             },
             //分格线
             splitLine: {
@@ -277,10 +290,16 @@ export default {
         color: this.color,
         tooltip: {
           trigger: "axis",
-          backgroundColor: "rgba(0,0,0,0.4)",
-          borderColor: partten.getColor("gray"),
+          backgroundColor:
+            this.$store.state.themeName === "dark"
+              ? "rgba(0,0,0,0.4)"
+              : "rgba(255,255,255,0.5)",
+          borderColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontSize: 12,
           },
         },
@@ -291,10 +310,16 @@ export default {
           icon: "ract",
           itemWidth: 8,
           itemHeight: 8,
-          inactiveColor: partten.getColor("gray"),
+          inactiveColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: partten.getColor("grayl"),
             fontSize: 12,
+            color:
+              this.$store.state.themeName === "dark"
+                ? partten.getColor("grayl")
+                : "#000",
           },
         },
         grid: {
@@ -315,6 +340,12 @@ export default {
             axisLabel: {
               interval: 0,
               fontSize: 12,
+              textStyle: {
+                color:
+                  this.$store.state.themeName === "dark"
+                    ? "rgb(116,124,128)"
+                    : "#000",
+              },
             },
           },
         ],
@@ -353,6 +384,12 @@ export default {
   unmounted() {
     window.removeEventListener("resize", this.resize);
   },
+
+  watch: {
+    "$store.state.themeName"() {
+      this.initChart();
+    },
+  },
 };
 </script>
 

+ 21 - 4
src/components/chart/bar/percent-bar.vue

@@ -62,7 +62,10 @@ export default {
               fontSize: 14,
               fontFamily: "Bicubik",
               fontWeight: "600",
-              color: partten.getColor(this.colors),
+              color:
+                this.$store.state.themeName === "dark"
+                  ? partten.getColor(this.colors)
+                  : "rgb(57, 54, 143)",
               textAlign: "center",
             },
           },
@@ -98,13 +101,19 @@ export default {
             barWidth: 60,
             showBackground: true,
             backgroundStyle: {
-              color: partten.getColor(this.colors) + "30",
+              color:
+                this.$store.state.themeName === "dark"
+                  ? partten.getColor(this.colors) + "30"
+                  : "#fff",
             },
             data: [this.value],
             coordinateSystem: "polar",
             itemStyle: {
               normal: {
-                color: partten.getColor(this.colors),
+                color:
+                  this.$store.state.themeName === "dark"
+                    ? partten.getColor(this.colors)
+                    : "rgb(57, 54, 143)",
                 //    new echarts.graphic.LinearGradient(1, 0, 0, 0, [
                 //     {
                 //       offset: 0,
@@ -129,7 +138,10 @@ export default {
                 value: 100,
                 name: "",
                 itemStyle: {
-                  color: partten.getColor(this.colors),
+                  color:
+                    this.$store.state.themeName === "dark"
+                      ? partten.getColor(this.colors)
+                      : "rgb(57, 54, 143)",
                 },
                 label: {
                   show: false,
@@ -182,6 +194,11 @@ export default {
       this.initChart();
     });
   },
+  watch: {
+    "$store.state.themeName"() {
+      this.initChart();
+    },
+  },
 };
 </script>
 

+ 25 - 7
src/components/chart/line/double-line-chart.vue

@@ -138,6 +138,9 @@ export default {
       },
       deep: true,
     },
+    "$store.state.themeName"() {
+      this.initChart();
+    },
   },
   computed: {
     colorValue() {
@@ -211,10 +214,16 @@ export default {
         color: this.color,
         tooltip: {
           trigger: "axis",
-          backgroundColor: "rgba(0,0,0,0.4)",
-          borderColor: partten.getColor("gray"),
+          backgroundColor:
+            this.$store.state.themeName === "dark"
+              ? "rgba(0,0,0,0.4)"
+              : "rgba(255,255,255,0.4)",
+          borderColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontSize: util.vh(16),
           },
         },
@@ -224,9 +233,15 @@ export default {
           right: 56,
           icon: "circle",
           itemWidth: 6,
-          inactiveColor: partten.getColor("gray"),
+          inactiveColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: partten.getColor("grayl"),
+            color:
+              this.$store.state.themeName === "dark"
+                ? partten.getColor("grayl")
+                : "#000",
             fontSize: 12,
           },
         },
@@ -243,7 +258,10 @@ export default {
             axisLabel: {
               formatter: "{value}",
               textStyle: {
-                color: partten.getColor("gray"),
+                color:
+                  this.$store.state.themeName === "dark"
+                    ? partten.getColor("gray")
+                    : "#000",
                 fontSize: util.vh(10),
               },
             },
@@ -257,7 +275,7 @@ export default {
       chart.clear();
       chart.setOption(option);
 
-      this.resize = function() {
+      this.resize = function () {
         chart.resize();
       };
 

+ 30 - 6
src/components/chart/line/multiple-y-line-chart-normal.vue

@@ -291,7 +291,7 @@ export default {
   computed: {
     legend() {
       return this.list.map((t) => {
-        return t && t.title;
+        return t.title;
       });
     },
     xdata() {
@@ -315,6 +315,12 @@ export default {
           axisLabel: {
             formatter: "{value}",
             fontSize: 12,
+            textStyle: {
+              color:
+                this.$store.state.themeName === "dark"
+                  ? "rgb(116,124,128)"
+                  : "#000",
+            },
           },
           //分格线
           splitLine: {
@@ -379,10 +385,16 @@ export default {
         color: this.color,
         tooltip: {
           trigger: "axis",
-          backgroundColor: "rgba(0,0,0,0.4)",
-          borderColor: partten.getColor("gray"),
+          backgroundColor:
+            this.$store.state.themeName === "dark"
+              ? "rgba(0,0,0,0.4)"
+              : "rgba(255,255,255,0.5)",
+          borderColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontSize: 12,
           },
         },
@@ -394,7 +406,10 @@ export default {
           itemWidth: 6,
           inactiveColor: partten.getColor("gray"),
           textStyle: {
-            color: partten.getColor("grayl"),
+            color:
+              this.$store.state.themeName === "dark"
+                ? partten.getColor("grayl")
+                : "#000",
             fontSize: 12,
           },
         },
@@ -413,7 +428,10 @@ export default {
               formatter: "{value}",
               fontSize: 12,
               textStyle: {
-                color: partten.getColor("gray"),
+                color:
+                  this.$store.state.themeName === "dark"
+                    ? partten.getColor("gray")
+                    : "#000",
               },
             },
             data: this.xdata,
@@ -448,6 +466,12 @@ export default {
   unmounted() {
     window.removeEventListener("resize", this.resize);
   },
+
+  watch: {
+    "$store.state.themeName"() {
+      this.initChart();
+    },
+  },
 };
 </script>
 

+ 45 - 12
src/components/chart/pie/dash-pie-chart.vue

@@ -6,6 +6,7 @@
 import util from "@/helper/util.js";
 import partten from "@/helper/partten.js";
 import * as echarts from "echarts";
+import $ from "jquery";
 
 export default {
   name: "dsah-pie",
@@ -71,7 +72,9 @@ export default {
           z: 8,
           textAlign: "center",
           textStyle: {
-            color: partten.getColor("gray"),
+            color: $("#appBody").is(".dark")
+              ? partten.getColor("gray")
+              : "#000",
             fontSize: util.vh(12),
             fontWeight: "normal",
           },
@@ -92,11 +95,15 @@ export default {
                     new echarts.graphic.LinearGradient(0, 0, 1, 0, [
                       {
                         offset: 0,
-                        color: partten.getColor(this.color) + "01",
+                        color: $("#appBody").is(".dark")
+                          ? partten.getColor(this.color) + "01"
+                          : "rgb(57, 54, 143)",
                       },
                       {
                         offset: 1,
-                        color: partten.getColor(this.color) + "ff",
+                        color: $("#appBody").is(".dark")
+                          ? partten.getColor(this.color) + "ff"
+                          : "rgb(57, 54, 143)",
                       },
                     ]),
                   ],
@@ -155,7 +162,7 @@ export default {
             ],
             itemStyle: {
               normal: {
-                color: "#fff",
+                color: $("#appBody").is(".dark") ? "#fff" : "#000",
               },
             },
             pointer: {
@@ -183,7 +190,14 @@ export default {
               // 仪表盘刻度线
               lineStyle: {
                 width: util.vh(1),
-                color: [[1, partten.getColor(this.color)]],
+                color: [
+                  [
+                    1,
+                    $("#appBody").is(".dark")
+                      ? partten.getColor(this.color)
+                      : "rgb(57, 54, 143)",
+                  ],
+                ],
               },
             },
             //仪表盘文字
@@ -196,7 +210,9 @@ export default {
               distance: 6,
               splitNumber: 2,
               lineStyle: {
-                color: partten.getColor("green"), //用颜色渐变函数不起作用
+                color: $("#appBody").is(".dark")
+                  ? partten.getColor("green")
+                  : "rgb(57, 54, 143)", //用颜色渐变函数不起作用
                 width: util.vh(1),
               },
               length: util.vh(4),
@@ -229,10 +245,12 @@ export default {
                 },
                 label: {
                   normal: {
-                    formatter: function(params) {
+                    formatter: function (params) {
                       return params.value;
                     },
-                    color: partten.getColor(this.color),
+                    color: $("#appBody").is(".dark")
+                  ? partten.getColor(this.color)
+                  : "rgb(57, 54, 143)",
                     fontSize: util.vh(12),
                     fontWeight: "bold",
                     position: "center",
@@ -270,7 +288,12 @@ export default {
                   //     },
                   //   ]),
                   // ],
-                  [1, "rgba(45,230,150,0.1)"],
+                  [
+                    1,
+                    $("#appBody").is(".dark")
+                      ? "rgba(45,230,150,0.1)"
+                      : "rgba(57, 54, 143, 0.1)",
+                  ],
                   // [1, "rgba(45,230,150,0)"],
                 ],
                 width: 3,
@@ -310,9 +333,13 @@ export default {
                 value: 1,
                 itemStyle: {
                   color: "transparent",
-                  borderColor: partten.getColor(this.color),
+                  borderColor: $("#appBody").is(".dark")
+                    ? partten.getColor(this.color)
+                    : "rgb(57, 54, 143)",
                   opacity: 0.3,
-                  shadowColor: partten.getColor(this.color),
+                  shadowColor: $("#appBody").is(".dark")
+                    ? partten.getColor(this.color)
+                    : "rgb(57, 54, 143)",
                   shadowBlur: util.vh(20),
                 },
               },
@@ -324,7 +351,7 @@ export default {
       chart.clear();
       chart.setOption(option);
 
-      this.resize = function() {
+      this.resize = function () {
         chart.resize();
       };
 
@@ -346,6 +373,12 @@ export default {
   unmounted() {
     window.removeEventListener("resize", this.resize);
   },
+
+  watch: {
+    "$store.state.themeName"() {
+      this.initChart();
+    },
+  },
 };
 </script>
 

+ 16 - 5
src/components/chart/pie/radar-pie-chart.vue

@@ -72,10 +72,16 @@ export default {
         ],
         tooltip: {
           trigger: "item",
-          backgroundColor: "rgba(0,0,0,0.4)",
-          borderColor: partten.getColor("gray"),
+          backgroundColor:
+            this.$store.state.themeName === "dark"
+              ? "rgba(0,0,0,0.4)"
+              : "rgba(255,255,255,0.4)",
+          borderColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontSize: util.vh(16),
           },
         },
@@ -93,7 +99,7 @@ export default {
           right: "0",
           align: "left",
           textStyle: {
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
           },
           itemGap: 8,
         },
@@ -111,7 +117,7 @@ export default {
           axisLabel: {
             show: false,
             fontSize: 18,
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontStyle: "normal",
             fontWeight: "normal",
           },
@@ -268,6 +274,11 @@ export default {
   updated() {
     this.initChart();
   },
+  watch: {
+    "$store.state.themeName"() {
+      this.initChart();
+    },
+  },
 };
 </script>
 

+ 1 - 1
src/components/coms/table/group-table.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-table class="custom-table" :show-summary="summary" :class="customClass" stripe :data="data.data" :height="height" style="width: 100%" @cell-click="onClick" @header-click="onHeaderClick">
+  <el-table class="custom-table" :show-summary="summary" :class="customClass" stripe :data="data.data" :height="height" style="width: 100%" @cell-click="onClick" @header-click="onHeaderClick" ref="groupTable">
     <template v-for="(col, cIndex) in data.column" :key="col">
       <el-table-column v-if="col.child && col.child.length > 0" :label="col.name" :key="col">
         <el-table-column

+ 286 - 242
src/components/other/healthReport/index.vue

@@ -98,7 +98,7 @@
               </p>
               <p>
                 统计期内故障发生{{
-                  Number(faultclass[0] ? faultclass[0].monthwarningnum : 48) + 
+                  Number(faultclass[0] ? faultclass[0].monthwarningnum : 48) +
                   Number(faultclass[1] ? faultclass[1].monthwarningnum : 72) +
                   Number(faultclass[2] ? faultclass[2].monthwarningnum : 96)
                 }}次
@@ -121,7 +121,9 @@
               <p class="info">功率对部件温度影响较高是齿轮箱、主轴</p>
               <p class="info">部件劣化较高是发电机、主轴</p>
               <p>定捡已超过三个月,近三个月无维修记录</p>
-              <p v-if="Number(datas.isrecommend) == 1">该机组总体运行状态不佳,可安排检修人员排查。</p>
+              <p v-if="Number(datas.isrecommend) == 1">
+                该机组总体运行状态不佳,可安排检修人员排查。
+              </p>
               <p v-else>该机组总体运行状态良好,不需要作为重点关注。</p>
             </div>
           </el-form>
@@ -136,18 +138,17 @@
           <el-form-item class="text-indent-2">
             统计周期内,曲线偏差率-5%,其中风速在3-5m/s区间曲线偏差率10%,风速在5-11m/s区间曲线偏差率为-8%,风速在11-25m/s区间曲线偏差率为3%,总体低于该型号机组平均值(3%)。
           </el-form-item>
-		  <div v-if="healthreport.glqxnh">
-			  <div class="logHead">功率曲线拟合</div>
-			  <double-line-chart :height="'250px'" :list="glqxnh" />
-		  </div>
+          <div v-if="healthreport.glqxnh">
+            <div class="logHead">功率曲线拟合</div>
+            <double-line-chart :height="'250px'" :list="glqxnh" />
+          </div>
           <div v-if="healthreport.qxpcls">
-				<div class="logHead">曲线偏差率</div>
-				<normal-line-chart :list="qxpcls" />
+            <div class="logHead">曲线偏差率</div>
+            <normal-line-chart :list="qxpcls" />
           </div>
-          
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2">对风偏差:</el-form-item>
@@ -176,37 +177,37 @@
               healthreport.descriptiondfpcl
             }};(如果需要查看在每一个功率等高线下偏航对风偏差角度信号在角度数值上的聚集程度,可参考能效分析中对风偏差分析模块)
           </el-form-item>
-          
-		  <div v-if="healthreport.nipples">
-		  		<div class="logHead">对风偏差率(频次)</div>
-		  		<DoubleLineChart
-		  		  style="margin: 10px 0"
-		  		  width="100%"
-		  		  height="300px"
-		  		  :list="dfpc.nipples"
-		  		/>
-		  </div>
-		  <div v-if="healthreport.dfpclpowers">
-		  		<div class="logHead">对风偏差率(功率)</div>
-		  		<DoubleLineChart
-		  		  style="margin: 10px 0"
-		  		  width="100%"
-		  		  height="300px"
-		  		  :list="dfpc.dfpclpowers"
-		  		/>
-		  </div>
-		  <div v-if="healthreport.dfpclSpeeds">
-		  		<div class="logHead">对风偏差率(风速)</div>
-		  		<DoubleLineChart
-		  		  style="margin: 10px 0"
-		  		  width="100%"
-		  		  height="300px"
-		  		  :list="dfpc.dfpclSpeeds"
-		  		/>
-		  </div>
+
+          <div v-if="healthreport.nipples">
+            <div class="logHead">对风偏差率(频次)</div>
+            <DoubleLineChart
+              style="margin: 10px 0"
+              width="100%"
+              height="300px"
+              :list="dfpc.nipples"
+            />
+          </div>
+          <div v-if="healthreport.dfpclpowers">
+            <div class="logHead">对风偏差率(功率)</div>
+            <DoubleLineChart
+              style="margin: 10px 0"
+              width="100%"
+              height="300px"
+              :list="dfpc.dfpclpowers"
+            />
+          </div>
+          <div v-if="healthreport.dfpclSpeeds">
+            <div class="logHead">对风偏差率(风速)</div>
+            <DoubleLineChart
+              style="margin: 10px 0"
+              width="100%"
+              height="300px"
+              :list="dfpc.dfpclSpeeds"
+            />
+          </div>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2">切入切出:</el-form-item>
@@ -239,7 +240,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2"
@@ -266,14 +267,34 @@
             }}分钟。
           </el-form-item>
           <el-form-item class="text-indent-2" v-if="bjyhcount.length > 0">
-			<font v-if="bjyhcount[0].yhmx">其中以{{ bjyhcount[0].yhmx }}发生频次最高,为{{ bjyhcount[0].count }}次;</font>
-			<font v-if="bjyhcount[1].yhmx">{{ bjyhcount[1].yhmx }}次之,为{{ bjyhcount[1].count }}次;</font>
-			<font v-if="bjyhcount[2].yhmx">{{ bjyhcount[2].yhmx }}第三,为{{ bjyhcount[0].count }}次。</font>
+            <font v-if="bjyhcount[0].yhmx"
+              >其中以{{ bjyhcount[0].yhmx }}发生频次最高,为{{
+                bjyhcount[0].count
+              }}次;</font
+            >
+            <font v-if="bjyhcount[1].yhmx"
+              >{{ bjyhcount[1].yhmx }}次之,为{{ bjyhcount[1].count }}次;</font
+            >
+            <font v-if="bjyhcount[2].yhmx"
+              >{{ bjyhcount[2].yhmx }}第三,为{{ bjyhcount[0].count }}次。</font
+            >
           </el-form-item>
-          <el-form-item class="text-indent-2" >
-			<font v-if="bjyhcount[3].yhmx">其中以{{ bjyhcount[3].yhmx }}发生时长最长,为{{ bjyhcount[3].times }}分钟;</font>
-			<font v-if="bjyhcount[4].yhmx">{{ bjyhcount[4].yhmx }}次之,为{{ bjyhcount[4].yhmx }}分钟;</font>
-			<font v-if="bjyhcount[5].yhmx">{{ bjyhcount[5].yhmx }}第三,为{{ bjyhcount[5].yhmx }}分钟。</font>
+          <el-form-item class="text-indent-2">
+            <font v-if="bjyhcount[3].yhmx"
+              >其中以{{ bjyhcount[3].yhmx }}发生时长最长,为{{
+                bjyhcount[3].times
+              }}分钟;</font
+            >
+            <font v-if="bjyhcount[4].yhmx"
+              >{{ bjyhcount[4].yhmx }}次之,为{{
+                bjyhcount[4].yhmx
+              }}分钟;</font
+            >
+            <font v-if="bjyhcount[5].yhmx"
+              >{{ bjyhcount[5].yhmx }}第三,为{{
+                bjyhcount[5].yhmx
+              }}分钟。</font
+            >
           </el-form-item>
           <div class="logHead">部件隐患对比(次|分钟)</div>
           <el-table
@@ -346,7 +367,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2">故障分类:</el-form-item>
@@ -400,7 +421,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2"
@@ -440,7 +461,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2"
@@ -471,7 +492,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2">发电机:</el-form-item>
@@ -500,7 +521,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2"
@@ -529,7 +550,7 @@
           >
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2">齿轮箱:</el-form-item>
@@ -624,7 +645,7 @@
             <el-table-column prop="scz" label="实测值"></el-table-column>
             <el-table-column prop="df" label="得分"></el-table-column>
           </el-table>
- 
+
           <el-form-item class="imp fw text-indent-2">震动监测:</el-form-item>
           <el-form-item class="text-indent-2">时域分析分析法</el-form-item>
           <el-form-item class="text-indent-2"
@@ -650,7 +671,7 @@
           >
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2"
@@ -704,7 +725,7 @@
           </el-table>
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="imp fw text-indent-2"
@@ -751,7 +772,7 @@
               :label="sbklyls[0].date"
             ></el-table-column>
           </el-table>
- 
+
           <el-form-item class="imp fw text-indent-2"
             >2、设备可利用率</el-form-item
           >
@@ -835,7 +856,7 @@
           <div class="logHead">
             {{ datas.year }}年{{ datas.month }}月性能评价明细
           </div>
- 
+
           <table
             border="1"
             class="xnpjfx"
@@ -875,22 +896,30 @@
           </table>
         </el-form>
       </div>
- 
+
       <div class="textBox" v-if="Number(datas.isrecommend) == 1">
         <el-form>
           <el-form-item class="imp fw"><b>推荐检修方案</b></el-form-item>
           <el-form-item class="imp fw text-indent-2">故障预测</el-form-item>
           <el-form-item class="text-indent-4"
-            >高频:{{ datas.highfrequency ? datas.highfrequency : '暂无数据' }}</el-form-item
+            >高频:{{
+              datas.highfrequency ? datas.highfrequency : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="text-indent-4"
-            >中频:{{ datas.mediatefrequency ? datas.mediatefrequency : '暂无数据' }}</el-form-item
+            >中频:{{
+              datas.mediatefrequency ? datas.mediatefrequency : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="m-b-10 text-indent-4"
-            >低频:{{ datas.fowfrequency ? datas.fowfrequency : '暂无数据' }}</el-form-item
+            >低频:{{
+              datas.fowfrequency ? datas.fowfrequency : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="text-indent-2"
-            >推荐检修理由:{{ datas.reason ? datas.reason : '暂无数据' }}</el-form-item
+            >推荐检修理由:{{
+              datas.reason ? datas.reason : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="text-indent-2"
             >推荐检修日期:{{
@@ -898,13 +927,19 @@
             }}</el-form-item
           >
           <el-form-item class="text-indent-2"
-            >推荐排查方法:{{ datas.troublemethods ? datas.troublemethods : '暂无数据' }}</el-form-item
+            >推荐排查方法:{{
+              datas.troublemethods ? datas.troublemethods : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="text-indent-2"
-            >推荐处理方法:{{ datas.processingmethod ? datas.processingmethod : '暂无数据' }}</el-form-item
+            >推荐处理方法:{{
+              datas.processingmethod ? datas.processingmethod : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="text-indent-2"
-            >推荐工具器:{{ datas.tools ? datas.tools : '暂无数据' }}</el-form-item
+            >推荐工具器:{{
+              datas.tools ? datas.tools : "暂无数据"
+            }}</el-form-item
           >
           <el-form-item class="text-indent-2"
             >平均消缺时长:{{
@@ -926,7 +961,7 @@
           >
         </el-form>
       </div>
- 
+
       <div class="textBox">
         <el-form>
           <el-form-item class="fw" style="margin: 10px 0; text-align: center"
@@ -1009,18 +1044,22 @@ export default {
         {
           title: "曲线偏差率",
           yAxisIndex: 0,
-          value: [{
+          value: [
+            {
               text: "1",
               value: 0,
-            }],
+            },
+          ],
         },
         {
           title: "基准值",
           yAxisIndex: 0,
-          value: [{
+          value: [
+            {
               text: "1",
               value: 0,
-            },],
+            },
+          ],
         },
       ],
       // 隐患部件频次统计
@@ -1120,7 +1159,7 @@ export default {
       xnpjmx: [],
       pjmxs: [],
       wttragetreportcharts: [],
- 
+
       zhrank: 2,
       // 维修换件频次
       wxhjpc: [
@@ -1619,7 +1658,7 @@ export default {
       reqData: {},
     };
   },
- 
+
   props: {
     show: {
       type: Boolean,
@@ -1631,14 +1670,13 @@ export default {
     },
   },
   created() {
-	  this.getReport();
+    this.getReport();
   },
   beforeUpdate() {
     var that = this;
     that.$nextTick(() => {
       that.others();
     });
-	
   },
   mounted() {
     this.dialogVisible = this.show;
@@ -1703,26 +1741,25 @@ export default {
         "健康评价报告概述"
       );
     },
- 
+
     // 关闭弹窗
     dialogClosed() {
       this.dialogVisible = false;
       this.$emit("closed", false);
     },
- 
+
     // 改变列颜色
     columnStyle({ row, column, rowIndex, columnIndex }) {
       if (columnIndex === 0) {
         return "background:rgb(204,255,255);";
       }
     },
- 
+
     // 获取报告详情
-    getReport(wtid,recorddate) {
-		console.log(this.params)
-		if(wtid == undefined){
-			return;
-		}
+    getReport(wtid, recorddate) {
+      if (wtid == undefined) {
+        return;
+      }
       let that = this;
       let reqData = this.params;
       that.API.requestData({
@@ -1731,18 +1768,17 @@ export default {
         baseURL: "http://10.155.32.4:8034/",
         subUrl: "/healthreport/healthReport",
         data: {
-    //       wtid: reqData.wtId,
-		  // date: reqData.recorddate,
+          //       wtid: reqData.wtId,
+          // date: reqData.recorddate,
           wtid: wtid,
           date: recorddate,
         }, // 请求所携带参数,默认为空,可缺省
         success(res) {
           if (res.code == 200) {
-			  console.log(res)
             that.datas = res.data;
             that.healthreport = res.data.healthreport;
             that.randomInitDate();
- 
+
             that.qxpcls = [];
             // 功率曲线拟合
             let glqxnh = [
@@ -1757,22 +1793,23 @@ export default {
                 value: [],
               },
             ];
-            res.data.healthreport.nhglqxs && res.data.healthreport.nhglqxs.forEach((item) => {
-              if (Number(item.speed) % 1 == 0) {
-                glqxnh[0].value.push({
-                  text: item.speed,
-                  value: item.bzgl,
-                });
-                glqxnh[1].value.push({
-                  text: item.speed,
-                  value: item.nhgl,
-                });
-              }
-            });
+            res.data.healthreport.nhglqxs &&
+              res.data.healthreport.nhglqxs.forEach((item) => {
+                if (Number(item.speed) % 1 == 0) {
+                  glqxnh[0].value.push({
+                    text: item.speed,
+                    value: item.bzgl,
+                  });
+                  glqxnh[1].value.push({
+                    text: item.speed,
+                    value: item.nhgl,
+                  });
+                }
+              });
             that.glqxnh = glqxnh;
- 
+
             //曲线偏差率
-	        that.qxpcls = [];
+            that.qxpcls = [];
             let qxpcls = [
               {
                 title: "曲线偏差率",
@@ -1785,23 +1822,25 @@ export default {
                 value: [],
               },
             ];
-			if(res.data.healthreport.qxpcls){
-				let qxpcl = res.data.healthreport.qxpcls.sort(that.compare("date"));
-				if (qxpcl != null && qxpcl != undefined) {
-				  for (var i = qxpcl.length - 1; i >= 0; i--) {
-				    qxpcls[0].value.push({
-				      text: new Date(qxpcl[i].date).formatDate("yyyy-MM-dd"),
-				      value: Number(qxpcl[i].qxpcl).toFixed(2),
-				    });
-				    qxpcls[1].value.push({
-				      text: new Date(qxpcl[i].date).formatDate("yyyy-MM-dd"),
-				      value: Number(qxpcl[i].jzz).toFixed(2),
-				    });
-				  }
-				  that.qxpcls = qxpcls;
-				}
-			}
- 
+            if (res.data.healthreport.qxpcls) {
+              let qxpcl = res.data.healthreport.qxpcls.sort(
+                that.compare("date")
+              );
+              if (qxpcl != null && qxpcl != undefined) {
+                for (var i = qxpcl.length - 1; i >= 0; i--) {
+                  qxpcls[0].value.push({
+                    text: new Date(qxpcl[i].date).formatDate("yyyy-MM-dd"),
+                    value: Number(qxpcl[i].qxpcl).toFixed(2),
+                  });
+                  qxpcls[1].value.push({
+                    text: new Date(qxpcl[i].date).formatDate("yyyy-MM-dd"),
+                    value: Number(qxpcl[i].jzz).toFixed(2),
+                  });
+                }
+                that.qxpcls = qxpcls;
+              }
+            }
+
             // 对风偏差
             that.dfpc = [];
             let dfpc = {
@@ -1827,29 +1866,32 @@ export default {
                 },
               ],
             };
-            res.data.healthreport.nipples && res.data.healthreport.nipples.forEach((item) => {
-              let obj = {
-                text: item.pcl,
-                value: item.count,
-              };
-              dfpc.nipples[0].value.push(obj);
-            });
-            res.data.healthreport.dfpclpowers && res.data.healthreport.dfpclpowers.forEach((item) => {
-              let obj = {
-                text: item.power,
-                value: item.dfpcl,
-              };
-              dfpc.dfpclpowers[0].value.push(obj);
-            });
-            res.data.healthreport.dfpclSpeeds && res.data.healthreport.dfpclSpeeds.forEach((item) => {
-              let obj = {
-                text: item.speed,
-                value: item.dfpcl,
-              };
-              dfpc.dfpclSpeeds[0].value.push(obj);
-            });
+            res.data.healthreport.nipples &&
+              res.data.healthreport.nipples.forEach((item) => {
+                let obj = {
+                  text: item.pcl,
+                  value: item.count,
+                };
+                dfpc.nipples[0].value.push(obj);
+              });
+            res.data.healthreport.dfpclpowers &&
+              res.data.healthreport.dfpclpowers.forEach((item) => {
+                let obj = {
+                  text: item.power,
+                  value: item.dfpcl,
+                };
+                dfpc.dfpclpowers[0].value.push(obj);
+              });
+            res.data.healthreport.dfpclSpeeds &&
+              res.data.healthreport.dfpclSpeeds.forEach((item) => {
+                let obj = {
+                  text: item.speed,
+                  value: item.dfpcl,
+                };
+                dfpc.dfpclSpeeds[0].value.push(obj);
+              });
             that.dfpc = dfpc;
- 
+
             // 部件隐患对比
             that.bjyhdbs = [];
             that.bjyhdbs = that.datas.healthreport.bjyhdbs;
@@ -1901,13 +1943,13 @@ export default {
                 }
                 if (that.yhmxdbs2.length == 3) break;
               }
- 
+
               // 部件隐患数据频次时长统计
               let ybmxdj1 = Object.assign([], ybmxdj);
               let ybmxdj2 = Object.assign([], ybmxdj);
               let array1 = ybmxdj1.sort(that.compare("count"));
               let array2 = ybmxdj2.sort(that.compare("times"));
-              if (array1.length > 0 && array2.length > 0){
+              if (array1.length > 0 && array2.length > 0) {
                 that.bjyhcount = [];
                 that.bjyhcount.push(array1[0]);
                 that.bjyhcount.push(array1[1]);
@@ -1919,14 +1961,15 @@ export default {
             }
             //切入切出对比
             that.qrqcs = [];
-            res.data.healthreport.qrqcs && res.data.healthreport.qrqcs.forEach((item) => {
-              item.xfqr = item.xfqr == null ? 0 : item.xfqr.toFixed(2);
-              item.xfqc = item.xfqc == null ? 0 : item.xfqc.toFixed(2);
-              item.dfqr = item.dfqr == null ? 0 : item.dfqr.toFixed(2);
-              item.dfqc = item.dfqc == null ? 0 : item.dfqc.toFixed(2);
-              that.qrqcs.push(item);
-            });
- 
+            res.data.healthreport.qrqcs &&
+              res.data.healthreport.qrqcs.forEach((item) => {
+                item.xfqr = item.xfqr == null ? 0 : item.xfqr.toFixed(2);
+                item.xfqc = item.xfqc == null ? 0 : item.xfqc.toFixed(2);
+                item.dfqr = item.dfqr == null ? 0 : item.dfqr.toFixed(2);
+                item.dfqc = item.dfqc == null ? 0 : item.dfqc.toFixed(2);
+                that.qrqcs.push(item);
+              });
+
             //设备可利用率
             let sbklyls = that.datas.healthreport.sbklyls;
             that.sbklyls = sbklyls;
@@ -1982,7 +2025,7 @@ export default {
               that.sbklyls2.push(sbklyls5);
               that.sbklyls2.push(sbklyls6);
               that.sbklyls2.push(sbklyls7);
- 
+
               // 风能利用率
               let fnlyl = that.datas.healthreport.fnlyls;
               let fnlyl1 = {
@@ -2049,55 +2092,56 @@ export default {
               that.fnlyls.push(fnlyl8);
               that.fnlyls.push(fnlyl9);
             }
- 
+
             // 故障分类
             that.faultclass = that.datas.healthreport.faultclass.sort(
               that.compare("monthwarningnum")
             );
- 
+
             // 功率对部件温度影响
             that.partwds = [];
             let partwds = that.datas.healthreport.partwds;
             let partwd = [];
-            partwds && partwds.forEach((item, i) => {
-              let bj = "";
-              if (item.part == "zk") {
-                bj = "主控";
-              } else if (item.part == "fdj") {
-                bj = "发电机";
-              } else if (item.part == "clx") {
-                bj = "齿轮箱";
-              } else if (item.part == "bj") {
-                bj = "变桨";
-              } else if (item.part.indexOf("ph")) {
-                bj = "偏航";
-              } else if (item.part == "bj") {
-                bj = "变桨";
-              } else if (item.part.indexOf("yy")) {
-                bj = "液压";
-              } else if (item.part.indexOf("cdl")) {
-                bj = "传动链";
-              } else if (item.part.indexOf("cf")) {
-                bj = "测风系统";
-              }
- 
-              partwd.push({
-                bj: bj,
-                wdcd: item.type,
-                min0: item.power == "0kw-150kw" ? item.value : 0,
-                min150: item.power == "150kw-300kw" ? item.value : 0,
-                min300: item.power == "300kw-450kw" ? item.value : 0,
-                min450: item.power == "450kw-600kw" ? item.value : 0,
-                min600: item.power == "600kw-750kw" ? item.value : 0,
-                min750: item.power == "750kw-900kw" ? item.value : 0,
-                min900: item.power == "900kw-1050kw" ? item.value : 0,
-                min1050: item.power == "1050kw-1200kw" ? item.value : 0,
-                min1200: item.power == "1200kw-1350kw" ? item.value : 0,
-                min1350: item.power == "1350kw-1500kw" ? item.value : 0,
+            partwds &&
+              partwds.forEach((item, i) => {
+                let bj = "";
+                if (item.part == "zk") {
+                  bj = "主控";
+                } else if (item.part == "fdj") {
+                  bj = "发电机";
+                } else if (item.part == "clx") {
+                  bj = "齿轮箱";
+                } else if (item.part == "bj") {
+                  bj = "变桨";
+                } else if (item.part.indexOf("ph")) {
+                  bj = "偏航";
+                } else if (item.part == "bj") {
+                  bj = "变桨";
+                } else if (item.part.indexOf("yy")) {
+                  bj = "液压";
+                } else if (item.part.indexOf("cdl")) {
+                  bj = "传动链";
+                } else if (item.part.indexOf("cf")) {
+                  bj = "测风系统";
+                }
+
+                partwd.push({
+                  bj: bj,
+                  wdcd: item.type,
+                  min0: item.power == "0kw-150kw" ? item.value : 0,
+                  min150: item.power == "150kw-300kw" ? item.value : 0,
+                  min300: item.power == "300kw-450kw" ? item.value : 0,
+                  min450: item.power == "450kw-600kw" ? item.value : 0,
+                  min600: item.power == "600kw-750kw" ? item.value : 0,
+                  min750: item.power == "750kw-900kw" ? item.value : 0,
+                  min900: item.power == "900kw-1050kw" ? item.value : 0,
+                  min1050: item.power == "1050kw-1200kw" ? item.value : 0,
+                  min1200: item.power == "1200kw-1350kw" ? item.value : 0,
+                  min1350: item.power == "1350kw-1500kw" ? item.value : 0,
+                });
               });
-            });
             that.partwds = partwd;
- 
+
             // 性能评价结果
             that.xnpjjg = [];
             let pjmxs = that.datas.healthreport.pjjgs;
@@ -2130,7 +2174,7 @@ export default {
                 that.xnpjjg.push(xnpj3);
               }
             }
- 
+
             // 评价结果明细
             that.xnpjmx = [];
             let pjmx = that.datas.healthreport.pjmxs[0];
@@ -2330,7 +2374,7 @@ export default {
                 ],
               },
             ];
- 
+
             // 部件劣化状态4张图表
             let fdj = [
                 {
@@ -2360,33 +2404,34 @@ export default {
                   value: [],
                 },
               ];
- 
-            res.data.healthreport.wttragetreportcharts && res.data.healthreport.wttragetreportcharts.forEach((item) => {
-              var recorddate = new Date(item.recorddate).formatDate(
-                "yyyy-MM-dd hh:mm"
-              );
-              if (item.partid === "fdj") {
-                fdj[0].value.push({
-                  text: recorddate,
-                  value: item.value,
-                });
-              } else if (item.partid == "clx") {
-                clx[0].value.push({
-                  text: recorddate,
-                  value: item.value,
-                });
-              } else if (item.partid == "zk") {
-                zk[0].value.push({
-                  text: recorddate,
-                  value: item.value,
-                });
-              } else if (item.partid == "bj") {
-                bj[0].value.push({
-                  text: recorddate,
-                  value: item.value,
-                });
-              }
-            });
+
+            res.data.healthreport.wttragetreportcharts &&
+              res.data.healthreport.wttragetreportcharts.forEach((item) => {
+                var recorddate = new Date(item.recorddate).formatDate(
+                  "yyyy-MM-dd hh:mm"
+                );
+                if (item.partid === "fdj") {
+                  fdj[0].value.push({
+                    text: recorddate,
+                    value: item.value,
+                  });
+                } else if (item.partid == "clx") {
+                  clx[0].value.push({
+                    text: recorddate,
+                    value: item.value,
+                  });
+                } else if (item.partid == "zk") {
+                  zk[0].value.push({
+                    text: recorddate,
+                    value: item.value,
+                  });
+                } else if (item.partid == "bj") {
+                  bj[0].value.push({
+                    text: recorddate,
+                    value: item.value,
+                  });
+                }
+              });
             that.wttragetreportcharts = {
               fdj: fdj,
               clx: clx,
@@ -2516,11 +2561,10 @@ export default {
       this.bjzb.push(obj14);
     },
   },
- 
+
   watch: {
     show(value) {
       this.dialogVisible = value;
-	  // console.log(value)
       // if (value) {
       //   this.datas();
       // }
@@ -2535,62 +2579,62 @@ export default {
 <style lang="less" scoped>
 .cDialog {
   position: relative;
- 
+
   .pdfDom {
     padding: 30px 50px;
   }
- 
+
   .title {
     text-align: center;
     font-size: 24px;
     font-weight: 700;
   }
- 
+
   .tableBox {
     width: 100%;
     display: flex;
     justify-content: space-between;
     align-items: center;
- 
+
     .l,
     .r {
       width: 49%;
       align-self: flex-start;
     }
- 
+
     .fw {
       font-weight: 700;
     }
   }
- 
+
   .infoBox {
     margin-top: 10px;
     font-size: 16px;
- 
+
     .red {
       color: #f25656;
     }
- 
+
     .purple {
       color: rgb(112, 88, 209);
     }
- 
+
     .info {
       color: #1595fa;
     }
- 
+
     p {
       text-indent: 2em;
     }
   }
- 
+
   .textBox {
     width: 100%;
     margin-top: 10px;
     font-size: 16px;
   }
 }
- 
+
 .logHead {
   display: flex;
   width: 100%;
@@ -2601,23 +2645,23 @@ export default {
   justify-content: center;
   margin-top: 15px;
 }
- 
+
 .border-b {
   border-bottom: 1px solid #c0ccda;
 }
- 
+
 .p-5 {
   padding: 5px;
 }
- 
+
 .m-b-10 {
   margin-bottom: 10px;
 }
- 
+
 .text-indent-2 {
   text-indent: 2em;
 }
- 
+
 .text-indent-4 {
   text-indent: 4em;
 }
@@ -2628,23 +2672,23 @@ export default {
   .cell {
     text-align: center;
   }
- 
+
   .el-dialog__body {
     max-height: 850px;
     overflow-y: scroll;
     padding: 0;
   }
- 
+
   .el-form-item.imp {
     .el-form-item__content {
       font-size: 24px;
     }
   }
- 
+
   .el-form-item {
     margin-bottom: 0;
   }
- 
+
   .el-table td {
     color: black;
   }

+ 13 - 2
src/store/index.js

@@ -8,7 +8,8 @@ const debug = process.env.NODE_ENV !== 'production';
 const state = {
   websocketTimeSec: 1000,
   loading: false, //全局 - 加载中....
-  themeName: "light", // 主题
+  themeName: localStorage.getItem("themeName") || "dark", // 主题
+  menuData: [],
   windturbineMap: {},
 };
 
@@ -22,6 +23,9 @@ const mutations = {
   },
   update(state, newData) {
     state.windturbineMap = newData.data
+  },
+  changeMenuData(state, newData) {
+    state.menuData = newData;
   }
 };
 
@@ -29,6 +33,12 @@ const actions = {
   getupdate(context, newData) {
     context.commit("update", newData);
   },
+  changeTheme(context, str) {
+    context.commit("changeTheme", str);
+  },
+  changeMenuData(context, str) {
+    context.commit("changeMenuData", str);
+  }
 };
 
 const getters = {
@@ -39,7 +49,8 @@ const getters = {
   themeName: state => state.themeName,
   asidez: state => state.z,
   mainy: state => state.y,
-  login: state => state.login
+  login: state => state.login,
+  menuData: state => state.menuData
 }
 
 export default createStore({

+ 3 - 49
src/views/Home/Home.vue

@@ -5,7 +5,7 @@
         <Row type="flex" class="weather">
           <Col :span="24">
             <com-panel
-              :title="tqmap.name || 'yc'"
+              :title="tqmap.name || '---'"
               :sub-title="nowTime + ' 实况'"
               icon="fa fa-map-marker"
             >
@@ -94,22 +94,6 @@
               : '日发电量'
           "
         >
-          <!-- <template v-slot:tools>
-            <div class="tools">
-              <div class="tool-block">
-                <div class="legend bg-green"></div>
-                <div class="legend-text">日发电量(单位:万kWh)</div>
-              </div>
-              <div class="tool-block">
-                <div class="legend bg-purple"></div>
-                <div class="legend-text">上网电量(单位:万kWh)</div>
-              </div>
-              <div class="tool-block">
-                <div class="legend bg-orange"></div>
-                <div class="legend-text">购网电量(单位:万kWh)</div>
-              </div>
-            </div>
-          </template> -->
           <template v-slot:default>
             <!-- 日发电量 -->
             <multiple-bar-chart
@@ -130,24 +114,6 @@
       </Col>
       <Col :span="12">
         <toolbar-panel title="72小时功率趋势图">
-          <!-- <template v-slot:tools>
-          <div class="tools">
-            <div class="tools">
-              <div class="tool-block">
-                <div class="legend long bg-green"></div>
-                <div class="legend-text">应发功率</div>
-              </div>
-              <div class="tool-block">
-                <div class="legend long bg-yellow"></div>
-                <div class="legend-text">实发功率</div>
-              </div>
-              <div class="tool-block">
-                <div class="legend long bg-purple"></div>
-                <div class="legend-text">理论功率</div>
-              </div>
-            </div>
-          </div>
-        </template> -->
           <template v-slot:default>
             <multiple-y-line-chart-normal
               height="100%"
@@ -189,12 +155,8 @@
                     {{ wpId === "0" ? "减排二氧化硫" : "年运行小时" }}
                   </td>
                   <td class="value green">
-                    <!-- {{ wpId === "0" ? jczbmap.jpeyhl  : gxkmap.nyxxs }} -->
                     {{ wpId === "0" ? jczbmap.jpeyhl : gxkmap.nyxxs }}
                   </td>
-                  <!-- <td class="unit gray">
-                    {{ wpId === "0" ? "万吨" : "小时" }}
-                  </td> -->
                   <td class="unit gray">
                     {{ wpId === "0" ? "吨" : "小时" }}
                   </td>
@@ -204,10 +166,8 @@
                     {{ wpId === "0" ? "减排二氧化碳" : "年等效可利用系数" }}
                   </td>
                   <td class="value green">
-                    <!-- {{ wpId === "0" ? jczbmap.jpeyht  : gxkmap.ndxkyss }} -->
                     {{ wpId === "0" ? jczbmap.jpeyht : gxkmap.ndxkyss }}
                   </td>
-                  <!-- <td class="unit gray">{{ wpId === "0" ? "万吨" : "%" }}</td> -->
                   <td class="unit gray">{{ wpId === "0" ? "吨" : "%" }}</td>
                 </tr>
                 <tr class="">
@@ -215,12 +175,8 @@
                     {{ wpId === "0" ? "节约用水" : "年故障小时" }}
                   </td>
                   <td class="value green">
-                    <!-- {{ wpId === "0" ? jczbmap.jys  : gxkmap.ngzxs }} -->
                     {{ wpId === "0" ? jczbmap.jys : gxkmap.ngzxs }}
                   </td>
-                  <!-- <td class="unit gray">
-                    {{ wpId === "0" ? "万吨" : "小时" }}
-                  </td> -->
                   <td class="unit gray">
                     {{ wpId === "0" ? "吨" : "小时" }}
                   </td>
@@ -230,12 +186,8 @@
                     {{ wpId === "0" ? "节约标煤" : "年待机小时" }}
                   </td>
                   <td class="value green">
-                    <!-- {{ wpId === "0" ? jczbmap.jybm  : gxkmap.ndjxs }} -->
                     {{ wpId === "0" ? jczbmap.jybm : gxkmap.ndjxs }}
                   </td>
-                  <!-- <td class="unit gray">
-                    {{ wpId === "0" ? "万吨" : "小时" }}
-                  </td> -->
                   <td class="unit gray">
                     {{ wpId === "0" ? "吨" : "小时" }}
                   </td>
@@ -846,6 +798,8 @@ import DoubleLineChart from "@com/chart/line/double-line-chart.vue";
 
 import Table from "./dialog/table.vue";
 
+import $ from "jquery";
+
 export default {
   name: "Home",
   components: {

Fichier diff supprimé car celui-ci est trop grand
+ 495 - 66
src/views/Home/components/map/svg-map-nx.vue


+ 0 - 1
src/views/Home/components/weather.vue

@@ -1,4 +1,3 @@
-// 天气分析
 <template>
   <div class="weather">
     <div class="weather-info">

+ 49 - 52
src/views/NewPages/alarm-center-gzfx.vue

@@ -1,32 +1,28 @@
 <template>
 	<div>
 		<el-row>
-			<el-col :span="14">
+			<el-col :span="24">
 				<panel :title="'日雷达图'" class="radar-panel" :icon="'svg-wind-site'">
 					<div class="wind-info">
-						<radar-chart :width="'100%'" :height="'729px'" :value="rzdfsData" />
+						<dual-pie-chart height="40vh" width='55vh' :innerData="rzdfsData" :outerData="rzdfsData" />
 					</div>
 				</panel>
 			</el-col>
-			<el-col :span="10">
-				<el-row>
-					<el-col :span="24">
-						<panel :title="'月雷达图'" class="radar-panel" :icon="'svg-wind-site'">
-							<div class="wind-info">
-								<radar-chart :width="'100%'" :height="'350px'" :value="yzdfsData" />
-							</div>
-						</panel>
-					</el-col>
-				</el-row>
-				<el-row>
-					<el-col :span="24">
-						<panel :title="'年雷达图'" class="radar-panel" :icon="'svg-wind-site'">
-							<div class="wind-info">
-								<radar-chart :width="'100%'" :height="'350px'" :value="nzdfsData" />
-							</div>
-						</panel>
-					</el-col>
-				</el-row>
+		</el-row>
+		<el-row>
+			<el-col :span="12">
+				<panel :title="'月雷达图'" class="radar-panel" :icon="'svg-wind-site'">
+					<div class="wind-info">
+						<dual-pie-chart height="32vh" width='55vh' :innerData="yzdfsData" :outerData="yzdfsData" />
+					</div>
+				</panel>
+			</el-col>
+			<el-col :span="12">
+				<panel :title="'年雷达图'" class="radar-panel" :icon="'svg-wind-site'">
+					<div class="wind-info">
+						<dual-pie-chart height="32vh" width='55vh' :innerData="nzdfsData" :outerData="nzdfsData" />
+					</div>
+				</panel>
 			</el-col>
 		</el-row>
 	</div>
@@ -34,11 +30,11 @@
 
 <script>
 	import panel from "@/components/coms/panel/panel.vue";
-	import RadarChart from "@/components/chart/radar/radar-chart.vue";
+	import DualPieChart from "@/components/chart/pie/dual-pie-chart.vue";
 	export default {
 		components: {
 			panel,
-			RadarChart
+			DualPieChart
 		},
 		props:{
 			date: {
@@ -52,18 +48,9 @@
 		},
 		data() {
 			return {
-				rzdfsData: {
-					indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
-					data: [{value: [44200, 14200, 20000, 35000, 50000, 38000],name: "",}, ],
-				},
-				yzdfsData: {
-					indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
-					data: [{value: [44200, 14200, 20000, 35000, 50000, 38000],name: "",}, ],
-				},
-				nzdfsData: {
-					indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
-					data: [{value: [44200, 14200, 20000, 35000, 50000, 38000],name: "",}, ],
-				},
+				rzdfsData: [],
+				yzdfsData: [],
+				nzdfsData: [],
 			}
 		},
 		created() {
@@ -74,31 +61,41 @@
 				var that = this;
 				that.API.requestData({
 					method: "GET",
-					subUrl: "radar/gzfx",
+					subUrl: "radar/yjfx",
 					showLoading:true,
 					data:{
-						stId:that.wpid,
-						Date:that.date
+						stationid:that.wpid,
+						date:that.date
 					},
 					success(res) {
-						let key = ['变桨','变频器','齿轮箱','发电机','风机其它','滑环','机舱加热','控制','冷却','偏航','液压','主轴'];
-						that.nzdfsData = {
-							indicator:key,
-							data:[{value:Object.values(res.data[0][0])}]
-						}
-						that.yzdfsData = {
-							indicator:key,
-							data:[{value:Object.values(res.data[1][0])}]
-						}
-						that.rzdfsData = {
-							indicator:key,
-							data:[{value:Object.values(res.data[2][0])}]
-						}
+						let key = ['测风系统','传动链','发电机','变桨系统','齿轮箱','液压系统','偏航系统','机舱','其它','塔底柜'];
+						let year = Object.values(res.data[0][0]),
+							month = Object.values(res.data[1][0]),
+							day = Object.values(res.data[2][0]);
+						let yearData = [],
+							monthData = [],
+							dayData = [];
+						key.forEach((ele,index)=>{
+							yearData.push({
+							  name: ele,
+							  value: parseFloat(year[index])
+							})
+							monthData.push({
+							  name: ele,
+							  value: parseFloat(month[index])
+							})
+							dayData.push({
+							  name: ele,
+							  value: parseFloat(day[index])
+							})
+						})
+						that.nzdfsData = yearData;
+						that.yzdfsData = monthData;
+						that.rzdfsData = dayData;
 					},
 				});
 			}
 		},
-
 	};
 </script>
 

+ 49 - 51
src/views/NewPages/alarm-center-yjfx.vue

@@ -1,32 +1,28 @@
 <template>
 	<div>
 		<el-row>
-			<el-col :span="14">
+			<el-col :span="24">
 				<panel :title="'日雷达图'" class="radar-panel" :icon="'svg-wind-site'">
 					<div class="wind-info">
-						<radar-chart :width="'100%'" :height="'729px'" :value="rzdfsData" />
+						<dual-pie-chart height="40vh" width='55vh' :innerData="rzdfsData" :outerData="rzdfsData" />
 					</div>
 				</panel>
 			</el-col>
-			<el-col :span="10">
-				<el-row>
-					<el-col :span="24">
-						<panel :title="'月雷达图'" class="radar-panel" :icon="'svg-wind-site'">
-							<div class="wind-info">
-								<radar-chart :width="'100%'" :height="'350px'" :value="yzdfsData" />
-							</div>
-						</panel>
-					</el-col>
-				</el-row>
-				<el-row>
-					<el-col :span="24">
-						<panel :title="'年雷达图'" class="radar-panel" :icon="'svg-wind-site'">
-							<div class="wind-info">
-								<radar-chart :width="'100%'" :height="'350px'" :value="nzdfsData" />
-							</div>
-						</panel>
-					</el-col>
-				</el-row>
+		</el-row>
+		<el-row>
+			<el-col :span="12">
+				<panel :title="'月雷达图'" class="radar-panel" :icon="'svg-wind-site'">
+					<div class="wind-info">
+						<dual-pie-chart height="30vh" width='55vh' :innerData="yzdfsData" :outerData="yzdfsData" />
+					</div>
+				</panel>
+			</el-col>
+			<el-col :span="12">
+				<panel :title="'年雷达图'" class="radar-panel" :icon="'svg-wind-site'">
+					<div class="wind-info">
+						<dual-pie-chart height="30vh" width='55vh' :innerData="nzdfsData" :outerData="nzdfsData" />
+					</div>
+				</panel>
 			</el-col>
 		</el-row>
 	</div>
@@ -34,11 +30,11 @@
 
 <script>
 	import panel from "@/components/coms/panel/panel.vue";
-	import RadarChart from "@/components/chart/radar/radar-chart.vue";
+	import DualPieChart from "@/components/chart/pie/dual-pie-chart.vue";
 	export default {
 		components: {
 			panel,
-			RadarChart
+			DualPieChart
 		},
 		props:{
 			date: {
@@ -52,18 +48,9 @@
 		},
 		data() {
 			return {
-				rzdfsData: {
-					indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
-					data: [{value: [44200, 14200, 20000, 35000, 50000, 38000],name: "",}, ],
-				},
-				yzdfsData: {
-					indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
-					data: [{value: [44200, 14200, 20000, 35000, 50000, 38000],name: "",}, ],
-				},
-				nzdfsData: {
-					indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
-					data: [{value: [44200, 14200, 20000, 35000, 50000, 38000],name: "",}, ],
-				},
+				rzdfsData: [],
+				yzdfsData: [],
+				nzdfsData: [],
 			}
 		},
 		created() {
@@ -74,26 +61,37 @@
 				var that = this;
 				that.API.requestData({
 					method: "GET",
-					subUrl: "radar/yjfx",
+					subUrl: "radar/gzfx",
 					showLoading:true,
 					data:{
-						stationid:that.wpid,
-						date:that.date
+						stId:that.wpid,
+						Date:that.date
 					},
 					success(res) {
-						let key = ['测风系统','传动链','发电机','变桨系统','齿轮箱','液压系统','偏航系统','机舱','其它','塔底柜'];
-						that.nzdfsData = {
-							indicator:key,
-							data:[{value:Object.values(res.data[0][0])}]
-						}
-						that.yzdfsData = {
-							indicator:key,
-							data:[{value:Object.values(res.data[1][0])}]
-						}
-						that.rzdfsData = {
-							indicator:key,
-							data:[{value:Object.values(res.data[2][0])}]
-						}
+						let key = ['变桨','变频器','齿轮箱','发电机','风机其它','滑环','机舱加热','控制','冷却','偏航','液压','主轴'];
+						let year = Object.values(res.data[0][0]),
+							month = Object.values(res.data[1][0]),
+							day = Object.values(res.data[2][0]);
+						let yearData = [],
+							monthData = [],
+							dayData = [];
+						key.forEach((ele,index)=>{
+							yearData.push({
+							  name: ele,
+							  value: parseFloat(year[index])
+							})
+							monthData.push({
+							  name: ele,
+							  value: parseFloat(month[index])
+							})
+							dayData.push({
+							  name: ele,
+							  value: parseFloat(day[index])
+							})
+						})
+						that.nzdfsData = yearData;
+						that.yzdfsData = monthData;
+						that.rzdfsData = dayData;
 					},
 				});
 			}

+ 63 - 11
src/views/NewPages/power-benchmarking.vue

@@ -17,7 +17,14 @@
           <div class="unit">万kWh</div>
         </div>
       </div>
-      <div class="static-items" style="flex: 0 0 860px">
+      <div
+        class="static-items"
+        :style="
+          $store.state.themeName === 'dark'
+            ? 'flex: 0 0 860px;transition: 0.2s;'
+            : ''
+        "
+      >
         <div class="static-items-title">
           <i class="svg-icon svg-icon-green">
             <svg-icon :svgid="'svg-flash'" />
@@ -84,7 +91,14 @@
           </div>
         </div>
       </div>
-      <div class="static-items" style="flex: 0 0 430px">
+      <div
+        class="static-items"
+        :style="
+          $store.state.themeName === 'dark'
+            ? 'flex: 0 0 430px;transition: 0.2s;'
+            : ''
+        "
+      >
         <div class="static-items-title">
           <i class="svg-icon svg-icon-green">
             <svg-icon :svgid="'svg-flash'" />
@@ -151,7 +165,14 @@
           </div>
         </div>
       </div>
-      <div class="static-items" style="flex: 0 0 430px">
+      <div
+        class="static-items"
+        :style="
+          $store.state.themeName === 'dark'
+            ? 'flex: 0 0 430px;transition: 0.2s;'
+            : ''
+        "
+      >
         <div class="static-items-title">
           <i class="svg-icon svg-icon-green">
             <svg-icon :svgid="'svg-flash'" />
@@ -285,6 +306,7 @@
           :height="'370px'"
           :elPaggingProps="null"
           @headerClick="headerClick"
+          ref="jjyxTableRef"
         ></group-table>
       </div>
       <div class="top-right">
@@ -427,37 +449,37 @@ export default {
               {
                 name: "风能利用率(%)",
                 field: "windenergy",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
               {
                 name: "限电损失率(%)",
                 field: "powerlossrate",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
               {
                 name: "性能损失率(%)",
                 field: "performancelossrate",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
               {
                 name: "综合厂用电率(%)",
                 field: "comprehensiverate",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
               {
                 name: "设备利用小时(小时)",
                 field: "utilizationhours",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
               {
                 name: "风功率预测准确率(%)",
                 field: "windpoweraccuracy",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
               {
                 name: "AGC曲线跟随率(%)",
                 field: "agccurvefollowing",
-                width: 55,
+                width: this.$store.state.themeName === "dark" ? 55 : 50,
               },
             ],
           },
@@ -529,6 +551,7 @@ export default {
         ],
         data: [],
       },
+      eltableDataBackup: {},
       greenTable: {
         column: [
           {
@@ -563,6 +586,13 @@ export default {
     this.requestDataTable("月");
     this.requestDataTop("月");
   },
+
+  mounted() {
+    this.$nextTick(() => {
+      this.eltableDataBackup = this.BASE.deepCopy(this.eltableData);
+      this.resetTableSize(this.$store.state.themeName);
+    });
+  },
   methods: {
     selectionClick(index) {
       this.selecttionIndex = index;
@@ -960,10 +990,28 @@ export default {
         item.expect = this.filter(shiji[key] - jizhun[key]);
       }
     },
-    // 保留小数位
+    // 保留小数位l
     filter(num) {
       return num % 1 === 0 ? num : num.toFixed(1);
     },
+    resetTableSize(themeName) {
+      this.$nextTick(() => {
+        this.eltableData.column.forEach((pEle, pIndex) => {
+          pEle.child.forEach((cEle, cIndex) => {
+            const width =
+              this.eltableDataBackup.column[pIndex].child[cIndex].width;
+            cEle.width = themeName === "dark" ? width : width - 1;
+          });
+        });
+        this.$refs?.jjyxTableRef?.$refs?.groupTable?.doLayout();
+      });
+    },
+  },
+
+  watch: {
+    "$store.state.themeName"(themeName) {
+      this.resetTableSize(themeName);
+    },
   },
 };
 </script>
@@ -1251,6 +1299,10 @@ export default {
       }
 
       .table {
+        .el-table__body table,
+        .el-table__header-wrapper table {
+          width: 100%;
+        }
         &.el-table thead tr:first-child th {
           background: fade(@gray, 40);
           border-bottom: 1px solid #0b1010;

+ 29 - 41
src/views/NewPages/znzhfx.vue

@@ -16,46 +16,34 @@
       </el-row>
       <div class="mg-b-16 anliz-des">
         <div>
-          本月{{ wtId }}号风机风机设备利用小时数{{
-            tableVal.byzb && tableVal.byzb.lyxs
-          }}小时、同比{{
-            tableVal.tpzb && tableVal.tpzb.lyxs
-          }}小时,设备可利用率{{
-            tableVal.byzb && tableVal.byzb.sbklyl
-          }}%、同比{{ tableVal.tpzb && tableVal.tpzb.sbklyl }}}%,
-          等效可用系数{{ tableVal.byzb && tableVal.byzb.dxklyxs }}%、同比{{
-            tableVal.tpzb && tableVal.tpzb.dxklyxs
-          }}}%,静风频率达到{{ tableVal.byzb && tableVal.byzb.jfpl }}%、同比{{
-            tableVal.tpzb && tableVal.tpzb.jfpl
-          }}}%, 机组功率特性一致性系数达到{{
-            tableVal.byzb && tableVal.byzb.glyzxxs
-          }}%、同比{{ tableVal.tpzb && tableVal.tpzb.glyzxxs }}}%。
-          <br />
-          {{ wtId }}风机{{ year }}年{{ month }}月平均风速{{
-            tableVal.byzb && tableVal.byzb.fs
-          }}m/s、同比{{ tableVal.tpzb && tableVal.tpzb.fs }}m/s,
-          小风平均切入风速{{ tableVal.byzb && tableVal.byzb.xfqr }}m/s、同比{{
-            tableVal.tpzb && tableVal.tpzb.xfqr
-          }}m/s, 有效风时数{{
-            tableVal.byzb && tableVal.byzb.yxfss
-          }}小时、同比{{ tableVal.tpzb && tableVal.tpzb.yxfss }}小时,
-          实际发电电量{{ tableVal.byzb && tableVal.byzb.fdl }}万kwh、同比{{
-            tableVal.tpzb && tableVal.tpzb.fdl
-          }}万kwh,同比增长率{{ tableVal.tbzb && tableVal.tbzb.fdl }}%,
-          各项损失电量累计{{
-            tableVal.byzb && tableVal.byzb.llfdl - tableVal.byzb.fdl
-          }}万kwh、同比{{
-            tableVal.tpzb && tableVal.tpzb.llfdl - tableVal.tpzb.fdl
-          }}万kwh,同比增长率{{
-            tableVal.tbzb && tableVal.byzb.llfdl - tableVal.tbzb.fdl
-          }}%, 理论发电量{{
-            tableVal.byzb && tableVal.byzb.llfdl
-          }}万kwh,实际发电量与理论发电量相差{{
-            tableVal.tbzb && tableVal.tbzb.llfdl
-          }}万kwh。
-          <br />
-          本月静风频率
-          %,月累计静风时长0.00小时,月累计待机小时116.44小时,待机占比48.51%。
+          本月{{ wtId }}号风机风机设备利用小时数{{ tableVal.byzb && tableVal.byzb.lyxs }}小时、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.lyxs }}小时,
+          		设备可利用率{{ tableVal.byzb && tableVal.byzb.sbklyl }}%、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.sbklyl }}%;
+          		等效可用系数{{ tableVal.byzb && tableVal.byzb.dxklyxs }}%、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.dxklyxs }}%;
+          		静风频率达到{{ tableVal.byzb && tableVal.byzb.jfpl }}%、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.jfpl }}%;
+          		机组功率特性一致性系数达到{{ tableVal.byzb && tableVal.byzb.glyzxxs }}%、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.glyzxxs }}%。 <br />
+            {{ wtId }}风机{{ year }}年{{ month }}
+          		月平均风速{{ tableVal.byzb && tableVal.byzb.fs }}m/s、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.fs }}m/s;
+            小风平均切入风速{{ tableVal.byzb && tableVal.byzb.xfqr }}m/s、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.xfqr }}m/s;
+          		有效风时数{{ tableVal.byzb && tableVal.byzb.yxfss }}小时、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.yxfss }}小时;
+          		实际发电电量{{ tableVal.byzb && tableVal.byzb.fdl }}万kwh、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.fdl }}万kwh,
+          		同比增长率{{ tableVal.tbzb && (tableVal.tbzb.fdl).toFixed(2) }}%;
+          		各项损失电量累计{{ tableVal.byzb && (tableVal.byzb.llfdl - tableVal.byzb.fdl).toFixed(2) }}万kwh、
+          		同比{{ tableVal.tqzb && tableVal.tqzb.llfdl - tableVal.tqzb.fdl }}万kwh,
+          		同比增长率{{ tableVal.tbzb && (tableVal.byzb.llfdl - tableVal.tbzb.fdl).toFixed(2) }}%;
+          		理论发电量{{ tableVal.byzb && tableVal.byzb.llfdl }}万kwh,
+          		实际发电量与理论发电量相差{{ tableVal.tbzb && tableVal.tbzb.llfdl }}万kwh。 <br />
+            本月静风频率{{ tableVal.byzb && tableVal.byzb.jfpl }}%,
+			<!-- 月累计静风时长0.00小时, -->
+			月累计待机小时{{ tableVal.byzb && tableVal.byzb.tjxs }}小时,待机占比{{ tableVal.byzb && tableVal.tqzb.tjxs }}%。
         </div>
       </div>
       <div class="mg-b-16">
@@ -381,7 +369,7 @@ export default {
           month: this.month,
         },
       });
-      console.warn(data.data);
+      console.log(data.data);
       const res = data.data;
       this.tableVal = data.data;
       console.warn(this.tableVal);

+ 149 - 50
src/views/Others/index.vue

@@ -1,16 +1,31 @@
 <template>
   <div class="swiperBox">
-    <el-carousel style="width: 100%; margin: 5vh 0" trigger="click" type="card" height="80vh" :autoplay="false" indicator-position="none" :initial-index="1" arrow="none" @change="changeSwiper">
+    <el-carousel
+      style="width: 100%; margin: 5vh 0"
+      trigger="click"
+      type="card"
+      height="80vh"
+      :autoplay="false"
+      indicator-position="none"
+      :initial-index="1"
+      arrow="none"
+      @change="changeSwiper"
+    >
       <!-- card-1 -->
-      <el-carousel-item style="padding: 20px; background: rgb(4, 12, 11)">
+      <el-carousel-item :style="$store.state.themeName === 'dark' ? 'padding: 20px; background: rgb(4, 12, 11)' : 'padding: 20px; background: #fff'">
         <div class="itemBox">
-          <p class="itemTitle">
-            记录查询
-          </p>
+          <p class="itemTitle">记录查询</p>
           <div class="df-table">
-            <div class="sjcx-item" v-for="item in earlyAlarmColumn" :key="item" @click="jumpUrl(item.url)">
-              <div class="sjcx-name">{{item.name}}</div>
-              <div class="sjcx-value">{{earlyAlarmData[item.key] || '0'}}</div>
+            <div
+              class="sjcx-item"
+              v-for="item in earlyAlarmColumn"
+              :key="item"
+              @click="jumpUrl(item.url)"
+            >
+              <div class="sjcx-name">{{ item.name }}</div>
+              <div class="sjcx-value">
+                {{ earlyAlarmData[item.key] || "0" }}
+              </div>
             </div>
           </div>
         </div>
@@ -18,7 +33,7 @@
 
       <!-- card-2 -->
 
-      <el-carousel-item style="padding: 20px; background: rgb(4, 12, 11)">
+      <el-carousel-item :style="$store.state.themeName === 'dark' ? 'padding: 20px; background: rgb(4, 12, 11)' : 'padding: 20px; background: #fff'">
         <div class="itemBox">
           <p class="itemTitle">
             报表管理
@@ -26,42 +41,68 @@
           </p>
           <div class="imageBox1">
             <div class="imgItem1" @click="jumpUrl('/others/tjfx')">
-              <el-image class="img1" src="./static/img/o统计分析.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o统计分析.png"
+                fit="fill"
+              />
               <p class="imgTitle">统计分析</p>
             </div>
             <div class="imgItem1" @click="jumpUrl('/others/bdzcx')">
-              <el-image class="img1" src="./static/img/o表底值查询.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o表底值查询.png"
+                fit="fill"
+              />
               <p class="imgTitle">表底值查询</p>
             </div>
             <div class="imgItem1" @click="jumpUrl('/others/xnyrb')">
-              <el-image class="img1" src="./static/img/o新能源日报.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o新能源日报.png"
+                fit="fill"
+              />
               <p class="imgTitle">新能源日报</p>
             </div>
             <div class="imgItem1" @click="jumpUrl('/others/xnyfdscyb')">
-              <el-image class="img1" src="./static/img/o新能源月报.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o新能源月报.png"
+                fit="fill"
+              />
               <p class="imgTitle">新能源风电生产月报</p>
             </div>
             <div class="imgItem1" @click="jumpUrl('/others/fdczzdy')">
-              <el-image class="img1" src="./static/img/o风场自定义.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o风场自定义.png"
+                fit="fill"
+              />
               <p class="imgTitle">风电场站自定义</p>
             </div>
             <div class="imgItem1" @click="jumpUrl('/others/fdxmzdy')">
-              <el-image class="img1" src="./static/img/o风电自定义.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o风电自定义.png"
+                fit="fill"
+              />
               <p class="imgTitle">风电项目自定义</p>
             </div>
           </div>
         </div>
       </el-carousel-item>
       <!-- card-3 -->
-      <el-carousel-item style="padding: 20px; background: rgb(4, 12, 11)">
+      <el-carousel-item :style="$store.state.themeName === 'dark' ? 'padding: 20px; background: rgb(4, 12, 11)' : 'padding: 20px; background: #fff'">
         <div class="itemBox">
-          <p class="itemTitle">
-            数据查询
-          </p>
+          <p class="itemTitle">数据查询</p>
           <div class="df-table" @click="jumpUrl('/others/realSearch')">
-            <div class="sjcx-item" v-for="(value, key) in wppointColumn" :key="key">
-              <div class="sjcx-name">{{value}}</div>
-              <div class="sjcx-value">{{wppointnum[key]}}</div>
+            <div
+              class="sjcx-item"
+              v-for="(value, key) in wppointColumn"
+              :key="key"
+            >
+              <div class="sjcx-name">{{ value }}</div>
+              <div class="sjcx-value">{{ wppointnum[key] }}</div>
             </div>
           </div>
         </div>
@@ -92,35 +133,74 @@
           </div>
         </div>
       </el-carousel-item> -->
-      <el-carousel-item style="padding: 20px; background: rgb(4, 12, 11)">
+      <el-carousel-item :style="$store.state.themeName === 'dark' ? 'padding: 20px; background: rgb(4, 12, 11)' : 'padding: 20px; background: #fff'">
         <div class="itemBox">
           <p class="itemTitle">
             专家知识
             <!-- <i class="itemMoreBtn el-icon-more" @click="jumpUrl('/realSearch')"></i> -->
           </p>
           <div class="imageBox1">
-            <div class="imgItem1" @click="jumpUrl('/others/knowledge/knowledge')">
-              <el-image class="img1" src="./static/img/o故障体系.png" fit="fill" />
+            <div
+              class="imgItem1"
+              @click="jumpUrl('/others/knowledge/knowledge')"
+            >
+              <el-image
+                class="img1"
+                src="./static/img/o故障体系.png"
+                fit="fill"
+              />
               <p class="imgTitle">故障体系</p>
             </div>
-            <div class="imgItem1" @click="jumpUrl('/others/knowledge/knowledge7')">
-              <el-image class="img1" src="./static/img/o预警知识.png" fit="fill" />
+            <div
+              class="imgItem1"
+              @click="jumpUrl('/others/knowledge/knowledge7')"
+            >
+              <el-image
+                class="img1"
+                src="./static/img/o预警知识.png"
+                fit="fill"
+              />
               <p class="imgTitle">预警知识</p>
             </div>
-            <div class="imgItem1" @click="jumpUrl('/others/knowledge/knowledge5')">
-              <el-image class="img1" src="./static/img/o特征参数.png" fit="fill" />
+            <div
+              class="imgItem1"
+              @click="jumpUrl('/others/knowledge/knowledge5')"
+            >
+              <el-image
+                class="img1"
+                src="./static/img/o特征参数.png"
+                fit="fill"
+              />
               <p class="imgTitle">特征参数</p>
             </div>
-            <div class="imgItem1" @click="jumpUrl('/others/knowledge/knowledge6')">
-              <el-image class="img1" src="./static/img/o检修方案.png" fit="fill" />
+            <div
+              class="imgItem1"
+              @click="jumpUrl('/others/knowledge/knowledge6')"
+            >
+              <el-image
+                class="img1"
+                src="./static/img/o检修方案.png"
+                fit="fill"
+              />
               <p class="imgTitle">排查、检修方案</p>
             </div>
-            <div class="imgItem1" @click="jumpUrl('/health/gzzd/malfunctionDiagnose')">
-              <el-image class="img1" src="./static/img/o评价体系.png" fit="fill" />
+            <div
+              class="imgItem1"
+              @click="jumpUrl('/health/gzzd/malfunctionDiagnose')"
+            >
+              <el-image
+                class="img1"
+                src="./static/img/o评价体系.png"
+                fit="fill"
+              />
               <p class="imgTitle">评价体系</p>
             </div>
             <div class="imgItem1" @click="jumpUrl('/health/frist')">
-              <el-image class="img1" src="./static/img/o人工智能.png" fit="fill" />
+              <el-image
+                class="img1"
+                src="./static/img/o人工智能.png"
+                fit="fill"
+              />
               <p class="imgTitle">人工智能</p>
             </div>
           </div>
@@ -183,7 +263,7 @@ export default {
           url: "/others/alarmCenter/alarmcenter",
         },
         { name: "操作记录", key: "cz", url: "/others/alarmCenter/czjl" },
-		{ name: "光伏告警", key: "gfgj", url: "/others/alarmCenter/gfgj" },
+        { name: "光伏告警", key: "gfgj", url: "/others/alarmCenter/gfgj" },
       ],
       tableData1: {
         column: [
@@ -289,6 +369,7 @@ export default {
         ],
         data: [],
       },
+      swiperIndex: 1,
     };
   },
 
@@ -297,22 +378,32 @@ export default {
     // 切换走马灯,并重新渲染样式
     changeSwiper(index) {
       this.$nextTick(() => {
+        const themeName = this.$store.state.themeName;
         const swiperDom = $(".swiperBox .el-carousel__item");
-        swiperDom
-          .eq(index)
-          .css({ background: "rgb(4, 12, 11)", border: "1px solid #05bb4c" });
+        swiperDom.eq(index).css({
+          background: themeName === "dark" ? "rgb(4, 12, 11)" : "#fff",
+          border:
+            themeName === "dark" ? "1px solid #05bb4c" : "1px solid #36348e",
+        });
         for (let i = 0; i < swiperDom.length; i++) {
           if (i !== index) {
-            swiperDom.eq(i).find(".el-carousel__mask").css({
-              background: "rgb(4, 12, 11)",
-            });
+            swiperDom
+              .eq(i)
+              .find(".el-carousel__mask")
+              .css({
+                background: themeName === "dark" ? "rgb(4, 12, 11)" : "#fff",
+              });
             swiperDom.eq(i).css({
-              background: "rgb(4, 12, 11)",
-              border: "1px solid rgba(5, 187, 76, 0.5)",
+              background: themeName === "dark" ? "rgb(4, 12, 11)" : "#fff",
+              border:
+                themeName === "dark"
+                  ? "1px solid rgba(5, 187, 76, 0.5)"
+                  : "1px solid rgba(57, 54, 143, 0.5)",
             });
           }
         }
       });
+      this.swiperIndex = index;
     },
 
     // 页面跳转
@@ -360,7 +451,6 @@ export default {
         },
       ];
       that.tableData1.data = tableArr1;
-      console.log("tableData1:", that.tableData1);
 
       let tableArr2 = [
         {
@@ -393,7 +483,6 @@ export default {
         },
       ];
       that.tableData2.data = tableArr2;
-      console.log("tableData2:", that.tableData2);
 
       let tableArr3 = [
         {
@@ -433,7 +522,6 @@ export default {
         },
       ];
       that.tableData3.data = tableArr3;
-      console.log("tableData3:", that.tableData3);
 
       let tableArr4 = [
         {
@@ -458,7 +546,6 @@ export default {
         },
       ];
       that.tableData4.data = tableArr4;
-      console.log("tableData4:", that.tableData4);
     },
     getWppointnum() {
       const that = this;
@@ -487,14 +574,26 @@ export default {
   mounted() {
     let that = this;
     this.$nextTick(() => {
-      this.changeSwiper(1);
+      setTimeout(() => {
+        this.changeSwiper(1);
+      }, 200);
     });
     that.getTableData();
-    this.getWppointnum();
-    this.getEarlyAlarmData();
+    that.getWppointnum();
+    that.getEarlyAlarmData();
   },
 
   unmounted() {},
+
+  watch: {
+    "$store.state.themeName"() {
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.changeSwiper(this.swiperIndex, 222);
+        }, 200);
+      });
+    },
+  },
 };
 </script>
 

+ 3 - 3
src/views/SandTable/SandTable.vue

@@ -140,7 +140,7 @@
         </template>
       </PanelSandToolbar>
     </div>
-    <div class="sand-table-bottom" v-if="showPanel">
+    <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)"
@@ -1191,10 +1191,10 @@ export default {
 
   .sand-table-bottom {
     position: absolute;
-    right: calc(50vw - 545px);
     bottom: 0;
     z-index: 2;
     display: flex;
+    transform: 0.2s;
 
     .stb-p {
       margin-left: 0.926vh;
@@ -1212,10 +1212,10 @@ export default {
 
     .sand-table-bottom {
       position: absolute;
-      right: calc(50vw - 545px);
       bottom: 0;
       z-index: 2;
       display: flex;
+      transition: 0.2s;
     }
 
     .mask {

+ 32 - 22
src/views/WindSite/pages/Info/Info.vue

@@ -144,28 +144,38 @@ export default {
         },
         success(res) {
           let WindSites = [];
-
-          res.data.forEach((ele, index) => {
-            WindSites.push({
-              id: String(index),
-              text: ele.wpName,
-              children: [],
-            });
-          });
-
-          res.data.forEach((pEle, pIndex) => {
-            pEle.fjls[0].forEach((cEle) => {
-              WindSites[pIndex].children.push({
-                id: cEle.wtId,
-                wpId: cEle.wpId,
-                text: cEle.wtnum,
-                color: that.getColor(cEle.fjzt),
-              });
-            });
-          });
-
-          that.WindSites = WindSites;
-
+		if(that.WindSites.length){
+			res.data.forEach((pEle, pIndex) => {
+				that.WindSites[pIndex].children = [];
+			  pEle.fjls[0].forEach((cEle) => {
+			    that.WindSites[pIndex].children.push({
+			      id: cEle.wtId,
+			      wpId: cEle.wpId,
+			      text: cEle.wtnum,
+			      color: that.getColor(cEle.fjzt),
+			    });
+			  });
+			});
+		}else{
+			res.data.forEach((ele, index) => {
+			  WindSites.push({
+			    id: String(index),
+			    text: ele.wpName,
+			    children: [],
+			  });
+			});
+			res.data.forEach((pEle, pIndex) => {
+			  pEle.fjls[0].forEach((cEle) => {
+			    WindSites[pIndex].children.push({
+			      id: cEle.wtId,
+			      wpId: cEle.wpId,
+			      text: cEle.wtnum,
+			      color: that.getColor(cEle.fjzt),
+			    });
+			  });
+			});
+			that.WindSites = WindSites;
+		}
           if (res.data.length) {
             that.wtId = that.wtId || res.data[0].fjls[0][0].wtId;
             that.getWtInfo();

+ 1 - 1
src/views/WindSite/pages/Map.vue

@@ -42,7 +42,7 @@
         </div>
         <div class="sub-title-item">
           <img src="../../../assets/map/fan/black.png" />
-          <span class="sub-title gray">离线台数{{wpId}}</span>
+          <span class="sub-title gray">离线台数</span>
           <span class="sub-count font-num gray">{{ wpnumMap.lxts }}</span>
         </div>
       </div>

+ 106 - 45
src/views/layout/Header.vue

@@ -1,11 +1,13 @@
 <template>
   <div class="header-menu">
     <ul class="header-menu-list">
-      <li class="header-menu-item"
-          v-for="(menu, index) of menus"
-          :key="menu"
-          @click="click(index, menu)"
-          :class="{ active: activeIndex == index }">
+      <li
+        class="header-menu-item"
+        v-for="(menu, index) of menus"
+        :key="menu"
+        @click="click(index, menu)"
+        :class="{ active: activeIndex == index }"
+      >
         {{ menu.text }}
       </li>
     </ul>
@@ -18,33 +20,64 @@
       </ul>
     </ul> -->
     <ul class="header-menu-user">
-      <li class="header-menu-user-title"><i class="fa fa-user"></i>白玉杰</li>
+      <li class="header-menu-user-title">
+        <span class="el-dropdown-link"> <i class="fa fa-user"></i>白玉杰 </span>
+        <el-dropdown
+          size="small"
+          trigger="hover"
+          :hide-on-click="true"
+          v-if="false"
+        >
+          <span class="el-dropdown-link">
+            <i class="fa fa-user"></i>白玉杰
+          </span>
+          <template #dropdown>
+            <el-dropdown-menu :class="$store.state.themeName + ' curDropdown'">
+              <el-dropdown-item>
+                <el-switch
+                  size="small"
+                  active-color="rgb(57, 54, 143)"
+                  inactive-color="#05bb4c"
+                  active-text="亮色主题"
+                  inactive-text="暗色主题"
+                  v-model="themeName"
+                  @change="changeTheme()"
+                />
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </li>
     </ul>
   </div>
 </template>
 <script>
+import $ from "jquery";
+// import store from '@store/index';
+
 export default {
   data() {
     return {
+      themeName: false,
       menus: [
         {
-          id: 'monitor',
-          text: '驾驶舱',
-          path: '/monitor/home',
-          isActive: true
+          id: "monitor",
+          text: "驾驶舱",
+          path: "/monitor/home",
+          isActive: true,
         },
         {
-          id: 'decision',
-          text: '经济运行',
-          path: '/decision/pb',
-          isActive: false
+          id: "decision",
+          text: "经济运行",
+          path: "/decision/pb",
+          isActive: false,
         },
         {
-          id: 'health',
-          text: '智慧检修',
+          id: "health",
+          text: "智慧检修",
           // path: '/sandtable',
-          path: '/health/sandtable',
-          isActive: false
+          path: "/health/sandtable",
+          isActive: false,
         },
         // {
         //   id: "decision",
@@ -53,10 +86,10 @@ export default {
         //   isActive: false,
         // },
         {
-          id: 'save',
-          text: '安全管控',
-          path: '/save',
-          isActive: false
+          id: "save",
+          text: "安全管控",
+          path: "/save",
+          isActive: false,
         },
         // {
         //   id: "znbb",
@@ -65,13 +98,13 @@ export default {
         //   isActive: false,
         // },
         {
-          id: 'others',
-          text: '其他',
-          path: '/others',
-          isActive: false
-        }
+          id: "others",
+          text: "其他",
+          path: "/others",
+          isActive: false,
+        },
       ],
-      activeIndex: 0
+      activeIndex: 0,
       // menusDropdown: [
       //   {
       //     text: "子菜单1",
@@ -87,39 +120,67 @@ export default {
       //   },
       // ],
       // dropdown: false,
-    }
+      firsttime: 0,
+    };
+  },
+  mounted() {
+    let that = this;
+    $(document).keydown((event) => {
+      if (event.keyCode == 67) {
+        // c
+        let firstDate = new Date();
+        if (that.firsttime == 0) {
+          that.firsttime = firstDate.getTime();
+        } else {
+          var lastDate = new Date();
+          var lastTime = lastDate.getTime();
+          if (lastTime - that.firsttime < 1000) {
+            that.changeTheme();
+            that.firsttime = 0;
+          }
+        }
+      }
+    });
   },
   methods: {
     click(index, data) {
-      this.activeIndex = index
-      this.$router.push(data.path)
+      this.activeIndex = index;
+      this.$router.push(data.path);
     },
     clickSubMenu(index, code) {
-      console.log(index, code)
+      // console.log(index, code);
     },
     clickMenu() {
-      this.dropdown = !this.dropdown
-    }
+      this.dropdown = !this.dropdown;
+    },
+    changeTheme() {
+      $("#appBody").toggleClass("dark light");
+      this.$store.dispatch("changeTheme", $("#appBody").attr("class"));
+      this.$store.state.themeName === "dark"
+        ? (this.themeName = false)
+        : (this.themeName = true);
+      localStorage.setItem("themeName", this.$store.state.themeName);
+    },
   },
   computed: {
     activeClass(data) {
-      return data.isActive ? 'active' : ''
-    }
+      return data.isActive ? "active" : "";
+    },
   },
   watch: {
     $route: {
-      handler: function(val, oldVal) {
+      handler: function (val, oldVal) {
         this.menus.some((t, index) => {
           if (val.path.includes(t.id)) {
-            this.activeIndex = index
+            this.activeIndex = index;
           }
-        })
+        });
       },
       //深度观察监听
-      deep: true
-    }
-  }
-}
+      deep: true,
+    },
+  },
+};
 </script>
 
 <style lang="less">
@@ -156,7 +217,7 @@ export default {
         transition: color 0.2s ease-in-out;
 
         &::after {
-          content: '';
+          content: "";
           position: absolute;
           width: 100%;
           height: 0.463vh;
@@ -213,7 +274,7 @@ export default {
         background-color: fade(@write, 5%);
 
         &::after {
-          content: '';
+          content: "";
           position: absolute;
           width: 100%;
           height: 0.463vh;

+ 7 - 1
src/views/layout/Menu.vue

@@ -35,7 +35,12 @@
       </li>
     </ul>
   </div>
-  <div class="sub-menu" v-show="isShowSubMenu" @mouseleave="subMenuHide">
+  <div
+    class="sub-menu"
+    v-show="isShowSubMenu"
+    @mouseleave="subMenuHide"
+    v-if="$store.state.themeName === 'dark'"
+  >
     <ul class="menu-list">
       <li
         class="menu-item"
@@ -1053,6 +1058,7 @@ export default {
       let data = this.menuData.filter((t) => {
         return t.id == this.currRoot;
       })[0].data;
+      this.$store.dispatch("changeMenuData", data);
       return data;
     },
   },

+ 1 - 46
src/views/singleAnalysis/index.vue

@@ -51,23 +51,13 @@
       </ComTable>
     </div>
     <el-dialog
-      title="切入切出风速整合历史"
-      v-model="dialogShow"
-      width="85%"
-      top="10vh"
-      custom-class="modal"
-      :close-on-click-modal="true"
-      @closed="dialogType = ''"
-    >
-      test
-    </el-dialog>
-    <el-dialog
       :title="wtId + '号风机' + year + '年' + month + '月运行指标性能分析'"
       v-model="dialogVisible"
       width="70%"
       top="10vh"
       custom-class="modal"
       :close-on-click-modal="false"
+	  :destroy-on-close='true'
     >
       <ZnzhFx :wtId="wtId" :year="year" :month="month" />
     </el-dialog>
@@ -101,7 +91,6 @@ export default {
       recorddate: new Date(new Date().getTime() - 3600 * 1000 * 24).formatDate(
         "yyyy-MM-dd"
       ),
-      dialogShow: false,
       tableDataEnd: [], //合计
       tableData: {
         column: [
@@ -228,18 +217,6 @@ export default {
             is_light: false,
             sortable: true,
           },
-          // {
-          //   name: "操作",
-          //   field: "",
-          //   is_num: false,
-          //   is_light: false,
-          //   template() {
-          // 			return "<el-button type='text' style='cursor: pointer;'>详情</el-button>";
-          // 	},
-          //   click(e, row){
-          //     that.getOutputspeedHistoryList(row)
-          //   }
-          // }
         ],
         data: [],
       },
@@ -300,28 +277,6 @@ export default {
         });
       }
     },
-
-    getOutputspeedHistoryList(item) {
-      let that = this;
-      that.API.requestData({
-        method: "POST",
-        subUrl: "outputspeed/outputspeedhistorylist",
-        data: {
-          wpId: item.windpowerstationid,
-          wtId: item.windturbineid,
-          beginDate: new Date().formatDate("yyyy-MM") + "-01",
-          endDate: new Date().formatDate("yyyy-MM-dd"),
-        },
-        success(res) {
-          res.data.forEach((ele) => {
-            ele.time = new Date(ele.recorddate).formatDate("yyyy-MM-dd");
-          });
-          that.tableHistoryData.data = res.data;
-          that.dialogShow = true;
-        },
-      });
-    },
-
     search() {
       this.getOutputSpeedList(this.wpId);
     },

+ 31 - 39
src/views/singleAnalysis/znzhfx.vue

@@ -28,45 +28,33 @@
     </el-row>
     <div class="mg-b-16 anliz-des">
       <div>
-        本月{{ wtId }}号风机风机设备利用小时数{{
-          tableVal.byzb && tableVal.byzb.lyxs
-        }}小时、同比{{
-          tableVal.tpzb && tableVal.tpzb.lyxs
-        }}小时,设备可利用率{{ tableVal.byzb && tableVal.byzb.sbklyl }}%、同比{{
-          tableVal.tpzb && tableVal.tpzb.sbklyl
-        }}%, 等效可用系数{{ tableVal.byzb && tableVal.byzb.dxklyxs }}%、同比{{
-          tableVal.tpzb && tableVal.tpzb.dxklyxs
-        }}%,静风频率达到{{ tableVal.byzb && tableVal.byzb.jfpl }}%、同比{{
-          tableVal.tpzb && tableVal.tpzb.jfpl
-        }}%, 机组功率特性一致性系数达到{{
-          tableVal.byzb && tableVal.byzb.glyzxxs
-        }}%、同比{{ tableVal.tpzb && tableVal.tpzb.glyzxxs }}%。
-        <br />
-        {{ wtId }}风机{{ year }}年{{ month }}月平均风速{{
-          tableVal.byzb && tableVal.byzb.fs
-        }}m/s、同比{{ tableVal.tpzb && tableVal.tpzb.fs }}m/s,
-        小风平均切入风速{{ tableVal.byzb && tableVal.byzb.xfqr }}m/s、同比{{
-          tableVal.tpzb && tableVal.tpzb.xfqr
-        }}m/s, 有效风时数{{ tableVal.byzb && tableVal.byzb.yxfss }}小时、同比{{
-          tableVal.tpzb && tableVal.tpzb.yxfss
-        }}小时, 实际发电电量{{
-          tableVal.byzb && tableVal.byzb.fdl
-        }}万kwh、同比{{ tableVal.tpzb && tableVal.tpzb.fdl }}万kwh,同比增长率{{
-          tableVal.tbzb && tableVal.tbzb.fdl
-        }}%, 各项损失电量累计{{
-          tableVal.byzb && tableVal.byzb.llfdl - tableVal.byzb.fdl
-        }}万kwh、同比{{
-          tableVal.tpzb && tableVal.tpzb.llfdl - tableVal.tpzb.fdl
-        }}万kwh,同比增长率{{
-          tableVal.tbzb && tableVal.byzb.llfdl - tableVal.tbzb.fdl
-        }}%, 理论发电量{{
-          tableVal.byzb && tableVal.byzb.llfdl
-        }}万kwh,实际发电量与理论发电量相差{{
-          tableVal.tbzb && tableVal.tbzb.llfdl
-        }}万kwh。
-        <br />
-        本月静风频率
-        %,月累计静风时长0.00小时,月累计待机小时116.44小时,待机占比48.51%。
+        本月{{ wtId }}号风机风机设备利用小时数{{ tableVal.byzb && tableVal.byzb.lyxs }}小时、
+		同比{{ tableVal.tqzb && tableVal.tqzb.lyxs }}小时,
+		设备可利用率{{ tableVal.byzb && tableVal.byzb.sbklyl }}%、
+		同比{{ tableVal.tqzb && tableVal.tqzb.sbklyl }}%;
+		等效可用系数{{ tableVal.byzb && tableVal.byzb.dxklyxs }}%、
+		同比{{ tableVal.tqzb && tableVal.tqzb.dxklyxs }}%;
+		静风频率达到{{ tableVal.byzb && tableVal.byzb.jfpl }}%、
+		同比{{ tableVal.tqzb && tableVal.tqzb.jfpl }}%;
+		机组功率特性一致性系数达到{{ tableVal.byzb && tableVal.byzb.glyzxxs }}%、
+		同比{{ tableVal.tqzb && tableVal.tqzb.glyzxxs }}%。 <br />
+        {{ wtId }}风机{{ year }}年{{ month }}
+		月平均风速{{ tableVal.byzb && tableVal.byzb.fs }}m/s、
+		同比{{ tableVal.tqzb && tableVal.tqzb.fs }}m/s;
+        小风平均切入风速{{ tableVal.byzb && tableVal.byzb.xfqr }}m/s、
+		同比{{ tableVal.tqzb && tableVal.tqzb.xfqr }}m/s;
+		有效风时数{{ tableVal.byzb && tableVal.byzb.yxfss }}小时、
+		同比{{ tableVal.tqzb && tableVal.tqzb.yxfss }}小时;
+		实际发电电量{{ tableVal.byzb && tableVal.byzb.fdl }}万kwh、
+		同比{{ tableVal.tqzb && tableVal.tqzb.fdl }}万kwh,
+		同比增长率{{ tableVal.tbzb && (tableVal.tbzb.fdl).toFixed(2) }}%;
+		各项损失电量累计{{ tableVal.byzb && (tableVal.byzb.llfdl - tableVal.byzb.fdl).toFixed(2) }}万kwh、
+		同比{{ tableVal.tqzb && tableVal.tqzb.llfdl - tableVal.tqzb.fdl }}万kwh,
+		同比增长率{{ tableVal.tbzb && (tableVal.byzb.llfdl - tableVal.tbzb.fdl).toFixed(2) }}%;
+		理论发电量{{ tableVal.byzb && tableVal.byzb.llfdl }}万kwh,
+		实际发电量与理论发电量相差{{ tableVal.tbzb && tableVal.tbzb.llfdl }}万kwh。 <br />
+        <!-- 月累计静风时长0.00小时, -->
+        月累计待机小时{{ tableVal.byzb && tableVal.byzb.tjxs }}小时,待机占比{{ tableVal.byzb && tableVal.tqzb.tjxs }}%。
       </div>
     </div>
     <div class="mg-b-16">
@@ -381,6 +369,9 @@ export default {
     // this.month = this.$route.params.month;
     this.search();
     this.searchChart();
+	while(true){
+		console.log()
+	}
   },
   filters: {
     tabrowfil(val) {
@@ -418,6 +409,7 @@ export default {
       console.warn(data.data);
       const res = data.data;
       this.tableVal = data.data;
+	  console.log(data.data)
       console.warn(this.tableVal);
       let arr = [];
       let keyarr = Object.keys(res.byzb);