Enhance BizCategoryTreeSelect component to support all category levels

- Added the allowAllLevels prop to the BizCategoryTreeSelect component, enabling selection of all category levels, including level 1.
- Updated documentation to clarify default behavior and usage of the new prop.
- Adjusted data loading and transformation logic to accommodate the new selection capability, improving flexibility in category management.

src/app/(dashboard)/playmate/list/page.tsx

@@ -359,6 +359,7 @@ const PlaymateListPage: React.FC = () => {
               allowClear
               style={{ width: 250 }}
               multiple
+              allowAllLevels
             />
           </Form.Item>
           <Form.Item style={{ marginLeft: "auto" }}>

src/components/BizCategoryTreeSelect.tsx

@@ -1,7 +1,8 @@
 /**
  * Biz Category Tree Select Component
  * Supports single and multiple selection modes
- * Only shows level 2 and higher categories (excludes level 1)
+ * By default, only level 2+ categories are selectable (level 1 are not selectable)
+ * Set allowAllLevels=true to make all levels including level 1 selectable
  */
 
 import { TreeSelect } from "antd";
@@ -26,6 +27,11 @@ interface BizCategoryTreeSelectProps {
   style?: React.CSSProperties;
   disabled?: boolean;
   loading?: boolean;
+  /**
+   * Allow selection of all levels including level 1 categories
+   * @default false - Only level 2+ categories are selectable
+   */
+  allowAllLevels?: boolean;
 }
 
 const BizCategoryTreeSelect: React.FC<BizCategoryTreeSelectProps> = ({
@@ -37,21 +43,25 @@ const BizCategoryTreeSelect: React.FC<BizCategoryTreeSelectProps> = ({
   style,
   disabled = false,
   loading: externalLoading = false,
+  allowAllLevels = false,
 }) => {
   const [treeData, setTreeData] = useState<TreeNode[]>([]);
   const [loading, setLoading] = useState(false);
 
   // Load category data
-  // biome-ignore lint/correctness/useExhaustiveDependencies: loadCategoryData is stable and doesn't need to be in dependencies
+  // biome-ignore lint/correctness/useExhaustiveDependencies: only reload when allowAllLevels changes
   useEffect(() => {
     loadCategoryData();
-  }, []);
+  }, [allowAllLevels]);
 
   const loadCategoryData = async () => {
     setLoading(true);
     try {
       const response = await getBizCategoryConfigPage();
-      const transformedData = transformToTreeData(response.list || []);
+      const transformedData = transformToTreeData(
+        response.list || [],
+        allowAllLevels,
+      );
       setTreeData(transformedData);
     } catch (error) {
       console.error("Failed to load category list:", error);
@@ -61,9 +71,11 @@ const BizCategoryTreeSelect: React.FC<BizCategoryTreeSelectProps> = ({
   };
 
   // Transform API data to TreeSelect format
-  // Only include level 2 and higher categories (those with pCode)
+  // By default, only include level 2 and higher categories (those with pCode)
+  // When allowAllLevels is true, all levels including level 1 are selectable
   const transformToTreeData = (
     categories: BizCategoryConfigAdminDTO[],
+    allowAllLevels: boolean,
   ): TreeNode[] => {
     const transformNode = (
       category: BizCategoryConfigAdminDTO,
@@ -72,17 +84,16 @@ const BizCategoryTreeSelect: React.FC<BizCategoryTreeSelectProps> = ({
 
       // If it's a level 1 category (has children but no pCode)
       if (hasChildren && !category.pCode) {
-        // Only process children, don't include the level 1 node itself
+        // Process children
         const childNodes = category.children
           ?.map((child) => transformNode(child))
           .filter((node): node is TreeNode => node !== null);
 
-        // Return children directly without wrapping in parent
         return childNodes && childNodes.length > 0
           ? {
               title: category.name,
               value: category.code,
-              selectable: false, // Level 1 categories are not selectable
+              selectable: allowAllLevels, // Selectable when allowAllLevels is true
               children: childNodes,
             }
           : null;