mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-21 17:10:12 +01:00
This commit is contained in:
Vanessa
parent
d44dd0123a
commit
602ec84a57
2 changed files with 118 additions and 113 deletions
|
|
@ -273,8 +273,6 @@ export class Files extends Model {
|
|||
setPanelFocus(this.element.parentElement);
|
||||
}
|
||||
});
|
||||
// b3-list-item--focus 样式会遮挡拖拽排序的上下线条
|
||||
let focusElement: HTMLElement;
|
||||
this.element.addEventListener("dragstart", (event: DragEvent & { target: HTMLElement }) => {
|
||||
if (isTouchDevice()) {
|
||||
event.stopPropagation();
|
||||
|
|
@ -282,31 +280,31 @@ export class Files extends Model {
|
|||
return;
|
||||
}
|
||||
window.getSelection().removeAllRanges();
|
||||
focusElement = this.element.querySelector(".b3-list-item--focus");
|
||||
if (focusElement) {
|
||||
focusElement.classList.remove("b3-list-item--focus");
|
||||
}
|
||||
const liElement = hasClosestByTag(event.target, "LI");
|
||||
if (liElement) {
|
||||
const ulElement = hasTopClosestByTag(liElement, "UL");
|
||||
event.dataTransfer.setData("text/html", liElement.outerHTML);
|
||||
if (ulElement) {
|
||||
event.dataTransfer.setData(Constants.SIYUAN_DROP_FILE, ulElement.getAttribute("data-url"));
|
||||
let selectElements: Element[] = Array.from(this.element.querySelectorAll(".b3-list-item--focus"))
|
||||
if (!liElement.classList.contains("b3-list-item--focus")) {
|
||||
selectElements.forEach((item) => {
|
||||
item.classList.remove("b3-list-item--focus");
|
||||
})
|
||||
liElement.classList.add("b3-list-item--focus");
|
||||
selectElements = [liElement];
|
||||
}
|
||||
selectElements.forEach((item: HTMLElement) => {
|
||||
item.style.opacity = "0.1";
|
||||
})
|
||||
const img = new Image();
|
||||
// TODO: drag preview
|
||||
img.src = `data:image/png;base64,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`;
|
||||
event.dataTransfer.setDragImage(img, 10, 10);
|
||||
event.dataTransfer.setData(Constants.SIYUAN_DROP_FILE, Constants.SIYUAN_DROP_FILE);
|
||||
event.dataTransfer.dropEffect = "move";
|
||||
liElement.style.opacity = "0.1";
|
||||
window.siyuan.dragElement = liElement;
|
||||
}
|
||||
});
|
||||
this.element.addEventListener("dragend", (event: DragEvent & { target: HTMLElement }) => {
|
||||
const liElement = hasClosestByTag(event.target, "LI");
|
||||
if (liElement) {
|
||||
liElement.style.opacity = "1";
|
||||
}
|
||||
if (focusElement) {
|
||||
focusElement.classList.add("b3-list-item--focus");
|
||||
focusElement = undefined;
|
||||
}
|
||||
this.element.querySelectorAll(".b3-list-item--focus").forEach((item: HTMLElement) => {
|
||||
item.style.opacity = ""
|
||||
})
|
||||
window.siyuan.dragElement = undefined;
|
||||
});
|
||||
this.element.addEventListener("dragover", (event: DragEvent & { target: HTMLElement }) => {
|
||||
|
|
@ -314,29 +312,34 @@ export class Files extends Model {
|
|||
return;
|
||||
}
|
||||
const liElement = hasClosestByTag(event.target, "LI");
|
||||
if (!liElement || !window.siyuan.dragElement || liElement.isSameNode(window.siyuan.dragElement)) {
|
||||
if (!liElement || liElement.classList.contains("b3-list-item--focus")) {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
liElement.classList.remove("dragover__top", "dragover__bottom", "dragover");
|
||||
const sourceType = window.siyuan.dragElement.getAttribute("data-type");
|
||||
if (window.siyuan.dragElement.parentElement?.classList.contains("protyle-gutters")) {
|
||||
if (["NodeListItem", "NodeHeading"].includes(sourceType)) {
|
||||
// 编辑器情景菜单拖拽
|
||||
if (window.siyuan.dragElement?.parentElement?.classList.contains("protyle-gutters")) {
|
||||
if (["NodeListItem", "NodeHeading"].includes(window.siyuan.dragElement.getAttribute("data-type"))) {
|
||||
// 块标拖拽
|
||||
liElement.classList.add("dragover");
|
||||
}
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
let sourceOnlyRoot = true
|
||||
Array.from(this.element.querySelectorAll(".b3-list-item--focus")).find((item: HTMLElement) => {
|
||||
if (item.getAttribute("data-type") === "navigation-file") {
|
||||
sourceOnlyRoot = false
|
||||
return true;
|
||||
}
|
||||
})
|
||||
const targetType = liElement.getAttribute("data-type");
|
||||
if (sourceType === "navigation-root" && targetType !== "navigation-root") {
|
||||
if (sourceOnlyRoot && targetType !== "navigation-root") {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
if (window.siyuan.config.fileTree.sort === 6 &&
|
||||
// 防止文档拖拽到笔记本外
|
||||
!(sourceType === "navigation-file" && targetType === "navigation-root")) {
|
||||
!(!sourceOnlyRoot && targetType === "navigation-root")) {
|
||||
const nodeRect = liElement.getBoundingClientRect();
|
||||
if (event.clientY > nodeRect.top + 20) {
|
||||
liElement.classList.add("dragover__bottom");
|
||||
|
|
@ -347,7 +350,7 @@ export class Files extends Model {
|
|||
}
|
||||
}
|
||||
if (liElement.classList.contains("dragover__top") || liElement.classList.contains("dragover__bottom") ||
|
||||
(targetType === "navigation-root" && sourceType === "navigation-root")) {
|
||||
(targetType === "navigation-root" && sourceOnlyRoot)) {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
|
@ -371,10 +374,10 @@ export class Files extends Model {
|
|||
}
|
||||
const toURL = newUlElement.getAttribute("data-url");
|
||||
const toPath = newElement.getAttribute("data-path");
|
||||
const fromType = window.siyuan.dragElement.getAttribute("data-type");
|
||||
if (newElement.classList.contains("dragover") && ["NodeListItem", "NodeHeading"].includes(fromType)) {
|
||||
// 编辑器情景菜单拖拽
|
||||
if (fromType === "NodeHeading") {
|
||||
const gutterType = window.siyuan.dragElement?.getAttribute("data-type")
|
||||
if (newElement.classList.contains("dragover") && ["NodeListItem", "NodeHeading"].includes(gutterType)) {
|
||||
// 块标拖拽
|
||||
if (gutterType === "NodeHeading") {
|
||||
fetchPost("/api/filetree/heading2Doc", {
|
||||
targetNoteBook: toURL,
|
||||
srcHeadingID: window.siyuan.dragElement.getAttribute("data-node-id"),
|
||||
|
|
@ -392,92 +395,95 @@ export class Files extends Model {
|
|||
newElement.classList.remove("dragover", "dragover__bottom", "dragover__top");
|
||||
return;
|
||||
}
|
||||
|
||||
const fromURL = event.dataTransfer.getData(Constants.SIYUAN_DROP_FILE);
|
||||
const fromPath = window.siyuan.dragElement.getAttribute("data-path");
|
||||
if ((!fromURL || !fromPath || fromPath === toPath) && fromType !== "navigation-root") {
|
||||
if (!event.dataTransfer.getData(Constants.SIYUAN_DROP_FILE)) {
|
||||
newElement.classList.remove("dragover", "dragover__bottom", "dragover__top");
|
||||
return;
|
||||
}
|
||||
let sourceOnlyRoot = true
|
||||
const fromPaths: string[] = []
|
||||
this.element.querySelectorAll(".b3-list-item--focus").forEach((item: HTMLElement) => {
|
||||
if (item.getAttribute("data-type") === "navigation-file") {
|
||||
sourceOnlyRoot = false
|
||||
}
|
||||
fromPaths.push(item.getAttribute("data-path"))
|
||||
})
|
||||
if (newElement.classList.contains("dragover")) {
|
||||
await fetchPost("/api/filetree/moveDoc", {
|
||||
fromNotebook: fromURL,
|
||||
toNotebook: toURL,
|
||||
fromPath,
|
||||
fromPaths,
|
||||
toPath,
|
||||
});
|
||||
}
|
||||
if ((newElement.classList.contains("dragover__bottom") || newElement.classList.contains("dragover__top")) && window.siyuan.config.fileTree.sort === 6) {
|
||||
if (fromType === "navigation-root") {
|
||||
if (newElement.classList.contains("dragover__top")) {
|
||||
newElement.parentElement.before(window.siyuan.dragElement.parentElement);
|
||||
} else {
|
||||
newElement.parentElement.after(window.siyuan.dragElement.parentElement);
|
||||
}
|
||||
const notebooks: string[] = [];
|
||||
Array.from(this.element.children).forEach(item => {
|
||||
notebooks.push(item.getAttribute("data-url"));
|
||||
});
|
||||
fetchPost("/api/notebook/changeSortNotebook", {
|
||||
notebooks,
|
||||
});
|
||||
} else {
|
||||
let hasMove = false;
|
||||
const toDir = pathPosix().dirname(toPath);
|
||||
if (fromType !== "navigation-root" && (toDir !== pathPosix().dirname(fromPath) || fromURL !== toURL)) {
|
||||
await fetchPost("/api/filetree/moveDoc", {
|
||||
fromNotebook: fromURL,
|
||||
toNotebook: toURL,
|
||||
fromPath,
|
||||
toPath: toDir === "/" ? "/" : toDir + ".sy",
|
||||
});
|
||||
window.siyuan.dragElement.setAttribute("data-path", pathPosix().join(toDir, window.siyuan.dragElement.getAttribute("data-node-id") + ".sy"));
|
||||
hasMove = true;
|
||||
}
|
||||
let nextULElement;
|
||||
if (window.siyuan.dragElement.nextElementSibling && window.siyuan.dragElement.nextElementSibling.tagName === "UL") {
|
||||
nextULElement = window.siyuan.dragElement.nextElementSibling;
|
||||
}
|
||||
if (newElement.classList.contains("dragover__bottom")) {
|
||||
if (newElement.nextElementSibling && newElement.nextElementSibling.tagName === "UL") {
|
||||
newElement.nextElementSibling.after(window.siyuan.dragElement);
|
||||
} else {
|
||||
newElement.after(window.siyuan.dragElement);
|
||||
}
|
||||
} else if (newElement.classList.contains("dragover__top")) {
|
||||
newElement.before(window.siyuan.dragElement);
|
||||
}
|
||||
if (nextULElement) {
|
||||
window.siyuan.dragElement.after(nextULElement);
|
||||
}
|
||||
const paths: string[] = [];
|
||||
Array.from(newElement.parentElement.children).forEach(item => {
|
||||
if (item.tagName === "LI") {
|
||||
paths.push(item.getAttribute("data-path"));
|
||||
}
|
||||
});
|
||||
fetchPost("/api/filetree/changeSort", {
|
||||
paths,
|
||||
notebook: toURL
|
||||
}, () => {
|
||||
if (hasMove) {
|
||||
// 移动并排序后，会推送 moveDoc，但此时还没有 sort。 https://github.com/siyuan-note/siyuan/issues/4270
|
||||
fetchPost("/api/filetree/listDocsByPath", {
|
||||
notebook: toURL,
|
||||
path: pathPosix().dirname(toPath),
|
||||
sort: window.siyuan.config.fileTree.sort,
|
||||
}, response => {
|
||||
if (response.data.path === "/" && response.data.files.length === 0) {
|
||||
showMessage(window.siyuan.languages.emptyContent);
|
||||
return;
|
||||
}
|
||||
this.onLsHTML(response.data);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
newElement.classList.remove("dragover", "dragover__bottom", "dragover__top");
|
||||
// if ((newElement.classList.contains("dragover__bottom") || newElement.classList.contains("dragover__top")) && window.siyuan.config.fileTree.sort === 6) {
|
||||
// if (fromType === "navigation-root") {
|
||||
// if (newElement.classList.contains("dragover__top")) {
|
||||
// newElement.parentElement.before(window.siyuan.dragElement.parentElement);
|
||||
// } else {
|
||||
// newElement.parentElement.after(window.siyuan.dragElement.parentElement);
|
||||
// }
|
||||
// const notebooks: string[] = [];
|
||||
// Array.from(this.element.children).forEach(item => {
|
||||
// notebooks.push(item.getAttribute("data-url"));
|
||||
// });
|
||||
// fetchPost("/api/notebook/changeSortNotebook", {
|
||||
// notebooks,
|
||||
// });
|
||||
// } else {
|
||||
// let hasMove = false;
|
||||
// const toDir = pathPosix().dirname(toPath);
|
||||
// if (fromType !== "navigation-root" && (toDir !== pathPosix().dirname(fromPath) || fromURL !== toURL)) {
|
||||
// await fetchPost("/api/filetree/moveDoc", {
|
||||
// fromNotebook: fromURL,
|
||||
// toNotebook: toURL,
|
||||
// fromPath,
|
||||
// toPath: toDir === "/" ? "/" : toDir + ".sy",
|
||||
// });
|
||||
// window.siyuan.dragElement.setAttribute("data-path", pathPosix().join(toDir, window.siyuan.dragElement.getAttribute("data-node-id") + ".sy"));
|
||||
// hasMove = true;
|
||||
// }
|
||||
// let nextULElement;
|
||||
// if (window.siyuan.dragElement.nextElementSibling && window.siyuan.dragElement.nextElementSibling.tagName === "UL") {
|
||||
// nextULElement = window.siyuan.dragElement.nextElementSibling;
|
||||
// }
|
||||
// if (newElement.classList.contains("dragover__bottom")) {
|
||||
// if (newElement.nextElementSibling && newElement.nextElementSibling.tagName === "UL") {
|
||||
// newElement.nextElementSibling.after(window.siyuan.dragElement);
|
||||
// } else {
|
||||
// newElement.after(window.siyuan.dragElement);
|
||||
// }
|
||||
// } else if (newElement.classList.contains("dragover__top")) {
|
||||
// newElement.before(window.siyuan.dragElement);
|
||||
// }
|
||||
// if (nextULElement) {
|
||||
// window.siyuan.dragElement.after(nextULElement);
|
||||
// }
|
||||
// const paths: string[] = [];
|
||||
// Array.from(newElement.parentElement.children).forEach(item => {
|
||||
// if (item.tagName === "LI") {
|
||||
// paths.push(item.getAttribute("data-path"));
|
||||
// }
|
||||
// });
|
||||
// fetchPost("/api/filetree/changeSort", {
|
||||
// paths,
|
||||
// notebook: toURL
|
||||
// }, () => {
|
||||
// if (hasMove) {
|
||||
// // 移动并排序后，会推送 moveDoc，但此时还没有 sort。 https://github.com/siyuan-note/siyuan/issues/4270
|
||||
// fetchPost("/api/filetree/listDocsByPath", {
|
||||
// notebook: toURL,
|
||||
// path: pathPosix().dirname(toPath),
|
||||
// sort: window.siyuan.config.fileTree.sort,
|
||||
// }, response => {
|
||||
// if (response.data.path === "/" && response.data.files.length === 0) {
|
||||
// showMessage(window.siyuan.languages.emptyContent);
|
||||
// return;
|
||||
// }
|
||||
// this.onLsHTML(response.data);
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
// newElement.classList.remove("dragover", "dragover__bottom", "dragover__top");
|
||||
});
|
||||
this.init();
|
||||
setPanelFocus(this.element.parentElement);
|
||||
|
|
|
|||
|
|
@ -713,8 +713,7 @@ export class MobileFiles extends Model {
|
|||
if (item.count && item.count > 0) {
|
||||
countHTML = `<span class="counter">${item.count}</span>`;
|
||||
}
|
||||
return `<li data-node-id="${item.id}" data-name="${Lute.EscapeHTMLStr(item.name)}" draggable="true"
|
||||
data-type="navigation-file"
|
||||
return `<li data-node-id="${item.id}" data-name="${Lute.EscapeHTMLStr(item.name)}" data-type="navigation-file"
|
||||
class="b3-list-item" data-path="${item.path}">
|
||||
<span style="padding-left: ${(item.path.split("/").length - 2) * 18 + 22}px" class="b3-list-item__toggle${item.subFileCount === 0 ? " fn__hidden" : ""}">
|
||||
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue