@maketribe/ms-app 3.0.30 → 3.0.32

package/src/dataview/member/MemberTable.tsx

@@ -0,0 +1,257 @@
+import { R } from "@maketribe/request";
+import {
+  TableColumn,
+  DataTable,
+  DataTableOptions,
+  FilterColumn,
+  TableActionColumn,
+  ActionButton,
+  DeleteButton,
+  EditButton,
+  Messager,
+  Dialoger,
+  FormColumn,
+} from "@maketribe/dm";
+import { defineDataTable } from "../../define-data-table";
+import { Member, MemberForm, MemberResult } from "./MemberForm";
+
+export type MemberTableItem = Omit<Member, "password" | "confirmPassword">;
+
+export class MemberTable extends DataTable<MemberResult, MemberTableItem> {
+  activeMemberForm: MemberForm;
+
+  isShowActiveMemberForm: boolean;
+
+  constructor(options: DataTableOptions = {}) {
+    super({ name: "ms-member", ...options });
+
+    this.activeMemberForm = new MemberForm();
+
+    this.isShowActiveMemberForm = false;
+  }
+
+  protected async initialize() {
+    await super.initialize();
+
+    await this.initActiveMemberForm();
+
+    this.dataFilter.setColumns([
+      new FilterColumn({
+        name: "name",
+        label: "姓名",
+        componentInfo: "MKConditionInput",
+      }),
+      new FilterColumn({
+        name: "wechatNo",
+        label: "微信号",
+        componentInfo: "MKConditionInput",
+      }),
+      new FilterColumn({
+        name: "nickName",
+        label: "昵称",
+        componentInfo: "MKConditionInput",
+      }),
+      new FilterColumn({
+        name: "email",
+        label: "邮箱",
+        componentInfo: "MKConditionInput",
+      }),
+      new FilterColumn({
+        name: "phone",
+        label: "手机号",
+        componentInfo: "MKConditionInput",
+      }),
+      new FilterColumn({
+        name: "account",
+        label: "账号",
+        componentInfo: "MKConditionInput",
+      }),
+    ]);
+
+    this.setColumns([
+      new TableColumn({
+        name: "id",
+        label: "编号",
+        width: "190px",
+        visible: false,
+      }),
+      new TableColumn({ name: "name", label: "姓名", minWidth: "150px" }),
+      new TableColumn({ name: "nickName", label: "昵称", minWidth: "150px" }),
+      new TableColumn({
+        name: "avatar",
+        label: "头像",
+        componentInfo: "MKColumnImage",
+        width: "80px",
+      }),
+      new TableColumn({ name: "account", label: "账号", minWidth: "150px" }),
+      new TableColumn({ name: "email", label: "邮箱", minWidth: "200px" }),
+      new TableColumn({ name: "phone", label: "手机号", minWidth: "120px" }),
+      new TableColumn({ name: "wechatNo", label: "微信号", minWidth: "140px" }),
+      new TableColumn({
+        name: "valid",
+        label: "微信号",
+        minWidth: "140px",
+        visible: false,
+      }),
+      new TableActionColumn({
+        width: "200px",
+        buttons: [
+          new ActionButton({
+            label: "激活用户",
+            handler: async (row) => {
+              const response = await this.activeMemberForm.editRecord(row.id);
+
+              if (response.data.code !== 200) {
+                Messager.instance.error({ message: response.data.msg });
+                return;
+              }
+
+              this.isShowActiveMemberForm = true;
+            },
+            predicate: (member: MemberTableItem) => member.valid === 0,
+          }),
+          new ActionButton({
+            label: "重置密码",
+            handler: async (row) => {
+              const isConfirm = await Dialoger.instance.confirm({
+                title: "重置密码",
+                message: "是否重置密码",
+                type: "warning",
+                cancelButtonText: "取消",
+                confirmButtonText: "确定",
+              });
+              if (!isConfirm) {
+                return;
+              }
+              this.loadingManager.startLoading();
+
+              const response = await this.dataViewRequest.callDVRequest<
+                R<string>
+              >({
+                action: `${row.id}/password/reset`,
+              });
+
+              this.loadingManager.completeLoading();
+              if (response.data.code !== 200) {
+                Messager.instance.error({
+                  message: response.data.msg || "重置密码失败",
+                });
+                return;
+              }
+
+              const res = await Dialoger.instance.confirm({
+                title: "重置密码成功",
+                message: (
+                  <p>
+                    <span>你的新密码为{response.data.data}</span>
+                  </p>
+                ),
+                type: "warning",
+                cancelButtonText: "取消",
+                confirmButtonText: "复制",
+              });
+              if (!res) {
+                return;
+              }
+
+              navigator.clipboard.writeText(response.data.data);
+              Messager.instance.success({ message: "复制成功" });
+            },
+            predicate: (member: MemberTableItem) => member.valid === 1,
+          }),
+          new EditButton({
+            predicate: (member: MemberTableItem) => member.valid === 1,
+          }),
+          new DeleteButton(),
+        ],
+      }),
+    ]);
+  }
+
+  protected async initActiveMemberForm() {
+    const activeMemberForm = this.activeMemberForm;
+
+    await activeMemberForm.init();
+
+    activeMemberForm.setColumns([
+      activeMemberForm.getColumn("id")!,
+      new FormColumn({
+        name: "approveResult",
+        label: "是否通过",
+        defaultValue: "0",
+        componentInfo: "MKFormRadioBox",
+        required: true,
+        componentProps: {
+          options: [
+            { label: "通过", value: "1" },
+            { label: "不通过", value: "0" },
+          ],
+        },
+      }),
+      activeMemberForm.getColumn("roles")!,
+      activeMemberForm.getColumn("depts")!,
+      activeMemberForm.getColumn("memo")!,
+    ]);
+  }
+
+  async approveMember() {
+    try {
+      this.activeMemberForm.getLoadingManager().startLoading();
+      const result = await this.activeMemberForm.httpRequest?.post(
+        "/api/dv/ms-member/apply/account/approve",
+        {
+          ...this.activeMemberForm.formatSubmitData(this.activeMemberForm.data),
+        }
+      );
+      this.activeMemberForm.getLoadingManager().completeLoading();
+
+      if (result?.data.code != 200) {
+        Messager.instance.error(result?.data.msg || "请求失败");
+        return;
+      }
+
+      Messager.instance.success({
+        message: "激活通过，密码已发送到邮箱",
+      });
+
+      this.load();
+    } catch (e) {
+      console.error(e);
+      Messager.instance.error({ message: "网络异常" });
+    }
+  }
+
+  formatItem(item: MemberResult): MemberTableItem {
+    let avatar: string | null;
+    try {
+      avatar = item.avatar ? new URL(item.avatar).toString() : null;
+    } catch (e) {
+      avatar = null;
+    }
+
+    return {
+      id: item.id,
+      name: item.name || "",
+      wechatNo: item.wechatNo || "",
+      nickName: item.nickName || "",
+      email: item.email || "",
+      phone: item.phone || "",
+      account: item.account || "",
+      avatar,
+      roles: item.roles?.map((role) => ({
+        id: role.id,
+        name: role.name || "",
+        desc: role.desc || "",
+      })),
+      depts: item.depts?.map((department) => ({
+        id: department.id,
+        name: department.name || "",
+        // memberID: department.memberID || null,
+        pid: department.pid || null,
+      })),
+      valid: item.valid,
+    };
+  }
+}
+
+defineDataTable(MemberTable);

package/src/dataview/member/index.ts

@@ -0,0 +1,2 @@
+export * from "./MemberForm";
+export * from "./MemberTable";

package/src/dataview/member/member-role/MemberRoleTable.ts

@@ -0,0 +1,23 @@
+import { DataFormOptions, DataTable, TableColumn } from "@maketribe/dm";
+
+export type MemberRole = {
+  id: string;
+  memberId: string;
+  roleId: string;
+};
+
+export class MemberRoleTable extends DataTable {
+  constructor(options: DataFormOptions = {}) {
+    super({ name: "ms-member-role", ...options });
+  }
+
+  protected async initialize() {
+    await super.initialize();
+
+    this.setColumns([
+      new TableColumn({ name: "id", label: "编号", visible: false }),
+      new TableColumn({ name: "memberId", label: "成员ID" }),
+      new TableColumn({ name: "roleId", label: "角色ID" }),
+    ]);
+  }
+}

package/src/dataview/menu/MenuForm.ts

@@ -0,0 +1,192 @@
+import {
+  DataForm,
+  DataFormOptions,
+  DataFormType,
+  FormColumn,
+  FormDetailColumn,
+  isWhereFilter,
+} from "@maketribe/dm";
+import { defineDataForm } from "../../define-data-form";
+import { RouteTable } from "../route/RouteTable";
+import { MenuTable } from "./MenuTable";
+import { RouteForm, RouteResult } from "../route/RouteForm";
+import {
+  PermissionPointDefine,
+  PermissionPointDefineForm,
+  PermissionPointDefineTable,
+} from "./permission-point";
+import { MenuType } from "../../constants";
+
+export type MenuResult = {
+  id: string;
+  title: string | null;
+  iconName: string | null;
+  pid: string | null;
+  routeId: string;
+  sort: string;
+  type: string;
+  routes: RouteResult[];
+  permissionPoints: PermissionPointDefine[];
+};
+
+export type MenuItem = {
+  id: string;
+  title: string;
+  iconName: string;
+  pid: string;
+  routeId: string;
+  sort: string;
+  type: string;
+  routes: RouteResult[];
+  permissionPoints: PermissionPointDefine[];
+};
+
+export class MenuForm extends DataForm<MenuResult, MenuItem> {
+  constructor(options: DataFormOptions = {}) {
+    super({ name: "ms-menu", ...options });
+  }
+
+  protected async initialize() {
+    await super.initialize();
+
+    const menuTable = this.register(new MenuTable({ pageSize: 10 }));
+
+    if (isWhereFilter(menuTable.dataFilter)) {
+      menuTable.dataFilter
+        .getDefaultGroup()
+        .addCondition(
+          "type",
+          "in",
+          `(${[MenuType.Container, MenuType.SystemSettings]
+            .map((menuType) => parseInt(menuType))
+            .join(",")})`
+        );
+    }
+
+    const routeTable = this.register(new RouteTable({ pageSize: 10 }));
+
+    this.setColumns([
+      new FormColumn({ name: "id", label: "编号" }),
+      new FormColumn({ name: "title", label: "菜单描述", required: true }),
+      new FormColumn({
+        name: "iconName",
+        label: "图标",
+        componentInfo: "MKFormIconSelect",
+        required: true,
+      }),
+      new FormColumn({
+        name: "type",
+        label: "菜单类型",
+        componentInfo: "MKFormDataSelect",
+        defaultValue: MenuType.Menu,
+        required: true,
+        componentProps: {
+          options: [
+            { value: MenuType.Container, label: "菜单组" },
+            { value: MenuType.Menu, label: "菜单" },
+            { value: MenuType.SystemSettings, label: "系统设置" },
+          ],
+        },
+      }),
+      new FormColumn({
+        name: "routeId",
+        label: "默认路由",
+        componentInfo: "MKFormDataTableSelect",
+        componentProps: {
+          labelFieldName: "title",
+          dataTable: routeTable,
+        },
+      }),
+      new FormColumn({
+        name: "pid",
+        label: "父菜单",
+        componentInfo: "MKFormDataTableSelect",
+        componentProps: {
+          labelFieldName: "title",
+          dataTable: menuTable,
+        },
+      }),
+      new FormColumn({ name: "sort", label: "排序", defaultValue: "0" }),
+      new FormDetailColumn({
+        name: "routes",
+        label: "该菜单所属路由定义",
+        associationFieldName: "menuId",
+        detailForm: this.register(new RouteForm()),
+        detailTable: this.register(new RouteTable()),
+      }),
+      new FormDetailColumn({
+        name: "permissionPoints",
+        label: "该菜单所属权限定义",
+        associationFieldName: "menuId",
+        detailForm: this.register(new PermissionPointDefineForm()),
+        detailTable: this.register(new PermissionPointDefineTable()),
+      }),
+    ]);
+
+    this.dataFormTypeChangeEvent.on(({ dataFormType }) => {
+      if (dataFormType === DataFormType.UPDATE) {
+        const routeTableDataFilter = routeTable.dataFilter;
+        if (isWhereFilter(routeTableDataFilter)) {
+          routeTableDataFilter.getDefaultGroup().clear();
+          routeTableDataFilter
+            .getDefaultGroup()
+            .addCondition("menuId", "=", this.data!.id);
+        }
+      }
+    });
+
+    const handleMenuTypeChange = () => {
+      const visible = this.data?.type === MenuType.Menu;
+
+      this.getColumn("routeId")!.visible = visible;
+      this.getColumn("routes")!.visible = visible;
+      this.getColumn("permissionPoints")!.visible = visible;
+    };
+
+    this.formItemValueChangeEvent.on(({ formItem }) => {
+      if (formItem.name === "type") {
+        handleMenuTypeChange();
+      }
+    });
+
+    this.dataChangeEvent.on(handleMenuTypeChange);
+
+    this.dataFormTypeChangeEvent.on(({ dataFormType }) => {
+      this.getColumn("type")!.disabled = dataFormType !== DataFormType.ADD;
+    });
+  }
+
+  formatSubmitData(data: any) {
+    const permissionPoints =
+      data.type === MenuType.Menu ? data.permissionPoints : [];
+    const routes = data.type === MenuType.Menu ? data.routes : [];
+
+    const parsedType = parseInt(data.type);
+
+    return {
+      ...data,
+      type: isNaN(parsedType) ? parseInt(MenuType.Menu) : parsedType,
+      iconName: data.iconName || null,
+      pid: data.pid || null,
+      routeId: data.routeId || null,
+      permissionPoints,
+      routes,
+    };
+  }
+
+  formatItem(item: MenuResult): MenuItem {
+    return {
+      id: item.id,
+      title: item.title || "",
+      iconName: item.iconName || "",
+      pid: item.pid || "",
+      routeId: item.routeId,
+      type: item.type ? `${item.type}` : "1",
+      sort: item.sort || "0",
+      routes: item.routes || [],
+      permissionPoints: item.permissionPoints || [],
+    };
+  }
+}
+
+defineDataForm(MenuForm);

