From 0a025f1b502c85aa8b98b5ceeb1853d72aa4cdc8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E4=B8=80=E4=B9=8B?= <yz@ggnb.top>
Date: Sun, 16 Mar 2025 22:46:22 +0800
Subject: [PATCH] page

---
 rspack.config.ts                              |  4 +-
 src/app/repo/scripts.ts                       |  8 +++
 src/pages/components/layout/MainLayout.tsx    | 51 +++++++++---------
 src/pages/components/layout/Sider.tsx         |  2 +-
 .../options/routes/script/ScriptEditor.tsx    | 53 +++++++++----------
 5 files changed, 61 insertions(+), 57 deletions(-)

diff --git a/rspack.config.ts b/rspack.config.ts
index 507f851..a747820 100644
--- a/rspack.config.ts
+++ b/rspack.config.ts
@@ -92,12 +92,12 @@ export default defineConfig({
         ],
       },
       {
-        type: "asset",
+        type: "asset/source",
         test: /\.d\.ts$/,
         exclude: /node_modules/,
       },
       {
-        type: "asset",
+        type: "asset/source",
         test: /\.tpl$/,
         exclude: /node_modules/,
       },
diff --git a/src/app/repo/scripts.ts b/src/app/repo/scripts.ts
index d36ed76..0043783 100644
--- a/src/app/repo/scripts.ts
+++ b/src/app/repo/scripts.ts
@@ -91,6 +91,10 @@ export class ScriptDAO extends Repo<Script> {
     return super._save(val.uuid, val);
   }
 
