update

.env.development

@@ -0,0 +1,5 @@
+VUE_APP_API=http://18.6.30.63:8099
+VUE_APP_SHARDINGURL=http://18.6.30.63:8075
+VUE_APP_ADAPTERURL=http://18.6.30.63:8011
+VUE_APP_APIS=18.6.30.63:8099
+VUE_APP_ADAPTERURLS=18.6.30.63:8011

.env.eapi

@@ -0,0 +1 @@
+NODE_ENV=eapi

.env.production

@@ -0,0 +1,5 @@
+VUE_APP_API=http://18.6.30.63:8099
+VUE_APP_SHARDINGURL=http://18.6.30.63:8075
+VUE_APP_ADAPTERURL=http://18.6.30.63:8011
+VUE_APP_APIS=18.6.30.63:8099
+VUE_APP_ADAPTERURLS=18.6.30.63:8011

.gitignore

@@ -21,11 +21,11 @@ pnpm-debug.log*
 *.njsproj
 *.sln
 *.sw?
-node_modules
 
 #Electron-builder output
 /dist_electron
-/out
 
-#vs
-.vs
+#压缩包
+*.zip
+*.rar
+*.7z

README.md

@@ -1,4 +1,4 @@
-# neic
+# project-neic
 
 ## Project setup
 ```
@@ -15,10 +15,5 @@ npm run serve
 npm run build
 ```
 
-### Lints and fixes files
-```
-npm run lint
-```
-
 ### Customize configuration
 See [Configuration Reference](https://cli.vuejs.org/config/).

package.json

@@ -1,65 +1,51 @@
 {
-  "name": "neic",
+  "name": "project-neic",
   "version": "0.1.0",
   "private": true,
-  "description": "新能源智能发电集中控制系统",
-  "author": "gyee",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint",
-    "dist": "electron-builder",
-    "dist-linux": "electron-builder --linux",
-    "dist-mac": "electron-builder --mac",
-    "dist-win": "electron-builder --win --ia32",
-    "dist-win64": "electron-builder --win --x64",
     "electron:build": "vue-cli-service electron:build",
     "electron:serve": "vue-cli-service electron:serve",
-    "pack": "electron-builder --dir",
     "postinstall": "electron-builder install-app-deps",
     "postuninstall": "electron-builder install-app-deps"
   },
   "main": "background.js",
   "dependencies": {
     "axios": "^0.21.1",
-    "core-js": "^3.15.2",
-    "electron-squirrel-startup": "^1.0.0",
-    "element-plus": "^1.0.2-beta.54",
+    "core-js": "^3.6.5",
+    "dayjs": "^1.10.6",
+    "echarts": "^5.1.2",
+    "element-plus": "^1.1.0-beta.4",
+    "html2canvas": "^1.4.1",
+    "jquery": "^3.6.0",
+    "json-bigint": "^1.0.0",
+    "register-service-worker": "^1.7.1",
     "stompjs": "^2.3.3",
-    "vue": "^3.1.4",
-    "vue-router": "^3.5.2",
-    "vuex": "^4.0.2"
+    "vue": "^3.0.11",
+    "vue-grid-layout": "^3.0.0-beta1",
+    "vue-router": "^4.0.0-0",
+    "vuex": "^4.0.0-0",
+    "xlsx": "^0.17.1"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "~4.5.13",
-    "@vue/cli-plugin-eslint": "~4.5.13",
-    "@vue/cli-service": "~4.5.13",
-    "@vue/compiler-sfc": "^3.1.4",
-    "babel-eslint": "^10.1.0",
-    "electron": "^13.1.5",
-    "electron-devtools-installer": "^3.2.0",
-    "eslint": "^7.30.0",
-    "eslint-plugin-vue": "^7.12.1",
-    "vue-cli-plugin-electron-builder": "^2.1.1"
-  },
-  "eslintConfig": {
-    "root": true,
-    "env": {
-      "node": true
-    },
-    "extends": [
-      "plugin:vue/vue3-essential",
-      "eslint:recommended"
-    ],
-    "parserOptions": {
-      "parser": "babel-eslint"
-    },
-    "rules": {}
+    "@vue/cli-plugin-babel": "~4.5.0",
+    "@vue/cli-plugin-pwa": "~4.5.0",
+    "@vue/cli-plugin-router": "~4.5.0",
+    "@vue/cli-plugin-vuex": "~4.5.0",
+    "@vue/cli-service": "~4.5.0",
+    "@vue/compiler-sfc": "^3.0.0",
+    "electron": "^13.0.0",
+    "electron-devtools-installer": "^3.1.0",
+    "less": "^3.0.4",
+    "less-loader": "^5.0.0",
+    "node-sass": "^4.14.1",
+    "sass-loader": "^8.0.2",
+    "vue-cli-plugin-electron-builder": "~2.1.1"
   },
   "browserslist": [
     "> 1%",
     "last 2 versions",
     "not dead"
-  ],
-  "config": {}
+  ]
 }

public/img/icons/safari-pinned-tab.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.00251 14.9297L0 1.07422H6.14651L8.00251 4.27503L9.84583 1.07422H16L8.00251 14.9297Z" fill="black"/>
+</svg>

public/robots.txt

@@ -0,0 +1,2 @@
+User-agent: *
+Disallow:

public/static/sound/音频说明.txt

@@ -0,0 +1,3 @@
+track.mp3 - 测试用音频
+syz.mp3 - 升压站报警音频
+wd.mp3 - 温度报警音频

src/App.vue

@@ -1,58 +1,331 @@
-<template>
-  <TitleBar />
-  <CenterPage/>
-  <StatusBar />
+<template class="app">
+  <div style="background-color: #000000" ref="imageTofile">
+    <div v-if="lockMaskDisplay" class="lockMask"></div>
+    <!-- <div class="warningMask"></div> -->
+    <TitleBar class="titleBar" />
+    <div class="left">
+      <Menu :lockMaskDisplay="lockMaskDisplay" :temperatureNum="temperatureNum" @handleChange="handleChange"
+        @handleSearch="handleSearch" />
+    </div>
+    <div class="right">
+      <el-col>
+        <el-row>
+          <el-col>
+            <ModeControl ref="modeControl" :current="current" @clicks="handleClick"></ModeControl>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col>
+            <FocusArea />
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col>
+            <WarningArea></WarningArea>
+          </el-col>
+        </el-row>
+      </el-col>
+    </div>
+    <div class="Dialog" v-show="state">
+      <div class="D-" @click="none">-</div>
+    </div>
+    <StatusBar class="statusBar" @getData="getData" />
+    <router-view />
+    <AllMatrices v-model="matricesDisplay" />
+    <SYZDetails v-model="syzDialogShow" :activeTabStation="activeTabStation"></SYZDetails>
+    <AGCDetails v-model="agcDisplay"></AGCDetails>
+    <TemperatureMatrix v-model="temperatureDisplay" />
+    <Fault v-model="faultDisplay" />
+    <Warning v-model="warningDisplay" />
+    <Status v-model="statusDisplay" />
+    <Action v-model="actionDisplay" />
+    <Calendar v-model="calendarDisplay" />
+    <Record v-model="recordDisplay" />
+    <State v-model="stateDisplay" />
+    <Setting v-model="settingDisplay" />
+    
+  </div>
 </template>
-
 <script>
-import TitleBar from "./components/TitleBar.vue";
-import CenterPage from "./components/CenterPage.vue";
-import StatusBar from "./components/StatusBar.vue";
-
-import MessageBridge from "./assets/script/MessageBridge";
-
+import TitleBar from "views/TitleBar.vue";
+import StatusBar from "views/StatusBar.vue";
+import Menu from "views/Menu.vue";
+import MessageBridge from "utils/MessageBridge";
+import ModeControl from "components/modeControl/modeControl.vue";
+import FocusArea from "components/focus/focusArea.vue";
+import WarningArea from "components/warning/warningArea.vue";
+import api from "api/index";
+import boxSelect from "components/boxSelect.vue";
+import AGCDetails from "components/focus/agcDetails.vue";
+import SYZDetails from "components/focus/syzDetails.vue";
+import AllMatrices from "components/allMatrices.vue";
+import Setting from "components/setting.vue";
+import TemperatureMatrix from "components/temperatureMatrix.vue";
+import Fault from "components/search/fault.vue";
+import Warning from "components/search/warning.vue";
+import Status from "components/search/status.vue";
+import Action from "components/search/action.vue";
+import html2canvas from "html2canvas";
+import Calendar from "components/search/calendar.vue";
+import Record from "components/search/record.vue";
+import State from "components/search/state.vue";
+import { debounce } from "lodash";
 export default {
-  name: "App",
+  data() {
+    return {
+      state: false,
+      agcDisplay: false, //AGC功能
+      matricesDisplay: false, //全部矩阵
+      temperatureDisplay: false, //温度矩阵
+      faultDisplay: false, //查询-报警/故障查询
+      warningDisplay: false, //查询-预警查询
+      statusDisplay: false, //查询-状态时间查询
+      actionDisplay: false, //查询-动作查询
+      lockMaskDisplay: false, //锁屏
+      syzDialogShow: false,
+      settingDisplay: false,
+      recordDisplay: false, //查询-推荐记录
+      stateDisplay: false, //查询-状态变化查询
+      calendarDisplay: false, //查询-日历查询
+      temperatureNum: 0, //温度矩阵故障数
+      activeTabStation: '',
+    };
+  },
   components: {
     TitleBar,
-    CenterPage,
     StatusBar,
-  },
-  props:{
-    
+    Menu,
+    ModeControl,
+    FocusArea,
+    WarningArea,
+    boxSelect,
+    AGCDetails,
+    SYZDetails,
+    AllMatrices,
+    TemperatureMatrix,
+    Fault,
+    Warning,
+    Status,
+    Action,
+    Setting,
+    Calendar,
+    Record,
+    State,
   },
   created: function () {
-    this.initData()
-    
+    this.getStation();
+    this.initData();
   },
   methods: {
+    getData(val) {
+      this.state = val;
+    },
+    none() {
+      this.state = false;
+    },
+
     initData: function () {
-      var mb = MessageBridge.getInstance();
-      var vs = [{ key: "/topic/windturbine", action: this.windturbineMessage }];
-      mb.register(vs);
+      let mb = MessageBridge.getInstance();
+      let temperature = [
+        { key: "/topic/temperature-count", action: this.debounceTemperatureMessage },
+      ];
+      let vss = [
+        { key: "/topic/voice-control", action: this.windturbineMessage },
+      ];
+      mb.register(vss);
+      mb.register(temperature);
+    },
+    debounceTemperatureMessage: debounce(function (msg) {
+      this.temperatureMessage(msg)
+    }, 1000),
+    temperatureMessage(msg) {
+      let json = JSON.parse(msg);
+      this.temperatureNum = json.countOverLimit + json.countCrossingLimit;
     },
     windturbineMessage(msg) {
-      var json = JSON.parse(msg);
-      this.$store.commit('windturbinelist', json)
+      let arr = msg.split("-");
+      if (msg === "CLOSE") {
+        this.handleClosed()
+      }
+      if (msg === "OPEN_FJJZ-ALL") {
+        this.handleChange(2)
+      }
+      if (msg === "OPEN_WDJZ-ALL") {
+        this.handleChange(3)
+      }
+      if (msg === "OPEN_AGC-ALL") {
+        this.handleChange(5)
+      }
+      if (arr[0] === "OPEN_SYZ") {
+        this.activeTabStation = arr[1]
+        this.handleClosed()
+        setTimeout(() => {
+          this.handleChange(4)
+        }, 3000);
+      }
+    },
+    getStation() {
+      api.getStation().then((res) => {
+        let stationList = [];
+        res.data.forEach((item) => {
+          if (item.type === 1) {
+            stationList.push(item);
+          }
+        });
+        this.$store.commit("stationList", stationList);
+        let syzArray = [];
+        stationList.forEach((item) => {
+          let obj = {
+            id: item.id, // 升压站 ID
+            isWarning: "0", // 升压站是否显示报警小红点
+            name: item.name, // 升压站中文名称
+            isMute: false, // 升压站报警是否静音
+          };
+          syzArray.push(obj);
+        });
+        this.$store.commit("syzArray", syzArray);
+        this.$store.commit("activeTab", syzArray[0].name);
+      });
+    },
+    handleChange(val) {
+      if (val !== 9) {
+        this.matricesDisplay = false;
+        this.syzDialogShow = false;
+        // this.$store.commit("syzDialogShow", false);
+        this.agcDisplay = false;
+        this.temperatureDisplay = false;
+        this.faultDisplay = false;
+        this.warningDisplay = false;
+        this.statusDisplay = false;
+        this.actionDisplay = false;
+        this.settingDisplay = false
+        this.calendarDisplay = false;
+        this.recordDisplay = false;
+        this.stateDisplay = false;
+      }
+
+      switch (val) {
+        case 2:
+          this.matricesDisplay = true;
+          break;
+        case 3:
+          this.temperatureDisplay = true;
+          break;
+        case 4:
+          this.syzDialogShow = true;
+          break;
+        case 5:
+          this.agcDisplay = true;
+          break;
+        case 7:
+          this.lockMaskDisplay = !this.lockMaskDisplay;
+          break;
+        case 9:
+          this.toImage();
+          break;
+        case 10:
+          this.settingDisplay = true;
+          break;
+        default:
+          break;
+      }
+    },
+    handleClosed() {
+      this.matricesDisplay = false;
+      this.syzDialogShow = false;
+      // this.$store.commit("syzDialogShow", false);
+      this.agcDisplay = false;
+      this.temperatureDisplay = false;
+      this.faultDisplay = false;
+      this.warningDisplay = false;
+      this.statusDisplay = false;
+      this.actionDisplay = false;
+      this.settingDisplay = false
+      this.calendarDisplay = false;
+      this.recordDisplay = false;
+      this.stateDisplay = false;
+    },
+    handleSearch(val) {
+      this.matricesDisplay = false;
+      this.$store.commit("syzDialogShow", false);
+      this.agcDisplay = false;
+      this.temperatureDisplay = false;
+      this.faultDisplay = false;
+      this.warningDisplay = false;
+      this.statusDisplay = false;
+      this.actionDisplay = false;
+      this.settingDisplay = false;
+      this.calendarDisplay = false;
+      this.recordDisplay = false;
+      this.stateDisplay = false;
+      switch (val) {
+        case "fault":
+          this.faultDisplay = true;
+          break;
+        case "warning":
+          this.warningDisplay = true;
+          break;
+        case "status":
+          this.statusDisplay = true;
+          break;
+        case "action":
+          this.actionDisplay = true;
+          break;
+        case "calendar":
+          this.calendarDisplay = true;
+          break;
+        case "record":
+          this.recordDisplay = true;
+          break;
+        case "changeState":
+          this.stateDisplay = true;
+          break;
+        default:
+          break;
+      }
+    },
+    // 页面元素转图片
+    toImage() {
+      // 手动创建一个 canvas 标签
+      const canvas = document.createElement("canvas");
+      // 获取父标签，意思是这个标签内的 DOM 元素生成图片
+      // imageTofile是给截图范围内的父级元素自定义的ref名称
+      let canvasBox = this.$refs.imageTofile;
+      // 获取父级的宽高
+      const width = parseInt(window.getComputedStyle(canvasBox).width);
+      const height = parseInt(window.getComputedStyle(canvasBox).height);
+      // 宽高 * 2 并放大 2 倍 是为了防止图片模糊
+      canvas.width = width * 2;
+      canvas.height = height * 2;
+      canvas.style.width = width + "px";
+      canvas.style.height = height + "px";
+      const context = canvas.getContext("2d");
+      context.scale(2, 2);
+      const options = {
+        backgroundColor: null,
+        canvas: canvas,
+        useCORS: true,
+      };
+      html2canvas(canvasBox, options).then((canvas) => {
+        // toDataURL 图片格式转成 base64
+        let dataURL = canvas.toDataURL("image/png");
+        console.log(dataURL);
+        this.downloadImage(dataURL);
+      });
+    },
+    //下载图片
+    downloadImage(url) {
+      // 如果是在网页中可以直接创建一个 a 标签直接下载
+      let a = document.createElement("a");
+      a.href = url;
+      a.download = "页面截图";
+      a.click();
     },
   },
 };
 </script>
-
 <style>
-@import "./assets/style/main.css";
-/*#app {
-   font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-  margin-top: 60px; 
-  background-color: coral;
-  padding: 0;
-  margin: 0;
-  border: none;
-} */
+@import "../src/assets/styles/main.css";
 
 body {
   /* 设置内容不可选中 */
@@ -61,4 +334,184 @@ body {
   -ms-user-select: none;
   user-select: none;
 }
+
+/* .app{
+    background-color: #000000;
+  } */
+.Dialog {
+  width: 520px;
+  height: 800px;
+  background-color: rgb(250, 249, 249);
+  position: absolute;
+  right: 30px;
+  z-index: 999;
+  bottom: 50px;
+  /* display: none; */
+}
+
+.D- {
+  width: 30px;
+  height: 30px;
+  background-color: rgb(167, 204, 192);
+  font-size: 30px;
+  position: absolute;
+  top: 5px;
+  right: 10px;
+  line-height: 30px;
+  text-align: center;
+}
+
+.D-:hover {
+  background-color: #999999;
+}
+
+.left {
+  width: 40px;
+  position: absolute;
+  left: 0px;
+  height: 100%;
+  z-index: 9999;
+  background-color: #242424;
+  margin-left: 7px;
+  border-radius: 8px;
+}
+
+.right {
+  width: 31%;
+  position: absolute;
+  right: 20px;
+  z-index: 99;
+}
+
+.statusBar {
+  width: 100%;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  z-index: 9999;
+}
+
+.titleBar {
+  width: 100%;
+  position: relative;
+  top: 0;
+  left: 0;
+  z-index: 999;
+}
+
+.el-table__body-wrapper::-webkit-scrollbar-thumb {
+  background-color: #999999;
+  border-radius: 8px;
+}
+
+.el-collapse-item__wrap {
+  background-color: #000000 !important;
+  box-sizing: border-box !important;
+  padding-left: 27px !important;
+}
+
+.el-collapse-item__header {
+  background-color: rgb(20, 20, 20) !important;
+  font-size: 12px !important;
+  color: #bfbfbf !important;
+  box-sizing: border-box !important;
+  padding-left: 30px !important;
+  margin-bottom: 2px !important;
+}
+
+.el-collapse {
+  border: none !important;
+}
+
+.el-collapse-item__header {
+  border: none !important;
+}
+
+.el-collapse-item__wrap {
+  border: none !important;
+}
+
+.lockMask {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  background-color: rgba(0, 0, 0, 0.2);
+  z-index: 9998;
+}
+
+.warningMask {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  background-image: radial-gradient(circle,
+      rgb(255, 0, 0, 0),
+      rgb(255, 0, 0, 0),
+      rgb(255, 0, 0, 0),
+      rgb(255, 0, 0));
+  animation: fade 2000ms infinite;
+  -webkit-animation: fade 2000ms infinite;
+  z-index: 999;
+  pointer-events: none;
+}
+
+@keyframes fade {
+  from {
+    opacity: 0.7;
+  }
+
+  50% {
+    opacity: 0.3;
+  }
+
+  to {
+    opacity: 0.7;
+  }
+}
+
+@-webkit-keyframes fade {
+  from {
+    opacity: 0.7;
+  }
+
+  50% {
+    opacity: 0.3;
+  }
+
+  to {
+    opacity: 0.7;
+  }
+}
 </style>
+<style lang="less">
+#app {
+  .currentScroll::-webkit-scrollbar {
+    width: 8px;
+    height: 0px;
+    background-color: black;
+  }
+
+  .currentScroll::-webkit-scrollbar-thumb {
+    background-color: #999999;
+    border-radius: 6px;
+  }
+}
+
+::-webkit-scrollbar {
+  width: 8px !important;
+  height: 8px !important;
+  background-color: black !important;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: #999999 !important;
+  border-radius: 6px !important;
+}
+
+.el-table--enable-row-hover .el-table__body tr:hover>td {
+  color: rgba(37, 116, 219, 0.8) !important;
+}
+
+.el-table__body tr.current-row>td {
+  color: rgba(37, 116, 219, 0.8) !important;
+}
+</style>

src/api/index.js

