bkui-vue 0.0.1-beta.220 → 0.0.1-beta.221

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -27242,6 +27242,8 @@ const treeProps = {
27242
27242
  ]).def(void 0),
27243
27243
  emptyText: PropTypes.string.def("\u6CA1\u6709\u6570\u636E"),
27244
27244
  draggable: PropTypes.bool.def(false),
27245
+ disableDrag: Function,
27246
+ disableDrop: Function,
27245
27247
  dragSort: PropTypes.bool.def(false),
27246
27248
  selectable: PropTypes.bool.def(true),
27247
27249
  showCheckbox: PropTypes.bool.def(false),
@@ -27844,22 +27846,42 @@ var useNodeDrag = (props2, root, flatData) => {
27844
27846
  getNodePath,
27845
27847
  isRootNode
27846
27848
  } = useNodeAttribute(flatData, props2);
27849
+ const isNeedCheckDraggable = computed(() => typeof props2.disableDrag === "function");
27850
+ const isNeedCheckDroppable = computed(() => typeof props2.disableDrop === "function");
27847
27851
  const getTargetTreeNode = (e) => {
27848
27852
  const target = e.target;
27849
27853
  return target.closest("[data-tree-node]");
27850
27854
  };
27855
+ const getNodeByTargetTreeNode = (targetNode) => {
27856
+ var _a;
27857
+ const uid = (_a = targetNode == null ? void 0 : targetNode.dataset) == null ? void 0 : _a.treeNode;
27858
+ return getSourceNodeByUID(uid);
27859
+ };
27851
27860
  const handleTreeNodeMouseup = (e) => {
27852
27861
  const targetNode = getTargetTreeNode(e);
27853
27862
  targetNode.removeEventListener("mouseup", handleTreeNodeMouseup);
27854
27863
  };
27855
27864
  const handleTreeNodeMousedown = (e) => {
27856
27865
  const targetNode = getTargetTreeNode(e);
27866
+ const data2 = getNodeByTargetTreeNode(targetNode);
27867
+ if (data2.draggable === false || isNeedCheckDraggable.value && props2.disableDrag(data2)) {
27868
+ targetNode.classList.add("bk-tree-drag-disabled");
27869
+ return;
27870
+ }
27857
27871
  targetNode.setAttribute("draggable", "true");
27858
27872
  targetNode.addEventListener("mouseup", handleTreeNodeMouseup);
27859
27873
  };
