refactor(auto-group): 将内容库选择器替换为流量池选择器

将原有的内容库选择组件(ContentSelector)替换为流量池选择组件(PoolSelector)，并更新相关类型定义和表单逻辑

Cunkebao/src/pages/mobile/workspace/auto-group/form/components/PoolSelector.tsx

@@ -6,21 +6,21 @@ import {
   PoolPackageItem,
 } from "@/components/PoolSelection/data";
 
-interface ContentSelectorProps {
+interface PoolSelectorProps {
-  selectedContent: PoolSelectionItem[];
+  selectedPools: PoolSelectionItem[];
   onNext: (data: {
-    contentGroups: string[];
+    poolGroups: string[];
-    contentGroupsOptions: PoolSelectionItem[];
+    poolGroupsOptions: PoolSelectionItem[];
   }) => void;
 }
 
-export interface ContentSelectorRef {
+export interface PoolSelectorRef {
   validate: () => Promise<boolean>;
   getValues: () => any;
 }
 
-const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
+const PoolSelector = forwardRef<PoolSelectorRef, PoolSelectorProps>(
-  ({ selectedContent, onNext }, ref) => {
+  ({ selectedPools, onNext }, ref) => {
     const [form] = Form.useForm();
 
     // 暴露方法给父组件
@@ -30,7 +30,7 @@ const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
           await form.validateFields();
           return true;
         } catch (error) {
-          console.log("ContentSelector 表单验证失败:", error);
+          console.log("PoolSelector 表单验证失败:", error);
           return false;
         }
       },
@@ -40,12 +40,12 @@ const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
     }));
 
     // 处理选择变化
-    const handleContentChange = (contentGroupsOptions: PoolSelectionItem[]) => {
+    const handlePoolChange = (poolGroupsOptions: PoolSelectionItem[]) => {
-      const contentGroups = contentGroupsOptions.map(c => c.id.toString());
+      const poolGroups = poolGroupsOptions.map(c => c.id.toString());
-      form.setFieldValue("contentGroups", contentGroups);
+      form.setFieldValue("poolGroups", poolGroups);
       onNext({
-        contentGroups,
+        poolGroups,
-        contentGroupsOptions,
+        poolGroupsOptions,
       });
     };
 
@@ -61,7 +61,7 @@ const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
             form={form}
             layout="vertical"
             initialValues={{
-              contentGroups: selectedContent.map(c => c.id.toString()),
+              poolGroups: selectedPools.map(c => c.id.toString()),
             }}
           >
             <div style={{ marginBottom: 16 }}>
@@ -74,7 +74,7 @@ const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
             </div>
 
             <Form.Item
-              name="contentGroups"
+              name="poolGroups"
               rules={[
                 { required: true, message: "请选择至少一个流量池包" },
                 { type: "array", min: 1, message: "请选择至少一个流量池包" },
@@ -82,14 +82,8 @@ const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
               ]}
             >
               <PoolSelection
-                selectedOptions={selectedContent}
+                selectedOptions={selectedPools}
-                onSelect={handleContentChange}
+                onSelect={handlePoolChange}
-                onSelectDetail={handleSelectDetail}
-                placeholder="选择流量池包"
-                showInput={true}
-                showSelectedList={true}
-                readonly={false}
-                selectedListMaxHeight={320}
               />
             </Form.Item>
           </Form>
@@ -99,6 +93,6 @@ const ContentSelector = forwardRef<ContentSelectorRef, ContentSelectorProps>(
   },
 );
 
-ContentSelector.displayName = "ContentSelector";
+PoolSelector.displayName = "PoolSelector";
 
-export default ContentSelector;
+export default PoolSelector;

Cunkebao/src/pages/mobile/workspace/auto-group/form/index.tsx

@@ -8,14 +8,11 @@ import { AutoGroupFormData, StepItem } from "./types";
 import StepIndicator from "@/components/StepIndicator";
 import BasicSettings, { BasicSettingsRef } from "./components/BasicSettings";
 import DeviceSelector, { DeviceSelectorRef } from "./components/DeviceSelector";
-import ContentSelector, {
+import PoolSelector, { PoolSelectorRef } from "./components/PoolSelector";
-  ContentSelectorRef,
-} from "./components/ContentSelector";
 import NavCommon from "@/components/NavCommon/index";
 import dayjs from "dayjs";
 import { DeviceSelectionItem } from "@/components/DeviceSelection/data";
 import { PoolSelectionItem } from "@/components/PoolSelection/data";
