uni-zhihuikuangshan/pages/origanization/t-c-c-contacts-info/t-c-c-contacts-info.vue

<template>
	<view class="box">
		<view class="headers">
			<view class="height"></view>
			<view class="headers_input">
				<image src="./icon/searc1.png" mode=""></image>
				<input type="filter" placeholder="搜索" v-model="filterText" />
			</view>
		</view>
		<view class="box_info_nengyuan">
			<image src="./icon/ICE.png" mode=""></image>
			<text>国家能源集团枣泉矿场</text>
		</view>
		<ly-tree :tree-data="treeData" :ready="ready" node-key="id" ref="tree" :filter-node-method="filterNodeMethod">
		</ly-tree>
	</view>
</template>

<script>
	import LyTree from '@/components/ly-tree/ly-tree.vue'
	export default {
		components: {
			LyTree
		},
		data() {
			return {
				ready: false,
				treeData: [

				],
				searchVal: "",
				filterText: ""
			};
		},
		created() {
			this.ready = true;
			this.getcontactsinfo()
		},
		watch: {
			filterText(val) {
				 this.$refs.tree.filter(val);
			}
		},
		methods: {
			getcontactsinfo() {
				this.$api.section_getlisttree({
					txl: "txl"
				}).then((res) => {
					this.treeData = res.data.data
				})
			},
			filterNodeMethod(value, data) {
				if (!value) return true;
				return data.label.indexOf(value) !== -1;
			},
		},
	}
</script>

<style>
	page {
		background-color: #f5f5f5;
	}

	.box_info_nengyuan {
		width: 100%;
		height: 60px;
		line-height: 60px;
		margin: auto;
		display: flex;
		border-bottom: 1px solid #f5f5f5;
		background-color: #fff;
		/* margin-top: 10px; */
	}

	.box_info_nengyuan>image {
		margin-top: 10px;
		margin-left: 15px;
		width: 40px;
		height: 40px;
	}

	.box_info_nengyuan>text {
		font-size: 18px;
		font-weight: 500;
		margin-left: 10px;
	}
	.headers{
		width: 100%;
		height: 120rpx;
		background-color: #FFF;
		margin-bottom:20rpx;
	}
	.headers_input{
		width: 80%;
		background-color: #f5f5f5;
		margin: 0 auto;
		border-radius: 40rpx;
		position: relative;
		margin-top: 30rpx;
	}
	.headers_input>input{
		width: 80%;
		margin-left: 50rpx;
		height: 60rpx;
	}
	.headers_input>image{
		width: 40rpx;
		height: 40rpx;
		position: absolute;
		z-index: 99999;
		left: 1%;
		top: 16%;
	}
	.height{
		height: 1rpx;
	}
</style>