@maketribe/ms-app 3.0.0 → 3.0.3

package/src/PageManager.ts

@@ -0,0 +1,145 @@
+import { RouteRecordRaw } from "vue-router";
+import type { MSAppClient } from "./MSAppClient";
+import { Disposable, Event, createDisposable } from "@maketribe/utils";
+
+export class PageManager {
+  normalPages: RouteRecordRaw[] = [];
+
+  extendsPages: RouteRecordRaw[] = [];
+
+  msAppClient: MSAppClient | null = null;
+
+  msAppClientChangeEvent: Event<{ msAppClient: MSAppClient | null }> =
+    new Event();
+
+  msAppClientDisposable: Disposable | null = null;
+
+  setMSAppCLient(msAppClient: MSAppClient | null) {
+    this.msAppClientDisposable?.dispose();
+
+    this.msAppClientDisposable = new Disposable();
+
+    this.msAppClient = msAppClient;
+
+    this.msAppClientChangeEvent.emit({ msAppClient });
+  }
+
+  addNormalPage(normalPage: RouteRecordRaw) {
+    this.normalPages.push(normalPage);
+  }
+
+  addExtendsPage(extendsPage: RouteRecordRaw) {
+    this.extendsPages.push(extendsPage);
+  }
+
+  init() {
+    this.addNormalPage({
+      name: "mk-ms-main",
+      path: "/",
+      component: () => import("./page/index.vue"),
+    });
+
+    this.addNormalPage({
+      name: "login",
+      path: "/login",
+      meta: {
+        isAuthorization: false,
+      },
+      component: () => import("./page/login/index.vue"),
+    });
+
+    this.addNormalPage({
+      name: "signup",
+      path: "/signup",
+      meta: {
+        isAuthorization: false,
+      },
+      component: () => import("./page/signup/index.vue"),
+    });
+
+    this.addExtendsPage({
+      name: "ms-material/list",
+      path: "/material-list",
+      component: () => import("./page/index/material/index.vue"),
+    });
+
+    this.addExtendsPage({
+      name: "ms-member/list",
+      path: "/dv/ms-member",
+      component: () => import("./page/index/dv/ms-member/index.vue"),
+    });
+
+    this.addExtendsPage({
+      name: "ms-role/list",
+      path: "/dv/ms-role",
+      component: () => import("./page/index/dv/ms-role/index.vue"),
+    });
+
+    this.msAppClientChangeEvent.on(({ msAppClient }) => {
+      if (!msAppClient) {
+        return;
+      }
+
+      const vueRouter = msAppClient.vueRouter;
+      const vueRoutes = vueRouter.getRoutes();
+
+      const addedNormalPageNames: string[] = [];
+
+      for (const normalPage of this.normalPages) {
+        const vueRoute = vueRoutes.find(
+          (vueRoute) => vueRoute.name === normalPage.name
+        );
+
+        if (!vueRoute) {
+          addedNormalPageNames.push(normalPage.name as string);
+          vueRouter.addRoute(normalPage);
+        }
+      }
+
+      this.msAppClientDisposable?.register(
+        createDisposable(() => {
+          for (const addedNormalPageName of addedNormalPageNames) {
+            vueRouter.removeRoute(addedNormalPageName);
+          }
+        })
+      );
+
+      this.msAppClientDisposable?.register(
+        msAppClient.beforeInitUserSessionEvent.on(({ userSession }) => {
+          if (!userSession) {
+            return;
+          }
+
+          const addedExtendsPageNames: string[] = [];
+
+          if (!this.extendsPages.find((page) => page.name === "notFound")) {
+            this.addExtendsPage({
+              name: "notFound",
+              path: "/:pathMatch(.*)*",
+              component: () => import("./page/index/404.vue"),
+            });
+          }
+
+          for (const extendsPage of this.extendsPages) {
+            const vueRoute = vueRoutes.find(
+              (vueRoute) => vueRoute.name === extendsPage.name
+            );
+
+            if (!vueRoute) {
+              addedExtendsPageNames.push(extendsPage.name as string);
+              vueRouter.addRoute("mk-ms-main", extendsPage);
+            }
+          }
+
+          userSession.register(
+            createDisposable(() => {
+              for (const addedExtendsPageName of addedExtendsPageNames) {
+                vueRouter.removeRoute(addedExtendsPageName);
+              }
+            })
+          );
+        })
+      );
+    });
+  }
+}

