From 1ff801633ccd6ba5a3459d2e1adc3867f528c3ed Mon Sep 17 00:00:00 2001 From: lizhichao Date: Fri, 20 Sep 2024 11:46:34 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=E9=A1=B5=E9=9D=A2=E4=BD=8D=E7=BD=AE?= =?UTF-8?q?=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/index/sidebar/index.vue | 4 +- src/page/index/sidebar/opsSidebar.vue | 145 +-- src/page/opsVisualization/alarmProcess.vue | 423 +++++++++ src/page/opsVisualization/index.vue | 874 ++++++++++++++++++ src/page/opsVisualization/jiedian.vue | 66 ++ src/page/opsVisualization/serverUnit.vue | 50 + .../opsVisualization/serviceDataOAM.vue} | 171 ++-- .../systemMonitoring/icon/icon1.png | Bin 0 -> 369 bytes .../systemMonitoring/icon/icon2.png | Bin 0 -> 665 bytes .../systemMonitoring/icon/icon3.png | Bin 0 -> 585 bytes .../systemMonitoring/icon/icon4.png | Bin 0 -> 684 bytes .../systemMonitoring/index.vue | 286 ++++++ src/page/opsVisualization/tuobu.vue | 396 ++++++++ src/router/page/index.js | 175 ++-- 14 files changed, 2349 insertions(+), 241 deletions(-) create mode 100644 src/page/opsVisualization/alarmProcess.vue create mode 100644 src/page/opsVisualization/index.vue create mode 100644 src/page/opsVisualization/jiedian.vue create mode 100644 src/page/opsVisualization/serverUnit.vue rename src/{views/opsVisualization/warnHistory.vue => page/opsVisualization/serviceDataOAM.vue} (83%) create mode 100644 src/page/opsVisualization/systemMonitoring/icon/icon1.png create mode 100644 src/page/opsVisualization/systemMonitoring/icon/icon2.png create mode 100644 src/page/opsVisualization/systemMonitoring/icon/icon3.png create mode 100644 src/page/opsVisualization/systemMonitoring/icon/icon4.png create mode 100644 src/page/opsVisualization/systemMonitoring/index.vue create mode 100644 src/page/opsVisualization/tuobu.vue diff --git a/src/page/index/sidebar/index.vue b/src/page/index/sidebar/index.vue index 1f8030a..a59893b 100644 --- a/src/page/index/sidebar/index.vue +++ b/src/page/index/sidebar/index.vue @@ -5,7 +5,7 @@
{{$t('menuTip')}}
+ :collapse="keyCollapse" v-if="$route.path.indexOf('opsVisualization') == -1"> @@ -49,4 +49,4 @@ /deep/.el-scrollbar__bar.is-vertical{ display: none; } - + diff --git a/src/page/index/sidebar/opsSidebar.vue b/src/page/index/sidebar/opsSidebar.vue index 4f5afc1..b7d0db9 100644 --- a/src/page/index/sidebar/opsSidebar.vue +++ b/src/page/index/sidebar/opsSidebar.vue @@ -1,79 +1,80 @@ + + +export default { + data() { + return {}; + }, + watch: {}, + computed: {}, + mounted() {}, + methods: {}, +}; + +.page { + position: absolute; + top: 64px; + left: 0; + z-index: 1027; +} +/deep/.el-menu-item-group__title { + padding: 0; +} +.point { + width: 4px; + height: 4px; + background: #fff; + opacity: 0.7; + display: inline-block; + margin: 0 20px 0 30px; + border-radius: 50%; +} + \ No newline at end of file diff --git a/src/page/opsVisualization/alarmProcess.vue b/src/page/opsVisualization/alarmProcess.vue new file mode 100644 index 0000000..5f2c544 --- /dev/null +++ b/src/page/opsVisualization/alarmProcess.vue @@ -0,0 +1,423 @@ + + + + + \ No newline at end of file diff --git a/src/page/opsVisualization/index.vue b/src/page/opsVisualization/index.vue new file mode 100644 index 0000000..67be32d --- /dev/null +++ b/src/page/opsVisualization/index.vue @@ -0,0 +1,874 @@ + + + + + diff --git a/src/page/opsVisualization/jiedian.vue b/src/page/opsVisualization/jiedian.vue new file mode 100644 index 0000000..c32edbb --- /dev/null +++ b/src/page/opsVisualization/jiedian.vue @@ -0,0 +1,66 @@ + + + + + \ No newline at end of file diff --git a/src/page/opsVisualization/serverUnit.vue b/src/page/opsVisualization/serverUnit.vue new file mode 100644 index 0000000..584f9ed --- /dev/null +++ b/src/page/opsVisualization/serverUnit.vue @@ -0,0 +1,50 @@ + + + + + \ No newline at end of file diff --git a/src/views/opsVisualization/warnHistory.vue b/src/page/opsVisualization/serviceDataOAM.vue similarity index 83% rename from src/views/opsVisualization/warnHistory.vue rename to src/page/opsVisualization/serviceDataOAM.vue index bbc8688..07bf249 100644 --- a/src/views/opsVisualization/warnHistory.vue +++ b/src/page/opsVisualization/serviceDataOAM.vue @@ -1,8 +1,8 @@ -
-
+
报警详情信息 报警信息记录
-
-
dtu报警信息记录
-
-
- {{ item.time }} -
-
-
-
- {{ item.content }}dtu编号:{{ item.id }} -
+
+
+ 设备报警信息详情 + 更多
-
-
-
设备报警信息详情
span{ + cursor: pointer; + } +} .timelineBox { margin-top: 30px; width: 100%; - height: 19vh; + height: 24vh; display: flex; - justify-content: space-around; border: 1px solid #d1d1d1; - > div { - width: 50%; - } - > :nth-child(1) { - border-right: 1px solid #d1d1d1; - } } .timelineBoxTitle { - text-align: center; - height: 40px; line-height: 40px; background: #e5e5e5; + display: flex; + justify-content: space-between; + padding: 0 30px 0 24px; + > span { + cursor: pointer; + } } .timelineBoxContent { display: flex; flex-direction: column; - align-items: center; overflow: auto; - height: 132px; + height: 170px; + padding: 10px 0 0 53px; +} +/deep/ .basic-container__card { + height: 100%; } + + diff --git a/src/page/opsVisualization/tuobu.vue b/src/page/opsVisualization/tuobu.vue new file mode 100644 index 0000000..3e9841f --- /dev/null +++ b/src/page/opsVisualization/tuobu.vue @@ -0,0 +1,396 @@ + + + + + \ No newline at end of file diff --git a/src/router/page/index.js b/src/router/page/index.js index fcebb37..aabfcf6 100644 --- a/src/router/page/index.js +++ b/src/router/page/index.js @@ -11,76 +11,115 @@ export default [{ isAuth: false } }, - { - path: '/lock', - name: '锁屏页', - component: () => - import( /* webpackChunkName: "page" */ '@/page/lock/index'), - meta: { - keepAlive: true, - isTab: false, - isAuth: false - } - }, - { - path: '/404', - component: () => - import( /* webpackChunkName: "page" */ '@/components/error-page/404'), - name: '404', - meta: { - keepAlive: true, - isTab: false, - isAuth: false - } +{ + path: '/lock', + name: '锁屏页', + component: () => + import( /* webpackChunkName: "page" */ '@/page/lock/index'), + meta: { + keepAlive: true, + isTab: false, + isAuth: false + } +}, +{ + path: '/404', + component: () => + import( /* webpackChunkName: "page" */ '@/components/error-page/404'), + name: '404', + meta: { + keepAlive: true, + isTab: false, + isAuth: false + } - }, - { - path: '/403', - component: () => - import( /* webpackChunkName: "page" */ '@/components/error-page/403'), - name: '403', - meta: { - keepAlive: true, - isTab: false, - isAuth: false - } - }, - { - path: '/500', +}, +{ + path: '/403', + component: () => + import( /* webpackChunkName: "page" */ '@/components/error-page/403'), + name: '403', + meta: { + keepAlive: true, + isTab: false, + isAuth: false + } +}, +{ + path: '/500', + component: () => + import( /* webpackChunkName: "page" */ '@/components/error-page/500'), + name: '500', + meta: { + keepAlive: true, + isTab: false, + isAuth: false + } +}, +{ + path: '/', + name: '主页', + redirect: '/garden' +}, +{ + path: '/equipment', + name: '设备管理', + redirect: '/equipment' +}, +{ + path: '/myiframe', + component: Layout, + redirect: '/myiframe', + children: [{ + path: ":routerPath", + name: 'iframe', component: () => - import( /* webpackChunkName: "page" */ '@/components/error-page/500'), - name: '500', - meta: { - keepAlive: true, - isTab: false, - isAuth: false - } - }, - { - path: '/', - name: '主页', - redirect: '/garden' - }, - { - path: '/equipment', - name: '设备管理', - redirect: '/equipment' - }, - { - path: '/myiframe', - component: Layout, - redirect: '/myiframe', - children: [{ - path: ":routerPath", - name: 'iframe', - component: () => - import( /* webpackChunkName: "page" */ '@/components/iframe/main'), - props: true - }] + import( /* webpackChunkName: "page" */ '@/components/iframe/main'), + props: true + }] +}, +{ + path: '*', + redirect: '/404' +}, +{ + path: '/opsVisualization', + name: '系统监控', + component: Layout, + meta: { + keepAlive: true, + isTab: false, + isAuth: false }, - { - path: '*', - redirect: '/404' - } + children: [ + { + path: "alarmProcess", + name: '系统监控1', + component: () => + import( /* webpackChunkName: "page" */ '@/page/opsVisualization/alarmProcess'), + }, + { + path: "systemMonitoring", + name: '服务监控', + component: () => + import( /* webpackChunkName: "page" */ '@/page/opsVisualization/systemMonitoring'), + }, + { + path: "serviceDataOAM", + name: '业务数据监控', + component: () => + import( /* webpackChunkName: "page" */ '@/page/opsVisualization/systemMonitoring'), + }, + { + path: 'tuobu', + name: 'tuobu', + meta: { + i18n: 'dashboard' + }, + component: () => + import( /* webpackChunkName: "views" */ '@/views/opsVisualization/tuobu') + } + ] +}, ]