package/src/dataview/menu/MenuTable.ts

@@ -0,0 +1,40 @@
+import {
+  DataTable,
+  DataTableOptions,
+  TableActionColumn,
+  TableColumn,
+} from "@maketribe/dm";
+import { defineDataTable } from "../../define-data-table";
+import type { MenuItem, MenuResult } from "./MenuForm";
+import { DVQueryable } from "@maketribe/request";
+
+export class MenuTable<T extends MenuItem = MenuItem> extends DataTable<
+  MenuResult,
+  T
+> {
+  constructor(options: Omit<DataTableOptions, "name"> = {}) {
+    super({ name: "ms-menu", ...options });
+  }
+
+  protected async initialize() {
+    await super.initialize();
+
+    this.setColumns([
+      new TableColumn({ name: "id", label: "编号", visible: false }),
+      new TableColumn({ name: "title", label: "菜单描述" }),
+      new TableActionColumn(),
+    ]);
+  }
+
+  formatItem(item: MenuResult): T {
+    return {
+      id: item.id,
+      title: item.title || "",
+      iconName: item.iconName || "",
+      pid: item.pid || "",
+      routeId: item.routeId,
+    } as T;
+  }
+}
+
+defineDataTable(MenuTable);

package/src/dataview/menu/MenuTree.ts

