🚨

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 {

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 = `<textarea ${style} class="b3-text-field">${cellElement.textContent}</textarea>`;
@@ -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);

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) {

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,

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)
             });
-        let dragoverElement: HTMLElement
+            menuElement.innerHTML = getPropertiesHTML(data);
+        });
+        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;
                 }

app/src/protyle/render/av/render.ts

@@ -65,7 +65,7 @@ ${column.wrap ? "" : "white-space: nowrap;"}">
                             if (cell.value?.select.content) {
                                 text = `<span class="av__celltext"><span class="b3-chip b3-chip--middle" style="background-color:var(--b3-font-background${cell.value.select.color});color:var(--b3-font-color${cell.value.select.color})">${cell.value.select.content}</span></span>`;
                             } else {
-                                text = `<span class="av__celltext"></span>`;
+                                text = "<span class=\"av__celltext\"></span>";
                             }
                         } else if (cell.valueType === "mSelect") {
                             text = `<span class="av__celltext">${cell.value?.mSelect.content || ""}</span>`;

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 }[
     </span>
 </div>
 <span class="b3-menu__accelerator">Enter</span>
-</button>`
+</button>`;
     }
     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: `<input class="b3-text-field" style="margin: 4px 0" value="${name}">`
-    })
+    });
     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 += `<div class="b3-chip" style="background-color:var(--b3-font-background${colorIndex});color:var(--b3-font-color${colorIndex})">${value}<svg class="b3-chip__close" data-type="remove-option"><use xlink:href="#iconCloseRound"></use></svg></div>`
-                        })
+                            });
+                            selectedHTML += `<div class="b3-chip" style="background-color:var(--b3-font-background${colorIndex});color:var(--b3-font-color${colorIndex})">${value}<svg class="b3-chip__close" data-type="remove-option"><use xlink:href="#iconCloseRound"></use></svg></div>`;
+                        });
                     } else {
-                        selectedHTML += `<div class="b3-chip" style="background-color:var(--b3-font-background${cell.value.select.color})";color:var(--b3-font-color${cell.value.select.color})>${options.cellElement.textContent.trim()}<svg class="b3-chip__close" data-type="remove-option"><use xlink:href="#iconCloseRound"></use></svg></div>`
+                        selectedHTML += `<div class="b3-chip" style="background-color:var(--b3-font-background${cell.value.select.color})";color:var(--b3-font-color${cell.value.select.color})>${options.cellElement.textContent.trim()}<svg class="b3-chip__close" data-type="remove-option"><use xlink:href="#iconCloseRound"></use></svg></div>`;
                     }
                     return true;
                 }
-            })
-            return true
+            });
+            return true;
         }
-    })
+    });
     return `<div class="b3-chips">
     ${selectedHTML}
     <input class="b3-text-field fn__block">
 </div>
-<div>${filterSelectHTML("", colData.options)}</div>`
-}
+<div>${filterSelectHTML("", colData.options)}</div>`;
+};