Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

增加“是否仅允许同级目录之间拖拽”和“是否允许被目标元素包含”字段的限制 #32

Open
landmass opened this issue Jul 31, 2019 · 0 comments

Comments

@landmass
Copy link

背景:

  1. 针对 issue#8,增加了同级目录之间拖拽的限制条件
  2. 针对 issue#26,增加了是否允许被目标元素包含的限制条件
  3. 现在接手的项目中有这个需求

具体修改如下(修改处的起始行数以修改后的文件为准):

// 目录  ./src/lib/dragTreeTable.vue
// 第一处
133       const row = rows[i];
134  +    let dragElementLevel = dragParentNode.firstElementChild.dataset.level;
135  +    let targetElementLevel = row.dataset.level;
136       const rx = func.getElementLeft(row);

// 第二处
140       if (x > rx && x < (rx + rw) && y > ry && y < (ry + rh)) {
141  +      // 是否仅允许同级目录之间拖拽
142  +      if (this.onlyAllowSiblingDrag ? dragElementLevel !== targetElementLevel : false) return;
143         const diffY = y - ry

// 第三处
155       } else if (diffY/rowHeight > 1/4) {
156  +      // 是否允许被目标元素包含
157  +      if (!this.allowedIncluded) return;
158         if (hoverBlock.children[1].style.opacity !== '0.5') {

修改之后,调用如下(根据自己的需求修改 onlyAllowSiblingDragallowedIncluded 的值):

<dragTreeTable
  :data="treeData"
  :onDrag="onTreeDataChange"
  :isdraggable="true"
  :fixed="false"
  :height="400"
  :onlyAllowSiblingDrag="true"
  :allowedIncluded="false"></dragTreeTable>

望其他大佬不吝斧正。
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant