@gadmin2n/cli 0.0.81 → 0.0.82

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/create.tsx

@@ -0,0 +1,113 @@
+
+import {
+  FieldDataType,
+  handleInitialValues,
+  handleOnFinish,
+  ModelType,
+  produceModel,
+} from '@gadmin2n/react-common';
+import { Create, useFileUploadState, useForm } from "@refinedev/antd";
+import { Form } from "antd";
+import { IResourceComponentsProps, useApiUrl, useTranslate } from "@refinedev/core";
+import React, { useContext, useState } from "react";
+import { getFormItem, onFormValuesChange } from "../../helpers";
+import { modelsMap, modelsEnum } from "../../generated/models.index";
+import {
+  roleFormConfig as formConfig,
+  roleFormPrismaSelect as formPrismaSelect,
+} from "../../generated/props/role/config";
+import {
+  roleModel,
+  useRelation,
+} from "../../generated/props/role/model";
+import { Role } from "../../generated/types/prisma.types";
+import { RoleForm as transformClass } from "../../generated/props/role/form.validator";
+import { BusinessContext } from 'components/contexts/business';
+
+export const RoleCreate: React.FC<IResourceComponentsProps> = () => {
+  const resourceName = "role";
+  const t = useTranslate();
+  
+  
+
+  const [[fields, model]] = useState(() => {
+    const model: ModelType = produceModel(
+      roleModel,
+      {
+        // all formItem attrs surport, https://ant.design/components/form#formitem
+        // description : { component : <MDEditor data-color-mode="light" /> },
+        // status : { normalize : (value: any) => value ? "1" : "0" },
+        // cron: {validator: { validator: runCronValidator },},
+      },
+      transformClass
+    );
+
+    const fields: FieldDataType[] = formConfig.fields
+      .map((fieldName: string) => model[fieldName])
+      .filter((field: FieldDataType) => field);
+
+    return [fields, model] as const;
+  });
+
+  const { formProps, saveButtonProps, onFinish, form } =
+    useForm<Role>({
+      meta: { select: formPrismaSelect},
+    });
+  if (formProps.initialValues || formConfig.initialValues) {
+    formProps.initialValues = handleInitialValues(
+      formProps.initialValues || formConfig.initialValues || {},
+      fields,
+    );
+  }
+
+  const apiUrl = useApiUrl();
+  const { isLoading, onChange } = useFileUploadState();
+  const relationSelectProps = useRelation(modelsMap);
+
+  return (
+    <Create
+      saveButtonProps={{
+        ...saveButtonProps,
+        disabled: isLoading,
+      }}
+    >
+      <Form
+        {...formProps}
+        validateTrigger="onBlur"
+        onFinish={(values) => {
+          onFinish(
+            handleOnFinish(
+              {
+                ...values,
+                
+              },
+              fields
+            )
+          );
+        }}
+        layout="vertical"
+        form={form}
+        onValuesChange={onFormValuesChange(
+          form,
+          formConfig.reaction,
+        )}
+      >
+        {fields.map((field) => {
+          return getFormItem(
+            field,
+            resourceName,
+            t,
+            form,
+            formConfig.reaction,
+            modelsEnum,
+            model,
+            apiUrl,
+            relationSelectProps,
+            onChange
+          );
+        })}
+      </Form>
+    </Create>
+  );
+};
+  

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/edit.tsx

