From 7621ce7c15afc796bcf36f3bd18bec813b78d7e3 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期二, 09 十一月 2021 14:15:25 +0800
Subject: [PATCH] hyj样式修改
---
src/pages/shuohuangMonitorAnalyze/index/App.vue | 189 ++++++++++++++++++++++++++++++++++++----------
1 files changed, 147 insertions(+), 42 deletions(-)
diff --git a/src/pages/shuohuangMonitorAnalyze/index/App.vue b/src/pages/shuohuangMonitorAnalyze/index/App.vue
index 5f9eab7..1bb1d9a 100644
--- a/src/pages/shuohuangMonitorAnalyze/index/App.vue
+++ b/src/pages/shuohuangMonitorAnalyze/index/App.vue
@@ -3,74 +3,167 @@
<div class="view-left">
<left-nav :isCollapse="isCollapse" @menuChange="menuChange"></left-nav>
</div>
- <div class="right">
+ <div class="view-right">
<div class="top">
<div class="collapse-trigger" @click="toggleCollapse">
- <i :class="isCollapse?'el-icon-s-fold':'el-icon-s-unfold'"></i>
+ <i :class="isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'"></i>
</div>
<top-nav></top-nav>
</div>
+
+ <!-- <el-breadcrumb separator-class="el-icon-arrow-right">
+ <el-breadcrumb-item>{{ breadcrumb }}</el-breadcrumb-item>
+ <el-breadcrumb-item v-if="breadcrumb2">{{
+ breadcrumb2
+ }}</el-breadcrumb-item>
+ </el-breadcrumb> -->
+
<div class="container">
- <searchForVideoAnalyze v-if="actPage=='searchForVideoAnalyze'"></searchForVideoAnalyze>
- <memberManage v-if="actPage=='memberManage'"></memberManage>
- <taskManage v-if="actPage=='taskManage'"></taskManage>
- <transferMemo v-if="actPage=='transferMemo'"></transferMemo>
- <transferDeviceManage v-if="actPage=='transferDeviceManage'"></transferDeviceManage>
- <configManage v-if="actPage=='configManage'"></configManage>
- <guideIndex v-if="actPage=='guideIndex'"></guideIndex>
+ <!-- 棣栭〉 -->
+ <GuideIndex
+ @breadcrumb2Update="breadcrumb2Update"
+ ref="GuideIndex"
+ v-if="actPage == 'guideIndex'"
+ ></GuideIndex>
+ <searchForVideoAnalyze
+ v-if="actPage == 'searchForVideoAnalyze'"
+ ></searchForVideoAnalyze>
+ <memberManage v-if="actPage == 'memberManage'"></memberManage>
+ <taskManage v-if="actPage == 'taskManage'"></taskManage>
+ <transferMemo v-if="actPage == 'transferMemo'"></transferMemo>
+ <transferDeviceManage
+ v-if="actPage == 'transferDeviceManage'"
+ ></transferDeviceManage>
+ <configManage v-if="actPage == 'configManage'"></configManage>
+ <lkg v-if="actPage == 'lkgManage'"></lkg>
</div>
</div>
</div>
</template>
<script>
-import LeftNav from '../components/leftNav';
-import TopNav from '../components/topNav';
-import SearchForVideoAnalyze from '../components/searchForVideoAnalyze';
-import MemberManage from '../components/memberManage';
-import TaskManage from '../components/taskManage';
-import TransferMemo from '../components/transferMemo';
-import TransferDeviceManage from '../components/transferDeviceManage';
-import ConfigManage from '../components/configManage';
-import GuideIndex from '../components/guideIndex';
+import Lkg from "../components/lkgManage";
+import TopNav from "../components/topNav";
+import LeftNav from "../components/leftNav";
+import GuideIndex from "../components/guideIndex";
+import TaskManage from "../components/taskManage";
+import TransferMemo from "../components/transferMemo";
+import ConfigManage from "../components/configManage";
+import MemberManage from "../components/memberManage";
+import TransferDeviceManage from "../components/transferDeviceManage";
+import SearchForVideoAnalyze from "../components/searchForVideoAnalyze";
+
export default {
- components: { LeftNav, TopNav, SearchForVideoAnalyze, MemberManage, TaskManage, TransferMemo, TransferDeviceManage, ConfigManage, GuideIndex },
- data () {
+ components: {
+ Lkg,
+ LeftNav,
+ TopNav,
+ SearchForVideoAnalyze,
+ MemberManage,
+ TaskManage,
+ TransferMemo,
+ TransferDeviceManage,
+ ConfigManage,
+ GuideIndex,
+ },
+ data() {
return {
isCollapse: false,
- actPage: 'guideIndex',
- }
+ actPage: "guideIndex",
+ breadcrumb: "棣栭〉",
+ breadcrumb2: "鏁版嵁缁熻鍒嗘瀽",
+ };
},
- mounted () {
-
+ mounted() {
+ // this.actPage = 'guideIndex';
},
methods: {
- markNav () {
- sessionStorage.setItem('actPage', this.actPage);
+ markNav() {
+ sessionStorage.setItem("actPage", this.actPage);
this.menuChange(this.actPage);
},
- toggleCollapse () {
+ toggleCollapse() {
this.isCollapse = !this.isCollapse;
//閫氱煡褰撳墠娲诲姩椤祎able(濡傛灉鏈�) doLayout
},
- menuChange (path) {
- // if(path == 'taskscreen'){
- // window.location.href = window.location.href+'taskscreen/index.html'
- // }
+ menuChange(path) {
+ console.log(path);
+ switch (path) {
+ case "guideIndex":
+ this.breadcrumb = "棣栭〉";
+ this.breadcrumb2 = "鏁版嵁缁熻鍒嗘瀽";
+ break;
+ case "searchForVideoAnalyze":
+ this.breadcrumb = "瑙嗛鍒嗘瀽妫�绱�";
+ this.breadcrumb2 = "";
+ break;
+ case "memberManage":
+ this.breadcrumb = "浜哄憳绠＄悊";
+ this.breadcrumb2 = "";
+ break;
+ case "taskManage":
+ this.breadcrumb = "浠诲姟绠＄悊";
+ this.breadcrumb2 = "";
+ break;
+ case "configManage":
+ this.breadcrumb = "閰嶇疆绠＄悊";
+ this.breadcrumb2 = "";
+ break;
+ case "transferMemo":
+ this.breadcrumb = "杞偍绠＄悊";
+ this.breadcrumb2 = "瑙嗛杞偍璁板綍";
+ break;
+ case "transferDeviceManage":
+ this.breadcrumb = "杞偍绠＄悊";
+ this.breadcrumb2 = "杞偍璁惧绠＄悊";
+ break;
+ case "lkgManage":
+ this.breadcrumb = "杞偍绠＄悊";
+ this.breadcrumb2 = "lkg鏁版嵁绠＄悊";
+ break;
+ case "taskscreen":
+ this.breadcrumb = "鍙鍖栧ぇ灞�";
+ this.breadcrumb2 = "浠诲姟澶у睆";
+ break;
+ case "hiddendangerscreen":
+ this.breadcrumb = "鍙鍖栧ぇ灞�";
+ this.breadcrumb2 = "闅愭偅澶у睆";
+ break;
+ }
+
+ if (path == "guideIndex") {
+ // this.$refs.GuideIndex.refreshShoubiNum()
+ }
+ if (path == "taskscreen") {
+ //window.location.href = window.location.href+'taskscreen/index.html'
+ window.open(window.location.href + "taskscreen/index.html", "_blank");
+ } else if (path == "hiddendangerscreen") {
+ //window.location.href = window.location.href+'hiddendangerscreen/index.html'
+ window.open(
+ window.location.href + "hiddendangerscreen/index.html",
+ "_blank"
+ );
+ }
this.actPage = path;
- }
- }
-}
+ },
+ breadcrumbUpdate(val) {
+ this.breadcrumb = val;
+ },
+ breadcrumb2Update(val) {
+ this.breadcrumb2 = val;
+ },
+ },
+};
</script>
<style lang="scss">
.flex-box {
display: flex;
- >label {
+ > label {
padding-right: 10px;
}
}
-.flex-end{
+.flex-end {
display: flex;
justify-content: flex-end;
}
@@ -115,7 +208,7 @@
padding: 0 3px;
color: #0096fa;
}
- i[class^='el-icon'] {
+ i[class^="el-icon"] {
padding: 3px;
font-size: 16px;
color: #0096fa;
@@ -123,16 +216,17 @@
}
}
.main-view {
+ height: 100%;
display: flex;
background: #f0f2f5;
.view-left {
z-index: 2;
box-shadow: 4px 0px 8px 0px rgba(0, 0, 0, 0.1);
}
- .right {
+ .view-right {
flex: 1;
+ overflow: hidden;
.top {
- background: #fff;
position: relative;
.collapse-trigger {
position: absolute;
@@ -142,13 +236,24 @@
cursor: pointer;
}
}
+ .el-breadcrumb {
+ margin: 25px 0 25px 30px;
+ }
.container {
- background: #fff;
- margin: 10px;
+ margin: 0 0 0 30px;
+ padding: 30px 0;
+
+ padding-right: 30px;
box-sizing: border-box;
- height: calc(100vh - 84px);
+ height: calc(100vh - 58px);
overflow-y: auto;
}
}
}
+</style>
+
+<style>
+* {
+ box-sizing: border-box;
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0