🎨 https://github.com/siyuan-note/siyuan/pull/15627

app/src/card/newCardTab.ts

@@ -1,6 +1,6 @@
 import {Tab} from "../layout/Tab";
 import {Custom} from "../layout/dock/Custom";
-import {bindCardEvent, genCardHTML, initCardComponent} from "./openCard";
+import {bindCardEvent, genCardHTML} from "./openCard";
 import {fetchPost} from "../util/fetch";
 import {Protyle} from "../protyle";
 import {setPanelFocus} from "../layout/util";
@@ -19,57 +19,6 @@ export const newCardModel = (options: {
     }
 }) => {
     let editor: Protyle;
-    
-    const fetchCardsData = async (): Promise<ICardData> => {
-        return new Promise((resolve) => {
-            fetchPost(options.data.cardType === "all" ? "/api/riff/getRiffDueCards" :
-                (options.data.cardType === "doc" ? "/api/riff/getTreeRiffDueCards" : "/api/riff/getNotebookRiffDueCards"), {
-                rootID: options.data.id,
-                deckID: options.data.id,
-                notebook: options.data.id,
-            }, async (response) => {
-                let cardsData: ICardData = response.data;
-                for (let i = 0; i < options.app.plugins.length; i++) {
-                    cardsData = await options.app.plugins[i].updateCards(response.data);
-                }
-                resolve(cardsData);
-            });
-        });
-    };
-
-    const renderCardsAndBindEvents = async (element: HTMLElement, data: any, cardsData: ICardData, index?: number, isUpdate?: boolean) => {
-        customObj.editors.forEach(editor => {
-            editor.destroy();
-        });
-        customObj.editors.length = 0;
-
-        element.innerHTML = genCardHTML({
-            id: data.id,
-            cardType: data.cardType,
-            cardsData,
-            isTab: true,
-        });
-
-        const cardOptions = {
-            app: options.app,
-            element: element,
-            id: data.id,
-            title: data.title,
-            cardType: data.cardType,
-            cardsData,
-            index,
-        };
-
-        if (isUpdate) {
-            const initResult = await initCardComponent(cardOptions);
-            editor = initResult.editor;
-        } else {
-            editor = await bindCardEvent(cardOptions);
-        }
-
-        customObj.editors.push(editor);
-    };
-
     const customObj = new Custom({
         app: options.app,
         type: "siyuan-card",
@@ -77,18 +26,58 @@ export const newCardModel = (options: {
         data: options.data,
         async init() {
             if (options.data.cardsData) {
-                // 使用现有的 cardsData
+                let cardsData = options.data.cardsData;
                 for (let i = 0; i < options.app.plugins.length; i++) {
-                    options.data.cardsData = await options.app.plugins[i].updateCards(options.data.cardsData);
+                    cardsData = await options.app.plugins[i].updateCards(options.data.cardsData);
                 }
-                await renderCardsAndBindEvents(this.element, this.data, options.data.cardsData, options.data.index);
+                this.element.innerHTML = genCardHTML({
+                    id: this.data.id,
+                    cardType: this.data.cardType,
+                    cardsData,
+                    isTab: true,
+                });
+
+                editor = await bindCardEvent({
+                    app: options.app,
+                    element: this.element,
+                    id: this.data.id,
+                    title: this.data.title,
+                    cardType: this.data.cardType,
+                    cardsData,
+                    index: options.data.index,
+                });
+                customObj.editors.push(editor);
                 // https://github.com/siyuan-note/siyuan/issues/9561#issuecomment-1794473512
                 delete options.data.cardsData;
                 delete options.data.index;
             } else {
-                // 获取新的 cardsData
+                fetchPost(this.data.cardType === "all" ? "/api/riff/getRiffDueCards" :
-                const cardsData = await fetchCardsData();
+                    (this.data.cardType === "doc" ? "/api/riff/getTreeRiffDueCards" : "/api/riff/getNotebookRiffDueCards"), {
-                await renderCardsAndBindEvents(this.element, this.data, cardsData);
+                    rootID: this.data.id,
+                    deckID: this.data.id,
+                    notebook: this.data.id,
+                }, async (response) => {
+                    let cardsData = response.data;
+                    for (let i = 0; i < options.app.plugins.length; i++) {
+                        cardsData = await options.app.plugins[i].updateCards(cardsData);
+                    }
+                    this.element.innerHTML = genCardHTML({
+                        id: this.data.id,
+                        cardType: this.data.cardType,
+                        cardsData,
+                        isTab: true,
+                    });
+
+                    editor = await bindCardEvent({
+                        app: options.app,
+                        element: this.element,
+                        id: this.data.id,
+                        title: this.data.title,
+                        cardType: this.data.cardType,
+                        cardsData,
+                    });
+                    customObj.editors.push(editor);
+                });
             }
         },
         destroy() {
@@ -101,9 +90,36 @@ export const newCardModel = (options: {
                 editor.resize();
             }
         },
-        async update() {
+        update() {
-            const cardsData = await fetchCardsData();
+            fetchPost(this.data.cardType === "all" ? "/api/riff/getRiffDueCards" :
-            await renderCardsAndBindEvents(this.element, this.data, cardsData ,undefined, true);
+                (this.data.cardType === "doc" ? "/api/riff/getTreeRiffDueCards" : "/api/riff/getNotebookRiffDueCards"), {
+                rootID: this.data.id,
+                deckID: this.data.id,
+                notebook: this.data.id,
+            }, async (response) => {
+                let cardsData = response.data;
+                for (let i = 0; i < options.app.plugins.length; i++) {
+                    cardsData = await options.app.plugins[i].updateCards(cardsData);
+                }
+                customObj.editors.forEach(item => {
+                    item.destroy();
+                });
+                this.element.innerHTML = genCardHTML({
+                    id: this.data.id,
+                    cardType: this.data.cardType,
+                    cardsData,
+                    isTab: true,
+                });
+                editor = await bindCardEvent({
+                    app: options.app,
+                    element: this.element,
+                    id: this.data.id,
+                    title: this.data.title,
+                    cardType: this.data.cardType,
+                    cardsData,
+                });
+                customObj.editors.push(editor);
+            });
         }
     });
     customObj.element.addEventListener("click", () => {

app/src/card/openCard.ts

@@ -225,7 +225,7 @@ const getEditor = (id: string, protyle: IProtyle, element: Element, currentCard:
 
 };
 
-export const initCardComponent = async (options: {
+export const bindCardEvent = async (options: {
     app: App,
     element: Element,
     title?: string,
@@ -301,33 +301,6 @@ export const initCardComponent = async (options: {
     };
 
     countElement.innerHTML = genCardCount(options.cardsData, index);
-    
-    return {
-        editor,
-        index,
-        actionElements,
-        countElement,
-        filterElement,
-        fetchNewRound
-    };
-};
-
-export const bindCardEvent = async (options: {
-    app: App,
-    element: Element,
-    title?: string,
-    cardsData: ICardData
-    cardType: TCardType,
-    id?: string,
-    dialog?: Dialog,
-    index?: number
-}) => {
-    // 初始化卡片组件
-    const initResult = await initCardComponent(options);
-    const { editor, actionElements, countElement, filterElement, fetchNewRound } = initResult;
-    let index = initResult.index;
-    
-    // 绑定点击事件
     options.element.addEventListener("click", (event: MouseEvent) => {
         const target = event.target as HTMLElement;
         let type = "";