From 9057e04efad1b7d61c77a72e5c37a504d0aee935 Mon Sep 17 00:00:00 2001
From: doum <doum>
Date: 星期五, 26 九月 2025 09:24:03 +0800
Subject: [PATCH] H5静态化
---
admin/src/components/common/Tree.vue | 145 ++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 145 insertions(+), 0 deletions(-)
diff --git a/admin/src/components/common/Tree.vue b/admin/src/components/common/Tree.vue
new file mode 100644
index 0000000..b522403
--- /dev/null
+++ b/admin/src/components/common/Tree.vue
@@ -0,0 +1,145 @@
+<template>
+ <div class="tree">
+ <div v-for="(item, index) of list" :key="index" @click.stop="clickIten(item)">
+ <div class="tree_item">
+ <i class="el-icon-caret-bottom" :class="{ 'activeColor': item.actived === 1 }" v-show="item.fsStatus === 1 && item.childList.length > 0"></i>
+ <i class="el-icon-caret-right color" v-show="item.childList.length > 0 && (item.fsStatus === 0 || !item.fsStatus)"></i>
+ <div class="tree_item_label long-title-style" :title="item.name" :class="{ 'activeColor': item.actived === 1 }">{{ item.name }}</div>
+ </div>
+ <div class="tree_childern" v-show="item.fsStatus === 1">
+ <tree
+ :list="item.childList"
+ :alllist="alllist"
+ :defaultProps="defaultProps"
+ @callback="callback"
+ />
+ <!-- @callback="callback" -->
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+// import Bus from '@/utils/eventBus'
+export default {
+ name: 'tree',
+ props: {
+ list: {
+ type: Array,
+ required: false,
+ default: () => []
+ },
+ alllist: {
+ type: Array,
+ required: false,
+ default: () => []
+ },
+ defaultProps: {
+ type: Object,
+ require: false,
+ default: () => {
+ return {
+ name: 'name',
+ status: 'status',
+ children: 'children',
+ id: 'id',
+ erpId: 'erpId'
+ }
+ }
+ }
+ },
+ data() {
+ return {
+ tempItem: {
+ id: null,
+ name: null,
+ erpId: null
+ }
+ }
+ },
+ methods: {
+ listForList(){
+ // console.log('===============================',this.alllist)
+ },
+ // 鐐瑰嚮褰撳墠椤�
+ clickIten (item) {
+ // this.listForList()
+ const fsDate = item.fsDate === 0 || !item.fsDate ? 1 : 0
+ this.alllist.forEach(i => {
+ i.fsDate = 0
+ i.actived = 0
+ this.recursion1(i.childList)
+ })
+ item.fsDate = fsDate
+ item.actived = 1
+ if (item.childList.length > 0) {
+ item.fsStatus === 0 || !item.fsStatus ? item.fsStatus = 1 : item.fsStatus = 0
+ }
+ this.$emit('callback', item, item)
+ },
+ recursion1 (children) {
+ if (!children || children.length === 0){
+ return
+ }
+ children.forEach(item => {
+ item.actived = 0
+ if (item.childList && item.childList.length > 0) {
+ this.recursion1(item.childList)
+ }
+ // item[this.defaultProps.status] = false
+ // if (item[this.defaultProps.children]) {
+ // this.recursion(item[this.defaultProps.children])
+ // }
+ })
+ },
+ callback (data, item) {
+ if (this.tempItem.id === data.id) {
+ this.tempItem = {}
+ } else {
+ this.tempItem.id = data.id
+ this.tempItem.name = data.name
+ }
+ this.$emit('callback', data, item)
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.tree {
+ /*width: 100%;*/
+ /*height: auto;*/
+ /*border-radius: 5px;*/
+ /*overflow: hidden;*/
+ /*border: 1px solid #eeeeee;*/
+ /*box-sizing: border-box;*/
+ .tree_childern {
+ margin-left: 20px;
+ }
+ .activeItem {
+ background: #F4F7FC;
+ }
+ .tree_item {
+ display: flex;
+ align-items: center;
+ height: 48px;
+ cursor: pointer;
+ padding-left: 10px;
+ .tree_item_label {
+ font-size: 14px;
+ font-weight: 400;
+ color: #333333;
+ white-space: nowrap;
+ }
+ i {
+ margin-right: 5px;
+ }
+ .color {
+ color: #999999 !important;
+ }
+ .activeColor {
+ color: #305ED5 !important;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3