@pisell/private-materials 3.4.74 → 3.4.75

package/lib/plus/saasRole/components/PermissionManager/index.js

@@ -0,0 +1,159 @@
+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/components/PermissionManager/index.tsx
+var PermissionManager_exports = {};
+__export(PermissionManager_exports, {
+  default: () => PermissionManager_default
+});
+module.exports = __toCommonJS(PermissionManager_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_materials = require("@pisell/materials");
+var import_index = require("./index.less");
+var PERMISSION_TYPE_CONFIG = {
+  channel: {
+    titleKey: "pisell2.saas.role.channels",
+    descriptionKey: "pisell2.saas.role.control-access-channels",
+    prefix: "channel:"
+  },
+  pageType: {
+    titleKey: "pisell2.saas.role.page-types",
+    descriptionKey: "pisell2.saas.role.control-access-page-types",
+    prefix: "page:"
+  },
+  app: {
+    titleKey: "pisell2.saas.role.apps",
+    descriptionKey: "pisell2.saas.role.control-access-apps",
+    prefix: "app:"
+  },
+  systemManagement: {
+    titleKey: "pisell2.saas.role.system-management",
+    descriptionKey: "pisell2.saas.role.control-system-operations",
+    prefix: "system:"
+  }
+};
+var PermissionManager = ({
+  availablePermissions,
+  currentPermissions,
+  onChange,
+  getLocaleText,
+  getText,
+  updating
+}) => {
+  const [selectedPermissions, setSelectedPermissions] = (0, import_react.useState)([]);
+  console.log("selectedPermissions", selectedPermissions);
+  const permissionTypes = (0, import_react.useMemo)(() => {
+    if (!availablePermissions) return [];
+    return Object.keys(availablePermissions).filter((key) => {
+      var _a;
+      return ((_a = availablePermissions[key]) == null ? void 0 : _a.length) > 0;
+    }).map((key) => ({
+      type: key,
+      items: availablePermissions[key],
+      config: PERMISSION_TYPE_CONFIG[key] || {
+        titleKey: key,
+        descriptionKey: `Control access to ${key}`,
+        prefix: `${key}:`
+      }
+    }));
+  }, [availablePermissions]);
+  (0, import_react.useEffect)(() => {
+    if (currentPermissions.includes("*")) {
+      const allPermissions = permissionTypes.flatMap(
+        (pt) => pt.items.map((item) => item.code)
+      );
+      setSelectedPermissions(allPermissions);
+    } else {
+      const knownPrefixes = permissionTypes.map((pt) => pt.config.prefix);
+      const relevantPermissions = currentPermissions.filter(
+        (p) => knownPrefixes.some((prefix) => p.startsWith(prefix)) || p.includes(":")
+      );
+      setSelectedPermissions(relevantPermissions);
+    }
+  }, [currentPermissions, permissionTypes]);
+  const isTypeAllSelected = (items) => {
+    return items.length > 0 && items.every((item) => selectedPermissions.includes(item.code));
+  };
+  const handleTypeSelectAll = (items, checked) => {
+    const itemCodes = items.map((item) => item.code);
+    if (checked) {
+      const newPermissions = [...selectedPermissions];
+      itemCodes.forEach((code) => {
+        if (!newPermissions.includes(code)) {
+          newPermissions.push(code);
+        }
+      });
+      setSelectedPermissions(newPermissions);
+    } else {
+      setSelectedPermissions(
+        selectedPermissions.filter((p) => !itemCodes.includes(p))
+      );
+    }
+  };
+  const handlePermissionChange = (code, checked) => {
+    if (checked) {
+      setSelectedPermissions([...selectedPermissions, code]);
+    } else {
+      setSelectedPermissions(selectedPermissions.filter((p) => p !== code));
+    }
+  };
+  const handleSave = () => {
+    const knownPrefixes = permissionTypes.map((pt) => pt.config.prefix);
+    const otherPermissions = currentPermissions.filter(
+      (p) => !knownPrefixes.some((prefix) => p.startsWith(prefix)) && p !== "*"
+    );
+    const finalPermissions = [...otherPermissions, ...selectedPermissions];
+    onChange(finalPermissions);
+  };
+  if (!permissionTypes || permissionTypes.length === 0) {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Empty, { description: getText("pisell2.saas.role.no-permissions") });
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-manager" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-sections-container" }, permissionTypes.map(({ type, items, config }) => {
+    const isAllSelected = isTypeAllSelected(items);
+    return /* @__PURE__ */ import_react.default.createElement("div", { key: type, className: "permission-section" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-section-title" }, /* @__PURE__ */ import_react.default.createElement("h4", null, getText(config.titleKey)), /* @__PURE__ */ import_react.default.createElement("p", null, getText(config.descriptionKey))), /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-section-content" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-section-actions" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Button,
+      {
+        size: "small",
+        type: "text",
+        icon: isAllSelected ? /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-square" }) : /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-check-square-broken" }),
+        style: { padding: 0, fontSize: 12 },
+        onClick: () => handleTypeSelectAll(items, !isAllSelected)
+      },
+      isAllSelected ? getText("pisell2.saas.role.clear-all") : getText("pisell2.saas.role.select-all")
+    )), /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-items" }, items.map((item) => /* @__PURE__ */ import_react.default.createElement("div", { key: item.code, className: "permission-item" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Checkbox,
+      {
+        checked: selectedPermissions.includes(item.code),
+        onChange: (e) => handlePermissionChange(item.code, e.target.checked)
+      },
+      getLocaleText(item.name)
+    ))))));
+  })), /* @__PURE__ */ import_react.default.createElement("div", { className: "permission-manager-footer" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { type: "primary", onClick: handleSave, loading: updating }, getText("pisell2.saas.role.save"))));
+};
+var PermissionManager_default = PermissionManager;

package/lib/plus/saasRole/components/PermissionManager/index.less

@@ -0,0 +1,71 @@
+.permission-manager {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+
+  .permission-sections-container {
+    flex: 1;
+    overflow-y: auto;
+    padding: 24px;
+    border: 1px solid #f0f0f0;
+    border-radius: 8px;
+    margin-bottom: 24px;
+  }
+
+  .permission-section {
+    margin-bottom: 32px;
+    display: flex;
+    gap: 16px;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    .permission-section-title {
+      width: 40%;
+
+      h4 {
+        margin: 0 0 8px 0;
+        font-size: 16px;
+        font-weight: 600;
+        color: #262626;
+      }
+
+      p {
+        margin: 0px;
+        font-size: 14px;
+        color: #8c8c8c;
+      }
+    }
+
+    .permission-section-content {
+      width: 60%;
+    }
+
+    .permission-section-actions {
+      display: flex;
+      justify-content: flex-end;
+    }
+
+    .permission-items {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      gap: 16px;
+      margin-top: 4px;
+    }
+  }
+
+  .permission-manager-footer {
+    padding: 16px 24px;
+    background: #fff;
+    text-align: right;
+  }
+}
+
+@media (max-width: 768px) {
+  .permission-manager {
+    .permission-items {
+      grid-template-columns: 1fr;
+    }
+  }
+}

package/lib/plus/saasRole/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { SaasRoleProps } from './types';
+import './index.less';
+/**
+ * SaasRole 角色管理组件
+ *
+ * 提供完整的角色管理功能，包括：
+ * - 角色的创建、编辑、删除
+ * - 角色成员管理
+ * - 角色权限配置
+ * - 角色字段配置
+ */
+declare const SaasRole: React.FC<SaasRoleProps>;
+export default SaasRole;