+  findByUUID(uuid: string) {
+    return this.get(uuid);
+  }
+
   getAndCode(uuid: string): Promise<ScriptAndCode | undefined> {
     return Promise.all([this.get(uuid), this.scriptCodeDAO.get(uuid)]).then(([script, code]) => {
       if (!script || !code) {
@@ -131,6 +135,10 @@ export class ScriptCodeDAO extends Repo<ScriptCode> {
     super("scriptCode");
   }
 
+  findByUUID(uuid: string) {
+    return this.get(uuid);
+  }
+
   public save(val: ScriptCode) {
     return super._save(val.uuid, val);
   }
diff --git a/src/pages/components/layout/MainLayout.tsx b/src/pages/components/layout/MainLayout.tsx
index a45f1c0..f5c46ea 100644
--- a/src/pages/components/layout/MainLayout.tsx
+++ b/src/pages/components/layout/MainLayout.tsx
@@ -6,7 +6,6 @@ import {
   Input,
   Layout,
   Menu,
-  Message,
   Modal,
   Space,
   Typography,
@@ -88,31 +87,31 @@ const MainLayout: React.FC<{
                       onClick={() => {
                         const el = document.getElementById("import-local");
                         el!.onchange = (e: Event) => {
-                          const scriptCtl = IoC.instance(ScriptController) as ScriptController;
-                          try {
-                            // 获取文件
-                            // @ts-ignore
-                            const file = e.target.files[0];
-                            // 实例化 FileReader对象
-                            const reader = new FileReader();
-                            reader.onload = async (processEvent) => {
-                              // 创建blob url
-                              const blob = new Blob(
-                                // @ts-ignore
-                                [processEvent.target!.result],
-                                {
-                                  type: "application/javascript",
-                                }
-                              );
-                              const url = URL.createObjectURL(blob);
-                              await scriptCtl.importByUrl(url);
-                              Message.success(t("import_local_success"));
-                            };
-                            // 调用readerAsText方法读取文本
-                            reader.readAsText(file);
-                          } catch (error) {
-                            Message.error(`${t("import_local_failure")}: ${e}`);
-                          }
+                          // const scriptCtl = IoC.instance(ScriptController) as ScriptController;
+                          // try {
+                          //   // 获取文件
+                          //   // @ts-ignore
+                          //   const file = e.target.files[0];
+                          //   // 实例化 FileReader对象
+                          //   const reader = new FileReader();
+                          //   reader.onload = async (processEvent) => {
+                          //     // 创建blob url
+                          //     const blob = new Blob(
+                          //       // @ts-ignore
+                          //       [processEvent.target!.result],
+                          //       {
+                          //         type: "application/javascript",
+                          //       }
+                          //     );
+                          //     const url = URL.createObjectURL(blob);
+                          //     await scriptCtl.importByUrl(url);
+                          //     Message.success(t("import_local_success"));
+                          //   };
+                          //   // 调用readerAsText方法读取文本
+                          //   reader.readAsText(file);
+                          // } catch (error) {
+                          //   Message.error(`${t("import_local_failure")}: ${e}`);
+                          // }
                         };
                         el!.click();
                       }}
diff --git a/src/pages/components/layout/Sider.tsx b/src/pages/components/layout/Sider.tsx
index 0fd94c1..fecfc68 100644
--- a/src/pages/components/layout/Sider.tsx
+++ b/src/pages/components/layout/Sider.tsx
@@ -194,7 +194,7 @@ const Sider: React.FC = () => {
         <Routes>
           <Route index element={<ScriptList />} />
           <Route path="/script/editor">
-            <Route path=":id" element={<ScriptEditor />} />
+            <Route path=":uuid" element={<ScriptEditor />} />
             <Route path="" element={<ScriptEditor />} />
           </Route>
           <Route path="/subscribe" element={<SubscribeList />} />
diff --git a/src/pages/options/routes/script/ScriptEditor.tsx b/src/pages/options/routes/script/ScriptEditor.tsx
index a4c1a78..ec30dba 100644
--- a/src/pages/options/routes/script/ScriptEditor.tsx
+++ b/src/pages/options/routes/script/ScriptEditor.tsx
@@ -1,4 +1,4 @@
-import { Script, ScriptDAO } from "@App/app/repo/scripts";
+import { Script, ScriptCodeDAO, ScriptDAO } from "@App/app/repo/scripts";
 import CodeEditor from "@App/pages/components/CodeEditor";
 import React, { useEffect, useRef, useState } from "react";
 import { useNavigate, useParams, useSearchParams } from "react-router-dom";
@@ -143,8 +143,7 @@ const popstate = () => {
 
 function ScriptEditor() {
   const scriptDAO = new ScriptDAO();
-  const scriptCtrl = IoC.instance(ScriptController) as ScriptController;
-  const runtimeCtrl = IoC.instance(RuntimeController) as RuntimeController;
+  const scriptCodeDAO = new ScriptCodeDAO();
   const template = useSearchParams()[0].get("template") || "";
   const target = useSearchParams()[0].get("target") || "";
   const navigate = useNavigate();
@@ -167,6 +166,8 @@ function ScriptEditor() {
     uuid: string;
     selectSciptButtonAndTab: string;
   }>();
+  const { uuid } = useParams();
+
   const setShow = (key: visibleItem, show: boolean) => {
     Object.keys(visible).forEach((k) => {
       visible[k] = false;
@@ -174,8 +175,6 @@ function ScriptEditor() {
     visible[key] = show;
     setVisible({ ...visible });
   };
-
-  const { id } = useParams();
   const save = (script: Script, e: editor.IStandaloneCodeEditor): Promise<Script> => {
     // 解析code生成新的script并更新
     return new Promise((resolve) => {
@@ -363,31 +362,29 @@ function ScriptEditor() {
       });
   });
   useEffect(() => {
-    scriptDAO.table
-      .orderBy("sort")
-      .toArray()
-      .then((scripts) => {
-        setScriptList(scripts);
-        // 如果有id则打开对应的脚本
-        if (id) {
-          const iId = parseInt(id, 10);
-          for (let i = 0; i < scripts.length; i += 1) {
-            if (scripts[i].id === iId) {
-              editors.push({
-                script: scripts[i],
-                code: scripts[i].code,
-                active: true,
-                hotKeys,
-                isChanged: false,
-              });
-              setSelectSciptButtonAndTab(scripts[i].uuid);
-              setEditors([...editors]);
-              break;
-            }
+    scriptDAO.all().then(async (scripts) => {
+      scripts.sort((a, b) => a.sort - b.sort);
+      setScriptList(scripts);
+      // 如果有id则打开对应的脚本
+      if (uuid) {
+        for (let i = 0; i < scripts.length; i += 1) {
+          if (scripts[i].uuid === uuid) {
+            const code = await scriptCodeDAO.findByUUID(uuid);
+            editors.push({
+              script: scripts[i],
+              code: code!.code,
+              active: true,
+              hotKeys,
+              isChanged: false,
+            });
+            setSelectSciptButtonAndTab(scripts[i].uuid);
+            setEditors([...editors]);
+            break;
           }
         }
-      });
-    if (!id) {
+      }
+    });
+    if (!uuid) {
       emptyScript(template || "", hotKeys, target).then((e) => {
         editors.push(e);
         setEditors([...editors]);