@@ -0,0 +1,112 @@
+import {
+  DataTableOptions,
+  DataTree,
+  DataTreeNode,
+  TableActionColumn,
+  TableColumn,
+  isWhereFilter,
+} from "@maketribe/dm";
+import { R, CancelToken } from "@maketribe/request";
+import { MenuItem } from "./MenuForm";
+import { defineDataTree } from "../../define-data-tree";
+import { MenuType } from "../../constants";
+
+export type MenuItemNode = MenuItem & { children: MenuItemNode[] };
+
+export class MenuTree extends DataTree<MenuItemNode> {
+  constructor(options: Omit<DataTableOptions, "name"> = {}) {
+    super({ name: "ms-menu", ...options });
+  }
+
+  protected async initialize() {
+    await super.initialize();
+
+    this.setColumns([
+      new TableColumn({ name: "id", label: "编号", visible: false }),
+      new TableColumn({ name: "title", label: "菜单描述" }),
+      new TableActionColumn(),
+    ]);
+  }
+
+  protected async loadRequest(params: Record<string, any>) {
+    if (isWhereFilter(this.dataFilter)) {
+      const defaultGroup = this.dataFilter.getDefaultGroup();
+      defaultGroup.clear();
+
+      defaultGroup.addCondition("pid", "is", "null");
+    }
+
+    const response = await this.dataViewRequest.list<
+      R<MenuItemNode[]> & { totalRecCount: string }
+    >({
+      data: {
+        pn: this.currentPage,
+        pc: this.pageSize,
+        ...this.getLoadParams(params),
+      },
+      cancelToken: new CancelToken((cancel) => {
+        this.loadCancel = cancel;
+      }),
+    });
+
+    this.loadCancel = null;
+
+    if (response.data.code === 200) {
+      for (const item of response.data.data) {
+        item.type += "";
+        item.children = item.children || [];
+      }
+    }
+
+    return response;
+  }
+
+  createDataTreeNode(data: MenuItemNode): DataTreeNode<MenuItemNode> {
+    const dataTreeNode = new (class extends DataTreeNode<MenuItemNode> {
+      get isLeaf() {
+        return this.data!.type === MenuType.Menu;
+      }
+
+      protected async loadRequest(params: Record<string, any>) {
+        if (isWhereFilter(this.dataFilter)) {
+          const defaultGroup = this.dataFilter.getDefaultGroup();
+          defaultGroup.clear();
+
+          defaultGroup.addCondition("pid", "=", this.data!.id);
+        }
+
+        const response = await this.dataViewRequest.allList<
+          R<MenuItemNode[]> & { totalRecCount: string }
+        >({
+          data: { ...this.getLoadParams(params) },
+          cancelToken: new CancelToken((cancel) => {
+            this.loadCancel = cancel;
+          }),
+        });
+
+        this.loadCancel = null;
+
+        if (response.data.code === 200) {
+          for (const item of response.data.data) {
+            item.type += "";
+            item.children = item.children || [];
+          }
+        }
+
+        return response;
+      }
+    })({
+      name: this.name,
+    });
+
+    dataTreeNode.setTree(this);
+
+    dataTreeNode.setData(data);
+
+    return dataTreeNode;
+  }
+}
+
+(window as any).MenuTree = MenuTree;
+
+defineDataTree(MenuTree);

package/src/dataview/menu/index.ts

@@ -0,0 +1,4 @@
+export * from "./MenuForm";
+export * from "./MenuTable";
+export * from "./MenuTree";
+export * from "./permission-point";

package/src/dataview/menu/permission-point/PermissionPointDefineForm.ts

@@ -0,0 +1,30 @@
+import { DataForm, DataFormOptions, FormColumn } from "@maketribe/dm";
+
+export type PermissionPointDefine = {
+  id: string;
+  menuId: string;
+  key: string;
+  name: string;
+};
+
+export class PermissionPointDefineForm extends DataForm<PermissionPointDefine> {
+  constructor(options: DataFormOptions = {}) {
+    super({ name: "ms-permission-point-def", ...options });
+  }
+
+  protected async initialize() {
+    await super.initialize();
+    
+    this.setColumns([
+      new FormColumn({ name: "id", label: "编号" }),
+      new FormColumn({
+        name: "menuId",
+        label: "所属菜单",
+        visible: false,
+        required: true,
+      }),
+      new FormColumn({ name: "key", label: "权限键", required: true }),
+      new FormColumn({ name: "name", label: "权限描述", required: true }),
+    ]);
+  }
+}

package/src/dataview/menu/permission-point/PermissionPointDefineTable.ts

@@ -0,0 +1,32 @@
+import {
+  DataTable,
+  DataTableOptions,
+  FilterColumn,
+  TableActionColumn,
+  TableColumn,
+} from "@maketribe/dm";
+import { PermissionPointDefine } from "./PermissionPointDefineForm";
+
+export class PermissionPointDefineTable<
+  T extends PermissionPointDefine = PermissionPointDefine
+> extends DataTable<PermissionPointDefine, T> {
+  constructor(options: DataTableOptions = {}) {
+    super({ name: "ms-permission-point-def", ...options });
+  }
+
+  protected async initialize() {
+    await super.initialize();
+
+    this.dataFilter.setColumns([
+      new FilterColumn({ name: "key", label: "权限键" }),
+      new FilterColumn({ name: "name", label: "权限描述" }),
+    ]);
+
+    this.setColumns([
+      new TableColumn({ name: "id", label: "编号", visible: false }),
+      new TableColumn({ name: "key", label: "权限键" }),
+      new TableColumn({ name: "name", label: "权限描述" }),
+      new TableActionColumn(),
+    ]);
+  }
+}

package/src/dataview/menu/permission-point/index.ts

@@ -0,0 +1,2 @@
+export * from "./PermissionPointDefineForm";
+export * from "./PermissionPointDefineTable";