From 59a0af5ae9c127d39c95c64ec08b01510207dca4 Mon Sep 17 00:00:00 2001
From: TreeWish <1131093754@qq.com>
Date: 星期五, 17 二月 2023 11:11:04 +0800
Subject: [PATCH] 大屏视图和工程树切换问题修改
---
src/components/Screen/top.vue | 46 +++++++++++++++++++++++++---------------------
1 files changed, 25 insertions(+), 21 deletions(-)
diff --git a/src/components/Screen/top.vue b/src/components/Screen/top.vue
index aa97331..0c4a8b1 100644
--- a/src/components/Screen/top.vue
+++ b/src/components/Screen/top.vue
@@ -2,15 +2,17 @@
<div class="top">
<div class="topleft">
<div
- class="topleft1 topleftC" @click="OpenInitChart"
- :class="{ topleft1: screen == false, topleftC: screen == true }"
+ class="topleft1"
+ :class="currView == 'chart' ? 'active' : ''"
+ @click="OpenInitChart"
>
<img src="../../assets/img/Screen/bigST.png" />
<span>澶у睆瑙嗗浘</span>
</div>
<div
- class="topleft1 topleftC" @click="OpenProjectree"
- :class="{ topleft1: tree == false, topleftC: tree == true }"
+ class="topleft1"
+ @click="OpenProjectree"
+ :class="currView == 'tree' ? 'active' : ''"
>
<img src="../../assets/img/Screen/ptree.png" />
<span>宸ョ▼椤圭洰</span>
@@ -33,6 +35,7 @@
return {
tree: false,
screen: false,
+ currView: "chart",
}
},
mounted() {},
@@ -42,17 +45,20 @@
},
//鎵撳紑澶у睆
- OpenInitChart(){
- this.$parent.$refs.mapleft.OpenLeftInit();
+ OpenInitChart() {
+ this.currView = "chart"
+ this.screen = true
+ this.$parent.$refs.mapleft.OpenLeftInit()
},
//鎵撳紑宸ョ▼鏍�
- OpenProjectree(){
- this.$parent.$refs.mapleft.OpenLeftProjectTree();
- }
+ OpenProjectree() {
+ this.screen = false
+ this.currView = "tree"
-
+ this.$parent.$refs.mapleft.OpenLeftProjectTree()
+ },
},
}
</script>
@@ -74,23 +80,21 @@
justify-content: space-around;
cursor: pointer;
.topleft1 {
- width: 131px;
- height: 40px;
- background-image: url(../../assets/img/Screen/btnc.png);
- background-repeat: no-repeat;
- background-size: 100% 100%;
- display: flex;
- align-items: center;
- }
- .topleftC {
- width: 131px;
- height: 40px;
+ width: 127px;
+ height: 36px;
+ // border: 1px solid #30acff;
+ border-radius: 4px;
background-image: url(../../assets/img/Screen/btnbg.png);
background-repeat: no-repeat;
background-size: 100% 100%;
display: flex;
align-items: center;
}
+ .active {
+ background-image: url(../../assets/img/Screen/btnc.png);
+ background-repeat: no-repeat;
+ background-size: 100% 100%;
+ }
img {
height: 26px;
width: 32px;
--
Gitblit v1.9.3