mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-22 17:40:13 +01:00
🚨
This commit is contained in:
parent
a55b980512
commit
293638a813
4 changed files with 43 additions and 43 deletions
|
|
@ -133,7 +133,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
const imgElement = hasClosestByClassName(event.target, "av__cellassetimg") as HTMLImageElement
|
const imgElement = hasClosestByClassName(event.target, "av__cellassetimg") as HTMLImageElement;
|
||||||
if (imgElement) {
|
if (imgElement) {
|
||||||
previewImage(imgElement.src);
|
previewImage(imgElement.src);
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
|
||||||
|
|
@ -24,21 +24,21 @@ export const bindAssetEvent = (options: {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
uploadFiles(options.protyle, event.target.files, event.target, (res) => {
|
uploadFiles(options.protyle, event.target.files, event.target, (res) => {
|
||||||
const resData = JSON.parse(res)
|
const resData = JSON.parse(res);
|
||||||
const value: IAVCellAssetValue[] = []
|
const value: IAVCellAssetValue[] = [];
|
||||||
Object.keys(resData.data.succMap).forEach((key) => {
|
Object.keys(resData.data.succMap).forEach((key) => {
|
||||||
value.push({
|
value.push({
|
||||||
name: key,
|
name: key,
|
||||||
content: resData.data.succMap[key],
|
content: resData.data.succMap[key],
|
||||||
type: Constants.SIYUAN_ASSETS_IMAGE.includes(pathPosix().extname(resData.data.succMap[key]).toLowerCase()) ? "image" : "file"
|
type: Constants.SIYUAN_ASSETS_IMAGE.includes(pathPosix().extname(resData.data.succMap[key]).toLowerCase()) ? "image" : "file"
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
updateAssetCell({
|
updateAssetCell({
|
||||||
protyle: options.protyle,
|
protyle: options.protyle,
|
||||||
data: options.data,
|
data: options.data,
|
||||||
cellElements: options.cellElements,
|
cellElements: options.cellElements,
|
||||||
value
|
value
|
||||||
})
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
@ -46,39 +46,39 @@ export const bindAssetEvent = (options: {
|
||||||
export const getAssetHTML = (data: IAVTable, cellElements: HTMLElement[]) => {
|
export const getAssetHTML = (data: IAVTable, cellElements: HTMLElement[]) => {
|
||||||
const cellId = cellElements[0].dataset.id;
|
const cellId = cellElements[0].dataset.id;
|
||||||
const rowId = cellElements[0].parentElement.dataset.id;
|
const rowId = cellElements[0].parentElement.dataset.id;
|
||||||
let cellData: IAVCell
|
let cellData: IAVCell;
|
||||||
data.rows.find(row => {
|
data.rows.find(row => {
|
||||||
if (row.id === rowId) {
|
if (row.id === rowId) {
|
||||||
row.cells.find(cell => {
|
row.cells.find(cell => {
|
||||||
if (cell.id === cellId) {
|
if (cell.id === cellId) {
|
||||||
cellData = cell
|
cellData = cell;
|
||||||
return true
|
return true;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
return true
|
return true;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
let html = ""
|
let html = "";
|
||||||
if (cellData?.value?.mAsset) {
|
if (cellData?.value?.mAsset) {
|
||||||
cellData.value.mAsset.forEach(item => {
|
cellData.value.mAsset.forEach(item => {
|
||||||
if (!item.content) {
|
if (!item.content) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
let contentHTML
|
let contentHTML;
|
||||||
if (item.type === "image") {
|
if (item.type === "image") {
|
||||||
contentHTML = `<span class="fn__flex-1">
|
contentHTML = `<span class="fn__flex-1">
|
||||||
<img style="max-height: 180px;max-width: 360px;border-radius: var(--b3-border-radius);margin: 4px 0;" src="${item.content}"/>
|
<img style="max-height: 180px;max-width: 360px;border-radius: var(--b3-border-radius);margin: 4px 0;" src="${item.content}"/>
|
||||||
</span>`
|
</span>`;
|
||||||
} else {
|
} else {
|
||||||
contentHTML = `<span class="fn__ellipsis b3-menu__label" style="max-width: 360px">${item.name}</span>`
|
contentHTML = `<span class="fn__ellipsis b3-menu__label" style="max-width: 360px">${item.name}</span>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
html += `<button class="b3-menu__item" draggable="true" data-name="${item.name}" data-type="${item.type}" data-content="${item.content}">
|
html += `<button class="b3-menu__item" draggable="true" data-name="${item.name}" data-type="${item.type}" data-content="${item.content}">
|
||||||
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
|
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
|
||||||
${contentHTML}
|
${contentHTML}
|
||||||
<svg class="b3-menu__action" data-type="editAssetItem"><use xlink:href="#iconEdit"></use></svg>
|
<svg class="b3-menu__action" data-type="editAssetItem"><use xlink:href="#iconEdit"></use></svg>
|
||||||
</button>`
|
</button>`;
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
return `<div class="b3-menu__items">
|
return `<div class="b3-menu__items">
|
||||||
${html}
|
${html}
|
||||||
|
|
@ -130,14 +130,14 @@ const updateAssetCell = (options: {
|
||||||
if (options.removeContent) {
|
if (options.removeContent) {
|
||||||
cellData.value.mAsset.find((oldItem, index) => {
|
cellData.value.mAsset.find((oldItem, index) => {
|
||||||
if (oldItem.content === options.removeContent) {
|
if (oldItem.content === options.removeContent) {
|
||||||
cellData.value.mAsset.splice(index, 1)
|
cellData.value.mAsset.splice(index, 1);
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
options.value.forEach(newitem => {
|
options.value.forEach(newitem => {
|
||||||
if (!newitem.content) {
|
if (!newitem.content) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
const hasMatch = cellData.value.mAsset.find(oldItem => {
|
const hasMatch = cellData.value.mAsset.find(oldItem => {
|
||||||
if (oldItem.content === newitem.content) {
|
if (oldItem.content === newitem.content) {
|
||||||
|
|
@ -145,14 +145,14 @@ const updateAssetCell = (options: {
|
||||||
oldItem.type = newitem.type;
|
oldItem.type = newitem.type;
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
if (!hasMatch) {
|
if (!hasMatch) {
|
||||||
if (newitem.type === "file" && !newitem.name) {
|
if (newitem.type === "file" && !newitem.name) {
|
||||||
newitem.name = newitem.content
|
newitem.name = newitem.content;
|
||||||
}
|
}
|
||||||
cellData.value.mAsset.push(newitem);
|
cellData.value.mAsset.push(newitem);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
cellDoOperations.push({
|
cellDoOperations.push({
|
||||||
action: "updateAttrViewCell",
|
action: "updateAttrViewCell",
|
||||||
|
|
@ -178,20 +178,20 @@ const updateAssetCell = (options: {
|
||||||
const menuElement = document.querySelector(".av__panel > .b3-menu") as HTMLElement;
|
const menuElement = document.querySelector(".av__panel > .b3-menu") as HTMLElement;
|
||||||
if (menuElement) {
|
if (menuElement) {
|
||||||
menuElement.innerHTML = getAssetHTML(options.data.view, options.cellElements);
|
menuElement.innerHTML = getAssetHTML(options.data.view, options.cellElements);
|
||||||
bindAssetEvent({protyle: options.protyle, data: options.data, menuElement, cellElements: options.cellElements})
|
bindAssetEvent({protyle: options.protyle, data: options.data, menuElement, cellElements: options.cellElements});
|
||||||
const cellRect = options.protyle.wysiwyg.element.querySelector(`.av__cell[data-id="${options.cellElements[0].dataset.id}"]`).getBoundingClientRect();
|
const cellRect = options.protyle.wysiwyg.element.querySelector(`.av__cell[data-id="${options.cellElements[0].dataset.id}"]`).getBoundingClientRect();
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setPosition(menuElement, cellRect.left, cellRect.bottom, cellRect.height);
|
setPosition(menuElement, cellRect.left, cellRect.bottom, cellRect.height);
|
||||||
}, Constants.TIMEOUT_LOAD); // 等待图片加载
|
}, Constants.TIMEOUT_LOAD); // 等待图片加载
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
export const editAssetItem = (protyle: IProtyle, data: IAV, cellElements: HTMLElement[], target: HTMLElement) => {
|
export const editAssetItem = (protyle: IProtyle, data: IAV, cellElements: HTMLElement[], target: HTMLElement) => {
|
||||||
const linkAddress = target.dataset.content
|
const linkAddress = target.dataset.content;
|
||||||
const type = target.dataset.type as "image" | "file"
|
const type = target.dataset.type as "image" | "file";
|
||||||
const menu = new Menu("av-asset-edit", () => {
|
const menu = new Menu("av-asset-edit", () => {
|
||||||
if (!textElement || !textElement.value || textElement.value === target.dataset.name) {
|
if (!textElement || !textElement.value || textElement.value === target.dataset.name) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
updateAssetCell({
|
updateAssetCell({
|
||||||
protyle,
|
protyle,
|
||||||
|
|
@ -202,8 +202,8 @@ export const editAssetItem = (protyle: IProtyle, data: IAV, cellElements: HTMLEl
|
||||||
name: textElement.value,
|
name: textElement.value,
|
||||||
type
|
type
|
||||||
}]
|
}]
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
if (menu.isOpen) {
|
if (menu.isOpen) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -230,7 +230,7 @@ export const editAssetItem = (protyle: IProtyle, data: IAV, cellElements: HTMLEl
|
||||||
data,
|
data,
|
||||||
cellElements,
|
cellElements,
|
||||||
removeContent: linkAddress
|
removeContent: linkAddress
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
openMenu(protyle.app, linkAddress, false, true);
|
openMenu(protyle.app, linkAddress, false, true);
|
||||||
|
|
@ -239,7 +239,7 @@ export const editAssetItem = (protyle: IProtyle, data: IAV, cellElements: HTMLEl
|
||||||
window.siyuan.menus.menu.append(new MenuItem(exportAsset(linkAddress)).element);
|
window.siyuan.menus.menu.append(new MenuItem(exportAsset(linkAddress)).element);
|
||||||
}
|
}
|
||||||
/// #endif
|
/// #endif
|
||||||
const textElement = menu.element.querySelector("textarea")
|
const textElement = menu.element.querySelector("textarea");
|
||||||
if (textElement) {
|
if (textElement) {
|
||||||
textElement.value = target.dataset.name;
|
textElement.value = target.dataset.name;
|
||||||
}
|
}
|
||||||
|
|
@ -250,13 +250,13 @@ export const editAssetItem = (protyle: IProtyle, data: IAV, cellElements: HTMLEl
|
||||||
w: rect.width,
|
w: rect.width,
|
||||||
h: rect.height,
|
h: rect.height,
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
export const addAssetLink = (protyle: IProtyle, data: IAV, cellElements: HTMLElement[], target: HTMLElement) => {
|
export const addAssetLink = (protyle: IProtyle, data: IAV, cellElements: HTMLElement[], target: HTMLElement) => {
|
||||||
const menu = new Menu("av-asset-link", () => {
|
const menu = new Menu("av-asset-link", () => {
|
||||||
const textElements = menu.element.querySelectorAll("textarea")
|
const textElements = menu.element.querySelectorAll("textarea");
|
||||||
if (!textElements[0].value) {
|
if (!textElements[0].value) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
updateAssetCell({
|
updateAssetCell({
|
||||||
protyle,
|
protyle,
|
||||||
|
|
@ -267,8 +267,8 @@ export const addAssetLink = (protyle: IProtyle, data: IAV, cellElements: HTMLEle
|
||||||
name: textElements[1].value,
|
name: textElements[1].value,
|
||||||
content: textElements[0].value,
|
content: textElements[0].value,
|
||||||
}]
|
}]
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
if (menu.isOpen) {
|
if (menu.isOpen) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -287,4 +287,4 @@ export const addAssetLink = (protyle: IProtyle, data: IAV, cellElements: HTMLEle
|
||||||
w: rect.width,
|
w: rect.width,
|
||||||
h: rect.height,
|
h: rect.height,
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
|
||||||
|
|
@ -639,12 +639,12 @@ export const openMenuPanel = (options: {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
} else if (type === "addAssetLink") {
|
} else if (type === "addAssetLink") {
|
||||||
addAssetLink(options.protyle, data, options.cellElements, target)
|
addAssetLink(options.protyle, data, options.cellElements, target);
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
} else if (type === "editAssetItem") {
|
} else if (type === "editAssetItem") {
|
||||||
editAssetItem(options.protyle, data, options.cellElements, target.parentElement)
|
editAssetItem(options.protyle, data, options.cellElements, target.parentElement);
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
|
|
|
||||||
|
|
@ -1268,7 +1268,7 @@ const inputEvent = (element: Element, config: ISearchOption, inputTimeout: numbe
|
||||||
searchElement: searchInputElement,
|
searchElement: searchInputElement,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
const searchResultElement = element.querySelector("#searchResult")
|
const searchResultElement = element.querySelector("#searchResult");
|
||||||
if (inputValue === "" && (!config.idPath || config.idPath.length === 0)) {
|
if (inputValue === "" && (!config.idPath || config.idPath.length === 0)) {
|
||||||
fetchPost("/api/block/getRecentUpdatedBlocks", {}, (response) => {
|
fetchPost("/api/block/getRecentUpdatedBlocks", {}, (response) => {
|
||||||
onSearch(response.data, edit, element, config);
|
onSearch(response.data, edit, element, config);
|
||||||
|
|
@ -1304,7 +1304,7 @@ const inputEvent = (element: Element, config: ISearchOption, inputTimeout: numbe
|
||||||
searchResultElement.innerHTML = `${config.page}/${response.data.pageCount || 1}<span class="fn__space"></span>
|
searchResultElement.innerHTML = `${config.page}/${response.data.pageCount || 1}<span class="fn__space"></span>
|
||||||
<span class="ft__on-surface">${window.siyuan.languages.findInDoc.replace("${x}", response.data.matchedRootCount).replace("${y}", response.data.matchedBlockCount)}</span>`;
|
<span class="ft__on-surface">${window.siyuan.languages.findInDoc.replace("${x}", response.data.matchedRootCount).replace("${y}", response.data.matchedBlockCount)}</span>`;
|
||||||
loadingElement.classList.add("fn__none");
|
loadingElement.classList.add("fn__none");
|
||||||
searchResultElement.setAttribute("data-pagecount", response.data.pageCount || 1)
|
searchResultElement.setAttribute("data-pagecount", response.data.pageCount || 1);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}, Constants.TIMEOUT_INPUT);
|
}, Constants.TIMEOUT_INPUT);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue