|
|
@@ -1,155 +1,181 @@
|
|
|
<template>
|
|
|
- <div class="header-nxf">
|
|
|
- <p class="nxfP">智能管控一体化系统(惠安风场)</p>
|
|
|
- <ul class="header-nxf-list">
|
|
|
- <!-- @click="click(menu)" -->
|
|
|
- <li class="header-nxf-it" v-for="(menu, index) of menus" :key="menu"
|
|
|
- :class="{ active: activeIndex == index }">
|
|
|
- <a :href="menu.path" class="aclas">{{ menu.text }}</a>
|
|
|
- <!-- {{ menu.text }} -->
|
|
|
- <img class="imgcla" :src="menuimg" alt="" v-if="index !== menus.length-1">
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
+ <div class="header-nxf">
|
|
|
+ <p class="nxfP">智能管控一体化系统(惠安风场)</p>
|
|
|
+ <ul class="header-nxf-list">
|
|
|
+ <!-- @click="click(menu)" -->
|
|
|
+ <li
|
|
|
+ class="header-nxf-it"
|
|
|
+ v-for="(menu, index) of menus"
|
|
|
+ :key="menu"
|
|
|
+ :class="{ active: activeIndex == index }"
|
|
|
+ >
|
|
|
+ <a :href="menu.path" class="aclas">{{ menu.text }}</a>
|
|
|
+ <!-- {{ menu.text }} -->
|
|
|
+ <img
|
|
|
+ class="imgcla"
|
|
|
+ :src="menuimg"
|
|
|
+ alt=""
|
|
|
+ v-if="index !== menus.length - 1"
|
|
|
+ />
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script>
|
|
|
- import img from '@/assets/nxfImg/menu.png'
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- themeName: false,
|
|
|
- menuimg: img,
|
|
|
- menus: [{
|
|
|
- id: "1",
|
|
|
- text: "全场监控",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/9d23c8a1-444d-a21b-17a0-bb618059f8c0?instanceId=a760dcd2-413b-a488-bcd7-942cd5f8fff3",
|
|
|
- isActive: true,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "2",
|
|
|
- text: "矩阵图",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/060b34d5-26cc-f172-632a-e80ca3b7be04?instanceId=12b577b4-ea67-c8b6-7b13-1cb066aaf814",
|
|
|
- isActive: true,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "3",
|
|
|
- text: "告警中心",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/3ab0f63d-669b-a119-1eb7-b85fbb6b07bc?instanceId=465034a6-24c1-c0aa-a480-16c7ea65e216",
|
|
|
- isActive: true,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "4",
|
|
|
- text: "智能报表",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/d267bff2-2047-53e6-d464-258184eb6da5?instanceId=9246cfa3-701a-5958-1e9c-cfd38a773813",
|
|
|
- isActive: false,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "5",
|
|
|
- text: "电气系统",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/31b8da0c-1c7e-599c-041b-ea51ed62b4b6?instanceId=2d6a7f5b-c49c-259a-67c4-43579e74ebd7",
|
|
|
- isActive: false,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "6",
|
|
|
- text: "电网协同",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/4c074039-5151-45b5-f061-23b64e63c711?instanceId=1ccd5b1c-9861-b617-a3d5-387f2d596924",
|
|
|
- isActive: false,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "7",
|
|
|
- text: "风功率预测",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/b26fc778-e388-c9b6-9ee3-505a7b96dbfc?instanceId=8015e62d-b833-966a-220f-900ad1eb53ad",
|
|
|
- isActive: false,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "8",
|
|
|
- text: "运行指标",
|
|
|
- path: process.env.VUE_APP_URL +
|
|
|
- "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/862c8272-8cf8-435c-b3fc-b28936b4bfe0?instanceId=387b6bac-1dcc-fda6-b31e-c56518fc08ee",
|
|
|
- isActive: false,
|
|
|
- },
|
|
|
- {
|
|
|
- id: "9",
|
|
|
- text: "预警系统",
|
|
|
- path: "",
|
|
|
- isActive: false,
|
|
|
- },
|
|
|
- ],
|
|
|
- activeIndex: 0,
|
|
|
- firsttime: 0,
|
|
|
- };
|
|
|
+import img from "@/assets/nxfImg/menu.png";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ themeName: false,
|
|
|
+ menuimg: img,
|
|
|
+ menus: [
|
|
|
+ {
|
|
|
+ id: "1",
|
|
|
+ text: "全场监控",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/9d23c8a1-444d-a21b-17a0-bb618059f8c0?instanceId=a760dcd2-413b-a488-bcd7-942cd5f8fff3",
|
|
|
+ isActive: true,
|
|
|
},
|
|
|
- methods: {
|
|
|
- click(data) {
|
|
|
- window.location.href = data.path;
|
|
|
- }
|
|
|
- }
|
|
|
+ {
|
|
|
+ id: "2",
|
|
|
+ text: "矩阵图",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/060b34d5-26cc-f172-632a-e80ca3b7be04?instanceId=12b577b4-ea67-c8b6-7b13-1cb066aaf814",
|
|
|
+ isActive: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "3",
|
|
|
+ text: "告警中心",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/3ab0f63d-669b-a119-1eb7-b85fbb6b07bc?instanceId=465034a6-24c1-c0aa-a480-16c7ea65e216",
|
|
|
+ isActive: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "4",
|
|
|
+ text: "智能报表",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/d267bff2-2047-53e6-d464-258184eb6da5?instanceId=9246cfa3-701a-5958-1e9c-cfd38a773813",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "5",
|
|
|
+ text: "电气系统",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/31b8da0c-1c7e-599c-041b-ea51ed62b4b6?instanceId=2d6a7f5b-c49c-259a-67c4-43579e74ebd7",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "6",
|
|
|
+ text: "电网协同",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/4c074039-5151-45b5-f061-23b64e63c711?instanceId=1ccd5b1c-9861-b617-a3d5-387f2d596924",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "7",
|
|
|
+ text: "风功率预测",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/b26fc778-e388-c9b6-9ee3-505a7b96dbfc?instanceId=8015e62d-b833-966a-220f-900ad1eb53ad",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "8",
|
|
|
+ text: "运行指标",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_URL +
|
|
|
+ "/index.html/#/runtime/b0d3f1f4-3e5d-429b-af81-2661e7099caa/862c8272-8cf8-435c-b3fc-b28936b4bfe0?instanceId=387b6bac-1dcc-fda6-b31e-c56518fc08ee",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "9",
|
|
|
+ text: "预警系统",
|
|
|
+ path: "",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "10",
|
|
|
+ text: "多维感知",
|
|
|
+ path:
|
|
|
+ process.env.VUE_APP_HEADER_URL +
|
|
|
+ "SSOToken0zfOqp3vhlQHvLXUFLO7iI2M8a%2BCWAHmd7KxVY1wf956KroCTxef0S3q8Ui6a%2FFyvmKXpvQ8mYeWKWXrX%2B3%2BSRvMR0fr6EwZvM04PNE1LJbI5TtJSEXTs3BsuNzkDrIPQOfs0WmLizGoHNXjWG2x%2FQ%3D%3D",
|
|
|
+ isActive: false,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ activeIndex: 0,
|
|
|
+ firsttime: 0,
|
|
|
};
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ click(data) {
|
|
|
+ window.location.href = data.path;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
<style>
|
|
|
- .admin-set-tooltip {
|
|
|
- font-size: 14px !important;
|
|
|
- }
|
|
|
+.admin-set-tooltip {
|
|
|
+ font-size: 14px !important;
|
|
|
+}
|
|
|
</style>
|
|
|
<style lang="less" scoped>
|
|
|
- .header-nxf {
|
|
|
- display: flex;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- font-size: @fontsize;
|
|
|
+.header-nxf {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ font-size: @fontsize;
|
|
|
|
|
|
- .nxfP {
|
|
|
- font-family: AlibabaPuHuiTi;
|
|
|
- font-size: 24px;
|
|
|
- margin-left: 20px;
|
|
|
- margin-right: 60px;
|
|
|
- line-height: 30px;
|
|
|
- }
|
|
|
-
|
|
|
- .header-nxf-list {
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
- list-style: none;
|
|
|
- display: flex;
|
|
|
- height: 100%;
|
|
|
+ .nxfP {
|
|
|
+ font-family: AlibabaPuHuiTi;
|
|
|
+ font-size: 24px;
|
|
|
+ margin-left: 20px;
|
|
|
+ margin-right: 60px;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
|
|
|
- .header-nxf-it {
|
|
|
- position: relative;
|
|
|
- top: 7px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- padding: 0 15px;
|
|
|
- // width: 9.259vh;
|
|
|
- height: 100%;
|
|
|
- font-size: 15px;
|
|
|
- transition: color 0.2s ease-in-out;
|
|
|
+ .header-nxf-list {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ list-style: none;
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
|
|
|
- .aclas {
|
|
|
- color: #a6b8dd;
|
|
|
- font-size: 15px;
|
|
|
- cursor: pointer;
|
|
|
- text-decoration: auto;
|
|
|
+ .header-nxf-it {
|
|
|
+ position: relative;
|
|
|
+ top: 7px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 0 15px;
|
|
|
+ // width: 9.259vh;
|
|
|
+ height: 100%;
|
|
|
+ font-size: 15px;
|
|
|
+ transition: color 0.2s ease-in-out;
|
|
|
|
|
|
- &:hover {
|
|
|
- color: #fff !important;
|
|
|
- }
|
|
|
- }
|
|
|
+ .aclas {
|
|
|
+ color: #a6b8dd;
|
|
|
+ font-size: 15px;
|
|
|
+ cursor: pointer;
|
|
|
+ text-decoration: auto;
|
|
|
|
|
|
- .imgcla {
|
|
|
- width: 10px;
|
|
|
- height: 30px;
|
|
|
- position: relative;
|
|
|
- left: 16px;
|
|
|
- }
|
|
|
- }
|
|
|
+ &:hover {
|
|
|
+ color: #fff !important;
|
|
|
}
|
|
|
+ }
|
|
|
+
|
|
|
+ .imgcla {
|
|
|
+ width: 10px;
|
|
|
+ height: 30px;
|
|
|
+ position: relative;
|
|
|
+ left: 16px;
|
|
|
+ }
|
|
|
}
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