@@ -0,0 +1,400 @@
+import request from "../utils/request";
+//全部风机
+const getWindturbine = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/all`,
+        method: "get",
+    });
+};
+// 标题栏数据
+const stationOverview = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/overview`,
+        method: "get",
+    });
+};
+//获取报警数据
+const alarmFault = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/alarm/fault`,
+        method: "get",
+    });
+};
+//获取推荐风机信息
+const recommendation = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/recommendation`,
+        method: "get",
+    });
+};
+//登陆
+const login = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/user/login`,
+        method: "post",
+        data:data,
+    });
+};
+//获取场站
+const getStation = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/info`,
+        method: "get",
+    });
+};
+//获取AGC场站
+const getAGCStation = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/agc`,
+        method: "get",
+    });
+};
+//刷新报警信息
+const getSnap = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_SHARDINGURL,
+        url: `/alarm/snap/page?pagenum=${data.pagenum}&pagesize=${data.pagesize}&category1=${data.category1}&isopened=${data.isopened}&starttime=${data.starttime}&endtime=${data.endtime}&windturbineId=${data.windturbineId?data.windturbineId:''}`,
+        method: "get",
+    });
+};
+//数据刷新
+const refreshData = (keys) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/latest?keys=${keys}`,
+        method: "get",
+    });
+};
+//风机控制
+const windturbControl = (pairs) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/control/`,
+        method: "post",
+        data:pairs
+    });
+};
+//风机控制
+const windturbControlLock = (pairs) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/control/lock`,
+        method: "post",
+        data:pairs
+    });
+};
+//获取风机详情页面数据
+const nitWinturbineBaseData = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/latest?thingType=${data.thingType}&thingId=${data.thingId}&uniformCodes=${data.uniformCodes}`,
+        method: "get",
+    });
+};
+const getOverview = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/overview`,
+        method: "get",
+    });
+};
+const sendWarning = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/alarm/confirm?snapID=${data.snapID}&faultID=${data.faultID}&userName=${data.userName}`,
+        method: "get",
+    });
+};
+const sendRecommend = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `api/voice-control/addvoicetask`,
+        method: "post",
+        data:data
+    });
+};
+const getPower = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/history/snap?tagName=${data.tagName}&startTs=${data.startTs}&endTs=${data.endTs}&interval=${data.interval}`,
+        method: "get",
+    });
+};
+const getOriginalPower = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/history/raw?tagName=${data.tagName}&startTs=${data.startTs}&endTs=${data.endTs}`,
+        method: "get",
+    });
+};
+const getWindturbinePower = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/history/snap?thingId=${data.thingId}&uniformCode=${data.uniformCode}&startTs=${data.startTs}&endTs=${data.endTs}&thingType=${data.thingType}&interval=${data.interval}`,
+        method: "get",
+    });
+};
+const getOriginalWindturbinePower = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/history/raw?thingId=${data.thingId}&uniformCode=${data.uniformCode}&startTs=${data.startTs}&endTs=${data.endTs}&thingType=${data.thingType}`,
+        method: "get",
+    });
+};
+const getWindWarning = (data,pageIndex,pageSize) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/alarm/real-time-alarm?objectId=${data}&pageIndex=${pageIndex}&pageSize=${pageSize}`,
+        method: "get"
+    });
+};
+const getHealthDate=(stid,wtid)=>{
+    return request({
+        baseURL:process.env.VUE_APP_WARNING,
+        url:`/alarm/statistic?stId=${stid}&wtId=${wtid}`,
+        method:"get"
+    })
+}
+const getDetial=(data)=>{
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url:`/api/windturbine/${data}`,
+        method:"get"
+    })
+}
+const getWarning=(data,wtid,pt)=>{
+    return request({
+        baseURL:process.env.VUE_APP_WARNING,
+        url:`/alarm/list?stId=${data}&wtId=${wtid}&widget=${pt}`,
+        method:"get"
+    })
+}
+const getCustomerLock=()=>{
+    return request({
+        baseURL: process.env.VUE_APP_API,
+        url:`/api/windturbine/customer-lock`,
+        method:"get"
+    })
+}
+const controlRecord = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/control-record/search?stationId=${data.stationId}&userName=${data.userName}&windturbineId=${data.windturbineId}&startTime=${data.startTime}&endTime=${data.endTime}&pageSize=${data.pageSize}&pageIndex=${data.pageIndex}`,
+        method: "get",
+    });
+};
+const getLatest = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/latest?keys=${data}`,
+        method: "get",
+    });
+};
+//获取智能模式下场站
+const getControlType = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/status`,
+        method: "get",
+    });
+};
+const uodateControlType = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/status/update?stationid=${data.stationid}&type=${data.type}&userName=${data.userName}`,
+        method: "get",
+    });
+};
+//获取UniformCodes数据
+const getUniformCodes = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/uniform-code`,
+        method: "get",
+    });
+};
+const getBoostStation = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/boost-station`,
+        method: "get",
+    });
+};
+//获取风机code名称
+const getWindturbineFdc = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/fdc`,
+        method: "get",
+    });
+};
+const getWindturbineWarning = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_SHARDINGURL,
+        url: `/alarm/history/page?pagenum=${data.pagenum}&pagesize=${data.pagesize}&windturbineid=${data.windturbineid?data.windturbineid:''}&starttime=${data.starttime}&endtime=${data.endtime}&keyword=${data.keyword?data.keyword:''}&stationid=${data.stationid?data.stationid:''}&category1=${data.category1?data.category1:''}`,
+        method: "get",
+    });
+};
+//获取报警历史数据
+const getFaultHistory = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_SHARDINGURL,
+        url: `/fault/history/listpage?pagenum=${data.pageIndex}&pagesize=${data.pageSize}&stationid=${data.stationid}&keyword=${data.keyword}&starttime=${data.startTime}&endtime=${data.endTime}`,
+        method: "get",
+    });
+};
+
+const stationCompared = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/compared?models=${data}`,
+        method: "get",
+    });
+};
+//温度矩阵
+const temperatureInfo = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/temperature-info?id=${data.id}&status=${data.status}&pagenum=${data.pagenum}&pagesize=${data.pagesize}`,
+        method: "get",
+    });
+};
+//获取风机故障
+const alarmSnap = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/alarm/alarm-snap?windturbineId=${data.windturbineId}`,
+        method: "get",
+    });
+};
+
+//预警分析
+const analysisDetail = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_WARNING,
+        url: `/analysis/detail?station=${data.station}&startTs=${data.startTs}&endTs=${data.endTs}&interval=${data.interval}&wtId=${data.wtId}&name=${data.name}`,
+        method: "get",
+    });
+};
+//预警分析
+const alarmCountQuery = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_WARNING,
+        url: `/alarm/count/query/new2?stationid=${data.stationid}&startdate=${data.startdate}&enddate=${data.enddate}`,
+        method: "get",
+    });
+};
+//获取风场机型
+const getStationModels = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/models?stationid=${data.stationid}`,
+        method: "get",
+    });
+};
+//获取设置查询
+const getSettings = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/settings/recommendation?stationId=${data.stationId}&modelId=${data.modelId}`,
+        method: "get",
+    });
+};
+//修改设置
+const updateSettings = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/settings/recommendation`,
+        method: "post",
+        data:data
+    });
+};
+//状态时间查询
+const statusTime = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/status-time?stationId=${data.stationid}&startTs=${data.startTs}&endTs=${data.endTs}`,
+        method: "get",
+    });
+};
+
+//推荐记录查询
+const recommended = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `control-record/recommended?pagesize=${data.pagesize}&pagenum=${data.pagenum}&stationid=${data.stationid}&windturbineid=${data.windturbineid}`,
+        method: "get",
+    });
+};
+
+//状态变化查询
+const statusChange = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/windturbine/status?startTs=${data.startTs}&endTs=${data.endTs}&pagesize=${data.pagesize}&pagenum=${data.pagenum}&windturbineId=${data.windturbineid}`,
+        method: "get",
+    });
+};
+
+//恢复默认设置
+const returnSetting = (data) => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/settings/recommendation/recover?stationId=${data.stationId}&modelId=${data.modelId}`,
+        method: "get",
+    });
+};
+export default {
+    login,
+    getStation,
+    getAGCStation,
+    getSnap,
+    refreshData,
+    windturbControl,
+    windturbControlLock,
+    nitWinturbineBaseData,
+    getOverview,
+    sendWarning,
+    sendRecommend,
+    getPower,
+    getOriginalPower,
+    getWindWarning,
+    getHealthDate,
+    getDetial,
+    getWarning,
+    getCustomerLock,
+    getWindturbinePower,
+    getOriginalWindturbinePower,
+    controlRecord,
+    getLatest,
+    getControlType,
+    uodateControlType,
+    getUniformCodes,
+    getBoostStation,
+    getWindturbineFdc,
+    getWindturbineWarning,
+    getFaultHistory,
+    stationCompared,
+    temperatureInfo,
+    alarmSnap,
+    analysisDetail,
+    alarmCountQuery,
+    statusTime,
+    getWindturbine,
+    stationOverview,
+    alarmFault,
+    recommendation,
+    getStationModels,
+    getSettings,
+    updateSettings,
+    recommended,
+    statusChange,
+    returnSetting,
+};

src/assets/dataService/README.md

@@ -0,0 +1 @@
+# 用于存放json数据文件 如果数据过大则需要单独打包

src/assets/dataService/arcgis-mhs-line.json

@@ -0,0 +1,234 @@
+[
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "paths": [
+                [
+                    107.0644069,
+                    37.30000218
+                ],
+                [
+                    107.0609736,
+                    37.29027221
+                ],
+                [
+                    107.0545363,
+                    37.29431798
+                ],
+                [
+                    107.0488715,
+                    37.29385708
+                ],
+                [
+                    107.04561,
+                    37.29752713
+                ],
+                [
+                    107.0409322,
+                    37.30025821
+                ],
+                [
+                    107.0374346,
+                    37.30382554
+                ],
+                [
+                    107.0325208,
+                    37.30630038
+                ],
+                [
+                    107.0349455,
+                    37.30909941
+                ],
+                [
+                    107.0286155,
+                    37.30956022
+                ],
+                [
+                    107.0238519,
+                    37.31106208
+                ]
+            ]
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "width": 3
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "paths": [
+                [
+                    107.0649004,
+                    37.30542993
+                ],
+                [
+                    107.0527768,
+                    37.30129941
+                ],
+                [
+                    107.048614,
+                    37.30432051
+                ],
+                [
+                    107.0456958,
+                    37.30819486
+                ],
+                [
+                    107.0414472,
+                    37.31130101
+                ],
+                [
+                    107.0348811,
+                    37.31508967
+                ],
+                [
+                    107.0305467,
+                    37.31749588
+                ],
+                [
+                    107.0199444,
+                    37.31830556
+                ],
+                [
+                    107.0611238,
+                    37.30860447
+                ],
+                [
+                    107.0571327,
+                    37.31169354
+                ],
+                [
+                    107.0521975,
+                    37.31369028
+                ]
+            ]
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "width": 3
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "paths": [
+                [
+                    107.0693851,
+                    37.30322815
+                ],
+                [
+                    107.0744705,
+                    37.30041183
+                ],
+                [
+                    107.0696425,
+                    37.29628104
+                ],
+                [
+                    107.0717883,
+                    37.29213295
+                ],
+                [
+                    107.0662093,
+                    37.28824071
+                ],
+                [
+                    107.0567894,
+                    37.31587468
+                ],
+                [
+                    107.0560169,
+                    37.31988494
+                ],
+                [
+                    107.0506954,
+                    37.32184734
+                ],
+                [
+                    107.0727539,
+                    37.31087435
+                ],
+                [
+                    107.0761871,
+                    37.3067612
+                ],
+                [
+                    107.0820665,
+                    37.30641985
+                ]
+            ]
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "width": 3
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "paths": [
+                [
+                    107.0360184,
+                    37.32406563
+                ],
+                [
+                    107.0318985,
+                    37.32969639
+                ],
+                [
+                    107.0269525,
+                    37.33528407
+                ],
+                [
+                    107.0515966,
+                    37.32539657
+                ],
+                [
+                    107.0396662,
+                    37.33669159
+                ],
+                [
+                    107.0315766,
+                    37.34420644
+                ],
+                [
+                    107.0183909,
+                    37.34223611
+                ],
+                [
+                    107.0164329,
+                    37.33144098
+                ],
+                [
+                    107.0044997,
+                    37.32873236
+                ],
+                [
+                    107.0019168,
+                    37.33337322
+                ]
+            ]
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "width": 3
+        },
+        "popupTemplate": null
+    }
+]

src/assets/dataService/arcgis-mhs.json

@@ -0,0 +1,707 @@
+[
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0674069,
+            "y": 37.3040218
+        },
+        "symbol": null,
+        "attributes": {
+            "objectid": 1,
+            "fc_code": "fc01",
+            "code": "升压站",
+            "type": "升压站"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0644069,
+            "y": 37.30000218
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG01",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0609736,
+            "y": 37.29027221
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG02",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0545363,
+            "y": 37.29431798
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG03",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0488715,
+            "y": 37.29385708
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG04",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.04561,
+            "y": 37.29752713
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG05",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0409322,
+            "y": 37.30025821
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG06",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0374346,
+            "y": 37.30382554
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG07",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0325208,
+            "y": 37.30630038
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG08",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0349455,
+            "y": 37.30909941
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG09",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0286155,
+            "y": 37.30956022
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG10",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0238519,
+            "y": 37.31106208
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG11",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0649004,
+            "y": 37.30542993
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG12",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0527768,
+            "y": 37.30129941
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG13",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.048614,
+            "y": 37.30432051
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG14",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0456958,
+            "y": 37.30819486
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG15",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0414472,
+            "y": 37.31130101
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG16",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0348811,
+            "y": 37.31508967
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG17",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0305467,
+            "y": 37.31749588
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG18",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0199444,
+            "y": 37.31830556
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG19",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0611238,
+            "y": 37.30860447
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG20",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0571327,
+            "y": 37.31169354
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG21",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0521975,
+            "y": 37.31369028
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG22",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0693851,
+            "y": 37.30322815
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG23",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0744705,
+            "y": 37.30041183
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG24",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0696425,
+            "y": 37.29628104
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG25",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0717883,
+            "y": 37.29213295
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG26",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0662093,
+            "y": 37.28824071
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG27",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0567894,
+            "y": 37.31587468
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG28",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0560169,
+            "y": 37.31988494
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG29",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0506954,
+            "y": 37.32184734
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG30",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0727539,
+            "y": 37.31087435
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG31",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0761871,
+            "y": 37.3067612
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG32",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0820665,
+            "y": 37.30641985
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG33",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0360184,
+            "y": 37.32406563
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG34",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0318985,
+            "y": 37.32969639
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG35",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0269525,
+            "y": 37.33528407
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG36",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0515966,
+            "y": 37.32539657
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG37",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0396662,
+            "y": 37.33669159
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG38",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0315766,
+            "y": 37.34420644
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG39",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0183909,
+            "y": 37.34223611
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG40",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0164329,
+            "y": 37.33144098
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG41",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0044997,
+            "y": 37.32873236
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG42",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    },
+    {
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 107.0019168,
+            "y": 37.33337322
+        },
+        "symbol": null,
+        "attributes": {
+            "fc_code": "MHS",
+            "code": "MG43",
+            "type": "风场"
+        },
+        "popupTemplate": null
+    }
+]

src/assets/dataService/arcgis-sbq-line.json

@@ -0,0 +1,173 @@
+[{
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"paths": [
+			[106.4515667, 37.60171667],
+			[106.4368167, 37.6033],
+			[106.4341333, 37.60171667],
+			[106.4250833, 37.60041667],
+			[106.4375, 37.5879],
+			[106.4398167, 37.5854],
+			[106.4510667, 37.57506667],
+			[106.4539333, 37.57455],
+			[106.4591, 37.57405],
+			[106.4753, 37.57543333],
+			[106.48525, 37.57398333],
+			[106.4558833, 37.59241667],
+			[106.4520667, 37.59083333],
+			[106.4503333, 37.5869],
+			[106.4539, 37.58436667],
+			[106.4588333, 37.58393333],
+			[106.4689667, 37.58508333],
+			[106.4557667, 37.58851667],
+			[106.4691, 37.58788333],
+			[106.4727167, 37.5859],
+			[106.4853833, 37.58373333],
+			[106.501, 37.57553333],
+			[106.4698833, 37.6003],
+			[106.4722333, 37.59011667],
+			[106.4838333, 37.59091667],
+			[106.4861333, 37.58858333],
+			[106.4880333, 37.58626667],
+			[106.4897833, 37.58736667],
+			[106.5011667, 37.58518333],
+			[106.5076667, 37.58378333],
+			[106.5184167, 37.5862],
+			[106.5253667, 37.58713333],
+			[106.5342833, 37.58786667]
+		]
+	},
+	"symbol": null,
+	"attributes": {
+		"fc_code": "SBQ",
+		"width": 3
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"paths": [
+			[106.4565333, 37.63861667],
+			[106.4537167, 37.63945],
+			[106.4505667, 37.64101667],
+			[106.4369333, 37.64116667],
+			[106.43425, 37.65011667],
+			[106.43735, 37.654],
+			[106.4381333, 37.65733333],
+			[106.4344, 37.65973333],
+			[106.4393167, 37.66668333],
+			[106.4433167, 37.667],
+			[106.45585, 37.65986667],
+			[106.4680167, 37.63951667],
+			[106.4685, 37.65056667],
+			[106.4562167, 37.6501],
+			[106.43795, 37.65021667],
+			[106.4415833, 37.65116667],
+			[106.4413667, 37.65436667],
+			[106.4417667, 37.65761667],
+			[106.4568333, 37.65378333],
+			[106.47095, 37.65178333],
+			[106.4699833, 37.65555],
+			[106.4736333, 37.66703333],
+			[106.4756167, 37.63865],
+			[106.4847167, 37.64136667],
+			[106.4739833, 37.64246667],
+			[106.4729333, 37.65466667],
+			[106.4751667, 37.6567],
+			[106.48745, 37.65055],
+			[106.4874333, 37.65305],
+			[106.4893333, 37.65453333],
+			[106.48695, 37.65755],
+			[106.4923667, 37.64303333],
+			[106.4925333, 37.6522]
+		]
+	},
+	"symbol": null,
+	"attributes": {
+		"fc_code": "SBQ",
+		"width": 3
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"paths": [
+			[106.4372667, 37.60863333],
+			[106.4358333, 37.62263333],
+			[106.4697, 37.62076667],
+			[106.4594167, 37.6087],
+			[106.4585833, 37.60526667],
+			[106.4248667, 37.617],
+			[106.48565, 37.63513333],
+			[106.4233833, 37.63723333],
+			[106.4683667, 37.63515],
+			[106.4348333, 37.61908333],
+			[106.4395333, 37.62545],
+			[106.4423, 37.62185],
+			[106.4758667, 37.63501667],
+			[106.451, 37.60971667],
+			[106.4543167, 37.60706667],
+			[106.4505, 37.62356667],
+			[106.4544833, 37.61888333],
+			[106.4586833, 37.62058333],
+			[106.4376833, 37.63785],
+			[106.4405167, 37.61908333],
+			[106.4345, 37.63703333],
+			[106.4260833, 37.62615],
+			[106.4693667, 37.61766667],
+			[106.4713333, 37.63703333],
+			[106.4408833, 37.60918333]
+		]
+	},
+	"symbol": null,
+	"attributes": {
+		"fc_code": "SBQ",
+		"width": 3
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"paths": [
+			[106.53535, 37.60373333],
+			[106.5314833, 37.60988333],
+			[106.5277833, 37.61066667],
+			[106.5195, 37.6084],
+			[106.5133333, 37.60538333],
+			[106.5099333, 37.62868333],
+			[106.5286667, 37.62028333],
+			[106.5286833, 37.62013333],
+			[106.5013167, 37.62301667],
+			[106.459833, 37.61241667],
+			[106.5030833, 37.61541667],
+			[106.4942667, 37.61318333],
+			[106.4932667, 37.61023333],
+			[106.4872, 37.61611667],
+			[106.4764833, 37.61796667],
+			[106.4820833, 37.61956667],
+			[106.485, 37.62698333],
+			[106.4895333, 37.63096667],
+			[106.4963, 37.6317],
+			[106.5025167, 37.62693333],
+			[106.5047, 37.63411667],
+			[106.5142, 37.63583333],
+			[106.5098667, 37.64313333],
+			[106.50405, 37.64968333],
+			[106.4992333, 37.6394]
+		]
+	},
+	"symbol": null,
+	"attributes": {
+		"fc_code": "SBQ",
+		"width": 3
+	},
+	"popupTemplate": null
+}]

src/assets/dataService/arcgis-xs.json

@@ -0,0 +1,887 @@
+[{
+        "geometry": {
+            "spatialReference": {
+                "wkid": 4326
+            },
+            "x": 105.2139616,
+            "y": 37.17630397
+        },
+        "symbol": null,
+        "attributes": {
+            "objectid": 1,
+            "fc_code": "fc01",
+            "code": "升压站",
+            "type": "升压站"
+        },
+        "popupTemplate": null
+    },{
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2139616,
+		"y": 37.17630397
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG01",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2186394,
+		"y": 37.17746656
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG02",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2209997,
+		"y": 37.18197998
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG03",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2246046,
+		"y": 37.18398015
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG04",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2170515,
+		"y": 37.16939645
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG05",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2227592,
+		"y": 37.17149955
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG06",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2188325,
+		"y": 37.17346581
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG07",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2284241,
+		"y": 37.17165343
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG08",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2288532,
+		"y": 37.17532943
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG09",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2307415,
+		"y": 37.17856075
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG10",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2354193,
+		"y": 37.18136453
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG11",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2213216,
+		"y": 37.16744719
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG12",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2199697,
+		"y": 37.1630697
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG13",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2188754,
+		"y": 37.15821314
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG14",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2351832,
+		"y": 37.16212919
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG15",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2419209,
+		"y": 37.16488228
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG16",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2455902,
+		"y": 37.16595955
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG17",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2475214,
+		"y": 37.16895189
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG18",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2521992,
+		"y": 37.16784046
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG19",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2424788,
+		"y": 37.16185559
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG20",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2399254,
+		"y": 37.15814473
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG21",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2384663,
+		"y": 37.15386932
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG22",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2489376,
+		"y": 37.16094927
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG23",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2476501,
+		"y": 37.15793952
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG24",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2444744,
+		"y": 37.15532299
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG25",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2115583,
+		"y": 37.17213218
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG26",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2099276,
+		"y": 37.17526105
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG27",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2087474,
+		"y": 37.18179192
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG28",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2079105,
+		"y": 37.18509134
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG29",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2108502,
+		"y": 37.18861284
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG30",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1989198,
+		"y": 37.1755517
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG31",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1991987,
+		"y": 37.18280057
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG32",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.198791,
+		"y": 37.18815129
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG33",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1958299,
+		"y": 37.1801849
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG34",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1887488,
+		"y": 37.18856156
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG35",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1947355,
+		"y": 37.17633817
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG36",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1866031,
+		"y": 37.17977459
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG37",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1873326,
+		"y": 37.1755688
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG38",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1796722,
+		"y": 37.17688527
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG39",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1824403,
+		"y": 37.18757008
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG40",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1773977,
+		"y": 37.18500586
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG41",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1714969,
+		"y": 37.18526229
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG42",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2116871,
+		"y": 37.16691711
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG43",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2104855,
+		"y": 37.1634288
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG44",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.207417,
+		"y": 37.16799435
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG45",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.201602,
+		"y": 37.16690001
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG46",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2053785,
+		"y": 37.15397194
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG47",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.2037477,
+		"y": 37.15821314
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG48",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1997781,
+		"y": 37.15963252
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG49",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1993275,
+		"y": 37.15679373
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG50",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.194757,
+		"y": 37.15879457
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG51",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1912808,
+		"y": 37.16060726
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG52",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1859164,
+		"y": 37.15607546
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG53",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1862597,
+		"y": 37.15226171
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG54",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1868176,
+		"y": 37.1622147
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG55",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1817322,
+		"y": 37.16525848
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG56",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1725054,
+		"y": 37.16621604
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG57",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}, {
+	"geometry": {
+		"spatialReference": {
+			"wkid": 4326
+		},
+		"x": 105.1694369,
+		"y": 37.1642838
+	},
+	"symbol": null,
+	"attributes": {
+		"code": "XG58",
+		"fc_code": "XS",
+		"type": "风场"
+	},
+	"popupTemplate": null
+}]

src/assets/script/BackgroundData.js

