From 2cbbc0e4c0357260f370c47365810608c19131c9 Mon Sep 17 00:00:00 2001 From: surprise <15810472099@163.com> Date: 星期一, 01 四月 2024 09:31:56 +0800 Subject: [PATCH] 代码更新 --- src/components/Screen/ProjectTree.vue | 97 ++++++++++++++++++++---------------------------- 1 files changed, 41 insertions(+), 56 deletions(-) diff --git a/src/components/Screen/ProjectTree.vue b/src/components/Screen/ProjectTree.vue index e35807c..7082ed5 100644 --- a/src/components/Screen/ProjectTree.vue +++ b/src/components/Screen/ProjectTree.vue @@ -1,46 +1,16 @@ <template> - <div - class="project_tree" - :class="{ left_main_show: !leftMenuOpen }" - > + <div class="project_tree" :class="{ left_main_show: !leftMenuOpen }"> <div class="project_tree__title">宸ョ▼椤圭洰</div> - <el-input - style="width: 80%" - placeholder="杈撳叆鍏抽敭瀛楄繘琛屾煡璇�" - suffix-icon="el-icon-search" - v-model="filterText" - size="mini" - :filter-node-method="filterNode" - > + <el-input style="width: 80%" placeholder="杈撳叆鍏抽敭瀛楄繘琛屾煡璇�" suffix-icon="el-icon-search" v-model="filterText" size="mini" + :filter-node-method="filterNode"> </el-input> <div class="tree-container"> - <el-tree - :data="treeData" - show-checkbox - node-key="id" - :props="defaultProps" - ref="tree" - class="el-tree" - @check="handleCheckChange" - :filter-node-method="filterNode" - @node-click="handleLeftclick" - > - <div - style="display: flex" - class="custom-tree-node" - slot-scope="{ node, data }" - > + <el-tree :data="treeData" show-checkbox node-key="id" :props="defaultProps" ref="tree" class="el-tree" + @check="handleCheckChange" :filter-node-method="filterNode" @node-click="handleLeftclick"> + <div style="display: flex" class="custom-tree-node" slot-scope="{ node, data }"> <div style=""> - <i - v-if="data.children && data.children.length > 0" - style="color: yellow" - class="el-icon-folder-opened" - ></i> - <i - v-else - style="color: skyblue" - class="el-icon-folder-opened" - ></i> + <i v-if="data.children && data.children.length > 0" style="color: yellow" class="el-icon-folder-opened"></i> + <i v-else style="color: skyblue" class="el-icon-folder-opened"></i> </div> <!-- <div style=""> <i @@ -50,15 +20,10 @@ ></i> <i v-else style="color: skyblue" class="el-icon-folder-opened"></i> </div> --> - <div - :style=" - data.children && data.children.length > 0 - ? 'padding-left: 20px' - : 'padding-left: 20px' - " - class="tree-label" - :title="node.label || '-'" - > + <div :style="data.children && data.children.length > 0 + ? 'padding-left: 20px' + : 'padding-left: 20px' + " class="tree-label" :title="node.label || '-'"> {{ node.label }} </div> </div> @@ -110,7 +75,7 @@ this.rightMenu = right_menu this.changeSelectli = this.rightList[0].id this.changeSelectStyle = this.rightMenu[0].id - this.addImageLayer() + this.$bus.$on("changeProjectLayer", (res) => { this.setShowCheckedLayer(); }) @@ -119,6 +84,16 @@ filterText(val) { this.$refs.tree.filter(val) }, + obj(newVal, oldVal) { + if (newVal) { + this.addImageLayer() + } + } + }, + computed: { + obj() { + return this.$store.state.showThematicFlag + } }, methods: { // 鏌ヨ @@ -566,6 +541,7 @@ background: url("~@/assets/img/Screen/prjectree.png") no-repeat center; background-size: 100% 100%; + &__title { color: #fff; height: 30px; @@ -575,17 +551,16 @@ width: 140px; padding-top: 15px; color: #fff; - background: linear-gradient( - 0deg, - rgba(81, 192, 243, 0.65) 0%, - rgba(255, 255, 255, 0.65) 86% - ); + background: linear-gradient(0deg, + rgba(81, 192, 243, 0.65) 0%, + rgba(255, 255, 255, 0.65) 86%); -webkit-background-clip: text; font-size: 17.5px; font-family: HYLingXinJ, HYLingXinJ-regular; font-weight: normal; letter-spacing: 1.05px; } + .el-input { width: 80%; padding: 5px 0 5px 30px; @@ -595,19 +570,23 @@ margin: 10px; height: 85%; overflow-y: auto; + /deep/ .tree-label { color: #eee !important; } + /deep/ .el-tree { color: #eee !important; } } + .changeBaseLayer { width: 100%; display: flex; justify-content: flex-end; overflow: hidden; } + .CenDiv { height: 40px; width: 60px; @@ -627,6 +606,7 @@ background-size: 100% 100%; border-radius: 5px; } + .menuLayer { height: 40px; width: 60px; @@ -636,6 +616,7 @@ border-radius: 5px; } } + /* 婊氬姩鏉℃牱寮� */ ::-webkit-scrollbar { @@ -673,20 +654,24 @@ margin-left: -14px; } - .el-tree-node__content > label.el-checkbox { + .el-tree-node__content>label.el-checkbox { margin-right: -30px; } - .el-tree-node__content > .el-tree-node__expand-icon { + + .el-tree-node__content>.el-tree-node__expand-icon { visibility: hidden; } - .el-tree .el-tree-node .is-leaf + .el-checkbox .el-checkbox__inner { + + .el-tree .el-tree-node .is-leaf+.el-checkbox .el-checkbox__inner { display: block; visibility: visible; } + .el-tree .el-tree-node .el-checkbox .el-checkbox__inner { display: none; // visibility: hidden; } + .tree-label { font-size: 16px; color: #fff; -- Gitblit v1.9.3