feat: 初始化

pages/partner/ibTree/treeItem/index.vue

@@ -0,0 +1,79 @@
+<template>
+	<view class="treeItemWrapper" v-for="item in formatedValues" :key="item.id">
+		<view :class="['treeItem', item.user_code === searchKey ? 'active' : '']">
+			<view v-for="i in item.tier" :key="item.user_code + i" style="display: flex; align-items: center">
+				<view :class="['line', 'vertical', item.lineConfig[i - 1] ? '' : 'transparent']"></view>
+				<view class="line transparent" :style="{ width: '36px' }"></view>
+			</view>
+			<view class="line vertical"></view>
+			<view class="line"></view>
+			<image
+				:src="`/static/partner/${item.collapse ? 'unfold' : 'collapse'}.png`"
+				mode="aspectFill"
+				class="collapseBtn"
+				v-if="item.children"
+				@click="() => toogleItemCollapse(item)"
+			></image>
+			<view class="labelWrapper">
+				<view :class="['label', isIb(item) ? 'ib' : '']">
+					<image :src="`/static/partner/${isIb(item) ? 'ib' : 'client'}.png`" mode="aspectFit" style="width: 19px; height: 19px"></image>
+					{{ `${item.user_code}(${item.id})` }}
+				</view>
+			</view>
+		</view>
+		<TreeItem v-if="item.children && !item.collapse" :values="item.children" :lineConfig="item.lineConfig" :searchKey="searchKey" :isLast="item.isLast" />
+	</view>
+</template>
+
+<script>
+export default {
+	name: 'TreeItem',
+	props: {
+		values: {
+			type: Object,
+			required: true,
+			default: () => ({})
+		},
+		lineConfig: {
+			type: Array,
+			required: false,
+			default: () => []
+		},
+		searchKey: {
+			type: String,
+			required: false,
+			default: ''
+		},
+		isLast: {
+			type: Boolean,
+			required: false,
+			default: false
+		}
+	},
+	methods: {
+		isIb(item) {
+			return item.user_type === 1;
+		},
+		toogleItemCollapse(item) {
+			item.collapse = !item.collapse;
+		}
+	},
+	computed: {
+		formatedValues() {
+			const tempValues = [...this.values];
+			tempValues?.forEach((item, index, arr) => {
+				if (index !== arr.length - 1 && arr.length > 1 && item.tier >= 1) {
+					item.lineConfig = [...this.lineConfig, true];
+				} else {
+					item.lineConfig = [...this.lineConfig, false];
+				}
+			});
+			return tempValues;
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+@import './index.scss';
+</style>