单机页面4个导航图标 ，健康单机页面7个导航图标

src/assets/icon/svg/menu/q实时监视.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="175px" height="176px" viewBox="0 0 175 176" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
+    <title>实时监视</title>
+    <desc>Created with Sketch.</desc>
+    <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="实时监视" transform="translate(0.085938, 0.500000)" fill="#000000" fill-rule="nonzero">
+            <path d="M140.039062,0 L174.414062,59.55 L63.2390625,123.75 L28.8640625,64.2 L140.026563,0 L140.039062,0 Z M135.126563,18.3125 L47.1640625,69.0875 L68.1390625,105.4125 L156.101562,54.6375 L135.126563,18.3125 Z" id="形状"></path>
+            <path d="M0.0515625,80.8125 L48.9015625,73.0625 L66.0140625,102.6875 L34.4390625,140.375 L0.0640625,80.8125 L0.0515625,80.8125 Z M21.4015625,90.9875 L36.4640625,117.075 L49.7015625,101.275 L41.8890625,87.7375 L21.3890625,90.9875 L21.4015625,90.9875 Z M112.514062,88.6375 L112.514062,174.825 L100.014062,174.825 L100.014062,88.625 L112.514062,88.6375 Z" id="形状"></path>
+            <polygon id="路径" points="153.201562 162.325 153.201562 174.825 106.264062 174.825 106.264062 162.325"></polygon>
+        </g>
+    </g>
+</svg>

src/assets/icon/svg/menu/q曲线.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="205px" height="200px" viewBox="0 0 205 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
+    <title>曲线</title>
+    <desc>Created with Sketch.</desc>
+    <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="曲线" fill="#2C2C2C" fill-rule="nonzero">
+            <path d="M196,191.3 L9,191.3 L196,191.3 Z M77,131.8 L83.6,126.1 L182,40.5 L77,131.8 L77,131.8 Z" id="形状"></path>
+            <polyline id="路径" points="0.4 121.7 0.4 0 17.8 0 17.8 107.7 37.6 91.7 47.5 83.4 77.9 119.6 182.9 28.4 194.3 41.5 76.1 144.1 67.7 134.4 67.7 134.4 66.7 133.2 64.7 130.9 64.7 130.9 45.3 107.7 17.8 130 17.8 182.6 204.8 182.6 204.8 200 0.4 200 0.4 126.6"></polyline>
+        </g>
+    </g>
+</svg>

src/assets/icon/svg/menu/s指标列表.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="176px" height="157px" viewBox="0 0 176 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
+    <title>指标列表</title>
+    <desc>Created with Sketch.</desc>
+    <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="指标列表" transform="translate(-0.148438, 0.210938)" fill="#2C2C2C" fill-rule="nonzero">
+            <path d="M0.5,68.8 L69.3,68.8 L69.3,0 L0.5,0 L0.5,68.8 Z M13,12.5 L56.8,12.5 L56.8,56.3 L13,56.3 L13,12.5 Z" id="形状"></path>
+            <path d="M0.5,156.2 L69.3,156.2 L69.3,87.4 L0.5,87.4 L0.5,156.2 Z M13,100 L56.8,100 L56.8,143.8 L13,143.8 L13,100 Z" id="形状"></path>
+            <rect id="矩形" x="84.7" y="6.2" width="90.8" height="12.5"></rect>
+            <rect id="矩形" x="84.7" y="50" width="90.8" height="12.5"></rect>
+            <rect id="矩形" x="84.7" y="93.8" width="90.8" height="12.5"></rect>
+            <rect id="矩形" x="84.7" y="137.5" width="90.8" height="12.5"></rect>
+        </g>
+    </g>
+</svg>

src/views/HealthControl/Health4.vue

@@ -34,16 +34,16 @@ export default {
       wpId:"",
       wtId:"",
       menuDatas: [{
-        icon: "svg-agc",
+        icon: "svg-q实时监视",
         path: "/health/health0",
       },{
-        icon: "svg-agc",
+        icon: "svg-q健康",
         path: "/health/health10",
       },{
-        icon: "svg-agc",
+        icon: "svg-q趋势",
         path: "/health/health4/healthLineChart2",
       },{
-        icon: "svg-agc",
+        icon: "svg-q曲线",
         path: "/health/health4/healthLineChart",
       }]
     };

src/views/WindSite/WindSite.vue