-import { GroupSelectionItem } from "../../../../../components/GroupSelection/data";
 
 const steps: StepItem[] = [
   { id: 1, title: "步骤 1", subtitle: "基础设置" },
@@ -28,8 +25,8 @@ const defaultForm: AutoGroupFormData = {
   type: 4,
   deveiceGroups: [], // 设备组
   deveiceGroupsOptions: [], // 设备组选项
-  contentGroups: [], // 内容库
+  poolGroups: [], // 内容库
-  contentGroupsOptions: [], // 内容库选项
+  poolGroupsOptions: [], // 内容库选项
   startTime: dayjs().format("HH:mm"), // 开始时间 (HH:mm)
   endTime: dayjs().add(1, "hour").format("HH:mm"), // 结束时间 (HH:mm)
   groupSizeMin: 20, // 群组最小人数
@@ -51,14 +48,14 @@ const AutoGroupForm: React.FC = () => {
   const [deviceGroupsOptions, setDeviceGroupsOptions] = useState<
     DeviceSelectionItem[]
   >([]);
-  const [contentGroupsOptions, setContentGroupsOptions] = useState<
+  const [poolGroupsOptions, setpoolGroupsOptions] = useState<
     PoolSelectionItem[]
   >([]);
 
   // 创建子组件的ref
   const basicSettingsRef = useRef<BasicSettingsRef>(null);
   const deviceSelectorRef = useRef<DeviceSelectorRef>(null);
-  const contentSelectorRef = useRef<ContentSelectorRef>(null);
+  const poolSelectorRef = useRef<PoolSelectorRef>(null);
 
   useEffect(() => {
     if (!id) return;
@@ -69,8 +66,8 @@ const AutoGroupForm: React.FC = () => {
         name: res.name,
         deveiceGroups: res.config.deveiceGroups || [],
         deveiceGroupsOptions: res.config.deveiceGroupsOptions || [],
-        contentGroups: res.config.contentGroups || [],
+        poolGroups: res.config.poolGroups || [],
-        contentGroupsOptions: res.config.contentGroupsOptions || [],
+        poolGroupsOptions: res.config.poolGroupsOptions || [],
         startTime: res.config.startTime,
         endTime: res.config.endTime,
         groupSizeMin: res.config.groupSizeMin,
@@ -84,7 +81,7 @@ const AutoGroupForm: React.FC = () => {
       };
       setFormData(updatedForm);
       setDeviceGroupsOptions(res.config.deveiceGroupsOptions || []);
-      setContentGroupsOptions(res.config.contentGroupsOptions || []);
+      setpoolGroupsOptions(res.config.poolGroupsOptions || []);
       setDataLoaded(true); // 标记数据已加载
     });
   }, [id]);
@@ -106,12 +103,12 @@ const AutoGroupForm: React.FC = () => {
   };
 
   // 流量池包选择
-  const handleContentChange = (data: {
+  const handlePoolsChange = (data: {
-    contentGroups: string[];
+    poolGroups: string[];
-    contentGroupsOptions: PoolSelectionItem[];
+    poolGroupsOptions: PoolSelectionItem[];
   }) => {
-    setFormData(prev => ({ ...prev, contentGroups: data.contentGroups }));
+    setFormData(prev => ({ ...prev, poolGroups: data.poolGroups }));
-    setContentGroupsOptions(data.contentGroupsOptions);
+    setpoolGroupsOptions(data.poolGroupsOptions);
   };
 
   const handleSave = async () => {
@@ -123,7 +120,7 @@ const AutoGroupForm: React.FC = () => {
       Toast.show({ content: "请选择至少一个设备组" });
       return;
     }
-    if (formData.contentGroups.length === 0) {
+    if (formData.poolGroups.length === 0) {
       Toast.show({ content: "请选择至少一个流量池包" });
       return;
     }
@@ -133,7 +130,7 @@ const AutoGroupForm: React.FC = () => {
       const submitData = {
         ...formData,
         deveiceGroupsOptions: deviceGroupsOptions,
-        contentGroupsOptions: contentGroupsOptions,
+        poolGroupsOptions: poolGroupsOptions,
       };
 
       if (isEdit) {
@@ -228,10 +225,10 @@ const AutoGroupForm: React.FC = () => {
         );
       case 3:
         return (
-          <ContentSelector
+          <PoolSelector
-            ref={contentSelectorRef}
+            ref={poolSelectorRef}
-            selectedContent={contentGroupsOptions}
+            selectedPools={poolGroupsOptions}
-            onNext={handleContentChange}
+            onNext={handlePoolsChange}
           />
         );
       default:

Cunkebao/src/pages/mobile/workspace/auto-group/form/types.ts

@@ -1,5 +1,5 @@
 import { DeviceSelectionItem } from "@/components/DeviceSelection/data";
-import { ContentItem } from "@/components/ContentSelection/data";
+import { PoolSelectionItem } from "@/components/PoolSelection/data";
 
 // 自动建群表单数据类型定义
 export interface AutoGroupFormData {
@@ -8,8 +8,8 @@ export interface AutoGroupFormData {
   name: string; // 任务名称
   deveiceGroups: string[]; // 设备组
   deveiceGroupsOptions: DeviceSelectionItem[]; // 设备组选项
-  contentGroups: string[]; // 内容库
+  poolGroups: string[]; // 流量池
-  contentGroupsOptions: ContentItem[]; // 内容库选项
+  poolGroupsOptions: PoolSelectionItem[]; // 流量池选项
   startTime: string; // 开始时间 (YYYY-MM-DD HH:mm:ss)
   endTime: string; // 结束时间 (YYYY-MM-DD HH:mm:ss)
   groupSizeMin: number; // 群组最小人数
@@ -38,7 +38,7 @@ export const formValidationRules = {
     { required: true, message: "请选择设备组" },
     { type: "array", min: 1, message: "至少选择一个设备组" },
   ],
-  contentGroups: [
+  poolGroups: [
     { required: true, message: "请选择内容库" },
     { type: "array", min: 1, message: "至少选择一个内容库" },
   ],