@@ -0,0 +1,122 @@
+
+import {
+  FieldDataType,
+  handleInitialValues,
+  handleOnFinish,
+  ModelType,
+  produceModel,
+} from "@gadmin2n/react-common";
+import { Edit, ListButton, RefreshButton, useFileUploadState, useForm } from "@refinedev/antd";
+import { Form } from "antd";
+import { IResourceComponentsProps, useApiUrl, useParsed, useTranslate } from "@refinedev/core";
+import { getFormItem, onFormValuesChange } from "../../helpers";
+import React, { useContext, useState } from "react";
+
+import { modelsMap, modelsEnum } from "../../generated/models.index";
+import {
+  roleFormConfig as formConfig,
+  roleFormPrismaSelect as formPrismaSelect,
+} from "../../generated/props/role/config";
+import {
+  roleModel,
+  useRelation,
+} from "../../generated/props/role/model";
+import { Role } from "../../generated/types/prisma.types";
+import { RoleForm as transformClass } from "../../generated/props/role/form.validator";
+import { BusinessContext } from 'components/contexts/business';
+
+export const RoleEdit: React.FC<IResourceComponentsProps> = () => {
+  const resourceName = "role";
+  const t = useTranslate();
+  
+
+  const [[fields, model]] = useState(() => {
+    const model: ModelType = produceModel(
+      roleModel,
+      {
+        // all formItem attrs surport, https://ant.design/components/form#formitem
+        // description : { component : <MDEditor data-color-mode="light" /> },
+        // status : { normalize : (value: any) => value ? "1" : "0" },
+        // cron: {validator: { validator: runCronValidator },},
+      },
+      transformClass
+    );
+
+    const fields: FieldDataType[] = formConfig.fields
+      .map((fieldName: string) => model[fieldName])
+      .filter((field: FieldDataType) => field);
+
+    return [fields, model] as const;
+  });
+
+  const { formProps, saveButtonProps, onFinish, form } =
+    useForm<Role>({
+      meta: { select: formPrismaSelect},
+    });
+  formProps.initialValues = handleInitialValues(
+    formProps.initialValues || {},
+    fields
+  );
+
+  const apiUrl = useApiUrl();
+  const { isLoading, onChange } = useFileUploadState();
+
+  const relationSelectProps = useRelation(modelsMap);
+
+  return (
+    <Edit
+      saveButtonProps={{
+        ...saveButtonProps,
+        disabled: isLoading,
+      }}
+      headerButtons={
+        <>
+          <ListButton />
+          <RefreshButton
+            meta={{ select: formPrismaSelect}}
+          />
+        </>
+      }
+    >
+      <Form
+        {...formProps}
+        validateTrigger="onBlur"
+        onFinish={(values) => {
+          onFinish(
+            handleOnFinish(
+              {
+                ...values,
+                
+                id: undefined,
+              },
+              fields,
+              "edit"
+            )
+          );
+        }}
+        layout="vertical"
+        form={form}
+        onValuesChange={onFormValuesChange(
+          form,
+          formConfig.reaction,
+        )}
+      >
+        {fields.map((field) => {
+          return getFormItem(
+            field,
+            resourceName,
+            t,
+            form,
+            formConfig.reaction,
+            modelsEnum,
+            model,
+            apiUrl,
+            relationSelectProps,
+            onChange
+          );
+        })}
+      </Form>
+    </Edit>
+  );
+};
+  

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/index.tsx

@@ -0,0 +1,6 @@
+
+export * from "./list";
+export * from "./create";
+export * from "./edit";
+export * from "./show";
+  

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/list.tsx

