|  | @@ -3,8 +3,9 @@
 | 
	
		
			
				|  |  |      class="tree-select"
 | 
	
		
			
				|  |  |      allowClear
 | 
	
		
			
				|  |  |      style="width: 100%"
 | 
	
		
			
				|  |  | -    :multiple = "multiple"
 | 
	
		
			
				|  |  | -    :showSearch = "false"
 | 
	
		
			
				|  |  | +    :virtual="virtual"
 | 
	
		
			
				|  |  | +    :multiple="multiple"
 | 
	
		
			
				|  |  | +    :showSearch="false"
 | 
	
		
			
				|  |  |      :getPopupContainer="(node) => node.parentNode"
 | 
	
		
			
				|  |  |      :dropdownStyle="{ maxHeight: '400px', overflow: 'auto', zIndex: 99999 }"
 | 
	
		
			
				|  |  |      :placeholder="placeholder"
 | 
	
	
		
			
				|  | @@ -28,7 +29,7 @@
 | 
	
		
			
				|  |  |    import { defHttp } from '/@/utils/http/axios';
 | 
	
		
			
				|  |  |    import { propTypes } from '/@/utils/propTypes';
 | 
	
		
			
				|  |  |    import { useMessage } from '/@/hooks/web/useMessage';
 | 
	
		
			
				|  |  | -import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  | +  import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |    enum Api {
 | 
	
		
			
				|  |  |      url = '/sys/dict/DeviceKind/query',
 | 
	
	
		
			
				|  | @@ -41,6 +42,7 @@ import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  |      loadTriggleChange: propTypes.bool.def(false),
 | 
	
		
			
				|  |  |      reload: propTypes.number.def(1),
 | 
	
		
			
				|  |  |      isSearch: propTypes.bool.def(true),
 | 
	
		
			
				|  |  | +    virtual: propTypes.bool.def(true),
 | 
	
		
			
				|  |  |    });
 | 
	
		
			
				|  |  |    const emit = defineEmits(['change', 'update:value']);
 | 
	
		
			
				|  |  |    const { createMessage } = useMessage();
 | 
	
	
		
			
				|  | @@ -71,7 +73,7 @@ import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  |            });
 | 
	
		
			
				|  |  |          }
 | 
	
		
			
				|  |  |        });
 | 
	
		
			
				|  |  | -      treeData.value = treeDataValue
 | 
	
		
			
				|  |  | +      treeData.value = treeDataValue;
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |  
 | 
	
	
		
			
				|  | @@ -108,11 +110,11 @@ import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |    /**
 | 
	
		
			
				|  |  | - * 根据已有的树数据 翻译选项
 | 
	
		
			
				|  |  | - */
 | 
	
		
			
				|  |  | +   * 根据已有的树数据 翻译选项
 | 
	
		
			
				|  |  | +   */
 | 
	
		
			
				|  |  |    function getItemFromTreeData() {
 | 
	
		
			
				|  |  |      let data = treeData.value;
 | 
	
		
			
				|  |  | -    let arr = []
 | 
	
		
			
				|  |  | +    let arr = [];
 | 
	
		
			
				|  |  |      findChildrenNode(data, arr);
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |    /**
 | 
	
	
		
			
				|  | @@ -128,10 +130,10 @@ import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  |            arr.push({
 | 
	
		
			
				|  |  |              key: item.key,
 | 
	
		
			
				|  |  |              value: item.value,
 | 
	
		
			
				|  |  | -            label: item.label || item.title
 | 
	
		
			
				|  |  | -          })
 | 
	
		
			
				|  |  | +            label: item.label || item.title,
 | 
	
		
			
				|  |  | +          });
 | 
	
		
			
				|  |  |          } else {
 | 
	
		
			
				|  |  | -          findChildrenNode(item.children, arr)
 | 
	
		
			
				|  |  | +          findChildrenNode(item.children, arr);
 | 
	
		
			
				|  |  |          }
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      }
 | 
	
	
		
			
				|  | @@ -162,44 +164,46 @@ import { onMounted, nextTick } from 'vue';
 | 
	
		
			
				|  |  |      });
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -  watch(() => props.value, (val) => {
 | 
	
		
			
				|  |  | -    if(!val){
 | 
	
		
			
				|  |  | -      treeValue.value = ''
 | 
	
		
			
				|  |  | -    }else{
 | 
	
		
			
				|  |  | -      treeValue.value = val
 | 
	
		
			
				|  |  | +  watch(
 | 
	
		
			
				|  |  | +    () => props.value,
 | 
	
		
			
				|  |  | +    (val) => {
 | 
	
		
			
				|  |  | +      if (!val) {
 | 
	
		
			
				|  |  | +        treeValue.value = '';
 | 
	
		
			
				|  |  | +      } else {
 | 
	
		
			
				|  |  | +        treeValue.value = val;
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  | -  })
 | 
	
		
			
				|  |  | +  );
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -//https://blog.csdn.net/u014192915/article/details/116074337
 | 
	
		
			
				|  |  | +  //https://blog.csdn.net/u014192915/article/details/116074337
 | 
	
		
			
				|  |  |    // // onCreated
 | 
	
		
			
				|  |  |    // validateProp().then(async () => {
 | 
	
		
			
				|  |  |    //   await loadItemByCode();
 | 
	
		
			
				|  |  |    // });
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -  onMounted(async() => {
 | 
	
		
			
				|  |  | +  onMounted(async () => {
 | 
	
		
			
				|  |  |      await loadItemByCode();
 | 
	
		
			
				|  |  |      nextTick(() => {
 | 
	
		
			
				|  |  | -      onChange(props.value)
 | 
	
		
			
				|  |  | -    })
 | 
	
		
			
				|  |  | -  })
 | 
	
		
			
				|  |  | +      onChange(props.value);
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +  });
 | 
	
		
			
				|  |  |  </script>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <style lang="less" scoped>
 | 
	
		
			
				|  |  |    @ventSpace: zxm;
 | 
	
		
			
				|  |  |    :deep(.@{ventSpace}-select-dropdown) {
 | 
	
		
			
				|  |  | -    .zxm-select-tree{
 | 
	
		
			
				|  |  | +    .zxm-select-tree {
 | 
	
		
			
				|  |  |        // border-bottom: 1px solid #ececec66;
 | 
	
		
			
				|  |  |        // background: transparent !important;
 | 
	
		
			
				|  |  |        border: 1px solid #ececec66;
 | 
	
		
			
				|  |  |        // background: transparent !important;
 | 
	
		
			
				|  |  |        // backdrop-filter: blur(50px) !important;
 | 
	
		
			
				|  |  | -      .@{ventSpace}-select-tree-treenode{
 | 
	
		
			
				|  |  | +      .@{ventSpace}-select-tree-treenode {
 | 
	
		
			
				|  |  |          color: black !important;
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  | -      .@{ventSpace}-select-tree-switcher-icon{
 | 
	
		
			
				|  |  | +      .@{ventSpace}-select-tree-switcher-icon {
 | 
	
		
			
				|  |  |          color: black !important;
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  | -    
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |  </style>
 |