This commit is contained in:
Vanessa 2023-12-13 17:21:24 +08:00
parent 461f0bb347
commit 290f39aed4
4 changed files with 17 additions and 15 deletions

View file

@ -90,7 +90,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
srcIDs,
avID,
}]);
insertAttrViewBlockAnimation(blockElement, 1, undefined, avID);
insertAttrViewBlockAnimation(blockElement, srcIDs, undefined, avID);
event.preventDefault();
event.stopPropagation();
return true;
@ -160,7 +160,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
srcIDs,
avID,
}]);
insertAttrViewBlockAnimation(blockElement, 1, previousID, avID);
insertAttrViewBlockAnimation(blockElement, srcIDs, previousID, avID);
event.preventDefault();
event.stopPropagation();
return true;
@ -184,7 +184,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
srcIDs,
avID,
}]);
insertAttrViewBlockAnimation(blockElement, 1, previousID, avID);
insertAttrViewBlockAnimation(blockElement, srcIDs, previousID, avID);
} else {
const gutterRect = target.getBoundingClientRect();
avContextmenu(protyle, rowElement, {

View file

@ -69,7 +69,7 @@ export const updateHeader = (rowElement: HTMLElement) => {
avHeadElement.style.position = "sticky";
};
export const insertAttrViewBlockAnimation = (blockElement: Element, size: number, previousId: string, avId?: string) => {
export const insertAttrViewBlockAnimation = (blockElement: Element, srcIDs: string[], previousId: string, avId?: string,) => {
const previousElement = blockElement.querySelector(`.av__row[data-id="${previousId}"]`) || blockElement.querySelector(".av__row--header");
let colHTML = '<div style="width: 24px"></div>';
const pinIndex = previousElement.querySelectorAll(".av__colsticky .av__cell").length - 1;
@ -84,8 +84,8 @@ export const insertAttrViewBlockAnimation = (blockElement: Element, size: number
});
let html = "";
new Array(size).fill(1).forEach(() => {
html += `<div class="av__row" data-avid="${avId}" data-previous-id="${previousId}">
srcIDs.forEach((id) => {
html += `<div class="av__row" data-id="${id}" data-avid="${avId}" data-previous-id="${previousId}">
${colHTML}
</div>`;
});

View file

@ -931,7 +931,7 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => {
srcIDs: sourceIds,
avID,
}]);
insertAttrViewBlockAnimation(blockElement, sourceIds.length, previousID);
insertAttrViewBlockAnimation(blockElement, sourceIds, previousID);
}
}
} else if (sourceElements.length > 0) {
@ -990,7 +990,7 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => {
srcIDs: ids,
avID,
}]);
insertAttrViewBlockAnimation(blockElement, ids.length, previousID);
insertAttrViewBlockAnimation(blockElement, ids, previousID);
}
} else {
for (let i = 0; i < ids.length; i++) {

View file

@ -1499,14 +1499,16 @@ export class WYSIWYG {
const rowElement = hasClosestByClassName(event.target, "av__row");
if (rowElement && rowElement.dataset.id) {
const guttersElement = rowElement.querySelector(".av__gutters");
guttersElement.classList.remove("av__gutters--min");
let guttersLeft = rowElement.parentElement.parentElement.getBoundingClientRect().left - guttersElement.clientWidth;
const contentLeft = protyle.contentElement.getBoundingClientRect().left;
if (guttersLeft < contentLeft) {
guttersLeft = contentLeft;
guttersElement.classList.add("av__gutters--min");
if (guttersElement) {
guttersElement.classList.remove("av__gutters--min");
let guttersLeft = rowElement.parentElement.parentElement.getBoundingClientRect().left - guttersElement.clientWidth;
const contentLeft = protyle.contentElement.getBoundingClientRect().left;
if (guttersLeft < contentLeft) {
guttersLeft = contentLeft;
guttersElement.classList.add("av__gutters--min");
}
guttersElement.setAttribute("style", `left:${guttersLeft}px;top:${rowElement.getBoundingClientRect().top}px`);
}
guttersElement.setAttribute("style", `left:${guttersLeft}px;top:${rowElement.getBoundingClientRect().top}px`);
}
protyle.gutter.render(protyle, nodeElement, this.element);
}