diff --git a/app/src/protyle/index.ts b/app/src/protyle/index.ts index 335920a99..c94fac404 100644 --- a/app/src/protyle/index.ts +++ b/app/src/protyle/index.ts @@ -30,7 +30,6 @@ import {resize} from "./util/resize"; import {getDocByScroll} from "./scroll/saveScroll"; import {App} from "../index"; import {insertHTML} from "./util/insertHTML"; -import {showColMenu} from "./render/av/col"; import {avRender} from "./render/av/render"; export class Protyle { diff --git a/app/src/protyle/render/av/cell.ts b/app/src/protyle/render/av/cell.ts index 2f6966b4b..1f1bb07a8 100644 --- a/app/src/protyle/render/av/cell.ts +++ b/app/src/protyle/render/av/cell.ts @@ -6,7 +6,7 @@ export const popTextCell = (protyle: IProtyle, cellElement: HTMLElement) => { const type = cellElement.parentElement.parentElement.firstElementChild.querySelector(`[data-col-id="${cellElement.getAttribute("data-col-id")}"]`).getAttribute("data-dtype") as TAVCol; const cellRect = cellElement.getBoundingClientRect(); let html = ""; - const style = `style="position:absolute;left: ${cellRect.left}px;top: ${cellRect.top}px;width:${Math.max(cellRect.width, 200)}px;height: ${cellRect.height}px"` + const style = `style="position:absolute;left: ${cellRect.left}px;top: ${cellRect.top}px;width:${Math.max(cellRect.width, 200)}px;height: ${cellRect.height}px"`; const blockElement = hasClosestBlock(cellElement); if (type === "block" || type === "text") { html = ``; @@ -58,8 +58,8 @@ const updateCellValue = (protyle: IProtyle, cellElement: HTMLElement, type: TAVC const cellId = cellElement.getAttribute("data-id"); const avId = blockElement.getAttribute("data-av-id"); const rowId = rowElement.getAttribute("data-id"); - let inputValue: string | number = (avMaskElement.querySelector(".b3-text-field") as HTMLInputElement).value - let oldValue: string | number = cellElement.textContent.trim() + let inputValue: string | number = (avMaskElement.querySelector(".b3-text-field") as HTMLInputElement).value; + let oldValue: string | number = cellElement.textContent.trim(); if (type === "number") { inputValue = parseFloat(inputValue); oldValue = parseFloat(oldValue); diff --git a/app/src/protyle/render/av/col.ts b/app/src/protyle/render/av/col.ts index fb8b4fc14..a4ea4593f 100644 --- a/app/src/protyle/render/av/col.ts +++ b/app/src/protyle/render/av/col.ts @@ -2,7 +2,7 @@ import {hasClosestBlock} from "../../util/hasClosest"; import {Menu} from "../../../plugin/Menu"; import {transaction} from "../../wysiwyg/transaction"; import {fetchPost} from "../../../util/fetch"; -import {setFilter} from "./openMenuPanel"; +import {setFilter} from "./filter"; export const getColIconByType = (type: TAVCol) => { switch (type) { diff --git a/app/src/protyle/render/av/filter.ts b/app/src/protyle/render/av/filter.ts index 754a40761..4105fa6f3 100644 --- a/app/src/protyle/render/av/filter.ts +++ b/app/src/protyle/render/av/filter.ts @@ -22,14 +22,14 @@ export const setFilter = (options: { cellValue = { content: parseFloat(textElement.value), isNotEmpty: true - } + }; } else { - cellValue = {} + cellValue = {}; } } else { cellValue = { content: textElement.value - } + }; } filter.value[colType] = cellValue; filter.operator = (window.siyuan.menus.menu.element.querySelector(".b3-select") as HTMLSelectElement).value as TAVFilterOperator; @@ -128,9 +128,9 @@ export const addFilter = (options: { icon: getColIconByType(column.type), click: () => { const oldFilters = Object.assign([], options.data.filters); - let cellValue = {} + let cellValue = {}; if (column.type !== "number") { - cellValue = {content: ""} + cellValue = {content: ""}; } options.data.filters.push({ column: column.id, diff --git a/app/src/protyle/render/av/openMenuPanel.ts b/app/src/protyle/render/av/openMenuPanel.ts index b0ee488a4..66b18a45d 100644 --- a/app/src/protyle/render/av/openMenuPanel.ts +++ b/app/src/protyle/render/av/openMenuPanel.ts @@ -5,7 +5,7 @@ import {getColIconByType} from "./col"; import {setPosition} from "../../../util/setPosition"; import {hasClosestByAttribute} from "../../util/hasClosest"; import {bindSelectEvent, getSelectHTML, setSelectOption} from "./select"; -import {addFilter, getFiltersHTML} from "./filter"; +import {addFilter, getFiltersHTML, setFilter} from "./filter"; import {addSort, bindSortsEvent, getSortsHTML} from "./sort"; export const openMenuPanel = (protyle: IProtyle, @@ -80,17 +80,17 @@ export const openMenuPanel = (protyle: IProtyle, } const sourceId = sourceElement.dataset.id; const targetId = targetElement.dataset.id; - const isTop = targetElement.classList.contains("dragover__top") + const isTop = targetElement.classList.contains("dragover__top"); if (type !== "columns") { - const changeData = (type === "sorts" ? data.sorts : data.filters) as IAVFilter[] + const changeData = (type === "sorts" ? data.sorts : data.filters) as IAVFilter[]; const oldData = Object.assign([], changeData); - let targetFilter: IAVFilter + let targetFilter: IAVFilter; changeData.find((filter, index: number) => { if (filter.column === sourceId) { targetFilter = changeData.splice(index, 1)[0]; return true; } - }) + }); changeData.find((filter, index: number) => { if (filter.column === targetId) { if (isTop) { @@ -100,7 +100,7 @@ export const openMenuPanel = (protyle: IProtyle, } return true; } - }) + }); transaction(protyle, [{ action: "setAttrView", @@ -132,13 +132,13 @@ export const openMenuPanel = (protyle: IProtyle, previousID: sourceElement.previousElementSibling?.getAttribute("data-id") || "", id: sourceId, }]); - let column: IAVColumn + let column: IAVColumn; data.columns.find((item, index: number) => { if (item.id === sourceId) { column = data.columns.splice(index, 1)[0]; return true; } - }) + }); data.columns.find((item, index: number) => { if (item.id === targetId) { if (isTop) { @@ -148,10 +148,10 @@ export const openMenuPanel = (protyle: IProtyle, } return true; } - }) - menuElement.innerHTML = getPropertiesHTML(data) + }); + menuElement.innerHTML = getPropertiesHTML(data); }); - let dragoverElement: HTMLElement + let dragoverElement: HTMLElement; avPanelElement.addEventListener("dragover", (event: DragEvent) => { const target = event.target as HTMLElement; const targetElement = hasClosestByAttribute(target, "data-id", null); @@ -177,9 +177,9 @@ export const openMenuPanel = (protyle: IProtyle, targetElement.classList.remove("dragover__top", "dragover__bottom"); } }); - avPanelElement.addEventListener("dragend", (event) => { + avPanelElement.addEventListener("dragend", () => { if (window.siyuan.dragElement) { - window.siyuan.dragElement.style.opacity = "" + window.siyuan.dragElement.style.opacity = ""; window.siyuan.dragElement = undefined; } }); @@ -432,7 +432,7 @@ export const openMenuPanel = (protyle: IProtyle, event.stopPropagation(); break; } else if (type === "editOption") { - setSelectOption(protyle, data, options, target) + setSelectOption(protyle, data, options, target); event.stopPropagation(); break; } diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts index d09ef8770..a5274e4b0 100644 --- a/app/src/protyle/render/av/render.ts +++ b/app/src/protyle/render/av/render.ts @@ -65,7 +65,7 @@ ${column.wrap ? "" : "white-space: nowrap;"}"> if (cell.value?.select.content) { text = `${cell.value.select.content}`; } else { - text = ``; + text = ""; } } else if (cell.valueType === "mSelect") { text = `${cell.value?.mSelect.content || ""}`; diff --git a/app/src/protyle/render/av/select.ts b/app/src/protyle/render/av/select.ts index a64d487d4..1d2334ced 100644 --- a/app/src/protyle/render/av/select.ts +++ b/app/src/protyle/render/av/select.ts @@ -26,7 +26,7 @@ const filterSelectHTML = (key: string, options: { name: string, color: string }[ if (key === item.name) { hasMatch = true; } - }) + }); } if (!hasMatch && key) { const colorIndex = (options?.length || 0) % 13 + 1; @@ -37,10 +37,10 @@ const filterSelectHTML = (key: string, options: { name: string, color: string }[ -` +`; } return html; -} +}; export const setSelectOption = (protyle: IProtyle, data: IAV, options: { cellElement: HTMLElement; @@ -64,33 +64,33 @@ export const setSelectOption = (protyle: IProtyle, data: IAV, options: { newName: name }, }]); - }) + }); if (menu.isOpen) { return; } const menuElement = hasClosestByClassName(target, "b3-menu"); if (!menuElement) { - return + return; } const color = target.parentElement.dataset.color; const colId = options.cellElement.dataset.colId; menu.addItem({ iconHTML: "", label: `` - }) + }); menu.addItem({ label: window.siyuan.languages.delete, icon: "iconTrashcan", click() { confirmDialog(window.siyuan.languages.deleteOpConfirm, window.siyuan.languages.confirmDelete, () => { - let colOptions: { name: string, color: string }[] = [] + let colOptions: { name: string, color: string }[] = []; data.columns.find(column => { if (column.id === colId) { colOptions = column.options; return true; } - }) - const newName = target.parentElement.dataset.name + }); + const newName = target.parentElement.dataset.name; transaction(protyle, [{ action: "removeAttrViewColOption", id: colId, @@ -107,15 +107,15 @@ export const setSelectOption = (protyle: IProtyle, data: IAV, options: { colOptions.splice(index, 1); return true; } - }) + }); menuElement.innerHTML = getSelectHTML(data, options); const cellRect = options.cellElement.getBoundingClientRect(); setPosition(menuElement, cellRect.left, cellRect.bottom, cellRect.height); bindSelectEvent(protyle, data, menuElement, options); - }) + }); } - }) - menu.addSeparator() + }); + menu.addSeparator(); Array.from(Array(13).keys()).forEach(index => { menu.addItem({ current: parseInt(color) === index + 1, @@ -140,87 +140,87 @@ export const setSelectOption = (protyle: IProtyle, data: IAV, options: { }, }]); } - }) - }) + }); + }); const rect = target.getBoundingClientRect(); menu.open({ x: rect.left, y: rect.bottom, h: rect.height, - }) + }); const inputElement = window.siyuan.menus.menu.element.querySelector("input"); inputElement.select(); -} +}; export const bindSelectEvent = (protyle: IProtyle, data: IAV, menuElement: HTMLElement, options: { cellElement: HTMLElement }) => { const inputElement = menuElement.querySelector("input"); - const rowId = options.cellElement.parentElement.dataset.id + const rowId = options.cellElement.parentElement.dataset.id; const colId = options.cellElement.dataset.colId; - const cellId = options.cellElement.dataset.id + const cellId = options.cellElement.dataset.id; let colData: IAVColumn; data.columns.find((item: IAVColumn) => { if (item.id === colId) { colData = item; return; } - }) + }); if (!colData.options) { colData.options = []; } - let cellData: IAVCell + let cellData: IAVCell; data.rows.find(row => { if (row.id === rowId) { row.cells.find(cell => { if (cell.id === cellId) { - cellData = cell + cellData = cell; return true; } - }) + }); return true; } - }) + }); inputElement.addEventListener("input", (event: InputEvent) => { if (event.isComposing) { - return + return; } menuElement.lastElementChild.innerHTML = filterSelectHTML(inputElement.value, colData.options); - }) + }); inputElement.addEventListener("compositionend", (event: InputEvent) => { if (event.isComposing) { - return + return; } menuElement.lastElementChild.innerHTML = filterSelectHTML(inputElement.value, colData.options); - }) + }); inputElement.addEventListener("keydown", (event: KeyboardEvent) => { if (event.isComposing) { - return + return; } let currentElement = upDownHint(menuElement.lastElementChild, event, "b3-menu__item--current"); if (event.key === "Enter") { if (!currentElement) { currentElement = menuElement.querySelector(".b3-menu__item--current"); } - let oldValue + let oldValue; if (colData.type !== "select") { oldValue = Object.assign([], cellData.value.mSelect.content); cellData.value.mSelect.content.push({ color: currentElement.dataset.color, content: currentElement.dataset.name - }) + }); } else { oldValue = Object.assign({}, cellData.value.select); cellData.value.select = { color: currentElement.dataset.color, content: currentElement.dataset.name - } + }; } if (currentElement.querySelector(".b3-menu__accelerator")) { colData.options.push({ color: currentElement.dataset.color, name: currentElement.dataset.name - }) + }); transaction(protyle, [{ action: "updateAttrViewColOptions", id: colId, @@ -261,44 +261,44 @@ export const bindSelectEvent = (protyle: IProtyle, data: IAV, menuElement: HTMLE menuElement.parentElement.remove(); } } - }) -} + }); +}; export const getSelectHTML = (data: IAV, options: { cellElement: HTMLElement }) => { - const cellId = options.cellElement.dataset.id - const colId = options.cellElement.dataset["colId"] + const cellId = options.cellElement.dataset.id; + const colId = options.cellElement.dataset["colId"]; const colData = data.columns.find(item => { if (item.id === colId) { - return item + return item; } - }) - let selectedHTML = "" + }); + let selectedHTML = ""; data.rows.find(row => { if (options.cellElement.parentElement.dataset.id === row.id) { row.cells.find(cell => { if (cell.id === cellId && cell.value) { if (colData.type === "mSelect") { cell.value.mSelect?.content.forEach((value: string) => { - let colorIndex = "" + let colorIndex = ""; colData.options.find(option => { if (option.name === value) { - colorIndex = option.color + colorIndex = option.color; } - }) - selectedHTML += `