From 8a72453608f671d91a481315e4ad32b7b7b4a8ef Mon Sep 17 00:00:00 2001
From: TreeWish <1131093754@qq.com>
Date: 星期四, 16 二月 2023 15:20:44 +0800
Subject: [PATCH] 工程树搜索
---
src/components/Screen/ProjectTree.vue | 67 +++++++++++++++++++++++++++++++--
1 files changed, 62 insertions(+), 5 deletions(-)
diff --git a/src/components/Screen/ProjectTree.vue b/src/components/Screen/ProjectTree.vue
index d174aaa..c55483c 100644
--- a/src/components/Screen/ProjectTree.vue
+++ b/src/components/Screen/ProjectTree.vue
@@ -1,5 +1,14 @@
<template>
<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"
+ >
+ </el-input>
<div class="tree-container">
<el-tree
:data="treeData"
@@ -10,6 +19,7 @@
ref="tree"
class="el-tree"
@check-change="handleCheckChange"
+ :filter-node-method="filterNode"
>
<div
style="display: flex"
@@ -46,14 +56,14 @@
</div>
</el-tree>
</div>
- <div class="changeBaseLayer">
+ <!-- <div class="changeBaseLayer">
<div @click="changeMenulayer" class="CenDiv">
<div
id="cenBg"
v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
></div>
</div>
- </div>
+ </div> -->
</div>
</template>
@@ -82,6 +92,7 @@
isActive: false,
isMenuLayer: true,
openEcharts: false,
+ filterText: '',
}
},
@@ -91,6 +102,11 @@
this.changeSelectli = this.rightList[0].id
this.changeSelectStyle = this.rightMenu[0].id
this.addImageLayer()
+ },
+ watch: {
+ filterText(val) {
+ this.$refs.tree.filter(val)
+ },
},
methods: {
async addImageLayer() {
@@ -182,6 +198,10 @@
Viewer.imageryLayers._layers[3].show = true
}
},
+ filterNode(value, data) {
+ if (!value) return true
+ return data.label.indexOf(value) !== -1
+ },
},
}
</script>
@@ -192,12 +212,26 @@
width: 300px;
height: 100%;
transition: width 2s;
- background: url("~@/assets/img/themic/宸︽.png") no-repeat center;
+ background: url("~@/assets/img/Screen/prjectree.png") no-repeat center;
+
background-size: 100% 100%;
+ &__title {
+ color: #fff;
+ height: 30px;
+ font-size: 20px;
+ width: 130px;
+ text-align: center;
+ padding-top: 10px;
+ font-weight: bold;
+ }
+ .el-input {
+ width: 80%;
+ padding: 5px 0 5px 30px;
+ }
.tree-container {
margin: 10px;
- height: 90%;
+ height: 85%;
overflow-y: auto;
}
.changeBaseLayer {
@@ -209,7 +243,6 @@
.CenDiv {
height: 40px;
width: 60px;
-
margin-right: 7%;
border-radius: 5px;
bottom: 3%;
@@ -235,6 +268,30 @@
border-radius: 5px;
}
}
+/* 婊氬姩鏉℃牱寮� */
+
+::-webkit-scrollbar {
+ width: 4px;
+ height: 4px;
+ background-color: #409eff;
+}
+
+::-webkit-scrollbar-track {
+ background: #eee;
+}
+
+::-webkit-scrollbar-thumb {
+ background: #409eff;
+ border-radius: 5px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+ background: #409eff;
+}
+
+::-webkit-scrollbar-corner {
+ background: #409eff;
+}
</style>
<style lang="scss">
--
Gitblit v1.9.3