@@ -1,376 +0,0 @@
-import axios from 'axios';
-import { config } from '../../config';
-
-export default class BackgroundData {
-    /* 当前登录用户 */
-    LoginUser;
-    /* 标题栏数据 */
-    TopPoint = [
-        {
-            pointName: "TotalPower",// 实时总功率
-            pointTag: "JSFW.NX_GD_XXX_XX_XX_XXX_XXX_CI0135",
-            value: 0
-        }, {
-            pointName: "DailyPowerGeneration",// 日发电量
-            pointTag: "JSFW.NX_GD_XXX_XX_XX_XXX_XXX_CI0088",
-            value: 0
-        }, {
-            pointName: "GridPower",// 上网电量
-            pointTag: "JSFW.NX_GD_XXX_XX_XX_XXX_XXX_CI0136",
-            value: 0
-        }, {
-            pointName: "MonthlyPowerGeneration",// 月发电量
-            pointTag: "JSFW.NX_GD_XXX_XX_XX_XXX_XXX_CI0146",
-            value: 0
-        }, {
-            pointName: "AnnualPowerGeneration",// 年发电量
-            pointTag: "JSFW.NX_GD_XXX_XX_XX_XXX_XXX_CI0037",
-            value: 0
-        },
-    ];
-    /* 推荐区数据 */
-    Recommends = {
-        "DWK": {
-            stationName: "大武口光伏电站",
-            content: "通讯中断",
-            createTime: this.formatDate(new Date("2021-04-15 8:17:59"), 'YY-MM-DD hh:mm'),
-            isActive: true,
-        },
-        "NSSFCJSFW.NX_GD_NSSF_XX_XX_XXX_XXX_CI0263": {
-            stationName: "牛首山风电场",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-        "QSFCJSFW.NX_GD_QSF_XX_XX_XXX_XXX_CI0263": {
-            stationName: "青山风电场",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-
-        "SBQFCJSFW.NX_GD_SBQF_XX_XX_XXX_XXX_CI0263": {
-            stationName: "石板泉一期",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-        "MHSFCJSFW.NX_GD_MHSF_XX_XX_XXX_XXX_CI0263": {
-            stationName: "麻黄山风电场",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-        "XSFCJSFW.NX_GD_XSF_XX_XX_XXX_XXX_CI0263": {
-            stationName: "香山风电场",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-        "SLAGC.NX_GD_QSF_DQ_P1_L1_001_DI0165": {
-            stationName: "青山三期",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-        "SBQFCJSFW.NX_GD_SBQF_XX_XX_XXX_XXX_CI026X": {
-            stationName: "石板泉二三四期",
-            content: "限电",
-            createTime: new Date(),
-            isActive: false,
-        },
-    };
-    /* 隐患数据 */
-    HiddenProblems = new Array();
-    /* 缺陷数据 */
-    Defects = new Array();
-    /* 故障数据 */
-    Failure = new Array();
-    /* 事故数据 */
-    Accidents = new Array();
-
-    /* 标记数据 */
-    Marks = [];
-    MarkIndex = 0;
-
-    constructor() {
-        this.refreshTPData = this.refreshTPData.bind(this);
-        this.onTPMessage = this.onTPMessage.bind(this);
-        this.refreshAlarmData = this.refreshAlarmData.bind(this);
-        this.onHiddenProblemsMessage = this.onHiddenProblemsMessage.bind(this);
-        this.formatDate = this.formatDate.bind(this);
-        this.onDefectsMessage = this.onDefectsMessage.bind(this);
-        this.onAccidentsMessage = this.onAccidentsMessage.bind(this);
-        this.isContains = this.isContains.bind(this);
-        this.refreshRecommendData = this.refreshRecommendData.bind(this);
-        this.onRDMessage = this.onRDMessage.bind(this);
-        this.windturbineControl = this.windturbineControl.bind(this);
-        this.marking = this.marking.bind(this);
-        this.removeMarked = this.removeMarked.bind(this);
-        this.initWinturbineBaseData=this.initWinturbineBaseData.bind(this);
-        
-
-        this.refreshTPData();
-        this.refreshAlarmData();
-        this.refreshRecommendData();
-
-        this.refreshTPTimer = setInterval(this.refreshTPData, 3000);// 标题栏数据
-        this.refreshAlarmTimer = setInterval(this.refreshAlarmData, 10000);// 报警数据
-        this.refreshRecommendTimer = setInterval(this.refreshRecommendData, 3000);// 推荐数据
-    }
-
-    /* 数据刷新 */
-    refreshTPData() {
-        // http://192.168.10.18:8011/ts
-        var val = '';
-        for (var v in this.TopPoint) {
-            val += this.TopPoint[v].pointTag + ',';
-        }
-        axios.get(`http://${config.adapterUrl}/ts/latest?keys=${val}`)
-            .then(this.onTPMessage)
-            .catch(err =>
-                console.log(err)
-            );
-    }
-
-    /* 刷新推荐信息 */
-    refreshRecommendData() {
-        var val = '';
-        for (var v in this.Recommends) {
-            val += v + ',';
-        }
-        axios.get(`http://${config.adapterUrl}/ts/latest?keys=${val}`)
-            .then(this.onRDMessage)
-            .catch(err =>
-                console.log(err)
-            );
-    }
-
-    /* 刷新报警信息 */
-    refreshAlarmData() {
-        // http://192.168.10.18:8075/alarm
-        // 1、读取一天内的所有open的4级custom报警，作为隐患数据ar
-        var enddt = new Date();
-        var tm = enddt.getTime();
-        enddt = new Date(tm + 900000);
-        var startdt = new Date(tm - 86400000);
-        axios.get(`http://${config.shardingUrl}/alarm/snap/page?pagenum=1&pagesize=500&category1=custom&rank=4&isopened=1&starttime=${this.formatDate(startdt)}&endtime=${this.formatDate(enddt)}`)
-            .then(this.onHiddenProblemsMessage)
-            .catch(err =>
-                console.log(err)
-            );
-        // 2、读取一天内所有的open的windturbine报警，以故障结尾的报警填充到故障，其他的填充到缺陷
-        axios.get(`http://${config.shardingUrl}/alarm/snap/page?pagenum=1&pagesize=500&category1=windturbine&isopened=1&starttime=${this.formatDate(startdt)}&endtime=${this.formatDate(enddt)}`)
-            .then(this.onDefectsMessage)
-            .catch(err =>
-                console.log(err)
-            );
-        // 3、读取一天内所有open的升压站（SYZ）报警，包含关键字“跳闸”，“开关”，“刀闸”，“断路器”字符的报警信息填充到事故列表
-        axios.get(`http://${config.shardingUrl}/alarm/snap/page?pagenum=1&pagesize=500&category1=SYZ&isopened=1&starttime=${this.formatDate(startdt)}&endtime=${this.formatDate(enddt)}`)
-            .then(this.onAccidentsMessage)
-            .catch(err =>
-                console.log(err)
-            );
-    }
-
-    /* 获得故障数据 */
-    onAccidentsMessage(msg) {
-        if (!msg.data) return;
-        this.Accidents = new Array();
-        for (var v in msg.data.records) {
-            var val = msg.data.records[v];
-            if (this.isContains(val.alertText, ["跳闸", "开关", "刀闸", "断路器", "合位", "分位"])) {
-                // todo 暂时隐藏事故报警
-                //this.Accidents.push(val);
-            } else {
-                if (val.rank == "5") {
-                    this.Failure.push(val);
-                } else {
-                    this.Defects.push(val);
-                }
-            }
-        }
-    }
-
-    /* 获得缺陷数据 */
-    onDefectsMessage(msg) {
-        if (!msg.data) return;
-        this.Defects = new Array();
-        this.Failure = new Array();
-        for (var v in msg.data.records) {
-            var val = msg.data.records[v];
-            if (val.alertText.indexOf("故障") > 0) {
-                this.Failure.push(val);
-            } else {
-                this.Defects.push(val);
-            }
-        }
-    }
-
-    /* 获得隐患数据 */
-    onHiddenProblemsMessage(msg) {
-        if (!msg.data) return;
-        this.HiddenProblems = msg.data.records;
-    }
-
-    /* 获得标题栏数据 */
-    onTPMessage(msg) {
-        if (!msg.data) return;
-        for (var v in this.TopPoint) {
-            var val = this.TopPoint[v];
-            val.value = msg.data[val.pointTag].doubleValue;
-        }
-    }
-
-    /* 获得推荐信息数据 */
-    onRDMessage(msg) {
-        if (!msg.data) return;
-        for (var v in msg.data) {
-            var isact = false;
-            if (!msg.data[v].doubleValue) {
-                isact = msg.data[v].booleanValue
-            } else {
-                isact = msg.data[v].doubleValue != 0;
-            }
-            if (isact && !this.Recommends[v].isActive) {
-                this.Recommends[v].createTime = this.formatDate(new Date(), 'YY-MM-DD hh:mm');
-            }
-            this.Recommends[v].isActive = isact;
-        }
-    }
-
-    /* 格式化时间 */
-    formatDate(time, format = 'YY-MM-DD hh:mm:ss') {
-        var date = new Date(time);
-
-        var year = date.getFullYear(),
-            month = date.getMonth() + 1,//月份是从0开始的
-            day = date.getDate(),
-            hour = date.getHours(),
-            min = date.getMinutes(),
-            sec = date.getSeconds();
-        var preArr = Array.apply(null, Array(10)).map(function (elem, index) {
-            return '0' + index;
-        });
-
-        var newTime = format.replace(/YY/g, year)
-            .replace(/MM/g, preArr[month] || month)
-            .replace(/DD/g, preArr[day] || day)
-            .replace(/hh/g, preArr[hour] || hour)
-            .replace(/mm/g, preArr[min] || min)
-            .replace(/ss/g, preArr[sec] || sec);
-
-        return newTime;
-    }
-
-    /* 判断一个字符串中是否包含第二个字符串列表中的字符 */
-    isContains(str, strs) {
-        for (var v in strs) {
-            if (str.indexOf(strs[v]) > 0) {
-                return true;
-            }
-        }
-        return false;
-    }
-    
-    /* 登录 */
-    login(uname, psd, action) {
-        axios.get(`http://${config.calcUrl}/api/user/login?userName=${uname}&psd=${psd}`)
-            .then(action)
-            .catch(err => action("登录出现错误：" + err.message));
-    }
-
-    /* 风机控制 */
-    windturbineControl(windturbines, isLockOrUnlock,success,error) {
-        var pairs = {};
-        for (var ind in windturbines) {
-            var wb = windturbines[ind];
-            var ct = {
-                windturbineId: wb.windturbineId,
-                stationId: wb.stationId,
-                projectId: wb.projectId,
-                modelId: wb.modelId,
-                controlType: wb.controlType,
-                lockType: wb.lockType,
-                userName: this.LoginUser.userName,
-                userId: this.LoginUser.id,
-            };
-            pairs[ct.windturbineId] = ct;
-        }
-        axios.post(`http://${config.calcUrl}/api/control/send?isLockOrUnlock=${isLockOrUnlock}`, pairs)
-            .then(msg => {
-                success(msg);
-            })
-            .catch(err => {
-                error(err);
-            });
-        console.log(isLockOrUnlock);
-    }
-
-    /* 系统控制风机，自动下发命令 */
-    windturbineControlSystem(windturbines) {
-        var pairs = {};
-        for (var ind in windturbines) {
-            var wb = windturbines[ind];
-            var ct = {
-                windturbineId: wb.windturbineId,
-                stationId: wb.stationId,
-                projectId: wb.projectId,
-                modelId: wb.modelId,
-                controlType: wb.controlType,
-                lockType: wb.lockType,
-                userName: 'system',
-                userId: 0,
-            };
-            pairs[ct.windturbineId] = ct;
-        }
-        axios.post(`http://${config.calcUrl}/api/control/send?isLockOrUnlock=false`, pairs)
-            .then(msg => {
-                console.log(msg);
-            })
-            .catch(err => {
-                this.showdialog("错误", "风机控制出现错误", err.message);
-                console.log(err);
-            });
-    }
-
-    /* 标记 */
-    marking(windturbines) {
-        for (var v in windturbines) {
-            ++this.MarkIndex;
-            this.Marks.push({ title: windturbines[v].windturbineId, id: this.MarkIndex });
-        }
-    }
-
-    /* 移除标记 */
-    removeMarked(mk) {
-        var indx = -1;
-        for (var id in this.Marks) {
-            if (this.Marks[id].id == mk.id) {
-                indx = id;
-                break;
-            }
-        }
-        if (indx < 0) return;
-        this.Marks.splice(indx, 1);
-    }
-
-    /* 获取风机详情页面数据 */
-    initWinturbineBaseData(info,action){
-        axios.get(`http://${config.adapterUrl}/ts/latest?thingType=windturbine&thingId=${info.windturbineId}&uniformCodes=${info.codes}`)
-        .then(msg=>{
-            action(msg.data);
-        })
-        .catch(err=>{
-            console.log(err);
-        });
-    }
-
-    /* 单例 */
-    static getInstance() {
-        if (!BackgroundData.instance) {
-            BackgroundData.instance = new BackgroundData();
-        }
-        return BackgroundData.instance;
-    }
-}

src/assets/script/MessageBridge.js

@@ -1,125 +0,0 @@
-import Stomp from 'stompjs'
-import {config} from '../../config';
-
-export default class MessageBridge {
-  observers;// 观察者
-
-  calcSocket;// 后台websocket
-  adapterSocket;// 适配器websocket
-
-  constructor() {
-    this.register = this.register.bind(this);
-    this.unregister = this.unregister.bind(this);
-    this.onmessage = this.onmessage.bind(this);
-    this.getActions = this.getActions.bind(this);
-
-    this.observers = new Array();
-
-    this.calcSocket = new WebSocket(`ws://${config.calcUrl}/wisdom_service`, this.onmessage, ["/topic/suggestion", "/topic/sync-command-result", "/topic/fault-count",
-      "/topic/alarm-count", "/topic/fault-popup", "/topic/popup-remove", "/topic/heartbeat-data"]);
-    this.adapterSocket = new WebSocket(`ws://${config.adapterUrl}/wisdom`, this.onmessage, ["/topic/windturbine", "/topic/pv"]);
-  }
-
-  /* 单例 */
-  static getInstance() {
-    if (!MessageBridge.instance) {
-      MessageBridge.instance = new MessageBridge();
-    }
-    return MessageBridge.instance;
-  }
-
-  /* 获得消息 */
-  onmessage(msg) {
-    if(msg.headers["data-type"] && msg.headers["data-type"]=="heartbeat"){
-      console.log("获得心跳包！");
-      return;
-    }
-    if (msg.command != "MESSAGE" || !msg.headers.destination) return;
-    var os = this.getActions(msg.headers.destination);
-    for (var id in os) {
-      try{
-        os[id].action(msg.body,msg.headers);
-      }catch(e){console.log(e);}
-    }
-  }
-
-  getActions(destination){
-    var list = new Array();
-    for(var i in this.observers){
-      if(this.observers[i].key==destination){
-        list.push(this.observers[i]);
-      }
-    }
-    return list;
-  }
-
-  /* 注册消息 */
-  register(msgs) {
-    for(var i in msgs){
-      this.observers.push(msgs[i]);
-    }
-  }
-
-  /* 取消注册消息 */
-  unregister(msgs) {
-    this.observers.remove(msgs);
-  }
-}
-
-class WebSocket {
-  onmessage;
-  url;
-  settings;
-  client;
-  constructor(url, onmessage, settings) {
-    this.onerror = this.onerror.bind(this);
-    this.connectCallBackSubscribe = this.connectCallBackSubscribe.bind(this);
-    this.send = this.send.bind(this);
-    this.connect=this.connect.bind(this);
-
-    this.onmessage = onmessage;
-    this.url = url;
-    this.settings = settings;
-    try {
-      this.connect();
-    } catch (e) {
-      console.log("websocket连接错误:\n" + e);
-    }
-
-    console.log("websocket");
-  }
-
-  /* 连接 */
-  connect() {
-    console.log(`正在连接websocket [${this.url}]`)
-    this.client = Stomp.client(this.url);
-    this.client.connect("", "", this.connectCallBackSubscribe, this.onerror);
-  }
-
-  /* 检测连接是否正常 */
-  protector() {
-
-  }
-
-  /* 注册 */
-  connectCallBackSubscribe() {
-    console.log(`注册消息${this.settings}`)
-    for (var index in this.settings) {
-      this.client.subscribe(this.settings[index], frame => this.onmessage(frame));
-    }
-  }
-
-  /* 发送 */
-  send(destination, headers, body) {
-    if (this.client.connected) {
-      this.client.send(destination, headers, body);
-    }
-  }
-
-  /* 发生错误 */
-  onerror(error) {
-    console.log(`websocket [${this.url}] 连接出现错误：\n${error.message}`);
-    // TODO 断线重连还有问题
-    setTimeout(this.connect(), 5000);
-  }
-}

src/assets/style/main.css

@@ -41,15 +41,24 @@ body,
 .el-dialog__title{
   color: rgb(220, 220, 220) !important;
 }
+.inputs .el-input__inner{
+  background-color: #000000 !important;
+  color: rgb(220, 220, 220) !important;
+}
 .el-input__inner{
-  background-color: rgb(100,100,100) !important;
+  /* background-color: rgb(100,100,100) !important; */
   color: rgb(220, 220, 220) !important;
+  border: 1px solid rgba(77, 77, 77, 1) !important;
 }
 .el-tabs{
   background-color: black !important;
   border: none !important;
   color: rgb(220,220,220) !important;
 }
+.el-table__empty-block{
+  background-color: #141414;
+  border: none;
+}
 .el-tabs__item{
   background-color: #363636 !important;
   color: rgb(220,220,220) !important;
@@ -87,9 +96,28 @@ body,
     border-right:1px solid rgb(36,36,36);
   
   }
-  .el-table__body-wrapper{
-    background-color: black;
-  }
+  
   .el-table__empty-text{
     color: black;
+  }
+
+  .el-tree-node:focus>.el-tree-node__content {
+    background-color: #000000 !important;
+  }
+
+  .el-tree-node__content:hover {
+    background-color: #000000 !important;
+  }
+  .el-notification .el-icon-success{
+    color: #67C23A !important;
+  }
+  .el-notification .el-icon-warning {
+    color: #E6A23C !important;
+  }
+  .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
+    border-bottom: 2px solid black !important;
+  }
+  .el-table__body-wrapper::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
   }

src/background.js

@@ -3,7 +3,6 @@
 import { app, protocol, BrowserWindow } from 'electron'
 import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
 import installExtension, { VUEJS3_DEVTOOLS } from 'electron-devtools-installer'
-
 const isDevelopment = process.env.NODE_ENV !== 'production'
 
 // Scheme must be registered before the app is ready
@@ -19,12 +18,14 @@ async function createWindow() {
     frame:false,
     fullscreen:true,
     webPreferences: {
-
+      
       // Use pluginOptions.nodeIntegration, leave this alone
       // See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
+      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
+      contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
       nodeIntegration: true,
       contextIsolation: false,
-      enableRemoteModule: true
+      enableRemoteModule: true,   // 打开remote模块
     }
   })
 
@@ -61,7 +62,7 @@ app.on('ready', async () => {
   if (isDevelopment && !process.env.IS_TEST) {
     // Install Vue Devtools
     try {
-      await installExtension(VUEJS_DEVTOOLS)
+      await installExtension(VUEJS3_DEVTOOLS)
     } catch (e) {
       console.error('Vue Devtools failed to install:', e.toString())
     }

src/components/BoosterStation/previewPicture.vue

@@ -0,0 +1,722 @@
+<template>
+  <div class="pop-up-main">
+    <div class="paln-box">
+      <div
+        class="movableItem"
+        :style="{ width: width, height: height }"
+        @mousewheel="rollImg($event)"
+        @mousedown="drag($event, 1)"
+        ref="bigImage"
+      >
+        <!-- 图片不可选中 或不可拖拽到新标签打开-->
+        <slot
+          name="svg"
+          oncontextmenu="return false;"
+          onselectstart="return false;"
+          draggable="false"
+        ></slot>
+        <template v-if="isEdit && iconWidth">
+          <img
+            ref="signImage"
+            :src="iconImgUrl"
+            @mousedown="dragSign($event, key)"
+            v-for="(item, key) in equipment"
+            :key="key"
+            :style="{
+              top: equipment[key].top + '%',
+              left: equipment[key].left + '%',
+              width: iconWidth,
+              height: iconHeight,
+            }"
+            class="equipment"
+          />
+        </template>
+        <el-popover
+          width="200"
+          placement="bottom-start"
+          trigger="hover"
+          :close-delay="100"
+          content="暂无描述"
+          v-else-if="!isEdit && iconWidth && arrIcon.length == equipment.length"
+          v-for="(item, key) in equipment"
+          :key="key"
+          popper-class="preview-popover"
+        >
+          <!-- &&arrIcon.length==equipment.length -->
+          <template>
+            <div v-if="equipment[key].describe" class="describe">
+              <p class="describe-top">
+                {{ equipment[key].describe.deviceName }}
+              </p>
+              <p class="describe-center">
+                {{ equipment[key].describe.remark }}
+              </p>
+              <p class="describe-bottom">
+                {{ equipment[key].describe.location }}
+              </p>
+            </div>
+          </template>
+          <!-- <img oncontextmenu="return false;" onselectstart="return false;" draggable="false" slot="reference"
+						ref="signImage" :src="$baseUrl + equipment[key].iconImgUrl"
+						:style="{top:equipment[key].top+'%',left:equipment[key].left+'%',width:arrIcon[key].iconWidth,height:arrIcon[key].iconHeight}"
+						class="equipment" /> -->
+        </el-popover>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    equipment: {
+      type: Array,
+      default: () => {
+        return [
+          {
+            iconImgUrl: "",
+            top: 0,
+            left: 0,
+          },
+        ];
+      },
+    },
+    isEdit: {
+      default: false,
+    },
+    imgUrl: {},
+  },
+
+  data() {
+    return {
+      // 定时器
+      timer: "",
+      // 图片加载失败
+      imgOnerror: false,
+      imgIndex: 0,
+      isChange: true,
+      // 图片显示默认大小
+      width: "1200px",
+      height: "800px",
+      // 可缩小倍数,为空则可无限缩小
+      minification: 3,
+      // 可放大倍数 为空则可无限放大
+      magnification: "",
+      bigMaxWidth: 1100,
+      bigMaxHeight: 800,
+
+      // 小图标信息
+      iconImgUrl: "",
+      iconWidth: "",
+      // 存储每个小图标处理好的宽高
+      iconHeight: "",
+      arrIcon: [],
+      iconMaxWidth: 32,
+      iconMaxHeight: 32,
+      tog: 1,
+    };
+  },
+  methods: {
+    // 获取图片大小
+    getImgInfo(
+      imgUrl,
+      MaxWidth,
+      MaxHeight,
+      StrWidth,
+      StrHeight,
+      Array = false,
+      arr,
+      num = 0
+    ) {
+      let img = new Image();
+
+      // img.src = imgUrl;
+      img = document.getElementsByClassName("svg");
+      let _this = this;
+      img.onerror = () => {
+        // console.log("加载失败！！", _this.arrIcon.length);
+        // console.log(imgUrl, MaxWidth, MaxHeight, StrWidth, StrHeight);
+        _this.imgOnerror = true;
+        _this.imgIndex =
+          _this.arrIcon.length - 1 < 0 ? 0 : _this.arrIcon.length - 1;
+        this.timer = setTimeout(() => {
+          if (num <= 5) {
+            _this.getImgInfo(
+              imgUrl,
+              MaxWidth,
+              MaxHeight,
+              StrWidth,
+              StrHeight,
+              Array,
+              arr,
+              num + 1
+            );
+          }
+          clearInterval(this.timer);
+        }, 2000);
+      };
+      img.onload = function (e) {
+        //  显示时 初始 最大宽度
+        let maxWidth = MaxWidth;
+        //  显示时 初始 最大高度
+        let maxHeight = MaxHeight;
+        if (
+          e.path[0].naturalWidth <= maxWidth &&
+          e.path[0].naturalHeight <= maxHeight
+        ) {
+          _this[StrWidth] = e.path[0].naturalWidth + "px";
+          _this[StrHeight] = e.path[0].naturalHeight + "px";
+        } else {
+          _this[StrWidth] = e.path[0].naturalWidth + "px";
+          _this[StrHeight] = e.path[0].naturalHeight + "px";
+          if (
+            e.path[0].naturalWidth > maxWidth &&
+            e.path[0].naturalHeight <= maxHeight
+          ) {
+            let ratio = e.path[0].naturalWidth / e.path[0].naturalHeight;
+            _this[StrWidth] = "1600px";
+            _this[StrHeight] = maxWidth / ratio + "px";
+          } else if (
+            e.path[0].naturalWidth <= maxWidth &&
+            e.path[0].naturalHeight > maxHeight
+          ) {
+            let ratio = e.path[0].naturalWidth / e.path[0].naturalHeight;
+            _this[StrWidth] = maxHeight * ratio + "px";
+            _this[StrHeight] = "800px";
+          } else if (
+            e.path[0].naturalWidth > maxWidth &&
+            e.path[0].naturalHeight > maxHeight
+          ) {
+            let ratio = e.path[0].naturalWidth / e.path[0].naturalHeight;
+            let w = maxWidth;
+            let h = w / ratio;
+            if (h > maxHeight) {
+              let ratio2 = w / h;
+              h = maxHeight;
+              w = h * ratio2;
+            }
+            _this[StrWidth] = w + "px";
+            _this[StrHeight] = h + "px";
+          }
+        }
+        if (Array) {
+          _this[arr].push({
+            iconWidth: _this[StrWidth],
+            iconHeight: _this[StrHeight],
+          });
+          // console.log(
+          // 	"tow#################################arrIcon",
+          // 	_this[arr].length
+          // );
+        }
+        // _this[StrWidth] = `${e.path[0].naturalWidth}px`;
+        // _this[StrHeight] = `${e.path[0].naturalHeight}px`;
+        // vm.$set(vm.imgInfo, "width", img.width);
+        // vm.$set(vm.imgInfo, "height", img.height);
+        // console.log("打印图片信息", imgUrl, _this[StrWidth], _this[StrHeight]); // 打印图片信息
+
+        // console.log("打印图片信息", e.path[0].naturalHeight); // 打印图片信息
+        // console.log("打印图片信息", e); // 打印图片信息
+        // console.log("打印图片信息this.width", _this[StrWidth]); // 打印图片信息
+        // console.log("打印图片信息this.height", _this[StrHeight]); // 打印图片信息
+      };
+    },
+    // 缩放
+    rollImg() {
+      let that = this;
+      // let oImg = document.getElementsByClassName("movableItem")[0];
+      let oImg = this.$refs.bigImage;
+      // console.log(
+      // 	"length",
+      // 	document.getElementsByClassName("movableItem").length
+      // );
+      // console.log("oImg", oImg);
+      let _this = this;
+
+      function fnWheel(obj, fncc) {
+        obj.onmousewheel = fn;
+        if (obj.addEventListener) {
+          obj.addEventListener("DOMMouseScroll", fn, false);
+        }
+
+        function fn(ev) {
+          let oEvent = ev || window.event;
+          let down = true;
+          if (oEvent.detail) {
+            down = oEvent.detail > 0;
+          } else {
+            down = oEvent.wheelDelta < 0;
+          }
+          if (fncc) {
+            fncc.call(this, down, oEvent);
+          }
+          if (oEvent.preventDefault) {
+            oEvent.preventDefault();
+          }
+          return false;
+        }
+      }
+      fnWheel(oImg, function (down, oEvent) {
+        let oldWidth = this.offsetWidth;
+        let oldHeight = this.offsetHeight;
+        let oldLeft = this.offsetLeft;
+        let oldTop = this.offsetTop;
+        let parent = oEvent.path[2];
+        // 获取父元素距离页面可视区域的位置
+        let parentLeft = parent.getBoundingClientRect().left;
+        let parentTop = parent.getBoundingClientRect().top;
+        // 比例 = （点击位置距离可视窗口位置 - 父元素距离可视窗口位置 - 相对定位的left）/ 本身宽度
+        let scaleX = (oEvent.clientX - parentLeft - oldLeft) / oldWidth; //比例
+        let scaleY = (oEvent.clientY - parentTop - oldTop) / oldHeight;
+
+        let nowWidth = this.style.width.split("p")[0];
+        let initWidth = _this.width.split("p")[0];
+        let initHeight = _this.height.split("p")[0];
+
+        let miniFlag = true;
+        let magniFlag = true;
+        if (_this.minification) {
+          // 限制缩小范围
+          if (nowWidth <= parseInt(initWidth / _this.minification)) {
+            miniFlag = false;
+            // console.log("限制缩小范围");
+            // console.log(
+            // 	"限制缩小范围",
+            // 	nowWidth,
+            // 	parseInt(initWidth / _this.minification)
+            // );
+            this.style.width = parseInt(initWidth / _this.minification) + "px";
+            this.style.height =
+              parseInt(initHeight / _this.minification) + "px";
+          }
+          if (_this.magnification) {
+            // 限制放大范围
+            if (nowWidth >= parseInt(initWidth * _this.magnification)) {
+              magniFlag = false;
+              // console.log("限制放大范围");
+              this.style.width =
+                parseInt(initWidth * _this.magnification) + "px";
+              this.style.height =
+                parseInt(initHeight * _this.magnification) + "px";
+            }
+          }
+        }
+
+        if (down && miniFlag) {
+          this.style.width = parseInt(this.offsetWidth * 0.9) + "px";
+          this.style.height = parseInt(this.offsetHeight * 0.9) + "px";
+
+          that.width = parseInt(this.offsetWidth * 0.9) + "px";
+          that.height = parseInt(this.offsetHeight * 0.9) + "px";
+        } else if (!down && magniFlag) {
+          // console.log("放大");
+          this.style.width = parseInt(this.offsetWidth * 1.1) + "px";
+          this.style.height = parseInt(this.offsetHeight * 1.1) + "px";
+          that.width = parseInt(this.offsetWidth * 1.1) + "px";
+          that.height = parseInt(this.offsetHeight * 1.1) + "px";
+        }
+        let newWidth = this.offsetWidth;
+        let newHeight = this.offsetHeight;
+
+        // 新的相对位置left = 原先的相对位置left - 比例 *（本身新的宽度-旧的宽度）
+        this.style.left =
+          Math.round(this.offsetLeft - scaleX * (newWidth - oldWidth)) + "px";
+        this.style.top =
+          Math.round(this.offsetTop - scaleY * (newHeight - oldHeight)) + "px";
+      });
+      // console.log(that.width)
+    },
+    // },
+    //拖拽
+    drag(ev) {
+      // let ie = document.all;
+      let nn6 = document.getElementById && !document.all;
+      let isdrag = false;
+      let y, x;
+      let nTY, nTX;
+      let oDragObj;
+
+      function moveMouse(e) {
+        if (isdrag) {
+          oDragObj.style.top =
+            (nn6 ? nTY + e.clientY - y : nTY + event.clientY - y) + "px";
+          oDragObj.style.left =
+            (nn6 ? nTX + e.clientX - x : nTX + event.clientX - x) + "px";
+          return false;
+        }
+      }
+
+      function initDrag(e) {
+        // console.log("点击图片initDrag");
+        let oDragHandle = nn6 ? e.target : event.srcElement;
+        let topElement = "HTML";
+        while (
+          oDragHandle.tagName != topElement &&
+          oDragHandle.className != "movableItem"
+        ) {
+          oDragHandle = nn6
+            ? oDragHandle.parentNode
+            : oDragHandle.parentElement;
+        }
+        if (oDragHandle.className == "movableItem") {
+          isdrag = true;
+          oDragObj = oDragHandle;
+          // 父元素宽高
+          let width = e.path[2].offsetWidth;
+          let height = e.path[2].offsetHeight;
+          // 这里判断第一次获取不到style 样式 默认为 居中50%
+          if (oDragObj.style.top == "") {
+            nTY = 0;
+            nTX = parseInt((50 * width) / 100 + 0);
+          } else {
+            nTY = parseInt(oDragObj.style.top + 0);
+            nTX = parseInt(oDragObj.style.left + 0);
+          }
+          y = nn6 ? e.clientY : event.clientY;
+          x = nn6 ? e.clientX : event.clientX;
+          oDragObj.style.cursor = "move";
+          document.onmousemove = moveMouse;
+          return false;
+        }
+      }
+      document.onmousemove = initDrag;
+      // document.onmouseup = new Function("isdrag=false");
+      document.onmouseup = function (e) {
+        isdrag = false;
+        document.onmousemove = null;
+        document.onmouseup = null;
+        let oDragHandle = nn6 ? e.target : event.srcElement;
+        let topElement = "HTML";
+        while (
+          oDragHandle.tagName != topElement &&
+          oDragHandle.className != "movableItem"
+        ) {
+          oDragHandle = nn6
+            ? oDragHandle.parentNode
+            : oDragHandle.parentElement;
+        }
+        if (oDragHandle.className == "movableItem") {
+          oDragObj = oDragHandle;
+          oDragObj.style.cursor = "Default";
+        }
+      };
+      ev = event || window.event;
+
+      // 取消事件冒泡行为
+      // window.event ? (window.event.cancelBubble = true) : ev.stopPropagation();
+    },
+    // 拖拽标记
+    // eslint-disable-next-line no-unused-lets
+    dragSign(ev, key) {
+      let nn6 = document.getElementById && !document.all;
+      let isdrag = false;
+      let y, x;
+      let nTY, nTX;
+      let oDragObj;
+      let _this = this;
+
+      function moveMouse(e) {
+        if (isdrag) {
+          this.equipmentKey = key;
+          // console.log("thisequipmentKey", this.equipmentKey);
+
+          let widthItem = e.path[1].style.width.split("p");
+          let heightItem = e.path[1].style.height.split("p");
+          let width = widthItem[0];
+          // eslint-disable-next-line no-unused-lets
+          let height = heightItem[0];
+          let top =
+            ((nn6
+              ? (nTY / 100) * height + e.clientY - y
+              : (nTY / 100) * height + event.clientY - y) /
+              height) *
+            100;
+          let left =
+            ((nn6
+              ? (nTX / 100) * width + e.clientX - x
+              : (nTX / 100) * width + event.clientX - x) /
+              width) *
+            100;
+
+          if (top >= 0 && top <= 100) {
+            _this.equipment[key].top = top;
+          }
+          if (left >= 0 && left <= 100) {
+            _this.equipment[key].left = left;
+          }
+
+          return false;
+        }
+      }
+      // eslint-disable-next-line no-unused-vars
+      function initDrag(e) {
+        // console.log("_this", _this);
+        let oDragHandle = nn6 ? e.target : event.srcElement;
+        let topElement = "HTML";
+        while (
+          oDragHandle.tagName != topElement &&
+          oDragHandle.className.indexOf("equipment") == -1
+        ) {
+          oDragHandle = nn6
+            ? oDragHandle.parentNode
+            : oDragHandle.parentElement;
+        }
+        if (oDragHandle.className.indexOf("equipment") != -1) {
+          isdrag = true;
+          oDragObj = oDragHandle;
+          // 父元素宽高
+          let width = e.path[1].offsetWidth;
+          // let height = e.path[1].offsetHeight;
+          // console.log(width, height);
+          // console.log("oDragObj.style", oDragObj.style);
+          // 这里判断第一次获取不到style 样式 默认为 居中50%
+          if (oDragObj.style.top == "") {
+            // nTY = parseInt((50 * height) / 100 + 0);
+            nTY = 0;
+            nTX = parseInt((50 * width) / 100 + 0);
+          } else if (oDragObj.style.top.indexOf("%") != -1) {
+            nTY = oDragObj.style.top.split("%")[0];
+            nTX = oDragObj.style.left.split("%")[0];
+          } else {
+            nTY = parseInt(oDragObj.style.top + 0);
+            nTX = parseInt(oDragObj.style.left + 0);
+          }
+          y = nn6 ? e.clientY : event.clientY;
+          x = nn6 ? e.clientX : event.clientX;
+
+          oDragObj.style.cursor = "move";
+          document.onmousemove = moveMouse;
+          return false;
+        }
+      }
+
+      // document.onmousedown = initDrag;
+      document.onmousemove = initDrag;
+
+      document.onmouseup = function (e) {
+        isdrag = false;
+        document.onmousemove = null;
+        document.onmouseup = null;
+        let oDragHandle = nn6 ? e.target : event.srcElement;
+        let topElement = "HTML";
+        while (
+          oDragHandle.tagName != topElement &&
+          oDragHandle.className != "equipment"
+        ) {
+          oDragHandle = nn6
+            ? oDragHandle.parentNode
+            : oDragHandle.parentElement;
+        }
+        if (oDragHandle.className == "equipment") {
+          oDragObj = oDragHandle;
+          oDragObj.style.cursor = "Default";
+        }
+      };
+
+      // _this.equipmentKey = key;
+      // _this.equipment[_this.equipmentKey].left = l;
+      // _this.equipment[_this.equipmentKey].top = t;
+      ev = event || window.event;
+
+      // 取消事件冒泡行为
+      window.event ? (window.event.cancelBubble = true) : ev.stopPropagation();
+    },
+  },
+
+  watch: {
+    equipment() {
+      if (this.equipment.length != 0) {
+        this.arrIcon = [];
+        let finish = true;
+        this.equipment.filter((item) => {
+          if (!item.iconImgUrl) {
+            finish = false;
+          }
+          return true;
+        });
+        // console.log("finish", finish);
+        if (finish) {
+          this.equipment.filter((item, index) => {
+            if (index >= this.imgIndex) {
+              console.log("iconImgUrl", this.equipment[index].iconImgUrl);
+              this.getImgInfo(
+                this.$baseUrl + item.iconImgUrl,
+                this.iconMaxWidth,
+                this.iconMaxHeight,
+                "iconWidth",
+                "iconHeight",
+                true,
+                "arrIcon"
+              );
+            }
+            console.log("22filter", index);
+            return true;
+          });
+        }
+      }
+    },
+  },
+  created() {
+    this.getImgInfo(
+      this.imgUrl,
+      this.bigMaxWidth,
+      this.bigMaxHeight,
+      "width",
+      "height"
+    );
+    if (this.equipment.length != 0) {
+      this.arrIcon = [];
+      let finish = true;
+      this.equipment.filter((item) => {
+        if (!item.iconImgUrl) {
+          finish = false;
+        }
+        return true;
+      });
+      // console.log("finish", finish);
+      if (finish) {
+        this.equipment.filter((item, index) => {
+          if (index >= this.imgIndex) {
+            // console.log("iconImgUrl", this.equipment[index].iconImgUrl);
+            this.getImgInfo(
+              this.$baseUrl + item.iconImgUrl,
+              this.iconMaxWidth,
+              this.iconMaxHeight,
+              "iconWidth",
+              "iconHeight",
+              true,
+              "arrIcon"
+            );
+          }
+          // console.log("22filter", index);
+          return true;
+        });
+      }
+    }
+
+    this.iconImgUrl = JSON.parse(
+      JSON.stringify(this.$baseUrl + this.equipment[0].iconImgUrl)
+    );
+    // console.log("imgUrl", this.imgUrl);
+    // console.log("equipment", this.equipment);
+    // //禁止鼠标右键
+    // document.oncontextmenu = function() {
+    //   return false;
+    // };
+  },
+};
+</script>
+<style lang="less">
+.preview-popover {
+  background-color: #d3edf7dd;
+  padding: 12px;
+
+  .popper__arrow::after {
+    border-bottom-color: #d3edf7dd !important;
+  }
+
+  .describe {
+    p {
+      padding-bottom: 5px;
+
+      &:last-child {
+        padding-bottom: 0px;
+      }
+    }
+
+    .describe-top {
+      // color: sandybrown;
+      // color: red;
+      color: rgb(21, 110, 110);
+    }
+
+    .describe-center {
+      color: rgb(79, 21, 206);
+    }
+
+    .describe-bottom {
+      color: rgb(30, 31, 29);
+    }
+  }
+}
+</style>
+<style lang="less" scoped>
+.pop-up-main {
+		width: 100%;
+		height: calc(100vh - 32vh);
+		overflow-y:hidden ;
+
+		.paln-box {
+			width: 100%;
+			height: 100%;
+			position: relative;
+
+			.movableItem {
+				position: absolute;
+				// top: 75%;
+				left: 50%;
+				transform: translate(-50%, -15%);
+
+				img,
+				.svg {
+					z-index: 1;
+					width: 100%;
+					height: 100%;
+				}
+
+				.equipment {
+					position: absolute;
+					top: 0;
+					left: 0;
+					transform: translate(-50%, -50%);
+					z-index: 2;
+					font-size: 40px;
+					// color: red;
+					// background: blue;
+					zoom: 1;
+				}
+			}
+
+			.shuaxin {
+				position: absolute;
+				z-index: 2;
+				font-size: 40px;
+				top: 20px;
+				left: 20px;
+				cursor: pointer;
+
+				&:hover {
+					color: yellowgreen;
+				}
+			}
+
+			.equipment {
+				color: white;
+			}
+
+			&/deep/.el-button {
+				z-index: 2;
+				position: absolute;
+				bottom: 60px;
+				right: 20px;
+				width: 60px;
+				height: 35px;
+
+				span {
+					display: inline-block;
+					position: absolute;
+					top: 50%;
+					left: 50%;
+					transform: translate(-50%, -50%);
+				}
+
+				i {
+					display: inline-block;
+					position: absolute;
+					top: 50%;
+					left: 25%;
+					transform: translate(-50%, -50%);
+				}
+			}
+		}
+	}
+</style>

src/components/CenterPage.vue

@@ -1,120 +0,0 @@
-/* 中间页面 */
-<template>
-  <div class="center-bar">
-    <el-row :gutter="10">
-      <el-col :span="8">
-        <ProblemArea ref="problempg" :problems="problems" />
-      </el-col>
-      <el-col :span="8">
-        <el-row>
-          <el-col :span="24">
-            <ControlArea />
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="24">
-            <CheckArea />
-          </el-col>
-        </el-row>
-      </el-col>
-      <el-col :span="8">
-        <el-row>
-          <el-col :span="24">
-            <RecommendedArea />
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="24">
-            <LabelArea />
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="24">
-            <AlarmArea />
-          </el-col>
-        </el-row>
-      </el-col>
-    </el-row>
-  <WindturbineDetailPages v-model="dialogVisible"></WindturbineDetailPages>
-  </div>
-</template>
-<script>
-import AlarmArea from "./area/AlarmArea.vue";
-import CheckArea from "./area/CheckArea.vue";
-import ControlArea from "./area/ControlArea.vue";
-import LabelArea from "./area/LabelArea.vue";
-import ProblemArea from "./area/ProblemArea.vue";
-import RecommendedArea from "./area/RecommendedArea.vue";
-import WindturbineDetailPages from "./area/windturbine/WindturbineDetailPages.vue"
-/* import wtbdp from './area/wtbDetailPages'; */
-
-export default {
-  data(){
-    return{
-      dialogVisible:false
-    }
-  },
-  mounted(){
-    /* var self=this;
-    wtbdp.$on("evnt",function(){
-      self.dialogVisible=true;
-    }); */
-  },
-  components: {
-    AlarmArea,
-    CheckArea,
-    ControlArea,
-    LabelArea,
-    ProblemArea,
-    RecommendedArea,
-    WindturbineDetailPages
-  },
-  props: {
-    /* temp: {
-      type: Onject | Array,
-      default: [],
-    }, */
-  },
-  created: function () {
-      
-  },
-  computed: {
-    problems: {
-      get: function () {
-        return this.datas;
-      },
-      set: function (params) {
-        this.datas = params;
-        this.$refs.problempg.problems = params;
-      },
-    },
-  },
-  methods: {
-
-  },
-  watch: {
-    /* temp(res) {
-      this.mapData = res;
-    }, */
-  },
-};
-</script>
-
-<style scoped>
-.center-bar {
-  position: relative;
-  box-sizing: border-box;
-  height: 90vh;
-  background-color: #000000;
-  padding-top: 10px;
-  padding-left: 5px;
-  padding-right: 5px;
-  padding-bottom: 5px;
-  margin-top: 0;
-  margin-right: 0;
-  margin-bottom: 3px;
-  margin-left: 0;
-  display: flex;
-  flex-direction: column;
-}
-</style>

src/components/StatusBar.vue

@@ -1,366 +0,0 @@
-/* 状态栏 */
-<template>
-  <div class="status-bar" onselectstart="return false">
-    <el-row>
-      <el-col :span="18" style="margin-top: 8px">
-        <span style="color: white; margin-left: 20px">系统时间：</span>
-        <span style="color: white">{{ currentTime }}</span>
-      </el-col>
-      <el-col :span="6" style="margin-top: 8px">
-        <el-popover
-          placement="top-start"
-          :width="521"
-          trigger="hover"
-          class="popoverBack"
-          :show-arrow="false"
-        >
-          <template #reference>
-            <div class="status-list">
-              <img
-                class="status-img"
-                src="../assets/img/statusbar/hidden_danger.png"
-              />
-              <span class="status-label hidden-danger">隐患</span>
-              <span>{{ hiddenDangerNum }}</span>
-            </div>
-          </template>
-          <el-scrollbar>
-            <el-table
-              :data="hiddenDangerData"
-              border
-              border-color="rgb(36,36,36)"
-              max-height="650px"
-              :header-cell-style="{
-                background: 'Black',
-                color: 'rgb(220,220,220)',
-                'border-bottom':'solid 1px rgb(36,36,36)'
-              }"
-              :cell-style="{ background: 'Black', color: 'rgb(220,220,220)' }"
-            >
-              <el-table-column
-                width="160"
-                property="lastUpdateTime"
-                label="时间"
-                align="center"
-              ></el-table-column>
-              <el-table-column
-                width="110"
-                property="windturbineId"
-                label="设备"
-                align="center"
-              ></el-table-column>
-              <el-table-column
-                width="250"
-                property="alertText"
-                label="故障信息"
-                align="center"
-              ></el-table-column>
-            </el-table>
-          </el-scrollbar>
-        </el-popover>
-        <el-popover
-          placement="top-start"
-          :width="521"
-          trigger="hover"
-          class="popoverBack"
-          :show-arrow="false"
-        >
-          <template #reference>
-            <div class="status-list">
-              <img
-                class="status-img"
-                src="../assets/img/statusbar/defect.png"
-              />
-              <span class="status-label defect">缺陷</span>
-              <span>{{ defectNum }}</span>
-            </div>
-          </template>
-          <el-scrollbar>
-          <el-table
-            :data="defectData"
-            border
-            border-color="rgb(36,36,36)"
-            max-height="650px"
-            :header-cell-style="{
-              background: 'Black',
-              color: 'rgb(220,220,220)',
-                'border-bottom':'solid 1px rgb(36,36,36)'
-            }"
-            :cell-style="{ background: 'Black', color: 'rgb(220,220,220)' }"
-          >
-            <el-table-column
-              width="160"
-              property="lastUpdateTime"
-              label="时间"
-              align="center"
-            ></el-table-column>
-            <el-table-column
-              width="110"
-              property="windturbineId"
-              label="设备"
-              align="center"
-            ></el-table-column>
-            <el-table-column
-              width="250"
-              property="alertText"
-              label="故障信息"
-              align="center"
-            ></el-table-column>
-          </el-table>
-          </el-scrollbar>
-        </el-popover>
-        <el-popover
-          placement="top-start"
-          :width="521"
-          trigger="hover"
-          class="popoverBack"
-          :show-arrow="false"
-        >
-          <template #reference>
-            <div class="status-list">
-              <img
-                class="status-img"
-                src="../assets/img/statusbar/malfunction.png"
-              />
-              <span class="status-label malfunction">故障</span>
-              <span>{{ malfunctionNum }}</span>
-            </div>
-          </template>
-          <el-scrollbar>
-          <el-table
-            :data="malfunctionData"
-            border
-            border-color="rgb(36,36,36)"
-            max-height="650px"
-            :header-cell-style="{
-              background: 'Black',
-              color: 'rgb(220,220,220)',
-                'border-bottom':'solid 1px rgb(36,36,36)'
-            }"
-            :cell-style="{ background: 'Black', color: 'rgb(220,220,220)' }"
-          >
-            <el-table-column
-              width="160"
-              property="lastUpdateTime"
-              label="时间"
-              align="center"
-            ></el-table-column>
-            <el-table-column
-              width="110"
-              property="stationName"
-              label="设备"
-              align="center"
-            ></el-table-column>
-            <el-table-column
-              width="250"
-              property="alertText"
-              label="故障信息"
-              align="center"
-            ></el-table-column>
-          </el-table>
-          </el-scrollbar>
-        </el-popover>
-        <el-popover
-          placement="top-start"
-          :width="521"
-          trigger="hover"
-          class="popoverBack"
-          :show-arrow="false"
-        >
-          <template #reference>
-            <div class="status-list">
-              <img
-                class="status-img"
-                src="../assets/img/statusbar/accident.png"
-              />
-              <span class="status-label accident">事故</span>
-              <span>{{ accidentNum }}</span>
-            </div>
-          </template>
-          <el-scrollbar>
-          <el-table
-            :data="accidentData"
-            border
-            border-color="rgb(36,36,36)"
-            max-height="650px"
-            :header-cell-style="{
-              background: 'Black',
-              color: 'rgb(220,220,220)',
-                'border-bottom':'solid 1px rgb(36,36,36)'
-            }"
-            :cell-style="{ background: 'Black', color: 'rgb(220,220,220)' }"
-          >
-            <el-table-column
-              width="160"
-              property="lastUpdateTime"
-              label="时间"
-              align="center"
-            ></el-table-column>
-            <el-table-column
-              width="110"
-              property="stationName"
-              label="设备"
-              align="center"
-            ></el-table-column>
-            <el-table-column
-              width="250"
-              property="alertText"
-              label="故障信息"
-              align="center"
-            ></el-table-column>
-          </el-table>
-          </el-scrollbar>
-        </el-popover>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import BackgroundData from "../assets/script/BackgroundData";
-export default {
-  data() {
-    return {
-      hiddenDangerNum: 0,
-      defectNum: 0,
-      malfunctionNum: 0,
-      accidentNum: 0,
-      statusTimer: "",
-      currentTime: "",
-
-      hiddenDangerData: new Array(),
-      defectData: new Array(),
-      malfunctionData: new Array(),
-      accidentData: new Array(),
-    };
-  },
-  mounted() {
-    let that = this;
-    this.statusTimer = setInterval(function () {
-      that.currentTime =
-        new Date().getFullYear() +
-        "-" +
-        that.appendZero(new Date().getMonth() + 1) +
-        "-" +
-        that.appendZero(new Date().getDate()) +
-        " " +
-        that.appendZero(new Date().getHours()) +
-        ":" +
-        that.appendZero(new Date().getMinutes()) +
-        ": " +
-        that.appendZero(new Date().getSeconds());
-    }, 1000);
-  },
-  beforeDestory() {
-    clearInterval(this.statusTimer);
-    this.statusTimer = null;
-  },
-  created() {
-    this.refreshTimer = setInterval(this.refreshData, 2000);
-  },
-  methods: {
-    appendZero(obj) {
-      if (obj < 10) {
-        return "0" + obj;
-      } else {
-        return obj;
-      }
-    },
-    refreshData() {
-      var bd = BackgroundData.getInstance();
-      this.hiddenDangerNum = bd.HiddenProblems.length;
-      this.defectNum = bd.Defects.length;
-      this.malfunctionNum = bd.Failure.length;
-      this.accidentNum = bd.Accidents.length;
-
-      this.hiddenDangerData = bd.HiddenProblems;
-      this.defectData = bd.Defects;
-      this.malfunctionData = bd.Failure;
-      this.accidentData = bd.Accidents;
-/*       if (this.accidentData.length <= 0) {
-        this.accidentData = [
-          { lastUpdateTime: "-", stationName: "-", alertText: "-" },
-        ];
-      }
-      if (this.hiddenDangerData.length <= 0) {
-        this.hiddenDangerData = [
-          { lastUpdateTime: "-", windturbineId: "-", alertText: "-" },
-        ];
-      }
-      if (this.defectData.length <= 0) {
-        this.defectData = [
-          { lastUpdateTime: "-", windturbineId: "-", alertText: "-" },
-        ];
-      }
-      if (this.malfunctionData.length <= 0) {
-        this.malfunctionData = [
-          { lastUpdateTime: "-", stationName: "-", alertText: "-" },
-        ];
-      } */
-
-    },
-  },
-};
-</script>
-
-<style scoped>
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
-  width: 8px;
-  background-color: black;
-}
-
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
-  background-color: #292929;
-  border-radius: 6px;
-}
-:deep(.el-table td,.el-table th){
-border-bottom:1px solid rgb(36,36,36);
-}
-span {
-  font-size: 13px;
-}
-
-.status-bar {
-  height: 4vh;
-  background-color: #191919;
-
-  margin-bottom: 0;
-  margin-left: 0;
-  margin-right: 0;
-}
-
-.status-list {
-  position: relative;
-  display: inline-block;
-  box-sizing: border-box;
-  color: white;
-}
-
-.status-label {
-  margin-left: 10px;
-  margin-right: 10px;
-}
-
-.status-img {
-  position: relative;
-  top: 4px;
-  margin-left: 20px;
-  width: 20px;
-}
-
-.status-label.hidden-danger {
-  color: #e6d541;
-}
-
-.status-label.defect {
-  color: #e69641;
-}
-
-.status-label.malfunction {
-  color: #d541e6;
-}
-
-.status-label.accident {
-  color: #af3e3d;
-}
-</style>

