From eadb7a8f3e95d550e6cc39ef96eb3dfa187060c3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?= Date: Thu, 21 Aug 2025 16:58:12 +0800 Subject: [PATCH] =?UTF-8?q?refactor(auto-group):=20=E5=B0=86=E5=86=85?= =?UTF-8?q?=E5=AE=B9=E5=BA=93=E9=80=89=E6=8B=A9=E5=99=A8=E6=9B=BF=E6=8D=A2?= =?UTF-8?q?=E4=B8=BA=E6=B5=81=E9=87=8F=E6=B1=A0=E9=80=89=E6=8B=A9=E5=99=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 将原有的内容库选择组件(ContentSelector)替换为流量池选择组件(PoolSelector)，并更新相关类型定义和表单逻辑 --- .../{ContentSelector.tsx => PoolSelector.tsx} | 44 ++++++++----------- .../workspace/auto-group/form/index.tsx | 41 ++++++++--------- .../mobile/workspace/auto-group/form/types.ts | 8 ++-- 3 files changed, 42 insertions(+), 51 deletions(-) rename Cunkebao/src/pages/mobile/workspace/auto-group/form/components/{ContentSelector.tsx => PoolSelector.tsx} (62%) diff --git a/Cunkebao/src/pages/mobile/workspace/auto-group/form/components/ContentSelector.tsx b/Cunkebao/src/pages/mobile/workspace/auto-group/form/components/PoolSelector.tsx similarity index 62% rename from Cunkebao/src/pages/mobile/workspace/auto-group/form/components/ContentSelector.tsx rename to Cunkebao/src/pages/mobile/workspace/auto-group/form/components/PoolSelector.tsx index b045ae4b..33c164a8 100644 --- a/Cunkebao/src/pages/mobile/workspace/auto-group/form/components/ContentSelector.tsx +++ b/Cunkebao/src/pages/mobile/workspace/auto-group/form/components/PoolSelector.tsx @@ -6,21 +6,21 @@ import { PoolPackageItem, } from "@/components/PoolSelection/data"; -interface ContentSelectorProps { - selectedContent: PoolSelectionItem[]; +interface PoolSelectorProps { + selectedPools: PoolSelectionItem[]; onNext: (data: { - contentGroups: string[]; - contentGroupsOptions: PoolSelectionItem[]; + poolGroups: string[]; + poolGroupsOptions: PoolSelectionItem[]; }) => void; } -export interface ContentSelectorRef { +export interface PoolSelectorRef { validate: () => Promise; getValues: () => any; } -const ContentSelector = forwardRef( - ({ selectedContent, onNext }, ref) => { +const PoolSelector = forwardRef( + ({ selectedPools, onNext }, ref) => { const [form] = Form.useForm(); // 暴露方法给父组件 @@ -30,7 +30,7 @@ const ContentSelector = forwardRef( await form.validateFields(); return true; } catch (error) { - console.log("ContentSelector 表单验证失败:", error); + console.log("PoolSelector 表单验证失败:", error); return false; } }, @@ -40,12 +40,12 @@ const ContentSelector = forwardRef( })); // 处理选择变化 - const handleContentChange = (contentGroupsOptions: PoolSelectionItem[]) => { - const contentGroups = contentGroupsOptions.map(c => c.id.toString()); - form.setFieldValue("contentGroups", contentGroups); + const handlePoolChange = (poolGroupsOptions: PoolSelectionItem[]) => { + const poolGroups = poolGroupsOptions.map(c => c.id.toString()); + form.setFieldValue("poolGroups", poolGroups); onNext({ - contentGroups, - contentGroupsOptions, + poolGroups, + poolGroupsOptions, }); }; @@ -61,7 +61,7 @@ const ContentSelector = forwardRef( form={form} layout="vertical" initialValues={{ - contentGroups: selectedContent.map(c => c.id.toString()), + poolGroups: selectedPools.map(c => c.id.toString()), }} >
@@ -74,7 +74,7 @@ const ContentSelector = forwardRef(
( ]} > @@ -99,6 +93,6 @@ const ContentSelector = forwardRef( }, ); -ContentSelector.displayName = "ContentSelector"; +PoolSelector.displayName = "PoolSelector"; -export default ContentSelector; +export default PoolSelector; diff --git a/Cunkebao/src/pages/mobile/workspace/auto-group/form/index.tsx b/Cunkebao/src/pages/mobile/workspace/auto-group/form/index.tsx index 19f11b63..ea0a7897 100644 --- a/Cunkebao/src/pages/mobile/workspace/auto-group/form/index.tsx +++ b/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, { - ContentSelectorRef, -} from "./components/ContentSelector"; +import PoolSelector, { PoolSelectorRef } from "./components/PoolSelector"; 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: [], // 内容库 - contentGroupsOptions: [], // 内容库选项 + poolGroups: [], // 内容库 + 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(null); const deviceSelectorRef = useRef(null); - const contentSelectorRef = useRef(null); + const poolSelectorRef = useRef(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 || [], - contentGroupsOptions: res.config.contentGroupsOptions || [], + poolGroups: res.config.poolGroups || [], + 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: { - contentGroups: string[]; - contentGroupsOptions: PoolSelectionItem[]; + const handlePoolsChange = (data: { + poolGroups: string[]; + poolGroupsOptions: PoolSelectionItem[]; }) => { - setFormData(prev => ({ ...prev, contentGroups: data.contentGroups })); - setContentGroupsOptions(data.contentGroupsOptions); + setFormData(prev => ({ ...prev, poolGroups: data.poolGroups })); + 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 ( - ); default: diff --git a/Cunkebao/src/pages/mobile/workspace/auto-group/form/types.ts b/Cunkebao/src/pages/mobile/workspace/auto-group/form/types.ts index f3754955..83ad789d 100644 --- a/Cunkebao/src/pages/mobile/workspace/auto-group/form/types.ts +++ b/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[]; // 内容库 - contentGroupsOptions: ContentItem[]; // 内容库选项 + poolGroups: string[]; // 流量池 + 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: "至少选择一个内容库" }, ],