27860
27874
  const handleTreeNodeDragover = (e) => {
27861
27875
  e.preventDefault();
27862
27876
  const targetNode = getTargetTreeNode(e);
27877
+ const data2 = getNodeByTargetTreeNode(targetNode);
27878
+ if (isNeedCheckDroppable.value && (props2 == null ? void 0 : props2.disableDrop(data2))) {
27879
+ e.dataTransfer.effectAllowed = "move";
27880
+ e.dataTransfer.dropEffect = "none";
27881
+ targetNode.classList.add("bk-tree-drop-disabled");
27882
+ return;
27883
+ }
27884
+ targetNode.classList.add("bk-tree-drop-active");
27863
27885
  const sourceNodeId = e.dataTransfer.getData("node-id");
27864
27886
  const targetNodeId = targetNode.getAttribute("data-tree-node");
27865
27887
  const transferEffect = isNodeSortable(sourceNodeId, targetNodeId) ? "move" : "none";
@@ -27877,37 +27899,42 @@ var useNodeDrag = (props2, root, flatData) => {
27877
27899
  e.preventDefault();
27878
27900
  e.stopPropagation();
27879
27901
  const targetNode = getTargetTreeNode(e);
27902
+ targetNode.classList.remove("bk-tree-drop-active", "bk-tree-drop-disabled");
27903
+ const data2 = getNodeByTargetTreeNode(targetNode);
27904
+ if (isNeedCheckDroppable.value && props2.disableDrop(data2)) {
27905
+ return;
27906
+ }
27880
27907
  const sourceNodeId = e.dataTransfer.getData("node-id");
27881
27908
  const targetNodeId = targetNode.getAttribute("data-tree-node");
27882
27909
  Reflect.apply(props2.dragSort ? dragSortData : dragAsChildNode, globalThis, [sourceNodeId, targetNodeId]);
27883
27910
  };
27884
- const isNodeSortable = (sourceId, tartgetId) => {
27911
+ const isNodeSortable = (sourceId, targetId) => {
27885
27912
  const sourcePath = getNodePath({
27886
27913
  [NODE_ATTRIBUTES.UUID]: sourceId
27887
27914
  });
27888
27915
  const targetPath = getNodePath({
27889
- [NODE_ATTRIBUTES.UUID]: tartgetId
27916
+ [NODE_ATTRIBUTES.UUID]: targetId
27890
27917
  });
27891
27918
  const sourceParentNodeId = getNodeParentIdById(sourceId);
27892
- const targetParentNode = getNodeParentIdById(tartgetId);
27919
+ const targetParentNode = getNodeParentIdById(targetId);
27893
27920
  if (sourceParentNodeId === targetParentNode) {
27894
27921
  return true;
27895
27922
  }
27896
27923
  return sourcePath.indexOf(targetPath) === -1 && targetPath.indexOf(sourcePath) === -1;
27897
27924
  };
27898
- const dragSortData = (sourceId, tartgetId) => {
27899
- if (!isNodeSortable(sourceId, tartgetId)) {
27925
+ const dragSortData = (sourceId, targetId) => {
27926
+ if (!isNodeSortable(sourceId, targetId)) {
27900
27927
  return;
27901
27928
  }
27902
27929
  const sourceNodeData = JSON.parse(JSON.stringify(getSourceNodeByUID(sourceId)));
27903
- const targetNodeData = JSON.parse(JSON.stringify(getSourceNodeByUID(tartgetId)));
27930
+ const targetNodeData = JSON.parse(JSON.stringify(getSourceNodeByUID(targetId)));
27904
27931
  const sourceNodeParent = getParentNodeData(sourceId);
27905
- const targetNodeParent = getParentNodeData(tartgetId);
27932
+ const targetNodeParent = getParentNodeData(targetId);
27906
27933
  const sourceNodeIndex = getNodeAttr2({
27907
27934
  [NODE_ATTRIBUTES.UUID]: sourceId
27908
27935
  }, NODE_ATTRIBUTES.INDEX);
27909
27936
  const targetNodeIndex = getNodeAttr2({
27910
- [NODE_ATTRIBUTES.UUID]: tartgetId
27937
+ [NODE_ATTRIBUTES.UUID]: targetId
27911
27938
  }, NODE_ATTRIBUTES.INDEX);
27912
27939
  sourceNodeParent == null ? void 0 : sourceNodeParent[props2.children].splice(sourceNodeIndex, 1, targetNodeData);
27913
27940
  targetNodeParent == null ? void 0 : targetNodeParent[props2.children].splice(targetNodeIndex, 1, sourceNodeData);
@@ -27935,12 +27962,18 @@ var useNodeDrag = (props2, root, flatData) => {
27935
27962
  }
27936
27963
  targetNodeData[props2.children].unshift(sourceNodeData);
27937
27964
  };
27965
+ const handleTreeNodeDragLeave = (e) => {
27966
+ e.preventDefault();
27967
+ const targetNode = getTargetTreeNode(e);
27968
+ targetNode.classList.remove("bk-tree-drop-active", "bk-tree-drop-disabled");
27969
+ };
27938
27970
  onMounted(() => {
27939
27971
  if (props2.draggable && root.value) {
27940
27972
  const rootTree = root.value.$el;
27941
27973
  rootTree.addEventListener("mousedown", handleTreeNodeMousedown);
27942
27974
  rootTree.addEventListener("dragstart", handleTreeNodeDragStart);
27943
27975
  rootTree.addEventListener("dragover", handleTreeNodeDragover);
27976
+ rootTree.addEventListener("dragleave", handleTreeNodeDragLeave);
27944
27977
  rootTree.addEventListener("drop", handleTreeNodeDrop);
27945
27978
  }
27946
27979
  });
@@ -27950,6 +27983,7 @@ var useNodeDrag = (props2, root, flatData) => {
27950
27983
  rootTree.removeEventListener("mousedown", handleTreeNodeMousedown);
27951
27984
  rootTree.removeEventListener("dragstart", handleTreeNodeDragStart);
27952
27985
  rootTree.removeEventListener("dragover", handleTreeNodeDragover);
27986
+ rootTree.removeEventListener("dragleave", handleTreeNodeDragLeave);
27953
27987
  rootTree.removeEventListener("drop", handleTreeNodeDrop);
27954
27988
  }
27955
27989
  });