Просмотр исходного кода

Enhance BizCategoryConfigPage to utilize global constants for category types

- Integrated global constants for skill category types, allowing dynamic loading and rendering of options.
- Updated form handling to set default category type based on selected options.
- Improved rendering of category type tags in the data table for better clarity.
0es 2 месяцев назад
Родитель
Сommit
2aaa712a16
2 измененных файлов с 56 добавлено и 15 удалено
  1. 54 13
      src/app/(dashboard)/bizcategory/config/page.tsx
  2. 2 2
      src/types/api/bizCategory.ts

+ 54 - 13
src/app/(dashboard)/bizcategory/config/page.tsx

@@ -24,6 +24,7 @@ import type { ColumnsType } from "antd/es/table";
 import type React from "react";
 import { useEffect, useMemo, useState } from "react";
 import ImageUpload from "@/components/ImageUpload";
+import { useGlobalConsts } from "@/contexts/GlobalConstsContext";
 import {
   createBizCategoryConfig,
   getBizCategoryConfigPage,
@@ -35,6 +36,32 @@ const BizCategoryConfigPage: React.FC = () => {
   const { message } = App.useApp();
   const [editForm] = Form.useForm();
 
+  const { getGroup, isLoading: isConstsLoading } = useGlobalConsts();
+  const skillCategoryTypeConsts = getGroup("SkillCategoryTypeConsts");
+  const skillCategoryTypeOptions = useMemo(() => {
+    return skillCategoryTypeConsts
+      .map((item) => {
+        const numValue = Number(item.value);
+        if (!Number.isFinite(numValue)) return null;
+        return {
+          label: item.name,
+          value: numValue,
+          disabled: item.disabled,
+        };
+      })
+      .filter(Boolean) as {
+      label: string;
+      value: number;
+      disabled: boolean;
+    }[];
+  }, [skillCategoryTypeConsts]);
+  const defaultSkillCategoryType = useMemo(() => {
+    return skillCategoryTypeOptions[0]?.value ?? 0;
+  }, [skillCategoryTypeOptions]);
+  const skillCategoryTypeMap = useMemo(() => {
+    return new Map(skillCategoryTypeOptions.map((opt) => [opt.value, opt]));
+  }, [skillCategoryTypeOptions]);
+
   // State management
   const [loading, setLoading] = useState(false);
   const [dataSource, setDataSource] = useState<BizCategoryConfigAdminDTO[]>([]);
@@ -113,7 +140,7 @@ const BizCategoryConfigPage: React.FC = () => {
     setPresetParentCode(null);
     editForm.resetFields();
     editForm.setFieldsValue({
-      categoryType: 0,
+      categoryType: defaultSkillCategoryType,
       enabled: true,
       priority: 0,
       nameI18ns: [],
@@ -129,7 +156,7 @@ const BizCategoryConfigPage: React.FC = () => {
     editForm.resetFields();
     editForm.setFieldsValue({
       // 子品类不允许编辑品类类型,这里默认继承父级(若父级无则为默认品类)
-      categoryType: parentRecord.categoryType ?? 0,
+      categoryType: parentRecord.categoryType ?? defaultSkillCategoryType,
       enabled: true,
       priority: 0,
       nameI18ns: [],
@@ -145,7 +172,7 @@ const BizCategoryConfigPage: React.FC = () => {
     setPresetParentCode(record.parentCode || "root");
     editForm.setFieldsValue({
       code: record.code,
-      categoryType: record.categoryType ?? 0,
+      categoryType: record.categoryType ?? defaultSkillCategoryType,
       name: record.name,
       icon: record.icon,
       cover: record.cover,
@@ -242,16 +269,19 @@ const BizCategoryConfigPage: React.FC = () => {
       width: 200,
       fixed: "left",
       render: (code: string, record: BizCategoryConfigAdminDTO) => {
+        const typeOpt =
+          record.parentCode === null
+            ? skillCategoryTypeMap.get(
+                record.categoryType ?? defaultSkillCategoryType,
+              )
+            : undefined;
         return (
           <Space>
             {code}
-            {record.parentCode === null && (
-              <>
-                {record.categoryType === 0 && <Tag>默认品类</Tag>}
-                {record.categoryType === 1 && (
-                  <Tag color="purple">线下品类</Tag>
-                )}
-              </>
+            {record.parentCode === null && typeOpt && (
+              <Tag color={typeOpt.value > 0 ? "purple" : "default"}>
+                {typeOpt.label}
+              </Tag>
             )}
           </Space>
         );
@@ -443,9 +473,20 @@ const BizCategoryConfigPage: React.FC = () => {
             name="categoryType"
             rules={[{ required: true, message: "请选择品类类型" }]}
           >
-            <Select placeholder="请选择品类类型" disabled={!isTopLevel}>
-              <Select.Option value={0}>默认品类</Select.Option>
-              <Select.Option value={1}>线下品类</Select.Option>
+            <Select
+              placeholder="请选择品类类型"
+              disabled={!isTopLevel}
+              loading={isConstsLoading}
+            >
+              {skillCategoryTypeOptions.map((opt) => (
+                <Select.Option
+                  key={opt.value}
+                  value={opt.value}
+                  disabled={opt.disabled}
+                >
+                  {opt.label}
+                </Select.Option>
+              ))}
             </Select>
           </Form.Item>
 

+ 2 - 2
src/types/api/bizCategory.ts

@@ -13,9 +13,9 @@ export interface BizCategoryConfigAdminDTO {
   id?: string;
   code: string;
   /**
-   * 品类类型:0-默认品类,1-线下品类
+   * 品类类型:由后端全局常量 SkillCategoryTypeConsts 定义(如 0/1/2...)
    */
-  categoryType?: 0 | 1;
+  categoryType?: number;
   name: string;
   icon?: string;
   /**