mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-22 17:40:13 +01:00
🚨
This commit is contained in:
parent
faefdbaf40
commit
dbe4eb7d4d
4 changed files with 22 additions and 22 deletions
|
|
@ -64,20 +64,20 @@ export const duplicateCol = (protyle: IProtyle, type: TAVCol, avID: string, colI
|
||||||
avID,
|
avID,
|
||||||
}]);
|
}]);
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
export const getEditHTML = (options: {
|
export const getEditHTML = (options: {
|
||||||
protyle: IProtyle,
|
protyle: IProtyle,
|
||||||
colId: string,
|
colId: string,
|
||||||
data: IAV
|
data: IAV
|
||||||
}) => {
|
}) => {
|
||||||
let colData: IAVColumn
|
let colData: IAVColumn;
|
||||||
options.data.view.columns.find((item) => {
|
options.data.view.columns.find((item) => {
|
||||||
if (item.id === options.colId) {
|
if (item.id === options.colId) {
|
||||||
colData = item;
|
colData = item;
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
let html = `<button class="b3-menu__item" data-type="nobg" data-col-id="${options.colId}">
|
let html = `<button class="b3-menu__item" data-type="nobg" data-col-id="${options.colId}">
|
||||||
<span class="block__icon" style="padding: 8px;margin-left: -4px;" data-type="goProperties">
|
<span class="block__icon" style="padding: 8px;margin-left: -4px;" data-type="goProperties">
|
||||||
<svg><use xlink:href="#iconLeft"></use></svg>
|
<svg><use xlink:href="#iconLeft"></use></svg>
|
||||||
|
|
@ -95,7 +95,7 @@ export const getEditHTML = (options: {
|
||||||
<button class="b3-menu__item">
|
<button class="b3-menu__item">
|
||||||
<svg class="b3-menu__icon" style=""><use xlink:href="#iconAdd"></use></svg>
|
<svg class="b3-menu__icon" style=""><use xlink:href="#iconAdd"></use></svg>
|
||||||
<span class="b3-menu__label"><input data-type="addOption" style="margin: 4px 0" class="b3-text-field" type="text" placeholder="Enter ${window.siyuan.languages.addAttr}"></span>
|
<span class="b3-menu__label"><input data-type="addOption" style="margin: 4px 0" class="b3-text-field" type="text" placeholder="Enter ${window.siyuan.languages.addAttr}"></span>
|
||||||
</button>`
|
</button>`;
|
||||||
colData.options.forEach(item => {
|
colData.options.forEach(item => {
|
||||||
html += `<button class="b3-menu__item${html ? "" : " b3-menu__item--current"}" draggable="true" data-name="${item.name}" data-color="${item.color}">
|
html += `<button class="b3-menu__item${html ? "" : " b3-menu__item--current"}" draggable="true" data-name="${item.name}" data-color="${item.color}">
|
||||||
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
|
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
|
||||||
|
|
@ -129,7 +129,7 @@ export const bindEditEvent = (options: { protyle: IProtyle, data: IAV, menuEleme
|
||||||
const colId = options.menuElement.firstElementChild.getAttribute("data-col-id");
|
const colId = options.menuElement.firstElementChild.getAttribute("data-col-id");
|
||||||
const colData = options.data.view.columns.find((item: IAVColumn) => item.id === colId);
|
const colData = options.data.view.columns.find((item: IAVColumn) => item.id === colId);
|
||||||
const nameElement = options.menuElement.querySelector('[data-type="name"]') as HTMLInputElement;
|
const nameElement = options.menuElement.querySelector('[data-type="name"]') as HTMLInputElement;
|
||||||
nameElement.addEventListener("blur", (event) => {
|
nameElement.addEventListener("blur", () => {
|
||||||
const newValue = nameElement.value;
|
const newValue = nameElement.value;
|
||||||
if (newValue === colData.name) {
|
if (newValue === colData.name) {
|
||||||
return;
|
return;
|
||||||
|
|
@ -151,7 +151,7 @@ export const bindEditEvent = (options: { protyle: IProtyle, data: IAV, menuEleme
|
||||||
});
|
});
|
||||||
nameElement.addEventListener("keydown", (event: KeyboardEvent) => {
|
nameElement.addEventListener("keydown", (event: KeyboardEvent) => {
|
||||||
if (event.isComposing) {
|
if (event.isComposing) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
if (event.key === "Escape") {
|
if (event.key === "Escape") {
|
||||||
options.menuElement.parentElement.remove();
|
options.menuElement.parentElement.remove();
|
||||||
|
|
@ -196,7 +196,7 @@ export const bindEditEvent = (options: { protyle: IProtyle, data: IAV, menuEleme
|
||||||
(options.menuElement.querySelector('[data-type="addOption"]') as HTMLInputElement).focus();
|
(options.menuElement.querySelector('[data-type="addOption"]') as HTMLInputElement).focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
export const getColIconByType = (type: TAVCol) => {
|
export const getColIconByType = (type: TAVCol) => {
|
||||||
switch (type) {
|
switch (type) {
|
||||||
|
|
|
||||||
|
|
@ -57,7 +57,7 @@ export const openMenuPanel = (options: {
|
||||||
if (options.type === "sorts") {
|
if (options.type === "sorts") {
|
||||||
bindSortsEvent(options.protyle, menuElement, data);
|
bindSortsEvent(options.protyle, menuElement, data);
|
||||||
} else if (options.type === "edit") {
|
} else if (options.type === "edit") {
|
||||||
bindEditEvent({protyle: options.protyle, data, menuElement})
|
bindEditEvent({protyle: options.protyle, data, menuElement});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
avPanelElement.addEventListener("dragstart", (event) => {
|
avPanelElement.addEventListener("dragstart", (event) => {
|
||||||
|
|
@ -127,7 +127,7 @@ export const openMenuPanel = (options: {
|
||||||
data,
|
data,
|
||||||
colId
|
colId
|
||||||
});
|
});
|
||||||
bindEditEvent({protyle: options.protyle, data, menuElement})
|
bindEditEvent({protyle: options.protyle, data, menuElement});
|
||||||
}
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -479,7 +479,7 @@ export const openMenuPanel = (options: {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
} else if (type === "hideCol") {
|
} else if (type === "hideCol") {
|
||||||
const isEdit = menuElement.querySelector('[data-type="goProperties"]')
|
const isEdit = menuElement.querySelector('[data-type="goProperties"]');
|
||||||
const colId = isEdit ? menuElement.firstElementChild.getAttribute("data-col-id") : target.parentElement.getAttribute("data-id");
|
const colId = isEdit ? menuElement.firstElementChild.getAttribute("data-col-id") : target.parentElement.getAttribute("data-id");
|
||||||
transaction(options.protyle, [{
|
transaction(options.protyle, [{
|
||||||
action: "setAttrViewColHidden",
|
action: "setAttrViewColHidden",
|
||||||
|
|
@ -507,7 +507,7 @@ export const openMenuPanel = (options: {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
} else if (type === "showCol") {
|
} else if (type === "showCol") {
|
||||||
const isEdit = menuElement.querySelector('[data-type="goProperties"]')
|
const isEdit = menuElement.querySelector('[data-type="goProperties"]');
|
||||||
const colId = isEdit ? menuElement.firstElementChild.getAttribute("data-col-id") : target.parentElement.getAttribute("data-id");
|
const colId = isEdit ? menuElement.firstElementChild.getAttribute("data-col-id") : target.parentElement.getAttribute("data-id");
|
||||||
transaction(options.protyle, [{
|
transaction(options.protyle, [{
|
||||||
action: "setAttrViewColHidden",
|
action: "setAttrViewColHidden",
|
||||||
|
|
@ -535,15 +535,15 @@ export const openMenuPanel = (options: {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
} else if (type === "duplicateCol") {
|
} else if (type === "duplicateCol") {
|
||||||
const colId = menuElement.firstElementChild.getAttribute("data-col-id")
|
const colId = menuElement.firstElementChild.getAttribute("data-col-id");
|
||||||
const colData = data.view.columns.find((item: IAVColumn) => item.id === colId)
|
const colData = data.view.columns.find((item: IAVColumn) => item.id === colId);
|
||||||
duplicateCol(options.protyle, colData.type, avID, colId, colData.name);
|
duplicateCol(options.protyle, colData.type, avID, colId, colData.name);
|
||||||
avPanelElement.remove();
|
avPanelElement.remove();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
break;
|
break;
|
||||||
} else if (type === "removeCol") {
|
} else if (type === "removeCol") {
|
||||||
const colId = menuElement.firstElementChild.getAttribute("data-col-id")
|
const colId = menuElement.firstElementChild.getAttribute("data-col-id");
|
||||||
const colData = data.view.columns.find((item: IAVColumn) => item.id === colId)
|
const colData = data.view.columns.find((item: IAVColumn) => item.id === colId);
|
||||||
transaction(options.protyle, [{
|
transaction(options.protyle, [{
|
||||||
action: "removeAttrViewCol",
|
action: "removeAttrViewCol",
|
||||||
id: colId,
|
id: colId,
|
||||||
|
|
|
||||||
|
|
@ -62,7 +62,7 @@ style="width: ${column.width || "200px"}">${getCalcValue(column) || '<svg><use x
|
||||||
if (cell.valueType === "text") {
|
if (cell.valueType === "text") {
|
||||||
text = `<span class="av__celltext">${cell.value?.text.content || ""}</span>`;
|
text = `<span class="av__celltext">${cell.value?.text.content || ""}</span>`;
|
||||||
} else if (cell.valueType === "block") {
|
} else if (cell.valueType === "block") {
|
||||||
text = `<span class="av__celltext">${cell.value?.block.content || ""}</span>`
|
text = `<span class="av__celltext">${cell.value?.block.content || ""}</span>`;
|
||||||
if (cell.value?.block.id) {
|
if (cell.value?.block.id) {
|
||||||
text += `<span class="b3-chip b3-chip--small" data-type="block-ref" data-id="${cell.value.block.id}" data-subtype="s">${window.siyuan.languages.openBy}</span>`;
|
text += `<span class="b3-chip b3-chip--small" data-type="block-ref" data-id="${cell.value.block.id}" data-subtype="s">${window.siyuan.languages.openBy}</span>`;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -140,7 +140,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
||||||
});
|
});
|
||||||
if (!cellElements) {
|
if (!cellElements) {
|
||||||
menuElement.innerHTML = getEditHTML({protyle, data, colId});
|
menuElement.innerHTML = getEditHTML({protyle, data, colId});
|
||||||
bindEditEvent({protyle, data, menuElement})
|
bindEditEvent({protyle, data, menuElement});
|
||||||
} else {
|
} else {
|
||||||
cellElements.forEach((cellElement: HTMLMediaElement) => {
|
cellElements.forEach((cellElement: HTMLMediaElement) => {
|
||||||
data.view.rows.find(row => {
|
data.view.rows.find(row => {
|
||||||
|
|
@ -159,7 +159,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})
|
});
|
||||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||||
bindSelectEvent(protyle, data, menuElement, cellElements);
|
bindSelectEvent(protyle, data, menuElement, cellElements);
|
||||||
}
|
}
|
||||||
|
|
@ -203,7 +203,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
||||||
});
|
});
|
||||||
if (!cellElements) {
|
if (!cellElements) {
|
||||||
menuElement.innerHTML = getEditHTML({protyle, data, colId});
|
menuElement.innerHTML = getEditHTML({protyle, data, colId});
|
||||||
bindEditEvent({protyle, data, menuElement})
|
bindEditEvent({protyle, data, menuElement});
|
||||||
} else {
|
} else {
|
||||||
cellElements.forEach((cellElement: HTMLElement) => {
|
cellElements.forEach((cellElement: HTMLElement) => {
|
||||||
data.view.rows.find(row => {
|
data.view.rows.find(row => {
|
||||||
|
|
@ -222,7 +222,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})
|
});
|
||||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||||
bindSelectEvent(protyle, data, menuElement, cellElements);
|
bindSelectEvent(protyle, data, menuElement, cellElements);
|
||||||
}
|
}
|
||||||
|
|
@ -277,7 +277,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
||||||
});
|
});
|
||||||
if (!cellElements) {
|
if (!cellElements) {
|
||||||
menuElement.innerHTML = getEditHTML({protyle, data, colId});
|
menuElement.innerHTML = getEditHTML({protyle, data, colId});
|
||||||
bindEditEvent({protyle, data, menuElement})
|
bindEditEvent({protyle, data, menuElement});
|
||||||
} else {
|
} else {
|
||||||
cellElements.forEach((cellElement: HTMLElement) => {
|
cellElements.forEach((cellElement: HTMLElement) => {
|
||||||
data.view.rows.find(row => {
|
data.view.rows.find(row => {
|
||||||
|
|
@ -297,7 +297,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})
|
});
|
||||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||||
bindSelectEvent(protyle, data, menuElement, cellElements);
|
bindSelectEvent(protyle, data, menuElement, cellElements);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue