@pisell/private-materials 6.6.28 → 6.6.30

package/lib/plus/saasRole/index.js

@@ -0,0 +1,780 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/plus/saasRole/index.tsx
+var saasRole_exports = {};
+__export(saasRole_exports, {
+  default: () => saasRole_default
+});
+module.exports = __toCommonJS(saasRole_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_ahooks = require("ahooks");
+var import_icons = require("@ant-design/icons");
+var import_materials = require("@pisell/materials");
+var import_classnames = __toESM(require("classnames"));
+var import_utils = require("@pisell/utils");
+var import_utils2 = require("../clientName/utils");
+var import_utils3 = require("../../utils");
+var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
+var import_locales = __toESM(require("./locales"));
+var import_serve = require("./serve");
+var import_PermissionManager = __toESM(require("./components/PermissionManager/index"));
+var import_index = require("./index.less");
+var AntdLayout = import_antd.Layout;
+var AntdSider = import_antd.Layout.Sider;
+var AntdContent = import_antd.Layout.Content;
+var AntdTag = import_antd.Tag;
+var AntdDrawer = import_antd.Drawer;
+var RoleCard = ({
+  role,
+  isSelected,
+  onSelect,
+  onEdit,
+  onDelete,
+  getText,
+  getLocaleText
+}) => {
+  const menuItems = [
+    {
+      key: "edit",
+      label: getText("pisell2.saas.role.edit"),
+      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.EditOutlined, null),
+      onClick: (e) => {
+        e.domEvent.stopPropagation();
+        onEdit == null ? void 0 : onEdit();
+      }
+    },
+    {
+      key: "delete",
+      label: getText("pisell2.saas.role.delete"),
+      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.DeleteOutlined, null),
+      danger: true,
+      onClick: (e) => {
+        e.domEvent.stopPropagation();
+        onDelete == null ? void 0 : onDelete();
+      }
+    }
+  ];
+  return /* @__PURE__ */ import_react.default.createElement("div", { onClick: onSelect }, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Card,
+    {
+      className: (0, import_classnames.default)("saas-role-card", {
+        "saas-role-card-selected": isSelected
+      }),
+      hoverable: true
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: "saas-role-card-content",
+        style: { position: "relative" }
+      },
+      /* @__PURE__ */ import_react.default.createElement("h4", { className: "saas-role-card-title", style: { paddingRight: 24 } }, getLocaleText(role.name)),
+      /* @__PURE__ */ import_react.default.createElement("p", { className: "saas-role-card-count" }, role.tenant_account_count || 0, " ", getText("pisell2.saas.role.members-text"))
+    ),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Dropdown,
+      {
+        menu: { items: menuItems },
+        trigger: ["click"],
+        placement: "bottomRight"
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          onClick: (e) => e.stopPropagation(),
+          style: {
+            fontSize: 16,
+            cursor: "pointer",
+            display: "inline-flex",
+            alignItems: "center",
+            padding: "0 4px"
+          }
+        },
+        /* @__PURE__ */ import_react.default.createElement(import_icons.MoreOutlined, null)
+      )
+    )
+  ));
+};
+var SaasRole = ({ className, style }) => {
+  var _a, _b, _c;
+  const context = (0, import_useEngineContext.default)();
+  const utils = ((_a = context == null ? void 0 : context.appHelper) == null ? void 0 : _a.utils) || {};
+  if (utils == null ? void 0 : utils.request) {
+    import_utils3.request.setRequest(utils.request);
+  }
+  import_utils.locales.init(import_locales.default, ((_c = (_b = context == null ? void 0 : context.engine) == null ? void 0 : _b.props) == null ? void 0 : _c.locale) || "en");
+  const getText = import_utils.locales.getText;
+  const getLocaleText = (0, import_react.useCallback)(
+    (text) => {
+      var _a2;
+      if (!text) return "";
+      if (typeof text === "string") return text;
+      const { translation } = ((_a2 = context == null ? void 0 : context.appHelper) == null ? void 0 : _a2.utils) || {};
+      return translation(text);
+    },
+    [context]
+  );
+  const [selectedRoleId, setSelectedRoleId] = (0, import_react.useState)(null);
+  const [addMemberDrawerVisible, setAddMemberDrawerVisible] = (0, import_react.useState)(false);
+  const [selectedMemberIds, setSelectedMemberIds] = (0, import_react.useState)([]);
+  const [memberFilterKeyword, setMemberFilterKeyword] = (0, import_react.useState)("");
+  const [activeTab, setActiveTab] = (0, import_react.useState)("members");
+  const [createModalVisible, setCreateModalVisible] = (0, import_react.useState)(false);
+  const [createForm] = import_antd.Form.useForm();
+  const [roleForEdit, setRoleForEdit] = (0, import_react.useState)(null);
+  const [editForm] = import_antd.Form.useForm();
+  const [modal, contextHolder] = import_antd.Modal.useModal();
+  const {
+    data: roles = [],
+    loading: rolesLoading,
+    run: refreshRoles
+  } = (0, import_ahooks.useRequest)(import_serve.getRoles, {
+    onSuccess: (data) => {
+      if (data.length > 0 && !selectedRoleId) {
+        setSelectedRoleId(data[0].id);
+      } else if (data.length === 0) {
+        setSelectedRoleId(null);
+      }
+    }
+  });
+  const selectedRole = (0, import_react.useMemo)(
+    () => roles.find((role) => role.id === selectedRoleId),
+    [roles, selectedRoleId]
+  );
+  const { data: { list: extensionFormList = [] } = {} } = (0, import_ahooks.useRequest)(
+    import_serve.getExtensionFormList,
+    {
+      defaultParams: [{ skip: 0, num: 499, type: "custom" }]
+    }
+  );
+  const extensionTableOptions = (0, import_react.useMemo)(() => {
+    const disabledExtensionFormIds = roleForEdit ? roles.filter(
+      (role) => {
+        var _a2;
+        return role.id !== roleForEdit.id && ((_a2 = role.metadata) == null ? void 0 : _a2.extension_form_id);
+      }
+    ).map((role) => {
+      var _a2;
+      return (_a2 = role.metadata) == null ? void 0 : _a2.extension_form_id;
+    }) : [];
+    return (extensionFormList == null ? void 0 : extensionFormList.map((item) => {
+      return {
+        label: item.title,
+        value: item.id,
+        disabled: disabledExtensionFormIds.includes(item.id)
+      };
+    })) || [];
+  }, [extensionFormList, roles, roleForEdit]);
+  (0, import_react.useEffect)(() => {
+    document.body.id = "body";
+  }, [className, style]);
+  const {
+    data: membersData,
+    loading: membersLoading,
+    run: refreshMembers
+  } = (0, import_ahooks.useRequest)(
+    async () => {
+      if (!selectedRoleId) return { list: [], count: 0 };
+      return (0, import_serve.getRoleMembers)({
+        tenant_role_ids: [selectedRoleId],
+        with: ["account", "roles"],
+        page: 1,
+        size: 499
+      });
+    },
+    {
+      refreshDeps: [selectedRoleId],
+      ready: !!selectedRoleId
+    }
+  );
+  const { data: availablePermissions = {} } = (0, import_ahooks.useRequest)(import_serve.getRolePermission, {});
+  const {
+    data: allMembersData,
+    loading: allMembersLoading,
+    run: fetchAllMembers
+  } = (0, import_ahooks.useRequest)(import_serve.getAllMembers, {
+    defaultParams: [{ page: 1, size: 100 }],
+    manual: true
+  });
+  const { runAsync: createRoleRun, loading: createRoleLoading } = (0, import_ahooks.useRequest)(
+    import_serve.createRole,
+    { manual: true }
+  );
+  const { runAsync: updateRoleRun, loading: updateRoleLoading } = (0, import_ahooks.useRequest)(
+    import_serve.updateRole,
+    { manual: true }
+  );
+  const { runAsync: deleteRoleRun, loading: deleteRoleLoading } = (0, import_ahooks.useRequest)(
+    import_serve.deleteRole,
+    { manual: true }
+  );
+  const { runAsync: updateRoleMembersRun, loading: updateRoleMembersLoading } = (0, import_ahooks.useRequest)(import_serve.updateRoleMembers, { manual: true });
+  const { runAsync: removeRoleMemberRun, loading: removeRoleMemberLoading } = (0, import_ahooks.useRequest)(import_serve.removeRoleMember, { manual: true });
+  const handleOpenCreateModal = () => {
+    createForm.resetFields();
+    setCreateModalVisible(true);
+  };
+  const handleCreateRole = async () => {
+    try {
+      const values = await createForm.validateFields();
+      const roleData = {
+        ...values,
+        permission: ["*"]
+        // 默认全权限，后续可改为选择
+      };
+      const newRole = await createRoleRun(roleData);
+      setCreateModalVisible(false);
+      createForm.resetFields();
+      refreshRoles();
+      setSelectedRoleId(newRole.id);
+    } catch (error) {
+    }
+  };
+  const handleOpenEditModal = (role) => {
+    editForm.setFieldsValue({
+      name: role.name,
+      code: role.code,
+      description: role.description,
+      metadata: role.metadata
+    });
+    setRoleForEdit(role);
+  };
+  const handleEditRole = async () => {
+    if (!roleForEdit) return;
+    try {
+      const values = await editForm.validateFields();
+      await updateRoleRun(roleForEdit.id, values);
+      setRoleForEdit(null);
+      refreshRoles();
+    } catch (error) {
+    }
+  };
+  const handleDeleteRole = async (role) => {
+    if (roles.length < 2) {
+      modal.warning({
+        title: getText("pisell2.saas.role.at-least-one-role")
+      });
+      return;
+    }
+    if (!(role == null ? void 0 : role.id)) return;
+    if (Number(role == null ? void 0 : role.tenant_account_count) > 0) {
+      modal.warning({
+        title: getText("pisell2.saas.role.role-has-members")
+      });
+      return;
+    }
+    const roleId = role.id;
+    try {
+      await deleteRoleRun(roleId);
+      if (roleId === selectedRoleId) {
+        setSelectedRoleId(null);
+      }
+      refreshRoles();
+    } catch (error) {
+    }
+  };
+  const handleOpenAddMemberDrawer = async () => {
+    if (!selectedRoleId) return;
+    try {
+      await fetchAllMembers({ page: 1, size: 100 });
+      setSelectedMemberIds([]);
+      setAddMemberDrawerVisible(true);
+    } catch (error) {
+    }
+  };
+  const handleAddMembers = async () => {
+    if (!selectedRoleId || selectedMemberIds.length === 0) return;
+    try {
+      const existingMemberIds = (membersData == null ? void 0 : membersData.list.map((m) => m.id)) || [];
+      const finalMemberIds = [
+        .../* @__PURE__ */ new Set([...selectedMemberIds, ...existingMemberIds])
+      ];
+      await updateRoleMembersRun(selectedRoleId, finalMemberIds);
+      setAddMemberDrawerVisible(false);
+      refreshMembers();
+      refreshRoles();
+    } catch (error) {
+    }
+  };
+  const handleRemoveMember = async (member) => {
+    if (!selectedRoleId) return;
+    try {
+      await removeRoleMemberRun(selectedRoleId, member.id);
+      refreshMembers();
+      refreshRoles();
+    } catch (error) {
+    }
+  };
+  const handlePermissionChange = async (permissions) => {
+    if (!selectedRole) return;
+    try {
+      await updateRoleRun(selectedRole.id, {
+        ...selectedRole,
+        permission: permissions
+      });
+      refreshRoles();
+    } catch (error) {
+      console.error("Update permission error:", error);
+    }
+  };
+  const memberColumns = [
+    {
+      title: getText("pisell2.saas.role.member-name"),
+      dataIndex: "nickname",
+      key: "nickname",
+      width: 150,
+      render: (text, record) => {
+        var _a2;
+        return record.nickname || ((_a2 = record.account) == null ? void 0 : _a2.name) || "-";
+      }
+    },
+    {
+      title: getText("pisell2.saas.role.member-id"),
+      dataIndex: "member_id",
+      key: "member_id",
+      width: 120,
+      render: (text) => text || "-"
+    },
+    {
+      title: getText("pisell2.saas.role.member-email"),
+      key: "email",
+      width: 250,
+      render: (_, record) => {
+        var _a2;
+        return ((_a2 = record.account) == null ? void 0 : _a2.email) || "-";
+      }
+    },
+    {
+      title: getText("pisell2.saas.role.member-mobile"),
+      key: "mobile",
+      width: 120,
+      render: (_, record) => {
+        var _a2;
+        return ((_a2 = record.account) == null ? void 0 : _a2.phone) || "-";
+      }
+    },
+    {
+      title: getText("pisell2.saas.role.actions"),
+      key: "actions",
+      width: 100,
+      fixed: "right",
+      render: (_, record) => {
+        let tip = getText("pisell2.saas.role.confirm-remove-member");
+        if (tip.includes("{name}")) {
+          tip = /* @__PURE__ */ import_react.default.createElement("span", null, tip.split("{name}")[0], /* @__PURE__ */ import_react.default.createElement("span", { style: { fontWeight: "bold" } }, (0, import_utils2.getClientName)(record.account)), tip.split("{name}")[1]);
+        }
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Button,
+          {
+            type: "text",
+            danger: true,
+            icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-user-minus-01" }),
+            onClick: (e) => {
+              e.stopPropagation();
+              import_antd.Modal.confirm({
+                title: getText("pisell2.saas.role.remove-member"),
+                content: tip,
+                okText: getText("pisell2.saas.role.confirm"),
+                cancelText: getText("pisell2.saas.role.cancel"),
+                onOk: () => handleRemoveMember(record),
+                okButtonProps: { danger: true }
+              });
+            }
+          }
+        );
+      }
+    }
+  ];
+  const availableMemberColumns = [
+    {
+      title: getText("pisell2.saas.role.member-name"),
+      dataIndex: "nickname",
+      key: "nickname",
+      render: (text, record) => {
+        var _a2;
+        return record.nickname || ((_a2 = record.account) == null ? void 0 : _a2.name) || "-";
+      }
+    },
+    {
+      title: getText("pisell2.saas.role.member-id"),
+      dataIndex: "member_id",
+      key: "member_id",
+      render: (text) => text || "-"
+    },
+    {
+      title: getText("pisell2.saas.role.member-current-roles"),
+      dataIndex: "roles",
+      key: "roles",
+      width: 200,
+      render: (roles2) => /* @__PURE__ */ import_react.default.createElement("span", null, roles2 == null ? void 0 : roles2.map((role) => /* @__PURE__ */ import_react.default.createElement(AntdTag, { key: role.id }, getLocaleText(role.name))))
+    }
+  ];
+  const renderContent = () => {
+    if (!selectedRole) {
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-empty" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Empty, { description: getText("pisell2.saas.role.no-role-selected") }));
+    }
+    const tabItems = [
+      {
+        key: "members",
+        label: getText("pisell2.saas.role.members"),
+        children: /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-members" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-members-header" }, /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Input,
+          {
+            prefix: /* @__PURE__ */ import_react.default.createElement(import_icons.SearchOutlined, null),
+            placeholder: getText("pisell2.saas.role.search"),
+            allowClear: true,
+            style: { width: 300 },
+            onChange: (e) => setMemberFilterKeyword(e.target.value)
+          }
+        ), /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Button,
+          {
+            type: "primary",
+            icon: /* @__PURE__ */ import_react.default.createElement(import_icons.PlusOutlined, null),
+            onClick: handleOpenAddMemberDrawer
+          },
+          getText("pisell2.saas.role.add-member")
+        )), /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Table,
+          {
+            columns: memberColumns,
+            dataSource: membersData == null ? void 0 : membersData.list.filter(
+              (member) => {
+                var _a2, _b2, _c2, _d;
+                return memberFilterKeyword ? ((_a2 = member.nickname) == null ? void 0 : _a2.toLowerCase().includes(memberFilterKeyword.toLowerCase())) || ((_c2 = (_b2 = member.account) == null ? void 0 : _b2.email) == null ? void 0 : _c2.toLowerCase().includes(memberFilterKeyword.toLowerCase())) || ((_d = member.member_id) == null ? void 0 : _d.toLowerCase().includes(memberFilterKeyword.toLowerCase())) : true;
+              }
+            ),
+            rowKey: "id",
+            loading: membersLoading,
+            pagination: {
+              total: (membersData == null ? void 0 : membersData.count) || 0,
+              showSizeChanger: true
+            },
+            scroll: { x: "max-content" },
+            locale: {
+              emptyText: getText("pisell2.saas.role.no-members-in-role")
+            }
+          }
+        ))
+      },
+      {
+        key: "permissions",
+        label: getText("pisell2.saas.role.permissions"),
+        children: /* @__PURE__ */ import_react.default.createElement(
+          import_PermissionManager.default,
+          {
+            availablePermissions,
+            currentPermissions: (selectedRole == null ? void 0 : selectedRole.permission) || [],
+            onChange: handlePermissionChange,
+            getLocaleText,
+            getText,
+            updating: updateRoleLoading
+          }
+        )
+      }
+    ];
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-detail" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-detail-header" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-detail-title" }, /* @__PURE__ */ import_react.default.createElement("h2", null, getLocaleText(selectedRole.name))), /* @__PURE__ */ import_react.default.createElement("p", { className: "saas-role-detail-description" }, getLocaleText(selectedRole.description))), /* @__PURE__ */ import_react.default.createElement(import_antd.Tabs, { activeKey: activeTab, onChange: setActiveTab, items: tabItems }));
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("saas-role", className), style }, /* @__PURE__ */ import_react.default.createElement(AntdLayout, { className: "saas-role-layout" }, /* @__PURE__ */ import_react.default.createElement(AntdSider, { width: 300, className: "saas-role-sider", theme: "light" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-header" }, /* @__PURE__ */ import_react.default.createElement("h3", null, getText("pisell2.saas.role.title")), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
+    {
+      type: "primary",
+      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.PlusOutlined, null),
+      onClick: handleOpenCreateModal
+    },
+    getText("pisell2.saas.role.create")
+  )), /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-role-list" }, roles.map((role) => /* @__PURE__ */ import_react.default.createElement(
+    RoleCard,
+    {
+      key: role.id,
+      role,
+      isSelected: role.id === selectedRoleId,
+      onSelect: () => setSelectedRoleId(role.id),
+      onEdit: () => handleOpenEditModal(role),
+      onDelete: () => handleDeleteRole(role),
+      getText,
+      getLocaleText
+    }
+  )))), /* @__PURE__ */ import_react.default.createElement(AntdContent, { className: "saas-role-content" }, renderContent())), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Modal,
+    {
+      title: getText("pisell2.saas.role.create-role"),
+      open: createModalVisible,
+      onOk: handleCreateRole,
+      onCancel: () => setCreateModalVisible(false),
+      confirmLoading: createRoleLoading,
+      okText: getText("pisell2.saas.role.save"),
+      cancelText: getText("pisell2.saas.role.cancel"),
+      width: 600,
+      styles: {
+        header: {
+          padding: "0px 0px 8px 0px"
+        }
+      }
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form: createForm, layout: "vertical", size: "large" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.name"),
+        name: "name",
+        rules: [
+          {
+            required: true,
+            message: getText("pisell2.saas.role.enter-role-name")
+          }
+        ]
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_materials.BaseTranslation,
+        {
+          placeholder: getText("pisell2.saas.role.enter-role-name"),
+          maxLength: 100
+        }
+      )
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.code"),
+        name: "code",
+        rules: [
+          {
+            required: true,
+            message: getText("pisell2.saas.role.enter-role-code")
+          },
+          {
+            pattern: /^[a-z0-9\-_.]+$/,
+            message: getText("pisell2.saas.role.role-code-format")
+          }
+        ],
+        extra: getText("pisell2.saas.role.role-code-format")
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Input,
+        {
+          placeholder: getText("pisell2.saas.role.enter-role-code")
+        }
+      )
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.description"),
+        name: "description"
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_materials.BaseTranslation,
+        {
+          placeholder: getText(
+            "pisell2.saas.role.enter-role-description"
+          ),
+          type: "textarea",
+          rows: 4,
+          showCount: true,
+          maxLength: 500
+        }
+      )
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.extension-table"),
+        name: ["metadata", "extension_form_id"],
+        extra: getText("pisell2.saas.role.select-extension-table")
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Select,
+        {
+          placeholder: getText(
+            "pisell2.saas.role.select-extension-table"
+          ),
+          options: extensionTableOptions,
+          allowClear: true
+        }
+      )
+    ))
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Modal,
+    {
+      title: getText("pisell2.saas.role.edit-role"),
+      open: !!roleForEdit,
+      onOk: handleEditRole,
+      onCancel: () => setRoleForEdit(null),
+      confirmLoading: updateRoleLoading,
+      okText: getText("pisell2.saas.role.save"),
+      cancelText: getText("pisell2.saas.role.cancel"),
+      width: 600,
+      styles: {
+        header: {
+          padding: "0px 0px 8px 0px"
+        }
+      }
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form: editForm, layout: "vertical", size: "large" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.name"),
+        name: "name",
+        rules: [
+          {
+            required: true,
+            message: getText("pisell2.saas.role.enter-role-name")
+          }
+        ]
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_materials.BaseTranslation,
+        {
+          placeholder: getText("pisell2.saas.role.enter-role-name"),
+          maxLength: 100
+        }
+      )
+    ), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: getText("pisell2.saas.role.code"), name: "code" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Input,
+      {
+        placeholder: getText("pisell2.saas.role.enter-role-code"),
+        disabled: true
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.description"),
+        name: "description"
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_materials.BaseTranslation,
+        {
+          placeholder: getText(
+            "pisell2.saas.role.enter-role-description"
+          ),
+          type: "textarea",
+          rows: 4,
+          showCount: true,
+          maxLength: 500
+        }
+      )
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        label: getText("pisell2.saas.role.extension-table"),
+        name: ["metadata", "extension_form_id"],
+        extra: getText("pisell2.saas.role.select-extension-table")
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Select,
+        {
+          placeholder: getText(
+            "pisell2.saas.role.select-extension-table"
+          ),
+          options: extensionTableOptions,
+          allowClear: true,
+          showSearch: true,
+          optionFilterProp: "label",
+          filterSort: (optionA, optionB) => ((optionA == null ? void 0 : optionA.label) ?? "").toLowerCase().localeCompare(((optionB == null ? void 0 : optionB.label) ?? "").toLowerCase())
+        }
+      )
+    ))
+  ), /* @__PURE__ */ import_react.default.createElement(
+    AntdDrawer,
+    {
+      title: getText("pisell2.saas.role.add-members-to-role"),
+      open: addMemberDrawerVisible,
+      onClose: () => setAddMemberDrawerVisible(false),
+      width: 600,
+      footer: /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          style: {
+            textAlign: "right",
+            padding: "8px 0px"
+          }
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Button,
+          {
+            onClick: () => setAddMemberDrawerVisible(false),
+            style: { marginRight: 8 }
+          },
+          getText("pisell2.saas.role.cancel")
+        ),
+        /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Button,
+          {
+            onClick: handleAddMembers,
+            type: "primary",
+            loading: updateRoleMembersLoading,
+            disabled: selectedMemberIds.length === 0
+          },
+          getText("pisell2.saas.role.add")
+        )
+      )
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Input,
+      {
+        placeholder: getText("pisell2.saas.role.search"),
+        allowClear: true,
+        style: { marginBottom: 16 },
+        prefix: /* @__PURE__ */ import_react.default.createElement(import_icons.SearchOutlined, null),
+        onChange: (e) => {
+          fetchAllMembers({
+            page: 1,
+            size: 100,
+            search: e.target.value
+          });
+        }
+      }
+    ),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Table,
+      {
+        tableLayout: "fixed",
+        columns: availableMemberColumns,
+        dataSource: ((allMembersData == null ? void 0 : allMembersData.list) || []).filter(
+          (m) => !(membersData == null ? void 0 : membersData.list.some((existing) => existing.id === m.id))
+        ),
+        rowKey: "id",
+        rowSelection: {
+          preserveSelectedRowKeys: true,
+          selectedRowKeys: selectedMemberIds,
+          onChange: (selectedKeys) => {
+            setSelectedMemberIds(selectedKeys);
+            console.log(selectedKeys);
+          }
+        },
+        loading: allMembersLoading,
+        pagination: false,
+        size: "middle",
+        bordered: false,
+        locale: {
+          emptyText: getText("pisell2.saas.role.all-members-in-role")
+        }
+      }
+    )
+  )), /* @__PURE__ */ import_react.default.createElement(import_antd.ConfigProvider, { prefixCls: "pisell-lowcode" }, contextHolder));
+};
+var saasRole_default = SaasRole;