@arronqzy/vue-view 0.1.22 → 0.1.23

package/README.md

@@ -51,7 +51,7 @@ import {
 
 创建 / 同步发出 `workspace:add` / `workspace:sync`。`parseWorkspaceData` 的 `value` 可作 `initialWorkspace`。
 
-IndexedDB CRUD 与 `getPreviewSnapshot` **不导出**。缩略图只在 React 包实现。
+本地保存的工作区可用 `listWorkspaceProjects` / `deleteWorkspaceProject` / `clearWorkspaceProjects`（参数为 `nameSpace`）列出和清理。其余 IndexedDB 读写与 `getPreviewSnapshot` **不导出**，缩略图只在 React 包实现。
 
 ## 和 React 版的差别
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arronqzy/vue-view",
-  "version": "0.1.22",
+  "version": "0.1.23",
   "description": "Vue 3 visual view editor for Abuilder (Ant Design Vue)",
   "license": "MIT",
   "type": "module",
@@ -23,13 +23,13 @@
     "selecto": "^1.26.3",
     "uuid": "^13.0.0",
     "vue": "^3.5.13",
-    "@arronqzy/blueprint-dsl": "1.0.17",
     "@arronqzy/i18n": "0.1.17",
-    "@arronqzy/view-table": "0.1.8",
+    "@arronqzy/blueprint-dsl": "1.0.17",
     "@arronqzy/rx-store": "1.0.8",
-    "@arronqzy/vue-blueprint": "0.1.17",
+    "@arronqzy/view-scene3d": "0.1.5",
+    "@arronqzy/view-table": "0.1.8",
     "@arronqzy/vue-rx-store": "0.1.6",
-    "@arronqzy/view-scene3d": "0.1.5"
+    "@arronqzy/vue-blueprint": "0.1.17"
   },
   "peerDependencies": {
     "vue": "^3.4.0"

package/src/index.ts

@@ -13,6 +13,12 @@ export {
   createEmptyWorkspace,
 } from "./panel/library/parse-workspace-data";
 export { createWorkspaceProjectId } from "./panel/library/workspace-project-db";
+export {
+  listWorkspaceProjects,
+  deleteWorkspaceProject,
+  clearWorkspaceProjects,
+} from "./panel/library/workspace-storage";
+export type { WorkspaceProjectListItem } from "./panel/library/workspace-storage";
 export {
   addEventSubscription,
   AbuilderEvents,

package/src/panel/hooks/useWorkspaceProjects.ts

@@ -9,14 +9,17 @@ import type { State } from "@arronqzy/rx-store";
 import { useI18nOptional } from "@arronqzy/i18n/vue";
 import {
   createWorkspaceProjectId,
-  deleteWorkspaceProject,
   getWorkspaceProject,
   listWorkspaceProjects,
   putWorkspaceProject,
   type WorkspaceProjectListItem,
   type WorkspaceProjectRecord,
 } from "../library/workspace-project-db";
-import { broadcastWorkspaceProjectUpdate } from "../library/workspace-project-sync";
+import { deleteWorkspaceProject } from "../library/workspace-storage";
+import {
+  broadcastWorkspaceProjectUpdate,
+  subscribeWorkspaceProjectsChanged,
+} from "../library/workspace-project-sync";
 import { writeWorkspacePreviewCache, readWorkspacePreviewCache } from "../library/workspace-project-cache";
 import {
   cloneWorkspaceSnapshot,
@@ -140,6 +143,26 @@ export function useWorkspaceProjects(options: UseWorkspaceProjectsOptions) {
     }
   );
 
+  watch(
+    () => nameSpace(),
+    (ns, _prev, onCleanup) => {
+      const unsubscribe = subscribeWorkspaceProjectsChanged((message) => {
+        const active = activeProjectId.value;
+        const removedActive =
+          message.type === "cleared" ||
+          (active !== null && message.projectIds.includes(active));
+        if (removedActive) {
+          activeProjectId.value = null;
+          activeProjectName.value = null;
+          syncedSnapshotRef.value = null;
+        }
+        void refreshProjects();
+      }, ns);
+      onCleanup(unsubscribe);
+    },
+    { immediate: true }
+  );
+
   onUnmounted(() => {
     if (previewPollTimer !== undefined) window.clearInterval(previewPollTimer);
   });

package/src/panel/library/workspace-project-cache.ts

@@ -35,3 +35,30 @@ export function readWorkspacePreviewCache(
     return null;
   }
 }
+
+export function removeWorkspacePreviewCache(
+  projectId: string,
+  nameSpace?: string | null
+): void {
+  try {
+    localStorage.removeItem(previewCacheKey(projectId, nameSpace));
+  } catch {
+    // ignore private mode
+  }
+}
+
+export function clearWorkspacePreviewCaches(nameSpace?: string | null): void {
+  try {
+    const suffix = appStorageKey("", nameSpace);
+    const keys: string[] = [];
+    for (let i = 0; i < localStorage.length; i += 1) {
+      const key = localStorage.key(i);
+      if (!key || !key.startsWith(CACHE_PREFIX)) continue;
+      // 无 nameSpace 时 key 不带 "__<ns>" 后缀，避免误删其他 nameSpace 的标记
+      if (suffix ? key.endsWith(suffix) : !key.includes("__")) keys.push(key);
+    }
+    keys.forEach((key) => localStorage.removeItem(key));
+  } catch {
+    // ignore private mode
+  }
+}

package/src/panel/library/workspace-project-db.ts

@@ -283,3 +283,7 @@ export async function deleteWorkspaceProject(
 ): Promise<void> {
   await runTransaction<undefined>("readwrite", (store) => store.delete(id), nameSpace);
 }
+
+export async function clearWorkspaceProjectStore(nameSpace?: string | null): Promise<void> {
+  await runTransaction<undefined>("readwrite", (store) => store.clear(), nameSpace);
+}

package/src/panel/library/workspace-project-sync.ts

@@ -1,6 +1,7 @@
 import { appStorageKey } from "@arronqzy/blueprint-dsl";
 
 const CHANNEL_PREFIX = "arronqzy-workspace-project";
+const LIST_CHANNEL = "arronqzy-workspace-projects-changed";
 
 export type WorkspaceProjectSyncMessage = {
   type: "updated";
@@ -8,6 +9,36 @@ export type WorkspaceProjectSyncMessage = {
   updatedAt: number;
 };
 
+export type WorkspaceProjectsChangedMessage =
+  | { type: "deleted"; projectIds: string[] }
+  | { type: "cleared" };
+
+export function broadcastWorkspaceProjectsChanged(
+  message: WorkspaceProjectsChangedMessage,
+  nameSpace?: string | null
+): void {
+  if (typeof BroadcastChannel === "undefined") return;
+  const channel = new BroadcastChannel(appStorageKey(LIST_CHANNEL, nameSpace));
+  channel.postMessage(message);
+  channel.close();
+}
+
+export function subscribeWorkspaceProjectsChanged(
+  onChange: (message: WorkspaceProjectsChangedMessage) => void,
+  nameSpace?: string | null
+): () => void {
+  if (typeof BroadcastChannel === "undefined") {
+    return () => {};
+  }
+  const channel = new BroadcastChannel(appStorageKey(LIST_CHANNEL, nameSpace));
+  channel.onmessage = (event: MessageEvent<WorkspaceProjectsChangedMessage>) => {
+    const data = event.data;
+    if (!data || (data.type !== "deleted" && data.type !== "cleared")) return;
+    onChange(data);
+  };
+  return () => channel.close();
+}
+
 export function getWorkspaceProjectChannelName(
   projectId: string,
   nameSpace?: string | null

package/src/panel/library/workspace-storage.ts

@@ -0,0 +1,38 @@
+import {
+  clearWorkspaceProjectStore,
+  deleteWorkspaceProject as deleteWorkspaceProjectRecord,
+  listWorkspaceProjects,
+} from "./workspace-project-db";
+import {
+  clearWorkspacePreviewCaches,
+  removeWorkspacePreviewCache,
+} from "./workspace-project-cache";
+import { broadcastWorkspaceProjectsChanged } from "./workspace-project-sync";
+
+export { listWorkspaceProjects };
+export type { WorkspaceProjectListItem } from "./workspace-project-db";
+
+/**
+ * 删除 IndexedDB 中保存的单个工作区（及其 localStorage 预览标记）。
+ * `nameSpace` 需与 `VueViewPanel` 的 `nameSpace` 一致；已挂载的面板会自动刷新工作区列表。
+ */
+export async function deleteWorkspaceProject(
+  id: string,
+  nameSpace?: string | null
+): Promise<void> {
+  await deleteWorkspaceProjectRecord(id, nameSpace);
+  removeWorkspacePreviewCache(id, nameSpace);
+  broadcastWorkspaceProjectsChanged({ type: "deleted", projectIds: [id] }, nameSpace);
+}
+
+/**
+ * 清空该 `nameSpace` 下保存的全部工作区，返回删除的数量。
+ * 不影响蓝图库、执行日志、接口集合等其他存储。
+ */
+export async function clearWorkspaceProjects(nameSpace?: string | null): Promise<number> {
+  const items = await listWorkspaceProjects(nameSpace);
+  await clearWorkspaceProjectStore(nameSpace);
+  clearWorkspacePreviewCaches(nameSpace);
+  broadcastWorkspaceProjectsChanged({ type: "cleared" }, nameSpace);
+  return items.length;
+}