From 2a9e0f190c384d4c95a188822d6bf1802697d10c Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期五, 19 一月 2024 10:19:32 +0800
Subject: [PATCH] 图层搜索
---
src/components/left/leftmenu.vue | 50 ++++++++++++++++++++++++++++++++++++--------------
1 files changed, 36 insertions(+), 14 deletions(-)
diff --git a/src/components/left/leftmenu.vue b/src/components/left/leftmenu.vue
index 9221637..fa98f66 100644
--- a/src/components/left/leftmenu.vue
+++ b/src/components/left/leftmenu.vue
@@ -11,8 +11,14 @@
>脳</span
>
<img class="openLeftMenu" v-else src="@/assets/img/left/souselist4.png" />
-
<div class="layerTreeContainer" v-show="isShowLeftPanel">
+ <el-input
+ placeholder="鍥惧眰鍚嶇О"
+ v-model="filterText"
+ size="mini"
+ >
+ </el-input>
+
<div class="switchbox">
<el-radio-group v-model="radio" @change="getright">
<el-radio :label="1">缁勭粐鏈烘瀯</el-radio>
@@ -37,6 +43,7 @@
:render-content="renderContent"
:default-expanded-keys="defaultExpanded"
@check="check"
+ :filter-node-method="filterNode"
></el-tree>
</div>
</div>
@@ -445,6 +452,7 @@
name: "leftmenu",
data() {
return {
+ filterText: "",
isShowLeftPanel: false,
activeName: "first",
alldisabled: [],
@@ -602,6 +610,10 @@
console.log("鑾峰彇鍦烘櫙閰嶇疆澶辫触锛�");
}
);
+ },
+ filterNode(value, treeData) {
+ if (!value) return true;
+ return treeData.name.indexOf(value) !== -1;
},
setTreeDataChange(res) {
if (this.treeChangeFlag == res) return;
@@ -2682,8 +2694,7 @@
// },
initCluster(treeNode) {
- this.$set(treeNode, "disabled", true); //缁檛reeNode娣诲姞disabled灞炴��
-
+ // this.$set(treeNode, "disabled", true); //缁檛reeNode娣诲姞disabled灞炴��
let that = this;
let imgUrl;
new Cesium.GeoJsonDataSource.load(
@@ -2691,7 +2702,7 @@
"?version=1.3.0&request=GetFeature&format=json&typename=" +
treeNode.layer
).then((dataSource) => {
- that.$set(treeNode, "disabled", false);
+ // that.$set(treeNode, "disabled", false);
Viewer.dataSources.add(dataSource);
clusterItemList.push({ name: treeNode.id, dataSource: dataSource });
// window.clusterItem = dataSource;
@@ -2973,6 +2984,11 @@
}
},
},
+ watch: {
+ filterText(val) {
+ this.$refs.tree.filter(val);
+ },
+ },
};
</script>
<style scoped>
@@ -3003,7 +3019,9 @@
transition: 1s;
z-index: 9999;
}
-
+.switchbox{
+ margin-top: 5px;
+}
.closeLeftMenu:hover {
cursor: pointer;
transform: rotateZ(90deg);
@@ -3037,6 +3055,9 @@
/* box-shadow: 0px 0px 5px 2px #a8a8a8; */
}
+.leftmenu:hover {
+ background-image: url("~@/assets/img/new/treeClose-y.png");
+}
.leftmenu {
background-image: url("~@/assets/img/new/treeClose.png");
background-size: 100% 100%;
@@ -3101,23 +3122,25 @@
font-size: 14px;
}
-.layerTree::-webkit-scrollbar {
+::-webkit-scrollbar {
/*婊氬姩鏉℃暣浣撴牱寮�*/
- width: 4px;
+ width: 5px;
/*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉＄殑灏哄*/
- height: 4px;
+ height: 8px;
scrollbar-arrow-color: red;
}
-.layerTree::-webkit-scrollbar-thumb {
+/* 婊氬姩鏉� */
+::-webkit-scrollbar-thumb {
border-radius: 5px;
- -webkit-box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2);
- box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2);
- background: rgba(255, 255, 255, 0.5);
+ -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
+ box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
+ background: rgba(218, 218, 218, 0.5);
scrollbar-arrow-color: red;
}
-.layerTree::-webkit-scrollbar-track {
+/* 婊氬姩妲� */
+::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
border-radius: 0;
@@ -3126,7 +3149,6 @@
.el-tree .TreeNodeClass {
width: 100%;
- background-color: #bfa;
flex: 1;
display: flex;
align-items: center;
--
Gitblit v1.9.3