@@ -0,0 +1,382 @@
+import React, { useCallback, useMemo, useState } from "react";
+import { useTable } from "@refinedev/antd";
+import { useGetLocale } from "@refinedev/core";
+import { Table, Button, Space, Tooltip } from "antd";
+
+import { EditModal } from "./Components/EditModal";
+import { CreateModal } from "./Components/CreateModal";
+import type { RolePageTreeNode } from "./types";
+import { useRolePage } from "./hooks/useRolePage";
+import { EditOutlined, EyeOutlined } from "@ant-design/icons";
+import { RoleDetailDrawer } from "./Components/RoleDetailDrawer";
+
+type RolePageInfo = {
+  id: number;
+  name: string;
+  menuPath: string;
+};
+
+type RolePermissionSummary = {
+  pageIds: number[];
+  pageNames: string[];
+  pageInfos: RolePageInfo[];
+  actions: string[];
+};
+
+const PAGE_NAME_DISPLAY_LIMIT = 40;
+
+const normalizeToNumber = (value: unknown): number | null => {
+  if (typeof value === "number" && !Number.isNaN(value)) {
+    return value;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const parsedValue = Number(value);
+    return Number.isNaN(parsedValue) ? null : parsedValue;
+  }
+  return null;
+};
+
+const extractActionsFromRelation = (relation: any, pageRecord: any): string[] => {
+  const aggregatedActions = new Set<string>();
+  const relationActions = relation?.actions ?? relation?.actionList;
+
+  if (Array.isArray(relationActions)) {
+    relationActions.forEach((action: any) => {
+      if (typeof action === "string" && action) {
+        aggregatedActions.add(action);
+      } else if (typeof action === "object" && action?.name) {
+        aggregatedActions.add(action.name);
+      }
+    });
+  } else if (typeof relationActions === "string") {
+    relationActions
+      .split(",")
+      .map((action: string) => action.trim())
+      .filter(Boolean)
+      .forEach(action => aggregatedActions.add(action));
+  }
+
+  const pageResources =
+    relation?.pageResources ?? pageRecord?.pageResources ?? pageRecord?.resources ?? [];
+
+  if (Array.isArray(pageResources)) {
+    pageResources.forEach((resource: any) => {
+      const action = resource?.action ?? resource?.code ?? resource?.name ?? resource;
+      if (typeof action === "string" && action) {
+        aggregatedActions.add(action);
+      }
+    });
+  }
+
+  return Array.from(aggregatedActions);
+};
+
+export const RoleManagementListPage: React.FC = () => {
+  const getLocale = useGetLocale();
+  const currentLocale = getLocale();
+
+  const { tableProps } = useTable({
+    resource: "role",
+    pagination: {
+      pageSize: 20,
+    },
+  });
+
+  const { rolePagesData, refetchRolePages, rolePagesQuery, pageData, refetchPages, pageQuery } =
+    useRolePage();
+
+  const pageLookup = useMemo<Record<number, any>>(() => {
+    const pages: any[] = Array.isArray(pageData?.data) ? pageData.data : [];
+    const lookup: Record<number, any> = {};
+
+    pages.forEach((page: any) => {
+      const pageId = normalizeToNumber(page?.id ?? page?.pageId ?? page?.page_id);
+      if (pageId !== null) {
+        lookup[pageId] = page;
+      }
+    });
+
+    return lookup;
+  }, [pageData]);
+
+  const pageTreeData = useMemo<RolePageTreeNode[]>(() => {
+    const pages: any[] = Array.isArray(pageData?.data) ? pageData.data : [];
+    const isZh = currentLocale === "zh_CN" || currentLocale === "zh";
+
+    const getPageTitle = (page: any, pageId: number): string => {
+      if (isZh) {
+        return page?.zhName || page?.name || page?.code || `Page ${pageId}`;
+      }
+      return page?.enName || page?.name || page?.code || `Page ${pageId}`;
+    };
+
+    const nodeMap = new Map<number, { node: RolePageTreeNode; parentId: number | null; sortOrder: number | null }>();
+
+    pages.forEach((page: any) => {
+      const pageId = normalizeToNumber(page?.id ?? page?.pageId ?? page?.page_id);
+      if (pageId === null) {
+        return;
+      }
+
+      const parentId =
+        normalizeToNumber(page?.parentId ?? page?.parent_id ?? page?.parent?.id) ?? null;
+      const title = getPageTitle(page, pageId);
+      const sortOrder = normalizeToNumber(page?.sortOrder ?? page?.sort_order);
+
+      nodeMap.set(pageId, {
+        node: {
+          title,
+          value: String(pageId),
+          key: String(pageId),
+          children: [],
+        },
+        parentId,
+        sortOrder,
+      });
+    });
+
+    const roots: RolePageTreeNode[] = [];
+
+    nodeMap.forEach(({ node, parentId }) => {
+      if (parentId !== null && nodeMap.has(parentId)) {
+        nodeMap.get(parentId)?.node.children?.push(node);
+      } else {
+        roots.push(node);
+      }
+    });
+
+    // Build a map from node key to sortOrder for sorting
+    const sortOrderMap = new Map<string, number | null>();
+    nodeMap.forEach(({ sortOrder }, pageId) => {
+      sortOrderMap.set(String(pageId), sortOrder);
+    });
+
+    const sortNodes = (nodes: RolePageTreeNode[]) => {
+      nodes.sort((a, b) => {
+        const orderA = sortOrderMap.get(a.key) ?? Infinity;
+        const orderB = sortOrderMap.get(b.key) ?? Infinity;
+        return (orderA as number) - (orderB as number);
+      });
+      nodes.forEach(child => {
+        if (child.children && child.children.length) {
+          sortNodes(child.children);
+        }
+      });
+    };
+
+    const pruneEmptyChildren = (nodes: RolePageTreeNode[]): RolePageTreeNode[] =>
+      nodes.map(node => {
+        if (node.children && node.children.length) {
+          return {
+            ...node,
+            children: pruneEmptyChildren(node.children),
+          };
+        }
+        const { children, ...rest } = node;
+        return rest as RolePageTreeNode;
+      });
+
+    sortNodes(roots);
+    return pruneEmptyChildren(roots);
+  }, [pageData, currentLocale]);
+
+  const rolePermissionSummary = useMemo<Record<number, RolePermissionSummary>>(() => {
+    const relations: any[] = Array.isArray(rolePagesData?.data) ? rolePagesData.data : [];
+    const isZh = currentLocale === "zh_CN" || currentLocale === "zh";
+
+    const getLocalizedName = (pageRecord: any, fallback: string): string => {
+      if (isZh) {
+        return pageRecord?.zhName || pageRecord?.name || pageRecord?.code || fallback;
+      }
+      return pageRecord?.enName || pageRecord?.name || pageRecord?.code || fallback;
+    };
+
+    const buildMenuPath = (pageId: number): string => {
+      const parts: string[] = [];
+      let currentId: number | null = pageId;
+      const visited = new Set<number>();
+      while (currentId !== null && !visited.has(currentId)) {
+        visited.add(currentId);
+        const record: any = pageLookup[currentId];
+        if (!record) break;
+        parts.unshift(getLocalizedName(record, record?.name || `Page ${currentId}`));
+        currentId = normalizeToNumber(record?.parentId ?? record?.parent_id) ?? null;
+      }
+      return parts.join(" / ");
+    };
+
+    const summaryMap: Record<number, RolePermissionSummary> = {};
+
+    relations.forEach((relation: any) => {
+      const roleId = normalizeToNumber(relation?.roleId);
+      const pageId = normalizeToNumber(relation?.pageId);
+
+      if (roleId === null || pageId === null) {
+        return;
+      }
+
+      if (!summaryMap[roleId]) {
+        summaryMap[roleId] = {
+          pageIds: [],
+          pageNames: [],
+          pageInfos: [],
+          actions: [],
+        };
+      }
+
+      const summary = summaryMap[roleId];
+
+      if (!summary.pageIds.includes(pageId)) {
+        summary.pageIds.push(pageId);
+      }
+
+      const pageRecord = relation?.page ?? pageLookup[pageId];
+      const pageName = pageRecord?.name || pageRecord?.code || `Page ${pageId}`;
+
+      if (pageName && !summary.pageNames.includes(pageName)) {
+        summary.pageNames.push(pageName);
+      }
+
+      const localizedName = getLocalizedName(pageRecord, pageName);
+      if (!summary.pageInfos.some(p => p.id === pageId)) {
+        summary.pageInfos.push({
+          id: pageId,
+          name: localizedName,
+          menuPath: buildMenuPath(pageId),
+        });
+      }
+
+      extractActionsFromRelation(relation, pageRecord).forEach(action => {
+        if (action && !summary.actions.includes(action)) {
+          summary.actions.push(action);
+        }
+      });
+    });
+
+    // Build ancestor sort-order chain for hierarchical sorting
+    const getSortChain = (pageId: number): number[] => {
+      const chain: number[] = [];
+      let currentId: number | null = pageId;
+      const visited = new Set<number>();
+      while (currentId !== null && !visited.has(currentId)) {
+        visited.add(currentId);
+        const record: any = pageLookup[currentId];
+        if (!record) break;
+        chain.unshift(record?.sortOrder ?? record?.sort_order ?? Infinity);
+        currentId = normalizeToNumber(record?.parentId ?? record?.parent_id) ?? null;
+      }
+      return chain;
+    };
+
+    // Sort pageInfos by full ancestor sort-order chain
+    Object.values(summaryMap).forEach(summary => {
+      summary.pageInfos.sort((a, b) => {
+        const chainA = getSortChain(a.id);
+        const chainB = getSortChain(b.id);
+        const len = Math.max(chainA.length, chainB.length);
+        for (let i = 0; i < len; i++) {
+          const valA = chainA[i] ?? Infinity;
+          const valB = chainB[i] ?? Infinity;
+          if (valA !== valB) return valA - valB;
+        }
+        return chainA.length - chainB.length;
+      });
+    });
+
+    return summaryMap;
+  }, [rolePagesData, pageLookup, currentLocale]);
+
+  const [drawerRole, setDrawerRole] = useState<any>(null);
+
+  const [showModal, setShowModal] = useState<{
+    type: "show" | "edit" | "create" | null;
+    id: number | null;
+  }>({
+    type: null,
+    id: null,
+  });
+
+  const refreshRoleRelatedData = useCallback(() => {
+    refetchRolePages(rolePagesQuery ?? {});
+    refetchPages(pageQuery ?? {});
+  }, [refetchRolePages, rolePagesQuery, refetchPages, pageQuery]);
+
+  const handleModalClose = useCallback(() => {
+    setShowModal({ type: null, id: null });
+  }, []);
+
+  const handleModalSuccess = useCallback(() => {
+    handleModalClose();
+    refreshRoleRelatedData();
+  }, [refreshRoleRelatedData, handleModalClose]);
+
+  return (
+    <div>
+      <Space style={{ marginBottom: 16 }}>
+        <Button
+          type="primary"
+          onClick={() =>
+            setShowModal({
+              type: "create",
+              id: null,
+            })
+          }
+        >
+          Create Role
+        </Button>
+      </Space>
+      <Table {...tableProps} rowKey="id">
+        <Table.Column dataIndex="name" title="Name" />
+        <Table.Column dataIndex="description" title="Description" />
+        <Table.Column dataIndex="creator" title="Creator" />
+        <Table.Column
+          title="Actions"
+          render={(_, record: any) => (
+            <Space>
+              <Tooltip title="View details">
+                <Button
+                  type="default"
+                  size="small"
+                  icon={<EyeOutlined />}
+                  onClick={() => setDrawerRole(record)}
+                />
+              </Tooltip>
+              <Tooltip title="Edit">
+                <Button
+                  type="default"
+                  size="small"
+                  icon={<EditOutlined />}
+                  onClick={() => setShowModal({ type: "edit", id: record.id })}
+                />
+              </Tooltip>
+            </Space>
+          )}
+        />
+      </Table>
+      {drawerRole && (
+        <RoleDetailDrawer
+          role={drawerRole}
+          pages={rolePermissionSummary[drawerRole.id]?.pageInfos ?? []}
+          open={!!drawerRole}
+          onClose={() => setDrawerRole(null)}
+        />
+      )}
+      {showModal.type === "edit" && showModal.id && (
+        <EditModal
+          id={showModal.id}
+          onClose={handleModalClose}
+          onSuccess={handleModalSuccess}
+          pageTreeData={pageTreeData}
+          rolePermissionSummary={rolePermissionSummary[showModal.id]}
+        />
+      )}
+      {showModal.type === "create" && (
+        <CreateModal
+          onClose={handleModalClose}
+          onSuccess={handleModalSuccess}
+          pageTreeData={pageTreeData}
+        />
+      )}
+    </div>
+  );
+};

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/show.tsx