src/components/TitleBar.vue

@@ -1,513 +0,0 @@
-/* 标题栏 */
-<template>
-  <div class="title-bar" onselectstart="return false">
-    <el-row>
-      <el-col :span="2">
-        <img
-          class="logo"
-          src="../assets/img/main_window/logo.png"
-          sytle="align-items"
-        />
-      </el-col>
-      <el-col :span="1">
-        <div>
-          <el-dialog
-            title="用户登录"
-            v-model="dialogVisible"
-            width="21%"
-            :before-close="handleClose"
-            :show-close="false"
-          >
-            <el-form :model="form">
-              <el-form-item :label="loginMessage"> </el-form-item>
-              <el-form-item label="用户名：" :label-width="formLabelWidth">
-                <el-input
-                  v-model="form.name"
-                  autocomplete="off"
-                  type="text"
-                  placeholder="用户名"
-                  style="width: 80%"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="密&emsp;码：" :label-width="formLabelWidth">
-                <el-input
-                  v-model="form.psd"
-                  autocomplete="off"
-                  type="text"
-                  placeholder="密&emsp;码"
-                  style="width: 80%"
-                  show-password
-                ></el-input>
-              </el-form-item>
-              <el-form-item
-                label="验证码："
-                :label-width="formLabelWidth"
-                style="display: none"
-              >
-                <el-input
-                  v-model="form.name"
-                  autocomplete="off"
-                  type="text"
-                  placeholder="验证码"
-                  style="width: 80%"
-                  ><template #append
-                    ><img
-                      src="../../src\assets\logo.png"
-                      style="width: 50px; height: 20px" /></template
-                ></el-input>
-              </el-form-item>
-            </el-form>
-            <template #footer>
-              <span class="dialog-footer">
-                <el-button
-                  @click="dialogVisible = false"
-                  style="
-                    background-color: rgb(100, 100, 100);
-                    color: rgb(220, 220, 220);
-                  "
-                  >取 消</el-button
-                >
-                <el-button type="primary" @click="login">登 录</el-button>
-              </span>
-            </template>
-          </el-dialog>
-        </div>
-      </el-col>
-
-      <el-col :span="19">
-            <!-- <el-popover
-          placement="bottom"
-          :width="1416"
-          trigger="hover"
-          :show-arrow="false"
-          offset="0"
-        >
-          <template #reference> -->
-            <div class="titleinfoall">
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="装机容量"
-                      unit="MW"
-                      :value="installedCapacity"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="实时功率"
-                      unit="MW"
-                      :value="totalPower"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="日发电量"
-                      unit="kWh"
-                      :value="dailyPowerGeneration"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="上网电量"
-                      unit="kWh"
-                      :value="gridPower"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="月发电量"
-                      unit="kWh"
-                      :value="monthlyPowerGeneration"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="年发电量"
-                      unit="kWh"
-                      :value="annualPowerGeneration"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="月利用小时"
-                      unit="小时"
-                      :value="monthlyUtilizationHours"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-              <div class="titleinfo">
-                <ul>
-                  <li>
-                    <TitleBarCard
-                      title="年利用小时"
-                      unit="小时"
-                      :value="annualUtilizationHours"
-                    ></TitleBarCard>
-                  </li>
-                </ul>
-              </div>
-            </div>
-          <!-- </template>
-
-          <el-table
-            :data="tableData"
-            border
-            border-color="rgb(36,36,36)"
-            :header-cell-style="{
-              background: 'Black',
-              color: 'rgb(220,220,220)',
-              'border-bottom':'solid 1px rgb(36,36,36)',
-              fontSize:'14px',
-              'padding-top':'7px',
-              'padding-bottom':'7px'
-            }"
-            :cell-style="{ background: 'Black', color: 'rgb(220,220,220)','border-bottom':'solid 1px rgb(36,36,36)',fontSize:'14px','padding-top':'5px','padding-bottom':'5px'}"
-            >
-        <el-table-column
-              align="center"
-              prop="station"
-              label="站点"
-              width="80px">
-          </el-table-column>
-        <el-table-column
-              align="center"
-              prop="date"
-              label="运行指标"
-              width="120px">
-            <el-table-column
-              align="center"
-              prop="date"
-              label="日发电量(万kwh)"
-              width="135px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="&ensp;平均风速(m/s)&ensp;日照强度(w/m²)"
-              width="130px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="address"
-              label="实时功率(MW)"
-              width="120px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="AGC有功设定(MW)"
-              width="150px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="理论功率(MW)"
-              width="120px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="预测功率(MW)"
-              width="120px">
-            </el-table-column>
-        </el-table-column>
-        
-        <el-table-column
-              align="center"
-              prop="date"
-              label="发电设备状态汇总"
-              width="80px">
-            <el-table-column
-              align="center"
-              prop="date"
-              label="接入"
-              width="80px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="运行"
-              width="80px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="address"
-              label="待机"
-              width="80px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="维护"
-              width="80px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="故障"
-              width="80px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="限电"
-              width="80px">
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="name"
-              label="离线"
-              width="80px">
-            </el-table-column>
-        </el-table-column>
-          </el-table> 
-
-        </el-popover> -->
-      </el-col>
-      
-
-      <el-col :span="1">
-        <el-popover  placement="bottom" :width="150" trigger="hover" :show-arrow="false">
-          <template #reference>
-            <el-button @click="userClick" style="top: 10px; right: 70px; color: #ffffff; position: absolute;background-color:black;border:none;font-size:16px;">{{usreName}}</el-button>
-          </template>
-          <div style="background-color: #363636;">
-            <!-- <el-button class="loginoption">编&emsp;辑</el-button>
-            <br> -->
-            <el-button v-if="!isLogin" class="loginoption" @click="userClick">登&emsp;录</el-button>
-            <br v-if="!isLogin">
-            <el-button v-if="isLogin" class="loginoption" @click="logout">注&emsp;销</el-button>
-          </div>
-        </el-popover>
-
-        <!-- <div @click="userClick" style="top: 18px; right: 100px; color: #ffffff; position: absolute">{{usreName}}</div> -->
-
-        <!-- <el-button
-          v-popover:loginref
-          type="text"
-          @click="dialogVisible = true"
-          style="top:9px;right: 85px;color: #ffffff;position: absolute;">管理员</el-button> -->
-      </el-col>
-
-      <el-col :span="1">
-        <div style="margin-top: 7px; position: absolute; right: 10px">
-          <button class="closeButton" v-on:click="mainClose">×</button>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import TitleBarCard from "./area/mainwindow/TitleBarCard.vue";
-import BackgroundData from "../assets/script/BackgroundData";
-
-export default {
-  name: "TitleBar",
-  components: {
-    TitleBarCard
-  },
-  data() {
-    return {
-      dialogVisible: false,
-      dialogFormVisible: false,
-      isLogin:false,
-      form: {
-        name: "",
-        psd: "",
-      },
-      usreName: "未登录...",
-      loginMessage: "", // 登录提示
-      formLabelWidth: "120px",
-      totalPower: 0, // 实时功率
-      dailyPowerGeneration: 0, // 日发电量
-      gridPower: 0, // 上网电量
-      monthlyPowerGeneration: 0, // 月发电量
-      annualPowerGeneration: 0, // 年发电量
-      installedCapacity: 734, // 装机容量
-      tableData: [{
-            station:'麻黄山',
-          }, {
-            station:'牛首山',
-          }, {
-            station:'青山',
-          }, {
-            station:'石板泉',
-          }, {
-            station:'香山',
-          }, {
-            station:'风场汇总',
-          }, {
-            station:'大武口',
-          }, {
-            station:'平罗',
-          }, {
-            station:'宣和',
-          }, {
-            station:'马场湖',
-          }, {
-            station:'海子井',
-          }, {
-            station:'光伏汇总',
-          }
-          ]
-    };
-  },
-  computed: {
-    monthlyUtilizationHours: function () {
-      // 月利用小时数
-      return (
-        (this.monthlyPowerGeneration * 10) /
-        this.installedCapacity
-      ).toFixed(2);
-    },
-    annualUtilizationHours: function () {
-      // 年利用小时数
-      return (
-        (this.annualPowerGeneration * 10) /
-        this.installedCapacity
-      ).toFixed(2);
-    },
-  },
-  created() {
-    this.refreshTimer = setInterval(this.refreshData, 2000);
-  },
-  methods: {
-    handleClose(done) {
-      done();
-    },
-    mainClose() {
-      const { remote } = require("electron");
-      remote.getCurrentWindow().destroy();
-    },
-    refreshData() {
-      // todo 计算发电量的时候没有考虑光伏的，后续完善
-      var bd = BackgroundData.getInstance();
-      var val = bd.TopPoint;
-      for (var v in val) {
-        var pt = val[v];
-        if (pt.pointName == "TotalPower") {
-          this.totalPower = pt.value.toFixed(2);
-        } else if (pt.pointName == "DailyPowerGeneration") {
-          this.dailyPowerGeneration = pt.value.toFixed(2);
-        } else if (pt.pointName == "GridPower") {
-          this.gridPower = pt.value.toFixed(2);
-        } else if (pt.pointName == "MonthlyPowerGeneration") {
-          this.monthlyPowerGeneration = pt.value.toFixed(2);
-        } else if (pt.pointName == "AnnualPowerGeneration") {
-          this.annualPowerGeneration = pt.value.toFixed(2);
-        }
-      }
-    },
-
-    /* 登录 */
-    login() {
-      var bd = BackgroundData.getInstance();
-        this.loginMessage='正在登录...';
-      bd.login(this.form.name,this.form.psd,this.onLoged);
-    },
-
-    onLoged(msg){
-      if(!msg.data){
-        this.loginMessage=msg;
-        return;
-      }
-      var user = msg.data;
-      if (!user.isValid) {
-        this.loginMessage = user.message;
-        return;
-      }
-      BackgroundData.getInstance().LoginUser = user;
-      this.usreName = user.name;
-      this.dialogVisible = false;
-      this.loginMessage = "";
-      this.form.name = this.form.psd = "";
-
-      this.isLogin=true;
-    },
-
-    /* 用户点击 */
-    userClick() {
-      this.dialogVisible = true;
-    },
-
-    /* 用户注销 */
-    logout(){
-      BackgroundData.getInstance().LoginUser=null;
-      this.usreName = '未登录...';
-      this.isLogin=false;
-    }
-  },
-};
-</script>
-
-
-<style scoped>
-.loginoption{
-  font-size:16px;
-  width:150px;
-  background-color: #292929;
-  border:none;
-  color:rgb(220,220,220);
-}
-.title-bar {
-  height: 5vh;
-  background-color: #000000;
-  margin-top: 0;
-  margin-right: 0;
-  margin-left: 0;
-}
-.logo {
-  position: relative;
-  top: 32%;
-  margin-left: 10px;
-}
-.titleinfo {
-  background-color: rgb(20, 20, 20);
-  height: auto;
-  padding: 13px;
-  border-radius: 6px;
-  margin-top: 5px;
-  margin-bottom: 5px;
-  margin-left: -9px;
-}
-
-.closeButton {
-  font-size: 30px;
-  color: white;
-  background: rgb(41, 41, 41);
-  width: 44px;
-  height: 44px;
-  border-radius: 8px;
-  border: none;
-}
-.titleinfoall{
-  display: flex;;
-}
-</style>

