diff --git a/Cunkebao/app/workspace/traffic-distribution/[id]/edit/page.tsx b/Cunkebao/app/workspace/traffic-distribution/[id]/edit/page.tsx index a7ec2ecbd..4d25df987 100644 --- a/Cunkebao/app/workspace/traffic-distribution/[id]/edit/page.tsx +++ b/Cunkebao/app/workspace/traffic-distribution/[id]/edit/page.tsx @@ -13,6 +13,21 @@ import { api } from "@/lib/api" import { showToast } from "@/lib/toast" import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog" +interface BasicInfoData { + name: string + distributeType: number + maxPerDay: number + timeType: number + startTime: string + endTime: string + account?: string[] + accounts?: string[] +} + +interface TargetSettingsData extends Omit { + accounts?: string[] +} + interface FormData { basicInfo: { name: string @@ -28,7 +43,7 @@ interface FormData { targetSettings: { targetGroups: string[] devices: string[] - accounts?: string[] + account?: string[] } trafficPool: { poolIds: string[] @@ -106,7 +121,7 @@ export default function EditTrafficDistributionPage({ params }: { params: Promis targetSettings: { targetGroups: data.config?.targetGroups || [], devices: (data.config?.devices || []).map(String), - accounts: (data.config?.account || []).map(String), + account: (data.config?.account || []).map(String), }, trafficPool: { poolIds: (data.config?.pools || []).map(String), @@ -126,13 +141,36 @@ export default function EditTrafficDistributionPage({ params }: { params: Promis fetchData() }, [id]) - const handleBasicInfoNext = (data: FormData["basicInfo"]) => { - setFormData((prev) => ({ ...prev, basicInfo: data })) + const handleBasicInfoNext = (data: BasicInfoData) => { + setFormData((prev) => ({ + ...prev, + basicInfo: { + name: data.name, + distributeType: data.distributeType, + maxPerDay: data.maxPerDay, + timeType: data.timeType, + startTime: data.startTime, + endTime: data.endTime, + source: prev.basicInfo.source, + sourceIcon: prev.basicInfo.sourceIcon, + description: prev.basicInfo.description, + }, + targetSettings: { + ...prev.targetSettings, + account: data.account || data.accounts + } + })) setCurrentStep(1) } - const handleTargetSettingsNext = (data: FormData["targetSettings"]) => { - setFormData((prev) => ({ ...prev, targetSettings: data })) + const handleTargetSettingsNext = (data: TargetSettingsData) => { + setFormData((prev) => ({ + ...prev, + targetSettings: { + ...data, + account: data.accounts || prev.targetSettings.account + } + })) setDevices(data.devices || []) setCurrentStep(2) } @@ -166,7 +204,7 @@ export default function EditTrafficDistributionPage({ params }: { params: Promis endTime: finalData.basicInfo.endTime, targetGroups: finalData.targetSettings.targetGroups, devices: finalData.targetSettings.devices, - account: finalData.targetSettings.accounts, + account: finalData.targetSettings.account, pools: finalData.trafficPool.poolIds, enabled: true, }) @@ -202,12 +240,25 @@ export default function EditTrafficDistributionPage({ params }: { params: Promis
- {currentStep === 0 && } + {currentStep === 0 && ( + + )} {currentStep === 1 && ( )} diff --git a/Cunkebao/app/workspace/traffic-distribution/new/components/basic-info-step.tsx b/Cunkebao/app/workspace/traffic-distribution/new/components/basic-info-step.tsx index 43852bd4e..b8b760aeb 100644 --- a/Cunkebao/app/workspace/traffic-distribution/new/components/basic-info-step.tsx +++ b/Cunkebao/app/workspace/traffic-distribution/new/components/basic-info-step.tsx @@ -1,28 +1,59 @@ "use client" -import { useState } from "react" +import { useState, useEffect } from "react" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group" import { Slider } from "@/components/ui/slider" import { format } from "date-fns" +import { Search, Users } from "lucide-react" +import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog" +import { api } from "@/lib/api" interface BasicInfoStepProps { onNext: (data: any) => void - initialData?: any + initialData?: { + name?: string + distributeType?: string | number + maxPerDay?: number + timeType?: string | number + startTime?: string + endTime?: string + accounts?: string[] + account?: string[] + } } export default function BasicInfoStep({ onNext, initialData = {} }: BasicInfoStepProps) { const [formData, setFormData] = useState({ name: initialData.name ?? `流量分发 ${format(new Date(), "yyyyMMdd HHmm")}`, - distributeType: initialData.distributeType ?? "1", - maxPerDay: initialData.maxPerDay ?? 100, - timeType: initialData.timeType ?? "2", + distributeType: String(initialData.distributeType ?? "1"), + maxPerDay: initialData.maxPerDay ?? 200, + timeType: String(initialData.timeType ?? "2"), startTime: initialData.startTime ?? "09:00", endTime: initialData.endTime ?? "18:00", }) + // 账号选择相关状态 + const [accountDialogOpen, setAccountDialogOpen] = useState(false) + const [accountList, setAccountList] = useState([]) + const [selectedAccountIds, setSelectedAccountIds] = useState( + (initialData.account || initialData.accounts || []).map(String) + ) + const [accountPage, setAccountPage] = useState(1) + const [accountTotal, setAccountTotal] = useState(0) + const [accountLoading, setAccountLoading] = useState(false) + + // 拉取账号列表 + useEffect(() => { + setAccountLoading(true) + api.get(`/v1/workbench/account-list?page=${accountPage}&size=10`).then((res: any) => { + setAccountList(res.data?.list || []) + setAccountTotal(res.data?.total || 0) + }).finally(() => setAccountLoading(false)) + }, [accountPage]) + const handleChange = (field: string, value: any) => { setFormData((prev) => ({ ...prev, [field]: value })) } @@ -35,9 +66,16 @@ export default function BasicInfoStep({ onNext, initialData = {} }: BasicInfoSte timeType: Number(formData.timeType), startTime: formData.timeType == "2" ? formData.startTime : "09:00", endTime: formData.timeType == "2" ? formData.endTime : "21:00", + account: selectedAccountIds, + accounts: selectedAccountIds, }) } + // 账号弹窗确认 + const handleAccountDialogConfirm = () => { + setAccountDialogOpen(false) + } + return (

基本信息

@@ -69,18 +107,6 @@ export default function BasicInfoStep({ onNext, initialData = {} }: BasicInfoSte 均分配 (流量将均分配给所有客服)
- {/*
- - -
-
- - -
*/}
@@ -95,12 +121,12 @@ export default function BasicInfoStep({ onNext, initialData = {} }: BasicInfoSte handleChange("maxPerDay", value[0])} className="py-4" /> -

限制每天最多分配的流量数量

+

限制每天最多分配的流量数量(1-1000)

@@ -156,13 +182,91 @@ export default function BasicInfoStep({ onNext, initialData = {} }: BasicInfoSte )}
+ + {/* 账号选择 */} +
+ +
+ + 0 ? `已选择${selectedAccountIds.length}个账号` : ''} + readOnly + className="pl-10 cursor-pointer" + onClick={() => setAccountDialogOpen(true)} + /> +
+
+ + 已选账号: + {selectedAccountIds.length === 0 ? ( + 未选择 + ) : ( + {selectedAccountIds.length} 个 + )} +
+
-
+ + {/* 账号选择弹窗 */} + + + 选择账号 +
+ {/* 账号列表 */} +
+ {accountLoading ? ( +
加载中...
+ ) : accountList.length === 0 ? ( +
暂无账号
+ ) : ( + accountList.map(account => ( + + )) + )} +
+ {/* 确认按钮 */} +
+ +
+
+
+
) } diff --git a/Cunkebao/app/workspace/traffic-distribution/new/components/target-settings-step.tsx b/Cunkebao/app/workspace/traffic-distribution/new/components/target-settings-step.tsx index c2fc362cd..25073be89 100644 --- a/Cunkebao/app/workspace/traffic-distribution/new/components/target-settings-step.tsx +++ b/Cunkebao/app/workspace/traffic-distribution/new/components/target-settings-step.tsx @@ -6,7 +6,7 @@ import { Card, CardContent } from "@/components/ui/card" import { Checkbox } from "@/components/ui/checkbox" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Avatar } from "@/components/ui/avatar" -import { Search, Users, Smartphone } from "lucide-react" +import { Search, Smartphone } from "lucide-react" import { Input } from "@/components/ui/input" import { api } from "@/lib/api" import { DeviceSelectionDialog } from "@/app/components/device-selection-dialog" @@ -19,13 +19,6 @@ interface Device { avatar?: string } -interface CustomerService { - id: string - name: string - status: "online" | "offline" - avatar?: string -} - interface TargetSettingsStepProps { onNext: (data: any) => void onBack: () => void @@ -40,14 +33,6 @@ export default function TargetSettingsStep({ onNext, onBack, initialData = {}, s const [deviceDialogOpen, setDeviceDialogOpen] = useState(false) const [statusFilter, setStatusFilter] = useState("all") - // 账号选择相关状态 - const [accountDialogOpen, setAccountDialogOpen] = useState(false) - const [accountList, setAccountList] = useState([]) - const [selectedAccountIds, setSelectedAccountIds] = useState([]) - const [accountPage, setAccountPage] = useState(1) - const [accountTotal, setAccountTotal] = useState(0) - const [accountLoading, setAccountLoading] = useState(false) - // 每次 initialData.devices 变化时,同步 selectedDeviceIds useEffect(() => { const ids = Array.isArray(initialData.devices) ? initialData.devices.map(String) : []; @@ -61,29 +46,6 @@ export default function TargetSettingsStep({ onNext, onBack, initialData = {}, s }).finally(() => setLoading(false)) }, []) - // 同步初始账号 - useEffect(() => { - const ids = Array.isArray(initialData.accounts) ? initialData.accounts.map(String) : []; - setSelectedAccountIds(ids); - }, [initialData.accounts]) - - // 拉取账号列表 - useEffect(() => { - setAccountLoading(true) - api.get(`/v1/workbench/account-list?page=${accountPage}&size=10`).then((res: any) => { - setAccountList(res.data?.list || []) - setAccountTotal(res.data?.total || 0) - }).finally(() => setAccountLoading(false)) - }, [accountPage]) - - // 账号弹窗每次打开时同步反选 - useEffect(() => { - if (accountDialogOpen) { - const ids = Array.isArray(initialData.accounts) ? initialData.accounts.map(String) : []; - setSelectedAccountIds(ids); - } - }, [accountDialogOpen, initialData.accounts]) - const filteredDevices = deviceList.filter(device => { const matchesSearch = search === "" || @@ -95,7 +57,7 @@ export default function TargetSettingsStep({ onNext, onBack, initialData = {}, s }) const handleSubmit = () => { - onNext({ devices: selectedDeviceIds, accounts: selectedAccountIds }) + onNext({ devices: selectedDeviceIds }) } // 弹窗内确认选择 @@ -106,11 +68,6 @@ export default function TargetSettingsStep({ onNext, onBack, initialData = {}, s setDeviceDialogOpen(false) } - // 账号弹窗确认 - const handleAccountDialogConfirm = () => { - setAccountDialogOpen(false) - } - return (

目标设置

@@ -127,30 +84,8 @@ export default function TargetSettingsStep({ onNext, onBack, initialData = {}, s />
- {/* 账号选择 */} -
-
- - 0 ? `已选择${selectedAccountIds.length}个账号` : ''} - readOnly - className="pl-10 cursor-pointer" - onClick={() => setAccountDialogOpen(true)} - /> -
-
- {/* 已选账号/设备展示优化 */} + {/* 已选设备展示优化 */}
-
- - 已选账号: - {selectedAccountIds.length === 0 ? ( - 未选择 - ) : ( - {selectedAccountIds.length} 个 - )} -
已选设备: @@ -243,66 +178,6 @@ export default function TargetSettingsStep({ onNext, onBack, initialData = {}, s
- {/* 账号选择弹窗 */} - - - 选择账号 -
- {/* 账号列表 */} -
- {accountLoading ? ( -
加载中...
- ) : accountList.length === 0 ? ( -
暂无账号
- ) : ( - accountList.map(account => ( - - )) - )} -
- {/* 分页 */} -
- - 第 {accountPage} 页 / 共 {Math.ceil(accountTotal / 10) || 1} 页 - -
- {/* 确认按钮 */} -
- -
-
-
-
) } diff --git a/Cunkebao/app/workspace/traffic-distribution/new/page.tsx b/Cunkebao/app/workspace/traffic-distribution/new/page.tsx index b62f012f4..f8b111e82 100644 --- a/Cunkebao/app/workspace/traffic-distribution/new/page.tsx +++ b/Cunkebao/app/workspace/traffic-distribution/new/page.tsx @@ -23,6 +23,7 @@ interface FormData { timeType: number startTime: string endTime: string + accounts?: string[] } targetSettings: { targetGroups: string[] @@ -76,12 +77,25 @@ export default function NewTrafficDistribution() { ] const handleBasicInfoNext = (data: FormData["basicInfo"]) => { - setFormData((prev) => ({ ...prev, basicInfo: data })) + setFormData((prev) => ({ + ...prev, + basicInfo: data, + targetSettings: { + ...prev.targetSettings, + accounts: data.accounts + } + })) setCurrentStep(1) } const handleTargetSettingsNext = (data: FormData["targetSettings"]) => { - setFormData((prev) => ({ ...prev, targetSettings: { ...data } })) + setFormData((prev) => ({ + ...prev, + targetSettings: { + ...data, + accounts: prev.targetSettings.accounts + } + })) setDevices(data.devices || []) setCurrentStep(2) }