package/src/Router.ts

@@ -1,10 +1,10 @@
 import { Disposable, Event, createDisposable } from "@maketribe/utils";
 import { Route } from "./dataview";
 import type { UserSession } from "./UserSession";
-import DefaultListPage from "./page/index/dv/default/index.vue";
-import DefaultAddPage from "./page/index/dv/default/add.vue";
-import DefaultEditPage from "./page/index/dv/default/edit.vue";
-import DefaultTreePage from "./page/index/dv/default/tree.vue";
+// import DefaultListPage from "./page/index/dv/default/index.vue";
+// import DefaultAddPage from "./page/index/dv/default/add.vue";
+// import DefaultEditPage from "./page/index/dv/default/edit.vue";
+// import DefaultTreePage from "./page/index/dv/default/tree.vue";
 
 const NORMALIZE_ROUTE_NAME_REG = /^([^\\]+)\/(.+)$/;
 
@@ -54,7 +54,7 @@ export class Router extends Disposable {
             vueRouter.addRoute("mk-ms-main", {
               name: defaultPageRoute.name,
               path: `/dv/${name}`,
-              component: DefaultListPage,
+              component: () => import("./page/index/dv/default/index.vue"),
               meta: { name },
             });
             break;
@@ -62,7 +62,7 @@ export class Router extends Disposable {
             vueRouter.addRoute("mk-ms-main", {
               name: defaultPageRoute.name,
               path: `/dv/${name}/:id`,
-              component: DefaultEditPage,
+              component: () => import("./page/index/dv/default/edit.vue"),
               meta: { name },
             });
             break;
@@ -70,7 +70,7 @@ export class Router extends Disposable {
             vueRouter.addRoute("mk-ms-main", {
               name: defaultPageRoute.name,
               path: `/dv/${name}/add`,
-              component: DefaultAddPage,
+              component: () => import("./page/index/dv/default/add.vue"),
               meta: { name },
             });
             break;
@@ -78,7 +78,7 @@ export class Router extends Disposable {
             vueRouter.addRoute("mk-ms-main", {
               name: defaultPageRoute.name,
               path: `/dv/${name}`,
-              component: DefaultTreePage,
+              component: () => import("./page/index/dv/default/tree.vue"),
               meta: { name },
             });
             break;

package/src/UserSession.ts

@@ -1,4 +1,4 @@
-import { Disposable, Event, createDisposable } from "@maketribe/utils";
+import { Disposable, Event, createDisposable, md5 } from "@maketribe/utils";
 import { MemberInfo, UserInfo } from "./UserInfo";
 import { Menu } from "./menu";
 import { Tabs } from "./tabs";
@@ -7,7 +7,7 @@ import {
   PermissionPoint,
   PermissionPointManager,
 } from "./PermissionPointManager";
-import type { MSAppClient } from "./MSAppClient";
+import type { MSAppClient, LoginResult } from "./MSAppClient";
 import { MenuResult, Role, Route } from "./dataview";
 import { R } from "@maketribe/request";
 import {
@@ -20,9 +20,15 @@ import {
 
 export type UserSessionOptions = {
   msAppClient: MSAppClient;
+  accessToken?: string;
+  xAccessToken?: string;
 };
 
+let uid = 0;
+
 export class UserSession extends Disposable {
+  id = uid++;
+
   msAppClient: MSAppClient;
 
   vueRouter: MSAppClient["vueRouter"];
@@ -43,6 +49,10 @@ export class UserSession extends Disposable {
 
   beforeInitRouterEvent: Event = this.register(new Event());
 
+  locking: boolean = false;
+
+  lockingChangeEvent: Event<{ locking: boolean }> = this.register(new Event());
+
   constructor(options: UserSessionOptions) {
     super();
 
@@ -59,8 +69,10 @@ export class UserSession extends Disposable {
       new Menu(this.permissionPointManager, this.router)
     );
 
-    this.accessToken = localStorage.getItem(ACCESS_TOKEN_HEADER) ?? "";
-    this.xAccessToken = localStorage.getItem(X_ACCESS_TOKEN_HEADER) ?? "";
+    this.accessToken =
+      options.accessToken ?? localStorage.getItem(ACCESS_TOKEN_HEADER) ?? "";
+    this.xAccessToken =
+      options.xAccessToken ?? localStorage.getItem(X_ACCESS_TOKEN_HEADER) ?? "";
   }
 
   async init() {
@@ -114,6 +126,15 @@ export class UserSession extends Disposable {
         return config;
       });
 
+    this.register(
+      createDisposable(() => {
+        httpRequest.getInterceptors().request.eject(beforeRequestInterceptorID);
+        httpRequest
+          .getInterceptors()
+          .request.eject(beforeResponseInterceptorID);
+      })
+    );
+
     try {
       let response = await httpRequest.request<R<BasicInfoResult>>({
         url: "/api/ms-login/login-info",
@@ -163,17 +184,6 @@ export class UserSession extends Disposable {
         this.tabs.switchTab(tab);
       });
 
-      this.register(
-        createDisposable(() => {
-          httpRequest
-            .getInterceptors()
-            .request.eject(beforeRequestInterceptorID);
-          httpRequest
-            .getInterceptors()
-            .request.eject(beforeResponseInterceptorID);
-        })
-      );
-
       return response;
     } catch (e) {
       httpRequest.getInterceptors().request.eject(beforeRequestInterceptorID);
@@ -181,6 +191,39 @@ export class UserSession extends Disposable {
     }
   }
 
+  lock() {
+    this.locking = true;
+
+    this.lockingChangeEvent.emit({ locking: this.locking });
+  }
+
+  async unlock(password: string, code: string) {
+    const response = await this.msAppClient.httpRequest.request<R<LoginResult>>(
+      {
+        url: "/api/ms-login/login",
+        method: "POST",
+        data: {
+          account: this.userInfo!.account,
+          password: md5(`mkbl#${password}`),
+          vCode: code,
+        },
+      }
+    );
+
+    if (response.data.code !== 200) {
+      return response;
+    }
+
+    this.accessToken = response.headers[ACCESS_TOKEN_HEADER];
+    this.xAccessToken = response.headers[X_ACCESS_TOKEN_HEADER];
+
+    this.locking = false;
+
+    this.lockingChangeEvent.emit({ locking: this.locking });
+
+    return response;
+  }
+
   public dispose(): void {
     localStorage.removeItem(ACCESS_TOKEN_HEADER);
     localStorage.removeItem(X_ACCESS_TOKEN_HEADER);

package/src/components/image-select/image-select.tsx

@@ -1,6 +1,6 @@
 import { defineComponent, computed } from "vue";
 import { ElIcon } from "element-plus";
-import { Plus } from "@element-plus/icons";
+import { Plus } from "@element-plus/icons-vue";
 import { imageSelectProps, imageSelectEmits } from "./image-select-option";
 import { MKMaterialSelect } from "../../components/material-select";
 

package/src/components/material-list/material-group.vue

@@ -63,7 +63,7 @@
 <script setup lang="ts">
 import { computed, nextTick, reactive } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
-import { Plus, Edit, Delete } from "@element-plus/icons";
+import { Plus, Edit, Delete } from "@element-plus/icons-vue";
 import {
   MaterialMan,
   MaterialGroupNode,

package/src/components/verify-dialog/verify-dialog-option.ts

@@ -20,4 +20,4 @@ export const verifyDialogEmits = {
   "update:visible": (modelValue: any) => true,
   verifySuccessful: (modelValue: any) => true,
 };
-export type VerifyDialogProps = ExtractPropTypes<typeof verifyDialogProps>;
+export type VerifyDialogProps = ExtractPropTypes<typeof verifyDialogEmits>;

package/src/components/verify-dialog/verify-dialog.tsx

@@ -14,7 +14,7 @@ import { ElDialog, ElSlider, ElButton } from "element-plus";
 export default defineComponent({
   name: "MKVerifyDialog",
   props: verifyDialogProps,
-  emit: verifyDialogEmits,
+  emits: verifyDialogEmits,
   setup(props, { emit }) {
     const deg = ref(0);
 

package/src/constants/index.ts

@@ -1,2 +1,3 @@
 export * from "./token";
 export * from "./route";
+export * from "./menu";

package/src/constants/menu.ts

@@ -0,0 +1,4 @@
+export enum MenuType {
+  Container = 1,
+  Menu = 2,
+}

package/src/dataview/config/ConfigForm.ts

@@ -4,8 +4,8 @@ import {
   DataFormOptions,
   FormColumn,
   IComponents,
-  defineDataForm,
 } from "@maketribe/dm";
+import { defineDataForm } from "../../define-data-form";
 import { ITypeResolver } from "../../resolver/ITypeResolver";
 
 export type Config<T = any> = {
@@ -20,7 +20,10 @@ export type ConfigFormOptions = DataFormOptions & {
   configComponent?: IComponents;
 };
 
-export class ConfigForm extends DataForm<Config> implements ITypeResolver<Config> {
+export class ConfigForm
+  extends DataForm<Config>
+  implements ITypeResolver<Config>
+{
   configComponent: IComponents;
 
   constructor(options: ConfigFormOptions = {}) {
@@ -80,17 +83,17 @@ export class ConfigForm extends DataForm<Config> implements ITypeResolver<Config
   }
 
   formatItem(item: Config): Config {
-    return {
-      ...item,
-      value: JSON.parse(item.value),
-    };
+    let value = item.value;
+
+    try {
+      value = JSON.parse(item.value);
+    } catch (e) {}
+
+    return { ...item, value };
   }
 
   formatSubmitData(data: any) {
-    return {
-      ...data,
-      value: JSON.stringify(data.value),
-    };
+    return { ...data, value: JSON.stringify(data.value) };
   }
 
   resolveType(type: string) {

package/src/dataview/config/ConfigTable.ts

@@ -4,10 +4,10 @@ import {
   DataTableOptions,
   TableColumn,
   TableActionColumn,
-  defineDataTable,
 } from "@maketribe/dm";
 import { Config } from "./ConfigForm";
 import { R, ResponseConfig } from "@maketribe/request";
+import { defineDataTable } from "../../define-data-table";
 
 export class ConfigTable extends DataTable<Config> {
   private static _instance: ConfigTable | null = null;

package/src/dataview/department/DepartmentForm.ts

@@ -1,9 +1,5 @@
-import {
-  DataForm,
-  DataFormOptions,
-  FormColumn,
-  defineDataForm,
-} from "@maketribe/dm";
+import { DataForm, DataFormOptions, FormColumn } from "@maketribe/dm";
+import { defineDataForm } from "../../define-data-form";
 
 export type Department = {
   id: string;

package/src/dataview/department/DepartmentTable.ts

@@ -1,10 +1,6 @@
-import {
-  DataTableOptions,
-  TableColumn,
-  DataTable,
-  defineDataTable,
-} from "@maketribe/dm";
+import { DataTableOptions, TableColumn, DataTable } from "@maketribe/dm";
 import { Department } from "./DepartmentForm";
+import { defineDataTable } from "../../define-data-table";
 
 export type DepartmentNode = Department & { children: DepartmentNode[] };
 

package/src/dataview/material/MaterialForm.ts

@@ -1,9 +1,5 @@
-import {
-  DataForm,
-  DataFormOptions,
-  FormColumn,
-  defineDataForm,
-} from "@maketribe/dm";
+import { DataForm, DataFormOptions, FormColumn } from "@maketribe/dm";
+import { defineDataForm } from "../../define-data-form";
 
 export type Material = {
   id: string;

package/src/dataview/material/MaterialMan.ts

@@ -1,4 +1,4 @@
-import { Group } from "@maketribe/request";
+import { Group, OrderType } from "@maketribe/request";
 import { IComponents, WhereFilter } from "@maketribe/dm";
 import { MaterialTable, MaterialType } from "./MaterialTable";
 import {
@@ -52,6 +52,10 @@ export class MaterialMan {
       .getWhere()
       .addGroup(this.materialConditionGroup);
 
+    (this.materialTable.dataFilter as WhereFilter)
+      .getOrder()
+      .addOrderItem("createDate", OrderType.DESC);
+
     this.materialGroupTable.dataFilter.setReady();
     this.materialTable.dataFilter.setReady();
 

package/src/dataview/material/MaterialTable.ts

@@ -4,10 +4,10 @@ import {
   DataTableOptions,
   IComponents,
   TableColumn,
-  defineDataTable,
 } from "@maketribe/dm";
 import { Material } from "./MaterialForm";
 import { ConfigTable } from "../config";
+import { defineDataTable } from "../../define-data-table";
 import { ITypeResolver } from "../../resolver/ITypeResolver";
 
 export type MaterialType = {

package/src/dataview/material/material-group/MaterialGroupForm.ts

@@ -1,9 +1,4 @@
-import {
-  DataForm,
-  DataFormOptions,
-  FormColumn,
-  defineDataForm,
-} from "@maketribe/dm";
+import { DataForm, DataFormOptions, FormColumn } from "@maketribe/dm";
 
 export type MaterialGroup = {
   id: string;

package/src/dataview/material/material-group/MaterialGroupTable.ts

@@ -1,9 +1,4 @@
-import {
-  DataTable,
-  DataTableOptions,
-  TableColumn,
-  defineDataTable,
-} from "@maketribe/dm";
+import { DataTable, DataTableOptions, TableColumn } from "@maketribe/dm";
 import { MaterialGroup } from "./MaterialGroupForm";
 
 export type MaterialGroupNode = MaterialGroup & {

package/src/dataview/member/MemberForm.ts

@@ -1,9 +1,5 @@
-import {
-  DataForm,
-  DataFormOptions,
-  FormColumn,
-  defineDataForm,
-} from "@maketribe/dm";
+import { DataForm, DataFormOptions, FormColumn } from "@maketribe/dm";
+import { defineDataForm } from "../../define-data-form";
 import { RoleTable } from "../role";
 import { DepartmentTable } from "../department";
 import { WebFileUpload } from "@maketribe/request";

package/src/dataview/member/MemberTable.tsx

@@ -9,10 +9,10 @@ import {
   EditButton,
   Messager,
   Dialoger,
-  defineDataTable,
   FormColumn,
 } from "@maketribe/dm";
 import { Event } from "@maketribe/utils";
+import { defineDataTable } from "../../define-data-table";
 import { Member, MemberForm, MemberResult } from "./MemberForm";
 
 export type MemberTableItem = Omit<Member, "password" | "confirmPassword">;
@@ -71,7 +71,7 @@ export class MemberTable extends DataTable<MemberResult, MemberTableItem> {
         width: "190px",
         visible: false,
       }),
-      new TableColumn({ name: "name", label: "姓名", minWidth: "100px" }),
+      new TableColumn({ name: "name", label: "姓名", minWidth: "150px" }),
       new TableColumn({ name: "nickName", label: "昵称", minWidth: "150px" }),
       new TableColumn({
         name: "avatar",
@@ -80,7 +80,7 @@ export class MemberTable extends DataTable<MemberResult, MemberTableItem> {
         width: "80px",
       }),
       new TableColumn({ name: "account", label: "账号", minWidth: "150px" }),
-      new TableColumn({ name: "email", label: "邮箱", minWidth: "180px" }),
+      new TableColumn({ name: "email", label: "邮箱", minWidth: "200px" }),
       new TableColumn({ name: "phone", label: "手机号", minWidth: "120px" }),
       new TableColumn({ name: "wechatNo", label: "微信号", minWidth: "140px" }),
       new TableColumn({