tdesign-vue-next
Version:
TDesign Component for vue-next
1 lines • 13 kB
Source Map (JSON)
{"version":3,"file":"useTreeItem.mjs","sources":["../../../../components/tree/hooks/useTreeItem.tsx"],"sourcesContent":["import { onMounted, reactive, TypeCreateElement, usePrefixClass, useLazyLoad, TypeVNode } from '../utils/adapt';\nimport { TypeTreeItemState } from '../types';\nimport useItemEvents from './useItemEvents';\nimport useRenderIcon from './useRenderIcon';\nimport useRenderLabel from './useRenderLabel';\nimport useRenderLine from './useRenderLine';\nimport useRenderOperations from './useRenderOperations';\nimport useDraggable from './useDraggable';\nimport { onUpdated } from 'vue';\n\nexport default function useTreeItem(state: TypeTreeItemState) {\n const { treeScope, treeItemRef } = state;\n const { virtualConfig, treeContentRef, scrollProps } = treeScope;\n const classPrefix = usePrefixClass().value;\n const componentName = usePrefixClass('tree').value;\n\n const { handleClick } = useItemEvents(state);\n const { renderIcon } = useRenderIcon(state);\n const { renderLabel } = useRenderLabel(state);\n const { renderLine } = useRenderLine(state);\n const { renderOperations } = useRenderOperations(state);\n const { dragStates, handleDragStart, handleDragEnd, handleDragOver, handleDragLeave, handleDrop } =\n useDraggable(state);\n\n const { hasLazyLoadHolder, tRowHeight } = useLazyLoad(\n treeContentRef,\n treeItemRef,\n reactive({ ...scrollProps?.value }),\n );\n\n function tryNotifyVirtualScrollRowUpdate() {\n const { node } = state;\n const isVirtual = virtualConfig?.isVirtualScroll.value;\n if (isVirtual) {\n // mounted 了，但是有可能样式没有计算完毕，此时获取的 row height 会有坑，延迟一点点再触发虚拟滚动的 mounted 回调，确保获取到正确的渲染高度\n const timer = setTimeout(() => {\n virtualConfig.handleRowMounted({\n ref: treeItemRef,\n data: node,\n });\n clearTimeout(timer);\n }, 100);\n }\n }\n\n onMounted(() => {\n tryNotifyVirtualScrollRowUpdate();\n });\n\n // 有可能因为 row-key 带来组件复用，这时候通过 update 进行更新\n onUpdated(() => {\n tryNotifyVirtualScrollRowUpdate();\n });\n\n // 节点隐藏用 class 切换，不要写在 js 中\n const getItemStyles = (): string => {\n const { node } = state;\n const { level } = node;\n // 原本想在这里计算 --hscale\n // 实际操作中发现 scrollHeight 在动画执行到一半的时候取得了错误的值\n // 导致 hscale 值获取错误\n // 暂无合适的方案，先搁置 hscale 自动计算策略\n const levelStyle = `--level: ${level};`;\n const strStyle = `${levelStyle}`;\n return strStyle;\n };\n\n const getItemClassList = () => {\n const { node } = state;\n const { isDragOver, isDragging, dropPosition } = dragStates;\n const list = [];\n list.push(`${componentName}__item`);\n list.push({\n [`${componentName}__item--open`]: node.expanded,\n [`${classPrefix}-is-active`]: node.isActivable() ? node.actived : false,\n [`${classPrefix}-is-disabled`]: node.isDisabled(),\n });\n list.push({\n [`${componentName}__item--draggable`]: node.isDraggable(),\n });\n if (node.visible) {\n list.push(`${componentName}__item--visible`);\n } else {\n list.push(`${componentName}__item--hidden`);\n }\n if (node.vmIsLocked) {\n list.push(`${componentName}__item--locked`);\n }\n if (node.vmIsRest) {\n list.push(`${componentName}__item--matched`);\n }\n // 拖拽过程样式相关classList\n list.push({\n [`${componentName}__item--dragging`]: isDragging,\n [`${componentName}__item--tip-top`]: isDragOver && dropPosition < 0,\n [`${componentName}__item--tip-bottom`]: isDragOver && dropPosition > 0,\n [`${componentName}__item--tip-highlight`]: !isDragging && isDragOver && dropPosition === 0,\n });\n return list;\n };\n\n const renderItem = (h: TypeCreateElement) => {\n const itemNodes: TypeVNode[] = [];\n // 第一步是渲染图标\n const iconNode = renderIcon(h);\n // 渲染连线排在渲染图标之后，是为了确认图标是否存在\n const lineNode = renderLine(h);\n if (lineNode) {\n itemNodes.push(lineNode);\n }\n if (iconNode) {\n itemNodes.push(iconNode);\n }\n const labelNode = renderLabel(h);\n if (labelNode) {\n itemNodes.push(labelNode);\n }\n const opNode = renderOperations(h);\n if (opNode) {\n itemNodes.push(opNode);\n }\n return itemNodes;\n };\n\n const renderItemNode = (h: TypeCreateElement) => {\n const { node, props } = state;\n if (!node) return null;\n\n const { level, value } = node;\n const styles = getItemStyles();\n const classList = getItemClassList();\n\n // 这里的代码用于 vue2 组件触发节点更新\n // 即使是新增的属性，调用 node.setData 也会触发节点更新\n const treeState = state;\n treeState.stateId = props.stateId;\n\n const itemNode = (\n <div\n ref=\"treeItemRef\"\n class={classList}\n data-value={value}\n data-level={level}\n style={styles}\n onClick={(evt: MouseEvent) => handleClick(evt)}\n draggable={node.isDraggable()}\n onDragstart={(evt: DragEvent) => handleDragStart(evt)}\n onDragend={(evt: DragEvent) => handleDragEnd(evt)}\n onDragover={(evt: DragEvent) => handleDragOver(evt)}\n onDragleave={(evt: DragEvent) => handleDragLeave(evt)}\n onDrop={(evt: DragEvent) => handleDrop(evt)}\n >\n {hasLazyLoadHolder.value ? [<div />] : renderItem(h)}\n </div>\n );\n return itemNode;\n };\n\n return {\n hasLazyLoadHolder,\n tRowHeight,\n renderItemNode,\n };\n}\n"],"names":["useTreeItem","state","treeScope","treeItemRef","virtualConfig","treeContentRef","scrollProps","classPrefix","usePrefixClass","value","componentName","_useItemEvents","useItemEvents","handleClick","_useRenderIcon","useRenderIcon","renderIcon","_useRenderLabel","useRenderLabel","renderLabel","_useRenderLine","useRenderLine","renderLine","_useRenderOperations","useRenderOperations","renderOperations","_useDraggable","useDraggable","dragStates","handleDragStart","handleDragEnd","handleDragOver","handleDragLeave","handleDrop","_useLazyLoad","useLazyLoad","reactive","_objectSpread","hasLazyLoadHolder","tRowHeight","tryNotifyVirtualScrollRowUpdate","node","isVirtual","isVirtualScroll","timer","setTimeout","handleRowMounted","ref","data","clearTimeout","onMounted","onUpdated","getItemStyles","level","levelStyle","strStyle","getItemClassList","isDragOver","isDragging","dropPosition","list","push","concat","_defineProperty","expanded","isActivable","actived","isDisabled","isDraggable","visible","vmIsLocked","vmIsRest","renderItem","h","itemNodes","iconNode","lineNode","labelNode","opNode","renderItemNode","props","styles","classList","treeState","stateId","itemNode","_createVNode","onClick","evt","onDragstart","onDragend","onDragover","onDragleave","onDrop"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,SAAwBA,YAAYC,KAA0B,EAAA;AACtD,EAAA,IAAEC,SAAW,GAAgBD,KAAA,CAA3BC,SAAW;IAAAC,WAAA,GAAgBF,KAAA,CAAhBE,WAAA,CAAA;AACnB,EAAA,IAAQC,aAAA,GAA+CF,SAAA,CAA/CE,aAAA;IAAeC,cAAgB,GAAgBH,SAAA,CAAhCG,cAAgB;IAAAC,WAAA,GAAgBJ,SAAA,CAAhBI,WAAA,CAAA;AACjC,EAAA,IAAAC,WAAA,GAAcC,gBAAiB,CAAAC,KAAA,CAAA;AAC/B,EAAA,IAAAC,aAAA,GAAgBF,cAAe,CAAA,MAAM,CAAE,CAAAC,KAAA,CAAA;AAE7C,EAAA,IAAAE,cAAA,GAAwBC,aAAA,CAAcX,KAAK,CAAA;IAAnCY,WAAA,GAAAF,cAAA,CAAAE,WAAA,CAAA;AACR,EAAA,IAAAC,cAAA,GAAuBC,aAAA,CAAcd,KAAK,CAAA;IAAlCe,UAAA,GAAAF,cAAA,CAAAE,UAAA,CAAA;AACR,EAAA,IAAAC,eAAA,GAAwBC,cAAA,CAAejB,KAAK,CAAA;IAApCkB,WAAA,GAAAF,eAAA,CAAAE,WAAA,CAAA;AACR,EAAA,IAAAC,cAAA,GAAuBC,aAAA,CAAcpB,KAAK,CAAA;IAAlCqB,UAAA,GAAAF,cAAA,CAAAE,UAAA,CAAA;AACR,EAAA,IAAAC,oBAAA,GAA6BC,mBAAA,CAAoBvB,KAAK,CAAA;IAA9CwB,gBAAA,GAAAF,oBAAA,CAAAE,gBAAA,CAAA;AACF,EAAA,IAAAC,aAAA,GACJC,YAAA,CAAa1B,KAAK,CAAA;IADZ2B,2BAAAA;IAAYC,eAAiB,GAAAH,aAAA,CAAjBG,eAAiB;IAAAC,aAAA,GAAAJ,aAAA,CAAAI,aAAA;IAAeC,+BAAAA;IAAgBC,eAAiB,GAAAN,aAAA,CAAjBM,eAAiB;IAAAC,UAAA,GAAAP,aAAA,CAAAO,UAAA,CAAA;EAG/E,IAAAC,YAAA,GAAoCC,WAAA,CACxC9B,cAAA,EACAF,WAAA,EACAiC,QAAS,CAAAC,aAAA,CAAK/B,EAAAA,EAAAA,WAAA,aAAAA,WAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,WAAA,CAAaG,MAAO,CACpC,CAAA;IAJQ6B,iBAAmB,GAAAJ,YAAA,CAAnBI,iBAAmB;IAAAC,UAAA,GAAAL,YAAA,CAAAK,UAAA,CAAA;EAM3B,SAASC,+BAAkCA,GAAA;AACnC,IAAA,IAAEC,OAASxC,KAAA,CAATwC;IACF,IAAAC,SAAA,GAAYtC,kBAAAA,IAAAA,IAAAA,oCAAAA,cAAeuC,eAAgB,CAAAlC,KAAA,CAAA;AACjD,IAAA,IAAIiC,SAAW,EAAA;AAEP,MAAA,IAAAE,KAAA,GAAQC,WAAW,YAAM;QAC7BzC,aAAA,CAAc0C,gBAAiB,CAAA;AAC7BC,UAAAA,GAAK,EAAA5C,WAAA;AACL6C,UAAAA,IAAM,EAAAP,IAAAA;AACR,SAAC,CAAA,CAAA;QACDQ,YAAA,CAAaL,KAAK,CAAA,CAAA;SACjB,GAAG,CAAA,CAAA;AACR,KAAA;AACF,GAAA;AAEAM,EAAAA,SAAA,CAAU,YAAM;AACkBV,IAAAA,+BAAA,EAAA,CAAA;AAClC,GAAC,CAAA,CAAA;AAGDW,EAAAA,SAAA,CAAU,YAAM;AACkBX,IAAAA,+BAAA,EAAA,CAAA;AAClC,GAAC,CAAA,CAAA;AAGD,EAAA,IAAMY,gBAAgB,SAAhBA,gBAA8B;AAC5B,IAAA,IAAEX,OAASxC,KAAA,CAATwC;AACF,IAAA,IAAEY,QAAUZ,IAAA,CAAVY;AAKR,IAAA,IAAMC,gCAAyBD,KAAA,EAAA,GAAA,CAAA,CAAA;AAC/B,IAAA,IAAME,qBAAcD,UAAA,CAAA,CAAA;AACb,IAAA,OAAAC,QAAA,CAAA;GACT,CAAA;AAEA,EAAA,IAAMC,mBAAmB,SAAnBA,mBAAyB;AACvB,IAAA,IAAEf,OAASxC,KAAA,CAATwC;AACR,IAAA,IAAQgB,UAAA,GAAyC7B,UAAA,CAAzC6B,UAAA;MAAYC,UAAY,GAAiB9B,UAAA,CAA7B8B,UAAY;MAAAC,YAAA,GAAiB/B,UAAA,CAAjB+B,YAAA,CAAA;IAChC,IAAMC,OAAO,EAAC,CAAA;AACTA,IAAAA,IAAA,CAAAC,IAAA,CAAA,EAAA,CAAAC,MAAA,CAAQpD,aAAqB,WAAA,CAAA,CAAA;AAClCkD,IAAAA,IAAA,CAAKC,IAAK,CAAAE,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAA,EAAA,EAAA,EAAA,CAAAD,MAAA,CACJpD,aAAA,mBAA8B+B,IAAK,CAAAuB,QAAA,CAAAF,EAAAA,EAAAA,CAAAA,MAAA,CACnCvD,WAAA,EAAA,YAAA,CAAA,EAA0BkC,KAAKwB,WAAY,EAAA,GAAIxB,KAAKyB,OAAU,GAAA,KAAA,CAAA,EAAA,EAAA,CAAAJ,MAAA,CAC9DvD,WAA4B,mBAAAkC,IAAA,CAAK0B,UAAW,EAAA,CACjD,CAAA,CAAA;AACDP,IAAAA,IAAA,CAAKC,IAAK,CAAAE,eAAA,QAAAD,MAAA,CACJpD,aAAmC,EAAA,mBAAA,CAAA,EAAA+B,IAAA,CAAK2B,WAAY,EAAA,CACzD,CAAA,CAAA;IACD,IAAI3B,KAAK4B,OAAS,EAAA;AACXT,MAAAA,IAAA,CAAAC,IAAA,CAAA,EAAA,CAAAC,MAAA,CAAQpD,aAA8B,oBAAA,CAAA,CAAA;AAC7C,KAAO,MAAA;AACAkD,MAAAA,IAAA,CAAAC,IAAA,CAAA,EAAA,CAAAC,MAAA,CAAQpD,aAA6B,mBAAA,CAAA,CAAA;AAC5C,KAAA;IACA,IAAI+B,KAAK6B,UAAY,EAAA;AACdV,MAAAA,IAAA,CAAAC,IAAA,CAAA,EAAA,CAAAC,MAAA,CAAQpD,aAA6B,mBAAA,CAAA,CAAA;AAC5C,KAAA;IACA,IAAI+B,KAAK8B,QAAU,EAAA;AACZX,MAAAA,IAAA,CAAAC,IAAA,CAAA,EAAA,CAAAC,MAAA,CAAQpD,aAA8B,oBAAA,CAAA,CAAA;AAC7C,KAAA;IAEAkD,IAAA,CAAKC,IAAK,CAAAE,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAA,EAAA,EAAA,EAAA,CAAAD,MAAA,CACJpD,aAAkC,EAAAgD,kBAAAA,CAAAA,EAAAA,UAAA,CAAAI,EAAAA,EAAAA,CAAAA,MAAA,CAClCpD,aAAiC,EAAA,iBAAA,CAAA,EAAA+C,UAAA,IAAcE,YAAe,GAAA,CAAA,CAAAG,EAAAA,EAAAA,CAAAA,MAAA,CAC9DpD,aAAoC,EAAA,oBAAA,CAAA,EAAA+C,UAAA,IAAcE,YAAe,GAAA,CAAA,CAAAG,EAAAA,EAAAA,CAAAA,MAAA,CACjEpD,aAAA,EAAA,uBAAA,CAAA,EAAuC,CAACgD,UAAA,IAAcD,cAAcE,YAAiB,KAAA,CAAA,CAC1F,CAAA,CAAA;AACM,IAAA,OAAAC,IAAA,CAAA;GACT,CAAA;AAEM,EAAA,IAAAY,UAAA,GAAa,SAAbA,UAAAA,CAAcC,CAAyB,EAAA;IAC3C,IAAMC,YAAyB,EAAC,CAAA;AAE1B,IAAA,IAAAC,QAAA,GAAW3D,WAAWyD,CAAC,CAAA,CAAA;AAEvB,IAAA,IAAAG,QAAA,GAAWtD,WAAWmD,CAAC,CAAA,CAAA;AAC7B,IAAA,IAAIG,QAAU,EAAA;AACZF,MAAAA,SAAA,CAAUb,KAAKe,QAAQ,CAAA,CAAA;AACzB,KAAA;AACA,IAAA,IAAID,QAAU,EAAA;AACZD,MAAAA,SAAA,CAAUb,KAAKc,QAAQ,CAAA,CAAA;AACzB,KAAA;AACM,IAAA,IAAAE,SAAA,GAAY1D,YAAYsD,CAAC,CAAA,CAAA;AAC/B,IAAA,IAAII,SAAW,EAAA;AACbH,MAAAA,SAAA,CAAUb,KAAKgB,SAAS,CAAA,CAAA;AAC1B,KAAA;AACM,IAAA,IAAAC,MAAA,GAASrD,iBAAiBgD,CAAC,CAAA,CAAA;AACjC,IAAA,IAAIK,MAAQ,EAAA;AACVJ,MAAAA,SAAA,CAAUb,KAAKiB,MAAM,CAAA,CAAA;AACvB,KAAA;AACO,IAAA,OAAAJ,SAAA,CAAA;GACT,CAAA;AAEM,EAAA,IAAAK,cAAA,GAAiB,SAAjBA,cAAAA,CAAkBN,CAAyB,EAAA;AACzC,IAAA,IAAEhC,IAAM,GAAUxC,KAAA,CAAhBwC,IAAM;MAAAuC,KAAA,GAAU/E,KAAA,CAAV+E,KAAA,CAAA;AACd,IAAA,IAAI,CAACvC,IAAA,EAAa,OAAA,IAAA,CAAA;AAEZ,IAAA,IAAEY,KAAO,GAAUZ,IAAA,CAAjBY,KAAO;MAAA5C,KAAA,GAAUgC,IAAA,CAAVhC,KAAA,CAAA;AACf,IAAA,IAAMwE,SAAS7B,aAAc,EAAA,CAAA;AAC7B,IAAA,IAAM8B,YAAY1B,gBAAiB,EAAA,CAAA;IAInC,IAAM2B,SAAY,GAAAlF,KAAA,CAAA;AAClBkF,IAAAA,SAAA,CAAUC,UAAUJ,KAAM,CAAAI,OAAA,CAAA;IAE1B,IAAMC,QACJ,GAAAC,WAAA,CAAA,KAAA,EAAA;AAAA,MAAA,KAAA,EAAA,aAAA;AAAA,MAAA,OAAA,EAESJ,SACP;AAAA,MAAA,YAAA,EAAYzE,KACZ;AAAA,MAAA,YAAA,EAAY4C,KACZ;AAAA,MAAA,OAAA,EAAO4B,MACP;MAAA,SAAS,EAAA,SAAAM,QAACC,GAAA,EAAA;QAAA,OAAoB3E,WAAY,CAAA2E,GAAG,CAC7C,CAAA;AAAA,OAAA;AAAA,MAAA,WAAA,EAAW/C,IAAK,CAAA2B,WAAA,EAChB;MAAA,aAAa,EAAA,SAAAqB,YAACD,GAAA,EAAA;QAAA,OAAmB3D,eAAgB,CAAA2D,GAAG;;iBACzC,EAAA,SAAAE,UAACF,GAAmB,EAAA;QAAA,OAAA1D,aAAA,CAAc0D,GAAG,CAAA,CAAA;AAAA,OAAA;MAAA,YACpC,EAAA,SAAAG,WAACH,GAAmB,EAAA;QAAA,OAAAzD,cAAA,CAAeyD,GAAG,CAAA,CAAA;AAAA,OAAA;MAAA,aACrC,EAAA,SAAAI,YAACJ,GAAmB,EAAA;QAAA,OAAAxD,eAAA,CAAgBwD,GAAG,CACpD,CAAA;AAAA,OAAA;MAAA,QAAQ,EAAA,SAAAK,OAACL,GAAA,EAAA;QAAA,OAAmBvD,UAAW,CAAAuD,GAAG,CAEzC,CAAA;AAAA,OAAA;AAAA,KAAA,EAAA,CAAAlD,iBAAA,CAAkB7B,KAAQ,GAAA,CAAA6E,WAAA,CAAQ,KAAA,EAAA,IAAA,EAAA,IAAA,CAAA,CAAA,GAAId,UAAW,CAAAC,CAAC,EAdpD,CAAA,CAAA;AAiBI,IAAA,OAAAY,QAAA,CAAA;GACT,CAAA;EAEO,OAAA;AACL/C,IAAAA,iBAAA,EAAAA,iBAAA;AACAC,IAAAA,UAAA,EAAAA,UAAA;AACAwC,IAAAA,cAAA,EAAAA,cAAAA;GACF,CAAA;AACF;;;;"}