@zhin.js/client 1.0.0

package/src/router.ts

@@ -0,0 +1,44 @@
+import { createRouter, createWebHistory } from 'vue-router';
+import { useCommonStore } from './store.js';
+import { MenuWithComponent, ToolInfo } from './types.js';
+export const router = createRouter({
+  history: createWebHistory(),
+  routes: [],
+});
+
+router.beforeEach(async (to, from, next) => {
+  const commonStore = useCommonStore();
+  if (!commonStore.initialized) {
+    await commonStore.initial;
+    return next({ ...to, replace: true });
+  }
+  return next();
+});
+export function addPage(menu: MenuWithComponent) {
+  if (menu.parentName) {
+    router.addRoute(menu.parentName, {
+      path: menu.path,
+      name: menu.name,
+      component: menu.component,
+      children: [],
+    });
+  } else {
+    router.addRoute({
+      path: menu.path,
+      name: menu.name,
+      component: menu.component,
+      children: [],
+    });
+  }
+  useCommonStore().addData({
+    key: 'menus',
+    value: menu,
+  });
+  return () => router.removeRoute(menu.name);
+}
+export function addTool(tool: ToolInfo) {
+  useCommonStore().addData({
+    key: 'tools',
+    value: tool,
+  });
+}

package/src/store.ts

@@ -0,0 +1,53 @@
+import { ref, watch } from 'vue';
+import { defineStore } from 'pinia';
+export const useCommonStore = defineStore('common', () => {
+  const store = ref<Record<string, any>>({});
+  const initialized = ref(false);
+  let resolve: (v: unknown) => any;
+  const initial = new Promise(res => (resolve = res));
+  const syncData = ({ key, value }: { key: string; value: any }) => {
+    store.value[key] = value;
+    if (resolve) {
+      initialized.value = true;
+      setTimeout(resolve, 300);
+    }
+  };
+  const addData = ({ key, value }: { key: string; value: any }) => {
+    const list = (store.value[key] ||= []);
+    list.push(value);
+  };
+  const deleteData = ({ key, value }: { key: string; value: any }) => {
+    const list = (store.value[key] ||= []);
+    list.splice(list.indexOf(value), 1);
+  };
+  let beforeElement: Node[] = [];
+  const createScript = (store: Record<string, any>) => {
+    if(!store.entries?.length) return;
+    const fragment = document.createDocumentFragment();
+    while (beforeElement.length) {
+      const element = beforeElement.shift()!;
+      document.body.removeChild(element);
+    }
+    const entries: string[] = (store.entries ||= []);
+    entries.forEach(entry => {
+      const el = document.createElement('script');
+      el.type = 'module';
+      el.src = entry;
+      fragment.appendChild(el);
+      beforeElement.push(el);
+    });
+    document.body.appendChild(fragment);
+  };
+  watch(store, createScript, {
+    immediate: true,
+    deep: true,
+  });
+  return {
+    store,
+    initialized,
+    initial,
+    syncData,
+    addData,
+    deleteData,
+  };
+});

package/src/types.ts

@@ -0,0 +1,18 @@
+import { RouteComponent } from 'vue-router';
+
+export interface MenuInfo {
+  icon?: string;
+  parentName?: string;
+  children?: MenuInfo[];
+  path: string;
+  name: string;
+}
+export type MenuWithComponent = {
+  component: RouteComponent;
+  children?: MenuWithComponent[];
+} & MenuInfo;
+export type ToolInfo = {
+  name?: string;
+  icon?: string;
+  component: RouteComponent;
+};