src/components/WindturbineDetailPages.vue

@@ -0,0 +1,502 @@
+<template>
+  <el-dialog
+    width="80%"
+    @opened="opened()"
+    @closed="closed()"
+    :show-close="false"
+    class="my-info-dialog"
+  >
+    <template #title>
+      <div style="margin-top: -10px; color: #ffffff">风机详情</div>
+    </template>
+    <div class="body">
+      <div class="titleList">
+        <div class="chunkdiv" @click="handleClick(true)">
+          <div class="title">风机号：&emsp;</div>
+          <div>{{ windturbine.windturbineId }}</div>
+          <!-- <div>
+            {{ windturbine.stationId.slice(0, 2) }}-{{ windturbine.code }}
+          </div> -->
+        </div>
+        <div
+          class="chunkdiv"
+          @click="handleClick(true)"
+          @dblclick="dbClicks(baseDate.windSpeed)"
+        >
+          <div class="title">{{ baseDate.windSpeed.name }}：&emsp;</div>
+          <div>{{ baseDate.windSpeed.value }}{{ baseDate.windSpeed.unit }}</div>
+        </div>
+        <div
+          class="chunkdiv"
+          @click="handleClick(true)"
+          @dblclick="dbClicks({ code: 'YDPJFS5M', name: '五分钟平均风速' })"
+        >
+          <div class="title">五分钟平均风速：&emsp;</div>
+          <div>{{ healthInfo?.averageWindSpeed5?.toFixed(2) }}m/s</div>
+        </div>
+        <div
+          class="chunkdiv"
+          @click="handleClick(true)"
+          @dblclick="dbClicks(theoreticalPower)"
+        >
+          <div class="title">理论功率：&emsp;</div>
+          <div>{{ healthInfo?.theoreticalPower?.toFixed(2) }}Kw</div>
+        </div>
+        <div
+          class="chunkdiv"
+          @click="handleClick(true)"
+          @dblclick="dbClicks(baseDate.power)"
+        >
+          <div class="title">{{ baseDate.power.name }}：&emsp;</div>
+          <div>{{ baseDate.power.value }}{{ baseDate.power.unit }}</div>
+        </div>
+        <div
+          class="chunkdiv"
+          @click="handleClick(true)"
+          @dblclick="dbClicks(baseDate.generatorSpeed)"
+        >
+          <div class="title">{{ baseDate.generatorSpeed.name }}：&emsp;</div>
+          <div>
+            {{ baseDate.generatorSpeed.value
+            }}{{ baseDate.generatorSpeed.unit }}
+          </div>
+        </div>
+        <div class="chunkdiv" @click="handleClick(false)">
+          <div class="title">故障信息: &emsp;{{ faultNum }}</div>
+        </div>
+      </div>
+      <BasicInformationDetail
+        v-show="current"
+        ref="BasicInfo"
+        :types="types"
+        @health-click="handleHealth"
+        :windturbine="windturbine"
+      ></BasicInformationDetail>
+      <div class="faultInfo" v-show="!current">
+        <div class="left-item">
+          <div
+            :class="item.openedCount > 0 ? 'faultNameErr' : 'faultName'"
+            v-for="(item, index) in fault"
+            :key="index"
+            @click="handleFaultClick(index)"
+          >
+            {{ item.component }}
+            <div class="faultNum" v-if="item.openedCount > 0">
+              ({{ item.openedCount }})
+            </div>
+          </div>
+        </div>
+        <div class="right-item">
+          <div class="tables">
+            <el-table
+              :data="faultList"
+              class="table"
+              style="width: 100%"
+              height="67vh"
+              stripe
+              highlight-current-row
+              :header-cell-style="{
+                background: 'rgb(30,30,30)',
+                color: 'rgb(220,220,220)',
+                padding: '4px',
+                fontSize: '14px',
+                'border-bottom': 'solid 1px rgba(77, 77, 77, 1)',
+              }"
+              :cell-style="tableCellStyle"
+            >
+              <el-table-column
+                prop="id"
+                label="报警编号"
+                width="200"
+                align="center"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="modelId"
+                label="风机型号"
+                width="150"
+                align="center"
+              >
+              </el-table-column>
+              <el-table-column prop="alertText" label="报警信息" align="center">
+              </el-table-column>
+              <el-table-column label="故障状态" width="120" align="center">
+                <template #default="scope">
+                  <span>
+                    {{ scope.row.isOpened > 0 ? "故障" : "正常" }}
+                  </span>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import api from "api/index";
+import BasicInformationDetail from "./BasicInformationDetail.vue";
+import BackgroundData from "utils/BackgroundData";
+import Fault from "utils/fault";
+export default {
+  components: {
+    BasicInformationDetail,
+  },
+  props: {
+    windturbine: Object,
+  },
+  data() {
+    return {
+      current: true,
+      BasicInfo: {},
+      healthInfo: {},
+      line: "",
+      alarmTime: "",
+      alarmContent: "",
+      alarms: [],
+      count: false,
+      theoreticalPower: {
+        code: "LLGL",
+        name: "理论功率",
+      },
+      typeList: [
+        {
+          type: 0,
+          name: "已经停机",
+        },
+        {
+          type: 1,
+          name: "上电",
+        },
+        {
+          type: 2,
+          name: "待机",
+        },
+        {
+          type: 3,
+          name: "启动",
+        },
+        {
+          type: 4,
+          name: "并网",
+        },
+        {
+          type: 5,
+          name: "故障",
+        },
+        {
+          type: 6,
+          name: "维护",
+        },
+        {
+          type: 7,
+          name: "离线",
+        },
+      ],
+      baseDate: {
+        windSpeed: {
+          name: "",
+          num: "",
+          unit: "",
+        },
+        power: {
+          name: "",
+          num: "",
+          unit: "",
+        },
+        generatorSpeed: {
+          name: "",
+          num: "",
+          unit: "",
+        },
+      },
+      types: null,
+      fault: {},
+      refreshTimer: "",
+      refreshTimers: "",
+      faultNum: 0,
+      faultList: [],
+      // station: [],
+    };
+  },
+  created() {
+    this.getUniformCodes();
+    // this.getWindturbineFdc();
+  },
+
+  methods: {
+    // getWindturbineFdc() {
+    //   api.getWindturbineFdc().then((res) => {
+    //     this.station = res.data;
+    //   });
+    // },
+    handleFaultClick(index) {
+      this.faultList = this.fault[index].alertSnaps;
+    },
+    handleClick(val) {
+      this.current = val;
+    },
+    getUniformCodes() {
+      api.getUniformCodes().then((res) => {
+        this.UniformCodes = res.data;
+      });
+    },
+    opened() {
+      this.line = "";
+      this.alarmTime = "";
+      this.alarmContent = "";
+      this.BasicInfo = this.uniformCodesDeal(this.windturbine);
+      this.BasicInfo.windturbineId = this.windturbine.windturbineId;
+      // this.dateDeal(this.BasicInfo)
+      this.$refs.BasicInfo.start(this.BasicInfo);
+      this.initData();
+      this.refreshData();
+      this.refreshTimer = setInterval(this.refreshData, 5000);
+    },
+    tableCellStyle({ row, column, rowIndex, columnIndex }) {
+      let warningColor = false;
+      let obj = {};
+      if (row.isOpened > 0) {
+        warningColor = true;
+      }
+      if (warningColor) {
+        obj = {
+          height: "40px",
+          background: "rgb(30,30,30)",
+          color: "#FF0000",
+          padding: "3px",
+          fontSize: "12px",
+          "border-top": "0px solid #000000",
+          "border-bottom": "1px solid #000000",
+          "border-right": "1px solid #000000",
+        };
+      } else {
+        obj = {
+          height: "40px",
+          background: "rgb(30,30,30)",
+          color: "rgb(220,220,220)",
+          padding: "3px",
+          fontSize: "12px",
+          "border-top": "0px solid #000000",
+          "border-bottom": "1px solid #000000",
+          "border-right": "1px solid #000000",
+        };
+      }
+
+      return obj;
+    },
+    uniformCodesDeal(windturbine) {
+      let val = this.UniformCodes[windturbine.stationId][windturbine.modelId];
+      let codes = "";
+      val.forEach((element) => {
+        element.param.forEach((itm) => {
+          codes += itm.code + ",";
+        });
+      });
+      val.codes = codes;
+      return val;
+    },
+    closed() {
+      this.$refs.BasicInfo.end();
+      this.$emit("close");
+      clearInterval(this.refreshTimer);
+      clearInterval(this.refreshTimers);
+      this.refreshTimers = null;
+      this.refreshTimer = null;
+    },
+    dateDeal(BasicInfo) {
+      let showInf = {};
+      showInf = BasicInfo.filter((item) => item.tag === "基本信息")[0];
+      this.baseDate.windSpeed = showInf.param.filter(
+        (item) => item.name === "风速"
+      )[0];
+      this.baseDate.power = showInf.param.filter(
+        (item) => item.name === "有功功率"
+      )[0];
+      this.baseDate.generatorSpeed = showInf.param.filter(
+        (item) => item.name === "发电机转速"
+      )[0];
+      this.baseDate.type = showInf.param.filter(
+        (item) => item.name === "状态"
+      )[0].value
+        ? this.typeList.filter(
+            (status) =>
+              status.type ===
+              Number(
+                showInf.param.filter((item) => item.name === "状态")[0].value
+              )
+          )[0].name
+        : "";
+      this.types = Number(
+        showInf.param.filter((item) => item.name === "状态")[0].value
+      );
+    },
+    refreshData() {
+      let bg = BackgroundData.getInstance();
+      bg.initWinturbineBaseData(this.BasicInfo, this.onMessage);
+      this.dateDeal(this.BasicInfo);
+      // clearInterval(this.refreshTimer);
+      // this.refreshTimers = setInterval(this.refreshData, 5000);
+    },
+    initData() {
+      api
+        .getWindWarning(this.windturbine.windturbineId, "1", "50")
+        .then((msg) => {
+          let vs = msg.data;
+          if (vs.length <= 0) return;
+          this.alarmTime = BackgroundData.getInstance().formatDate(
+            vs[0].lastUpdateTime
+          );
+          this.alarmContent = vs[0].alertText;
+          this.alarms = msg.data;
+          this.$refs.BasicInfo.alarmd(this.alarms);
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      api
+        .alarmSnap({
+          windturbineId: this.windturbine.windturbineId,
+        })
+        .then((res) => {
+          this.fault = res.data;
+          this.faultList = res.data[0].alertSnaps;
+          let faultNum = 0;
+          this.fault.forEach((item) => {
+            faultNum = faultNum + item.openedCount;
+          });
+          this.faultNum = faultNum;
+        });
+    },
+    dbClicks(value) {
+      this.$refs.BasicInfo.dbClicks(value, this.windturbine.windturbineId);
+    },
+    handleHealth(value) {
+      this.healthInfo = value;
+    },
+  },
+  watch: {
+    windturbine: {
+      handler: function (json) {
+        if (json) {
+          this.initData();
+        }
+      },
+    },
+  },
+};
+</script>
+<style scoped>
+.my-info-dialog {
+  box-shadow: 0px 0px 10px #05bb4c;
+}
+
+.body {
+  background-color: black;
+  margin-top: -30px;
+  margin-left: -10px;
+  margin-right: -10px;
+  margin-bottom: -30px;
+  border-bottom: 20px solid rgb(36, 36, 36);
+}
+
+.chunkdiv {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  width: 17%;
+  background-color: #363636;
+  margin: 1px;
+  padding: 4px 0px;
+  font-size: 12px;
+  color: #ffffff;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.title {
+  font-size: 12px;
+  color: #b3b3b3;
+}
+
+table {
+  margin-left: 2px;
+  margin-right: 2px;
+}
+
+/* td {
+		width: 20%;
+	} */
+
+el-tabs {
+  background-color: black;
+}
+
+.svg {
+  height: 67vh;
+}
+.titleList {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.faultInfo {
+  height: 70vh;
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+}
+.left-item {
+  width: 16%;
+  background-color: #4d4d4d;
+  display: flex;
+  flex-direction: column;
+  padding-top: 20px;
+  align-items: center;
+  height: 96%;
+  overflow-y: auto;
+}
+.faultName {
+  font-size: 16px;
+  color: #ffffff;
+  margin-bottom: 10px;
+}
+.faultNameErr {
+  display: flex;
+  flex-direction: row;
+  align-items: baseline;
+  font-size: 16px;
+  color: red;
+  margin-bottom: 15px;
+}
+.faultNum {
+  font-size: 12px;
+}
+.right-item {
+  width: 83%;
+  background-color: #4d4d4d;
+  margin-left: 15px;
+  height: 96%;
+  padding-bottom: 20px;
+}
+.el-table {
+  background-color: #000000 !important;
+}
+.el-table__body-wrapper::-webkit-scrollbar {
+  width: 8px !important;
+  height: 0px !important;
+  background-color: black !important;
+}
+
+.el-table__body-wrapper::-webkit-scrollbar-thumb {
+  background-color: #292929 !important;
+  border-radius: 6px !important;
+}
+.tables {
+  width: 98%;
+  margin: 1%;
+}
+</style>

src/components/allMatrices.vue

@@ -0,0 +1,817 @@
+<template>
+  <el-dialog width="70%" @open="opened" @closed="closed" :fullscreen="true" :show-close="true" class="dialogs">
+    <template #title>
+      <div class="showTitles currentShowTitles">
+        <div class="titles">风机矩阵</div>
+      </div>
+    </template>
+    <div class="body" @contextmenu="contextmenu">
+      <div class="titleList">
+        <div class="title">
+          <div :class="current === item.id ? 'title-onItem' : 'title-item'" v-for="(item, index) in stationList"
+            :key="index" @click="handleChange(item.id)">
+            {{ item.name }}
+          </div>
+        </div>
+
+        <div style="display: flex; flex-direction: row;margin-right: 90px;width: 800px;">
+          <div class="item2" v-for="(data, index) of panel2Data.datas" :key="index">
+            <div :class="
+              data.num1 === 5
+                ? 'item9'
+                : data.num1 === 4
+                  ? 'item8'
+                  : data.num1 === 3
+                    ? 'item7'
+                    : data.num1 === 2
+                      ? 'item6'
+                      : data.num1 === 1
+                        ? 'item5'
+                        : ''
+            ">
+              <div class="name">{{ data.test }}</div>
+              <div class="num2"></div>
+              <div class="num1">×{{ data.num1 }}</div>
+              <div class="num3">{{ data.num3 }}</div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="content">
+        <box-select node=".box" @selectList="selectList">
+          <div class="windStation" v-for="(item, index) in stationArr" :key="index">
+            <div class="stationTitle">
+              <div class="stationName">
+                {{
+                    stationList.filter((val) => item[0].stationId === val.id)[0]
+                      ?.name
+                }}
+              </div>
+              <div class="num">
+                <div class="jrts">接入台数</div>
+                <div class="jrts_num">{{ item.length }}</div>
+              </div>
+              <div class="num">
+                <div class="djts">待机台数</div>
+                <div class="djts_num">
+                  {{ item.filter((val) => val.status === 2)?.length }}
+                </div>
+              </div>
+              <div class="num">
+                <div class="bwts">并网台数</div>
+                <div class="bwts_num">
+                  {{ item.filter((val) => val.status === 4)?.length }}
+                </div>
+              </div>
+              <div class="num">
+                <div class="gzts">故障台数</div>
+                <div class="gzts_num">
+                  {{ item.filter((val) => val.status === 5)?.length }}
+                </div>
+              </div>
+              <div class="num">
+                <div class="jxts">检修台数</div>
+                <div class="jxts_num">
+                  {{ item.filter((val) => val.status === 6)?.length }}
+                </div>
+              </div>
+              <div class="num">
+                <div class="lxts">离线台数</div>
+                <div class="lxts_num">
+                  {{ item.filter((val) => val.status === 7)?.length }}
+                </div>
+              </div>
+
+              <div class="stationInfo">
+                <div class="name">实时功率</div>
+                <div class="nums">
+                  {{
+                      $store.state.titleInfo.stationOverviewInfos[
+                        item[0].stationId
+                      ]?.realTimePower?.value.toFixed(2)
+                  }}MW
+                </div>
+              </div>
+              <div class="stationInfo">
+                <div class="name">平均风速</div>
+                <div class="nums">
+                  {{
+                      $store.state.titleInfo.stationOverviewInfos[
+                        item[0].stationId
+                      ]?.averageWindSpeed?.value.toFixed(2)
+                  }}m/s
+                </div>
+              </div>
+            </div>
+            <div class="block">
+              <UnpaidMatrixBlock @on-click="handleDetial" @choose-click="handleClick" :dataList="item">
+              </UnpaidMatrixBlock>
+            </div>
+          </div>
+        </box-select>
+      </div>
+    </div>
+    <WindturbineDetailPages v-model="dialogVisible" @close="handleClose" :windturbine="currentWindturbine">
+    </WindturbineDetailPages>
+    <ParametersContrast :chooseList="chooseList" v-model="parametersDisplay"></ParametersContrast>
+  </el-dialog>
+</template>
+<script>
+import BackgroundData from "utils/BackgroundData";
+import UnpaidMatrixBlock from "components/unpaidMatrixBlock.vue";
+import WindturbineDetailPages from "components/WindturbineDetailPages.vue";
+import boxSelect from "components/boxSelect.vue";
+import ParametersContrast from "./control/parametersContrast.vue";
+import api from "api/index";
+export default {
+  components: {
+    UnpaidMatrixBlock,
+    WindturbineDetailPages,
+    boxSelect,
+    ParametersContrast,
+  },
+  data() {
+    return {
+      current: "all",
+      windterbin: {},
+      stationObj: {},
+      cache: {},
+      stationArr: [],
+      dialogVisible: false,
+      currentWindturbine: {},
+      chooseList: [],
+      lockValues: [],
+      parametersDisplay: false,
+      intervals: null,
+      panel2Data: {
+        datas: [
+          {
+            test: "欠发电量",
+            num1: 5,
+            key: "r0qf",
+            num3: "0%~5%",
+          },
+          {
+            test: "欠发电量",
+            num1: 4,
+            key: "r1qf",
+            num3: "5%~10%",
+          },
+          {
+            test: "欠发电量",
+            num1: 3,
+            key: "r2qf",
+            num3: "10%~20%",
+          },
+          {
+            test: "欠发电量",
+            num1: 2,
+            key: "r3qf",
+            num3: "20%~40%",
+          },
+          {
+            test: "欠发电量",
+            num1: 1,
+            key: "r4qf",
+            num3: ">40%",
+          },
+        ],
+      },
+    };
+  },
+  created() {
+    this.getLocks();
+  },
+  mounted() { },
+  methods: {
+    opened() {
+      let stationList = [
+        {
+          id: "all",
+          name: "全部风机",
+        },
+      ];
+      let stations = this.$store.state.stationList;
+      stations.forEach((item) => {
+        if (item.id.indexOf("FDC") != -1) {
+          stationList.push(item);
+          this.stationObj[item.id] = [];
+        }
+      });
+      this.stationList = stationList;
+      this.handleWindturbineChange();
+      this.intervals = setInterval(this.handleWindturbineChange, 3000);
+    },
+    closed() {
+      this.chooseList = [];
+      clearInterval(this.intervals);
+      this.intervals = null;
+    },
+    handleChange(val) {
+      let stationArr = [];
+      this.current = val;
+      let stationObj = {};
+      let stations = this.$store.state.stationList;
+      stations.forEach((item) => {
+        if (val === "all") {
+          if (item.id.indexOf("FDC") != -1) {
+            stationObj[item.id] = [];
+          }
+        } else if (item.id === val) {
+          stationObj[item.id] = [];
+        }
+      });
+      if (val === "all") {
+        stationObj = this.cache;
+      } else {
+        stationObj[val] = this.cache[val];
+      }
+
+      let list = Object.keys(stationObj).sort();
+      for (const id of list) {
+        stationArr.push(stationObj[id]);
+      }
+      this.stationObj = stationObj;
+      this.stationArr = stationArr;
+    },
+    handleDetial(itm) {
+      this.dialogVisible = true;
+      this.currentWindturbine = itm;
+    },
+    handleClick(values) {
+      if (values.active) {
+        let showIndex = null;
+        this.chooseList.forEach((item, index) => {
+          if (item.windturbineId === values.windturbineId) {
+            showIndex = index;
+          }
+        });
+        this.chooseList.splice(showIndex, 1);
+      } else {
+        this.chooseList.push(values);
+      }
+      this.stationArr.forEach((item) => {
+        item.forEach((val) => {
+          if (val.windturbineId === values.windturbineId) {
+            val.active = !val.active;
+          }
+        });
+      });
+    },
+    handleClose() {
+      this.dialogVisible = false;
+      this.getLocks();
+    },
+    selectList(val) {
+      val.forEach((item) => {
+        this.handleClick(this.windterbin[item.id]);
+      });
+    },
+    getLocks() {
+      api.getCustomerLock().then((res) => {
+        if (res) {
+          this.lockValues = res.data;
+        }
+      });
+    },
+
+    /* 右键菜单 */
+    contextmenu() {
+      const remote = require("electron").remote;
+      let that = this;
+      let menuTemplate = [];
+      menuTemplate = [
+        {
+          label: "启动",
+          click() {
+            that.sendCommand({ controlType: "1", deviceType: "Manual" });
+          },
+        },
+        {
+          label: "停机",
+          click() {
+            that.sendCommand({ controlType: "2", deviceType: "Manual" });
+          },
+        },
+        {
+          label: "复位",
+          click() {
+            that.sendCommand({ controlType: "5", deviceType: "Manual" });
+          },
+        },
+        {
+          label: "维护",
+          click() {
+            that.sendCommand({ controlType: "6", deviceType: "Manual" });
+          },
+        },
+        {
+          label: "取消维护",
+          click() {
+            that.sendCommand({ controlType: "8", deviceType: "Manual" });
+          },
+        },
+        {
+          label: "挂牌",
+          submenu: [
+            {
+              label: "检修",
+              click() {
+                that.sendLock({ value: "CheckLock" });
+              },
+            },
+            {
+              label: "故障维修",
+              click() {
+                that.sendLock({ value: "FaultLock" });
+              },
+            },
+            {
+              label: "场内受累检修",
+              click() {
+                that.sendLock({ value: "StationCheckLock" });
+              },
+            },
+            {
+              label: "场内受累故障",
+              click() {
+                that.sendLock({ value: "StationFaulLock" });
+              },
+            },
+            {
+              label: "场外受累电网",
+              click() {
+                that.sendLock({ value: "StationPowerLineLock" });
+              },
+            },
+            {
+              label: "场外受累天气",
+              click() {
+                that.sendLock({ value: "StationWeatherLock" });
+              },
+            },
+          ],
+        },
+        {
+          label: "取消挂牌",
+          click() {
+            that.sendLock({ value: "UnLock" });
+          },
+        },
+        {
+          label: "参数对比",
+          click() {
+            that.parametersContrast();
+          },
+        },
+      ];
+
+      const menu = remote.Menu.buildFromTemplate(menuTemplate);
+
+      menu.popup(remote.getCurrentWindow());
+    },
+    sendCommand(msg, windturbine) {
+      let bd = BackgroundData.getInstance();
+      if (!bd.LoginUser) {
+        this.$notify({
+          title: "请登录",
+          message: "控制风机需要先登录！",
+          type: "warning",
+          position: "bottom-right",
+          offset: 60,
+          duration: 3000,
+        });
+        return;
+      }
+      let sendList = [];
+      if (windturbine) {
+        sendList = windturbine;
+      } else {
+        this.chooseList.forEach((item) => {
+          item.controlType = Number(msg.controlType);
+        });
+        sendList = this.chooseList;
+      }
+
+      if (sendList.length > 0) {
+        bd.checkout(sendList);
+        this.chooseList = [];
+        let pairs = {};
+        sendList.forEach((item) => {
+          let ct = {
+            windturbineId: item.windturbineId,
+            stationId: item.stationId,
+            projectId: item.projectId,
+            modelId: item.modelId,
+            controlType: item.controlType,
+            lockType: item.lockType,
+            userName: `system_${bd.LoginUser.name}`,
+            userId: 0,
+            auto: false,
+            deviceType: msg.deviceType,
+          };
+          pairs[ct.windturbineId] = ct;
+        });
+        api.windturbControl(pairs).then((res) => {
+          if (res) {
+            this.controlSuccess(res);
+          }
+        });
+      }
+    },
+    sendLock(msg, windturbine) {
+      let bd = BackgroundData.getInstance();
+      if (!bd.LoginUser) {
+        this.$notify({
+          title: "请登录",
+          message: "控制风机需要先登录！",
+          type: "warning",
+          position: "bottom-right",
+          offset: 60,
+          duration: 3000,
+        });
+        return;
+      }
+      let sendList = [];
+      if (windturbine) {
+        windturbine.lockType = msg.value;
+        sendList.push(windturbine);
+      } else {
+        this.chooseList.forEach((item) => {
+          item.lockType = msg.value;
+        });
+        sendList = this.chooseList;
+      }
+      if (sendList.length > 0) {
+        this.chooseList = [];
+        let pairs = {};
+        sendList.forEach((item) => {
+          let ct = {
+            windturbineId: item.windturbineId,
+            stationId: item.stationId,
+            projectId: item.projectId,
+            modelId: item.modelId,
+            controlType: item.controlType,
+            lockType: item.lockType,
+            userName: `system_${bd.LoginUser.name}`,
+            userId: 0,
+          };
+          pairs[ct.windturbineId] = ct;
+        });
+        api.windturbControlLock(pairs).then((res) => {
+          if (res) {
+            this.controlSuccess(res);
+          }
+        });
+      }
+    },
+
+    /* 控制成功 */
+    controlSuccess(msg) {
+      let bd = BackgroundData.getInstance();
+      for (let id in msg.data) {
+        let val = msg.data[id];
+        if (val.errorCode !== "0") {
+          bd.removeCheckouts(val);
+        }
+      }
+      let mss = ""; // 信息
+      let iserror = false; // 是否有控制错误的风机
+      for (let v in msg.data) {
+        let val = msg.data[v];
+        if (val.errorCode > 0) {
+          iserror = true;
+          mss += `${val.windturbineId}  ${this.controlErorCodes[val.errorCode]
+            }\n`;
+        }
+      }
+      let tp = iserror ? "warning" : "success";
+      // if (!iserror) {
+      //   mss = "控制成功";
+      // }
+
+      this.$notify({
+        title: "控制",
+        message: mss,
+        type: tp,
+        position: "bottom-right",
+        offset: 60,
+        duration: 3000,
+      });
+    },
+
+    /* 控制失败 */
+    controlError(err) {
+      this.$notify({
+        title: "控制出现错误",
+        message: err.message,
+        type: "warning",
+        position: "bottom-right",
+        offset: 60,
+        duration: 3000,
+      });
+    },
+    parametersContrast() {
+      if (this.chooseList.length > 0) {
+        this.parametersDisplay = true;
+      }
+    },
+    handleWindturbineChange() {
+      api.getWindturbine().then((res) => {
+        if (res.data) {
+          let stationArr = [];
+          for (const key in this.stationObj) {
+            this.stationObj[key] = [];
+          }
+          this.windterbin = res.data;
+          let arr = Object.keys(res.data).sort();
+          for (const id of arr) {
+            let val = res.data[id];
+            if (val.lockValue === 9) {
+              val.lockValues = this.lockValues.filter(
+                (item) => val.windturbineId === item.windturbineID
+              )[0]?.value;
+            }
+            this.chooseList.forEach((item) => {
+              if (item.windturbineId === val.windturbineId) {
+                val.active = true;
+              }
+            });
+            if (this.current === "all") {
+              this.stationObj[val.stationId]?.push(val);
+            } else {
+              if (this.current === val.stationId) {
+                this.stationObj[val.stationId]?.push(val);
+              }
+            }
+          }
+          this.current === "all" &&
+            (this.cache = JSON.parse(JSON.stringify(this.stationObj)));
+          let list = Object.keys(this.stationObj).sort();
+          for (const id of list) {
+            stationArr.push(this.stationObj[id]);
+          }
+          this.stationArr = stationArr;
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.body {
+  display: flex;
+  flex-direction: column;
+  background-color: #000000;
+  height: 90vh;
+  width: 102%;
+  margin-left: -1%;
+  margin-top: -40px;
+  overflow-y: auto;
+}
+
+.body::-webkit-scrollbar {
+  /*隐藏滚轮*/
+  display: none;
+}
+
+.titleList {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  margin-left: 3vw;
+  padding-top: 8px;
+  position: absolute;
+  width: 100%;
+  background-color: #000000;
+  padding-bottom: 10px;
+}
+
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+
+  .title-item {
+    background-color: #242424;
+    border-radius: 4px;
+    padding: 8px 27px 7px 25px;
+    font-size: 14px;
+    color: #b4bdc0;
+    margin-right: 10px;
+  }
+
+  .title-onItem {
+    background-color: rgba(37, 116, 219, 1);
+    border-radius: 4px;
+    padding: 8px 27px 7px 25px;
+    font-size: 14px;
+    color: #b4bdc0;
+    margin-right: 10px;
+  }
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  margin-top: 65px;
+}
+
+.block {
+  padding-left: 10px;
+}
+
+.windStation {
+  display: flex;
+  flex-direction: column;
+  background-color: #242424;
+  border-radius: 4px;
+  width: 95%;
+  margin-left: 3vw;
+  padding-bottom: 20px;
+  padding-left: 10px;
+  margin-bottom: 20px;
+
+  .stationTitle {
+    display: flex;
+    flex-direction: row;
+    // align-items: center;
+    margin-top: 10px;
+
+    .stationName {
+      font-size: 14px;
+      margin-left: 10px;
+      color: #b4bdc0;
+    }
+
+    .num {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
+      margin-left: 25px;
+      width: 90px;
+
+      .jrts {
+        font-size: 12px;
+        color: #606769;
+      }
+
+      .jrts_num {
+        font-size: 16px;
+        color: #ffffff;
+      }
+
+      .djts {
+        font-size: 12px;
+        color: #05bb4c;
+      }
+
+      .djts_num {
+        font-size: 16px;
+        color: #05bb4c;
+      }
+
+      .bwts {
+        font-size: 12px;
+        color: #4b55ae;
+      }
+
+      .bwts_num {
+        font-size: 16px;
+        color: #4b55ae;
+      }
+
+      .gzts {
+        font-size: 12px;
+        color: #ba3237;
+      }
+
+      .gzts_num {
+        font-size: 16px;
+        color: #ba3237;
+      }
+
+      .jxts {
+        font-size: 12px;
+        color: #e17d24;
+      }
+
+      .jxts_num {
+        font-size: 16px;
+        color: #e17d24;
+      }
+
+      .lxts {
+        font-size: 12px;
+        color: #606769;
+      }
+
+      .lxts_num {
+        font-size: 16px;
+        color: #606769;
+      }
+    }
+  }
+
+  .stationInfo {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    margin-left: 30px;
+    font-size: 16px;
+
+    .name {
+      color: #ffffff;
+      margin-right: 25px;
+    }
+
+    .nums {
+      color: #05bb4c;
+    }
+  }
+}
+
+.item2 {
+  flex: 1;
+  display: flex;
+  width: 20%;
+  flex-wrap: wrap;
+
+  .name {
+    color: #fff;
+    width: 50%;
+    text-align: center;
+  }
+
+  .num2 {
+    width: 50%;
+    color: #fff;
+    text-align: left;
+  }
+
+  .num1 {
+    width: 50%;
+    color: #fff;
+    text-align: center;
+    position: relative;
+
+    &::after {
+      content: "";
+      position: absolute;
+      width: 1.481vh;
+      height: 0.556vh;
+      background-color: #fff;
+      left: 1.204vh;
+      top: 0.741vh;
+    }
+  }
+
+  .num3 {
+    width: 50%;
+    color: #fff;
+    text-align: left;
+  }
+}
+
+.item9 {
+  background-color: #57cf3a;
+  flex: 1;
+  display: flex;
+  width: 20%;
+  flex-wrap: wrap;
+}
+
+.item8 {
+  background-color: #0ec7dc;
+  flex: 1;
+  display: flex;
+  width: 20%;
+  flex-wrap: wrap;
+}
+
+.item7 {
+  background-color: #1974ff;
+  flex: 1;
+  display: flex;
+  width: 20%;
+  flex-wrap: wrap;
+}
+
+.item6 {
+  background-color: #cd4cdd;
+  flex: 1;
+  display: flex;
+  width: 20%;
+  flex-wrap: wrap;
+}
+
+.item5 {
+  background-color: #ff3c80;
+  flex: 1;
+  display: flex;
+  width: 20%;
+  flex-wrap: wrap;
+}
+</style>

src/components/area/AlarmArea.vue

@@ -1,210 +0,0 @@
-/* 告警区 */
-<template>
-  <gy-card
-    title="告警区"
-    area-style="alarm"
-    circle-style="green"
-    content-style="25"
-  >
-    <div style="padding-left: 5px; padding-right: 5px">
-      <el-table
-        :data="values"
-        height="219px"
-        :header-cell-style="{
-          background: 'Black',
-          color: 'rgb(220,220,220)',
-          padding: '4px',
-          fontSize: '14px',
-          'border-bottom': 'solid 1px black',
-        }"
-        :cell-style="{
-          background: '#1e1e1e',
-          color: 'rgb(220,220,220)',
-          padding: '3px',
-          fontSize: '12px',
-        }"
-        @row-dblclick="itemDblclick"
-      >
-        <el-table-column
-          prop="lastUpdateTime"
-          align="center"
-          label="时间"
-          width="150"
-        >
-        </el-table-column>
-        <el-table-column
-          prop="alertText"
-          align="center"
-          label="描述"
-          width="380"
-        >
-        </el-table-column>
-        <el-table-column prop="isSelected" align="center" label="确认">
-          <template v-slot="scope">
-            <!-- <el-checkbox v-model="scope.row.isSelected" @click="itemChecked(scope.row)"></el-checkbox> -->
-            <input
-              type="checkbox"
-              v-model="scope.row.isSelected"
-              @click="itemChecked(scope.row)"
-            />
-          </template>
-          <!-- <el-checkbox v-model="isSelected"></el-checkbox> -->
-          <!-- <input type="checkbox"/> -->
-        </el-table-column>
-      </el-table>
-    </div>
-  </gy-card>
-  <WindturbineDetailPages
-    v-model="dialogVisible"
-    :windturbine="currentWindturbine"
-  ></WindturbineDetailPages>
-</template>
-
-<script>
-import MessageBridge from "../../assets/script/MessageBridge";
-import WindturbineDetailPages from "../area/windturbine/WindturbineDetailPages.vue";
-import BackgroundData from "../../assets/script/BackgroundData";
-import axios from "axios";
-import { config } from "../../config";
-
-export default {
-  name: "AlarmArea",
-  components: {
-    WindturbineDetailPages,
-  },
-  created: function () {
-    this.initData();
-  },
-  props: {},
-  data() {
-    return {
-
-      values: new Array(),
-      dialogVisible:false,
-      currentWindturbine: {},
-    };
-  },
-  methods: {
-    initData() {
-      var mb = MessageBridge.getInstance();
-      var vs = [{ key: "/topic/fault-popup", action: this.faultMessage }];
-      mb.register(vs);
-    },
-    faultMessage(msg) {
-      var val = JSON.parse(msg);
-      var sleected = {};
-      this.values.forEach((it) => {
-        if (it.isSelected) {
-          sleected[it.id] = 0;
-        }
-      });
-      this.values = new Array();
-      for (var v in val) {
-        var vl = val[v];
-        if (vl.stationId != "QS_FDC" && vl.category1 == "FJ") {
-          vl.alertText = vl.windturbineName + "-" + vl.alertText;
-        }
-        if (sleected[vl.id] == 0 && BackgroundData.getInstance().LoginUser) {
-          vl.isSelected = true;
-        }
-        this.values.push(vl);
-      }
-      console.log(val);
-    },
-    /* 行双击 */
-    itemDblclick(row) {
-      if (row.category1 != "FJ") return;
-      this.dialogVisible = true;
-      this.currentWindturbine = row;
-    },
-    /* 报警确认 */
-    itemChecked(row) {
-      if (row.isSelected == true) {
-        row.isSelected = false;
-        return;
-      }
-      var bd = BackgroundData.getInstance();
-      if (!bd.LoginUser) {
-        this.$notify({
-          title: "请登录",
-          message: "确认报警需要先登录！",
-          type: "warning",
-          position: "bottom-right",
-          offset: 60,
-        });
-        row.isSelected = false;
-        return;
-      }
-      row.isSelected = true;
-      this.confirm(row);
-      console.log(row);
-    },
-    confirm(item) {
-      var url = `http://${config.calcUrl}/alarm/confirm?snapID=${item.snapIDString}&faultID=${item.idString}&userName=${BackgroundData.getInstance().LoginUser.name}`;
-      axios
-        .get(url)
-        .then((msg) => {
-          var mms = msg.data > 0 ? "报警确认成功！" : "报警确认出现错误!";
-          var tp = msg.data > 0 ? "success" : "error";
-          this.$notify({
-            title: "报警",
-            message: mms,
-            type: tp,
-            position: "bottom-right",
-            offset: 60,
-          });
-        })
-        .catch((err) => {
-          this.$notify({
-            title: "报警",
-            message: `报警确认出现错误：${err.message}，请重试`,
-            type: "error",
-            position: "bottom-right",
-            offset: 60,
-          });
-        });
-    },
-  },
-};
-</script>
-<style scoped>
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
-  width: 8px;
-  height: 0px;
-  background-color: black;
-}
-
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
-  background-color: #292929;
-  border-radius: 6px;
-}
-:deep(.el-table td, .el-table th) {
-  border-bottom: 2px solid black;
-}
-tr {
-  line-height: 1.5;
-  background: #1e1e1e;
-  margin-bottom: 2px;
-  border-radius: 5px;
-}
-/* .ToolBar {
-  position: absolute;
-  right: 12px;
-  width: 586px;
-  text-align: center;
-  z-index: 2;
-  font-size: 14px;
-  height: 28px;
-  margin: 5px;
-  background: #1e1e1e;
-} */
-.table-main {
-  font-size: 14px;
-  width: 600px;
-  text-align: center;
-  background: #000000;
-  margin: 5px;
-  border-collapse: separate;
-  border-spacing: 0px 5px;
-}
-</style>

src/components/area/CheckArea.vue

@@ -1,6 +0,0 @@
-/* 校验区 */
-<template>
-    <gy-card title="校验区" area-style="check" circle-style="green" content-style="44">
-        <div></div>
-    </gy-card>
-</template>

src/components/area/ControlArea.vue

@@ -1,399 +0,0 @@
-/* 控制区 */
-<template>
-  <gy-card
-    title="控制区"
-    area-style="control"
-    circle-style="green"
-    content-style="44"
-    @contextmenu="contextmenu"
-  >
-    <ControlMatrixCard
-      title="待启动"
-      :datas="ls.start"
-      :operateStyle="1"
-      ref="start"
-    ></ControlMatrixCard>
-    <ControlMatrixCard
-      title="待停机"
-      :datas="ls.stop"
-      :operateStyle="2"
-      ref="stop"
-    ></ControlMatrixCard>
-    <ControlMatrixCard
-      title="待维护"
-      :datas="ls.maintain"
-      :operateStyle="6"
-      ref="maintain"
-    ></ControlMatrixCard>
-    <ControlMatrixCard
-      title="待取消维护"
-      :datas="ls.unmaintain"
-      :operateStyle="8"
-      ref="unmaintain"
-    ></ControlMatrixCard>
-    <ControlMatrixCard
-      title="待复位"
-      :datas="ls.reset"
-      :operateStyle="5"
-      ref="reset"
-    ></ControlMatrixCard>
-    <el-button
-      style="
-        z-index: 2;
-        position: absolute;
-        bottom: 10px;
-        right: 10px;
-        background: #292929;
-        font-size: 15px;
-        width: 90px;
-        border: none;
-        color: rgb(220, 220, 220);
-      "
-      size="small"
-      @click="menuClicked({ type: 'send' })"
-      >发送</el-button
-    >
-  </gy-card>
-  <el-button-group
-    style="z-index: 3; position: absolute; top: 6px; left: 120px"
-  >
-    <el-button :class="buttonLeftStyle" size="mini" @click="controlClick(false)"
-      >手动</el-button
-    >
-    <el-button :class="buttonRightStyle" size="mini" @click="controlClick(true)"
-      >自动</el-button
-    >
-  </el-button-group>
-</template>
-
-<script>
-import ControlMatrixCard from "./windturbine/control/ControlMatrixCard.vue";
-import MessageBridge from "../../assets/script/MessageBridge";
-import BackgroundData from "../../assets/script/BackgroundData";
-
-export default {
-  name: "ControlArea",
-  components: {
-    ControlMatrixCard,
-  },
-  props: {},
-  computed: {
-    buttonLeftStyle: function () {
-      return this.IsAutoControl ? "button-unselected" : "button-selected";
-    },
-    buttonRightStyle: function () {
-      return this.IsAutoControl ? "button-selected" : "button-unselected";
-    },
-  },
-  created: function () {
-    this.initData();
-  },
-  data() {
-    return {
-      ls: {
-        start: { key: "待启动", value: [] },
-        stop: { key: "待停机", value: [] },
-        maintain: { key: "待维护", value: [] },
-        unmaintain: { key: "待取消维护", value: [] },
-        reset: { key: "待复位", value: [] },
-      },
-      IsAutoControl: false,
-      controlErorCodes:[
-        "控制成功",
-        "控制命令发送失败",
-        "无效的控制地址",
-        "被控设备异常",
-        "网络连接错误,检查场站通信",
-        "控制结果读取超时",
-        "未知错误",
-        "控制命令错误",
-        "收到无法识别数据",
-        "未读取到数据包",
-        "未知错误",
-        "风机操作过频繁",
-        "风机被挂牌",
-        "风机操作与风机状态不符",
-        "需要登录",
-      ],
-    };
-  },
-  methods: {
-    initData: function () {
-      var mb = MessageBridge.getInstance();
-      var vs = [{ key: "/topic/suggestion", action: this.suggestion }];
-      mb.register(vs);
-    },
-    suggestion(msg, headers) {
-      var val = JSON.parse(msg);
-      var tp = headers["operate-type"];
-      if (tp == "UnMaintain") {
-        this.updateSuggestion(this.ls.unmaintain.value, val);
-      } else if (tp == "Start") {
-        //推荐启动
-        this.updateSuggestion(this.ls.start.value, val);
-      } else if (tp == "Stop") {
-        // 推荐停机
-        this.updateSuggestion(this.ls.stop.value, val);
-      } else if (tp == "Reset") {
-        // 推荐复位
-        this.updateSuggestion(this.ls.reset.value, val);
-      } else if (tp == "Maintain") {
-        // 推荐维护
-        this.updateSuggestion(this.ls.maintain.value, val);
-      }
-    },
-
-    /* 获取推荐类型 */
-    getSuggestionType(val) {
-      if (typeof val === "undefined") return null;
-      for (var v in val) {
-        return val[v].adviceOperateStyle;
-      }
-      return null;
-    },
-
-    /* 更新推荐数据 */
-    updateSuggestion(ll, val) {
-      var lls = new Array();
-      for (var v1 in ll) {
-        var v2 = val[ll[v1]];
-        if (typeof v2 === "undefined") {
-          lls.push(v1);
-        }
-      }
-      for (var v3 in lls) {
-        ll.splice(v3, 1);
-      }
-      for (var v in val) {
-        var vl = val[v];
-        if (!ll.includes(vl.windturbineId)) {
-          ll.push(vl.windturbineId);
-        }
-      }
-    },
-
-    /* 右键菜单 */
-    contextmenu() {
-      const { remote } = require("electron");
-      var that = this;
-      const menuTemplate = [
-        {
-          label: "发送",
-          click() {
-            that.menuClicked({ type: "send" });
-          },
-        },
-        {
-          label: "挂牌",
-          submenu: [
-            {
-              label: "检修",
-              click() {
-                that.menuClicked({ type: "lock", value: "CheckLock" });
-              },
-            },
-            {
-              label: "故障维修",
-              click() {
-                that.menuClicked({ type: "lock", value: "FaultLock" });
-              },
-            },
-            {
-              label: "场内受累检修",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationCheckLock" });
-              },
-            },
-            {
-              label: "场内受累故障",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationFaulLock" });
-              },
-            },
-            {
-              label: "场外受累电网",
-              click() {
-                that.menuClicked({
-                  type: "lock",
-                  value: "StationPowerLineLock",
-                });
-              },
-            },
-            {
-              label: "场外受累天气",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationWeatherLock" });
-              },
-            },
-          ],
-        },
-        {
-          label: "标注",
-          click() {
-            that.menuClicked({ type: "marking" });
-          },
-        },
-      ];
-      const menu = remote.Menu.buildFromTemplate(menuTemplate);
-
-      menu.popup(remote.getCurrentWindow());
-    },
-
-    menuClicked(msg) {
-      var bd = BackgroundData.getInstance();
-      if (!bd.LoginUser) {
-        this.$notify({
-          title: "请登录",
-          message: "控制风机需要先登录！",
-          type: "warning",
-          position: "bottom-right",
-          offset: 60,
-        });
-        return;
-      }
-      if (msg.type == "lock") {
-        // 挂牌
-        var los = this.getSelectedItems();
-        for (var id in los) {
-          los[id].lockType = msg.value;
-        }
-        bd.windturbineControl(
-          los,
-          true,
-          this.controlSuccess,
-          this.controlError
-        );
-      } else if (msg.type == "send") {
-        // 发送
-        var vs = this.getSelectedItems(true);
-        bd.windturbineControl(
-          vs,
-          false,
-          this.controlSuccess,
-          this.controlError
-        );
-      } else if (msg.type == "marking") {
-        // 标注
-        var vvs = this.getSelectedItems();
-        bd.marking(vvs);
-      }
-      this.clearSelected();
-    },
-
-    /* 控制成功 */
-    controlSuccess(msg) {
-      console.log(msg);
-      var mss = '';     // 信息
-      var iserror=false;// 是否有控制错误的风机
-      for(var v in msg.data){
-        var val = msg.data[v];
-        if(val.errorCode>0){
-          iserror=true;
-          mss+=`${val.windturbineId}  ${this.controlErorCodes[val.errorCode]}\n`;
-        }
-      }
-      var tp = iserror?"warning":"success";
-      var dt = iserror?0:4500;
-      if(!iserror){
-        mss="控制成功";
-      }
-
-      this.$notify({
-          title: "控制",
-          message: mss,
-          type: tp,
-          position: "bottom-right",
-          offset: 60,
-          duration: dt,
-        });
-    },
-
-    /* 控制失败 */
-    controlError(err) {
-      this.$notify({
-        title: "控制出现错误",
-        message: err.message,
-        type: "warning",
-        position: "bottom-right",
-        offset: 60,
-      });
-    },
-
-    /* 获取选中的项目，isControl：是否是控制 */
-    getSelectedItems(isControl) {
-      var ls = new Array();
-      this.$refs.start.outputSelectedItems(ls);
-      this.$refs.stop.outputSelectedItems(ls);
-      if (isControl) return ls;
-      this.$refs.maintain.outputSelectedItems(ls);
-      this.$refs.unmaintain.outputSelectedItems(ls);
-      this.$refs.reset.outputSelectedItems(ls);
-      return ls;
-    },
-
-    /* 清除所有选择 */
-    clearSelected() {
-      this.$refs.start.clearSelected();
-      this.$refs.stop.clearSelected();
-      this.$refs.maintain.clearSelected();
-      this.$refs.unmaintain.clearSelected();
-      this.$refs.reset.clearSelected();
-    },
-
-    controlClick(isAuto) {
-      var bd = BackgroundData.getInstance();
-      if (isAuto) {
-        if (!bd.LoginUser) {
-          this.$notify({
-            title: "请登录",
-            message: "切换为自动控制需要先登录！",
-            type: "warning",
-            position: "bottom-right",
-            offset: 60,
-          });
-          return;
-        }
-        this.AutoSendTimer = setInterval(this.AutoSend, 60000);
-        /* this.$message({
-          message: "已切换为自动控制",
-          type: "success",
-        }); */
-      } else {
-        /* this.$message({
-          message: "已切换为手动控制",
-          type: "success",
-        }); */
-        clearInterval(this.AutoSendTimer);
-      }
-      this.IsAutoControl = isAuto;
-    },
-
-    /* 自动发送命令 */
-    AutoSend() {
-      var ls = new Array();
-      this.$refs.start.outputAllItems(ls);
-      this.$refs.stop.outputAllItems(ls);
-      console.log("自动发送命令 " + ls.length);
-      if (ls.length <= 0) return;
-      var bd = BackgroundData.getInstance();
-      bd.windturbineControlSystem(ls, false);
-    },
-  },
-};
-</script>
-<style scoped>
-.button-selected {
-  background: black;
-  font-size: 14px;
-  width: 80px;
-  border: none;
-  color: rgb(220, 220, 220);
-}
-.button-unselected {
-  background: #202020;
-  font-size: 14px;
-  width: 80px;
-  border: none;
-  color: rgb(220, 220, 220);
-}
-</style>

src/components/area/LabelArea.vue

@@ -1,64 +0,0 @@
-/* 标注区 */
-<template>
-    <gy-card title="标注区" area-style="label" circle-style="yellow" content-style="25">
-        <div v-for="mk in values" :key="mk" @contextmenu="contextmenu(mk)" style="width:110px;margin-left:10px;margin-top:10px;display: inline-block;">
-            <img src="../../assets/img/LabelArea/flag.png" style="float:left;margin-top:5px;margin-left:18px;"/>
-            <div style="text-align:center;font-size:12px;float:right;margin-right:18px;">{{mk.title}}</div>
-            <input v-model="mk.value" style="font-size:12px;border:none;background-color:#292929;height:26px;border-radius:6px;text-align:center;outline:none;width:110px;color:rgb(220,220,220);"/>
-        </div>
-    </gy-card>
-</template>
-
-<script>
-import BackgroundData from "../../assets/script/BackgroundData";
-
-export default {
-  name: "LabelArea",
-  data() {
-    return {
-      values: new Array(),
-    };
-  },
-  created() {
-    this.refreshTimer = setInterval(this.refreshData, 1000);
-  },
-  methods: {
-    refreshData() {
-      this.values = new Array();
-      this.values = BackgroundData.getInstance().Marks;
-    },
-
-    contextmenu(mk) {
-      const { remote } = require("electron");
-      var that = this;
-      const menuTemplate = [
-        {
-          label: "删除",
-          click() {
-            that.remove(mk);
-          },
-        },
-      ];
-      const menu = remote.Menu.buildFromTemplate(menuTemplate);
-
-      menu.popup(remote.getCurrentWindow());
-    },
-
-    remove(mk) {
-      var indx = -1;
-      for (var ind in this.values) {
-        if (this.values[ind].id == mk.id) {
-          indx = ind;
-          break;
-        }
-      }
-      if (indx < 0) return;
-      this.values.splice(indx, 1);
-      BackgroundData.getInstance().removeMarked(mk);
-    },
-  },
-};
-</script>
-
-<style scoped>
-</style>

src/components/area/ProblemArea.vue

@@ -1,147 +0,0 @@
-/* 问题区 */
-<template>
-  <gy-card
-    title="问题区"
-    area-style="problem"
-    circle-style="green"
-    content-style="89"
-    @parentRun="run"
-    @contextmenu="contextmenu"
-  >
-    <ProblemMatrixCard title="故障" :type="5" ref="malfunction"></ProblemMatrixCard>
-    <ProblemMatrixCard title="维护" :type="6" ref="maintain"></ProblemMatrixCard>
-    <ProblemMatrixCard title="离线" :type="7" ref="offline"></ProblemMatrixCard>
-    <ProblemMatrixCard title="挂牌" :type="-1" ref="lock"></ProblemMatrixCard>
-  </gy-card>
-</template>
-
-<script>
-import ProblemMatrixCard from "./windturbine/problem/ProblemMatrixCard.vue";
-import BackgroundData from "../../assets/script/BackgroundData";
-
-export default {
-  name: "ProblemArea",
-  components: {
-    ProblemMatrixCard,
-  },
-  props: {},
-  data() {
-    return {
-      ls: {
-        maintain: { key: "维护", value: [] },
-        malfunction: { key: "故障", value: [] },
-        offline: { key: "离线", value: [] },
-        lockd: { key: "挂牌", value: [] },
-      },
-    };
-  },
-  computed: {},
-  created: function () {
-    
-  },
-  methods: {
-    /* 右键菜单 */
-    contextmenu() {
-      const { remote } = require("electron");
-      var that = this;
-      const menuTemplate = [
-        {
-          label: "标注",
-          click() {
-            that.menuClicked({ type: "marking" });
-          },
-        },
-        {
-          label: "挂牌",
-          submenu: [
-            {
-              label: "检修",
-              click() {
-                that.menuClicked({ type: "lock", value: "CheckLock" });
-              },
-            },
-            {
-              label: "故障维修",
-              click() {
-                that.menuClicked({ type: "lock", value: "FaultLock" });
-              },
-            },
-            {
-              label: "场内受累检修",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationCheckLock" });
-              },
-            },
-            {
-              label: "场内受累故障",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationFaulLock" });
-              },
-            },
-            {
-              label: "场外受累电网",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationPowerLineLock" });
-              },
-            },
-            {
-              label: "场外受累天气",
-              click() {
-                that.menuClicked({ type: "lock", value: "StationWeatherLock" });
-              },
-            },
-          ],
-        },
-        {
-          label: "取消挂牌",
-          click() {
-            that.menuClicked({ type: "lock",value:"UnLock" });
-          },
-        },
-      ];
-      const menu = remote.Menu.buildFromTemplate(menuTemplate);
-
-      menu.popup(remote.getCurrentWindow());
-    },
-
-    menuClicked(msg) {
-      var bd = BackgroundData.getInstance();
-      if (!bd.LoginUser) {
-        bd.showdialog("提示", "请登录：", "在控制之前需要先登录！");
-        return;
-      }
-      if (msg.type == "lock") {
-        // 挂牌
-        var los = this.getSelectedItems();
-        for(var id in los){
-          los[id].lockType=msg.value;
-        }
-        bd.windturbineControl(los,true);
-      } else if (msg.type == "marking") {
-        // 标注
-        var vs = this.getSelectedItems();
-        bd.marking(vs);
-      }
-      this.clearSelected();
-    },
-
-    /* 获取选中的项目 */
-    getSelectedItems(){
-      var ls = new Array();
-      this.$refs.malfunction.outputSelectedItems(ls);
-      this.$refs.maintain.outputSelectedItems(ls);
-      this.$refs.offline.outputSelectedItems(ls);
-      this.$refs.lock.outputSelectedItems(ls);
-      return ls;
-    },
-    
-    /* 清除所有选择 */
-    clearSelected(){
-      this.$refs.malfunction.clearSelected();
-      this.$refs.maintain.clearSelected();
-      this.$refs.offline.clearSelected();
-      this.$refs.lock.clearSelected();
-    },
-  },
-};
-</script>

