xdesign-vue-next/es/tree/useTree.mjs.map

XDesign Component for vue-next

{"version":3,"file":"useTree.mjs","sources":["../../src/tree/useTree.tsx"],"sourcesContent":["import { ref, watch, toRefs, nextTick } from 'vue';\nimport isArray from 'lodash/isArray';\nimport { TdTreeProps } from './type';\nimport TreeItem from './tree-item';\n\nimport TreeStore from '../_common/js/tree/tree-store';\nimport TreeNode from '../_common/js/tree/tree-node';\n\nimport useDefaultValue from '../hooks/useDefaultValue';\nimport useVModel from '../hooks/useVModel';\nimport useOnDrag from './hooks/useOnDrag';\nimport { getMark, getNode, getStoreConfig } from './util';\n\nimport { TypeEventState, TypeTreeNodeModel } from './interface';\n\nexport default function useTree(props: TdTreeProps) {\n  const treeStore = ref();\n  const cacheMap = new Map();\n  const treeNodeViews = ref([]);\n  const { expanded, actived, value, modelValue } = toRefs(props);\n\n  const [innerChecked, setInnerChecked] = useVModel(value, modelValue, props.defaultValue, props.onChange);\n  const [innerActived, setInnerActived] = useDefaultValue(actived, props.defaultActived, props.onActive, 'actived');\n  const [innerExpanded, setInnerExpanded] = useDefaultValue(\n    expanded,\n    props.defaultExpanded,\n    props.onExpand,\n    'expanded',\n  );\n\n  // 懒加载回调\n  const handleLoad = (info: TypeEventState) => {\n    const { node } = info;\n    const ctx = {\n      node: node.getModel(),\n    };\n    if (innerChecked.value && innerChecked.value.length > 0) {\n      treeStore.value.replaceChecked(innerChecked.value);\n    }\n    if (innerExpanded.value && innerExpanded.value.length > 0) {\n      treeStore.value.replaceExpanded(innerExpanded.value);\n    }\n    if (innerActived.value && innerActived.value.length > 0) {\n      treeStore.value.replaceActived(innerActived.value);\n    }\n    props.onLoad?.(ctx);\n  };\n\n  // 点击回调\n  const handleClick = (state: TypeEventState) => {\n    const { expandOnClickNode } = props;\n    const { mouseEvent, event, node } = state;\n\n    if (!node) {\n      return;\n    }\n    let shouldExpand = expandOnClickNode;\n    let shouldActive = !props.disabled && !node.disabled;\n    ['trigger', 'ignore'].forEach((markName) => {\n      const mark = getMark(markName, event.target as HTMLElement, event.currentTarget as HTMLElement);\n      const markValue = mark?.value || '';\n      if (markValue.indexOf('expand') >= 0) {\n        if (markName === 'trigger') {\n          shouldExpand = true;\n        } else if (markName === 'ignore') {\n          // shouldExpand = false;\n        }\n      }\n      if (markValue.indexOf('active') >= 0) {\n        if (markName === 'ignore') {\n          shouldActive = false;\n        }\n      }\n    });\n\n    const ctx = {\n      node: node.getModel(),\n      e: mouseEvent,\n    };\n\n    if (shouldExpand) {\n      const tnode = getNode(treeStore.value, node);\n      const expanded = node.setExpanded(!tnode.isExpanded());\n      setInnerExpanded(expanded, { ...ctx, trigger: 'node-click' });\n    }\n\n    if (shouldActive) {\n      const tnode = getNode(treeStore.value, node);\n      const actived = node.setActived(!tnode.isActived());\n      setInnerActived(actived, ctx);\n    }\n\n    props.onClick?.(ctx);\n  };\n\n  const handleChange = (state: TypeEventState) => {\n    const { disabled } = props;\n    const { node, mouseEvent } = state;\n    if (!node || disabled || node.disabled) {\n      return;\n    }\n\n    const tnode = getNode(treeStore.value, node);\n    const checked = node.setChecked(!tnode.isChecked());\n    setInnerChecked(checked, {\n      node: node.getModel(),\n      e: mouseEvent,\n    });\n  };\n\n  // 节点渲染\n  const renderTreeNodeViews = () => {\n    const nodes = treeStore.value.getNodes();\n\n    treeNodeViews.value = nodes\n      .filter((node: TreeNode) => node.visible)\n      .map((node: TreeNode) => {\n        // 如果节点已经存在，则使用缓存节点\n        let nodeView = cacheMap.get(node.value);\n        // 如果节点未曾创建，则临时创建\n        if (!nodeView) {\n          // 初次仅渲染可显示的节点\n          // 不存在节点视图，则创建该节点视图并插入到当前位置\n          nodeView = (\n            <TreeItem\n              key={node.value}\n              node={node}\n              onChange={handleChange}\n              onClick={handleClick}\n              expandOnClickNode={props.expandOnClickNode}\n            />\n          );\n          cacheMap.set(node.value, nodeView);\n        }\n        return nodeView;\n      });\n\n    // 更新缓存后，被删除的节点要移除掉，避免内存泄露\n    nextTick(() => {\n      cacheMap.forEach((view, value: string) => {\n        if (!treeStore.value.getNode(value)) {\n          cacheMap.delete(value);\n        }\n      });\n    });\n  };\n\n  useOnDrag(treeStore);\n\n  // 更新展开状态\n  const updateExpanded = () => {\n    const { expandParent } = props;\n    // 初始化展开状态\n    // 校验是否自动展开父节点\n    if (isArray(innerExpanded.value)) {\n      const expandedMap = new Map();\n      innerExpanded.value.forEach((val) => {\n        expandedMap.set(val, true);\n        if (expandParent) {\n          const node = treeStore.value.getNode(val);\n          node.getParents().forEach((tn: TypeTreeNodeModel) => {\n            expandedMap.set(tn.value, true);\n          });\n        }\n      });\n      const expandedArr = Array.from(expandedMap.keys());\n      treeStore.value.setExpanded(expandedArr);\n    }\n  };\n\n  // 初始化\n  const init = () => {\n    let options = props.data;\n    const store = new TreeStore({\n      ...getStoreConfig(props),\n      onLoad: (info: TypeEventState) => {\n        handleLoad(info);\n      },\n      onUpdate: () => {\n        renderTreeNodeViews();\n      },\n    });\n\n    // 初始化数据\n    treeStore.value = store;\n\n    if (!isArray(options)) {\n      options = [];\n    }\n    store.append(options);\n\n    // 刷新节点，必须在配置选中之前执行\n    // 这样选中态联动判断才能找到父节点\n    store.refreshNodes();\n\n    // 初始化选中状态\n    if (isArray(innerChecked.value)) {\n      store.setChecked(innerChecked.value);\n    }\n\n    updateExpanded();\n\n    // 初始化激活状态\n    if (isArray(innerActived.value)) {\n      store.setActived(innerActived.value);\n    }\n\n    // 树的数据初始化之后，需要立即进行一次视图刷新\n    renderTreeNodeViews();\n  };\n\n  // ------ 监听start ------\n\n  // data变化，重构 tree\n  watch(\n    () => props.data,\n    (list) => {\n      list = props.data;\n      cacheMap.clear();\n\n      treeStore.value.reload(list);\n      // 刷新节点，必须在配置选中之前执行\n      // 这样选中态联动判断才能找到父节点\n      treeStore.value.refreshNodes();\n      if (!list.length) return;\n      // 初始化选中状态\n      if (isArray(innerChecked.value)) {\n        treeStore.value.setChecked(innerChecked.value);\n      }\n\n      // 更新展开状态\n      updateExpanded();\n\n      // 初始化激活状态\n      if (isArray(innerActived.value)) {\n        treeStore.value.setActived(innerActived.value);\n      }\n      // 刷新节点状态\n      treeStore.value.refreshState();\n    },\n    { deep: true },\n  );\n\n  // tree插件配置变化\n  watch(\n    () => getStoreConfig(props),\n    () => {\n      if (!treeStore.value) return;\n      treeStore.value.setConfig(getStoreConfig(props));\n    },\n  );\n  watch(\n    innerChecked,\n    (nVal) => {\n      treeStore.value.replaceChecked(nVal);\n    },\n    { deep: true },\n  );\n  watch(\n    innerExpanded,\n    (nVal) => {\n      treeStore.value.replaceExpanded(nVal);\n    },\n    { deep: true },\n  );\n  watch(\n    innerActived,\n    (nVal) => {\n      treeStore.value.replaceActived(nVal);\n    },\n    { deep: true },\n  );\n\n  // 初始化树\n  init();\n\n  return {\n    treeStore,\n    treeNodeViews,\n  };\n}\n"],"names":["innerChecked","setInnerChecked","innerActived","setInnerActived","innerExpanded","setInnerExpanded","node","shouldExpand","shouldActive","e","trigger","nextTick","cacheMap","isArray","expandedMap","treeStore","onLoad","renderTreeNodeViews","options","store","updateExpanded","watch","deep","init","treeNodeViews"],"mappings":"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"}