@@ -1,203 +1,203 @@
-<template>
-  <div class="wind-site">
-    <div class="page-common-body">
-      <div class="page-common-body-router">
-        <router-view />
-      </div>
-      <div class="page-common-body-menu">
-        <div class="page-common-body-menu-box">
-          <div class="page-common-body-menu-border left top"></div>
-          <div class="page-common-body-menu-border left bottom"></div>
-          <div class="page-common-body-menu-border right top"></div>
-          <div class="page-common-body-menu-border right bottom"></div>
-          <router-link v-for="(menuData, index) of menuDatas" :key="index" :to="menuData.path">
-            <div class="page-common-body-menu-item" @click="clickMenu(index)" :class="{ active: activeIndex == index }">
-              <span class="svg-icon" :class="activeIndex == index ? 'svg-icon-yellow' : 'svg-icon-green'">
-                <SvgIcon :svgid="menuData.icon"></SvgIcon>
-              </span>
-            </div>
-          </router-link>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import SvgIcon from "@com/coms/icon/svg-icon.vue";
-export default {
-  // 名称
-  name: "WindSite",
-  // 使用组件
-  components: {
-    SvgIcon,
-  },
-  // 数据
-  data() {
-    return {
-      activeIndex: 0,
-      menuDatas: [
-        {
-          icon: "svg-agc",
-          path: "/monitor/windsite/home",
-        },
-        {
-          icon: "svg-matrix",
-          path: "/monitor/windsite/draughtfanlist",
-        },
-        // {
-        //   icon: "svg-agc",
-        //   path: "/monitor/windsite/matrix",
-        // },
-        // {
-        //   icon: "svg-agc",
-        //   path: "/monitor/windsite/lightmatrix",
-        // },
-        // {
-        //   icon: "svg-intranet-involvement",
-        //   path: "/monitor/windsite/box",
-        // },
-        // {
-        //   icon: "svg-matrix",
-        //   path: "/monitor/windsite/info",
-        // },
-        {
-          icon: "svg-easy-compass",
-          path: "/monitor/windsite/tower",
-        },
-        // {
-        //   icon: "svg-easy-compass",
-        //   path: "/monitor/windsite/Inverter-Info",
-        // },
-        // {
-        //   icon: "svg-easy-compass",
-        //   path: "/monitor/windsite/map",
-        // },
-        // {
-        //   icon: "svg-easy-compass",
-        //   path: "/monitor/windsite/map1",
-        // },
-        {
-          icon: "svg-matrix",
-          path: "/monitor/windsite/matrix",
-        },
-        {
-          icon: "svg-matrix",
-          path: "/monitor/windsite/generalappearance",
-        },
-        {
-          icon: "svg-matrix",
-          path: "/monitor/windsite/boosterstation",
-        },
-        {
-          icon: "svg-matrix",
-          path: "/monitor/windsite/map",
-        },
-      ],
-    };
-  },
-  // 函数
-  methods: {
-    clickMenu: function(index) {
-      this.activeIndex = index;
-    },
-  },
-
-  created() {
-    this.menuDatas.forEach((ele) => {
-      ele.path = ele.path + "/" + this.$route.params.wpId;
-    });
-  },
-
-  mounted() {},
-};
-</script>
-
-<style lang="less" scoped>
-.wind-site {
-  .page-common-body {
-    display: flex;
-    flex-direction: row;
-    margin-top: 0.741vh;
-
-    .page-common-body-router {
-      overflow: auto;
-      overflow-x: hidden;
-      height: calc(100vh - 7.037vh);
-      flex: 1 1 auto;
-    }
-
-    .page-common-body-menu {
-      width: 7.407vh;
-      padding: 0 1.481vh 1.481vh 1.481vh;
-
-      .page-common-body-menu-box {
-        border: 0.093vh solid @darkgray;
-        background-color: fade(@darkgray, 30%);
-        padding: 2.222vh 0.185vh;
-        position: relative;
-
-        .page-common-body-menu-border {
-          position: absolute;
-          width: 0.37vh;
-          height: 0.37vh;
-          background-color: @write;
-          border-radius: 50%;
-
-          &.left {
-            left: -0.185vh;
-          }
-
-          &.right {
-            right: -0.185vh;
-          }
-
-          &.top {
-            top: -0.185vh;
-          }
-
-          &.bottom {
-            bottom: -0.185vh;
-          }
-        }
-
-        .page-common-body-menu-item {
-          border: 0.093vh solid fade(@green, 40%);
-          width: 3.889vh;
-          height: 3.889vh;
-          border-radius: 0.278vh;
-          margin-top: 0.741vh;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          cursor: pointer;
-
-          a {
-            line-height: 0;
-          }
-
-          // &:first-child {
-          //   margin-top: 0;
-          // }
-
-          &.active {
-            border-color: fade(@yellow, 40%);
-            position: relative;
-
-            &::after {
-              content: "";
-              width: calc(100% - 0.37vh);
-              height: calc(100% - 0.37vh);
-              position: absolute;
-              border: 0.093vh solid @yellow;
-              box-shadow: 0 0 0.37vh @yellow;
-              top: 0.093vh;
-              left: 0.093vh;
-            }
-          }
-        }
-      }
-    }
-  }
-}
-</style>
+<template>
+  <div class="wind-site">
+    <div class="page-common-body">
+      <div class="page-common-body-router">
+        <router-view />
+      </div>
+      <div class="page-common-body-menu">
+        <div class="page-common-body-menu-box">
+          <div class="page-common-body-menu-border left top"></div>
+          <div class="page-common-body-menu-border left bottom"></div>
+          <div class="page-common-body-menu-border right top"></div>
+          <div class="page-common-body-menu-border right bottom"></div>
+          <router-link v-for="(menuData, index) of menuDatas" :key="index" :to="menuData.path">
+            <div class="page-common-body-menu-item" @click="clickMenu(index)" :class="{ active: activeIndex == index }">
+              <span class="svg-icon" :class="activeIndex == index ? 'svg-icon-yellow' : 'svg-icon-green'">
+                <SvgIcon :svgid="menuData.icon"></SvgIcon>
+              </span>
+            </div>
+          </router-link>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import SvgIcon from "@com/coms/icon/svg-icon.vue";
+export default {
+  // 名称
+  name: "WindSite",
+  // 使用组件
+  components: {
+    SvgIcon,
+  },
+  // 数据
+  data() {
+    return {
+      activeIndex: 0,
+      menuDatas: [
+        {
+          icon: "svg-s场站监视",
+          path: "/monitor/windsite/home",
+        },
+        {
+          icon: "svg-s指标列表",
+          path: "/monitor/windsite/draughtfanlist",
+        },
+        // {
+        //   icon: "svg-agc",
+        //   path: "/monitor/windsite/matrix",
+        // },
+        // {
+        //   icon: "svg-agc",
+        //   path: "/monitor/windsite/lightmatrix",
+        // },
+        // {
+        //   icon: "svg-intranet-involvement",
+        //   path: "/monitor/windsite/box",
+        // },
+        // {
+        //   icon: "svg-matrix",
+        //   path: "/monitor/windsite/info",
+        // },
+        {
+          icon: "svg-s测风塔",
+          path: "/monitor/windsite/tower",
+        },
+        // {
+        //   icon: "svg-easy-compass",
+        //   path: "/monitor/windsite/Inverter-Info",
+        // },
+        // {
+        //   icon: "svg-easy-compass",
+        //   path: "/monitor/windsite/map",
+        // },
+        // {
+        //   icon: "svg-easy-compass",
+        //   path: "/monitor/windsite/map1",
+        // },
+        {
+          icon: "svg-matrix",
+          path: "/monitor/windsite/matrix",
+        },
+        {
+          icon: "svg-s总貌",
+          path: "/monitor/windsite/generalappearance",
+        },
+        {
+          icon: "svg-s升压站",
+          path: "/monitor/windsite/boosterstation",
+        },
+        {
+          icon: "svg-s地图",
+          path: "/monitor/windsite/map",
+        },
+      ],
+    };
+  },
+  // 函数
+  methods: {
+    clickMenu: function(index) {
+      this.activeIndex = index;
+    },
+  },
+
+  created() {
+    this.menuDatas.forEach((ele) => {
+      ele.path = ele.path + "/" + this.$route.params.wpId;
+    });
+  },
+
+  mounted() {},
+};
+</script>
+
+<style lang="less" scoped>
+.wind-site {
+  .page-common-body {
+    display: flex;
+    flex-direction: row;
+    margin-top: 0.741vh;
+
+    .page-common-body-router {
+      overflow: auto;
+      overflow-x: hidden;
+      height: calc(100vh - 7.037vh);
+      flex: 1 1 auto;
+    }
+
+    .page-common-body-menu {
+      width: 7.407vh;
+      padding: 0 1.481vh 1.481vh 1.481vh;
+
+      .page-common-body-menu-box {
+        border: 0.093vh solid @darkgray;
+        background-color: fade(@darkgray, 30%);
+        padding: 2.222vh 0.185vh;
+        position: relative;
+
+        .page-common-body-menu-border {
+          position: absolute;
+          width: 0.37vh;
+          height: 0.37vh;
+          background-color: @write;
+          border-radius: 50%;
+
+          &.left {
+            left: -0.185vh;
+          }
+
+          &.right {
+            right: -0.185vh;
+          }
+
+          &.top {
+            top: -0.185vh;
+          }
+
+          &.bottom {
+            bottom: -0.185vh;
+          }
+        }
+
+        .page-common-body-menu-item {
+          border: 0.093vh solid fade(@green, 40%);
+          width: 3.889vh;
+          height: 3.889vh;
+          border-radius: 0.278vh;
+          margin-top: 0.741vh;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          cursor: pointer;
+
+          a {
+            line-height: 0;
+          }
+
+          // &:first-child {
+          //   margin-top: 0;
+          // }
+
+          &.active {
+            border-color: fade(@yellow, 40%);
+            position: relative;
+
+            &::after {
+              content: "";
+              width: calc(100% - 0.37vh);
+              height: calc(100% - 0.37vh);
+              position: absolute;
+              border: 0.093vh solid @yellow;
+              box-shadow: 0 0 0.37vh @yellow;
+              top: 0.093vh;
+              left: 0.093vh;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>