src/components/area/RecommendedArea.vue

@@ -1,66 +0,0 @@
-/* 推荐区 */
-<template>
-  <gy-card
-    title="推荐区"
-    area-style="recommended"
-    circle-style="green"
-    content-style="37"
-  >
-  <div style="display: flex;justify-content: flex-start;flex-wrap: wrap;">
-  <table v-for="vl in values" :key="vl">
-      <tr>{{vl.stationName}}</tr>
-      <tr>{{vl.content}}</tr>
-      <tr>{{vl.createTime}}</tr>
-  </table>  
-  </div>
-  </gy-card>
-</template>
-
-<script>
-import BackgroundData from "../../assets/script/BackgroundData";
-export default {
-  name: "RecommendedArea",
-  props: ["datas"],
-  data() {
-    return {
-      values: new Array(),
-    };
-  },
-  created() {
-    this.initData();
-  },
-  mounted() {},
-  watch: {},
-  methods: {
-    initData() {
-      setInterval(this.refreshData, 2000);
-    },
-    refreshData() {
-      var bd = BackgroundData.getInstance();
-      var ll = new Array();
-      for (var v in bd.Recommends) {
-        if (bd.Recommends[v].isActive) {
-          ll.push(bd.Recommends[v]);
-        }
-      }
-      this.values = ll;
-    },
-  },
-};
-</script>
-<style scoped>
-table{
-  background-image: url("../../assets/img/RecommendedArea/guznzhu_bg_01.png");
-  text-align: center;
-  font-size:12px;
-  width: 110px;
-  height: 110px;
-  background-size:110px;
-  margin-left: 10px;
-  margin-top: 10px;
-  padding-top: 10px;
-  background-repeat:no-repeat;
-  
-}
-</style>
-