@@ -0,0 +1,61 @@
+
+import { ModelType, getColumns, produceModel } from "@gadmin2n/react-common";
+import { CloneButton, DeleteButton, EditButton, ListButton, RefreshButton, Show } from "@refinedev/antd";
+import { IResourceComponentsProps, useShow, useTranslate } from "@refinedev/core";
+import React, { useState } from "react";
+import { getShowField } from "../../helpers";
+import type { Role } from "../../generated/types/prisma.types"; //'.prisma/client/index';
+import {
+  roleShowConfig as showConfig,
+  roleShowPrismaSelect as showPrismaSelect,
+} from "../../generated/props/role/config";
+import { roleModel } from "../../generated/props/role/model";
+import { modelsMap } from "generated/models.index";
+
+export const RoleShow: React.FC<IResourceComponentsProps> = () => {
+  const resourceName = "role";
+  const t = useTranslate();
+  
+  const { queryResult } = useShow<Role>({
+    meta: { select: showPrismaSelect},
+  });
+  const { data, isLoading } = queryResult;
+  const record = data?.data;
+
+  const [[fields, model]] = useState(() => {
+    const model: ModelType = produceModel(roleModel, {
+      // status: { render: xxxxx }
+    });
+
+    // getColumns is a function that returns an array of fields
+    const fields = getColumns("Role", showConfig.fields, {
+      ...modelsMap,
+      Role: { model, meta: modelsMap["Role"].meta },
+    });
+
+    return [fields, model] as const;
+  });
+
+  return (
+    <Show
+      isLoading={isLoading}
+      headerButtons={
+        <>
+          <ListButton/>
+          <EditButton recordItemId={record?.id} />
+          <CloneButton recordItemId={record?.id} />
+          <DeleteButton recordItemId={record?.id} />
+          <RefreshButton
+            recordItemId={record?.id}
+            meta={{ select: showPrismaSelect}}
+          />
+        </>
+      }
+    >
+      {fields.map((field: any) => {
+        return getShowField(field, resourceName, record, t, model, modelsMap);
+      })}
+    </Show>
+  );
+};
+