src/components/area/gy-card.vue

@@ -1,383 +0,0 @@
-/* 自定义tabs */
-<template>
-    <transition>
-        <div :class='areaClass' @mouseover="hover = false"
-             @mouseleave="hover = false" onselectstart="return false">
-            <div :class="headerClass"> <!-- @dblclick="gyCardDbClick" -->
-                <div :class='circleClass'></div>
-                <span class="gy-card-title">{{ title }}</span>
-                <img class="gy-card-decoration01" src="../../assets/img/controlcenter/decoration01.png">
-                <img class="gy-card-decoration02" src="../../assets/img/controlcenter/decoration02.png">
-            </div>
-            <div :class='contentClass'>
-                <el-scrollbar style="height: 100%">
-                    <slot></slot>
-                </el-scrollbar>
-            </div>
-        </div>
-    </transition>
-</template>
-
-<script>
-    /**
-     * todo 拖动
-     * todo 控制区
-     *
-     * 动态值:
-     * 1. gy-card-area-label中的 height,margin-top
-     * 2. gy-card-circle-yellow中的颜色
-     * 3. gy-card-content-25 中的高度
-     *
-     * 使用事例:
-     * <gy-card title="校验区" area-style="check" circle-style="green" content-style="44">
-     * <div>动态内容</div>
-     * </gy-card>
-     */
-    export default {
-        name: 'gy-card',
-        emits: ["parentRun"],
-        props: {
-            title: {
-                type: String,
-                default: '校验区',
-                required: true
-            },
-            areaStyle: {
-                type: String,
-                default: 'check',
-                required: true
-            },
-            circleStyle: {
-                type: String,
-                default: 'green',
-                required: true
-            },
-            contentStyle: {
-                type: String,
-                default: '44',
-                required: true
-            }
-        },
-        data() {
-            return {
-                hover: false,
-                big: false
-            }
-        },
-        computed: {
-            areaClass() {
-                if (this.big) {
-                    return `gy-card-area-big`;
-                } else {
-                    return `gy-card-area-${this.areaStyle}`;
-                }
-            },
-            circleClass() {
-                return `gy-card-circle gy-card-circle-${this.circleStyle}`;
-            },
-            contentClass() {
-                if (this.big) {
-                    return `gy-card-content-big`;
-                } else {
-                    return `gy-card-content-${this.contentStyle}`;
-                }
-            },
-            headerClass() {
-                if (this.hover) {
-                    return `gy-card-header-hover`;
-                } else {
-                    return `gy-card-header`;
-                }
-            }
-        },
-        methods: {
-            /* gyCardDbClick() {
-                let big = this.big
-                if (big) {
-                    this.big = false
-                } else {
-                    this.big = false
-                }
-            }, */
-        }
-    }
-</script>
-
-<style scoped="scoped">
-    .gy-card-header {
-        position: relative;
-        height: 40px;
-        background-color: #292929;
-        color: white;
-        box-sizing: border-box;
-    }
-
-    .gy-card-content-89 {
-        position: relative;
-        height: calc(89vh - 50px);
-        background-color: #000000;
-        color: white;
-        box-sizing: border-box;
-        border-radius: 7px;
-    }
-
-    .gy-card-content-44 {
-        position: relative;
-        height: calc(44vh - 50px);
-        background-color: #000000;
-        color: white;
-        box-sizing: border-box;
-        border-radius: 7px;
-    }
-
-    .gy-card-content-37 {
-        position: relative;
-        height: calc(37vh - 50px);
-        background-color: #000000;
-        color: white;
-        box-sizing: border-box;
-        border-radius: 7px;
-    }
-
-    .gy-card-content-25 {
-        position: relative;
-        height: calc(25vh - 50px);
-        background-color: #000000;
-        color: white;
-        box-sizing: border-box;
-        border-radius: 7px;
-    }
-
-    .gy-card-circle{
-        position: relative;
-        top: 7px;
-        display: inline-block;
-        width: 7px;
-        height: 7px;
-        -moz-border-radius: 50%;
-        -webkit-border-radius: 50%;
-        border-radius: 50%;
-    }
-
-    .gy-card-circle-green {
-        background-color: #008000;
-    }
-
-    .gy-card-circle-yellow {
-        background-color: #ffff00;
-    }
-
-    .gy-card-title {
-        position: relative;
-        top: 10px;
-        left: 10px;
-    }
-
-    .gy-card-decoration01 {
-        position: absolute;
-        right: 80px;
-    }
-
-    .gy-card-decoration02 {
-        position: absolute;
-        top: 20px;
-        right: 20px;
-    }
-
-    .gy-card-area-problem {
-        position: relative;
-        height: 89vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin: 0px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-alarm {
-        position: relative;
-        height: 25vh;
-        margin-top: 10px;
-        background-color: #292929;
-        border-radius: 7px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-check {
-        position: relative;
-        height: 44vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin-top: 10px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-control {
-        position: relative;
-        width: 100%;
-        height: 44vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin: 0px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-label {
-        position: relative;
-        height: 25vh;
-        margin-top: 10px;
-        background-color: #292929;
-        border-radius: 7px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-recommended {
-        position: relative;
-        height: 37vh;
-        background-color: #292929;
-        border-radius: 7px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-header-hover {
-        position: relative;
-        height: 40px;
-        background-color: #292929;
-        color: white;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-problem:hover {
-        position: relative;
-        height: 89vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin: 0px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-alarm:hover {
-        position: relative;
-        height: 25vh;
-        margin-top: 10px;
-        background-color: #292929;
-        border-radius: 7px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-/*     .gy-card-area-check:hover {
-        position: relative;
-        height: 44vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin: 0px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
- */
-/*     .gy-card-area-control:hover {
-        position: relative;
-        width: 100%;
-        height: 44vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin-top: 10px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    } */
-
-    .gy-card-area-label:hover {
-        position: relative;
-        height: 25vh;
-        margin-top: 10px;
-        background-color: #292929;
-        border-radius: 7px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-    .gy-card-area-recommended:hover {
-        position: relative;
-        height: 37vh;
-        background-color: #292929;
-        border-radius: 7px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-    }
-
-
-    .gy-card-area-big {
-        position: fixed;
-        top: 0px;
-        left: 0px;
-        width: 100vw;
-        height: 100vh;
-        background-color: #292929;
-        border-radius: 7px;
-        margin: 0px;
-        padding-top: 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 10px;
-        box-sizing: border-box;
-        z-index: 900;
-    }
-
-    .gy-card-content-big {
-        position: relative;
-        height: calc(100vh - 50px);
-        background-color: #000000;
-        color: white;
-        box-sizing: border-box;
-        border-radius: 7px;
-    }
-
-    .el-scrollbar__wrap {
-        overflow: scroll;
-        width: 110%;
-        height: 120%;
-    }
-
-    ::-webkit-scrollbar {
-        width: 0;
-        height: 0;
-    }
-
-</style>

src/components/area/index.js

@@ -1,6 +0,0 @@
-import gyCard from './gy-card'
-
-gyCard.install = function (Vue) {
-    Vue.component(gyCard.name, gyCard)
-}
-export default gyCard

src/components/area/mainwindow/TitleBarCard.vue

@@ -1,40 +0,0 @@
-<template>
-    <div>
-        <span class="title">{{title}}</span>
-        <span class="value">{{value}}</span>
-        <span class="title">{{unit}}</span>
-    </div>
-</template>
-
-<script>
-export default {
-  name: 'TitleBarCard',
-  props: {
-    title: String,
-    value: Number,
-    unit: String,
-  },
-  data() {
-    return {
-      
-    };
-  },
-  methods: {
-    handleClose() {},
-  }
-}
-</script>
-
-<style scoped>
-
-span{
-  font-size: 15px;
-  margin-left: 9px;
-}
-.title{
-    color:#FFFFFF;
-}
-.value{
-  color:#50AE56;
-}
-</style>

src/components/area/windturbine/BasicInformationDetail.vue

@@ -1,252 +0,0 @@
-<template>
-  <div class="firstdiv">
-    <div v-for="(item, index) in warnList" :key="index">
-      <div :class="'worning' + item.type">
-        <Worning :worn="item.alertText"></Worning>
-      </div>
-    </div>
-    <img style="float: left; margin-left: 40px; margin-top: 90px;width:50vh;height:25vh;"
-      src="../../../assets/img/WindturbineDetailPages/变桨.png" object-fit="fill" />
-    <div class="twodiv">
-      <table>
-        <tr>
-          <th>温度信息</th>
-        </tr>
-        <tr v-for="itm in temperatureInfo" :key="itm">
-          <td>{{ itm.name }}</td>
-          <td>{{ itm.value }}</td>
-          <td>{{ itm.unit }}</td>
-        </tr>
-      </table>
-      <table v-if="pitchInfo.length > 0">
-        <tr>
-          <th>变桨信息</th>
-        </tr>
-        <tr v-for="itm in pitchInfo" :key="itm">
-          <td>{{ itm.name }}</td>
-          <td>{{ itm.value }}</td>
-          <td>{{ itm.unit }}</td>
-        </tr>
-      </table>
-    </div>
-    <div class="onediv">
-      <table>
-        <tr>
-          <th>基本信息</th>
-        </tr>
-        <tr v-for="itm in generalInfo" :key="itm">
-          <td>{{ itm.name }}</td>
-          <td>{{ itm.value }}</td>
-          <td>{{ itm.unit }}</td>
-        </tr>
-      </table>
-      <table>
-        <tr>
-          <th>电网信息</th>
-        </tr>
-        <tr v-for="itm in powerGridInfo" :key="itm">
-          <td>{{ itm.name }}</td>
-          <td>{{ itm.value }}</td>
-          <td>{{ itm.unit }}</td>
-        </tr>
-      </table>
-    </div>
-    <!-- <div>{{alarms[0].alertText}}</div> -->
-  </div>
-</template>
-
-<script>
-  import BackgroundData from "../../../assets/script/BackgroundData";
-  import Worning from "./warning.vue"
-  export default {
-    name: "BasicInformationDetail",
-    components: {
-      Worning,
-    },
-    props: {
-      alarms: Array,
-    },
-    mounted() {
-      this.show()
-    },
-    data() {
-      return {
-        warnList: [],
-        BasicInfo: {},
-        temperatureInfo: new Array() /* 温度信息 */,
-        pitchInfo: new Array() /* 变桨信息 */,
-        generalInfo: new Array() /* 基本信息 */,
-        powerGridInfo: new Array() /* 电网信息 */,
-      };
-    },
-    methods: {
-      show() {
-        // axios.get(`http://${config.calcUrl}/alarm/real-time-alarm?objectId=${this.windturbine.windturbineId}&pageIndex=1&pageSize=50`)
-        // .then(msg=>{
-        //   var vs = msg.data;
-        //   if(vs.length<=0)return;
-        //   this.alarmTime = BackgroundData.getInstance().formatDate(vs[0].lastUpdateTime);
-        //   this.alarmContent = vs[0].alertText;
-        //   this.alarms = msg.data;
-        //   console.log(this.alarms)
-        // })
-      },
-      start(bi) {
-        this.BasicInfo = bi;
-        this.bindData();
-
-        this.refreshData();
-        this.refreshTimer = setInterval(this.refreshData, 3000);
-      },
-      end() {
-        clearInterval(this.refreshTimer);
-      },
-      alarmd(bi) {
-        let dataList = []
-        let warnList = []
-        let date1 = {
-          type: 1,
-          alertText :[]
-        }
-        let date2 = {
-          type: 2,
-          alertText :[]
-        }
-        let date3 = {
-          type: 3,
-          alertText :[]
-        }
-        let date4 = {
-          type: 4,
-          alertText :[]
-        }
-        let date5 = {
-          type: 5,
-          alertText :[]
-        }
-        bi.forEach(item => {
-          let data = {}
-          data.alertText = item.alertText
-          if (item.alertText.indexOf("变桨") >= 0) {
-            data.type = 1
-          } else if (item.alertText.indexOf("偏航") >= 0) {
-            data.type = 5
-          }
-          else if (item.alertText.indexOf("发电机") >= 0) {
-            data.type = 3
-          }
-          else if (item.alertText.indexOf("齿轮箱") >= 0) {
-            data.type = 2
-          }
-          else if (item.alertText.indexOf("液压") >= 0) {
-            data.type = 4
-          }
-          data.type ? warnList.push(data) : ''
-        })
-        warnList.forEach(item =>{
-          switch (item.type) {
-            case 1:
-              date1.alertText.push(item.alertText)
-              break;
-            case 2:
-              date2.alertText.push(item.alertText)
-              break;
-            case 3:
-              date3.alertText.push(item.alertText)
-              break;
-            case 4:
-              date4.alertText.push(item.alertText)
-              break;
-            case 5:
-              date5.alertText.push(item.alertText)
-              break;
-          }
-        })
-        date1.alertText.length>0?dataList.push(date1):''
-        date2.alertText.length>0?dataList.push(date2):''
-        date3.alertText.length>0?dataList.push(date3):''
-        date4.alertText.length>0?dataList.push(date4):''
-        date5.alertText.length>0?dataList.push(date5):''
-        this.warnList = dataList
-      },
-      /* 刷新数据 */
-      refreshData() {
-        var bg = BackgroundData.getInstance();
-        bg.initWinturbineBaseData(this.BasicInfo, this.onMessage);
-      },
-
-      /* 获得数据 */
-      onMessage(msg) {
-        this.BasicInfo.BasicInfo.forEach((element) => {
-          element.param.forEach((im) => {
-            var val = msg[im.code];
-            if (typeof val !== "undefined") {
-              if (im.unit == "万度") {
-                im.value = (val.doubleValue / 10000).toFixed(2);
-              } else {
-                im.value = val.doubleValue.toFixed(2);
-              }
-            }
-          });
-        });
-        console.log(msg);
-      },
-
-      bindData() {
-        this.BasicInfo.BasicInfo.forEach((element) => {
-          if (element.tag == "基本信息") {
-            this.generalInfo = element.param;
-          } else if (element.tag == "温度信息") {
-            this.temperatureInfo = element.param;
-          } else if (element.tag == "电网信息") {
-            this.powerGridInfo = element.param;
-          } else if (element.tag == "桨叶信息") {
-            this.pitchInfo = element.param;
-          }
-        });
-      },
-    },
-  };
-</script>
-
-<style scoped>
-.firstdiv {
-  height: 50vh;
-}
-.onediv {
-  float: right;
-  margin-right: 30px;
-}
-.twodiv {
-  float: right;
-  margin-right: 30px;
-}
-td:nth-child(1) {
-  height: 25px;
-  width: 130px;
-  text-align: right;
-  color: rgb(220, 220, 220);
-}
-td:nth-child(2) {
-  width: 78px;
-  text-align: right;
-  color: rgb(5, 176, 71);
-}
-td:nth-child(3) {
-  text-align: center;
-  width: 30px;
-  color: rgb(220, 220, 220);
-}
-tr:nth-child(1) {
-  font-size: 20px;
-  width: 90px;
-  text-align: right;
-  color: rgb(220, 220, 220);
-}
-th {
-  height: 40px;
-}
-table{
-  margin-top: 30px;
-}
-</style>

src/components/area/windturbine/MatrixCard.vue

@@ -1,62 +0,0 @@
-<template>
-  <div class="main" v-if="values.length > 0">
-    <div style="font-size:15px">{{ title }}</div>
-    <div class="content">
-      <WindturbineMinCard
-        v-for="vs in values"
-        :key="vs"
-        :status="vs.status"
-        :power="vs.power"
-        :windSpeed="vs.windSpeed"
-        :rollSpeed="vs.rollSpeed"
-        :windturbineId="vs.windturbineId"
-      ></WindturbineMinCard>
-    </div>
-    <div class="bottom"></div>
-  </div>
-</template>
-
-<script>
-import WindturbineMinCard from "./WindturbineMinCard.vue";
-export default {
-  name: "MatrixCard",
-  props: ["title", "datas"],
-  data() {
-    return {
-      values: [],
-    };
-  },
-
-  mounted() {
-    this.values = this.datas.value || [];
-  },
-
-  components: {
-    WindturbineMinCard,
-  },
-
-  watch: {
-    datas(val) {
-      this.values = val.value;
-    },
-  },
-};
-</script>
-
-<style scoped>
-.content {
-  display: grid;
-  grid-template-columns: repeat(5, 20%);
-}
-.bottom {
-  background-color: #292929;
-  width: 100%;
-  height: 2px;
-  margin-top: 5px;
-}
-.main {
-  margin-bottom: 15px;
-  margin-left: 5px;
-  margin-right: 5px;
-}
-</style>