diff --git a/Cunkebao/app/components/ui-templates/card-grid.tsx b/Cunkebao/app/components/ui-templates/card-grid.tsx
new file mode 100644
index 00000000..14453fa0
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/card-grid.tsx
@@ -0,0 +1,42 @@
+"use client"
+
+import type React from "react"
+import { cn } from "@/app/lib/utils"
+
+interface CardGridProps {
+  children: React.ReactNode
+  className?: string
+  columns?: {
+    sm?: number
+    md?: number
+    lg?: number
+    xl?: number
+  }
+  gap?: "none" | "sm" | "md" | "lg"
+}
+
+/**
+ * 自适应卡片网格组件
+ * 根据屏幕尺寸自动调整卡片布局
+ */
+export function CardGrid({ children, className, columns = { sm: 1, md: 2, lg: 3, xl: 4 }, gap = "md" }: CardGridProps) {
+  // 根据gap参数设置间距
+  const gapClasses = {
+    none: "gap-0",
+    sm: "gap-2",
+    md: "gap-4",
+    lg: "gap-6",
+  }
+
+  // 根据columns参数设置网格列数
+  const getGridCols = () => {
+    const cols = []
+    if (columns.sm) cols.push(`grid-cols-${columns.sm}`)
+    if (columns.md) cols.push(`md:grid-cols-${columns.md}`)
+    if (columns.lg) cols.push(`lg:grid-cols-${columns.lg}`)
+    if (columns.xl) cols.push(`xl:grid-cols-${columns.xl}`)
+    return cols.join(" ")
+  }
+
+  return <div className={cn("grid w-full", getGridCols(), gapClasses[gap], className)}>{children}</div>
+}
diff --git a/Cunkebao/app/components/ui-templates/cards.tsx b/Cunkebao/app/components/ui-templates/cards.tsx
new file mode 100644
index 00000000..543268a7
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/cards.tsx
@@ -0,0 +1,138 @@
+"use client"
+import { Card } from "@/components/ui/card"
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import { Clock, TrendingUp, Users } from "lucide-react"
+
+interface StatsCardProps {
+  title: string
+  value: string | number
+  description?: string
+  trend?: number
+  trendLabel?: string
+  className?: string
+  valueClassName?: string
+}
+
+/**
+ * 统计数据卡片
+ * 用于展示关键指标数据
+ */
+export function StatsCard({
+  title,
+  value,
+  description,
+  trend,
+  trendLabel,
+  className = "",
+  valueClassName = "text-xl font-bold text-blue-600",
+}: StatsCardProps) {
+  return (
+    <Card className={`p-3 ${className}`}>
+      <div className="text-sm text-gray-500">{title}</div>
+      <div className={valueClassName}>{value}</div>
+      {description && <div className="text-xs text-gray-500 mt-1">{description}</div>}
+      {trend !== undefined && (
+        <div className={`flex items-center text-xs mt-1 ${trend >= 0 ? "text-green-600" : "text-red-600"}`}>
+          {trend >= 0 ? "↑" : "↓"} {Math.abs(trend)}% {trendLabel || ""}
+        </div>
+      )}
+    </Card>
+  )
+}
+
+interface DistributionPlanCardProps {
+  id: string
+  name: string
+  status: "active" | "paused" | "completed"
+  source: string
+  sourceIcon: string
+  targetGroups: string[]
+  totalUsers: number
+  dailyAverage: number
+  lastUpdated: string
+  createTime: string
+  creator: string
+  onView?: (id: string) => void
+  onEdit?: (id: string) => void
+  onDelete?: (id: string) => void
+  onToggleStatus?: (id: string, status: "active" | "paused") => void
+}
+
+/**
+ * 流量分发计划卡片
+ * 用于展示流量分发计划信息
+ */
+export function DistributionPlanCard({
+  id,
+  name,
+  status,
+  source,
+  sourceIcon,
+  targetGroups,
+  totalUsers,
+  dailyAverage,
+  lastUpdated,
+  createTime,
+  creator,
+  onView,
+  onEdit,
+  onDelete,
+  onToggleStatus,
+}: DistributionPlanCardProps) {
+  return (
+    <Card className="p-4">
+      <div className="flex items-center justify-between mb-4">
+        <div className="flex items-center space-x-2">
+          <span className="text-xl mr-1">{sourceIcon}</span>
+          <h3 className="font-medium">{name}</h3>
+          <Badge variant={status === "active" ? "success" : status === "completed" ? "outline" : "secondary"}>
+            {status === "active" ? "进行中" : status === "completed" ? "已完成" : "已暂停"}
+          </Badge>
+        </div>
+        <div className="flex items-center space-x-2">
+          {onToggleStatus && status !== "completed" && (
+            <Button
+              variant="ghost"
+              size="sm"
+              onClick={() => onToggleStatus(id, status === "active" ? "paused" : "active")}
+            >
+              {status === "active" ? "暂停" : "启动"}
+            </Button>
+          )}
+          {onView && (
+            <Button variant="ghost" size="sm" onClick={() => onView(id)}>
+              <Users className="h-4 w-4 mr-1" />
+              查看
+            </Button>
+          )}
+          {onEdit && (
+            <Button variant="ghost" size="sm" onClick={() => onEdit(id)}>
+              <TrendingUp className="h-4 w-4 mr-1" />
+              编辑
+            </Button>
+          )}
+        </div>
+      </div>
+
+      <div className="grid grid-cols-2 gap-4 mb-4">
+        <div className="text-sm text-gray-500">
+          <div>目标人群：{targetGroups.join(", ")}</div>
+          <div>总流量：{totalUsers} 人</div>
+        </div>
+        <div className="text-sm text-gray-500">
+          <div>日均获取：{dailyAverage} 人</div>
+          <div>创建人：{creator}</div>
+        </div>
+      </div>
+
+      <div className="flex items-center justify-between text-xs text-gray-500 border-t pt-4">
+        <div className="flex items-center">
+          <Clock className="w-4 h-4 mr-1" />
+          上次更新：{lastUpdated}
+        </div>
+        <div>创建时间：{createTime}</div>
+      </div>
+    </Card>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/form-layout.tsx b/Cunkebao/app/components/ui-templates/form-layout.tsx
new file mode 100644
index 00000000..0ca625ef
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/form-layout.tsx
@@ -0,0 +1,87 @@
+"use client"
+
+import type React from "react"
+import { cn } from "@/app/lib/utils"
+
+interface FormLayoutProps {
+  children: React.ReactNode
+  className?: string
+  layout?: "vertical" | "horizontal" | "responsive"
+  labelWidth?: string
+  gap?: "none" | "sm" | "md" | "lg"
+}
+
+/**
+ * 自适应表单布局组件
+ * 支持垂直、水平和响应式布局
+ */
+export function FormLayout({
+  children,
+  className,
+  layout = "responsive",
+  labelWidth = "w-32",
+  gap = "md",
+}: FormLayoutProps) {
+  // 根据gap参数设置间距
+  const gapClasses = {
+    none: "space-y-0",
+    sm: "space-y-2",
+    md: "space-y-4",
+    lg: "space-y-6",
+  }
+
+  // 根据layout参数设置布局类
+  const getLayoutClasses = () => {
+    switch (layout) {
+      case "horizontal":
+        return "form-horizontal"
+      case "vertical":
+        return "form-vertical"
+      case "responsive":
+        return "form-vertical md:form-horizontal"
+      default:
+        return "form-vertical"
+    }
+  }
+
+  return (
+    <div
+      className={cn("w-full", getLayoutClasses(), gapClasses[gap], className, {
+        [`[--label-width:${labelWidth}]`]: layout !== "vertical",
+      })}
+    >
+      {children}
+    </div>
+  )
+}
+
+export default FormLayout
+
+interface FormItemProps {
+  children: React.ReactNode
+  label?: React.ReactNode
+  className?: string
+  required?: boolean
+  error?: string
+}
+
+/**
+ * 表单项组件
+ * 配合FormLayout使用
+ */
+export function FormItem({ children, label, className, required, error }: FormItemProps) {
+  return (
+    <div className={cn("form-item", className)}>
+      {label && (
+        <div className="form-label">
+          {label}
+          {required && <span className="text-red-500 ml-1">*</span>}
+        </div>
+      )}
+      <div className="form-control">
+        {children}
+        {error && <div className="text-red-500 text-sm mt-1">{error}</div>}
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/forms.tsx b/Cunkebao/app/components/ui-templates/forms.tsx
new file mode 100644
index 00000000..71d00342
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/forms.tsx
@@ -0,0 +1,273 @@
+"use client"
+
+/**
+ * 表单组件模板
+ *
+ * 包含项目中常用的各种表单组件
+ */
+
+import type React from "react"
+import { Label } from "@/components/ui/label"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"
+import { Slider } from "@/components/ui/slider"
+import { Switch } from "@/components/ui/switch"
+
+interface FormFieldProps {
+  label: string
+  htmlFor: string
+  required?: boolean
+  description?: string
+  error?: string
+  children: React.ReactNode
+}
+
+/**
+ * 表单字段容器
+ * 用于包装表单控件
+ */
+export function FormField({ label, htmlFor, required = false, description, error, children }: FormFieldProps) {
+  return (
+    <div className="space-y-2">
+      <Label htmlFor={htmlFor}>
+        {label} {required && <span className="text-red-500">*</span>}
+      </Label>
+      {children}
+      {description && <p className="text-xs text-gray-500">{description}</p>}
+      {error && <p className="text-xs text-red-500">{error}</p>}
+    </div>
+  )
+}
+
+interface TextInputFieldProps {
+  label: string
+  id: string
+  value: string
+  onChange: (value: string) => void
+  placeholder?: string
+  required?: boolean
+  description?: string
+  error?: string
+  type?: string
+}
+
+/**
+ * 文本输入字段
+ * 用于文本输入
+ */
+export function TextInputField({
+  label,
+  id,
+  value,
+  onChange,
+  placeholder,
+  required = false,
+  description,
+  error,
+  type = "text",
+}: TextInputFieldProps) {
+  return (
+    <FormField label={label} htmlFor={id} required={required} description={description} error={error}>
+      <Input id={id} type={type} value={value} onChange={(e) => onChange(e.target.value)} placeholder={placeholder} />
+    </FormField>
+  )
+}
+
+interface TextareaFieldProps {
+  label: string
+  id: string
+  value: string
+  onChange: (value: string) => void
+  placeholder?: string
+  required?: boolean
+  description?: string
+  error?: string
+}
+
+/**
+ * 多行文本输入字段
+ * 用于多行文本输入
+ */
+export function TextareaField({
+  label,
+  id,
+  value,
+  onChange,
+  placeholder,
+  required = false,
+  description,
+  error,
+}: TextareaFieldProps) {
+  return (
+    <FormField label={label} htmlFor={id} required={required} description={description} error={error}>
+      <Textarea id={id} value={value} onChange={(e) => onChange(e.target.value)} placeholder={placeholder} />
+    </FormField>
+  )
+}
+
+interface SelectFieldProps {
+  label: string
+  id: string
+  value: string
+  onChange: (value: string) => void
+  options: Array<{ value: string; label: string }>
+  placeholder?: string
+  required?: boolean
+  description?: string
+  error?: string
+}
+
+/**
+ * 下拉选择字段
+ * 用于从选项中选择
+ */
+export function SelectField({
+  label,
+  id,
+  value,
+  onChange,
+  options,
+  placeholder = "请选择",
+  required = false,
+  description,
+  error,
+}: SelectFieldProps) {
+  return (
+    <FormField label={label} htmlFor={id} required={required} description={description} error={error}>
+      <Select value={value} onValueChange={onChange}>
+        <SelectTrigger id={id}>
+          <SelectValue placeholder={placeholder} />
+        </SelectTrigger>
+        <SelectContent>
+          {options.map((option) => (
+            <SelectItem key={option.value} value={option.value}>
+              {option.label}
+            </SelectItem>
+          ))}
+        </SelectContent>
+      </Select>
+    </FormField>
+  )
+}
+
+interface RadioFieldProps {
+  label: string
+  name: string
+  value: string
+  onChange: (value: string) => void
+  options: Array<{ value: string; label: string; description?: string }>
+  required?: boolean
+  description?: string
+  error?: string
+}
+
+/**
+ * 单选按钮组字段
+ * 用于从选项中单选
+ */
+export function RadioField({
+  label,
+  name,
+  value,
+  onChange,
+  options,
+  required = false,
+  description,
+  error,
+}: RadioFieldProps) {
+  return (
+    <div className="space-y-2">
+      <Label>
+        {label} {required && <span className="text-red-500">*</span>}
+      </Label>
+      <RadioGroup value={value} onValueChange={onChange} className="space-y-3">
+        {options.map((option) => (
+          <div key={option.value} className="flex items-center space-x-2">
+            <RadioGroupItem value={option.value} id={`${name}-${option.value}`} />
+            <Label htmlFor={`${name}-${option.value}`} className="cursor-pointer">
+              {option.label}
+            </Label>
+            {option.description && <span className="text-xs text-gray-500 ml-2">({option.description})</span>}
+          </div>
+        ))}
+      </RadioGroup>
+      {description && <p className="text-xs text-gray-500">{description}</p>}
+      {error && <p className="text-xs text-red-500">{error}</p>}
+    </div>
+  )
+}
+
+interface SliderFieldProps {
+  label: string
+  id: string
+  value: number
+  onChange: (value: number) => void
+  min: number
+  max: number
+  step?: number
+  unit?: string
+  required?: boolean
+  description?: string
+  error?: string
+}
+
+/**
+ * 滑块字段
+ * 用于数值范围选择
+ */
+export function SliderField({
+  label,
+  id,
+  value,
+  onChange,
+  min,
+  max,
+  step = 1,
+  unit = "",
+  required = false,
+  description,
+  error,
+}: SliderFieldProps) {
+  return (
+    <div className="space-y-2">
+      <div className="flex items-center justify-between">
+        <Label htmlFor={id}>
+          {label} {required && <span className="text-red-500">*</span>}
+        </Label>
+        <span className="text-sm font-medium">
+          {value} {unit}
+        </span>
+      </div>
+      <Slider id={id} min={min} max={max} step={step} value={[value]} onValueChange={(values) => onChange(values[0])} />
+      {description && <p className="text-xs text-gray-500">{description}</p>}
+      {error && <p className="text-xs text-red-500">{error}</p>}
+    </div>
+  )
+}
+
+interface SwitchFieldProps {
+  label: string
+  id: string
+  checked: boolean
+  onCheckedChange: (checked: boolean) => void
+  description?: string
+  disabled?: boolean
+}
+
+/**
+ * 开关字段
+ * 用于布尔值选择
+ */
+export function SwitchField({ label, id, checked, onCheckedChange, description, disabled = false }: SwitchFieldProps) {
+  return (
+    <div className="space-y-2">
+      <div className="flex items-center justify-between">
+        <Label htmlFor={id}>{label}</Label>
+        <Switch id={id} checked={checked} onCheckedChange={onCheckedChange} disabled={disabled} />
+      </div>
+      {description && <p className="text-xs text-gray-500">{description}</p>}
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/index.tsx b/Cunkebao/app/components/ui-templates/index.tsx
new file mode 100644
index 00000000..501005b2
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/index.tsx
@@ -0,0 +1,12 @@
+/**
+ * 存客宝UI组件模板库
+ *
+ * 这个文件导出所有可重用的UI组件模板，方便在项目中快速引用
+ */
+
+export * from "./cards"
+export * from "./forms"
+export * from "./layouts"
+export * from "./tables"
+export * from "./stats"
+export * from "./selectors"
diff --git a/Cunkebao/app/components/ui-templates/layouts.tsx b/Cunkebao/app/components/ui-templates/layouts.tsx
new file mode 100644
index 00000000..93e4c818
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/layouts.tsx
@@ -0,0 +1,119 @@
+"use client"
+
+/**
+ * 布局组件模板
+ *
+ * 包含项目中常用的各种布局组件
+ */
+
+import type React from "react"
+import { Button } from "@/components/ui/button"
+import { ChevronLeft } from "lucide-react"
+
+interface PageHeaderProps {
+  title: string
+  onBack?: () => void
+  actionButton?: React.ReactNode
+}
+
+/**
+ * 页面头部组件
+ * 用于页面顶部的标题和操作区
+ */
+export function PageHeader({ title, onBack, actionButton }: PageHeaderProps) {
+  return (
+    <header className="sticky top-0 z-10 bg-white border-b">
+      <div className="flex items-center justify-between p-4">
+        <div className="flex items-center space-x-3">
+          {onBack && (
+            <Button variant="ghost" size="icon" onClick={onBack}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+          )}
+          <h1 className="text-lg font-medium">{title}</h1>
+        </div>
+        {actionButton}
+      </div>
+    </header>
+  )
+}
+
+interface StepIndicatorProps {
+  steps: Array<{
+    step: number
+    title: string
+    icon: React.ReactNode
+  }>
+  currentStep: number
+}
+
+/**
+ * 步骤指示器组件
+ * 用于多步骤流程的导航
+ */
+export function StepIndicator({ steps, currentStep }: StepIndicatorProps) {
+  return (
+    <div className="mb-6">
+      <div className="flex items-center justify-between">
+        {steps.map(({ step, title, icon }) => (
+          <div key={step} className="flex flex-col items-center">
+            <div
+              className={`w-10 h-10 rounded-full flex items-center justify-center ${
+                step === currentStep
+                  ? "bg-blue-600 text-white"
+                  : step < currentStep
+                    ? "bg-green-500 text-white"
+                    : "bg-gray-200 text-gray-500"
+              }`}
+            >
+              {step < currentStep ? "✓" : icon}
+            </div>
+            <span className="text-xs mt-1">{title}</span>
+          </div>
+        ))}
+      </div>
+      <div className="relative mt-2">
+        <div className="absolute top-0 left-0 right-0 h-1 bg-gray-200"></div>
+        <div
+          className="absolute top-0 left-0 h-1 bg-blue-600 transition-all"
+          style={{ width: `${((currentStep - 1) / (steps.length - 1)) * 100}%` }}
+        ></div>
+      </div>
+    </div>
+  )
+}
+
+interface StepNavigationProps {
+  onBack: () => void
+  onNext: () => void
+  nextLabel?: string
+  backLabel?: string
+  isLastStep?: boolean
+  isNextDisabled?: boolean
+}
+
+/**
+ * 步骤导航组件
+ * 用于多步骤流程的前进后退按钮
+ */
+export function StepNavigation({
+  onBack,
+  onNext,
+  nextLabel = "下一步",
+  backLabel = "上一步",
+  isLastStep = false,
+  isNextDisabled = false,
+}: StepNavigationProps) {
+  return (
+    <div className="pt-4 flex justify-between">
+      <Button variant="outline" onClick={onBack}>
+        <ChevronLeft className="mr-2 h-4 w-4" />
+        {backLabel}
+      </Button>
+      <Button onClick={onNext} disabled={isNextDisabled}>
+        {isLastStep ? "完成" : nextLabel}
+        {!isLastStep && <span className="ml-2">→</span>}
+      </Button>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/page-header.tsx b/Cunkebao/app/components/ui-templates/page-header.tsx
new file mode 100644
index 00000000..d4267f0e
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/page-header.tsx
@@ -0,0 +1,49 @@
+"use client"
+
+import type React from "react"
+import { cn } from "@/app/lib/utils"
+import { Button } from "@/app/components/ui/button"
+import { ChevronLeft } from "lucide-react"
+import { useRouter } from "next/navigation"
+
+interface PageHeaderProps {
+  title: React.ReactNode
+  subtitle?: React.ReactNode
+  backButton?: boolean
+  backUrl?: string
+  actions?: React.ReactNode
+  className?: string
+}
+
+/**
+ * 页面标题组件
+ * 支持返回按钮和操作按钮
+ */
+export function PageHeader({ title, subtitle, backButton = false, backUrl, actions, className }: PageHeaderProps) {
+  const router = useRouter()
+
+  const handleBack = () => {
+    if (backUrl) {
+      router.push(backUrl)
+    } else {
+      router.back()
+    }
+  }
+
+  return (
+    <div className={cn("flex flex-col md:flex-row md:items-center justify-between gap-4 mb-6", className)}>
+      <div className="flex items-center gap-2">
+        {backButton && (
+          <Button variant="ghost" size="icon" onClick={handleBack} className="h-8 w-8">
+            <ChevronLeft className="h-4 w-4" />
+          </Button>
+        )}
+        <div>
+          <h1 className="text-2xl font-bold">{title}</h1>
+          {subtitle && <p className="text-muted-foreground mt-1">{subtitle}</p>}
+        </div>
+      </div>
+      {actions && <div className="flex items-center gap-2">{actions}</div>}
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/responsive-table.tsx b/Cunkebao/app/components/ui-templates/responsive-table.tsx
new file mode 100644
index 00000000..33415ae9
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/responsive-table.tsx
@@ -0,0 +1,103 @@
+"use client"
+
+import React from "react"
+import { cn } from "@/app/lib/utils"
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/app/components/ui/table"
+
+interface Column<T> {
+  key: string
+  title: React.ReactNode
+  render?: (value: any, record: T, index: number) => React.ReactNode
+  width?: number | string
+  className?: string
+  responsive?: boolean // 是否在小屏幕上显示
+}
+
+interface ResponsiveTableProps<T> {
+  columns: Column<T>[]
+  dataSource: T[]
+  rowKey?: string | ((record: T) => string)
+  className?: string
+  loading?: boolean
+  emptyText?: React.ReactNode
+}
+
+/**
+ * 响应式表格组件
+ * 在小屏幕上自动隐藏不重要的列
+ */
+export function ResponsiveTable<T extends Record<string, any>>({
+  columns,
+  dataSource,
+  rowKey = "id",
+  className,
+  loading = false,
+  emptyText = "暂无数据",
+}: ResponsiveTableProps<T>) {
+  // 根据屏幕尺寸过滤列
+  const [visibleColumns, setVisibleColumns] = React.useState(columns)
+
+  React.useEffect(() => {
+    const handleResize = () => {
+      if (window.innerWidth < 768) {
+        // 在小屏幕上只显示responsive不为false的列
+        setVisibleColumns(columns.filter((col) => col.responsive !== false))
+      } else {
+        setVisibleColumns(columns)
+      }
+    }
+
+    handleResize()
+    window.addEventListener("resize", handleResize)
+    return () => window.removeEventListener("resize", handleResize)
+  }, [columns])
+
+  // 获取行的唯一键
+  const getRowKey = (record: T, index: number) => {
+    if (typeof rowKey === "function") {
+      return rowKey(record)
+    }
+    return record[rowKey] || index
+  }
+
+  return (
+    <div className="responsive-table-container">
+      <Table className={cn("w-full", className)}>
+        <TableHeader>
+          <TableRow>
+            {visibleColumns.map((column) => (
+              <TableHead key={column.key} className={column.className} style={{ width: column.width }}>
+                {column.title}
+              </TableHead>
+            ))}
+          </TableRow>
+        </TableHeader>
+        <TableBody>
+          {loading ? (
+            <TableRow>
+              <TableCell colSpan={visibleColumns.length} className="text-center h-24">
+                加载中...
+              </TableCell>
+            </TableRow>
+          ) : dataSource.length === 0 ? (
+            <TableRow>
+              <TableCell colSpan={visibleColumns.length} className="text-center h-24">
+                {emptyText}
+              </TableCell>
+            </TableRow>
+          ) : (
+            dataSource.map((record, index) => (
+              <TableRow key={getRowKey(record, index)}>
+                {visibleColumns.map((column) => (
+                  <TableCell key={column.key} className={column.className}>
+                    {column.render ? column.render(record[column.key], record, index) : record[column.key]}
+                  </TableCell>
+                ))}
+              </TableRow>
+            ))
+          )}
+        </TableBody>
+      </Table>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/selectors.tsx b/Cunkebao/app/components/ui-templates/selectors.tsx
new file mode 100644
index 00000000..b73bcf76
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/selectors.tsx
@@ -0,0 +1,130 @@
+"use client"
+import { Card } from "@/components/ui/card"
+import { Checkbox } from "@/components/ui/checkbox"
+import { Label } from "@/components/ui/label"
+import { Badge } from "@/components/ui/badge"
+
+interface CustomerServiceRepProps {
+  id: string
+  name: string
+  deviceId: string
+  status: "online" | "offline"
+  avatar?: string
+  selected: boolean
+  disabled?: boolean
+  onSelect: (id: string, checked: boolean) => void
+}
+
+/**
+ * 客服代表选择卡片
+ * 用于选择客服代表
+ */
+export function CustomerServiceRepCard({
+  id,
+  name,
+  deviceId,
+  status,
+  avatar,
+  selected,
+  disabled = false,
+  onSelect,
+}: CustomerServiceRepProps) {
+  return (
+    <Card
+      className={`p-3 hover:shadow-md transition-shadow cursor-pointer ${
+        selected ? "border-primary bg-blue-50" : ""
+      } ${disabled ? "opacity-50 pointer-events-none" : ""}`}
+      onClick={() => !disabled && onSelect(id, !selected)}
+    >
+      <div className="flex items-center space-x-3">
+        <Checkbox
+          checked={selected}
+          onCheckedChange={() => !disabled && onSelect(id, !selected)}
+          disabled={disabled}
+          id={`rep-${id}`}
+        />
+        <div className="flex-1 min-w-0">
+          <div className="flex items-center justify-between mb-1">
+            <label htmlFor={`rep-${id}`} className="font-medium truncate cursor-pointer">
+              {name}
+            </label>
+            <div
+              className={`px-2 py-1 rounded-full text-xs ${
+                status === "online" ? "bg-green-100 text-green-800" : "bg-red-100 text-red-800"
+              }`}
+            >
+              {status === "online" ? "在线" : "离线"}
+            </div>
+          </div>
+          <div className="text-sm text-gray-500">设备ID: {deviceId}</div>
+          <div className="text-sm text-gray-500">客服ID: {id}</div>
+        </div>
+      </div>
+    </Card>
+  )
+}
+
+interface DeviceSelectProps {
+  allDevices: boolean
+  newDevices: boolean
+  targetDevices: string[]
+  onAllDevicesChange: (checked: boolean) => void
+  onNewDevicesChange: (checked: boolean) => void
+  onShowDeviceSelector: () => void
+}
+
+/**
+ * 设备选择组件
+ * 用于选择设备
+ */
+export function DeviceSelectSection({
+  allDevices,
+  newDevices,
+  targetDevices,
+  onAllDevicesChange,
+  onNewDevicesChange,
+  onShowDeviceSelector,
+}: DeviceSelectProps) {
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center space-x-2">
+        <Checkbox
+          id="allDevices"
+          checked={allDevices}
+          onCheckedChange={(checked) => onAllDevicesChange(checked === true)}
+        />
+        <Label htmlFor="allDevices" className="font-medium">
+          所有设备
+        </Label>
+        <span className="text-xs text-gray-500">(系统自动分配流量到所有在线设备)</span>
+      </div>
+
+      <div className="flex items-center space-x-2">
+        <Checkbox
+          id="newDevices"
+          checked={newDevices}
+          onCheckedChange={(checked) => onNewDevicesChange(checked === true)}
+          disabled={allDevices}
+        />
+        <Label htmlFor="newDevices" className="font-medium">
+          新添加设备
+        </Label>
+        <span className="text-xs text-gray-500">(仅针对新添加设备进行流量分发)</span>
+      </div>
+
+      <div className="space-y-2 pt-4">
+        <Label className="font-medium">指定设备</Label>
+        <p className="text-xs text-gray-500 mb-2">选择特定的设备进行流量分发</p>
+
+        <button
+          className="w-full flex items-center justify-center space-x-2 border border-gray-300 rounded-md py-2 px-4 hover:bg-gray-50 transition-colors"
+          disabled={allDevices}
+          onClick={onShowDeviceSelector}
+        >
+          <span>选择设备</span>
+          {targetDevices?.length > 0 && <Badge variant="secondary">已选 {targetDevices.length} 台</Badge>}
+        </button>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/stats.tsx b/Cunkebao/app/components/ui-templates/stats.tsx
new file mode 100644
index 00000000..3ed16901
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/stats.tsx
@@ -0,0 +1,58 @@
+/**
+ * 统计组件模板
+ *
+ * 包含项目中常用的各种统计和数据展示组件
+ */
+
+import type React from "react"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+
+interface StatsSummaryProps {
+  stats: Array<{
+    title: string
+    value: string | number
+    color?: string
+  }>
+}
+
+/**
+ * 统计摘要组件
+ * 用于展示多个统计数据
+ */
+export function StatsSummary({ stats }: StatsSummaryProps) {
+  return (
+    <div className="grid grid-cols-2 gap-3">
+      {stats.map((stat, index) => (
+        <Card key={index} className="p-3">
+          <div className="text-sm text-gray-500">{stat.title}</div>
+          <div className={`text-xl font-bold ${stat.color || "text-blue-600"}`}>{stat.value}</div>
+        </Card>
+      ))}
+    </div>
+  )
+}
+
+interface DataCardProps {
+  title: string
+  children: React.ReactNode
+  className?: string
+  headerAction?: React.ReactNode
+}
+
+/**
+ * 数据卡片组件
+ * 用于包装数据展示内容
+ */
+export function DataCard({ title, children, className = "", headerAction }: DataCardProps) {
+  return (
+    <Card className={className}>
+      <CardHeader className="pb-2">
+        <div className="flex items-center justify-between">
+          <CardTitle className="text-base">{title}</CardTitle>
+          {headerAction}
+        </div>
+      </CardHeader>
+      <CardContent>{children}</CardContent>
+    </Card>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/step-indicator.tsx b/Cunkebao/app/components/ui-templates/step-indicator.tsx
new file mode 100644
index 00000000..439b87f7
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/step-indicator.tsx
@@ -0,0 +1,46 @@
+"use client"
+
+import { cn } from "@/app/lib/utils"
+
+interface StepIndicatorProps {
+  steps: { id: number; title: string; subtitle?: string }[]
+  currentStep: number
+  className?: string
+}
+
+export function StepIndicator({ steps, currentStep, className }: StepIndicatorProps) {
+  return (
+    <div className={cn("w-full", className)}>
+      <div className="flex justify-between items-center mb-2">
+        {steps.map((step) => (
+          <div
+            key={step.id}
+            className={cn("flex flex-col items-center", currentStep === step.id ? "text-blue-600" : "text-gray-400")}
+          >
+            <div
+              className={cn(
+                "w-10 h-10 rounded-full flex items-center justify-center text-lg font-medium mb-1",
+                currentStep === step.id
+                  ? "bg-blue-600 text-white"
+                  : currentStep > step.id
+                    ? "bg-blue-100 text-blue-600"
+                    : "bg-gray-200 text-gray-500",
+              )}
+            >
+              {step.id}
+            </div>
+            <div className="text-xs">{step.title}</div>
+            {step.subtitle && <div className="text-xs font-medium">{step.subtitle}</div>}
+          </div>
+        ))}
+      </div>
+
+      <div className="relative h-1 bg-gray-200 mt-2">
+        <div
+          className="absolute top-0 left-0 h-full bg-blue-600 transition-all duration-300"
+          style={{ width: `${((currentStep - 1) / (steps.length - 1)) * 100}%` }}
+        />
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/components/ui-templates/tables.tsx b/Cunkebao/app/components/ui-templates/tables.tsx
new file mode 100644
index 00000000..f041a839
--- /dev/null
+++ b/Cunkebao/app/components/ui-templates/tables.tsx
@@ -0,0 +1,198 @@
+"use client"
+
+/**
+ * 表格组件模板
+ *
+ * 包含项目中常用的各种表格组件
+ */
+
+import type React from "react"
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
+import { Checkbox } from "@/components/ui/checkbox"
+import { Badge } from "@/components/ui/badge"
+
+interface Column<T> {
+  header: string
+  accessorKey: keyof T | ((row: T) => React.ReactNode)
+  cell?: (row: T) => React.ReactNode
+}
+
+interface DataTableProps<T> {
+  data: T[]
+  columns: Column<T>[]
+  keyField: keyof T
+  selectable?: boolean
+  selectedRows?: (string | number)[]
+  onSelectRow?: (id: string | number, checked: boolean) => void
+  onSelectAll?: (checked: boolean) => void
+  onRowClick?: (row: T) => void
+  emptyMessage?: string
+}
+
+/**
+ * 通用数据表格
+ * 用于展示表格数据
+ */
+export function DataTable<T extends Record<string, any>>({
+  data,
+  columns,
+  keyField,
+  selectable = false,
+  selectedRows = [],
+  onSelectRow,
+  onSelectAll,
+  onRowClick,
+  emptyMessage = "没有数据",
+}: DataTableProps<T>) {
+  const handleRowClick = (row: T) => {
+    if (onRowClick) {
+      onRowClick(row)
+    }
+  }
+
+  return (
+    <div className="border rounded-md">
+      <Table>
+        <TableHeader>
+          <TableRow>
+            {selectable && onSelectRow && onSelectAll && (
+              <TableHead className="w-12">
+                <Checkbox
+                  checked={data.length > 0 && selectedRows.length === data.length}
+                  onCheckedChange={(checked) => onSelectAll(checked === true)}
+                />
+              </TableHead>
+            )}
+            {columns.map((column, index) => (
+              <TableHead key={index}>{column.header}</TableHead>
+            ))}
+          </TableRow>
+        </TableHeader>
+        <TableBody>
+          {data.length === 0 ? (
+            <TableRow>
+              <TableCell colSpan={columns.length + (selectable ? 1 : 0)} className="text-center py-6 text-gray-500">
+                {emptyMessage}
+              </TableCell>
+            </TableRow>
+          ) : (
+            data.map((row) => (
+              <TableRow
+                key={String(row[keyField])}
+                className={onRowClick ? "cursor-pointer hover:bg-gray-50" : ""}
+                onClick={() => handleRowClick(row)}
+              >
+                {selectable && onSelectRow && (
+                  <TableCell className="w-12" onClick={(e) => e.stopPropagation()}>
+                    <Checkbox
+                      checked={selectedRows.includes(row[keyField])}
+                      onCheckedChange={(checked) => onSelectRow(row[keyField], checked === true)}
+                    />
+                  </TableCell>
+                )}
+                {columns.map((column, index) => (
+                  <TableCell key={index}>
+                    {column.cell
+                      ? column.cell(row)
+                      : typeof column.accessorKey === "function"
+                        ? column.accessorKey(row)
+                        : row[column.accessorKey]}
+                  </TableCell>
+                ))}
+              </TableRow>
+            ))
+          )}
+        </TableBody>
+      </Table>
+    </div>
+  )
+}
+
+interface DeviceTableProps {
+  devices: Array<{
+    id: string
+    name: string
+    imei: string
+    status: "online" | "offline"
+    battery?: number
+    wechatId?: string
+    lastActive?: string
+  }>
+  selectedDevices: string[]
+  onSelectDevice: (deviceId: string, checked: boolean) => void
+  onSelectAll: (checked: boolean) => void
+  onDeviceClick: (deviceId: string) => void
+}
+
+/**
+ * 设备表格
+ * 用于展示设备列表
+ */
+export function DeviceTableTemplate({
+  devices,
+  selectedDevices,
+  onSelectDevice,
+  onSelectAll,
+  onDeviceClick,
+}: DeviceTableProps) {
+  const columns: Column<(typeof devices)[0]>[] = [
+    {
+      header: "设备名称",
+      accessorKey: "name",
+      cell: (row) => (
+        <div>
+          <div className="font-medium">{row.name}</div>
+          <div className="text-xs text-gray-500">IMEI: {row.imei}</div>
+        </div>
+      ),
+    },
+    {
+      header: "状态",
+      accessorKey: "status",
+      cell: (row) => (
+        <Badge variant={row.status === "online" ? "success" : "secondary"}>
+          {row.status === "online" ? "在线" : "离线"}
+        </Badge>
+      ),
+    },
+    {
+      header: "微信号",
+      accessorKey: "wechatId",
+      cell: (row) => row.wechatId || "-",
+    },
+    {
+      header: "电量",
+      accessorKey: "battery",
+      cell: (row) => (
+        <div className="flex items-center">
+          <div className="w-16 h-2 bg-gray-200 rounded-full overflow-hidden mr-2">
+            <div
+              className={`h-full ${(row.battery || 0) > 20 ? "bg-green-500" : "bg-red-500"}`}
+              style={{ width: `${row.battery || 0}%` }}
+            ></div>
+          </div>
+          <span>{row.battery || 0}%</span>
+        </div>
+      ),
+    },
+    {
+      header: "最后活跃",
+      accessorKey: "lastActive",
+      cell: (row) => row.lastActive || "-",
+    },
+  ]
+
+  return (
+    <DataTable
+      data={devices}
+      columns={columns}
+      keyField="id"
+      selectable={true}
+      selectedRows={selectedDevices}
+      onSelectRow={onSelectDevice}
+      onSelectAll={onSelectAll}
+      onRowClick={(row) => onDeviceClick(row.id)}
+      emptyMessage="没有找到设备"
+    />
+  )
+}
diff --git a/Cunkebao/app/plans/new/loading.tsx b/Cunkebao/app/plans/new/loading.tsx
index cec067bd..f15322a8 100644
--- a/Cunkebao/app/plans/new/loading.tsx
+++ b/Cunkebao/app/plans/new/loading.tsx
@@ -1,4 +1,3 @@
 export default function Loading() {
   return null
 }
-
diff --git a/Cunkebao/app/plans/new/page.tsx b/Cunkebao/app/plans/new/page.tsx
index 04ff09d1..b8d6b371 100644
--- a/Cunkebao/app/plans/new/page.tsx
+++ b/Cunkebao/app/plans/new/page.tsx
@@ -1,344 +1,117 @@
 "use client"
-import { useState, useEffect } from "react"
-import { ChevronLeft } from "lucide-react"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Settings } from "lucide-react"
 import { Button } from "@/components/ui/button"
-import { cn } from "@/lib/utils"
+import { toast } from "@/components/ui/use-toast"
+import { StepIndicator } from "@/app/components/ui-templates/step-indicator"
 import { BasicSettings } from "./steps/BasicSettings"
 import { FriendRequestSettings } from "./steps/FriendRequestSettings"
 import { MessageSettings } from "./steps/MessageSettings"
-import { TagSettings } from "./steps/TagSettings"
-import { useRouter, useSearchParams } from "next/navigation"
-import { toast } from "@/components/ui/use-toast"
 
+// 步骤定义 - 只保留三个步骤
 const steps = [
   { id: 1, title: "步骤一", subtitle: "基础设置" },
-  { id: 2, title: "步骤二", subtitle: "好友申请" },
+  { id: 2, title: "步骤二", subtitle: "好友申请设置" },
   { id: 3, title: "步骤三", subtitle: "消息设置" },
-  { id: 4, title: "步骤四", subtitle: "流量标签" },
 ]
 
-// 场景分类规则
-const scenarioRules = {
-  LIVE: ["直播", "直播间", "主播", "抖音"],
-  COMMENT: ["评论", "互动", "回复", "小红书"],
-  GROUP: ["群", "社群", "群聊", "微信群"],
-  ARTICLE: ["文章", "笔记", "内容", "公众号"],
-}
-
-// 根据计划名称和标签自动判断场景
-const determineScenario = (planName: string, tags: any[]) => {
-  // 优先使用标签进行分类
-  if (tags && tags.length > 0) {
-    const firstTag = tags[0]
-    if (firstTag.name?.includes("直播") || firstTag.name?.includes("抖音")) return "douyin"
-    if (firstTag.name?.includes("评论") || firstTag.name?.includes("小红书")) return "xiaohongshu"
-    if (firstTag.name?.includes("群") || firstTag.name?.includes("微信")) return "weixinqun"
-    if (firstTag.name?.includes("文章") || firstTag.name?.includes("公众号")) return "gongzhonghao"
-  }
-
-  // 如果没有标签，使用计划名称进行分类
-  const planNameLower = planName.toLowerCase()
-  if (planNameLower.includes("直播") || planNameLower.includes("抖音")) return "douyin"
-  if (planNameLower.includes("评论") || planNameLower.includes("小红书")) return "xiaohongshu"
-  if (planNameLower.includes("群") || planNameLower.includes("微信")) return "weixinqun"
-  if (planNameLower.includes("文章") || planNameLower.includes("公众号")) return "gongzhonghao"
-  return "other"
-}
-
-export default function NewAcquisitionPlan() {
+export default function NewPlan() {
   const router = useRouter()
-  const searchParams = useSearchParams()
-  const type = searchParams.get("type")
-  const source = searchParams.get("source")
-
   const [currentStep, setCurrentStep] = useState(1)
   const [formData, setFormData] = useState({
     planName: "",
-    scenario: type === "order" ? "order" : "",
-    accounts: [],
-    materials: [],
-    enabled: true,
+    scenario: "haibao",
+    posters: [],
+    device: "",
     remarkType: "phone",
-    remarkKeyword: "",
-    greeting: "",
-    addFriendTimeStart: "09:00",
-    addFriendTimeEnd: "18:00",
-    addFriendInterval: 1,
-    maxDailyFriends: 20,
-    messageInterval: 1,
-    messageContent: "",
-    tags: [],
-    selectedDevices: [],
-    messagePlans: [],
-    importedTags: [],
-    sourceWechatId: source || "",
-    teams: [], // 添加 teams 字段
+    greeting: "你好，请通过",
+    addInterval: 1,
+    startTime: "09:00",
+    endTime: "18:00",
+    enabled: true,
+    // 移除tags字段
   })
 
-  // 如果是从微信号好友转移过来，自动设置计划名称
-  useEffect(() => {
-    if (type === "order" && source) {
-      const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
-      setFormData((prev) => ({
-        ...prev,
-        planName: `${source}好友转移${today}`,
-        scenario: "order",
-      }))
+  // 更新表单数据
+  const onChange = (data: any) => {
+    setFormData((prev) => ({ ...prev, ...data }))
+  }
 
-      // 模拟加载好友数据
-      setTimeout(() => {
-        toast({
-          title: "好友数据加载成功",
-          description: `已从微信号 ${source} 导入好友数据`,
-        })
-      }, 1000)
-    }
-  }, [type, source])
+  // 处理保存
+  const handleSave = async () => {
+    try {
+      // 这里应该是实际的API调用
+      await new Promise((resolve) => setTimeout(resolve, 1000))
 
-  // 根据URL参数设置场景类型
-  useEffect(() => {
-    if (type && type !== "order" && !formData.scenario) {
-      const validScenarios = [
-        "douyin",
-        "kuaishou",
-        "xiaohongshu",
-        "weibo",
-        "haibao",
-        "phone",
-        "weixinqun",
-        "gongzhonghao",
-      ]
-      if (validScenarios.includes(type)) {
-        const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
-        setFormData((prev) => ({
-          ...prev,
-          scenario: type,
-          planName: `${type === "phone" ? "电话获客" : type}${today}`,
-        }))
-      }
-    }
-  }, [type, formData.scenario])
-
-  const handleSave = () => {
-    // 根据标签和计划名称自动判断场景
-    const scenario = formData.scenario || determineScenario(formData.planName, formData.tags)
-
-    // 准备请求数据
-    const requestData = {
-      sceneId: getSceneIdFromScenario(scenario), // 获取场景ID
-      name: formData.planName,
-      status: formData.enabled ? 1 : 0,
-      reqConf: JSON.stringify({
-        remarkType: formData.remarkType,
-        remarkKeyword: formData.remarkKeyword,
-        greeting: formData.greeting,
-        addFriendTimeStart: formData.addFriendTimeStart,
-        addFriendTimeEnd: formData.addFriendTimeEnd,
-        addFriendInterval: formData.addFriendInterval,
-        maxDailyFriends: formData.maxDailyFriends,
-        selectedDevices: formData.selectedDevices,
-      }),
-      msgConf: JSON.stringify({
-        messageInterval: formData.messageInterval,
-        messagePlans: formData.messagePlans,
-      }),
-      tagConf: JSON.stringify({
-        tags: formData.tags,
-        importedTags: formData.importedTags,
+      toast({
+        title: "创建成功",
+        description: "获客计划已创建",
       })
-    }
-
-    // 调用API创建获客计划
-    fetch(`${process.env.NEXT_PUBLIC_API_BASE_URL}/v1/plan/create`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'Authorization': `Bearer ${localStorage.getItem('token')}`
-      },
-      body: JSON.stringify(requestData)
-    })
-    .then(response => response.json())
-    .then(data => {
-      if (data.code === 200) {
-        toast({
-          title: "创建成功",
-          description: "获客计划已创建完成",
-        })
-        // 跳转到首页
-        router.push("/")
-      } else {
-        toast({
-          title: "创建失败",
-          description: data.msg || "服务器错误，请稍后重试",
-          variant: "destructive"
-        })
-      }
-    })
-    .catch(error => {
-      console.error("创建获客计划失败:", error);
+      router.push("/plans")
+    } catch (error) {
       toast({
         title: "创建失败",
-        description: "网络错误，请稍后重试",
-        variant: "destructive"
+        description: "创建计划失败，请重试",
+        variant: "destructive",
       })
-    })
-  }
-
-  // 将场景类型转换为场景ID
-  const getSceneIdFromScenario = (scenario: string): number => {
-    const scenarioMap: Record<string, number> = {
-      'douyin': 1,
-      'xiaohongshu': 2,
-      'weixinqun': 3,
-      'gongzhonghao': 4,
-      'kuaishou': 5,
-      'weibo': 6,
-      'haibao': 7,
-      'phone': 8,
-      'order': 9,
-      'other': 10
     }
-    return scenarioMap[scenario] || 1 // 默认返回1
-  }
-
-  const handlePrev = () => {
-    setCurrentStep((prevStep) => Math.max(prevStep - 1, 1))
   }
 
+  // 下一步
   const handleNext = () => {
-    if (isStepValid()) {
-      if (currentStep === steps.length) {
-        handleSave()
-      } else {
-        setCurrentStep((prevStep) => Math.min(prevStep + 1, steps.length))
-      }
+    if (currentStep === steps.length) {
+      handleSave()
+    } else {
+      setCurrentStep((prev) => prev + 1)
     }
   }
 
-  const isStepValid = () => {
-    switch (currentStep) {
-      case 1:
-        if (!formData.planName.trim()) {
-          toast({
-            title: "请完善信息",
-            description: "请填写计划名称",
-            variant: "destructive",
-          })
-          return false
-        }
-        return true
-      case 2:
-        // 如果是订单导入场景，跳过好友申请设置验证
-        if (formData.scenario === "order") {
-          return true
-        }
-        // 修改：不再要求必须选择设备
-        if (!formData.greeting?.trim()) {
-          toast({
-            title: "请完善信息",
-            description: "请填写好友申请信息",
-            variant: "destructive",
-          })
-          return false
-        }
-        return true
-      case 3:
-        // 如果是订单导入场景，跳过消息设置验证
-        if (formData.scenario === "order") {
-          return true
-        }
-        if (formData.messagePlans?.length === 0) {
-          toast({
-            title: "请完善信息",
-            description: "请设置至少一条消息",
-            variant: "destructive",
-          })
-          return false
-        }
-        return true
-      case 4:
-        return true
-      default:
-        return true
-    }
+  // 上一步
+  const handlePrev = () => {
+    setCurrentStep((prev) => Math.max(prev - 1, 1))
   }
 
+  // 渲染当前步骤内容
   const renderStepContent = () => {
     switch (currentStep) {
       case 1:
-        return <BasicSettings formData={formData} onChange={setFormData} onNext={handleNext} />
+        return <BasicSettings formData={formData} onChange={onChange} onNext={handleNext} />
       case 2:
-        return (
-          <FriendRequestSettings formData={formData} onChange={setFormData} onNext={handleNext} onPrev={handlePrev} />
-        )
+        return <FriendRequestSettings formData={formData} onChange={onChange} onNext={handleNext} onPrev={handlePrev} />
       case 3:
-        return <MessageSettings formData={formData} onChange={setFormData} onNext={handleNext} onPrev={handlePrev} />
-      case 4:
-        return <TagSettings formData={formData} onNext={handleSave} onPrev={handlePrev} onChange={setFormData} />
+        return <MessageSettings formData={formData} onChange={onChange} onNext={handleSave} onPrev={handlePrev} />
       default:
         return null
     }
   }
 
-  // 如果是订单导入场景，直接跳到标签设置步骤
-  useEffect(() => {
-    // 只有在订单场景下，才自动开启步骤1，而不是直接跳到步骤4
-    if (formData.scenario === "order" && currentStep === 1 && formData.planName) {
-      // 保持在步骤1，不再自动跳转到步骤4
-      // 之前的逻辑是直接跳到步骤4：setCurrentStep(4)
-    }
-  }, [formData.scenario, currentStep, formData.planName])
-
   return (
-    <div className="min-h-screen bg-gradient-to-b from-blue-50 to-white">
-      <div className="w-full bg-white min-h-screen flex flex-col">
+    <div className="min-h-screen bg-gray-50">
+      <div className="max-w-[390px] mx-auto bg-white min-h-screen flex flex-col">
         <header className="sticky top-0 z-10 bg-white border-b">
-          <div className="flex items-center h-14 px-4">
-            <Button variant="ghost" size="icon" onClick={() => router.push("/scenarios")}>
-              <ChevronLeft className="h-5 w-5" />
+          <div className="flex items-center justify-between h-14 px-4">
+            <div className="flex items-center">
+              <Button variant="ghost" size="icon" onClick={() => router.push("/plans")}>
+                <ChevronLeft className="h-5 w-5" />
+              </Button>
+              <h1 className="ml-2 text-lg font-medium">新建获客计划</h1>
+            </div>
+            <Button variant="ghost" size="icon">
+              <Settings className="h-5 w-5" />
             </Button>
-            <h1 className="ml-2 text-lg font-medium">{formData.sourceWechatId ? "好友转移" : "新建获客计划"}</h1>
           </div>
         </header>
 
         <div className="flex-1 flex flex-col">
-          {/* 步骤指示器样式 */}
-          <div className="bg-white border-gray-200">
-            <div className="px-5 py-5">
-              <div className="flex justify-between">
-                {steps.map((step) => (
-                  <div key={step.id} className="flex flex-col items-center">
-                    <div
-                      className={`rounded-full h-8 w-8 flex items-center justify-center ${
-                        currentStep >= step.id ? "bg-blue-600 text-white" : "bg-gray-200 text-gray-600"
-                      }`}
-                    >
-                      {step.id}
-                    </div>
-                    <div className="text-xs font-medium mt-2 text-center">{step.subtitle}</div>
-                  </div>
-                ))}
-              </div>
-              <div className="flex justify-between mt-4 px-4">
-                {steps.slice(0, steps.length - 1).map((step, index) => (
-                  <div
-                    key={`line-${step.id}`}
-                    className={`h-1 w-full ${currentStep > step.id ? "bg-blue-600" : "bg-gray-200"}`}
-                    style={{
-                      width: `${100 / (steps.length - 1)}%`,
-                      marginLeft: index === 0 ? "10px" : "0",
-                      marginRight: index === steps.length - 2 ? "10px" : "0",
-                    }}
-                  ></div>
-                ))}
-              </div>
-            </div>
+          <div className="px-4 py-6">
+            <StepIndicator steps={steps} currentStep={currentStep} />
           </div>
 
-          <div className="flex-1 px-4">{renderStepContent()}</div>
+          <div className="flex-1 px-4 pb-20">{renderStepContent()}</div>
         </div>
       </div>
     </div>
   )
 }
-
diff --git a/Cunkebao/app/plans/new/steps/BasicSettings.tsx b/Cunkebao/app/plans/new/steps/BasicSettings.tsx
index 085135e9..98657d6e 100644
--- a/Cunkebao/app/plans/new/steps/BasicSettings.tsx
+++ b/Cunkebao/app/plans/new/steps/BasicSettings.tsx
@@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button"
 import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
 import { Switch } from "@/components/ui/switch"
-import { QrCode, X, ChevronDown, Plus, Maximize2, Upload, Download, Settings, Loader2 } from "lucide-react"
+import { QrCode, X, ChevronDown, Plus, Maximize2, Upload, Download, Settings, Minus } from "lucide-react"
 import { TooltipProvider } from "@/components/ui/tooltip"
 import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from "@/components/ui/table"
 import {
@@ -19,9 +19,6 @@ import {
   DialogFooter,
   DialogDescription,
 } from "@/components/ui/dialog"
-import { fetchScenes } from "@/api/scenarios"
-import type { SceneItem } from "@/api/scenarios"
-import { toast } from "react-hot-toast"
 
 // 调整场景顺序，确保API获客在最后，并且前三个是最常用的场景
 const scenarios = [
@@ -36,6 +33,86 @@ const scenarios = [
   { id: "api", name: "API获客", type: "api" }, // API获客放在最后
 ]
 
+const phoneCallTags = [
+  { id: "tag-1", name: "咨询", color: "bg-blue-100 text-blue-800" },
+  { id: "tag-2", name: "投诉", color: "bg-red-100 text-red-800" },
+  { id: "tag-3", name: "合作", color: "bg-green-100 text-green-800" },
+  { id: "tag-4", name: "价格", color: "bg-orange-100 text-orange-800" },
+  { id: "tag-5", name: "售后", color: "bg-purple-100 text-purple-800" },
+  { id: "tag-6", name: "订单", color: "bg-yellow-100 text-yellow-800" },
+  { id: "tag-7", name: "物流", color: "bg-teal-100 text-teal-800" },
+]
+
+// 不同场景的预设标签
+const scenarioTags = {
+  haibao: [
+    { id: "poster-tag-1", name: "活动推广", color: "bg-blue-100 text-blue-800" },
+    { id: "poster-tag-2", name: "产品宣传", color: "bg-green-100 text-green-800" },
+    { id: "poster-tag-3", name: "品牌展示", color: "bg-purple-100 text-purple-800" },
+    { id: "poster-tag-4", name: "优惠促销", color: "bg-red-100 text-red-800" },
+    { id: "poster-tag-5", name: "新品发布", color: "bg-orange-100 text-orange-800" },
+  ],
+  order: [
+    { id: "order-tag-1", name: "新订单", color: "bg-green-100 text-green-800" },
+    { id: "order-tag-2", name: "复购客户", color: "bg-blue-100 text-blue-800" },
+    { id: "order-tag-3", name: "高价值订单", color: "bg-purple-100 text-purple-800" },
+    { id: "order-tag-4", name: "待付款", color: "bg-yellow-100 text-yellow-800" },
+    { id: "order-tag-5", name: "已完成", color: "bg-gray-100 text-gray-800" },
+  ],
+  douyin: [
+    { id: "douyin-tag-1", name: "短视频", color: "bg-pink-100 text-pink-800" },
+    { id: "douyin-tag-2", name: "直播", color: "bg-red-100 text-red-800" },
+    { id: "douyin-tag-3", name: "带货", color: "bg-orange-100 text-orange-800" },
+    { id: "douyin-tag-4", name: "粉丝互动", color: "bg-blue-100 text-blue-800" },
+    { id: "douyin-tag-5", name: "热门话题", color: "bg-purple-100 text-purple-800" },
+  ],
+  xiaohongshu: [
+    { id: "xhs-tag-1", name: "种草笔记", color: "bg-red-100 text-red-800" },
+    { id: "xhs-tag-2", name: "美妆", color: "bg-pink-100 text-pink-800" },
+    { id: "xhs-tag-3", name: "穿搭", color: "bg-purple-100 text-purple-800" },
+    { id: "xhs-tag-4", name: "生活方式", color: "bg-green-100 text-green-800" },
+    { id: "xhs-tag-5", name: "好物推荐", color: "bg-orange-100 text-orange-800" },
+  ],
+  phone: phoneCallTags,
+  gongzhonghao: [
+    { id: "gzh-tag-1", name: "文章推送", color: "bg-blue-100 text-blue-800" },
+    { id: "gzh-tag-2", name: "活动通知", color: "bg-green-100 text-green-800" },
+    { id: "gzh-tag-3", name: "产品介绍", color: "bg-purple-100 text-purple-800" },
+    { id: "gzh-tag-4", name: "用户服务", color: "bg-orange-100 text-orange-800" },
+    { id: "gzh-tag-5", name: "品牌故事", color: "bg-gray-100 text-gray-800" },
+  ],
+  weixinqun: [
+    { id: "wxq-tag-1", name: "群活动", color: "bg-green-100 text-green-800" },
+    { id: "wxq-tag-2", name: "产品分享", color: "bg-blue-100 text-blue-800" },
+    { id: "wxq-tag-3", name: "用户交流", color: "bg-purple-100 text-purple-800" },
+    { id: "wxq-tag-4", name: "优惠信息", color: "bg-pink-100 text-pink-800" },
+    { id: "wxq-tag-5", name: "答疑解惑", color: "bg-orange-100 text-orange-800" },
+    { id: "wxq-tag-6", name: "新人欢迎", color: "bg-yellow-100 text-yellow-800" },
+    { id: "wxq-tag-7", name: "群规通知", color: "bg-gray-100 text-gray-800" },
+    { id: "wxq-tag-8", name: "活跃互动", color: "bg-indigo-100 text-indigo-800" },
+  ],
+  payment: [
+    { id: "pay-tag-1", name: "扫码支付", color: "bg-green-100 text-green-800" },
+    { id: "pay-tag-2", name: "线下门店", color: "bg-blue-100 text-blue-800" },
+    { id: "pay-tag-3", name: "活动收款", color: "bg-purple-100 text-purple-800" },
+    { id: "pay-tag-4", name: "服务费用", color: "bg-orange-100 text-orange-800" },
+    { id: "pay-tag-5", name: "会员充值", color: "bg-yellow-100 text-yellow-800" },
+  ],
+  api: [
+    { id: "api-tag-1", name: "系统对接", color: "bg-blue-100 text-blue-800" },
+    { id: "api-tag-2", name: "数据同步", color: "bg-green-100 text-green-800" },
+    { id: "api-tag-3", name: "自动化", color: "bg-purple-100 text-purple-800" },
+    { id: "api-tag-4", name: "第三方平台", color: "bg-orange-100 text-orange-800" },
+    { id: "api-tag-5", name: "实时推送", color: "bg-gray-100 text-gray-800" },
+  ],
+}
+
+interface BasicSettingsProps {
+  formData: any
+  onChange: (data: any) => void
+  onNext?: () => void
+}
+
 interface Account {
   id: string
   nickname: string
@@ -45,16 +122,10 @@ interface Account {
 interface Material {
   id: string
   name: string
-  type: "poster" | "payment"
+  type: string
   preview: string
 }
 
-interface BasicSettingsProps {
-  formData: any
-  onChange: (data: any) => void
-  onNext?: () => void
-}
-
 const posterTemplates = [
   {
     id: "poster-1",
@@ -111,11 +182,6 @@ const generatePosterMaterials = (): Material[] => {
   }))
 }
 
-// 格式化场景名称，移除"获客"二字
-function formatSceneName(name: string): string {
-  return name.replace(/获客/g, "");
-}
-
 export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps) {
   const [isAccountDialogOpen, setIsAccountDialogOpen] = useState(false)
   const [isMaterialDialogOpen, setIsMaterialDialogOpen] = useState(false)
@@ -131,12 +197,6 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
   const [selectedMaterials, setSelectedMaterials] = useState<Material[]>(
     formData.materials?.length > 0 ? formData.materials : [],
   )
-  
-  // 添加场景列表状态
-  const [scenes, setScenes] = useState<SceneItem[]>([])
-  const [loadingScenes, setLoadingScenes] = useState(true)
-  const [sceneError, setSceneError] = useState<string | null>(null)
-  
   const [showAllScenarios, setShowAllScenarios] = useState(false)
   const [isImportDialogOpen, setIsImportDialogOpen] = useState(false)
   const [importedTags, setImportedTags] = useState<
@@ -149,6 +209,12 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
     }>
   >(formData.importedTags || [])
 
+  const [selectedScenarioTags, setSelectedScenarioTags] = useState<string[]>(formData.scenarioTags || [])
+  const [customTagInput, setCustomTagInput] = useState("")
+  const [customTags, setCustomTags] = useState<Array<{ id: string; name: string; color: string }>>(
+    formData.customTags || [],
+  )
+
   // 初始化电话获客设置
   const [phoneSettings, setPhoneSettings] = useState({
     autoAdd: formData.phoneSettings?.autoAdd ?? true,
@@ -156,87 +222,98 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
     questionExtraction: formData.phoneSettings?.questionExtraction ?? true,
   })
 
-  const [isImporting, setIsImporting] = useState(false)
-  const [importError, setImportError] = useState<string | null>(null)
+  const [selectedPhoneTags, setSelectedPhoneTags] = useState<string[]>(formData.phoneTags || [])
+  const [phoneCallType, setPhoneCallType] = useState(formData.phoneCallType || "both")
 
-  // 加载场景列表
+  // 处理标签选择
+  const handleTagToggle = (tagId: string) => {
+    const newTags = selectedPhoneTags.includes(tagId)
+      ? selectedPhoneTags.filter((id) => id !== tagId)
+      : [...selectedPhoneTags, tagId]
+
+    setSelectedPhoneTags(newTags)
+    onChange({ ...formData, phoneTags: newTags })
+  }
+
+  // 处理通话类型选择
+  const handleCallTypeChange = (type: string) => {
+    setPhoneCallType(type)
+    onChange({ ...formData, phoneCallType: type })
+  }
+
+  // 初始化时，如果没有选择场景，默认选择海报获客
   useEffect(() => {
-    const loadScenes = async () => {
-      try {
-        setLoadingScenes(true)
-        setSceneError(null)
-        
-        const response = await fetchScenes({ limit: 30 })
-        
-        if (response.code === 200 && Array.isArray(response.data)) {
-          const formattedScenes = response.data.map((scene: SceneItem) => ({
-            id: scene.id,
-            name: scene.name,
-            image: scene.image,
-            status: scene.status,
-            createTime: scene.createTime,
-            updateTime: scene.updateTime,
-            deleteTime: scene.deleteTime
-          }))
-          setScenes(formattedScenes)
-          setSceneError(null) // 成功时清空错误
-        } else {
-          setSceneError(response.msg || "获取场景列表失败")
-          console.error("获取场景列表失败:", response.msg)
-        }
-      } catch (err) {
-        console.error("获取场景列表失败:", err)
-        setSceneError("获取场景列表失败，请稍后重试")
-      } finally {
-        setLoadingScenes(false)
+    if (!formData.scenario) {
+      onChange({ ...formData, scenario: "haibao" })
+    }
+
+    if (!formData.planName) {
+      if (formData.materials?.length > 0) {
+        const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
+        onChange({ ...formData, planName: `海报${today}` })
+      } else {
+        onChange({ ...formData, planName: "场景" })
       }
     }
-    
-    loadScenes()
-  }, [])
+  }, [formData, onChange])
 
-  // 处理本地场景选择
   const handleScenarioSelect = (scenarioId: string) => {
-    onChange({ ...formData, scenario: scenarioId })
-    
-    // 如果选择了电话获客，自动更新计划名称
+    // 如果选择了电话获客，更新计划名称
     if (scenarioId === "phone") {
       const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
-      onChange({ ...formData, planName: `电话${today}` })
+      onChange({ ...formData, scenario: scenarioId, planName: `电话获客${today}` })
+    } else {
+      onChange({ ...formData, scenario: scenarioId })
     }
   }
 
-  // 处理从API获取的场景选择
-  const handleSceneSelect = (scene: SceneItem) => {
-    // 更新formData中的场景相关数据
-    const formattedName = formatSceneName(scene.name);
-    
-    onChange({
-      ...formData,
-      sceneId: scene.id,
-      sceneName: scene.name,
-      scenario: getLocalScenarioType(scene.name), // 基于名称推断本地场景类型
-    });
-    
-    // 如果是电话场景，自动设置计划名称
-    if (scene.name.includes("电话")) {
-      const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "");
-      onChange({ ...formData, planName: `${formattedName}${today}` });
-    }
+  // 处理场景标签选择
+  const handleScenarioTagToggle = (tagId: string) => {
+    const newTags = selectedScenarioTags.includes(tagId)
+      ? selectedScenarioTags.filter((id) => id !== tagId)
+      : [...selectedScenarioTags, tagId]
+
+    setSelectedScenarioTags(newTags)
+    onChange({ ...formData, scenarioTags: newTags })
   }
 
-  // 根据场景名称推断本地场景类型
-  const getLocalScenarioType = (name: string): string => {
-    if (name.includes("海报")) return "haibao";
-    if (name.includes("订单")) return "order";
-    if (name.includes("抖音")) return "douyin";
-    if (name.includes("小红书")) return "xiaohongshu";
-    if (name.includes("电话")) return "phone";
-    if (name.includes("公众号")) return "gongzhonghao";
-    if (name.includes("微信群")) return "weixinqun";
-    if (name.includes("付款码")) return "payment";
-    if (name.includes("API")) return "api";
-    return "haibao"; // 默认返回海报获客类型
+  // 添加自定义标签
+  const handleAddCustomTag = () => {
+    if (!customTagInput.trim()) return
+
+    const colors = [
+      "bg-blue-100 text-blue-800",
+      "bg-green-100 text-green-800",
+      "bg-purple-100 text-purple-800",
+      "bg-red-100 text-red-800",
+      "bg-orange-100 text-orange-800",
+      "bg-yellow-100 text-yellow-800",
+      "bg-gray-100 text-gray-800",
+      "bg-pink-100 text-pink-800",
+    ]
+
+    const newTag = {
+      id: `custom-${Date.now()}`,
+      name: customTagInput.trim(),
+      color: colors[Math.floor(Math.random() * colors.length)],
+    }
+
+    const updatedCustomTags = [...customTags, newTag]
+    setCustomTags(updatedCustomTags)
+    setCustomTagInput("")
+    onChange({ ...formData, customTags: updatedCustomTags })
+  }
+
+  // 删除自定义标签
+  const handleRemoveCustomTag = (tagId: string) => {
+    const updatedCustomTags = customTags.filter((tag) => tag.id !== tagId)
+    setCustomTags(updatedCustomTags)
+    onChange({ ...formData, customTags: updatedCustomTags })
+
+    // 同时从选中标签中移除
+    const updatedSelectedTags = selectedScenarioTags.filter((id) => id !== tagId)
+    setSelectedScenarioTags(updatedSelectedTags)
+    onChange({ ...formData, scenarioTags: updatedSelectedTags, customTags: updatedCustomTags })
   }
 
   const handleAccountSelect = (account: Account) => {
@@ -250,6 +327,10 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
     setSelectedMaterials(updatedMaterials)
     onChange({ ...formData, materials: updatedMaterials })
     setIsMaterialDialogOpen(false)
+
+    // 更新计划名称
+    const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
+    onChange({ ...formData, planName: `海报${today}`, materials: updatedMaterials })
   }
 
   const handleRemoveAccount = (accountId: string) => {
@@ -284,9 +365,9 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
             const [phone, wechat, source, orderAmount, orderDate] = row.split(",")
             return {
               phone: phone.trim(),
-              wechat: wechat?.trim(),
+              wechat: wechat.trim(),
               source: source?.trim(),
-              orderAmount: orderAmount ? Number(orderAmount) : 0,
+              orderAmount: orderAmount ? Number(orderAmount) : undefined,
               orderDate: orderDate?.trim(),
             }
           })
@@ -301,13 +382,16 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
   }
 
   const handleDownloadTemplate = () => {
-    // 直接从 public 目录下载文件
-    const link = document.createElement("a")
-    link.href = "/订单导入模板.csv"
-    link.download = "订单导入模板.csv"
-    document.body.appendChild(link)
-    link.click()
-    document.body.removeChild(link)
+    const template = "电话号码,微信号,来源,订单金额,下单日期\n13800138000,wxid_123,抖音,99.00,2024-03-03"
+    const blob = new Blob([template], { type: "text/csv" })
+    const url = window.URL.createObjectURL(blob)
+    const a = document.createElement("a")
+    a.href = url
+    a.download = "订单导入模板.csv"
+    document.body.appendChild(a)
+    a.click()
+    document.body.removeChild(a)
+    window.URL.revokeObjectURL(url)
   }
 
   // 处理电话获客设置更新
@@ -316,85 +400,14 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
     setIsPhoneSettingsOpen(false)
   }
 
-  const handleConfirmImport = async () => {
-    if (importedTags.length === 0) {
-      setImportError('请先导入数据');
-      return;
-    }
-
-    setIsImporting(true);
-    setImportError(null);
-
-    try {
-      const response = await fetch(`${process.env.NEXT_PUBLIC_API_BASE_URL}/v1/traffic/pool/import`, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-          'Authorization': `Bearer ${localStorage.getItem('token')}`, // 添加认证token
-        },
-        body: JSON.stringify({
-          mobile: importedTags.map(tag => tag.phone),
-          from: importedTags.map(tag => tag.source),
-          sceneId: formData.sceneId
-        }),
-      });
-
-      const result = await response.json();
-
-      if (result.code === 200) {
-        toast.success(`成功导入 ${result.data.success} 条数据`);
-        setIsImportDialogOpen(false);
-      } else {
-        setImportError(result.msg || '导入失败');
-      }
-    } catch (error) {
-      setImportError('导入失败，请稍后重试');
-      console.error('导入失败:', error);
-    } finally {
-      setIsImporting(false);
-    }
-  };
-
-  // 下一步校验逻辑
-  const handleNextStep = () => {
-    if (!formData.scenario) {
-      toast.error("请选择获客场景")
-      return
-    }
-    if (!formData.planName || !formData.planName.trim()) {
-      toast.error("请输入计划名称")
-      return
-    }
-    if (formData.scenario === "haibao" && (!formData.materials || formData.materials.length === 0)) {
-      toast.error("请选择海报")
-      return
-    }
-    onNext && onNext()
-  }
-
   return (
-    <div className="w-full p-4 bg-gray-50">
-      {/* 错误提示，只在 sceneError 存在且不为 'success' 时显示 */}
-      {sceneError && sceneError !== "success" && (
-        <div className="bg-red-100 border border-red-300 text-red-700 p-4 rounded mb-4">
-          <div>{sceneError}</div>
-          <Button onClick={() => window.location.reload()}>重试</Button>
-        </div>
-      )}
-      <div className="space-y-6">
-        <div>
-          <Label className="text-base mb-4 block">获客场景</Label>
-          
-          {/* 场景按钮阵列 */}
-          <div className="grid grid-cols-3 gap-2">
-            {loadingScenes ? (
-              // 加载中状态
-              Array.from({ length: 6 }).map((_, index) => (
-                <div key={index} className="h-10 w-full rounded-lg bg-gray-200 animate-pulse"></div>
-              ))
-            ) : sceneError || scenes.length === 0 ? (
-              // 加载失败或无数据时显示本地场景
-              displayedScenarios.map((scenario) => (
+    <TooltipProvider>
+      <Card className="p-6">
+        <div className="space-y-6">
+          <div>
+            <Label className="text-base mb-4 block">获客场景</Label>
+            <div className="grid grid-cols-3 gap-2">
+              {displayedScenarios.map((scenario) => (
                 <button
                   key={scenario.id}
                   className={`p-2 rounded-lg text-center transition-all ${
@@ -404,287 +417,665 @@ export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps
                   }`}
                   onClick={() => handleScenarioSelect(scenario.id)}
                 >
-                  {formatSceneName(scenario.name)}
+                  {scenario.name.replace("获客", "")}
                 </button>
-              ))
-            ) : (
-              // 从API获取的场景列表
-              scenes.map((scene) => (
-                <button
-                  key={scene.id}
-                  className={`p-2 rounded-lg text-center transition-all ${
-                    formData.sceneId === scene.id
-                      ? "bg-blue-100 text-blue-600 font-medium"
-                      : "bg-gray-50 text-gray-600 hover:bg-gray-100"
-                  }`}
-                  onClick={() => handleSceneSelect(scene)}
-                >
-                  {formatSceneName(scene.name)}
-                </button>
-              ))
+              ))}
+            </div>
+            {!showAllScenarios && (
+              <Button variant="ghost" className="mt-2 w-full text-blue-600" onClick={() => setShowAllScenarios(true)}>
+                展开更多选项 <ChevronDown className="ml-2 h-4 w-4" />
+              </Button>
             )}
           </div>
-          
-          {/* 展开更多按钮 - 仅当显示本地场景且未展开全部时显示 */}
-          {(!loadingScenes && (sceneError || scenes.length === 0) && !showAllScenarios) && (
-            <Button variant="ghost" className="mt-2 w-full text-blue-600" onClick={() => setShowAllScenarios(true)}>
-              展开更多选项 <ChevronDown className="ml-2 h-4 w-4" />
-            </Button>
-          )}
-        </div>
 
-        <div>
-          <Label htmlFor="planName">计划名称</Label>
-          <Input
-            id="planName"
-            value={formData.planName}
-            onChange={(e) => onChange({ ...formData, planName: e.target.value })}
-            placeholder="请输入计划名称"
-            className="mt-2"
-          />
-        </div>
+          <div>
+            <Label htmlFor="planName">计划名称</Label>
+            <Input
+              id="planName"
+              value={formData.planName}
+              onChange={(e) => onChange({ ...formData, planName: e.target.value })}
+              placeholder="请输入计划名称"
+              className="mt-2"
+            />
+          </div>
 
-        {formData.scenario && (
-          <>
-            {scenarios.find((s) => s.id === formData.scenario)?.type === "social" && (
-              <div>
-                <Label>绑定账号</Label>
-                <div className="flex gap-2 mt-2">
-                  <Button
-                    variant="outline"
-                    className="flex-1 justify-start"
-                    onClick={() => setIsAccountDialogOpen(true)}
+          {/* 场景标签选择 */}
+          {formData.scenario && (
+            <div className="mt-6">
+              <Label className="text-base mb-3 block">
+                {scenarios.find((s) => s.id === formData.scenario)?.name}标签（可多选）
+              </Label>
+
+              {/* 预设标签 */}
+              <div className="flex flex-wrap gap-2 mb-4">
+                {(scenarioTags[formData.scenario as keyof typeof scenarioTags] || []).map((tag) => (
+                  <div
+                    key={tag.id}
+                    className={`px-3 py-2 rounded-full text-sm cursor-pointer transition-all ${
+                      selectedScenarioTags.includes(tag.id)
+                        ? tag.color + " ring-2 ring-blue-400"
+                        : tag.color + " hover:ring-1 hover:ring-gray-300"
+                    }`}
+                    onClick={() => handleScenarioTagToggle(tag.id)}
                   >
-                    {selectedAccounts.length > 0 ? `已选择 ${selectedAccounts.length} 个账号` : "选择账号"}
-                  </Button>
-                  <Button variant="outline" size="icon" onClick={() => setIsQRCodeOpen(true)}>
-                    <QrCode className="h-4 w-4" />
-                  </Button>
-                </div>
-                {selectedAccounts.length > 0 && (
-                  <div className="mt-2 flex flex-wrap gap-2">
-                    {selectedAccounts.map((account) => (
-                      <div key={account.id} className="flex items-center bg-gray-100 rounded-full px-3 py-1">
-                        <img
-                          src={account.avatar || "/placeholder.svg"}
-                          alt={account.nickname}
-                          className="w-4 h-4 rounded-full mr-2"
-                        />
-                        <span className="text-sm">{account.nickname}</span>
+                    {tag.name}
+                  </div>
+                ))}
+              </div>
+
+              {/* 自定义标签 */}
+              {customTags.length > 0 && (
+                <div className="mb-4">
+                  <Label className="text-sm text-gray-600 mb-2 block">自定义标签</Label>
+                  <div className="flex flex-wrap gap-2">
+                    {customTags.map((tag) => (
+                      <div
+                        key={tag.id}
+                        className={`px-3 py-2 rounded-full text-sm cursor-pointer transition-all relative group ${
+                          selectedScenarioTags.includes(tag.id)
+                            ? tag.color + " ring-2 ring-blue-400"
+                            : tag.color + " hover:ring-1 hover:ring-gray-300"
+                        }`}
+                        onClick={() => handleScenarioTagToggle(tag.id)}
+                      >
+                        {tag.name}
                         <Button
                           variant="ghost"
                           size="sm"
-                          className="ml-2 p-0"
-                          onClick={() => handleRemoveAccount(account.id)}
+                          className="absolute -top-1 -right-1 h-5 w-5 p-0 opacity-0 group-hover:opacity-100 bg-red-500 hover:bg-red-600 text-white rounded-full"
+                          onClick={(e) => {
+                            e.stopPropagation()
+                            handleRemoveCustomTag(tag.id)
+                          }}
                         >
-                          <X className="h-4 w-4" />
+                          <X className="h-3 w-3" />
                         </Button>
                       </div>
                     ))}
                   </div>
-                )}
+                </div>
+              )}
+
+              {/* 添加自定义标签 */}
+              <div className="flex gap-2">
+                <Input
+                  value={customTagInput}
+                  onChange={(e) => setCustomTagInput(e.target.value)}
+                  placeholder="输入自定义标签名称"
+                  className="flex-1"
+                  maxLength={8}
+                  onKeyPress={(e) => {
+                    if (e.key === "Enter") {
+                      handleAddCustomTag()
+                    }
+                  }}
+                />
+                <Button
+                  onClick={handleAddCustomTag}
+                  disabled={!customTagInput.trim()}
+                  variant="outline"
+                  className="px-4"
+                >
+                  <Plus className="h-4 w-4 mr-1" />
+                  添加
+                </Button>
               </div>
-            )}
 
-            {/* 电话获客特殊设置 */}
-            {formData.scenario === "phone" && (
-              <Card className="p-4 border-blue-100 bg-blue-50/50 mt-4">
-                <div className="flex items-center justify-between mb-3">
-                  <Label className="text-base font-medium text-blue-700">电话获客设置</Label>
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    onClick={() => setIsPhoneSettingsOpen(true)}
-                    className="flex items-center gap-1 bg-white border-blue-200 text-blue-700 hover:bg-blue-100"
-                  >
-                    <Settings className="h-3.5 w-3.5" />
-                    修改设置
-                  </Button>
-                </div>
-                <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                  <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
-                    <div className="flex items-center">
-                      <div
-                        className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.autoAdd ? "bg-green-500" : "bg-gray-300"}`}
-                      ></div>
-                      <span>自动添加客户</span>
+              {selectedScenarioTags.length > 0 && (
+                <div className="mt-3 text-sm text-gray-500">已选择 {selectedScenarioTags.length} 个标签</div>
+              )}
+            </div>
+          )}
+
+          {formData.scenario && (
+            <>
+              {scenarios.find((s) => s.id === formData.scenario)?.type === "social" &&
+                formData.scenario !== "phone" && (
+                  <div>
+                    <Label>绑定账号</Label>
+                    <div className="flex gap-2 mt-2">
+                      <Button
+                        variant="outline"
+                        className="flex-1 justify-start"
+                        onClick={() => setIsAccountDialogOpen(true)}
+                      >
+                        {selectedAccounts.length > 0 ? `已选择 ${selectedAccounts.length} 个账号` : "选择账号"}
+                      </Button>
+                      <Button variant="outline" size="icon" onClick={() => setIsQRCodeOpen(true)}>
+                        <QrCode className="h-4 w-4" />
+                      </Button>
                     </div>
-                    <div
-                      className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.autoAdd ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                    {selectedAccounts.length > 0 && (
+                      <div className="mt-2 flex flex-wrap gap-2">
+                        {selectedAccounts.map((account) => (
+                          <div key={account.id} className="flex items-center bg-gray-100 rounded-full px-3 py-1">
+                            <img
+                              src={account.avatar || "/placeholder.svg"}
+                              alt={account.nickname}
+                              className="w-4 h-4 rounded-full mr-2"
+                            />
+                            <span className="text-sm">{account.nickname}</span>
+                            <Button
+                              variant="ghost"
+                              size="sm"
+                              className="ml-2 p-0"
+                              onClick={() => handleRemoveAccount(account.id)}
+                            >
+                              <X className="h-4 w-4" />
+                            </Button>
+                          </div>
+                        ))}
+                      </div>
+                    )}
+                  </div>
+                )}
+
+              {/* 电话获客特殊设置 */}
+              {formData.scenario === "phone" && (
+                <Card className="p-4 border-blue-100 bg-blue-50/50 mt-4">
+                  <div className="flex items-center justify-between mb-3">
+                    <Label className="text-base font-medium text-blue-700">电话获客设置</Label>
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      onClick={() => setIsPhoneSettingsOpen(true)}
+                      className="flex items-center gap-1 bg-white border-blue-200 text-blue-700 hover:bg-blue-100"
                     >
-                      {phoneSettings.autoAdd ? "已开启" : "已关闭"}
+                      <Settings className="h-3.5 w-3.5" />
+                      修改设置
+                    </Button>
+                  </div>
+                  <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
+                    <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                      <div className="flex items-center">
+                        <div
+                          className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.autoAdd ? "bg-green-500" : "bg-gray-300"}`}
+                        ></div>
+                        <span>自动添加客户</span>
+                      </div>
+                      <div
+                        className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.autoAdd ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                      >
+                        {phoneSettings.autoAdd ? "已开启" : "已关闭"}
+                      </div>
+                    </div>
+                    <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                      <div className="flex items-center">
+                        <div
+                          className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.speechToText ? "bg-green-500" : "bg-gray-300"}`}
+                        ></div>
+                        <span>语音转文字</span>
+                      </div>
+                      <div
+                        className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.speechToText ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                      >
+                        {phoneSettings.speechToText ? "已开启" : "已关闭"}
+                      </div>
+                    </div>
+                    <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                      <div className="flex items-center">
+                        <div
+                          className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.questionExtraction ? "bg-green-500" : "bg-gray-300"}`}
+                        ></div>
+                        <span>问题提取</span>
+                      </div>
+                      <div
+                        className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.questionExtraction ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                      >
+                        {phoneSettings.questionExtraction ? "已开启" : "已关闭"}
+                      </div>
                     </div>
                   </div>
-                  <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
-                    <div className="flex items-center">
+                  <p className="text-xs text-blue-600 mt-2">
+                    提示：电话获客功能将自动记录来电信息，并根据设置执行相应操作
+                  </p>
+                </Card>
+              )}
+
+              {formData.scenario === "phone" && (
+                <>
+                  {/* 添加电话通话类型选择 */}
+                  <div className="mt-6">
+                    <Label className="text-base mb-2 block">通话类型</Label>
+                    <div className="grid grid-cols-2 gap-2 mt-2">
                       <div
-                        className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.speechToText ? "bg-green-500" : "bg-gray-300"}`}
-                      ></div>
-                      <span>语音转文字</span>
-                    </div>
-                    <div
-                      className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.speechToText ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
-                    >
-                      {phoneSettings.speechToText ? "已开启" : "已关闭"}
+                        className={`p-3 border rounded-lg text-center cursor-pointer ${
+                          phoneCallType === "outbound" || phoneCallType === "both"
+                            ? "bg-blue-50 border-blue-300"
+                            : "bg-white hover:bg-gray-50"
+                        }`}
+                        onClick={() => handleCallTypeChange(phoneCallType === "inbound" ? "both" : "outbound")}
+                      >
+                        <div className="font-medium">发起外呼</div>
+                        <div className="text-sm text-gray-500">主动向客户发起电话</div>
+                      </div>
+                      <div
+                        className={`p-3 border rounded-lg text-center cursor-pointer ${
+                          phoneCallType === "inbound" || phoneCallType === "both"
+                            ? "bg-blue-50 border-blue-300"
+                            : "bg-white hover:bg-gray-50"
+                        }`}
+                        onClick={() => handleCallTypeChange(phoneCallType === "outbound" ? "both" : "inbound")}
+                      >
+                        <div className="font-medium">接收来电</div>
+                        <div className="text-sm text-gray-500">接听客户的来电</div>
+                      </div>
                     </div>
                   </div>
-                  <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
-                    <div className="flex items-center">
-                      <div
-                        className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.questionExtraction ? "bg-green-500" : "bg-gray-300"}`}
-                      ></div>
-                      <span>问题提取</span>
-                    </div>
-                    <div
-                      className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.questionExtraction ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
-                    >
-                      {phoneSettings.questionExtraction ? "已开启" : "已关闭"}
+
+                  {/* 添加标签功能 */}
+                  <div className="mt-6">
+                    <Label className="text-base mb-2 block">通话标签（可多选）</Label>
+                    <div className="flex flex-wrap gap-2 mt-2">
+                      {phoneCallTags.map((tag) => (
+                        <div
+                          key={tag.id}
+                          className={`px-3 py-1.5 rounded-full text-sm cursor-pointer ${
+                            selectedPhoneTags.includes(tag.id)
+                              ? tag.color
+                              : "bg-gray-100 text-gray-800 hover:bg-gray-200"
+                          }`}
+                          onClick={() => handleTagToggle(tag.id)}
+                        >
+                          {tag.name}
+                        </div>
+                      ))}
                     </div>
                   </div>
-                </div>
-                <p className="text-xs text-blue-600 mt-2">
-                  提示：电话获客功能将自动记录来电信息，并根据设置执行相应操作
-                </p>
-              </Card>
-            )}
+                </>
+              )}
 
-            {scenarios.find((s) => s.id === formData.scenario)?.type === "material" && (
-              <div>
-                <div className="flex items-center justify-between mb-4">
-                  <Label>选择海报</Label>
-                  <Button variant="outline" onClick={() => setIsMaterialDialogOpen(true)}>
-                    <Plus className="h-4 w-4" />
-                  </Button>
-                </div>
+              {scenarios.find((s) => s.id === formData.scenario)?.type === "material" && (
+                <div>
+                  <div className="flex items-center justify-between mb-4">
+                    <Label>选择海报</Label>
+                    <Button variant="outline" onClick={() => setIsMaterialDialogOpen(true)}>
+                      <Plus className="h-4 w-4" />
+                    </Button>
+                  </div>
 
-                {/* 海报展示区域 */}
-                <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
-                  {materials.map((material) => (
-                    <div
-                      key={material.id}
-                      className={`relative cursor-pointer rounded-lg overflow-hidden group ${
-                        selectedMaterials.find((m) => m.id === material.id)
-                          ? "ring-2 ring-blue-600"
-                          : "hover:ring-2 hover:ring-blue-600"
-                      }`}
-                      onClick={() => handleMaterialSelect(material)}
-                    >
-                      <img
-                        src={material.preview || "/placeholder.svg"}
-                        alt={material.name}
-                        className="w-full aspect-[9/16] object-cover"
-                      />
-                      <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all">
-                        <Button
-                          variant="ghost"
-                          size="icon"
-                          className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity"
-                          onClick={(e) => {
-                            e.stopPropagation()
-                            handlePreviewImage(material.preview)
+                  {/* 海报展示区域 */}
+                  <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
+                    {materials.map((material) => (
+                      <div
+                        key={material.id}
+                        className={`relative cursor-pointer rounded-lg overflow-hidden group ${
+                          selectedMaterials.find((m) => m.id === material.id)
+                            ? "ring-2 ring-blue-600"
+                            : "hover:ring-2 hover:ring-blue-600"
+                        }`}
+                        onClick={() => handleMaterialSelect(material)}
+                      >
+                        <img
+                          src={material.preview || "/placeholder.svg"}
+                          alt={material.name}
+                          className="w-full aspect-[9/16] object-cover"
+                        />
+                        <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all">
+                          <Button
+                            variant="ghost"
+                            size="icon"
+                            className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity"
+                            onClick={(e) => {
+                              e.stopPropagation()
+                              handlePreviewImage(material.preview)
+                            }}
+                          >
+                            <Maximize2 className="h-4 w-4 text-white" />
+                          </Button>
+                        </div>
+                        <div className="absolute bottom-0 left-0 right-0 p-2 bg-black/50 text-white">
+                          <div className="text-sm truncate">{material.name}</div>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+
+                  {selectedMaterials.length > 0 && (
+                    <div className="mt-4">
+                      <Label>已选择的海报</Label>
+                      <div className="mt-2">
+                        <div className="relative w-full max-w-[200px]">
+                          <img
+                            src={selectedMaterials[0].preview || "/placeholder.svg"}
+                            alt={selectedMaterials[0].name}
+                            className="w-full aspect-[9/16] object-cover rounded-lg cursor-pointer"
+                            onClick={() => handlePreviewImage(selectedMaterials[0].preview)}
+                          />
+                          <Button
+                            variant="secondary"
+                            size="sm"
+                            className="absolute top-2 right-2"
+                            onClick={() => handleRemoveMaterial(selectedMaterials[0].id)}
+                          >
+                            <X className="h-4 w-4" />
+                          </Button>
+                        </div>
+                      </div>
+                    </div>
+                  )}
+                </div>
+              )}
+
+              {scenarios.find((s) => s.id === formData.scenario)?.id === "order" && (
+                <div>
+                  <div className="flex items-center justify-between mb-4">
+                    <Label>订单导入</Label>
+                    <div className="flex gap-2">
+                      <Button variant="outline" onClick={handleDownloadTemplate}>
+                        <Download className="h-4 w-4 mr-2" />
+                        下载模板
+                      </Button>
+                      <Button onClick={() => setIsImportDialogOpen(true)}>
+                        <Upload className="h-4 w-4 mr-2" />
+                        导入订单
+                      </Button>
+                    </div>
+                  </div>
+
+                  {importedTags.length > 0 && (
+                    <div className="mt-4">
+                      <h4 className="text-sm font-medium mb-2">已导入 {importedTags.length} 条数据</h4>
+                      <div className="max-h-[300px] overflow-auto border rounded-md">
+                        <Table>
+                          <TableHeader>
+                            <TableRow>
+                              <TableHead>电话号码</TableHead>
+                              <TableHead>微信号</TableHead>
+                              <TableHead>来源</TableHead>
+                              <TableHead>订单金额</TableHead>
+                            </TableRow>
+                          </TableHeader>
+                          <TableBody>
+                            {importedTags.slice(0, 5).map((tag, index) => (
+                              <TableRow key={index}>
+                                <TableCell>{tag.phone}</TableCell>
+                                <TableCell>{tag.wechat}</TableCell>
+                                <TableCell>{tag.source}</TableCell>
+                                <TableCell>{tag.orderAmount}</TableCell>
+                              </TableRow>
+                            ))}
+                            {importedTags.length > 5 && (
+                              <TableRow>
+                                <TableCell colSpan={4} className="text-center text-gray-500">
+                                  还有 {importedTags.length - 5} 条数据未显示
+                                </TableCell>
+                              </TableRow>
+                            )}
+                          </TableBody>
+                        </Table>
+                      </div>
+                    </div>
+                  )}
+                </div>
+              )}
+              {formData.scenario === "weixinqun" && (
+                <>
+                  <div>
+                    <Label>群管理设置</Label>
+                    <div className="grid grid-cols-2 gap-4 mt-2">
+                      <div className="flex items-center justify-between p-3 border rounded-lg">
+                        <div>
+                          <div className="font-medium">自动欢迎新成员</div>
+                          <div className="text-sm text-gray-500">新成员入群时自动发送欢迎消息</div>
+                        </div>
+                        <Switch
+                          checked={formData.autoWelcome ?? true}
+                          onCheckedChange={(checked) => onChange({ ...formData, autoWelcome: checked })}
+                        />
+                      </div>
+                      <div className="flex items-center justify-between p-3 border rounded-lg">
+                        <div>
+                          <div className="font-medium">群活跃度监控</div>
+                          <div className="text-sm text-gray-500">监控群聊活跃度并自动互动</div>
+                        </div>
+                        <Switch
+                          checked={formData.activityMonitor ?? false}
+                          onCheckedChange={(checked) => onChange({ ...formData, activityMonitor: checked })}
+                        />
+                      </div>
+                    </div>
+                  </div>
+
+                  <div>
+                    <Label>每日推送数量</Label>
+                    <div className="flex items-center space-x-4 mt-2">
+                      <Button
+                        variant="outline"
+                        size="icon"
+                        onClick={() => onChange({ ...formData, syncCount: Math.max(1, (formData.syncCount || 3) - 1) })}
+                        className="bg-white border-gray-200"
+                      >
+                        <Minus className="h-4 w-4" />
+                      </Button>
+                      <span className="w-8 text-center">{formData.syncCount || 3}</span>
+                      <Button
+                        variant="outline"
+                        size="icon"
+                        onClick={() => onChange({ ...formData, syncCount: (formData.syncCount || 3) + 1 })}
+                        className="bg-white border-gray-200"
+                      >
+                        <Plus className="h-4 w-4" />
+                      </Button>
+                      <span className="text-gray-500">条内容到群</span>
+                    </div>
+                    <div className="text-sm text-gray-500 mt-1">建议每日推送3-5条内容，避免过度打扰群成员</div>
+                  </div>
+
+                  <div>
+                    <Label>推送时间设置</Label>
+                    <div className="grid grid-cols-3 gap-2 mt-2">
+                      {["上午 9:00-12:00", "下午 14:00-17:00", "晚上 19:00-21:00"].map((time, index) => (
+                        <div
+                          key={index}
+                          className={`p-2 border rounded-lg text-center cursor-pointer text-sm ${
+                            (formData.pushTimes || []).includes(index)
+                              ? "bg-blue-50 border-blue-300 text-blue-700"
+                              : "bg-white hover:bg-gray-50"
+                          }`}
+                          onClick={() => {
+                            const currentTimes = formData.pushTimes || []
+                            const newTimes = currentTimes.includes(index)
+                              ? currentTimes.filter((t: number) => t !== index)
+                              : [...currentTimes, index]
+                            onChange({ ...formData, pushTimes: newTimes })
                           }}
                         >
-                          <Maximize2 className="h-4 w-4 text-white" />
-                        </Button>
-                      </div>
-                      <div className="absolute bottom-0 left-0 right-0 p-2 bg-black/50 text-white">
-                        <div className="text-sm truncate">{material.name}</div>
-                      </div>
-                    </div>
-                  ))}
-                </div>
-
-                {selectedMaterials.length > 0 && (
-                  <div className="mt-4">
-                    <Label>已选择的海报</Label>
-                    <div className="mt-2">
-                      <div className="relative w-full max-w-[200px]">
-                        <img
-                          src={selectedMaterials[0].preview || "/placeholder.svg"}
-                          alt={selectedMaterials[0].name}
-                          className="w-full aspect-[9/16] object-cover rounded-lg cursor-pointer"
-                          onClick={() => handlePreviewImage(selectedMaterials[0].preview)}
-                        />
-                        <Button
-                          variant="secondary"
-                          size="sm"
-                          className="absolute top-2 right-2"
-                          onClick={() => handleRemoveMaterial(selectedMaterials[0].id)}
-                        >
-                          <X className="h-4 w-4" />
-                        </Button>
-                      </div>
+                          {time}
+                        </div>
+                      ))}
                     </div>
                   </div>
-                )}
-              </div>
-            )}
+                </>
+              )}
+            </>
+          )}
 
-            {scenarios.find((s) => s.id === formData.scenario)?.id === "order" && (
-              <div>
-                <div className="flex items-center justify-between mb-4">
-                  <Label>订单导入</Label>
-                  <div className="flex gap-2">
-                    <Button variant="outline" onClick={handleDownloadTemplate}>
-                      <Download className="h-4 w-4 mr-2" />
-                      下载模板
-                    </Button>
-                    <Button onClick={() => setIsImportDialogOpen(true)}>
-                      <Upload className="h-4 w-4 mr-2" />
-                      导入订单
-                    </Button>
-                  </div>
-                </div>
+          <div className="flex items-center justify-between">
+            <Label htmlFor="enabled">是否启用</Label>
+            <Switch
+              id="enabled"
+              checked={formData.enabled}
+              onCheckedChange={(checked) => onChange({ ...formData, enabled: checked })}
+            />
+          </div>
 
-                {importedTags.length > 0 && (
-                  <div className="mt-4">
-                    <h4 className="text-sm font-medium mb-2">已导入 {importedTags.length} 条数据</h4>
-                    <div className="max-h-[300px] overflow-auto border rounded-md">
-                      <Table>
-                        <TableHeader>
-                          <TableRow>
-                            <TableHead>电话号码</TableHead>
-                            <TableHead>来源</TableHead>
-                          </TableRow>
-                        </TableHeader>
-                        <TableBody>
-                          {importedTags.slice(0, 5).map((tag, index) => (
-                            <TableRow key={index}>
-                              <TableCell>{tag.phone}</TableCell>
-                              <TableCell>{tag.source}</TableCell>
-                            </TableRow>
-                          ))}
-                          {importedTags.length > 5 && (
-                            <TableRow>
-                              <TableCell colSpan={4} className="text-center text-gray-500">
-                                还有 {importedTags.length - 5} 条数据未显示
-                              </TableCell>
-                            </TableRow>
-                          )}
-                        </TableBody>
-                      </Table>
-                    </div>
-                  </div>
-                )}
-              </div>
-            )}
-          </>
-        )}
-
-        <div className="flex items-center justify-between">
-          <Label htmlFor="enabled">是否启用</Label>
-          <Switch
-            id="enabled"
-            checked={formData.enabled}
-            onCheckedChange={(checked) => onChange({ ...formData, enabled: checked })}
-          />
+          <Button className="w-full h-12 text-base" onClick={onNext}>
+            下一步
+          </Button>
         </div>
+      </Card>
 
-        <Button className="w-full h-12 text-base" onClick={handleNextStep}>
-          下一步
-        </Button>
-      </div>
-    </div>
+      {/* 账号选择对话框 */}
+      <Dialog open={isAccountDialogOpen} onOpenChange={setIsAccountDialogOpen}>
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>选择账号</DialogTitle>
+          </DialogHeader>
+          <div className="mt-4 max-h-[400px] overflow-y-auto">
+            <div className="space-y-2">
+              {accounts.map((account) => (
+                <div
+                  key={account.id}
+                  className="flex items-center space-x-3 p-3 hover:bg-gray-100 rounded-lg cursor-pointer"
+                  onClick={() => handleAccountSelect(account)}
+                >
+                  <img src={account.avatar || "/placeholder.svg"} alt="" className="w-10 h-10 rounded-full" />
+                  <span className="flex-1">{account.nickname}</span>
+                  {selectedAccounts.find((a) => a.id === account.id) && (
+                    <div className="w-4 h-4 rounded-full bg-blue-600" />
+                  )}
+                </div>
+              ))}
+            </div>
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 二维码对话框 */}
+      <Dialog open={isQRCodeOpen} onOpenChange={setIsQRCodeOpen}>
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>绑定账号</DialogTitle>
+          </DialogHeader>
+          <div className="flex flex-col items-center p-6">
+            <div className="w-64 h-64 bg-gray-100 rounded-lg flex items-center justify-center">
+              <img src="/placeholder.svg?height=256&width=256" alt="二维码" className="w-full h-full" />
+            </div>
+            <p className="mt-4 text-sm text-gray-600">请用相应的APP扫码</p>
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 图片预览对话框 */}
+      <Dialog open={isPreviewOpen} onOpenChange={setIsPreviewOpen}>
+        <DialogContent className="sm:max-w-3xl">
+          <DialogHeader>
+            <DialogTitle>海报预览</DialogTitle>
+          </DialogHeader>
+          <div className="flex justify-center items-center p-4">
+            <img src={previewImage || "/placeholder.svg"} alt="预览" className="max-h-[80vh] object-contain" />
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 电话获客设置对话框 */}
+      <Dialog open={isPhoneSettingsOpen} onOpenChange={setIsPhoneSettingsOpen}>
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>电话获客设置</DialogTitle>
+            <DialogDescription>配置电话获客的自动化功能，提高获客效率</DialogDescription>
+          </DialogHeader>
+          <div className="py-4 space-y-6">
+            <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+              <div className="space-y-1">
+                <Label htmlFor="auto-add" className="font-medium">
+                  自动添加客户
+                </Label>
+                <p className="text-sm text-gray-500">来电后自动将客户添加为微信好友</p>
+                <p className="text-xs text-blue-600">推荐：开启此功能可提高转化率约30%</p>
+              </div>
+              <Switch
+                id="auto-add"
+                checked={phoneSettings.autoAdd}
+                onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, autoAdd: checked })}
+                className="data-[state=checked]:bg-blue-600"
+              />
+            </div>
+
+            <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+              <div className="space-y-1">
+                <Label htmlFor="speech-to-text" className="font-medium">
+                  语音转文字
+                </Label>
+                <p className="text-sm text-gray-500">自动将通话内容转换为文字记录</p>
+                <p className="text-xs text-blue-600">支持普通话、粤语等多种方言识别</p>
+              </div>
+              <Switch
+                id="speech-to-text"
+                checked={phoneSettings.speechToText}
+                onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, speechToText: checked })}
+                className="data-[state=checked]:bg-blue-600"
+              />
+            </div>
+
+            <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+              <div className="space-y-1">
+                <Label htmlFor="question-extraction" className="font-medium">
+                  问题提取
+                </Label>
+                <p className="text-sm text-gray-500">自动从通话中提取客户的首句问题</p>
+                <p className="text-xs text-blue-600">AI智能识别客户意图，提高回复精准度</p>
+              </div>
+              <Switch
+                id="question-extraction"
+                checked={phoneSettings.questionExtraction}
+                onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, questionExtraction: checked })}
+                className="data-[state=checked]:bg-blue-600"
+              />
+            </div>
+          </div>
+          <DialogFooter className="flex space-x-2 pt-2">
+            <Button variant="outline" onClick={() => setIsPhoneSettingsOpen(false)} className="flex-1">
+              取消
+            </Button>
+            <Button onClick={handlePhoneSettingsUpdate} className="flex-1 bg-blue-600 hover:bg-blue-700">
+              保存设置
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* 订单导入对话框 */}
+      <Dialog open={isImportDialogOpen} onOpenChange={setIsImportDialogOpen}>
+        <DialogContent className="max-w-3xl">
+          <DialogHeader>
+            <DialogTitle>导入订单标签</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-4">
+            <div className="flex items-center gap-4">
+              <Input type="file" accept=".csv" onChange={handleFileImport} className="flex-1" />
+            </div>
+            <div className="max-h-[400px] overflow-auto">
+              <Table>
+                <TableHeader>
+                  <TableRow>
+                    <TableHead>电话号码</TableHead>
+                    <TableHead>微信号</TableHead>
+                    <TableHead>来源</TableHead>
+                    <TableHead>订单金额</TableHead>
+                    <TableHead>下单日期</TableHead>
+                  </TableRow>
+                </TableHeader>
+                <TableBody>
+                  {importedTags.map((tag, index) => (
+                    <TableRow key={index}>
+                      <TableCell>{tag.phone}</TableCell>
+                      <TableCell>{tag.wechat}</TableCell>
+                      <TableCell>{tag.source}</TableCell>
+                      <TableCell>{tag.orderAmount}</TableCell>
+                      <TableCell>{tag.orderDate}</TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setIsImportDialogOpen(false)}>
+              取消
+            </Button>
+            <Button
+              onClick={() => {
+                onChange({ ...formData, importedTags })
+                setIsImportDialogOpen(false)
+              }}
+            >
+              确认导入
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </TooltipProvider>
   )
 }
-
diff --git a/Cunkebao/app/plans/new/steps/FriendRequestSettings.tsx b/Cunkebao/app/plans/new/steps/FriendRequestSettings.tsx
index 17e19bdf..4525a2b5 100644
--- a/Cunkebao/app/plans/new/steps/FriendRequestSettings.tsx
+++ b/Cunkebao/app/plans/new/steps/FriendRequestSettings.tsx
@@ -5,15 +5,13 @@ import { Card } from "@/components/ui/card"
 import { Button } from "@/components/ui/button"
 import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
-import { HelpCircle, MessageSquare, AlertCircle, RefreshCw } from "lucide-react"
+import { HelpCircle, MessageSquare, AlertCircle } from "lucide-react"
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog"
 import { Alert, AlertDescription } from "@/components/ui/alert"
 import { ChevronsUpDown } from "lucide-react"
 import { Checkbox } from "@/components/ui/checkbox"
-import { fetchDeviceList } from "@/api/devices"
-import type { ServerDevice } from "@/types/device"
 
 interface FriendRequestSettingsProps {
   formData: any
@@ -38,15 +36,20 @@ const remarkTypes = [
   { value: "source", label: "来源" },
 ]
 
+// 模拟设备数据
+const mockDevices = [
+  { id: "1", name: "iPhone 13 Pro", status: "online" },
+  { id: "2", name: "Xiaomi 12", status: "online" },
+  { id: "3", name: "Huawei P40", status: "offline" },
+  { id: "4", name: "OPPO Find X3", status: "online" },
+  { id: "5", name: "Samsung S21", status: "online" },
+]
+
 export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: FriendRequestSettingsProps) {
   const [isTemplateDialogOpen, setIsTemplateDialogOpen] = useState(false)
   const [hasWarnings, setHasWarnings] = useState(false)
   const [isDeviceSelectorOpen, setIsDeviceSelectorOpen] = useState(false)
-  const [selectedDevices, setSelectedDevices] = useState<ServerDevice[]>(formData.selectedDevices || [])
-  const [devices, setDevices] = useState<ServerDevice[]>([])
-  const [loadingDevices, setLoadingDevices] = useState(false)
-  const [deviceError, setDeviceError] = useState<string | null>(null)
-  const [searchKeyword, setSearchKeyword] = useState("")
+  const [selectedDevices, setSelectedDevices] = useState<any[]>(formData.selectedDevices || [])
 
   // 获取场景标题
   const getScenarioTitle = () => {
@@ -64,33 +67,6 @@ export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: Fr
     }
   }
 
-  // 加载设备列表
-  const loadDevices = async () => {
-    try {
-      setLoadingDevices(true)
-      setDeviceError(null)
-      
-      const response = await fetchDeviceList(1, 100, searchKeyword)
-      
-      if (response.code === 200 && response.data?.list) {
-        setDevices(response.data.list)
-      } else {
-        setDeviceError(response.msg || "获取设备列表失败")
-        console.error("获取设备列表失败:", response.msg)
-      }
-    } catch (err) {
-      console.error("获取设备列表失败:", err)
-      setDeviceError("获取设备列表失败，请稍后重试")
-    } finally {
-      setLoadingDevices(false)
-    }
-  }
-
-  // 初始化时加载设备列表
-  useEffect(() => {
-    loadDevices()
-  }, [])
-
   // 使用useEffect设置默认值
   useEffect(() => {
     if (!formData.greeting) {
@@ -120,7 +96,7 @@ export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: Fr
     onNext()
   }
 
-  const toggleDeviceSelection = (device: ServerDevice) => {
+  const toggleDeviceSelection = (device: any) => {
     const isSelected = selectedDevices.some((d) => d.id === device.id)
     let newSelectedDevices
 
@@ -134,13 +110,8 @@ export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: Fr
     onChange({ ...formData, selectedDevices: newSelectedDevices })
   }
 
-  // 根据关键词搜索设备
-  const handleSearch = () => {
-    loadDevices()
-  }
-
   return (
-    <div className="w-full p-4 bg-gray-50">
+    <Card className="p-6">
       <div className="space-y-6">
         <div>
           <Label className="text-base">选择设备</Label>
@@ -157,77 +128,31 @@ export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: Fr
             {isDeviceSelectorOpen && (
               <div className="absolute z-10 w-full mt-1 bg-white border rounded-md shadow-lg">
                 <div className="p-2">
-                  <div className="flex gap-2 mb-2">
-                    <Input 
-                      placeholder="搜索设备..." 
-                      value={searchKeyword}
-                      onChange={(e) => setSearchKeyword(e.target.value)}
-                      onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
-                    />
-                    <Button variant="outline" size="icon" onClick={handleSearch}>
-                      <RefreshCw className="h-4 w-4" />
-                    </Button>
-                  </div>
-                  
-                  {loadingDevices ? (
-                    <div className="flex justify-center items-center py-4">
-                      <div className="animate-spin h-5 w-5 border-2 border-blue-500 rounded-full border-t-transparent"></div>
-                    </div>
-                  ) : deviceError ? (
-                    <div className="text-center text-red-500 py-4">
-                      {deviceError}
-                      <Button variant="outline" size="sm" onClick={loadDevices} className="ml-2">
-                        重试
-                      </Button>
-                    </div>
-                  ) : devices.length === 0 ? (
-                    <div className="text-center text-gray-500 py-4">
-                      没有找到设备
-                    </div>
-                  ) : (
-                    <div className="max-h-60 overflow-auto">
-                      {devices.map((device) => (
-                        <div
-                          key={device.id}
-                          className="flex items-center justify-between p-2 hover:bg-gray-100 cursor-pointer"
-                          onClick={() => toggleDeviceSelection(device)}
-                        >
-                          <div className="flex items-center space-x-2">
-                            <Checkbox
-                              checked={selectedDevices.some((d) => d.id === device.id)}
-                              onCheckedChange={() => toggleDeviceSelection(device)}
-                            />
-                            <span>{device.memo}</span>
-                          </div>
-                          <span className={`text-xs ${device.alive === 1 ? "text-green-500" : "text-gray-400"}`}>
-                            {device.alive === 1 ? "在线" : "离线"}
-                          </span>
+                  <Input placeholder="搜索设备..." className="mb-2" />
+                  <div className="max-h-60 overflow-auto">
+                    {mockDevices.map((device) => (
+                      <div
+                        key={device.id}
+                        className="flex items-center justify-between p-2 hover:bg-gray-100 cursor-pointer"
+                        onClick={() => toggleDeviceSelection(device)}
+                      >
+                        <div className="flex items-center space-x-2">
+                          <Checkbox
+                            checked={selectedDevices.some((d) => d.id === device.id)}
+                            onCheckedChange={() => toggleDeviceSelection(device)}
+                          />
+                          <span>{device.name}</span>
                         </div>
-                      ))}
-                    </div>
-                  )}
+                        <span className={`text-xs ${device.status === "online" ? "text-green-500" : "text-gray-400"}`}>
+                          {device.status === "online" ? "在线" : "离线"}
+                        </span>
+                      </div>
+                    ))}
+                  </div>
                 </div>
               </div>
             )}
           </div>
-          
-          {selectedDevices.length > 0 && (
-            <div className="mt-2 flex flex-wrap gap-2">
-              {selectedDevices.map((device) => (
-                <div key={device.id} className="flex items-center bg-gray-100 rounded-full px-3 py-1">
-                  <span className="text-sm">{device.memo}</span>
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    className="ml-2 p-0"
-                    onClick={() => toggleDeviceSelection(device)}
-                  >
-                    <AlertCircle className="h-4 w-4" />
-                  </Button>
-                </div>
-              ))}
-            </div>
-          )}
         </div>
 
         <div>
@@ -314,7 +239,7 @@ export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: Fr
         </div>
 
         {hasWarnings && (
-          <Alert variant="destructive" className="bg-amber-50 border-amber-200">
+          <Alert variant="warning" className="bg-amber-50 border-amber-200">
             <AlertCircle className="h-4 w-4 text-amber-500" />
             <AlertDescription>您有未完成的设置项，建议完善后再进入下一步。</AlertDescription>
           </Alert>
@@ -347,7 +272,6 @@ export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: Fr
           </div>
         </DialogContent>
       </Dialog>
-    </div>
+    </Card>
   )
 }
-
diff --git a/Cunkebao/app/plans/new/steps/MessageSettings.tsx b/Cunkebao/app/plans/new/steps/MessageSettings.tsx
index 68c88b66..de80ecd3 100644
--- a/Cunkebao/app/plans/new/steps/MessageSettings.tsx
+++ b/Cunkebao/app/plans/new/steps/MessageSettings.tsx
@@ -82,7 +82,7 @@ export function MessageSettings({ formData, onChange, onNext, onPrev }: MessageS
           type: "text",
           content: "",
           sendInterval: 5,
-          intervalUnit: "minutes",
+          intervalUnit: "seconds", // 默认改为秒
         },
       ],
     },
@@ -103,7 +103,7 @@ export function MessageSettings({ formData, onChange, onNext, onPrev }: MessageS
     if (dayPlans[dayIndex].day === 0) {
       // 即时消息使用间隔设置
       newMessage.sendInterval = 5
-      newMessage.intervalUnit = "minutes"
+      newMessage.intervalUnit = "seconds" // 默认改为秒
     } else {
       // 非即时消息使用具体时间设置
       newMessage.scheduledTime = {
@@ -192,7 +192,7 @@ export function MessageSettings({ formData, onChange, onNext, onPrev }: MessageS
   }
 
   return (
-    <div className="w-full p-4 bg-gray-50">
+    <Card className="p-6">
       <div className="space-y-6">
         <div className="flex items-center justify-between">
           <h2 className="text-lg font-semibold">消息设置</h2>
@@ -549,7 +549,6 @@ export function MessageSettings({ formData, onChange, onNext, onPrev }: MessageS
           </DialogFooter>
         </DialogContent>
       </Dialog>
-    </div>
+    </Card>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/[id]/page.tsx b/Cunkebao/app/scenarios/[channel]/[id]/page.tsx
new file mode 100644
index 00000000..3add780d
--- /dev/null
+++ b/Cunkebao/app/scenarios/[channel]/[id]/page.tsx
@@ -0,0 +1,372 @@
+"use client"
+
+import { useState, useEffect } from "react"
+import { useParams, useRouter } from "next/navigation"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { Badge } from "@/components/ui/badge"
+import { Skeleton } from "@/components/ui/skeleton"
+import { ArrowLeft, Edit, Phone, MessageSquare, FileText } from "lucide-react"
+import { Switch } from "@/components/ui/switch"
+import { toast } from "@/components/ui/use-toast"
+import { LineChart, Line, XAxis, YAxis, CartesianGrid, ResponsiveContainer } from "recharts"
+import { ChartContainer, ChartTooltip, ChartTooltipContent } from "@/components/ui/chart"
+
+interface ScenarioDetail {
+  id: string
+  name: string
+  type: string
+  status: "active" | "inactive" | "draft"
+  createdAt: string
+  description: string
+  devices: {
+    total: number
+    online: number
+  }
+  stats: {
+    total: number
+    today: number
+    conversion: number
+    history: Array<{
+      date: string
+      value: number
+    }>
+  }
+  settings: {
+    [key: string]: any
+  }
+}
+
+export default function ScenarioDetailPage() {
+  const params = useParams()
+  const router = useRouter()
+  const { channel, id } = params
+
+  const [isLoading, setIsLoading] = useState(true)
+  const [scenario, setScenario] = useState<ScenarioDetail | null>(null)
+
+  useEffect(() => {
+    // 模拟API请求
+    const fetchScenarioDetail = async () => {
+      setIsLoading(true)
+      await new Promise((resolve) => setTimeout(resolve, 1000))
+
+      // 生成过去30天的数据
+      const historyData = Array.from({ length: 30 }, (_, i) => {
+        const date = new Date()
+        date.setDate(date.getDate() - (29 - i))
+        return {
+          date: date.toISOString().split("T")[0],
+          value: Math.floor(Math.random() * 20) + 1,
+        }
+      })
+
+      const mockScenario: ScenarioDetail = {
+        id: id as string,
+        name: `${channel === "haibao" ? "海报" : channel === "douyin" ? "抖音" : channel === "phone" ? "电话" : "其他"}获客计划`,
+        type: channel as string,
+        status: "active",
+        createdAt: "2023-05-15",
+        description: "这是一个用于获取新客户的场景获客计划",
+        devices: {
+          total: 12,
+          online: 8,
+        },
+        stats: {
+          total: 342,
+          today: 18,
+          conversion: 0.32,
+          history: historyData,
+        },
+        settings: {
+          greeting: "你好，请通过我的好友请求",
+          remarkType: "phone",
+          addFriendInterval: 60,
+          enableMessage: true,
+          message: "您好，很高兴认识您！",
+          delayTime: 5,
+        },
+      }
+
+      setScenario(mockScenario)
+      setIsLoading(false)
+    }
+
+    fetchScenarioDetail()
+  }, [id, channel])
+
+  const handleToggleStatus = () => {
+    if (!scenario) return
+
+    const newStatus = scenario.status === "active" ? "inactive" : "active"
+    setScenario({ ...scenario, status: newStatus as "active" | "inactive" | "draft" })
+
+    toast({
+      title: `${newStatus === "active" ? "启用" : "停用"}成功`,
+      description: `场景获客计划已${newStatus === "active" ? "启用" : "停用"}`,
+    })
+  }
+
+  const handleEdit = () => {
+    router.push(`/scenarios/${channel}/edit/${id}`)
+  }
+
+  const getScenarioTypeIcon = () => {
+    switch (channel) {
+      case "phone":
+        return <Phone className="h-5 w-5" />
+      case "order":
+        return <FileText className="h-5 w-5" />
+      case "douyin":
+        return <MessageSquare className="h-5 w-5" />
+      default:
+        return <FileText className="h-5 w-5" />
+    }
+  }
+
+  const getScenarioTypeName = () => {
+    switch (channel) {
+      case "haibao":
+        return "海报获客"
+      case "douyin":
+        return "抖音获客"
+      case "phone":
+        return "电话获客"
+      case "xiaohongshu":
+        return "小红书获客"
+      case "order":
+        return "订单获客"
+      case "weixinqun":
+        return "微信群获客"
+      case "gongzhonghao":
+        return "公众号获客"
+      default:
+        return "其他获客"
+    }
+  }
+
+  const getStatusBadge = (status: string) => {
+    switch (status) {
+      case "active":
+        return <Badge className="bg-green-100 text-green-800 hover:bg-green-100">运行中</Badge>
+      case "inactive":
+        return <Badge className="bg-gray-100 text-gray-800 hover:bg-gray-100">已停用</Badge>
+      case "draft":
+        return <Badge className="bg-yellow-100 text-yellow-800 hover:bg-yellow-100">草稿</Badge>
+      default:
+        return null
+    }
+  }
+
+  if (isLoading) {
+    return (
+      <div className="flex-1 bg-gray-50">
+        <div className="max-w-[390px] mx-auto bg-white min-h-screen">
+          <header className="sticky top-0 z-10 bg-white border-b">
+            <div className="flex items-center h-14 px-4">
+              <Button variant="ghost" size="icon" onClick={() => router.back()}>
+                <ArrowLeft className="h-5 w-5" />
+              </Button>
+              <Skeleton className="h-6 w-40 ml-2" />
+            </div>
+          </header>
+          <div className="p-4 space-y-4">
+            <Skeleton className="h-32 w-full" />
+            <Skeleton className="h-64 w-full" />
+            <Skeleton className="h-48 w-full" />
+          </div>
+        </div>
+      </div>
+    )
+  }
+
+  if (!scenario) {
+    return (
+      <div className="flex-1 bg-gray-50">
+        <div className="max-w-[390px] mx-auto bg-white min-h-screen">
+          <header className="sticky top-0 z-10 bg-white border-b">
+            <div className="flex items-center h-14 px-4">
+              <Button variant="ghost" size="icon" onClick={() => router.back()}>
+                <ArrowLeft className="h-5 w-5" />
+              </Button>
+              <h1 className="ml-2 text-lg font-medium">场景详情</h1>
+            </div>
+          </header>
+          <div className="flex flex-col items-center justify-center p-4 h-[80vh]">
+            <p className="text-gray-500 mb-4">未找到场景获客计划</p>
+            <Button onClick={() => router.push("/scenarios")}>返回列表</Button>
+          </div>
+        </div>
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex-1 bg-gray-50">
+      <div className="max-w-[390px] mx-auto bg-white min-h-screen">
+        <header className="sticky top-0 z-10 bg-white border-b">
+          <div className="flex items-center h-14 px-4">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ArrowLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="ml-2 text-lg font-medium">{scenario.name}</h1>
+            <div className="ml-auto flex items-center">
+              <Switch checked={scenario.status === "active"} onCheckedChange={handleToggleStatus} className="mr-2" />
+              <Button size="sm" variant="outline" onClick={handleEdit}>
+                <Edit className="h-4 w-4 mr-1" />
+                编辑
+              </Button>
+            </div>
+          </div>
+        </header>
+
+        <div className="p-4 space-y-4">
+          <div className="flex items-center justify-between">
+            <div className="flex items-center">
+              {getScenarioTypeIcon()}
+              <span className="ml-1 text-sm text-gray-500">{getScenarioTypeName()}</span>
+            </div>
+            <div className="flex items-center space-x-2">
+              <span className="text-xs text-gray-500">创建于 {scenario.createdAt}</span>
+              {getStatusBadge(scenario.status)}
+            </div>
+          </div>
+
+          <Card>
+            <CardHeader className="pb-2">
+              <CardTitle className="text-base">获客数据</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="grid grid-cols-3 gap-2">
+                <div className="bg-gray-50 p-2 rounded-lg text-center">
+                  <p className="text-xs text-gray-500">总获客</p>
+                  <p className="text-lg font-semibold">{scenario.stats.total}</p>
+                </div>
+                <div className="bg-gray-50 p-2 rounded-lg text-center">
+                  <p className="text-xs text-gray-500">今日</p>
+                  <p className="text-lg font-semibold">{scenario.stats.today}</p>
+                </div>
+                <div className="bg-gray-50 p-2 rounded-lg text-center">
+                  <p className="text-xs text-gray-500">转化率</p>
+                  <p className="text-lg font-semibold">{(scenario.stats.conversion * 100).toFixed(1)}%</p>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardHeader className="pb-2">
+              <CardTitle className="text-base">获客趋势</CardTitle>
+              <CardDescription className="text-xs">过去30天的获客数量</CardDescription>
+            </CardHeader>
+            <CardContent>
+              <div className="h-48">
+                <ChartContainer
+                  config={{
+                    value: {
+                      label: "获客数量",
+                      color: "hsl(var(--chart-1))",
+                    },
+                  }}
+                  className="h-full"
+                >
+                  <ResponsiveContainer width="100%" height="100%">
+                    <LineChart data={scenario.stats.history} margin={{ top: 5, right: 5, left: 0, bottom: 5 }}>
+                      <CartesianGrid strokeDasharray="3 3" />
+                      <XAxis dataKey="date" tick={{ fontSize: 10 }} />
+                      <YAxis tick={{ fontSize: 10 }} />
+                      <ChartTooltip content={<ChartTooltipContent />} />
+                      <Line type="monotone" dataKey="value" stroke="var(--color-value)" name="获客数量" />
+                    </LineChart>
+                  </ResponsiveContainer>
+                </ChartContainer>
+              </div>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardHeader className="pb-2">
+              <CardTitle className="text-base">设备信息</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="space-y-2">
+                <div className="flex justify-between items-center">
+                  <span className="text-sm text-gray-500">总设备数</span>
+                  <span className="font-medium">{scenario.devices.total}</span>
+                </div>
+                <div className="flex justify-between items-center">
+                  <span className="text-sm text-gray-500">在线设备</span>
+                  <span className="font-medium">{scenario.devices.online}</span>
+                </div>
+                <div className="flex justify-between items-center">
+                  <span className="text-sm text-gray-500">设备在线率</span>
+                  <span className="font-medium">
+                    {((scenario.devices.online / scenario.devices.total) * 100).toFixed(1)}%
+                  </span>
+                </div>
+                <Button
+                  variant="outline"
+                  className="w-full mt-2"
+                  size="sm"
+                  onClick={() => router.push(`/scenarios/${channel}/devices`)}
+                >
+                  查看设备详情
+                </Button>
+              </div>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardHeader className="pb-2">
+              <CardTitle className="text-base">场景设置</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="space-y-2 text-sm">
+                {scenario.settings.greeting && (
+                  <div className="flex justify-between items-center">
+                    <span className="text-gray-500">招呼语</span>
+                    <span className="font-medium">{scenario.settings.greeting}</span>
+                  </div>
+                )}
+                {scenario.settings.remarkType && (
+                  <div className="flex justify-between items-center">
+                    <span className="text-gray-500">备注类型</span>
+                    <span className="font-medium">
+                      {scenario.settings.remarkType === "phone"
+                        ? "手机号"
+                        : scenario.settings.remarkType === "nickname"
+                          ? "昵称"
+                          : "来源"}
+                    </span>
+                  </div>
+                )}
+                {scenario.settings.addFriendInterval && (
+                  <div className="flex justify-between items-center">
+                    <span className="text-gray-500">添加频率</span>
+                    <span className="font-medium">{scenario.settings.addFriendInterval} 秒/次</span>
+                  </div>
+                )}
+                {scenario.settings.enableMessage && (
+                  <>
+                    <div className="flex justify-between items-center">
+                      <span className="text-gray-500">自动消息</span>
+                      <Badge className="bg-green-100 text-green-800 hover:bg-green-100">已启用</Badge>
+                    </div>
+                    <div className="flex justify-between items-center">
+                      <span className="text-gray-500">消息内容</span>
+                      <span className="font-medium">{scenario.settings.message}</span>
+                    </div>
+                    <div className="flex justify-between items-center">
+                      <span className="text-gray-500">发送延迟</span>
+                      <span className="font-medium">{scenario.settings.delayTime} 分钟</span>
+                    </div>
+                  </>
+                )}
+              </div>
+            </CardContent>
+          </Card>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/[channel]/acquired/page.tsx b/Cunkebao/app/scenarios/[channel]/acquired/page.tsx
index 1691109e..512894bc 100644
--- a/Cunkebao/app/scenarios/[channel]/acquired/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/acquired/page.tsx
@@ -1,7 +1,7 @@
 "use client"
 
 import { useState } from "react"
-import { ChevronLeft, Plus } from "lucide-react"
+import { ChevronLeft } from "lucide-react"
 import { Card } from "@/components/ui/card"
 import { Button } from "@/components/ui/button"
 import { Badge } from "@/components/ui/badge"
@@ -50,17 +50,13 @@ export default function AcquiredCustomersPage({ params }: { params: { channel: s
   return (
     <div className="min-h-screen bg-gray-50">
       <header className="sticky top-0 z-10 bg-white/80 backdrop-blur-sm border-b">
-        <div className="flex items-center justify-between p-4">
+        <div className="flex items-center p-4">
           <div className="flex items-center space-x-3">
             <Button variant="ghost" size="icon" onClick={() => router.back()}>
               <ChevronLeft className="h-5 w-5" />
             </Button>
             <h1 className="text-xl font-semibold text-blue-600">{channelName}已获客</h1>
           </div>
-          <Button variant="default" onClick={() => router.push(`/scenarios/new`)} className="flex items-center gap-1">
-            <Plus className="h-4 w-4" />
-            新建计划
-          </Button>
         </div>
       </header>
 
@@ -116,4 +112,3 @@ export default function AcquiredCustomersPage({ params }: { params: { channel: s
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/added/page.tsx b/Cunkebao/app/scenarios/[channel]/added/page.tsx
index 4428ed4b..a8c9a709 100644
--- a/Cunkebao/app/scenarios/[channel]/added/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/added/page.tsx
@@ -1,7 +1,7 @@
 "use client"
 
 import { useState } from "react"
-import { ChevronLeft, Plus } from "lucide-react"
+import { ChevronLeft } from "lucide-react"
 import { Card } from "@/components/ui/card"
 import { Button } from "@/components/ui/button"
 import { Badge } from "@/components/ui/badge"
@@ -53,17 +53,13 @@ export default function AddedCustomersPage({ params }: { params: { channel: stri
   return (
     <div className="min-h-screen bg-gray-50">
       <header className="sticky top-0 z-10 bg-white/80 backdrop-blur-sm border-b">
-        <div className="flex items-center justify-between p-4">
+        <div className="flex items-center p-4">
           <div className="flex items-center space-x-3">
             <Button variant="ghost" size="icon" onClick={() => router.back()}>
               <ChevronLeft className="h-5 w-5" />
             </Button>
             <h1 className="text-xl font-semibold text-blue-600">{channelName}已添加</h1>
           </div>
-          <Button variant="default" onClick={() => router.push(`/scenarios/new`)} className="flex items-center gap-1">
-            <Plus className="h-4 w-4" />
-            新建计划
-          </Button>
         </div>
       </header>
 
@@ -120,4 +116,3 @@ export default function AddedCustomersPage({ params }: { params: { channel: stri
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/api/page.tsx b/Cunkebao/app/scenarios/[channel]/api/page.tsx
index b5a1f2cc..7acb08a8 100644
--- a/Cunkebao/app/scenarios/[channel]/api/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/api/page.tsx
@@ -1,12 +1,10 @@
 "use client"
 
 import { useState } from "react"
-import { ChevronLeft, Copy, Plus, Trash2 } from "lucide-react"
+import { ChevronLeft, Copy, FileText, Play, Info, Link } from "lucide-react"
 import { Button } from "@/components/ui/button"
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { Card, CardContent } from "@/components/ui/card"
 import { Input } from "@/components/ui/input"
-import { Label } from "@/components/ui/label"
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
 import { useRouter } from "next/navigation"
 import { toast } from "@/components/ui/use-toast"
 import {
@@ -17,7 +15,8 @@ import {
   DialogDescription,
   DialogFooter,
 } from "@/components/ui/dialog"
-import { Switch } from "@/components/ui/switch"
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
 
 // 获取渠道中文名称
 const getChannelName = (channel: string) => {
@@ -32,432 +31,361 @@ const getChannelName = (channel: string) => {
   return channelMap[channel] || channel
 }
 
-interface ApiKey {
-  id: string
-  name: string
-  key: string
-  createdAt: string
-  lastUsed: string | null
-  status: "active" | "inactive"
-}
-
-interface Webhook {
-  id: string
-  name: string
-  url: string
-  events: string[]
-  createdAt: string
-  lastTriggered: string | null
-  status: "active" | "inactive"
-}
-
 export default function ApiManagementPage({ params }: { params: { channel: string } }) {
   const router = useRouter()
   const channel = params.channel
   const channelName = getChannelName(channel)
 
-  // 模拟API密钥数据
-  const [apiKeys, setApiKeys] = useState<ApiKey[]>([
-    {
-      id: "1",
-      name: `${channelName}获客API密钥`,
-      key: `api_${channel}_${Math.random().toString(36).substring(2, 10)}`,
-      createdAt: "2024-03-20 14:30:00",
-      lastUsed: "2024-03-21 09:15:22",
-      status: "active",
-    },
-  ])
-
-  // 模拟Webhook数据
-  const [webhooks, setWebhooks] = useState<Webhook[]>([
-    {
-      id: "1",
-      name: `${channelName}获客回调`,
-      url: `https://api.example.com/webhooks/${channel}`,
-      events: ["customer.created", "customer.updated", "tag.added"],
-      createdAt: "2024-03-20 14:35:00",
-      lastTriggered: "2024-03-21 09:16:45",
-      status: "active",
-    },
-  ])
+  // 示例数据
+  const apiKey = `api_1_b9805j8q`
+  const apiUrl = `https://kzmoqjnwgjc9q2xbj4np.lite.vusercontent.net/api/scenarios/${channel}/1/webhook`
+  const testUrl = `${apiUrl}?name=测试客户&phone=13800138000`
 
   // 对话框状态
-  const [showNewApiKeyDialog, setShowNewApiKeyDialog] = useState(false)
-  const [showNewWebhookDialog, setShowNewWebhookDialog] = useState(false)
-  const [newApiKeyName, setNewApiKeyName] = useState("")
-  const [newWebhookData, setNewWebhookData] = useState({
-    name: "",
-    url: "",
-    events: ["customer.created", "customer.updated", "tag.added"],
-  })
-
-  // 创建新API密钥
-  const handleCreateApiKey = () => {
-    if (!newApiKeyName.trim()) {
-      toast({
-        title: "错误",
-        description: "请输入API密钥名称",
-        variant: "destructive",
-      })
-      return
-    }
-
-    const newKey: ApiKey = {
-      id: `${Date.now()}`,
-      name: newApiKeyName,
-      key: `api_${channel}_${Math.random().toString(36).substring(2, 15)}`,
-      createdAt: new Date().toLocaleString(),
-      lastUsed: null,
-      status: "active",
-    }
-
-    setApiKeys([...apiKeys, newKey])
-    setNewApiKeyName("")
-    setShowNewApiKeyDialog(false)
-
-    toast({
-      title: "创建成功",
-      description: "新的API密钥已创建",
-      variant: "success",
-    })
-  }
-
-  // 创建新Webhook
-  const handleCreateWebhook = () => {
-    if (!newWebhookData.name.trim() || !newWebhookData.url.trim()) {
-      toast({
-        title: "错误",
-        description: "请填写所有必填字段",
-        variant: "destructive",
-      })
-      return
-    }
-
-    const newWebhook: Webhook = {
-      id: `${Date.now()}`,
-      name: newWebhookData.name,
-      url: newWebhookData.url,
-      events: newWebhookData.events,
-      createdAt: new Date().toLocaleString(),
-      lastTriggered: null,
-      status: "active",
-    }
-
-    setWebhooks([...webhooks, newWebhook])
-    setNewWebhookData({
-      name: "",
-      url: "",
-      events: ["customer.created", "customer.updated", "tag.added"],
-    })
-    setShowNewWebhookDialog(false)
-
-    toast({
-      title: "创建成功",
-      description: "新的Webhook已创建",
-      variant: "success",
-    })
-  }
-
-  // 删除API密钥
-  const handleDeleteApiKey = (id: string) => {
-    setApiKeys(apiKeys.filter((key) => key.id !== id))
-    toast({
-      title: "删除成功",
-      description: "API密钥已删除",
-      variant: "success",
-    })
-  }
-
-  // 删除Webhook
-  const handleDeleteWebhook = (id: string) => {
-    setWebhooks(webhooks.filter((webhook) => webhook.id !== id))
-    toast({
-      title: "删除成功",
-      description: "Webhook已删除",
-      variant: "success",
-    })
-  }
-
-  // 切换API密钥状态
-  const toggleApiKeyStatus = (id: string) => {
-    setApiKeys(
-      apiKeys.map((key) => (key.id === id ? { ...key, status: key.status === "active" ? "inactive" : "active" } : key)),
-    )
-  }
-
-  // 切换Webhook状态
-  const toggleWebhookStatus = (id: string) => {
-    setWebhooks(
-      webhooks.map((webhook) =>
-        webhook.id === id ? { ...webhook, status: webhook.status === "active" ? "inactive" : "active" } : webhook,
-      ),
-    )
-  }
+  const [showDocDialog, setShowDocDialog] = useState(false)
+  const [showTestDialog, setShowTestDialog] = useState(false)
 
   return (
-    <div className="flex-1 bg-gradient-to-b from-blue-50 to-white min-h-screen">
-      <header className="sticky top-0 z-10 bg-white/80 backdrop-blur-sm border-b">
+    <div className="flex-1 bg-white min-h-screen pb-20">
+      <header className="sticky top-0 z-10 bg-white shadow-sm">
         <div className="flex items-center p-4">
           <Button variant="ghost" size="icon" onClick={() => router.back()}>
             <ChevronLeft className="h-5 w-5" />
           </Button>
-          <h1 className="text-xl font-semibold text-blue-600 ml-2">{channelName}获客接口管理</h1>
+          <h1 className="text-lg font-medium ml-2">{channelName}获客接口</h1>
         </div>
       </header>
 
-      <div className="p-4 max-w-7xl mx-auto">
-        <Tabs defaultValue="api-keys" className="w-full">
+      <div className="p-4 max-w-md mx-auto space-y-5">
+        {/* 接口位置提示 */}
+        <div className="bg-blue-50 rounded-lg p-3 flex items-start">
+          <Info className="h-5 w-5 text-blue-500 mt-0.5 flex-shrink-0" />
+          <div className="ml-2">
+            <p className="text-sm text-blue-700">
+              <span className="font-medium">接口位置：</span>场景获客 → {channelName}获客 → 选择计划 → 右上角菜单 →
+              计划接口
+            </p>
+          </div>
+        </div>
+
+        <Tabs defaultValue="api" className="w-full">
           <TabsList className="grid w-full grid-cols-2 mb-4">
-            <TabsTrigger value="api-keys">API密钥</TabsTrigger>
-            <TabsTrigger value="webhooks">Webhook</TabsTrigger>
+            <TabsTrigger value="api">接口信息</TabsTrigger>
+            <TabsTrigger value="params">参数说明</TabsTrigger>
           </TabsList>
 
-          <TabsContent value="api-keys" className="space-y-4">
-            <div className="flex justify-between items-center">
-              <h2 className="text-lg font-medium">API密钥管理</h2>
-              <Button onClick={() => setShowNewApiKeyDialog(true)}>
-                <Plus className="w-4 h-4 mr-2" />
-                创建API密钥
-              </Button>
-            </div>
-
-            <div className="space-y-4">
-              {apiKeys.map((apiKey) => (
-                <Card key={apiKey.id}>
-                  <CardHeader className="pb-2">
-                    <div className="flex justify-between items-start">
-                      <div>
-                        <CardTitle>{apiKey.name}</CardTitle>
-                        <CardDescription>创建于 {apiKey.createdAt}</CardDescription>
-                      </div>
-                      <div className="flex items-center space-x-2">
-                        <div className="flex items-center space-x-2">
-                          <Switch
-                            checked={apiKey.status === "active"}
-                            onCheckedChange={() => toggleApiKeyStatus(apiKey.id)}
-                          />
-                          <span className="text-sm text-gray-500">{apiKey.status === "active" ? "启用" : "禁用"}</span>
-                        </div>
-                        <Button
-                          variant="ghost"
-                          size="icon"
-                          className="text-red-500 hover:text-red-700 hover:bg-red-50"
-                          onClick={() => handleDeleteApiKey(apiKey.id)}
-                        >
-                          <Trash2 className="w-4 h-4" />
+          <TabsContent value="api" className="space-y-4">
+            {/* API密钥部分 */}
+            <div className="space-y-2">
+              <div className="flex justify-between items-center">
+                <div className="flex items-center">
+                  <h2 className="text-base font-medium">API密钥</h2>
+                  <TooltipProvider>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
+                        <Button variant="ghost" size="icon" className="h-6 w-6 ml-1">
+                          <Info className="h-4 w-4 text-gray-400" />
                         </Button>
-                      </div>
-                    </div>
-                  </CardHeader>
-                  <CardContent>
-                    <div className="space-y-2">
-                      <div className="flex items-center space-x-2">
-                        <Input value={apiKey.key} readOnly className="font-mono text-sm" />
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p className="text-xs">用于接口身份验证</p>
+                      </TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
+                </div>
+                <div className="flex space-x-2">
+                  <TooltipProvider>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
                         <Button
                           variant="outline"
                           size="icon"
-                          onClick={() => {
-                            navigator.clipboard.writeText(apiKey.key)
-                            toast({
-                              title: "已复制",
-                              description: "API密钥已复制到剪贴板",
-                              variant: "success",
-                            })
-                          }}
+                          className="h-8 w-8"
+                          onClick={() => setShowDocDialog(true)}
                         >
-                          <Copy className="h-4 w-4" />
+                          <FileText className="h-4 w-4" />
                         </Button>
-                      </div>
-                      {apiKey.lastUsed && <p className="text-sm text-gray-500">上次使用: {apiKey.lastUsed}</p>}
-                    </div>
-                  </CardContent>
-                </Card>
-              ))}
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>查看接口文档</p>
+                      </TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
 
-              {apiKeys.length === 0 && (
-                <div className="text-center py-8 bg-white rounded-lg shadow-sm">
-                  <p className="text-gray-500">暂无API密钥</p>
+                  <TooltipProvider>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
+                        <Button
+                          variant="outline"
+                          size="icon"
+                          className="h-8 w-8"
+                          onClick={() => setShowTestDialog(true)}
+                        >
+                          <Play className="h-4 w-4" />
+                        </Button>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>快速测试</p>
+                      </TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
                 </div>
-              )}
+              </div>
+
+              <Card className="overflow-hidden border-gray-200">
+                <CardContent className="p-3">
+                  <div className="relative w-full">
+                    <Input value={apiKey} readOnly className="font-mono text-sm pr-10 border-gray-200" />
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="absolute right-0 top-0 h-full"
+                      onClick={() => {
+                        navigator.clipboard.writeText(apiKey)
+                        toast({
+                          title: "已复制",
+                          description: "API密钥已复制到剪贴板",
+                        })
+                      }}
+                    >
+                      <Copy className="h-4 w-4" />
+                    </Button>
+                  </div>
+                </CardContent>
+              </Card>
+            </div>
+
+            {/* 接口地址部分 */}
+            <div className="space-y-2">
+              <div className="flex justify-between items-center">
+                <div className="flex items-center">
+                  <h2 className="text-base font-medium">接口地址</h2>
+                  <TooltipProvider>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
+                        <Button variant="ghost" size="icon" className="h-6 w-6 ml-1">
+                          <Link className="h-4 w-4 text-gray-400" />
+                        </Button>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p className="text-xs">发送POST请求到此地址</p>
+                      </TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
+                </div>
+                <Button
+                  variant="outline"
+                  size="sm"
+                  className="h-7 text-xs px-2 border-blue-200 text-blue-600 hover:bg-blue-50"
+                  onClick={() => {
+                    navigator.clipboard.writeText(apiUrl)
+                    toast({
+                      title: "已复制",
+                      description: "接口地址已复制到剪贴板",
+                    })
+                  }}
+                >
+                  <Copy className="h-3 w-3 mr-1" />
+                  复制
+                </Button>
+              </div>
+
+              <Card className="overflow-hidden border-gray-200">
+                <CardContent className="p-3">
+                  <div className="w-full">
+                    <div className="font-mono text-xs bg-gray-50 p-2 rounded border border-gray-200 break-all">
+                      {apiUrl}
+                    </div>
+                  </div>
+                </CardContent>
+              </Card>
             </div>
           </TabsContent>
 
-          <TabsContent value="webhooks" className="space-y-4">
-            <div className="flex justify-between items-center">
-              <h2 className="text-lg font-medium">Webhook管理</h2>
-              <Button onClick={() => setShowNewWebhookDialog(true)}>
-                <Plus className="w-4 h-4 mr-2" />
-                创建Webhook
-              </Button>
+          <TabsContent value="params" className="space-y-4">
+            {/* 必要参数部分 */}
+            <div className="space-y-2">
+              <h2 className="text-base font-medium flex items-center">
+                必要参数
+                <span className="text-xs text-red-500 ml-1">*</span>
+              </h2>
+              <Card className="overflow-hidden border-gray-200">
+                <CardContent className="p-3">
+                  <div className="space-y-3">
+                    <div className="flex items-center justify-between">
+                      <div>
+                        <span className="font-medium text-blue-600">name</span>
+                        <span className="text-sm text-gray-500 ml-2">(姓名)</span>
+                      </div>
+                      <span className="text-xs bg-blue-50 text-blue-700 px-2 py-1 rounded">字符串</span>
+                    </div>
+                    <div className="flex items-center justify-between">
+                      <div>
+                        <span className="font-medium text-blue-600">phone</span>
+                        <span className="text-sm text-gray-500 ml-2">(电话)</span>
+                      </div>
+                      <span className="text-xs bg-blue-50 text-blue-700 px-2 py-1 rounded">字符串</span>
+                    </div>
+                  </div>
+                </CardContent>
+              </Card>
             </div>
 
-            <div className="space-y-4">
-              {webhooks.map((webhook) => (
-                <Card key={webhook.id}>
-                  <CardHeader className="pb-2">
-                    <div className="flex justify-between items-start">
+            {/* 可选参数部分 */}
+            <div className="space-y-2">
+              <h2 className="text-base font-medium">可选参数</h2>
+              <Card className="overflow-hidden border-gray-200">
+                <CardContent className="p-3">
+                  <div className="space-y-3">
+                    <div className="flex items-center justify-between">
                       <div>
-                        <CardTitle>{webhook.name}</CardTitle>
-                        <CardDescription>创建于 {webhook.createdAt}</CardDescription>
-                      </div>
-                      <div className="flex items-center space-x-2">
-                        <div className="flex items-center space-x-2">
-                          <Switch
-                            checked={webhook.status === "active"}
-                            onCheckedChange={() => toggleWebhookStatus(webhook.id)}
-                          />
-                          <span className="text-sm text-gray-500">{webhook.status === "active" ? "启用" : "禁用"}</span>
-                        </div>
-                        <Button
-                          variant="ghost"
-                          size="icon"
-                          className="text-red-500 hover:text-red-700 hover:bg-red-50"
-                          onClick={() => handleDeleteWebhook(webhook.id)}
-                        >
-                          <Trash2 className="w-4 h-4" />
-                        </Button>
+                        <span className="font-medium text-gray-600">source</span>
+                        <span className="text-sm text-gray-500 ml-2">(来源)</span>
                       </div>
+                      <span className="text-xs bg-gray-100 text-gray-700 px-2 py-1 rounded">字符串</span>
                     </div>
-                  </CardHeader>
-                  <CardContent>
-                    <div className="space-y-2">
-                      <div className="flex items-center space-x-2">
-                        <Input value={webhook.url} readOnly className="font-mono text-sm" />
-                        <Button
-                          variant="outline"
-                          size="icon"
-                          onClick={() => {
-                            navigator.clipboard.writeText(webhook.url)
-                            toast({
-                              title: "已复制",
-                              description: "Webhook URL已复制到剪贴板",
-                              variant: "success",
-                            })
-                          }}
-                        >
-                          <Copy className="h-4 w-4" />
-                        </Button>
+                    <div className="flex items-center justify-between">
+                      <div>
+                        <span className="font-medium text-gray-600">remark</span>
+                        <span className="text-sm text-gray-500 ml-2">(备注)</span>
                       </div>
-                      <div className="flex flex-wrap gap-2 mt-2">
-                        {webhook.events.map((event) => (
-                          <span key={event} className="px-2 py-1 bg-blue-100 text-blue-800 rounded-full text-xs">
-                            {event}
-                          </span>
-                        ))}
-                      </div>
-                      {webhook.lastTriggered && (
-                        <p className="text-sm text-gray-500">上次触发: {webhook.lastTriggered}</p>
-                      )}
+                      <span className="text-xs bg-gray-100 text-gray-700 px-2 py-1 rounded">字符串</span>
                     </div>
-                  </CardContent>
-                </Card>
-              ))}
+                    <div className="flex items-center justify-between">
+                      <div>
+                        <span className="font-medium text-gray-600">tags</span>
+                        <span className="text-sm text-gray-500 ml-2">(标签)</span>
+                      </div>
+                      <span className="text-xs bg-gray-100 text-gray-700 px-2 py-1 rounded">数组</span>
+                    </div>
+                  </div>
+                </CardContent>
+              </Card>
+            </div>
 
-              {webhooks.length === 0 && (
-                <div className="text-center py-8 bg-white rounded-lg shadow-sm">
-                  <p className="text-gray-500">暂无Webhook</p>
-                </div>
-              )}
+            {/* 示例代码部分 */}
+            <div className="space-y-2">
+              <h2 className="text-base font-medium">请求示例</h2>
+              <Card className="overflow-hidden border-gray-200">
+                <CardContent className="p-3">
+                  <pre className="text-xs bg-gray-50 p-2 rounded border border-gray-200 overflow-x-auto">
+                    {`POST ${apiUrl}
+Content-Type: application/json
+Authorization: Bearer ${apiKey}
+
+{
+  "name": "张三",
+  "phone": "13800138000",
+  "source": "官网",
+  "remark": "有意向",
+  "tags": ["高意向", "新客户"]
+}`}
+                  </pre>
+                </CardContent>
+              </Card>
             </div>
           </TabsContent>
         </Tabs>
       </div>
 
-      {/* 创建API密钥对话框 */}
-      <Dialog open={showNewApiKeyDialog} onOpenChange={setShowNewApiKeyDialog}>
+      {/* 接口文档对话框 */}
+      <Dialog open={showDocDialog} onOpenChange={setShowDocDialog}>
         <DialogContent className="sm:max-w-md">
           <DialogHeader>
-            <DialogTitle>创建新API密钥</DialogTitle>
-            <DialogDescription>创建一个新的API密钥用于访问{channelName}获客接口</DialogDescription>
+            <DialogTitle>接口文档</DialogTitle>
+            <DialogDescription>查看详细的接口文档与集成指南</DialogDescription>
           </DialogHeader>
 
           <div className="space-y-4 py-4">
             <div className="space-y-2">
-              <Label htmlFor="api-key-name">API密钥名称</Label>
-              <Input
-                id="api-key-name"
-                placeholder="例如：获客系统集成"
-                value={newApiKeyName}
-                onChange={(e) => setNewApiKeyName(e.target.value)}
-              />
+              <h3 className="font-medium">接口说明</h3>
+              <p className="text-sm text-gray-600">
+                本接口用于向{channelName}获客计划添加新的客户信息。通过HTTP POST请求发送客户数据。
+              </p>
+            </div>
+
+            <div className="space-y-2">
+              <h3 className="font-medium">请求格式</h3>
+              <pre className="text-xs bg-gray-50 p-3 rounded border overflow-x-auto">
+                POST {apiUrl}
+                <br />
+                Content-Type: application/json
+                <br />
+                Authorization: Bearer {apiKey}
+                <br />
+                <br />
+                {`{
+  "name": "客户姓名",
+  "phone": "13800138000",
+  "source": "广告投放",
+  "remark": "有意向购买",
+  "tags": ["高意向", "新客户"]
+}`}
+              </pre>
+            </div>
+
+            <div className="space-y-2">
+              <h3 className="font-medium">响应格式</h3>
+              <pre className="text-xs bg-gray-50 p-3 rounded border overflow-x-auto">
+                {`{
+  "success": true,
+  "message": "客户添加成功",
+  "data": {
+    "id": "cust_123456",
+    "name": "客户姓名",
+    "phone": "13800138000",
+    "created_at": "2024-03-21T09:15:22Z"
+  }
+}`}
+              </pre>
             </div>
           </div>
 
           <DialogFooter>
-            <Button variant="outline" onClick={() => setShowNewApiKeyDialog(false)}>
-              取消
-            </Button>
-            <Button onClick={handleCreateApiKey}>创建</Button>
+            <Button onClick={() => setShowDocDialog(false)}>关闭</Button>
           </DialogFooter>
         </DialogContent>
       </Dialog>
 
-      {/* 创建Webhook对话框 */}
-      <Dialog open={showNewWebhookDialog} onOpenChange={setShowNewWebhookDialog}>
+      {/* 快速测试对话框 */}
+      <Dialog open={showTestDialog} onOpenChange={setShowTestDialog}>
         <DialogContent className="sm:max-w-md">
           <DialogHeader>
-            <DialogTitle>创建新Webhook</DialogTitle>
-            <DialogDescription>创建一个新的Webhook用于接收{channelName}获客事件通知</DialogDescription>
+            <DialogTitle>快速测试</DialogTitle>
+            <DialogDescription>使用以下URL快速测试接口是否正常工作</DialogDescription>
           </DialogHeader>
 
           <div className="space-y-4 py-4">
             <div className="space-y-2">
-              <Label htmlFor="webhook-name">Webhook名称</Label>
-              <Input
-                id="webhook-name"
-                placeholder="例如：CRM系统集成"
-                value={newWebhookData.name}
-                onChange={(e) => setNewWebhookData({ ...newWebhookData, name: e.target.value })}
-              />
+              <h3 className="font-medium">测试URL</h3>
+              <pre className="text-xs bg-gray-50 p-3 rounded border overflow-x-auto whitespace-pre-wrap break-all">
+                {testUrl}
+              </pre>
+              <p className="text-xs text-gray-500 mt-2">将上面的URL复制到浏览器中打开，测试接口是否返回成功响应。</p>
             </div>
 
-            <div className="space-y-2">
-              <Label htmlFor="webhook-url">Webhook URL</Label>
-              <Input
-                id="webhook-url"
-                placeholder="https://example.com/webhook"
-                value={newWebhookData.url}
-                onChange={(e) => setNewWebhookData({ ...newWebhookData, url: e.target.value })}
-              />
-            </div>
-
-            <div className="space-y-2">
-              <Label>事件类型</Label>
-              <div className="grid grid-cols-1 gap-2">
-                {["customer.created", "customer.updated", "tag.added", "tag.removed"].map((event) => (
-                  <div key={event} className="flex items-center space-x-2">
-                    <Switch
-                      checked={newWebhookData.events.includes(event)}
-                      onCheckedChange={(checked) => {
-                        if (checked) {
-                          setNewWebhookData({
-                            ...newWebhookData,
-                            events: [...newWebhookData.events, event],
-                          })
-                        } else {
-                          setNewWebhookData({
-                            ...newWebhookData,
-                            events: newWebhookData.events.filter((e) => e !== event),
-                          })
-                        }
-                      }}
-                    />
-                    <span>{event}</span>
-                  </div>
-                ))}
-              </div>
-            </div>
+            <Button
+              className="w-full"
+              onClick={() => {
+                navigator.clipboard.writeText(testUrl)
+                toast({
+                  title: "已复制",
+                  description: "测试URL已复制到剪贴板",
+                })
+              }}
+            >
+              <Copy className="h-4 w-4 mr-2" />
+              复制测试链接
+            </Button>
           </div>
 
           <DialogFooter>
-            <Button variant="outline" onClick={() => setShowNewWebhookDialog(false)}>
-              取消
+            <Button variant="outline" onClick={() => setShowTestDialog(false)}>
+              关闭
             </Button>
-            <Button onClick={handleCreateWebhook}>创建</Button>
           </DialogFooter>
         </DialogContent>
       </Dialog>
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/devices/loading.tsx b/Cunkebao/app/scenarios/[channel]/devices/loading.tsx
index cec067bd..f15322a8 100644
--- a/Cunkebao/app/scenarios/[channel]/devices/loading.tsx
+++ b/Cunkebao/app/scenarios/[channel]/devices/loading.tsx
@@ -1,4 +1,3 @@
 export default function Loading() {
   return null
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/devices/page.tsx b/Cunkebao/app/scenarios/[channel]/devices/page.tsx
index acdd3a15..735bce48 100644
--- a/Cunkebao/app/scenarios/[channel]/devices/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/devices/page.tsx
@@ -1,26 +1,14 @@
 "use client"
 
-import { useState, useEffect } from "react"
+import { useState } from "react"
 import { useRouter } from "next/navigation"
-import { Card } from "@/components/ui/card"
+import { DeviceSelector } from "@/app/components/common/DeviceSelector"
 import { Button } from "@/components/ui/button"
-import { Input } from "@/components/ui/input"
-import { ChevronLeft, Filter, Search, RefreshCw } from "lucide-react"
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
-import { Badge } from "@/components/ui/badge"
-import { Checkbox } from "@/components/ui/checkbox"
-import { toast } from "@/components/ui/use-toast"
-import type { Device } from "@/types/device"
+import { ChevronLeft } from "lucide-react"
 
 export default function ScenarioDevicesPage({ params }: { params: { channel: string } }) {
   const router = useRouter()
-  const [devices, setDevices] = useState<Device[]>([])
-  const [searchQuery, setSearchQuery] = useState("")
-  const [statusFilter, setStatusFilter] = useState("all")
-  const [currentPage, setCurrentPage] = useState(1)
   const [selectedDevices, setSelectedDevices] = useState<string[]>([])
-  const devicesPerPage = 10
-  const maxDevices = 5
 
   // 获取渠道中文名称
   const getChannelName = (channel: string) => {
@@ -29,96 +17,29 @@ export default function ScenarioDevicesPage({ params }: { params: { channel: str
       kuaishou: "快手",
       xiaohongshu: "小红书",
       weibo: "微博",
+      haibao: "海报",
+      phone: "电话",
+      order: "订单",
+      weixinqun: "微信群",
+      gongzhonghao: "公众号",
+      payment: "付款码",
+      api: "API",
     }
     return channelMap[channel] || channel
   }
 
   const channelName = getChannelName(params.channel)
 
-  useEffect(() => {
-    // 模拟API调用
-    const fetchDevices = async () => {
-      const mockDevices = Array.from({ length: 15 }, (_, i) => ({
-        id: `device-${i + 1}`,
-        imei: `sd${123123 + i}`,
-        name: `设备 ${i + 1}`,
-        remark: `${channelName}获客设备 ${i + 1}`,
-        status: Math.random() > 0.2 ? "online" : "offline",
-        battery: Math.floor(Math.random() * 100),
-        wechatId: `wxid_${Math.random().toString(36).substr(2, 8)}`,
-        friendCount: Math.floor(Math.random() * 1000),
-        todayAdded: Math.floor(Math.random() * 50),
-        messageCount: Math.floor(Math.random() * 200),
-        lastActive: new Date(Date.now() - Math.random() * 86400000).toLocaleString(),
-        addFriendStatus: Math.random() > 0.2 ? "normal" : "abnormal",
-      }))
-      setDevices(mockDevices)
-    }
-
-    fetchDevices()
-  }, [channelName])
-
-  const handleRefresh = () => {
-    toast({
-      title: "刷新成功",
-      description: "设备列表已更新",
-    })
-  }
-
-  const handleSelectAll = () => {
-    if (selectedDevices.length === devices.length || selectedDevices.length === maxDevices) {
-      setSelectedDevices([])
-    } else {
-      const newSelection = devices.slice(0, maxDevices).map((d) => d.id)
-      setSelectedDevices(newSelection)
-    }
-  }
-
-  const handleDeviceSelect = (deviceId: string) => {
-    if (selectedDevices.includes(deviceId)) {
-      setSelectedDevices(selectedDevices.filter((id) => id !== deviceId))
-    } else {
-      if (selectedDevices.length >= maxDevices) {
-        toast({
-          title: "选择超出限制",
-          description: `最多可选择${maxDevices}个设备`,
-          variant: "destructive",
-        })
-        return
-      }
-      setSelectedDevices([...selectedDevices, deviceId])
-    }
-  }
-
   const handleSave = async () => {
     try {
       // 这里应该是实际的API调用来保存选中的设备
       await new Promise((resolve) => setTimeout(resolve, 1000))
-      toast({
-        title: "保存成功",
-        description: "已更新计划设备",
-      })
       router.back()
     } catch (error) {
-      toast({
-        title: "保存失败",
-        description: "更新设备失败，请重试",
-        variant: "destructive",
-      })
+      console.error("保存失败:", error)
     }
   }
 
-  const filteredDevices = devices.filter((device) => {
-    const matchesSearch =
-      device.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
-      device.imei.toLowerCase().includes(searchQuery.toLowerCase()) ||
-      device.wechatId.toLowerCase().includes(searchQuery.toLowerCase())
-    const matchesStatus = statusFilter === "all" || device.status === statusFilter
-    return matchesSearch && matchesStatus
-  })
-
-  const paginatedDevices = filteredDevices.slice((currentPage - 1) * devicesPerPage, currentPage * devicesPerPage)
-
   return (
     <div className="flex-1 bg-gray-50 min-h-screen">
       <header className="sticky top-0 z-10 bg-white/80 backdrop-blur-sm border-b">
@@ -127,129 +48,20 @@ export default function ScenarioDevicesPage({ params }: { params: { channel: str
             <Button variant="ghost" size="icon" onClick={() => router.back()}>
               <ChevronLeft className="h-5 w-5" />
             </Button>
-            <h1 className="text-xl font-semibold text-blue-600">{channelName}设备</h1>
+            <h1 className="text-xl font-semibold text-blue-600">{channelName}设备选择</h1>
           </div>
         </div>
       </header>
 
-      <div className="p-4 space-y-4">
-        <Card className="p-4">
-          <div className="space-y-3">
-            <div className="flex items-center space-x-2">
-              <div className="relative flex-1">
-                <Search className="absolute left-3 top-2.5 h-4 w-4 text-gray-400" />
-                <Input
-                  placeholder="搜索设备IMEI/备注"
-                  value={searchQuery}
-                  onChange={(e) => setSearchQuery(e.target.value)}
-                  className="pl-9"
-                />
-              </div>
-              <Button variant="outline" size="icon">
-                <Filter className="h-4 w-4" />
-              </Button>
-              <Button variant="outline" size="icon" onClick={handleRefresh}>
-                <RefreshCw className="h-4 w-4" />
-              </Button>
-            </div>
-
-            <div className="flex items-center justify-between">
-              <div className="flex items-center space-x-4">
-                <Select value={statusFilter} onValueChange={setStatusFilter}>
-                  <SelectTrigger className="w-[120px]">
-                    <SelectValue placeholder="全部状态" />
-                  </SelectTrigger>
-                  <SelectContent>
-                    <SelectItem value="all">全部状态</SelectItem>
-                    <SelectItem value="online">在线</SelectItem>
-                    <SelectItem value="offline">离线</SelectItem>
-                  </SelectContent>
-                </Select>
-              </div>
-              <div className="text-sm text-gray-500">
-                已选择 {selectedDevices.length}/{maxDevices} 个设备
-              </div>
-            </div>
-
-            <div className="flex items-center space-x-2">
-              <Checkbox
-                checked={
-                  selectedDevices.length > 0 &&
-                  (selectedDevices.length === devices.length || selectedDevices.length === maxDevices)
-                }
-                onCheckedChange={handleSelectAll}
-              />
-              <span className="text-sm">全选</span>
-            </div>
-
-            <div className="space-y-2">
-              {paginatedDevices.length === 0 ? (
-                <div className="text-center py-8 text-gray-500">暂无设备</div>
-              ) : (
-                paginatedDevices.map((device) => (
-                  <Card
-                    key={device.id}
-                    className={`p-3 hover:shadow-md transition-shadow cursor-pointer ${
-                      selectedDevices.includes(device.id) ? "ring-2 ring-primary" : ""
-                    }`}
-                    onClick={() => handleDeviceSelect(device.id)}
-                  >
-                    <div className="flex items-center space-x-3">
-                      <Checkbox
-                        checked={selectedDevices.includes(device.id)}
-                        className="mt-1"
-                        onClick={(e) => {
-                          e.stopPropagation()
-                          handleDeviceSelect(device.id)
-                        }}
-                      />
-                      <div className="flex-1 min-w-0">
-                        <div className="flex items-center justify-between mb-1">
-                          <div className="font-medium truncate">{device.name}</div>
-                          <Badge variant={device.status === "online" ? "success" : "secondary"}>
-                            {device.status === "online" ? "在线" : "离线"}
-                          </Badge>
-                        </div>
-                        <div className="text-sm text-gray-500">IMEI: {device.imei}</div>
-                        <div className="text-sm text-gray-500">微信号: {device.wechatId}</div>
-                        <div className="flex items-center justify-between mt-1 text-sm">
-                          <span className="text-gray-500">好友数: {device.friendCount}</span>
-                          <span className="text-gray-500">今日新增: +{device.todayAdded}</span>
-                        </div>
-                      </div>
-                    </div>
-                  </Card>
-                ))
-              )}
-            </div>
-
-            {filteredDevices.length > devicesPerPage && (
-              <div className="flex justify-between items-center pt-2">
-                <Button
-                  variant="outline"
-                  size="sm"
-                  onClick={() => setCurrentPage((prev) => Math.max(1, prev - 1))}
-                  disabled={currentPage === 1}
-                >
-                  上一页
-                </Button>
-                <span className="text-sm text-gray-500">
-                  第 {currentPage} / {Math.ceil(filteredDevices.length / devicesPerPage)} 页
-                </span>
-                <Button
-                  variant="outline"
-                  size="sm"
-                  onClick={() =>
-                    setCurrentPage((prev) => Math.min(Math.ceil(filteredDevices.length / devicesPerPage), prev + 1))
-                  }
-                  disabled={currentPage === Math.ceil(filteredDevices.length / devicesPerPage)}
-                >
-                  下一页
-                </Button>
-              </div>
-            )}
-          </div>
-        </Card>
+      <div className="p-4">
+        <DeviceSelector
+          title={`${channelName}设备选择`}
+          selectedDevices={selectedDevices}
+          onDevicesChange={setSelectedDevices}
+          multiple={true}
+          maxSelection={5}
+          className="mb-4"
+        />
 
         <div className="fixed bottom-0 left-0 right-0 bg-white p-4 border-t flex justify-end space-x-2">
           <Button variant="outline" onClick={() => router.back()}>
@@ -263,4 +75,3 @@ export default function ScenarioDevicesPage({ params }: { params: { channel: str
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/edit/[id]/page.tsx b/Cunkebao/app/scenarios/[channel]/edit/[id]/page.tsx
index 84505a9d..400b4418 100644
--- a/Cunkebao/app/scenarios/[channel]/edit/[id]/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/edit/[id]/page.tsx
@@ -238,4 +238,3 @@ export default function EditAcquisitionPlan({ params }: { params: { channel: str
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/page.tsx b/Cunkebao/app/scenarios/[channel]/page.tsx
index 5126be5b..a4306a44 100644
--- a/Cunkebao/app/scenarios/[channel]/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/page.tsx
@@ -1,7 +1,7 @@
 "use client"
 
-import { useState, useEffect, useRef } from "react"
-import { ChevronLeft, Copy, Link, HelpCircle } from "lucide-react"
+import { use, useState } from "react"
+import { Copy, Link, HelpCircle, Shield, ChevronLeft, Plus } from "lucide-react"
 import { Button } from "@/components/ui/button"
 import { useRouter } from "next/navigation"
 import { toast } from "@/components/ui/use-toast"
@@ -26,6 +26,7 @@ const getChannelName = (channel: string) => {
     xiaohongshu: "小红书",
     weibo: "微博",
     haibao: "海报",
+    poster: "海报",
     phone: "电话",
     gongzhonghao: "公众号",
     weixinqun: "微信群",
@@ -35,7 +36,6 @@ const getChannelName = (channel: string) => {
   return channelMap[channel] || channel
 }
 
-// 恢复Task接口定义
 interface Task {
   id: string
   name: string
@@ -51,21 +51,6 @@ interface Task {
   trend: { date: string; customers: number }[]
 }
 
-interface PlanItem {
-  id: number;
-  name: string;
-  status: number;
-  statusText: string;
-  createTime: number;
-  createTimeFormat: string;
-  deviceCount: number;
-  customerCount: number;
-  addedCount: number;
-  passRate: number;
-  lastExecutionTime: string;
-  nextExecutionTime: string;
-}
-
 interface DeviceStats {
   active: number
 }
@@ -88,50 +73,23 @@ function ApiDocumentationTooltip() {
   )
 }
 
-export default function ChannelPage({ params }: { params: { channel: string } }) {
+// export default function ChannelPage({ params }: { params: { channel: string } }) {
+  export default function ChannelPage({ params }: { params: Promise<{ channel: string }> }) {
   const router = useRouter()
-  const channel = params.channel
-  const channelName = getChannelName(params.channel)
-  
-  // 从URL query参数获取场景ID
-  const [sceneId, setSceneId] = useState<number | null>(null);
-  // 使用ref追踪sceneId值，避免重复请求
-  const sceneIdRef = useRef<number | null>(null);
-  // 追踪组件是否已挂载
-  const isMounted = useRef(true);
-  
-  // 组件卸载时更新挂载状态
-  useEffect(() => {
-    return () => {
-      isMounted.current = false;
-    };
-  }, []);
-  
-  // 获取URL中的查询参数
-  useEffect(() => {
-    // 组件未挂载，不执行操作
-    if (!isMounted.current) return;
-    
-    // 从URL获取id参数
-    const urlParams = new URLSearchParams(window.location.search);
-    const idParam = urlParams.get('id');
-    
-    if (idParam && !isNaN(Number(idParam))) {
-      setSceneId(Number(idParam));
-      sceneIdRef.current = Number(idParam);
-    } else {
-      // 如果没有传递有效的ID，使用函数获取默认ID
-      const defaultId = getSceneIdFromChannel(channel);
-      setSceneId(defaultId);
-      sceneIdRef.current = defaultId;
-    }
-  }, [channel]);
+  // const unwrappedParams = use(params)
+  const resolvedParams = use(params)
+  // const channel = params.channel
+  // const channelName = getChannelName(params.channel)
+  // const channel = unwrappedParams.channel
+  // const channelName = getChannelName(unwrappedParams.channel)
+  const channel = resolvedParams.channel
+  const channelName = getChannelName(resolvedParams.channel)
 
-  const initialTasks = [
+  const initialTasks: Task[] = [
     {
       id: "1",
       name: `${channelName}直播获客计划`,
-      status: "running" as const,
+      status: "running",
       stats: {
         devices: 5,
         acquired: 31,
@@ -148,7 +106,7 @@ export default function ChannelPage({ params }: { params: { channel: string } })
     {
       id: "2",
       name: `${channelName}评论区获客计划`,
-      status: "paused" as const,
+      status: "paused",
       stats: {
         devices: 3,
         acquired: 15,
@@ -162,11 +120,9 @@ export default function ChannelPage({ params }: { params: { channel: string } })
         customers: Math.floor(Math.random() * 20) + 20,
       })),
     },
-  ] as Task[];
+  ]
 
-  const [tasks, setTasks] = useState<Task[]>([])
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<string | null>(null)
+  const [tasks, setTasks] = useState<Task[]>(initialTasks)
 
   const [deviceStats, setDeviceStats] = useState<DeviceStats>({
     active: 5,
@@ -248,146 +204,54 @@ export default function ChannelPage({ params }: { params: { channel: string } })
     })
   }
 
-  // 修改API数据处理部分
-  useEffect(() => {
-    // 组件未挂载，不执行操作
-    if (!isMounted.current) return;
-    
-    // 防止重复请求：如果sceneId没有变化且已经加载过数据，则不重新请求
-    if (sceneId === sceneIdRef.current && tasks.length > 0 && !loading) {
-      return;
-    }
-    
-    const fetchPlanList = async () => {
-      try {
-        setLoading(true);
-        // 如果sceneId还未确定，则等待
-        if (sceneId === null) return;
-        
-        // 调用API获取计划列表
-        const response = await fetch(
-          `${process.env.NEXT_PUBLIC_API_BASE_URL}/v1/plan/list?id=${sceneId}`, 
-          {
-            method: 'GET',
-            headers: {
-              'Content-Type': 'application/json',
-              'Authorization': `Bearer ${localStorage.getItem('token')}`
-            }
-          }
-        );
-
-        const data = await response.json();
-        
-        if (data.code === 1 && data.data && data.data.list) {
-          // 将API返回的数据转换为前端展示格式
-          const transformedTasks = data.data.list.map((item: PlanItem) => {
-            // 确保返回的对象完全符合Task类型
-            const status: "running" | "paused" | "completed" = 
-              item.status === 1 ? "running" : "paused";
-            
-            return {
-              id: item.id.toString(),
-              name: item.name,
-              status: status,
-              stats: {
-                devices: item.deviceCount,
-                acquired: item.customerCount,
-                added: item.addedCount,
-              },
-              lastUpdated: item.createTimeFormat,
-              executionTime: item.lastExecutionTime || "--",
-              nextExecutionTime: item.nextExecutionTime || "--",
-              trend: Array.from({ length: 7 }, (_, i) => ({
-                date: `2月${String(i + 1)}日`,
-                customers: Math.floor(Math.random() * 20) + 10, // 模拟数据
-              })),
-            };
-          });
-          
-          // 使用类型断言解决类型冲突
-          setTasks(transformedTasks as Task[]);
-          setError(null);
-        } else {
-          setError(data.msg || "获取计划列表失败");
-          // 如果API返回错误，使用初始数据
-          setTasks(initialTasks);
-        }
-      } catch (err) {
-        console.error("获取计划列表失败:", err);
-        setError("网络错误，无法获取计划列表");
-        // 出错时使用初始数据
-        setTasks(initialTasks);
-      } finally {
-        setLoading(false);
-      }
-    };
-    
-    fetchPlanList();
-  }, [sceneId]); // 只依赖sceneId变化触发请求
-
-  // 辅助函数：根据渠道获取场景ID
-  const getSceneIdFromChannel = (channel: string): number => {
-    const channelMap: Record<string, number> = {
-      'douyin': 1,
-      'xiaohongshu': 2,
-      'weixinqun': 3,
-      'gongzhonghao': 4,
-      'kuaishou': 5,
-      'weibo': 6,
-      'haibao': 7,
-      'phone': 8,
-      'api': 9
-    };
-    return channelMap[channel] || 6;
-  };
+  const handleCreateNewPlan = () => {
+    // router.push(`/plans/new?type=${channel}`)
+    router.push(`/scenarios/new?type=${channel}`)
+  }
 
   return (
     <div className="flex-1 bg-gradient-to-b from-blue-50 to-white min-h-screen">
       <header className="sticky top-0 z-10 bg-white/80 backdrop-blur-sm border-b">
-        <div className="flex items-center p-4">
-          <div className="flex items-center space-x-3">
-            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+        <div className="flex items-center justify-between p-4">
+          <div className="flex items-center gap-3">
+            <Button variant="ghost" size="icon" onClick={() => router.push("/scenarios")} className="h-8 w-8">
               <ChevronLeft className="h-5 w-5" />
             </Button>
             <h1 className="text-xl font-semibold text-blue-600">{channelName}获客</h1>
           </div>
+          <Button onClick={handleCreateNewPlan} size="sm" className="bg-blue-600 hover:bg-blue-700 text-white">
+            <Plus className="h-4 w-4 mr-1" />
+            新建{channelName}计划
+          </Button>
         </div>
       </header>
 
-      <div className="p-4 max-w-7xl mx-auto">
-        {loading ? (
-          // 添加加载状态
-          <div className="text-center py-12 bg-white rounded-lg shadow-sm">
-            <div className="w-8 h-8 border-2 border-blue-600 border-t-transparent rounded-full animate-spin mx-auto mb-4"></div>
-            <div className="text-gray-500">加载计划中...</div>
-          </div>
-        ) : error ? (
-          // 添加错误提示
-          <div className="text-center py-12 bg-white rounded-lg shadow-sm">
-            <div className="text-red-500 mb-4">{error}</div>
-            <Button variant="outline" onClick={() => window.location.reload()}>
-              重新加载
-            </Button>
-          </div>
-        ) : tasks.length > 0 ? (
-          tasks.map((task) => (
-            <div key={task.id} className="mb-6">
-              <ScenarioAcquisitionCard
-                task={task}
-                channel={channel}
-                onEdit={() => handleEditPlan(task.id)}
-                onCopy={handleCopyPlan}
-                onDelete={handleDeletePlan}
-                onStatusChange={handleStatusChange}
-                onOpenSettings={handleOpenApiSettings}
-              />
+      <div className="p-4 md:p-6 lg:p-8 max-w-7xl mx-auto">
+        <div className="space-y-4">
+          {tasks.length > 0 ? (
+            tasks.map((task) => (
+              <div key={task.id}>
+                <ScenarioAcquisitionCard
+                  task={task}
+                  channel={channel}
+                  onEdit={() => handleEditPlan(task.id)}
+                  onCopy={handleCopyPlan}
+                  onDelete={handleDeletePlan}
+                  onStatusChange={handleStatusChange}
+                  onOpenSettings={handleOpenApiSettings}
+                />
+              </div>
+            ))
+          ) : (
+            <div className="text-center py-12 bg-white rounded-lg shadow-sm md:col-span-2 lg:col-span-3">
+              <div className="text-gray-400 mb-4">暂无获客计划</div>
+              <Button onClick={handleCreateNewPlan} className="bg-blue-600 hover:bg-blue-700 text-white">
+                <Plus className="h-4 w-4 mr-1" />
+                新建{channelName}计划
+              </Button>
             </div>
-          ))
-        ) : (
-          <div className="text-center py-12 bg-white rounded-lg shadow-sm">
-            <div className="text-gray-400 mb-4">暂无获客计划</div>
-          </div>
-        )}
+          )}
+        </div>
       </div>
       {/* API接口设置对话框 */}
       <Dialog open={showApiDialog} onOpenChange={setShowApiDialog}>
@@ -400,81 +264,163 @@ export default function ChannelPage({ params }: { params: { channel: string } })
             <DialogDescription>使用此接口直接导入客资到该获客计划，支持多种编程语言。</DialogDescription>
           </DialogHeader>
 
-          <div className="space-y-4 py-4">
+          <div className="space-y-5 py-4">
+            {/* API密钥部分 */}
             <div className="space-y-2">
-              <Label htmlFor="api-key">API密钥</Label>
+              <div className="flex items-center justify-between">
+                <Label htmlFor="api-key" className="text-sm font-medium flex items-center gap-1">
+                  API密钥
+                  <TooltipProvider>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
+                        <HelpCircle className="h-3.5 w-3.5 text-gray-400 cursor-help" />
+                      </TooltipTrigger>
+                      <TooltipContent className="max-w-xs">
+                        <p className="text-xs">API密钥用于身份验证，请妥善保管，不要在客户端代码中暴露它</p>
+                      </TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
+                </Label>
+                <span className="text-xs text-gray-500">用于接口身份验证</span>
+              </div>
               <div className="flex items-center space-x-2">
-                <Input id="api-key" value={currentApiSettings.apiKey} readOnly className="flex-1" />
-                <Button
-                  variant="outline"
-                  size="icon"
-                  onClick={() => {
-                    navigator.clipboard.writeText(currentApiSettings.apiKey)
-                    toast({
-                      title: "已复制",
-                      description: "API密钥已复制到剪贴板",
-                      variant: "default",
-                    })
-                  }}
-                >
-                  <Copy className="h-4 w-4" />
-                </Button>
+                <div className="relative flex-1">
+                  <Input
+                    id="api-key"
+                    value={currentApiSettings.apiKey}
+                    readOnly
+                    className="pr-10 font-mono text-sm bg-gray-50"
+                  />
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    className="absolute right-0 top-0 h-full"
+                    onClick={() => {
+                      navigator.clipboard.writeText(currentApiSettings.apiKey)
+                      toast({
+                        title: "已复制",
+                        description: "API密钥已复制到剪贴板",
+                        variant: "default",
+                      })
+                    }}
+                  >
+                    <Copy className="h-4 w-4" />
+                  </Button>
+                </div>
               </div>
             </div>
 
+            {/* 接口地址部分 */}
             <div className="space-y-2">
               <div className="flex items-center justify-between">
-                <Label htmlFor="webhook-url">接口地址</Label>
+                <Label htmlFor="webhook-url" className="text-sm font-medium">
+                  接口地址
+                </Label>
                 <button
-                  className="text-xs text-blue-600 hover:underline"
+                  className="text-xs text-blue-600 hover:underline flex items-center gap-1"
                   onClick={() => handleCopyApiUrl(currentApiSettings.webhookUrl, true)}
                 >
+                  <Copy className="h-3 w-3" />
                   复制（含示例参数）
                 </button>
               </div>
               <div className="flex items-center space-x-2">
-                <Input id="webhook-url" value={currentApiSettings.webhookUrl} readOnly className="flex-1" />
-                <Button variant="outline" size="icon" onClick={() => handleCopyApiUrl(currentApiSettings.webhookUrl)}>
-                  <Copy className="h-4 w-4" />
-                </Button>
+                <div className="relative flex-1">
+                  <Input
+                    id="webhook-url"
+                    value={currentApiSettings.webhookUrl}
+                    readOnly
+                    className="pr-10 font-mono text-sm bg-gray-50 text-gray-700"
+                  />
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    className="absolute right-0 top-0 h-full"
+                    onClick={() => handleCopyApiUrl(currentApiSettings.webhookUrl)}
+                  >
+                    <Copy className="h-4 w-4" />
+                  </Button>
+                </div>
+              </div>
+              <div className="bg-blue-50 p-2 rounded-md">
+                <p className="text-xs text-blue-700">
+                  <span className="font-medium">必要参数：</span>name（姓名）、phone（电话）
+                  <br />
+                  <span className="font-medium">可选参数：</span>source（来源）、remark（备注）、tags（标签）
+                </p>
               </div>
-              <p className="text-xs text-gray-500">支持GET/POST请求，必要参数：name（姓名）、phone（电话）</p>
             </div>
 
-            <div className="space-y-2">
-              <Label>接口文档</Label>
+            {/* 接口文档部分 */}
+            <div className="space-y-3 pt-2">
               <div className="flex items-center justify-between">
-                <Button
-                  className="w-full flex items-center justify-center gap-2"
-                  onClick={() => {
-                    window.open(`/api/docs/scenarios/${channel}/${currentApiSettings.taskId}`, "_blank")
-                  }}
-                >
-                  <Link className="h-4 w-4" />
-                  查看详细接口文档与集成指南
-                </Button>
+                <Label className="text-sm font-medium">接口文档</Label>
+              </div>
+              <div className="bg-gray-50 p-4 rounded-lg border border-gray-100">
+                <div className="flex flex-col space-y-3">
+                  <Button
+                    variant="outline"
+                    className="w-full flex items-center justify-center gap-2 bg-white"
+                    onClick={() => {
+                      window.open(`/api/docs/scenarios/${channel}/${currentApiSettings.taskId}`, "_blank")
+                    }}
+                  >
+                    <Link className="h-4 w-4" />
+                    查看详细接口文档与集成指南
+                  </Button>
+
+                  <div className="grid grid-cols-2 gap-2">
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      className="text-xs"
+                      onClick={() => {
+                        window.open(`/api/docs/scenarios/${channel}/${currentApiSettings.taskId}#examples`, "_blank")
+                      }}
+                    >
+                      <span className="text-blue-600">查看代码示例</span>
+                    </Button>
+
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      className="text-xs"
+                      onClick={() => {
+                        window.open(`/api/docs/scenarios/${channel}/${currentApiSettings.taskId}#integration`, "_blank")
+                      }}
+                    >
+                      <span className="text-blue-600">查看集成指南</span>
+                    </Button>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            {/* 快速测试部分 */}
+            <div className="space-y-2 pt-1">
+              <div className="flex items-center justify-between">
+                <Label className="text-sm font-medium">快速测试</Label>
+              </div>
+              <div className="bg-gray-50 p-3 rounded-md border border-gray-100">
+                <p className="text-xs text-gray-600 mb-2">使用以下URL可以快速测试接口是否正常工作：</p>
+                <div className="text-xs font-mono bg-white p-2 rounded border border-gray-200 overflow-x-auto">
+                  {`${currentApiSettings.webhookUrl}?name=测试客户&phone=13800138000`}
+                </div>
               </div>
-              <p className="text-xs text-gray-500 text-center">
-                <a
-                  href={`/api/docs/scenarios/${channel}/${currentApiSettings.taskId}#examples`}
-                  target="_blank"
-                  className="text-blue-600 hover:underline"
-                  rel="noreferrer"
-                >
-                  查看Python、Java等多语言示例代码
-                </a>
-              </p>
             </div>
           </div>
 
-          <DialogFooter>
-            <Button variant="outline" onClick={() => setShowApiDialog(false)}>
-              关闭
-            </Button>
+          <DialogFooter className="flex justify-between items-center">
+            <div className="text-xs text-gray-500">
+              <span className="inline-flex items-center">
+                <Shield className="h-3 w-3 mr-1" />
+                接口安全加密传输
+              </span>
+            </div>
+            <Button onClick={() => setShowApiDialog(false)}>关闭</Button>
           </DialogFooter>
         </DialogContent>
       </Dialog>
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/traffic/loading.tsx b/Cunkebao/app/scenarios/[channel]/traffic/loading.tsx
index cec067bd..f15322a8 100644
--- a/Cunkebao/app/scenarios/[channel]/traffic/loading.tsx
+++ b/Cunkebao/app/scenarios/[channel]/traffic/loading.tsx
@@ -1,4 +1,3 @@
 export default function Loading() {
   return null
 }
-
diff --git a/Cunkebao/app/scenarios/[channel]/traffic/page.tsx b/Cunkebao/app/scenarios/[channel]/traffic/page.tsx
index 0bd3e9ac..772d74d2 100644
--- a/Cunkebao/app/scenarios/[channel]/traffic/page.tsx
+++ b/Cunkebao/app/scenarios/[channel]/traffic/page.tsx
@@ -233,4 +233,3 @@ export default function ChannelTrafficPage({
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/api/page.tsx b/Cunkebao/app/scenarios/api/page.tsx
index baac75a6..42249d61 100644
--- a/Cunkebao/app/scenarios/api/page.tsx
+++ b/Cunkebao/app/scenarios/api/page.tsx
@@ -1,7 +1,7 @@
 "use client"
 
 import { useState } from "react"
-import { Plus, Filter, Search, RefreshCw, MoreVertical, Clock, Copy, Code } from "lucide-react"
+import { Plus, Filter, Search, RefreshCw, MoreVertical, Clock, Copy, Code } from 'lucide-react'
 import { Card } from "@/components/ui/card"
 import { Button } from "@/components/ui/button"
 import { Input } from "@/components/ui/input"
@@ -130,7 +130,7 @@ export default function ApiPage() {
         <div className="flex items-center justify-between p-4">
           <h1 className="text-xl font-semibold text-violet-600">API获客</h1>
           <div className="flex items-center space-x-2">
-            <Link href="/scenarios/api/new">
+            <Link href="/scenarios/new">
               <Button className="bg-violet-600 hover:bg-violet-700">
                 <Plus className="h-4 w-4 mr-2" />
                 新建计划
@@ -371,4 +371,3 @@ export default function ApiPage() {
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/api/route.ts b/Cunkebao/app/scenarios/api/route.ts
new file mode 100644
index 00000000..3f90a660
--- /dev/null
+++ b/Cunkebao/app/scenarios/api/route.ts
@@ -0,0 +1,5 @@
+import { NextResponse } from "next/server"
+
+export async function GET(request: Request) {
+  return NextResponse.json({ message: "场景获客API" })
+}
diff --git a/Cunkebao/app/scenarios/douyin/page.tsx b/Cunkebao/app/scenarios/douyin/page.tsx
index f78a3e69..36c77575 100644
--- a/Cunkebao/app/scenarios/douyin/page.tsx
+++ b/Cunkebao/app/scenarios/douyin/page.tsx
@@ -120,4 +120,3 @@ export default function DouyinAcquisitionPage() {
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/haibao/edit/[id]/page.tsx b/Cunkebao/app/scenarios/haibao/edit/[id]/page.tsx
new file mode 100644
index 00000000..70ff8955
--- /dev/null
+++ b/Cunkebao/app/scenarios/haibao/edit/[id]/page.tsx
@@ -0,0 +1,129 @@
+"use client"
+
+import { useState, useEffect } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card } from "@/components/ui/card"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
+import { toast } from "@/components/ui/use-toast"
+import BasicSettings from "@/app/scenarios/new/steps/BasicSettings"
+import DeviceSelection from "@/app/scenarios/new/steps/DeviceSelection"
+import MessageSettings from "@/app/scenarios/new/steps/MessageSettings"
+import BottomNav from "@/app/components/BottomNav"
+
+export default function EditScenarioPage({ params }: { params: { id: string } }) {
+  const router = useRouter()
+  const [activeTab, setActiveTab] = useState("basic")
+  const [isLoading, setIsLoading] = useState(true)
+  const [formData, setFormData] = useState({
+    name: "",
+    description: "",
+    type: "haibao",
+    status: "active",
+    enableMessage: true,
+    message: "",
+    delayTime: 0,
+    selectedDevices: [],
+  })
+
+  useEffect(() => {
+    // 模拟从API加载数据
+    setTimeout(() => {
+      setFormData({
+        name: "海报获客方案",
+        description: "通过海报二维码引流获客",
+        type: "haibao",
+        status: "active",
+        enableMessage: true,
+        message: "您好，感谢关注我们的产品！",
+        delayTime: 5,
+        selectedDevices: ["dev1", "dev2"],
+      })
+      setIsLoading(false)
+    }, 500)
+  }, [params.id])
+
+  const updateFormData = (field: string, value: any) => {
+    setFormData((prev) => ({
+      ...prev,
+      [field]: value,
+    }))
+  }
+
+  const handleSave = () => {
+    toast({
+      title: "保存成功",
+      description: "场景配置已更新",
+    })
+    router.push("/scenarios/haibao")
+  }
+
+  if (isLoading) {
+    return (
+      <div className="flex-1 flex items-center justify-center min-h-screen">
+        <div className="text-center">
+          <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-500 mx-auto"></div>
+          <p className="mt-4 text-gray-500">加载中...</p>
+        </div>
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex-1 bg-white min-h-screen pb-16">
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between p-4">
+          <div className="flex items-center space-x-3">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="text-lg font-medium">编辑海报获客方案</h1>
+          </div>
+          <Button onClick={handleSave}>保存</Button>
+        </div>
+      </header>
+
+      <div className="p-4 max-w-3xl mx-auto">
+        <Tabs value={activeTab} onValueChange={setActiveTab}>
+          <TabsList className="grid grid-cols-3 mb-6">
+            <TabsTrigger value="basic">基础设置</TabsTrigger>
+            <TabsTrigger value="device">设备选择</TabsTrigger>
+            <TabsTrigger value="message">消息设置</TabsTrigger>
+          </TabsList>
+
+          <Card className="p-4">
+            <TabsContent value="basic">
+              <BasicSettings
+                formData={formData}
+                updateFormData={updateFormData}
+                onNext={() => setActiveTab("device")}
+                onBack={() => router.back()}
+              />
+            </TabsContent>
+
+            <TabsContent value="device">
+              <DeviceSelection
+                formData={formData}
+                updateFormData={updateFormData}
+                onNext={() => setActiveTab("message")}
+                onBack={() => setActiveTab("basic")}
+              />
+            </TabsContent>
+
+            <TabsContent value="message">
+              <MessageSettings
+                formData={formData}
+                updateFormData={updateFormData}
+                onNext={handleSave}
+                onBack={() => setActiveTab("device")}
+              />
+            </TabsContent>
+          </Card>
+        </Tabs>
+      </div>
+
+      <BottomNav />
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/loading.tsx b/Cunkebao/app/scenarios/loading.tsx
new file mode 100644
index 00000000..f15322a8
--- /dev/null
+++ b/Cunkebao/app/scenarios/loading.tsx
@@ -0,0 +1,3 @@
+export default function Loading() {
+  return null
+}
diff --git a/Cunkebao/app/scenarios/new/loading.tsx b/Cunkebao/app/scenarios/new/loading.tsx
new file mode 100644
index 00000000..f15322a8
--- /dev/null
+++ b/Cunkebao/app/scenarios/new/loading.tsx
@@ -0,0 +1,3 @@
+export default function Loading() {
+  return null
+}
diff --git a/Cunkebao/app/scenarios/new/page.tsx b/Cunkebao/app/scenarios/new/page.tsx
new file mode 100644
index 00000000..f849d029
--- /dev/null
+++ b/Cunkebao/app/scenarios/new/page.tsx
@@ -0,0 +1,118 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Settings } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { toast } from "@/components/ui/use-toast"
+import { StepIndicator } from "@/app/components/ui-templates/step-indicator"
+import { BasicSettings } from "./steps/BasicSettings"
+import { FriendRequestSettings } from "./steps/FriendRequestSettings"
+import { MessageSettings } from "./steps/MessageSettings"
+
+// 步骤定义 - 只保留三个步骤
+const steps = [
+  { id: 1, title: "步骤一", subtitle: "基础设置" },
+  { id: 2, title: "步骤二", subtitle: "好友申请设置" },
+  { id: 3, title: "步骤三", subtitle: "消息设置" },
+]
+
+export default function NewPlan() {
+  const router = useRouter()
+  const [currentStep, setCurrentStep] = useState(1)
+  const [formData, setFormData] = useState({
+    planName: "",
+    scenario: "haibao",
+    posters: [],
+    device: "",
+    remarkType: "phone",
+    greeting: "你好，请通过",
+    addInterval: 1,
+    startTime: "09:00",
+    endTime: "18:00",
+    enabled: true,
+    // 移除tags字段
+  })
+
+  // 更新表单数据
+  const onChange = (data: any) => {
+    setFormData((prev) => ({ ...prev, ...data }))
+  }
+
+  // 处理保存
+  const handleSave = async () => {
+    try {
+      // 这里应该是实际的API调用
+      await new Promise((resolve) => setTimeout(resolve, 1000))
+
+      toast({
+        title: "创建成功",
+        description: "获客计划已创建",
+      })
+      // router.push("/plans")
+      router.push("/scenarios")
+    } catch (error) {
+      toast({
+        title: "创建失败",
+        description: "创建计划失败，请重试",
+        variant: "destructive",
+      })
+    }
+  }
+
+  // 下一步
+  const handleNext = () => {
+    if (currentStep === steps.length) {
+      handleSave()
+    } else {
+      setCurrentStep((prev) => prev + 1)
+    }
+  }
+
+  // 上一步
+  const handlePrev = () => {
+    setCurrentStep((prev) => Math.max(prev - 1, 1))
+  }
+
+  // 渲染当前步骤内容
+  const renderStepContent = () => {
+    switch (currentStep) {
+      case 1:
+        return <BasicSettings formData={formData} onChange={onChange} onNext={handleNext} />
+      case 2:
+        return <FriendRequestSettings formData={formData} onChange={onChange} onNext={handleNext} onPrev={handlePrev} />
+      case 3:
+        return <MessageSettings formData={formData} onChange={onChange} onNext={handleSave} onPrev={handlePrev} />
+      default:
+        return null
+    }
+  }
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <div className="max-w-[390px] mx-auto bg-white min-h-screen flex flex-col">
+        <header className="sticky top-0 z-10 bg-white border-b">
+          <div className="flex items-center justify-between h-14 px-4">
+            <div className="flex items-center">
+              <Button variant="ghost" size="icon" onClick={() => router.push("/plans")}>
+                <ChevronLeft className="h-5 w-5" />
+              </Button>
+              <h1 className="ml-2 text-lg font-medium">新建获客计划</h1>
+            </div>
+            <Button variant="ghost" size="icon">
+              <Settings className="h-5 w-5" />
+            </Button>
+          </div>
+        </header>
+
+        <div className="flex-1 flex flex-col">
+          <div className="px-4 py-6">
+            <StepIndicator steps={steps} currentStep={currentStep} />
+          </div>
+
+          <div className="flex-1 px-4 pb-20">{renderStepContent()}</div>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/new/steps/BasicSettings.tsx b/Cunkebao/app/scenarios/new/steps/BasicSettings.tsx
new file mode 100644
index 00000000..98657d6e
--- /dev/null
+++ b/Cunkebao/app/scenarios/new/steps/BasicSettings.tsx
@@ -0,0 +1,1081 @@
+"use client"
+
+import type React from "react"
+
+import { useState, useEffect } from "react"
+import { Card } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { Switch } from "@/components/ui/switch"
+import { QrCode, X, ChevronDown, Plus, Maximize2, Upload, Download, Settings, Minus } from "lucide-react"
+import { TooltipProvider } from "@/components/ui/tooltip"
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from "@/components/ui/table"
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter,
+  DialogDescription,
+} from "@/components/ui/dialog"
+
+// 调整场景顺序，确保API获客在最后，并且前三个是最常用的场景
+const scenarios = [
+  { id: "haibao", name: "海报获客", type: "material" },
+  { id: "order", name: "订单获客", type: "api" },
+  { id: "douyin", name: "抖音获客", type: "social" },
+  { id: "xiaohongshu", name: "小红书获客", type: "social" },
+  { id: "phone", name: "电话获客", type: "social" },
+  { id: "gongzhonghao", name: "公众号获客", type: "social" },
+  { id: "weixinqun", name: "微信群获客", type: "social" },
+  { id: "payment", name: "付款码获客", type: "material" },
+  { id: "api", name: "API获客", type: "api" }, // API获客放在最后
+]
+
+const phoneCallTags = [
+  { id: "tag-1", name: "咨询", color: "bg-blue-100 text-blue-800" },
+  { id: "tag-2", name: "投诉", color: "bg-red-100 text-red-800" },
+  { id: "tag-3", name: "合作", color: "bg-green-100 text-green-800" },
+  { id: "tag-4", name: "价格", color: "bg-orange-100 text-orange-800" },
+  { id: "tag-5", name: "售后", color: "bg-purple-100 text-purple-800" },
+  { id: "tag-6", name: "订单", color: "bg-yellow-100 text-yellow-800" },
+  { id: "tag-7", name: "物流", color: "bg-teal-100 text-teal-800" },
+]
+
+// 不同场景的预设标签
+const scenarioTags = {
+  haibao: [
+    { id: "poster-tag-1", name: "活动推广", color: "bg-blue-100 text-blue-800" },
+    { id: "poster-tag-2", name: "产品宣传", color: "bg-green-100 text-green-800" },
+    { id: "poster-tag-3", name: "品牌展示", color: "bg-purple-100 text-purple-800" },
+    { id: "poster-tag-4", name: "优惠促销", color: "bg-red-100 text-red-800" },
+    { id: "poster-tag-5", name: "新品发布", color: "bg-orange-100 text-orange-800" },
+  ],
+  order: [
+    { id: "order-tag-1", name: "新订单", color: "bg-green-100 text-green-800" },
+    { id: "order-tag-2", name: "复购客户", color: "bg-blue-100 text-blue-800" },
+    { id: "order-tag-3", name: "高价值订单", color: "bg-purple-100 text-purple-800" },
+    { id: "order-tag-4", name: "待付款", color: "bg-yellow-100 text-yellow-800" },
+    { id: "order-tag-5", name: "已完成", color: "bg-gray-100 text-gray-800" },
+  ],
+  douyin: [
+    { id: "douyin-tag-1", name: "短视频", color: "bg-pink-100 text-pink-800" },
+    { id: "douyin-tag-2", name: "直播", color: "bg-red-100 text-red-800" },
+    { id: "douyin-tag-3", name: "带货", color: "bg-orange-100 text-orange-800" },
+    { id: "douyin-tag-4", name: "粉丝互动", color: "bg-blue-100 text-blue-800" },
+    { id: "douyin-tag-5", name: "热门话题", color: "bg-purple-100 text-purple-800" },
+  ],
+  xiaohongshu: [
+    { id: "xhs-tag-1", name: "种草笔记", color: "bg-red-100 text-red-800" },
+    { id: "xhs-tag-2", name: "美妆", color: "bg-pink-100 text-pink-800" },
+    { id: "xhs-tag-3", name: "穿搭", color: "bg-purple-100 text-purple-800" },
+    { id: "xhs-tag-4", name: "生活方式", color: "bg-green-100 text-green-800" },
+    { id: "xhs-tag-5", name: "好物推荐", color: "bg-orange-100 text-orange-800" },
+  ],
+  phone: phoneCallTags,
+  gongzhonghao: [
+    { id: "gzh-tag-1", name: "文章推送", color: "bg-blue-100 text-blue-800" },
+    { id: "gzh-tag-2", name: "活动通知", color: "bg-green-100 text-green-800" },
+    { id: "gzh-tag-3", name: "产品介绍", color: "bg-purple-100 text-purple-800" },
+    { id: "gzh-tag-4", name: "用户服务", color: "bg-orange-100 text-orange-800" },
+    { id: "gzh-tag-5", name: "品牌故事", color: "bg-gray-100 text-gray-800" },
+  ],
+  weixinqun: [
+    { id: "wxq-tag-1", name: "群活动", color: "bg-green-100 text-green-800" },
+    { id: "wxq-tag-2", name: "产品分享", color: "bg-blue-100 text-blue-800" },
+    { id: "wxq-tag-3", name: "用户交流", color: "bg-purple-100 text-purple-800" },
+    { id: "wxq-tag-4", name: "优惠信息", color: "bg-pink-100 text-pink-800" },
+    { id: "wxq-tag-5", name: "答疑解惑", color: "bg-orange-100 text-orange-800" },
+    { id: "wxq-tag-6", name: "新人欢迎", color: "bg-yellow-100 text-yellow-800" },
+    { id: "wxq-tag-7", name: "群规通知", color: "bg-gray-100 text-gray-800" },
+    { id: "wxq-tag-8", name: "活跃互动", color: "bg-indigo-100 text-indigo-800" },
+  ],
+  payment: [
+    { id: "pay-tag-1", name: "扫码支付", color: "bg-green-100 text-green-800" },
+    { id: "pay-tag-2", name: "线下门店", color: "bg-blue-100 text-blue-800" },
+    { id: "pay-tag-3", name: "活动收款", color: "bg-purple-100 text-purple-800" },
+    { id: "pay-tag-4", name: "服务费用", color: "bg-orange-100 text-orange-800" },
+    { id: "pay-tag-5", name: "会员充值", color: "bg-yellow-100 text-yellow-800" },
+  ],
+  api: [
+    { id: "api-tag-1", name: "系统对接", color: "bg-blue-100 text-blue-800" },
+    { id: "api-tag-2", name: "数据同步", color: "bg-green-100 text-green-800" },
+    { id: "api-tag-3", name: "自动化", color: "bg-purple-100 text-purple-800" },
+    { id: "api-tag-4", name: "第三方平台", color: "bg-orange-100 text-orange-800" },
+    { id: "api-tag-5", name: "实时推送", color: "bg-gray-100 text-gray-800" },
+  ],
+}
+
+interface BasicSettingsProps {
+  formData: any
+  onChange: (data: any) => void
+  onNext?: () => void
+}
+
+interface Account {
+  id: string
+  nickname: string
+  avatar: string
+}
+
+interface Material {
+  id: string
+  name: string
+  type: string
+  preview: string
+}
+
+const posterTemplates = [
+  {
+    id: "poster-1",
+    name: "点击领取",
+    preview:
+      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E7%82%B9%E5%87%BB%E9%A2%86%E5%8F%961-tipd1HI7da6qooY5NkhxQnXBnT5LGU.gif",
+  },
+  {
+    id: "poster-2",
+    name: "点击合作",
+    preview:
+      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E7%82%B9%E5%87%BB%E5%90%88%E4%BD%9C-LPlMdgxtvhqCSr4IM1bZFEFDBF3ztI.gif",
+  },
+  {
+    id: "poster-3",
+    name: "点击咨询",
+    preview:
+      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E7%82%B9%E5%87%BB%E5%92%A8%E8%AF%A2-FTiyAMAPop2g9LvjLOLDz0VwPg3KVu.gif",
+  },
+  {
+    id: "poster-4",
+    name: "点击签到",
+    preview:
+      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E7%82%B9%E5%87%BB%E7%AD%BE%E5%88%B0-94TZIkjLldb4P2jTVlI6MkSDg0NbXi.gif",
+  },
+  {
+    id: "poster-5",
+    name: "点击了解",
+    preview:
+      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E7%82%B9%E5%87%BB%E4%BA%86%E8%A7%A3-6GCl7mQVdO4WIiykJyweSubLsTwj71.gif",
+  },
+  {
+    id: "poster-6",
+    name: "点击报名",
+    preview:
+      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E7%82%B9%E5%87%BB%E6%8A%A5%E5%90%8D-Mj0nnva0BiASeDAIhNNaRRAbjPgjEj.gif",
+  },
+]
+
+const generateRandomAccounts = (count: number): Account[] => {
+  return Array.from({ length: count }, (_, index) => ({
+    id: `account-${index + 1}`,
+    nickname: `账号-${Math.random().toString(36).substring(2, 7)}`,
+    avatar: `/placeholder.svg?height=40&width=40&text=${index + 1}`,
+  }))
+}
+
+const generatePosterMaterials = (): Material[] => {
+  return posterTemplates.map((template) => ({
+    id: template.id,
+    name: template.name,
+    type: "poster",
+    preview: template.preview,
+  }))
+}
+
+export function BasicSettings({ formData, onChange, onNext }: BasicSettingsProps) {
+  const [isAccountDialogOpen, setIsAccountDialogOpen] = useState(false)
+  const [isMaterialDialogOpen, setIsMaterialDialogOpen] = useState(false)
+  const [isQRCodeOpen, setIsQRCodeOpen] = useState(false)
+  const [isPreviewOpen, setIsPreviewOpen] = useState(false)
+  const [isPhoneSettingsOpen, setIsPhoneSettingsOpen] = useState(false)
+  const [previewImage, setPreviewImage] = useState("")
+  const [accounts] = useState<Account[]>(generateRandomAccounts(50))
+  const [materials] = useState<Material[]>(generatePosterMaterials())
+  const [selectedAccounts, setSelectedAccounts] = useState<Account[]>(
+    formData.accounts?.length > 0 ? formData.accounts : [],
+  )
+  const [selectedMaterials, setSelectedMaterials] = useState<Material[]>(
+    formData.materials?.length > 0 ? formData.materials : [],
+  )
+  const [showAllScenarios, setShowAllScenarios] = useState(false)
+  const [isImportDialogOpen, setIsImportDialogOpen] = useState(false)
+  const [importedTags, setImportedTags] = useState<
+    Array<{
+      phone: string
+      wechat: string
+      source?: string
+      orderAmount?: number
+      orderDate?: string
+    }>
+  >(formData.importedTags || [])
+
+  const [selectedScenarioTags, setSelectedScenarioTags] = useState<string[]>(formData.scenarioTags || [])
+  const [customTagInput, setCustomTagInput] = useState("")
+  const [customTags, setCustomTags] = useState<Array<{ id: string; name: string; color: string }>>(
+    formData.customTags || [],
+  )
+
+  // 初始化电话获客设置
+  const [phoneSettings, setPhoneSettings] = useState({
+    autoAdd: formData.phoneSettings?.autoAdd ?? true,
+    speechToText: formData.phoneSettings?.speechToText ?? true,
+    questionExtraction: formData.phoneSettings?.questionExtraction ?? true,
+  })
+
+  const [selectedPhoneTags, setSelectedPhoneTags] = useState<string[]>(formData.phoneTags || [])
+  const [phoneCallType, setPhoneCallType] = useState(formData.phoneCallType || "both")
+
+  // 处理标签选择
+  const handleTagToggle = (tagId: string) => {
+    const newTags = selectedPhoneTags.includes(tagId)
+      ? selectedPhoneTags.filter((id) => id !== tagId)
+      : [...selectedPhoneTags, tagId]
+
+    setSelectedPhoneTags(newTags)
+    onChange({ ...formData, phoneTags: newTags })
+  }
+
+  // 处理通话类型选择
+  const handleCallTypeChange = (type: string) => {
+    setPhoneCallType(type)
+    onChange({ ...formData, phoneCallType: type })
+  }
+
+  // 初始化时，如果没有选择场景，默认选择海报获客
+  useEffect(() => {
+    if (!formData.scenario) {
+      onChange({ ...formData, scenario: "haibao" })
+    }
+
+    if (!formData.planName) {
+      if (formData.materials?.length > 0) {
+        const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
+        onChange({ ...formData, planName: `海报${today}` })
+      } else {
+        onChange({ ...formData, planName: "场景" })
+      }
+    }
+  }, [formData, onChange])
+
+  const handleScenarioSelect = (scenarioId: string) => {
+    // 如果选择了电话获客，更新计划名称
+    if (scenarioId === "phone") {
+      const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
+      onChange({ ...formData, scenario: scenarioId, planName: `电话获客${today}` })
+    } else {
+      onChange({ ...formData, scenario: scenarioId })
+    }
+  }
+
+  // 处理场景标签选择
+  const handleScenarioTagToggle = (tagId: string) => {
+    const newTags = selectedScenarioTags.includes(tagId)
+      ? selectedScenarioTags.filter((id) => id !== tagId)
+      : [...selectedScenarioTags, tagId]
+
+    setSelectedScenarioTags(newTags)
+    onChange({ ...formData, scenarioTags: newTags })
+  }
+
+  // 添加自定义标签
+  const handleAddCustomTag = () => {
+    if (!customTagInput.trim()) return
+
+    const colors = [
+      "bg-blue-100 text-blue-800",
+      "bg-green-100 text-green-800",
+      "bg-purple-100 text-purple-800",
+      "bg-red-100 text-red-800",
+      "bg-orange-100 text-orange-800",
+      "bg-yellow-100 text-yellow-800",
+      "bg-gray-100 text-gray-800",
+      "bg-pink-100 text-pink-800",
+    ]
+
+    const newTag = {
+      id: `custom-${Date.now()}`,
+      name: customTagInput.trim(),
+      color: colors[Math.floor(Math.random() * colors.length)],
+    }
+
+    const updatedCustomTags = [...customTags, newTag]
+    setCustomTags(updatedCustomTags)
+    setCustomTagInput("")
+    onChange({ ...formData, customTags: updatedCustomTags })
+  }
+
+  // 删除自定义标签
+  const handleRemoveCustomTag = (tagId: string) => {
+    const updatedCustomTags = customTags.filter((tag) => tag.id !== tagId)
+    setCustomTags(updatedCustomTags)
+    onChange({ ...formData, customTags: updatedCustomTags })
+
+    // 同时从选中标签中移除
+    const updatedSelectedTags = selectedScenarioTags.filter((id) => id !== tagId)
+    setSelectedScenarioTags(updatedSelectedTags)
+    onChange({ ...formData, scenarioTags: updatedSelectedTags, customTags: updatedCustomTags })
+  }
+
+  const handleAccountSelect = (account: Account) => {
+    const updatedAccounts = [...selectedAccounts, account]
+    setSelectedAccounts(updatedAccounts)
+    onChange({ ...formData, accounts: updatedAccounts })
+  }
+
+  const handleMaterialSelect = (material: Material) => {
+    const updatedMaterials = [material]
+    setSelectedMaterials(updatedMaterials)
+    onChange({ ...formData, materials: updatedMaterials })
+    setIsMaterialDialogOpen(false)
+
+    // 更新计划名称
+    const today = new Date().toLocaleDateString("zh-CN").replace(/\//g, "")
+    onChange({ ...formData, planName: `海报${today}`, materials: updatedMaterials })
+  }
+
+  const handleRemoveAccount = (accountId: string) => {
+    const updatedAccounts = selectedAccounts.filter((a) => a.id !== accountId)
+    setSelectedAccounts(updatedAccounts)
+    onChange({ ...formData, accounts: updatedAccounts })
+  }
+
+  const handleRemoveMaterial = (materialId: string) => {
+    const updatedMaterials = selectedMaterials.filter((m) => m.id !== materialId)
+    setSelectedMaterials(updatedMaterials)
+    onChange({ ...formData, materials: updatedMaterials })
+  }
+
+  const handlePreviewImage = (imageUrl: string) => {
+    setPreviewImage(imageUrl)
+    setIsPreviewOpen(true)
+  }
+
+  // 只显示前三个场景，其他的需要点击展开
+  const displayedScenarios = showAllScenarios ? scenarios : scenarios.slice(0, 3)
+
+  const handleFileImport = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const file = event.target.files?.[0]
+    if (file) {
+      const reader = new FileReader()
+      reader.onload = (e) => {
+        try {
+          const content = e.target?.result as string
+          const rows = content.split("\n").filter((row) => row.trim())
+          const tags = rows.slice(1).map((row) => {
+            const [phone, wechat, source, orderAmount, orderDate] = row.split(",")
+            return {
+              phone: phone.trim(),
+              wechat: wechat.trim(),
+              source: source?.trim(),
+              orderAmount: orderAmount ? Number(orderAmount) : undefined,
+              orderDate: orderDate?.trim(),
+            }
+          })
+          setImportedTags(tags)
+          onChange({ ...formData, importedTags: tags })
+        } catch (error) {
+          console.error("导入失败:", error)
+        }
+      }
+      reader.readAsText(file)
+    }
+  }
+
+  const handleDownloadTemplate = () => {
+    const template = "电话号码,微信号,来源,订单金额,下单日期\n13800138000,wxid_123,抖音,99.00,2024-03-03"
+    const blob = new Blob([template], { type: "text/csv" })
+    const url = window.URL.createObjectURL(blob)
+    const a = document.createElement("a")
+    a.href = url
+    a.download = "订单导入模板.csv"
+    document.body.appendChild(a)
+    a.click()
+    document.body.removeChild(a)
+    window.URL.revokeObjectURL(url)
+  }
+
+  // 处理电话获客设置更新
+  const handlePhoneSettingsUpdate = () => {
+    onChange({ ...formData, phoneSettings })
+    setIsPhoneSettingsOpen(false)
+  }
+
+  return (
+    <TooltipProvider>
+      <Card className="p-6">
+        <div className="space-y-6">
+          <div>
+            <Label className="text-base mb-4 block">获客场景</Label>
+            <div className="grid grid-cols-3 gap-2">
+              {displayedScenarios.map((scenario) => (
+                <button
+                  key={scenario.id}
+                  className={`p-2 rounded-lg text-center transition-all ${
+                    formData.scenario === scenario.id
+                      ? "bg-blue-100 text-blue-600 font-medium"
+                      : "bg-gray-50 text-gray-600 hover:bg-gray-100"
+                  }`}
+                  onClick={() => handleScenarioSelect(scenario.id)}
+                >
+                  {scenario.name.replace("获客", "")}
+                </button>
+              ))}
+            </div>
+            {!showAllScenarios && (
+              <Button variant="ghost" className="mt-2 w-full text-blue-600" onClick={() => setShowAllScenarios(true)}>
+                展开更多选项 <ChevronDown className="ml-2 h-4 w-4" />
+              </Button>
+            )}
+          </div>
+
+          <div>
+            <Label htmlFor="planName">计划名称</Label>
+            <Input
+              id="planName"
+              value={formData.planName}
+              onChange={(e) => onChange({ ...formData, planName: e.target.value })}
+              placeholder="请输入计划名称"
+              className="mt-2"
+            />
+          </div>
+
+          {/* 场景标签选择 */}
+          {formData.scenario && (
+            <div className="mt-6">
+              <Label className="text-base mb-3 block">
+                {scenarios.find((s) => s.id === formData.scenario)?.name}标签（可多选）
+              </Label>
+
+              {/* 预设标签 */}
+              <div className="flex flex-wrap gap-2 mb-4">
+                {(scenarioTags[formData.scenario as keyof typeof scenarioTags] || []).map((tag) => (
+                  <div
+                    key={tag.id}
+                    className={`px-3 py-2 rounded-full text-sm cursor-pointer transition-all ${
+                      selectedScenarioTags.includes(tag.id)
+                        ? tag.color + " ring-2 ring-blue-400"
+                        : tag.color + " hover:ring-1 hover:ring-gray-300"
+                    }`}
+                    onClick={() => handleScenarioTagToggle(tag.id)}
+                  >
+                    {tag.name}
+                  </div>
+                ))}
+              </div>
+
+              {/* 自定义标签 */}
+              {customTags.length > 0 && (
+                <div className="mb-4">
+                  <Label className="text-sm text-gray-600 mb-2 block">自定义标签</Label>
+                  <div className="flex flex-wrap gap-2">
+                    {customTags.map((tag) => (
+                      <div
+                        key={tag.id}
+                        className={`px-3 py-2 rounded-full text-sm cursor-pointer transition-all relative group ${
+                          selectedScenarioTags.includes(tag.id)
+                            ? tag.color + " ring-2 ring-blue-400"
+                            : tag.color + " hover:ring-1 hover:ring-gray-300"
+                        }`}
+                        onClick={() => handleScenarioTagToggle(tag.id)}
+                      >
+                        {tag.name}
+                        <Button
+                          variant="ghost"
+                          size="sm"
+                          className="absolute -top-1 -right-1 h-5 w-5 p-0 opacity-0 group-hover:opacity-100 bg-red-500 hover:bg-red-600 text-white rounded-full"
+                          onClick={(e) => {
+                            e.stopPropagation()
+                            handleRemoveCustomTag(tag.id)
+                          }}
+                        >
+                          <X className="h-3 w-3" />
+                        </Button>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              )}
+
+              {/* 添加自定义标签 */}
+              <div className="flex gap-2">
+                <Input
+                  value={customTagInput}
+                  onChange={(e) => setCustomTagInput(e.target.value)}
+                  placeholder="输入自定义标签名称"
+                  className="flex-1"
+                  maxLength={8}
+                  onKeyPress={(e) => {
+                    if (e.key === "Enter") {
+                      handleAddCustomTag()
+                    }
+                  }}
+                />
+                <Button
+                  onClick={handleAddCustomTag}
+                  disabled={!customTagInput.trim()}
+                  variant="outline"
+                  className="px-4"
+                >
+                  <Plus className="h-4 w-4 mr-1" />
+                  添加
+                </Button>
+              </div>
+
+              {selectedScenarioTags.length > 0 && (
+                <div className="mt-3 text-sm text-gray-500">已选择 {selectedScenarioTags.length} 个标签</div>
+              )}
+            </div>
+          )}
+
+          {formData.scenario && (
+            <>
+              {scenarios.find((s) => s.id === formData.scenario)?.type === "social" &&
+                formData.scenario !== "phone" && (
+                  <div>
+                    <Label>绑定账号</Label>
+                    <div className="flex gap-2 mt-2">
+                      <Button
+                        variant="outline"
+                        className="flex-1 justify-start"
+                        onClick={() => setIsAccountDialogOpen(true)}
+                      >
+                        {selectedAccounts.length > 0 ? `已选择 ${selectedAccounts.length} 个账号` : "选择账号"}
+                      </Button>
+                      <Button variant="outline" size="icon" onClick={() => setIsQRCodeOpen(true)}>
+                        <QrCode className="h-4 w-4" />
+                      </Button>
+                    </div>
+                    {selectedAccounts.length > 0 && (
+                      <div className="mt-2 flex flex-wrap gap-2">
+                        {selectedAccounts.map((account) => (
+                          <div key={account.id} className="flex items-center bg-gray-100 rounded-full px-3 py-1">
+                            <img
+                              src={account.avatar || "/placeholder.svg"}
+                              alt={account.nickname}
+                              className="w-4 h-4 rounded-full mr-2"
+                            />
+                            <span className="text-sm">{account.nickname}</span>
+                            <Button
+                              variant="ghost"
+                              size="sm"
+                              className="ml-2 p-0"
+                              onClick={() => handleRemoveAccount(account.id)}
+                            >
+                              <X className="h-4 w-4" />
+                            </Button>
+                          </div>
+                        ))}
+                      </div>
+                    )}
+                  </div>
+                )}
+
+              {/* 电话获客特殊设置 */}
+              {formData.scenario === "phone" && (
+                <Card className="p-4 border-blue-100 bg-blue-50/50 mt-4">
+                  <div className="flex items-center justify-between mb-3">
+                    <Label className="text-base font-medium text-blue-700">电话获客设置</Label>
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      onClick={() => setIsPhoneSettingsOpen(true)}
+                      className="flex items-center gap-1 bg-white border-blue-200 text-blue-700 hover:bg-blue-100"
+                    >
+                      <Settings className="h-3.5 w-3.5" />
+                      修改设置
+                    </Button>
+                  </div>
+                  <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
+                    <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                      <div className="flex items-center">
+                        <div
+                          className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.autoAdd ? "bg-green-500" : "bg-gray-300"}`}
+                        ></div>
+                        <span>自动添加客户</span>
+                      </div>
+                      <div
+                        className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.autoAdd ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                      >
+                        {phoneSettings.autoAdd ? "已开启" : "已关闭"}
+                      </div>
+                    </div>
+                    <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                      <div className="flex items-center">
+                        <div
+                          className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.speechToText ? "bg-green-500" : "bg-gray-300"}`}
+                        ></div>
+                        <span>语音转文字</span>
+                      </div>
+                      <div
+                        className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.speechToText ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                      >
+                        {phoneSettings.speechToText ? "已开启" : "已关闭"}
+                      </div>
+                    </div>
+                    <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                      <div className="flex items-center">
+                        <div
+                          className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.questionExtraction ? "bg-green-500" : "bg-gray-300"}`}
+                        ></div>
+                        <span>问题提取</span>
+                      </div>
+                      <div
+                        className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.questionExtraction ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                      >
+                        {phoneSettings.questionExtraction ? "已开启" : "已关闭"}
+                      </div>
+                    </div>
+                  </div>
+                  <p className="text-xs text-blue-600 mt-2">
+                    提示：电话获客功能将自动记录来电信息，并根据设置执行相应操作
+                  </p>
+                </Card>
+              )}
+
+              {formData.scenario === "phone" && (
+                <>
+                  {/* 添加电话通话类型选择 */}
+                  <div className="mt-6">
+                    <Label className="text-base mb-2 block">通话类型</Label>
+                    <div className="grid grid-cols-2 gap-2 mt-2">
+                      <div
+                        className={`p-3 border rounded-lg text-center cursor-pointer ${
+                          phoneCallType === "outbound" || phoneCallType === "both"
+                            ? "bg-blue-50 border-blue-300"
+                            : "bg-white hover:bg-gray-50"
+                        }`}
+                        onClick={() => handleCallTypeChange(phoneCallType === "inbound" ? "both" : "outbound")}
+                      >
+                        <div className="font-medium">发起外呼</div>
+                        <div className="text-sm text-gray-500">主动向客户发起电话</div>
+                      </div>
+                      <div
+                        className={`p-3 border rounded-lg text-center cursor-pointer ${
+                          phoneCallType === "inbound" || phoneCallType === "both"
+                            ? "bg-blue-50 border-blue-300"
+                            : "bg-white hover:bg-gray-50"
+                        }`}
+                        onClick={() => handleCallTypeChange(phoneCallType === "outbound" ? "both" : "inbound")}
+                      >
+                        <div className="font-medium">接收来电</div>
+                        <div className="text-sm text-gray-500">接听客户的来电</div>
+                      </div>
+                    </div>
+                  </div>
+
+                  {/* 添加标签功能 */}
+                  <div className="mt-6">
+                    <Label className="text-base mb-2 block">通话标签（可多选）</Label>
+                    <div className="flex flex-wrap gap-2 mt-2">
+                      {phoneCallTags.map((tag) => (
+                        <div
+                          key={tag.id}
+                          className={`px-3 py-1.5 rounded-full text-sm cursor-pointer ${
+                            selectedPhoneTags.includes(tag.id)
+                              ? tag.color
+                              : "bg-gray-100 text-gray-800 hover:bg-gray-200"
+                          }`}
+                          onClick={() => handleTagToggle(tag.id)}
+                        >
+                          {tag.name}
+                        </div>
+                      ))}
+                    </div>
+                  </div>
+                </>
+              )}
+
+              {scenarios.find((s) => s.id === formData.scenario)?.type === "material" && (
+                <div>
+                  <div className="flex items-center justify-between mb-4">
+                    <Label>选择海报</Label>
+                    <Button variant="outline" onClick={() => setIsMaterialDialogOpen(true)}>
+                      <Plus className="h-4 w-4" />
+                    </Button>
+                  </div>
+
+                  {/* 海报展示区域 */}
+                  <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
+                    {materials.map((material) => (
+                      <div
+                        key={material.id}
+                        className={`relative cursor-pointer rounded-lg overflow-hidden group ${
+                          selectedMaterials.find((m) => m.id === material.id)
+                            ? "ring-2 ring-blue-600"
+                            : "hover:ring-2 hover:ring-blue-600"
+                        }`}
+                        onClick={() => handleMaterialSelect(material)}
+                      >
+                        <img
+                          src={material.preview || "/placeholder.svg"}
+                          alt={material.name}
+                          className="w-full aspect-[9/16] object-cover"
+                        />
+                        <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all">
+                          <Button
+                            variant="ghost"
+                            size="icon"
+                            className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity"
+                            onClick={(e) => {
+                              e.stopPropagation()
+                              handlePreviewImage(material.preview)
+                            }}
+                          >
+                            <Maximize2 className="h-4 w-4 text-white" />
+                          </Button>
+                        </div>
+                        <div className="absolute bottom-0 left-0 right-0 p-2 bg-black/50 text-white">
+                          <div className="text-sm truncate">{material.name}</div>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+
+                  {selectedMaterials.length > 0 && (
+                    <div className="mt-4">
+                      <Label>已选择的海报</Label>
+                      <div className="mt-2">
+                        <div className="relative w-full max-w-[200px]">
+                          <img
+                            src={selectedMaterials[0].preview || "/placeholder.svg"}
+                            alt={selectedMaterials[0].name}
+                            className="w-full aspect-[9/16] object-cover rounded-lg cursor-pointer"
+                            onClick={() => handlePreviewImage(selectedMaterials[0].preview)}
+                          />
+                          <Button
+                            variant="secondary"
+                            size="sm"
+                            className="absolute top-2 right-2"
+                            onClick={() => handleRemoveMaterial(selectedMaterials[0].id)}
+                          >
+                            <X className="h-4 w-4" />
+                          </Button>
+                        </div>
+                      </div>
+                    </div>
+                  )}
+                </div>
+              )}
+
+              {scenarios.find((s) => s.id === formData.scenario)?.id === "order" && (
+                <div>
+                  <div className="flex items-center justify-between mb-4">
+                    <Label>订单导入</Label>
+                    <div className="flex gap-2">
+                      <Button variant="outline" onClick={handleDownloadTemplate}>
+                        <Download className="h-4 w-4 mr-2" />
+                        下载模板
+                      </Button>
+                      <Button onClick={() => setIsImportDialogOpen(true)}>
+                        <Upload className="h-4 w-4 mr-2" />
+                        导入订单
+                      </Button>
+                    </div>
+                  </div>
+
+                  {importedTags.length > 0 && (
+                    <div className="mt-4">
+                      <h4 className="text-sm font-medium mb-2">已导入 {importedTags.length} 条数据</h4>
+                      <div className="max-h-[300px] overflow-auto border rounded-md">
+                        <Table>
+                          <TableHeader>
+                            <TableRow>
+                              <TableHead>电话号码</TableHead>
+                              <TableHead>微信号</TableHead>
+                              <TableHead>来源</TableHead>
+                              <TableHead>订单金额</TableHead>
+                            </TableRow>
+                          </TableHeader>
+                          <TableBody>
+                            {importedTags.slice(0, 5).map((tag, index) => (
+                              <TableRow key={index}>
+                                <TableCell>{tag.phone}</TableCell>
+                                <TableCell>{tag.wechat}</TableCell>
+                                <TableCell>{tag.source}</TableCell>
+                                <TableCell>{tag.orderAmount}</TableCell>
+                              </TableRow>
+                            ))}
+                            {importedTags.length > 5 && (
+                              <TableRow>
+                                <TableCell colSpan={4} className="text-center text-gray-500">
+                                  还有 {importedTags.length - 5} 条数据未显示
+                                </TableCell>
+                              </TableRow>
+                            )}
+                          </TableBody>
+                        </Table>
+                      </div>
+                    </div>
+                  )}
+                </div>
+              )}
+              {formData.scenario === "weixinqun" && (
+                <>
+                  <div>
+                    <Label>群管理设置</Label>
+                    <div className="grid grid-cols-2 gap-4 mt-2">
+                      <div className="flex items-center justify-between p-3 border rounded-lg">
+                        <div>
+                          <div className="font-medium">自动欢迎新成员</div>
+                          <div className="text-sm text-gray-500">新成员入群时自动发送欢迎消息</div>
+                        </div>
+                        <Switch
+                          checked={formData.autoWelcome ?? true}
+                          onCheckedChange={(checked) => onChange({ ...formData, autoWelcome: checked })}
+                        />
+                      </div>
+                      <div className="flex items-center justify-between p-3 border rounded-lg">
+                        <div>
+                          <div className="font-medium">群活跃度监控</div>
+                          <div className="text-sm text-gray-500">监控群聊活跃度并自动互动</div>
+                        </div>
+                        <Switch
+                          checked={formData.activityMonitor ?? false}
+                          onCheckedChange={(checked) => onChange({ ...formData, activityMonitor: checked })}
+                        />
+                      </div>
+                    </div>
+                  </div>
+
+                  <div>
+                    <Label>每日推送数量</Label>
+                    <div className="flex items-center space-x-4 mt-2">
+                      <Button
+                        variant="outline"
+                        size="icon"
+                        onClick={() => onChange({ ...formData, syncCount: Math.max(1, (formData.syncCount || 3) - 1) })}
+                        className="bg-white border-gray-200"
+                      >
+                        <Minus className="h-4 w-4" />
+                      </Button>
+                      <span className="w-8 text-center">{formData.syncCount || 3}</span>
+                      <Button
+                        variant="outline"
+                        size="icon"
+                        onClick={() => onChange({ ...formData, syncCount: (formData.syncCount || 3) + 1 })}
+                        className="bg-white border-gray-200"
+                      >
+                        <Plus className="h-4 w-4" />
+                      </Button>
+                      <span className="text-gray-500">条内容到群</span>
+                    </div>
+                    <div className="text-sm text-gray-500 mt-1">建议每日推送3-5条内容，避免过度打扰群成员</div>
+                  </div>
+
+                  <div>
+                    <Label>推送时间设置</Label>
+                    <div className="grid grid-cols-3 gap-2 mt-2">
+                      {["上午 9:00-12:00", "下午 14:00-17:00", "晚上 19:00-21:00"].map((time, index) => (
+                        <div
+                          key={index}
+                          className={`p-2 border rounded-lg text-center cursor-pointer text-sm ${
+                            (formData.pushTimes || []).includes(index)
+                              ? "bg-blue-50 border-blue-300 text-blue-700"
+                              : "bg-white hover:bg-gray-50"
+                          }`}
+                          onClick={() => {
+                            const currentTimes = formData.pushTimes || []
+                            const newTimes = currentTimes.includes(index)
+                              ? currentTimes.filter((t: number) => t !== index)
+                              : [...currentTimes, index]
+                            onChange({ ...formData, pushTimes: newTimes })
+                          }}
+                        >
+                          {time}
+                        </div>
+                      ))}
+                    </div>
+                  </div>
+                </>
+              )}
+            </>
+          )}
+
+          <div className="flex items-center justify-between">
+            <Label htmlFor="enabled">是否启用</Label>
+            <Switch
+              id="enabled"
+              checked={formData.enabled}
+              onCheckedChange={(checked) => onChange({ ...formData, enabled: checked })}
+            />
+          </div>
+
+          <Button className="w-full h-12 text-base" onClick={onNext}>
+            下一步
+          </Button>
+        </div>
+      </Card>
+
+      {/* 账号选择对话框 */}
+      <Dialog open={isAccountDialogOpen} onOpenChange={setIsAccountDialogOpen}>
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>选择账号</DialogTitle>
+          </DialogHeader>
+          <div className="mt-4 max-h-[400px] overflow-y-auto">
+            <div className="space-y-2">
+              {accounts.map((account) => (
+                <div
+                  key={account.id}
+                  className="flex items-center space-x-3 p-3 hover:bg-gray-100 rounded-lg cursor-pointer"
+                  onClick={() => handleAccountSelect(account)}
+                >
+                  <img src={account.avatar || "/placeholder.svg"} alt="" className="w-10 h-10 rounded-full" />
+                  <span className="flex-1">{account.nickname}</span>
+                  {selectedAccounts.find((a) => a.id === account.id) && (
+                    <div className="w-4 h-4 rounded-full bg-blue-600" />
+                  )}
+                </div>
+              ))}
+            </div>
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 二维码对话框 */}
+      <Dialog open={isQRCodeOpen} onOpenChange={setIsQRCodeOpen}>
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>绑定账号</DialogTitle>
+          </DialogHeader>
+          <div className="flex flex-col items-center p-6">
+            <div className="w-64 h-64 bg-gray-100 rounded-lg flex items-center justify-center">
+              <img src="/placeholder.svg?height=256&width=256" alt="二维码" className="w-full h-full" />
+            </div>
+            <p className="mt-4 text-sm text-gray-600">请用相应的APP扫码</p>
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 图片预览对话框 */}
+      <Dialog open={isPreviewOpen} onOpenChange={setIsPreviewOpen}>
+        <DialogContent className="sm:max-w-3xl">
+          <DialogHeader>
+            <DialogTitle>海报预览</DialogTitle>
+          </DialogHeader>
+          <div className="flex justify-center items-center p-4">
+            <img src={previewImage || "/placeholder.svg"} alt="预览" className="max-h-[80vh] object-contain" />
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 电话获客设置对话框 */}
+      <Dialog open={isPhoneSettingsOpen} onOpenChange={setIsPhoneSettingsOpen}>
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>电话获客设置</DialogTitle>
+            <DialogDescription>配置电话获客的自动化功能，提高获客效率</DialogDescription>
+          </DialogHeader>
+          <div className="py-4 space-y-6">
+            <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+              <div className="space-y-1">
+                <Label htmlFor="auto-add" className="font-medium">
+                  自动添加客户
+                </Label>
+                <p className="text-sm text-gray-500">来电后自动将客户添加为微信好友</p>
+                <p className="text-xs text-blue-600">推荐：开启此功能可提高转化率约30%</p>
+              </div>
+              <Switch
+                id="auto-add"
+                checked={phoneSettings.autoAdd}
+                onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, autoAdd: checked })}
+                className="data-[state=checked]:bg-blue-600"
+              />
+            </div>
+
+            <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+              <div className="space-y-1">
+                <Label htmlFor="speech-to-text" className="font-medium">
+                  语音转文字
+                </Label>
+                <p className="text-sm text-gray-500">自动将通话内容转换为文字记录</p>
+                <p className="text-xs text-blue-600">支持普通话、粤语等多种方言识别</p>
+              </div>
+              <Switch
+                id="speech-to-text"
+                checked={phoneSettings.speechToText}
+                onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, speechToText: checked })}
+                className="data-[state=checked]:bg-blue-600"
+              />
+            </div>
+
+            <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+              <div className="space-y-1">
+                <Label htmlFor="question-extraction" className="font-medium">
+                  问题提取
+                </Label>
+                <p className="text-sm text-gray-500">自动从通话中提取客户的首句问题</p>
+                <p className="text-xs text-blue-600">AI智能识别客户意图，提高回复精准度</p>
+              </div>
+              <Switch
+                id="question-extraction"
+                checked={phoneSettings.questionExtraction}
+                onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, questionExtraction: checked })}
+                className="data-[state=checked]:bg-blue-600"
+              />
+            </div>
+          </div>
+          <DialogFooter className="flex space-x-2 pt-2">
+            <Button variant="outline" onClick={() => setIsPhoneSettingsOpen(false)} className="flex-1">
+              取消
+            </Button>
+            <Button onClick={handlePhoneSettingsUpdate} className="flex-1 bg-blue-600 hover:bg-blue-700">
+              保存设置
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* 订单导入对话框 */}
+      <Dialog open={isImportDialogOpen} onOpenChange={setIsImportDialogOpen}>
+        <DialogContent className="max-w-3xl">
+          <DialogHeader>
+            <DialogTitle>导入订单标签</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-4">
+            <div className="flex items-center gap-4">
+              <Input type="file" accept=".csv" onChange={handleFileImport} className="flex-1" />
+            </div>
+            <div className="max-h-[400px] overflow-auto">
+              <Table>
+                <TableHeader>
+                  <TableRow>
+                    <TableHead>电话号码</TableHead>
+                    <TableHead>微信号</TableHead>
+                    <TableHead>来源</TableHead>
+                    <TableHead>订单金额</TableHead>
+                    <TableHead>下单日期</TableHead>
+                  </TableRow>
+                </TableHeader>
+                <TableBody>
+                  {importedTags.map((tag, index) => (
+                    <TableRow key={index}>
+                      <TableCell>{tag.phone}</TableCell>
+                      <TableCell>{tag.wechat}</TableCell>
+                      <TableCell>{tag.source}</TableCell>
+                      <TableCell>{tag.orderAmount}</TableCell>
+                      <TableCell>{tag.orderDate}</TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setIsImportDialogOpen(false)}>
+              取消
+            </Button>
+            <Button
+              onClick={() => {
+                onChange({ ...formData, importedTags })
+                setIsImportDialogOpen(false)
+              }}
+            >
+              确认导入
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </TooltipProvider>
+  )
+}
diff --git a/Cunkebao/app/scenarios/new/steps/FriendRequestSettings.tsx b/Cunkebao/app/scenarios/new/steps/FriendRequestSettings.tsx
new file mode 100644
index 00000000..4525a2b5
--- /dev/null
+++ b/Cunkebao/app/scenarios/new/steps/FriendRequestSettings.tsx
@@ -0,0 +1,277 @@
+"use client"
+
+import { useState, useEffect } from "react"
+import { Card } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { HelpCircle, MessageSquare, AlertCircle } from "lucide-react"
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog"
+import { Alert, AlertDescription } from "@/components/ui/alert"
+import { ChevronsUpDown } from "lucide-react"
+import { Checkbox } from "@/components/ui/checkbox"
+
+interface FriendRequestSettingsProps {
+  formData: any
+  onChange: (data: any) => void
+  onNext: () => void
+  onPrev: () => void
+}
+
+// 招呼语模板
+const greetingTemplates = [
+  "你好，请通过",
+  "你好,了解XX,请通过",
+  "你好，我是XX产品的客服请通过",
+  "你好，感谢关注我们的产品",
+  "你好，很高兴为您服务",
+]
+
+// 备注类型选项
+const remarkTypes = [
+  { value: "phone", label: "手机号" },
+  { value: "nickname", label: "昵称" },
+  { value: "source", label: "来源" },
+]
+
+// 模拟设备数据
+const mockDevices = [
+  { id: "1", name: "iPhone 13 Pro", status: "online" },
+  { id: "2", name: "Xiaomi 12", status: "online" },
+  { id: "3", name: "Huawei P40", status: "offline" },
+  { id: "4", name: "OPPO Find X3", status: "online" },
+  { id: "5", name: "Samsung S21", status: "online" },
+]
+
+export function FriendRequestSettings({ formData, onChange, onNext, onPrev }: FriendRequestSettingsProps) {
+  const [isTemplateDialogOpen, setIsTemplateDialogOpen] = useState(false)
+  const [hasWarnings, setHasWarnings] = useState(false)
+  const [isDeviceSelectorOpen, setIsDeviceSelectorOpen] = useState(false)
+  const [selectedDevices, setSelectedDevices] = useState<any[]>(formData.selectedDevices || [])
+
+  // 获取场景标题
+  const getScenarioTitle = () => {
+    switch (formData.scenario) {
+      case "douyin":
+        return "抖音直播"
+      case "xiaohongshu":
+        return "小红书"
+      case "weixinqun":
+        return "微信群"
+      case "gongzhonghao":
+        return "公众号"
+      default:
+        return formData.planName || "获客计划"
+    }
+  }
+
+  // 使用useEffect设置默认值
+  useEffect(() => {
+    if (!formData.greeting) {
+      onChange({
+        ...formData,
+        greeting: "你好，请通过",
+        remarkType: "phone", // 默认选择手机号
+        remarkFormat: `手机号+${getScenarioTitle()}`, // 默认备注格式
+        addFriendInterval: 1,
+      })
+    }
+  }, [formData, formData.greeting, onChange])
+
+  // 检查是否有未完成的必填项
+  useEffect(() => {
+    const hasIncompleteFields = !formData.greeting?.trim()
+    setHasWarnings(hasIncompleteFields)
+  }, [formData])
+
+  const handleTemplateSelect = (template: string) => {
+    onChange({ ...formData, greeting: template })
+    setIsTemplateDialogOpen(false)
+  }
+
+  const handleNext = () => {
+    // 即使有警告也允许进入下一步，但会显示提示
+    onNext()
+  }
+
+  const toggleDeviceSelection = (device: any) => {
+    const isSelected = selectedDevices.some((d) => d.id === device.id)
+    let newSelectedDevices
+
+    if (isSelected) {
+      newSelectedDevices = selectedDevices.filter((d) => d.id !== device.id)
+    } else {
+      newSelectedDevices = [...selectedDevices, device]
+    }
+
+    setSelectedDevices(newSelectedDevices)
+    onChange({ ...formData, selectedDevices: newSelectedDevices })
+  }
+
+  return (
+    <Card className="p-6">
+      <div className="space-y-6">
+        <div>
+          <Label className="text-base">选择设备</Label>
+          <div className="relative mt-2">
+            <Button
+              variant="outline"
+              className="w-full justify-between"
+              onClick={() => setIsDeviceSelectorOpen(!isDeviceSelectorOpen)}
+            >
+              {selectedDevices.length ? `已选择 ${selectedDevices.length} 个设备` : "选择设备"}
+              <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+            </Button>
+
+            {isDeviceSelectorOpen && (
+              <div className="absolute z-10 w-full mt-1 bg-white border rounded-md shadow-lg">
+                <div className="p-2">
+                  <Input placeholder="搜索设备..." className="mb-2" />
+                  <div className="max-h-60 overflow-auto">
+                    {mockDevices.map((device) => (
+                      <div
+                        key={device.id}
+                        className="flex items-center justify-between p-2 hover:bg-gray-100 cursor-pointer"
+                        onClick={() => toggleDeviceSelection(device)}
+                      >
+                        <div className="flex items-center space-x-2">
+                          <Checkbox
+                            checked={selectedDevices.some((d) => d.id === device.id)}
+                            onCheckedChange={() => toggleDeviceSelection(device)}
+                          />
+                          <span>{device.name}</span>
+                        </div>
+                        <span className={`text-xs ${device.status === "online" ? "text-green-500" : "text-gray-400"}`}>
+                          {device.status === "online" ? "在线" : "离线"}
+                        </span>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              </div>
+            )}
+          </div>
+        </div>
+
+        <div>
+          <div className="flex items-center space-x-2">
+            <Label className="text-base">好友备注</Label>
+            <TooltipProvider>
+              <Tooltip>
+                <TooltipTrigger>
+                  <HelpCircle className="h-4 w-4 text-gray-400" />
+                </TooltipTrigger>
+                <TooltipContent>
+                  <p>设置添加好友时的备注格式</p>
+                  <p className="mt-1">备注格式预览：</p>
+                  <p>{formData.remarkType === "phone" && `138****1234+${getScenarioTitle()}`}</p>
+                  <p>{formData.remarkType === "nickname" && `小红书用户2851+${getScenarioTitle()}`}</p>
+                  <p>{formData.remarkType === "source" && `抖音直播+${getScenarioTitle()}`}</p>
+                </TooltipContent>
+              </Tooltip>
+            </TooltipProvider>
+          </div>
+          <Select
+            value={formData.remarkType || "phone"}
+            onValueChange={(value) => onChange({ ...formData, remarkType: value })}
+          >
+            <SelectTrigger className="w-full mt-2">
+              <SelectValue placeholder="选择备注类型" />
+            </SelectTrigger>
+            <SelectContent>
+              {remarkTypes.map((type) => (
+                <SelectItem key={type.value} value={type.value}>
+                  {type.label}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        </div>
+
+        <div>
+          <div className="flex items-center justify-between">
+            <Label className="text-base">招呼语</Label>
+            <Button variant="ghost" size="sm" onClick={() => setIsTemplateDialogOpen(true)} className="text-blue-500">
+              <MessageSquare className="h-4 w-4 mr-2" />
+              参考模板
+            </Button>
+          </div>
+          <Input
+            value={formData.greeting}
+            onChange={(e) => onChange({ ...formData, greeting: e.target.value })}
+            placeholder="请输入招呼语"
+            className="mt-2"
+          />
+        </div>
+
+        <div>
+          <Label className="text-base">添加间隔</Label>
+          <div className="flex items-center space-x-2 mt-2">
+            <Input
+              type="number"
+              value={formData.addFriendInterval || 1}
+              onChange={(e) => onChange({ ...formData, addFriendInterval: Number(e.target.value) })}
+              className="w-32"
+            />
+            <span>分钟</span>
+          </div>
+        </div>
+
+        <div>
+          <Label className="text-base">允许加人的时间段</Label>
+          <div className="flex items-center space-x-2 mt-2">
+            <Input
+              type="time"
+              value={formData.addFriendTimeStart || "09:00"}
+              onChange={(e) => onChange({ ...formData, addFriendTimeStart: e.target.value })}
+              className="w-32"
+            />
+            <span>至</span>
+            <Input
+              type="time"
+              value={formData.addFriendTimeEnd || "18:00"}
+              onChange={(e) => onChange({ ...formData, addFriendTimeEnd: e.target.value })}
+              className="w-32"
+            />
+          </div>
+        </div>
+
+        {hasWarnings && (
+          <Alert variant="warning" className="bg-amber-50 border-amber-200">
+            <AlertCircle className="h-4 w-4 text-amber-500" />
+            <AlertDescription>您有未完成的设置项，建议完善后再进入下一步。</AlertDescription>
+          </Alert>
+        )}
+
+        <div className="flex justify-between pt-4">
+          <Button variant="outline" onClick={onPrev}>
+            上一步
+          </Button>
+          <Button onClick={handleNext}>下一步</Button>
+        </div>
+      </div>
+
+      <Dialog open={isTemplateDialogOpen} onOpenChange={setIsTemplateDialogOpen}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>招呼语模板</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-2">
+            {greetingTemplates.map((template, index) => (
+              <Button
+                key={index}
+                variant="outline"
+                className="w-full justify-start h-auto py-3 px-4"
+                onClick={() => handleTemplateSelect(template)}
+              >
+                {template}
+              </Button>
+            ))}
+          </div>
+        </DialogContent>
+      </Dialog>
+    </Card>
+  )
+}
diff --git a/Cunkebao/app/scenarios/new/steps/MessageSettings.tsx b/Cunkebao/app/scenarios/new/steps/MessageSettings.tsx
new file mode 100644
index 00000000..de80ecd3
--- /dev/null
+++ b/Cunkebao/app/scenarios/new/steps/MessageSettings.tsx
@@ -0,0 +1,554 @@
+"use client"
+
+import { useState } from "react"
+import { Card } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { Textarea } from "@/components/ui/textarea"
+import {
+  MessageSquare,
+  ImageIcon,
+  Video,
+  FileText,
+  Link2,
+  Users,
+  AppWindowIcon as Window,
+  Plus,
+  X,
+  Upload,
+  Clock,
+} from "lucide-react"
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
+import { toast } from "@/components/ui/use-toast"
+
+interface MessageContent {
+  id: string
+  type: "text" | "image" | "video" | "file" | "miniprogram" | "link" | "group"
+  content: string
+  sendInterval?: number
+  intervalUnit?: "seconds" | "minutes"
+  scheduledTime?: {
+    hour: number
+    minute: number
+    second: number
+  }
+  title?: string
+  description?: string
+  address?: string
+  coverImage?: string
+  groupId?: string
+  linkUrl?: string
+}
+
+interface DayPlan {
+  day: number
+  messages: MessageContent[]
+}
+
+interface MessageSettingsProps {
+  formData: any
+  onChange: (data: any) => void
+  onNext: () => void
+  onPrev: () => void
+}
+
+// 消息类型配置
+const messageTypes = [
+  { id: "text", icon: MessageSquare, label: "文本" },
+  { id: "image", icon: ImageIcon, label: "图片" },
+  { id: "video", icon: Video, label: "视频" },
+  { id: "file", icon: FileText, label: "文件" },
+  { id: "miniprogram", icon: Window, label: "小程序" },
+  { id: "link", icon: Link2, label: "链接" },
+  { id: "group", icon: Users, label: "邀请入群" },
+]
+
+// 模拟群组数据
+const mockGroups = [
+  { id: "1", name: "产品交流群1", memberCount: 156 },
+  { id: "2", name: "产品交流群2", memberCount: 234 },
+  { id: "3", name: "产品交流群3", memberCount: 89 },
+]
+
+export function MessageSettings({ formData, onChange, onNext, onPrev }: MessageSettingsProps) {
+  const [dayPlans, setDayPlans] = useState<DayPlan[]>([
+    {
+      day: 0,
+      messages: [
+        {
+          id: "1",
+          type: "text",
+          content: "",
+          sendInterval: 5,
+          intervalUnit: "seconds", // 默认改为秒
+        },
+      ],
+    },
+  ])
+  const [isAddDayPlanOpen, setIsAddDayPlanOpen] = useState(false)
+  const [isGroupSelectOpen, setIsGroupSelectOpen] = useState(false)
+  const [selectedGroupId, setSelectedGroupId] = useState("")
+
+  // 添加新消息
+  const handleAddMessage = (dayIndex: number, type = "text") => {
+    const updatedPlans = [...dayPlans]
+    const newMessage: MessageContent = {
+      id: Date.now().toString(),
+      type: type as MessageContent["type"],
+      content: "",
+    }
+
+    if (dayPlans[dayIndex].day === 0) {
+      // 即时消息使用间隔设置
+      newMessage.sendInterval = 5
+      newMessage.intervalUnit = "seconds" // 默认改为秒
+    } else {
+      // 非即时消息使用具体时间设置
+      newMessage.scheduledTime = {
+        hour: 9,
+        minute: 0,
+        second: 0,
+      }
+    }
+
+    updatedPlans[dayIndex].messages.push(newMessage)
+    setDayPlans(updatedPlans)
+    onChange({ ...formData, messagePlans: updatedPlans })
+  }
+
+  // 更新消息内容
+  const handleUpdateMessage = (dayIndex: number, messageIndex: number, updates: Partial<MessageContent>) => {
+    const updatedPlans = [...dayPlans]
+    updatedPlans[dayIndex].messages[messageIndex] = {
+      ...updatedPlans[dayIndex].messages[messageIndex],
+      ...updates,
+    }
+    setDayPlans(updatedPlans)
+    onChange({ ...formData, messagePlans: updatedPlans })
+  }
+
+  // 删除消息
+  const handleRemoveMessage = (dayIndex: number, messageIndex: number) => {
+    const updatedPlans = [...dayPlans]
+    updatedPlans[dayIndex].messages.splice(messageIndex, 1)
+    setDayPlans(updatedPlans)
+    onChange({ ...formData, messagePlans: updatedPlans })
+  }
+
+  // 切换时间单位
+  const toggleIntervalUnit = (dayIndex: number, messageIndex: number) => {
+    const message = dayPlans[dayIndex].messages[messageIndex]
+    const newUnit = message.intervalUnit === "minutes" ? "seconds" : "minutes"
+    handleUpdateMessage(dayIndex, messageIndex, { intervalUnit: newUnit })
+  }
+
+  // 添加新的天数计划
+  const handleAddDayPlan = () => {
+    const newDay = dayPlans.length
+    setDayPlans([
+      ...dayPlans,
+      {
+        day: newDay,
+        messages: [
+          {
+            id: Date.now().toString(),
+            type: "text",
+            content: "",
+            scheduledTime: {
+              hour: 9,
+              minute: 0,
+              second: 0,
+            },
+          },
+        ],
+      },
+    ])
+    setIsAddDayPlanOpen(false)
+    toast({
+      title: "添加成功",
+      description: `已添加第${newDay}天的消息计划`,
+    })
+  }
+
+  // 选择群组
+  const handleSelectGroup = (groupId: string) => {
+    setSelectedGroupId(groupId)
+    setIsGroupSelectOpen(false)
+    toast({
+      title: "选择成功",
+      description: `已选择群组：${mockGroups.find((g) => g.id === groupId)?.name}`,
+    })
+  }
+
+  // 处理文件上传
+  const handleFileUpload = (dayIndex: number, messageIndex: number, type: "image" | "video" | "file") => {
+    // 模拟文件上传
+    toast({
+      title: "上传成功",
+      description: `${type === "image" ? "图片" : type === "video" ? "视频" : "文件"}上传成功`,
+    })
+  }
+
+  return (
+    <Card className="p-6">
+      <div className="space-y-6">
+        <div className="flex items-center justify-between">
+          <h2 className="text-lg font-semibold">消息设置</h2>
+          <Button variant="outline" size="icon" onClick={() => setIsAddDayPlanOpen(true)}>
+            <Plus className="h-4 w-4" />
+          </Button>
+        </div>
+
+        <Tabs defaultValue="0" className="w-full">
+          <TabsList className="w-full">
+            {dayPlans.map((plan) => (
+              <TabsTrigger key={plan.day} value={plan.day.toString()} className="flex-1">
+                {plan.day === 0 ? "即时消息" : `第${plan.day}天`}
+              </TabsTrigger>
+            ))}
+          </TabsList>
+
+          {dayPlans.map((plan, dayIndex) => (
+            <TabsContent key={plan.day} value={plan.day.toString()}>
+              <div className="space-y-4">
+                {plan.messages.map((message, messageIndex) => (
+                  <div key={message.id} className="space-y-4 p-4 bg-gray-50 rounded-lg">
+                    <div className="flex items-center justify-between">
+                      <div className="flex items-center space-x-2">
+                        {plan.day === 0 ? (
+                          <>
+                            <Label>间隔</Label>
+                            <Input
+                              type="number"
+                              value={message.sendInterval}
+                              onChange={(e) =>
+                                handleUpdateMessage(dayIndex, messageIndex, { sendInterval: Number(e.target.value) })
+                              }
+                              className="w-20"
+                            />
+                            <Button
+                              variant="ghost"
+                              size="sm"
+                              onClick={() => toggleIntervalUnit(dayIndex, messageIndex)}
+                              className="flex items-center space-x-1"
+                            >
+                              <Clock className="h-3 w-3" />
+                              <span>{message.intervalUnit === "minutes" ? "分钟" : "秒"}</span>
+                            </Button>
+                          </>
+                        ) : (
+                          <>
+                            <Label>发送时间</Label>
+                            <div className="flex items-center space-x-1">
+                              <Input
+                                type="number"
+                                min="0"
+                                max="23"
+                                value={message.scheduledTime?.hour || 0}
+                                onChange={(e) =>
+                                  handleUpdateMessage(dayIndex, messageIndex, {
+                                    scheduledTime: {
+                                      ...(message.scheduledTime || { hour: 0, minute: 0, second: 0 }),
+                                      hour: Number(e.target.value),
+                                    },
+                                  })
+                                }
+                                className="w-16"
+                              />
+                              <span>:</span>
+                              <Input
+                                type="number"
+                                min="0"
+                                max="59"
+                                value={message.scheduledTime?.minute || 0}
+                                onChange={(e) =>
+                                  handleUpdateMessage(dayIndex, messageIndex, {
+                                    scheduledTime: {
+                                      ...(message.scheduledTime || { hour: 0, minute: 0, second: 0 }),
+                                      minute: Number(e.target.value),
+                                    },
+                                  })
+                                }
+                                className="w-16"
+                              />
+                              <span>:</span>
+                              <Input
+                                type="number"
+                                min="0"
+                                max="59"
+                                value={message.scheduledTime?.second || 0}
+                                onChange={(e) =>
+                                  handleUpdateMessage(dayIndex, messageIndex, {
+                                    scheduledTime: {
+                                      ...(message.scheduledTime || { hour: 0, minute: 0, second: 0 }),
+                                      second: Number(e.target.value),
+                                    },
+                                  })
+                                }
+                                className="w-16"
+                              />
+                            </div>
+                          </>
+                        )}
+                      </div>
+                      <Button variant="ghost" size="sm" onClick={() => handleRemoveMessage(dayIndex, messageIndex)}>
+                        <X className="h-4 w-4" />
+                      </Button>
+                    </div>
+
+                    <div className="flex items-center space-x-2 bg-white p-2 rounded-lg">
+                      {messageTypes.map((type) => (
+                        <Button
+                          key={type.id}
+                          variant={message.type === type.id ? "default" : "outline"}
+                          size="sm"
+                          onClick={() => handleUpdateMessage(dayIndex, messageIndex, { type: type.id as any })}
+                          className="flex flex-col items-center p-2 h-auto"
+                        >
+                          <type.icon className="h-4 w-4" />
+                        </Button>
+                      ))}
+                    </div>
+
+                    {message.type === "text" && (
+                      <Textarea
+                        value={message.content}
+                        onChange={(e) => handleUpdateMessage(dayIndex, messageIndex, { content: e.target.value })}
+                        placeholder="请输入消息内容"
+                        className="min-h-[100px]"
+                      />
+                    )}
+
+                    {message.type === "miniprogram" && (
+                      <div className="space-y-4">
+                        <div className="space-y-2">
+                          <Label>
+                            标题<span className="text-red-500">*</span>
+                          </Label>
+                          <Input
+                            value={message.title}
+                            onChange={(e) => handleUpdateMessage(dayIndex, messageIndex, { title: e.target.value })}
+                            placeholder="请输入小程序标题"
+                          />
+                        </div>
+                        <div className="space-y-2">
+                          <Label>描述</Label>
+                          <Input
+                            value={message.description}
+                            onChange={(e) =>
+                              handleUpdateMessage(dayIndex, messageIndex, { description: e.target.value })
+                            }
+                            placeholder="请输入小程序描述"
+                          />
+                        </div>
+                        <div className="space-y-2">
+                          <Label>
+                            链接<span className="text-red-500">*</span>
+                          </Label>
+                          <Input
+                            value={message.address}
+                            onChange={(e) => handleUpdateMessage(dayIndex, messageIndex, { address: e.target.value })}
+                            placeholder="请输入小程序路径"
+                          />
+                        </div>
+                        <div className="space-y-2">
+                          <Label>
+                            封面<span className="text-red-500">*</span>
+                          </Label>
+                          <div className="border-2 border-dashed rounded-lg p-4 text-center">
+                            {message.coverImage ? (
+                              <div className="relative">
+                                <img
+                                  src={message.coverImage || "/placeholder.svg"}
+                                  alt="封面"
+                                  className="max-w-[200px] mx-auto rounded-lg"
+                                />
+                                <Button
+                                  variant="secondary"
+                                  size="sm"
+                                  className="absolute top-2 right-2"
+                                  onClick={() => handleUpdateMessage(dayIndex, messageIndex, { coverImage: undefined })}
+                                >
+                                  <X className="h-4 w-4" />
+                                </Button>
+                              </div>
+                            ) : (
+                              <Button
+                                variant="outline"
+                                className="w-full h-[120px]"
+                                onClick={() => handleFileUpload(dayIndex, messageIndex, "image")}
+                              >
+                                <Upload className="h-4 w-4 mr-2" />
+                                上传封面
+                              </Button>
+                            )}
+                          </div>
+                        </div>
+                      </div>
+                    )}
+
+                    {message.type === "link" && (
+                      <div className="space-y-4">
+                        <div className="space-y-2">
+                          <Label>
+                            标题<span className="text-red-500">*</span>
+                          </Label>
+                          <Input
+                            value={message.title}
+                            onChange={(e) => handleUpdateMessage(dayIndex, messageIndex, { title: e.target.value })}
+                            placeholder="请输入链接标题"
+                          />
+                        </div>
+                        <div className="space-y-2">
+                          <Label>描述</Label>
+                          <Input
+                            value={message.description}
+                            onChange={(e) =>
+                              handleUpdateMessage(dayIndex, messageIndex, { description: e.target.value })
+                            }
+                            placeholder="请输入链接描述"
+                          />
+                        </div>
+                        <div className="space-y-2">
+                          <Label>
+                            链接<span className="text-red-500">*</span>
+                          </Label>
+                          <Input
+                            value={message.linkUrl}
+                            onChange={(e) => handleUpdateMessage(dayIndex, messageIndex, { linkUrl: e.target.value })}
+                            placeholder="请输入链接地址"
+                          />
+                        </div>
+                        <div className="space-y-2">
+                          <Label>
+                            封面<span className="text-red-500">*</span>
+                          </Label>
+                          <div className="border-2 border-dashed rounded-lg p-4 text-center">
+                            {message.coverImage ? (
+                              <div className="relative">
+                                <img
+                                  src={message.coverImage || "/placeholder.svg"}
+                                  alt="封面"
+                                  className="max-w-[200px] mx-auto rounded-lg"
+                                />
+                                <Button
+                                  variant="secondary"
+                                  size="sm"
+                                  className="absolute top-2 right-2"
+                                  onClick={() => handleUpdateMessage(dayIndex, messageIndex, { coverImage: undefined })}
+                                >
+                                  <X className="h-4 w-4" />
+                                </Button>
+                              </div>
+                            ) : (
+                              <Button
+                                variant="outline"
+                                className="w-full h-[120px]"
+                                onClick={() => handleFileUpload(dayIndex, messageIndex, "image")}
+                              >
+                                <Upload className="h-4 w-4 mr-2" />
+                                上传封面
+                              </Button>
+                            )}
+                          </div>
+                        </div>
+                      </div>
+                    )}
+
+                    {message.type === "group" && (
+                      <div className="space-y-2">
+                        <Label>
+                          选择群聊<span className="text-red-500">*</span>
+                        </Label>
+                        <Button
+                          variant="outline"
+                          className="w-full justify-start"
+                          onClick={() => setIsGroupSelectOpen(true)}
+                        >
+                          {selectedGroupId ? mockGroups.find((g) => g.id === selectedGroupId)?.name : "选择邀请入的群"}
+                        </Button>
+                      </div>
+                    )}
+
+                    {(message.type === "image" || message.type === "video" || message.type === "file") && (
+                      <div className="border-2 border-dashed rounded-lg p-4 text-center">
+                        <Button
+                          variant="outline"
+                          className="w-full h-[120px]"
+                          onClick={() => handleFileUpload(dayIndex, messageIndex, message.type as any)}
+                        >
+                          <Upload className="h-4 w-4 mr-2" />
+                          上传{message.type === "image" ? "图片" : message.type === "video" ? "视频" : "文件"}
+                        </Button>
+                      </div>
+                    )}
+                  </div>
+                ))}
+
+                <Button variant="outline" onClick={() => handleAddMessage(dayIndex)} className="w-full">
+                  <Plus className="w-4 h-4 mr-2" />
+                  添加消息
+                </Button>
+              </div>
+            </TabsContent>
+          ))}
+        </Tabs>
+
+        <div className="flex justify-between pt-4">
+          <Button variant="outline" onClick={onPrev}>
+            上一步
+          </Button>
+          <Button onClick={onNext}>下一步</Button>
+        </div>
+      </div>
+
+      {/* 添加天数计划弹窗 */}
+      <Dialog open={isAddDayPlanOpen} onOpenChange={setIsAddDayPlanOpen}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>添加消息计划</DialogTitle>
+          </DialogHeader>
+          <div className="py-4">
+            <p className="text-sm text-gray-500 mb-4">选择要添加的消息计划类型</p>
+            <Button onClick={handleAddDayPlan} className="w-full">
+              添加第 {dayPlans.length} 天计划
+            </Button>
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      {/* 选择群聊弹窗 */}
+      <Dialog open={isGroupSelectOpen} onOpenChange={setIsGroupSelectOpen}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>选择群聊</DialogTitle>
+          </DialogHeader>
+          <div className="py-4">
+            <div className="space-y-2">
+              {mockGroups.map((group) => (
+                <div
+                  key={group.id}
+                  className={`p-4 rounded-lg cursor-pointer hover:bg-gray-100 ${
+                    selectedGroupId === group.id ? "bg-blue-50 border border-blue-200" : ""
+                  }`}
+                  onClick={() => handleSelectGroup(group.id)}
+                >
+                  <div className="font-medium">{group.name}</div>
+                  <div className="text-sm text-gray-500">成员数：{group.memberCount}</div>
+                </div>
+              ))}
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setIsGroupSelectOpen(false)}>
+              取消
+            </Button>
+            <Button onClick={() => setIsGroupSelectOpen(false)}>确定</Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </Card>
+  )
+}
diff --git a/Cunkebao/app/scenarios/new/steps/TrafficChannelSettings b/Cunkebao/app/scenarios/new/steps/TrafficChannelSettings
index b9a5b6e5..0dd41b5e 100644
--- a/Cunkebao/app/scenarios/new/steps/TrafficChannelSettings
+++ b/Cunkebao/app/scenarios/new/steps/TrafficChannelSettings
@@ -207,4 +207,3 @@ export function TrafficChannelSettings({ formData, onChange, onNext, onPrev }: T
     </Card>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/page.tsx b/Cunkebao/app/scenarios/page.tsx
index d61dd15b..156d1c7d 100644
--- a/Cunkebao/app/scenarios/page.tsx
+++ b/Cunkebao/app/scenarios/page.tsx
@@ -1,335 +1,190 @@
 "use client"
-
-import { useState, useEffect, useRef } from "react"
-import type React from "react"
-import { TrendingUp, Users, ChevronLeft, Bot, Sparkles, Plus, Phone } from "lucide-react"
-import { Card } from "@/components/ui/card"
-import { Button } from "@/components/ui/button"
 import { useRouter } from "next/navigation"
-import { Skeleton } from "@/components/ui/skeleton"
-import { fetchScenes, transformSceneItem } from "@/api/scenarios"
-
-interface Channel {
-  id: string
-  name: string
-  icon: string
-  stats: {
-    daily: number
-    growth: number
-  }
-  link?: string
-  plans?: Plan[]
-}
-
-interface Plan {
-  id: string
-  name: string
-  isNew?: boolean
-  status: "active" | "paused" | "completed"
-  acquisitionCount: number
-}
-
-// AI场景列表（服务端暂未提供）
-const aiScenarios = [
-  {
-    id: "ai-friend",
-    name: "AI智能加友",
-    icon: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-azCH8EgGfidWXOqiM2D1jLH0VFRUtW.png",
-    description: "智能分析目标用户画像，自动筛选优质客户",
-    stats: {
-      daily: 245,
-      growth: 18.5,
-    },
-    link: "/scenarios/ai-friend",
-    plans: [
-      {
-        id: "ai-plan-1",
-        name: "AI智能筛选计划",
-        isNew: true,
-        status: "active",
-        acquisitionCount: 78,
-      },
-    ],
-  },
-  {
-    id: "ai-group",
-    name: "AI群引流",
-    icon: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-azCH8EgGfidWXOqiM2D1jLH0VFRUtW.png",
-    description: "智能群聊互动，提高群活跃度和转化率",
-    stats: {
-      daily: 178,
-      growth: 15.2,
-    },
-    link: "/scenarios/ai-group",
-    plans: [
-      {
-        id: "ai-plan-2",
-        name: "AI群聊互动计划",
-        status: "active",
-        acquisitionCount: 56,
-      },
-    ],
-  },
-  {
-    id: "ai-conversion",
-    name: "AI场景转化",
-    icon: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-m4ENUaZon82EPFHod2dP1dajlrRdVG.png",
-    description: "多场景智能营销，提升获客转化效果",
-    stats: {
-      daily: 134,
-      growth: 12.8,
-    },
-    link: "/scenarios/ai-conversion",
-    plans: [
-      {
-        id: "ai-plan-3",
-        name: "AI多场景营销",
-        isNew: true,
-        status: "active",
-        acquisitionCount: 43,
-      },
-    ],
-  },
-]
+import { Plus, TrendingUp } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent } from "@/components/ui/card"
+import { Badge } from "@/components/ui/badge"
 
 export default function ScenariosPage() {
   const router = useRouter()
-  const [channels, setChannels] = useState<Channel[]>([])
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<string | null>(null)
-  // 使用ref跟踪组件挂载状态
-  const isMounted = useRef(true);
-  // 使用ref跟踪是否已经加载过数据
-  const hasLoadedRef = useRef(false);
 
-  // 组件卸载时更新挂载状态
-  useEffect(() => {
-    return () => {
-      isMounted.current = false;
-    };
-  }, []);
+  // 场景数据
+  const scenarios = [
+    {
+      id: "poster",
+      name: "海报获客",
+      icon: "🖼️",
+      count: 167,
+      growth: "+10.2%",
+      path: "/scenarios/poster",
+    },
+    {
+      id: "order",
+      name: "订单获客",
+      icon: "📋",
+      count: 112,
+      growth: "+7.8%",
+      path: "/scenarios/order",
+    },
+    {
+      id: "douyin",
+      name: "抖音获客",
+      icon: "📱",
+      count: 156,
+      growth: "+12.5%",
+      path: "/scenarios/douyin",
+    },
+    {
+      id: "xiaohongshu",
+      name: "小红书获客",
+      icon: "📕",
+      count: 89,
+      growth: "+8.3%",
+      path: "/scenarios/xiaohongshu",
+    },
+    {
+      id: "phone",
+      name: "电话获客",
+      icon: "📞",
+      count: 42,
+      growth: "+15.8%",
+      path: "/scenarios/phone",
+    },
+    {
+      id: "gongzhonghao",
+      name: "公众号获客",
+      icon: "📢",
+      count: 234,
+      growth: "+15.7%",
+      path: "/scenarios/gongzhonghao",
+    },
+    {
+      id: "weixinqun",
+      name: "微信群获客",
+      icon: "👥",
+      count: 145,
+      growth: "+11.2%",
+      path: "/scenarios/weixinqun",
+    },
+    {
+      id: "payment",
+      name: "付款码获客",
+      icon: "💳",
+      count: 78,
+      growth: "+9.5%",
+      path: "/scenarios/payment",
+    },
+    {
+      id: "api",
+      name: "API获客",
+      icon: "🔌",
+      count: 198,
+      growth: "+14.3%",
+      path: "/scenarios/api",
+    },
+  ]
 
-  useEffect(() => {
-    // 组件未挂载，不执行操作
-    if (!isMounted.current) return;
-    
-    // 如果已经加载过数据，不再重复请求
-    if (hasLoadedRef.current && channels.length > 0) return;
-
-    const loadScenes = async () => {
-      try {
-        setLoading(true)
-        const response = await fetchScenes({ limit: 50 })
-        
-        if (response.code === 200 && response.data) {
-          // 转换场景数据为前端展示格式
-          const transformedScenes = response.data.map((scene) => {
-            const transformedScene = transformSceneItem(scene)
-            
-            // 添加link属性（用于导航）
-            return {
-              ...transformedScene,
-              link: `/scenarios/${scene.id}`
-            }
-          })
-          
-          // 只有在组件仍然挂载的情况下才更新状态
-          if (isMounted.current) {
-            setChannels(transformedScenes)
-            // 标记已加载过数据
-            hasLoadedRef.current = true;
-          }
-        } else {
-          if (isMounted.current) {
-            setError(response.msg || "获取场景列表失败")
-          }
-        }
-      } catch (err) {
-        console.error("Failed to fetch scenes:", err)
-        if (isMounted.current) {
-          setError("获取场景列表失败")
-        }
-      } finally {
-        if (isMounted.current) {
-          setLoading(false)
-        }
-      }
-    }
-    
-    loadScenes()
-  }, [])
-
-  const handleChannelClick = (channelId: string, event: React.MouseEvent) => {
-    router.push(`/scenarios/${channelId}`)
-  }
-
-  const getStatusColor = (status: string) => {
-    switch (status) {
-      case "active":
-        return "bg-green-100 text-green-700"
-      case "paused":
-        return "bg-amber-100 text-amber-700"
-      case "completed":
-        return "bg-blue-100 text-blue-700"
-      default:
-        return "bg-gray-100 text-gray-700"
-    }
-  }
-
-  const getStatusText = (status: string) => {
-    switch (status) {
-      case "active":
-        return "执行中"
-      case "paused":
-        return "已暂停"
-      case "completed":
-        return "已完成"
-      default:
-        return "未知状态"
-    }
-  }
-  
-  // 展示场景骨架屏
-  const renderSkeletons = () => {
-    return Array(8)
-      .fill(0)
-      .map((_, index) => (
-        <div key={`skeleton-${index}`} className="flex flex-col">
-          <Card className="p-4">
-            <div className="flex flex-col items-center text-center space-y-3">
-              <Skeleton className="w-12 h-12 rounded-xl" />
-              <Skeleton className="h-4 w-24" />
-              <div className="flex items-center space-x-1">
-                <Skeleton className="h-3 w-3 rounded-full" />
-                <Skeleton className="h-4 w-16" />
-              </div>
-              <Skeleton className="h-3 w-12" />
-            </div>
-          </Card>
-        </div>
-      ))
-  }
+  // AI智能获客
+  const aiScenarios = [
+    {
+      id: "ai-friend",
+      name: "AI智能加友",
+      icon: "🤖",
+      count: 245,
+      growth: "+18.5%",
+      description: "智能分析目标用户画像，自动筛选优质客户",
+      path: "/scenarios/ai-friend",
+    },
+    {
+      id: "ai-group",
+      name: "AI群引流",
+      icon: "🤖",
+      count: 178,
+      growth: "+15.2%",
+      description: "智能群管理，提高群活跃度，增强获客效果",
+      path: "/scenarios/ai-group",
+    },
+    {
+      id: "ai-conversion",
+      name: "AI场景转化",
+      icon: "🤖",
+      count: 134,
+      growth: "+12.8%",
+      description: "多场景智能营销，提升获客转化率",
+      path: "/scenarios/ai-conversion",
+    },
+  ]
 
   return (
-    <div className="flex-1 bg-gray-50">
-      <div className="w-full mx-auto bg-white min-h-screen lg:max-w-7xl xl:max-w-[1200px]">
-        <header className="sticky top-0 z-10 bg-white border-b">
-          <div className="flex justify-between items-center p-4">
-            <div className="flex items-center space-x-3">
-              <h1 className="text-xl font-semibold text-blue-600">场景获客</h1>
-            </div>
+    <div className="flex flex-col min-h-screen bg-gray-50">
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between p-4">
+          <h1 className="text-xl font-semibold">场景获客</h1>
+          {/* <Button onClick={() => router.push("/plans/new")} size="sm"> */}
+          <Button onClick={() => router.push("/scenarios/new")} size="sm">
+            <Plus className="h-4 w-4 mr-1" />
+            新建计划
+          </Button>
+        </div>
+      </header>
 
-            <Button className="bg-blue-600 hover:bg-blue-700" onClick={() => router.push("/plans/new")}>
-              <Plus className="h-4 w-4 mr-2" />
-              新建计划
-            </Button>
+      <div className="flex-1 p-4 pb-20">
+        <div className="grid grid-cols-2 gap-4">
+          {scenarios.map((scenario) => (
+            <Card
+              key={scenario.id}
+              className="overflow-hidden hover:shadow-md transition-shadow cursor-pointer"
+              onClick={() => router.push(scenario.path)}
+            >
+              <CardContent className="p-4 flex flex-col items-center">
+                <div className="text-3xl mb-2">{scenario.icon}</div>
+                <h3 className="text-blue-600 font-medium text-center">{scenario.name}</h3>
+                <div className="flex items-center mt-2 text-gray-500 text-sm">
+                  <span>今日: </span>
+                  <span className="font-medium ml-1">{scenario.count}</span>
+                </div>
+                <div className="flex items-center mt-1 text-green-500 text-xs">
+                  <TrendingUp className="h-3 w-3 mr-1" />
+                  <span>{scenario.growth}</span>
+                </div>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+
+        <div className="mt-6">
+          <div className="flex items-center mb-4">
+            <h2 className="text-lg font-medium">AI智能获客</h2>
+            <Badge variant="outline" className="ml-2 bg-blue-50 text-blue-600">
+              Beta
+            </Badge>
           </div>
-        </header>
 
-        <div className="p-4 space-y-6">
-          {/* 错误提示 */}
-          {error && (
-            <div className="bg-red-50 text-red-600 p-4 rounded-md">
-              <p>{error}</p>
-              <Button 
-                variant="outline" 
-                className="mt-2" 
-                onClick={() => window.location.reload()}
+          <div className="grid grid-cols-2 gap-4">
+            {aiScenarios.map((scenario) => (
+              <Card
+                key={scenario.id}
+                className="overflow-hidden hover:shadow-md transition-shadow cursor-pointer"
+                onClick={() => router.push(scenario.path)}
               >
-                重试
-              </Button>
-            </div>
-          )}
-          
-          {/* Traditional channels */}
-          <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4">
-            {loading ? (
-              renderSkeletons()
-            ) : (
-              channels.map((channel) => (
-                <div key={channel.id} className="flex flex-col">
-                  <Card
-                    className={`p-4 hover:shadow-lg transition-all cursor-pointer`}
-                    onClick={() => router.push(channel.link || "")}
-                  >
-                    <div className="flex flex-col items-center text-center space-y-3">
-                      <div className="w-12 h-12 rounded-xl bg-white flex items-center justify-center shadow-sm">
-                        <img
-                          src={channel.icon || "/placeholder.svg"}
-                          alt={channel.name}
-                          className="w-8 h-8 object-contain"
-                          onError={(e) => {
-                            // 图片加载失败时，使用默认图标
-                            const target = e.target as HTMLImageElement
-                            target.src = "/assets/icons/poster-icon.svg"
-                          }}
-                        />
-                      </div>
-
-                      <h3 className="text-sm font-medium text-blue-600">{channel.name}</h3>
-
-                      <div className="flex items-center space-x-1">
-                        <Users className="w-3 h-3 text-gray-400" />
-                        <div className="flex items-baseline">
-                          <span className="text-xs text-gray-500">今日：</span>
-                          <span className="text-base font-medium ml-1">{channel.stats.daily}</span>
-                        </div>
-                      </div>
-
-                      <div className="flex items-center text-green-500 text-xs">
-                        <TrendingUp className="w-3 h-3 mr-1" />
-                        <span>{channel.stats.growth > 0 ? "+" : ""}{channel.stats.growth}%</span>
-                      </div>
-                    </div>
-                  </Card>
-                </div>
-              ))
-            )}
-          </div>
-
-          {/* AI scenarios */}
-          <div>
-            <div className="flex items-center space-x-2 mb-3">
-              <Bot className="w-5 h-5 text-blue-600" />
-              <h2 className="text-lg font-medium">AI智能获客</h2>
-              <span className="px-2 py-0.5 bg-blue-50 text-blue-600 text-xs rounded-full">Beta</span>
-            </div>
-            <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4">
-              {aiScenarios.map((scenario) => (
-                <div key={scenario.id} className="flex flex-col">
-                  <Card
-                    className={`p-4 hover:shadow-lg transition-all bg-gradient-to-br from-blue-50/50 to-white border-2 border-blue-100`}
-                    onClick={() => router.push(scenario.link || "")}
-                  >
-                    <div className="flex flex-col items-center text-center space-y-3">
-                      <div className="w-12 h-12 rounded-xl bg-blue-50 flex items-center justify-center shadow-sm">
-                        <Sparkles className="w-6 h-6 text-blue-500" />
-                      </div>
-
-                      <h3 className="text-sm font-medium text-blue-600">{scenario.name}</h3>
-                      <p className="text-xs text-gray-500 text-center line-clamp-2">{scenario.description}</p>
-
-                      <div className="flex items-center space-x-1">
-                        <Users className="w-3 h-3 text-gray-400" />
-                        <div className="flex items-baseline">
-                          <span className="text-xs text-gray-500">今日：</span>
-                          <span className="text-base font-medium ml-1">{scenario.stats.daily}</span>
-                        </div>
-                      </div>
-
-                      <div className="flex items-center text-green-500 text-xs">
-                        <TrendingUp className="w-3 h-3 mr-1" />
-                        <span>+{scenario.stats.growth}%</span>
-                      </div>
-                    </div>
-                  </Card>
-                </div>
-              ))}
-            </div>
+                <CardContent className="p-4 flex flex-col items-center">
+                  <div className="text-3xl mb-2">{scenario.icon}</div>
+                  <h3 className="text-blue-600 font-medium text-center">{scenario.name}</h3>
+                  <p className="text-xs text-gray-500 text-center mt-1 line-clamp-2">{scenario.description}</p>
+                  <div className="flex items-center mt-2 text-gray-500 text-sm">
+                    <span>今日: </span>
+                    <span className="font-medium ml-1">{scenario.count}</span>
+                  </div>
+                  <div className="flex items-center mt-1 text-green-500 text-xs">
+                    <TrendingUp className="h-3 w-3 mr-1" />
+                    <span>{scenario.growth}</span>
+                  </div>
+                </CardContent>
+              </Card>
+            ))}
           </div>
         </div>
       </div>
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/payment/[id]/page.tsx b/Cunkebao/app/scenarios/payment/[id]/page.tsx
new file mode 100644
index 00000000..7f5f4545
--- /dev/null
+++ b/Cunkebao/app/scenarios/payment/[id]/page.tsx
@@ -0,0 +1,377 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import Image from "next/image"
+import { ChevronLeft, Download, Share2, QrCode, Copy, BarChart4, Users } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent } from "@/components/ui/card"
+import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs"
+import { Badge } from "@/components/ui/badge"
+import { Switch } from "@/components/ui/switch"
+import { toast } from "@/components/ui/use-toast"
+
+export default function PaymentCodeDetailPage({ params }: { params: { id: string } }) {
+  const router = useRouter()
+  const [activeTab, setActiveTab] = useState("detail")
+
+  // 模拟数据
+  const paymentCode = {
+    id: params.id,
+    name: "社群会员付款码",
+    amount: "19.9",
+    description: "加入VIP社群会员",
+    status: "active",
+    qrCodeUrl: "/placeholder.svg?height=300&width=300&query=QR%20Code",
+    paymentMethod: "wechat",
+    createTime: "2023-10-26 11:00:00",
+    totalPayments: 156,
+    totalAmount: 3104.4,
+    distribution: {
+      enabled: true,
+      type: "percentage",
+      value: "10%",
+      totalDistributed: 310.44,
+    },
+    redPacket: {
+      enabled: true,
+      amount: "5",
+      totalSent: 156,
+      totalAmount: 780,
+    },
+    autoWelcome: {
+      enabled: true,
+      message: "感谢您的支付，欢迎加入我们的VIP社群！",
+    },
+    tags: ["付款客户", "社群会员", "已成交"],
+  }
+
+  const recentPayments = [
+    { id: 1, user: "用户1", amount: "19.9", time: "2023-10-26 15:30:00", status: "success" },
+    { id: 2, user: "用户2", amount: "19.9", time: "2023-10-26 14:45:00", status: "success" },
+    { id: 3, user: "用户3", amount: "19.9", time: "2023-10-26 13:20:00", status: "success" },
+    { id: 4, user: "用户4", amount: "19.9", time: "2023-10-26 12:10:00", status: "success" },
+    { id: 5, user: "用户5", amount: "19.9", time: "2023-10-26 11:05:00", status: "success" },
+  ]
+
+  const handleStatusChange = (checked: boolean) => {
+    toast({
+      title: checked ? "付款码已启用" : "付款码已停用",
+      description: checked ? "客户现在可以通过此付款码支付" : "客户将无法通过此付款码支付",
+    })
+  }
+
+  const handleCopy = (text: string) => {
+    navigator.clipboard.writeText(text)
+    toast({
+      title: "复制成功",
+      description: "内容已复制到剪贴板",
+    })
+  }
+
+  const handleDownload = () => {
+    toast({
+      title: "下载成功",
+      description: "付款码已保存到相册",
+    })
+  }
+
+  const handleShare = () => {
+    toast({
+      title: "分享成功",
+      description: "付款码已分享",
+    })
+  }
+
+  return (
+    <div className="flex flex-col min-h-screen bg-gray-50">
+      {/* 头部 */}
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between h-14 px-4">
+          <div className="flex items-center">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="ml-2 text-lg font-medium">付款码详情</h1>
+          </div>
+          <div className="flex items-center">
+            <Switch checked={paymentCode.status === "active"} onCheckedChange={handleStatusChange} />
+            <span className="ml-2 text-sm">{paymentCode.status === "active" ? "启用中" : "已停用"}</span>
+          </div>
+        </div>
+      </header>
+
+      {/* 标签页 */}
+      <div className="flex-1 px-4 pb-20">
+        <Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
+          <TabsList className="grid grid-cols-3 mb-4">
+            <TabsTrigger value="detail" className="text-xs">
+              <QrCode className="h-4 w-4 mr-1" />
+              付款码
+            </TabsTrigger>
+            <TabsTrigger value="payments" className="text-xs">
+              <BarChart4 className="h-4 w-4 mr-1" />
+              支付记录
+            </TabsTrigger>
+            <TabsTrigger value="settings" className="text-xs">
+              <Users className="h-4 w-4 mr-1" />
+              高级设置
+            </TabsTrigger>
+          </TabsList>
+
+          {/* 付款码详情 */}
+          <TabsContent value="detail" className="space-y-4">
+            <Card>
+              <CardContent className="p-4 flex flex-col items-center">
+                <h2 className="font-medium text-center mb-2">{paymentCode.name}</h2>
+                <p className="text-sm text-gray-500 mb-4">{paymentCode.description}</p>
+
+                <div className="relative w-64 h-64 mb-4">
+                  <Image
+                    src={paymentCode.qrCodeUrl || "/placeholder.svg"}
+                    alt="付款码"
+                    fill
+                    className="object-contain"
+                  />
+                </div>
+
+                <div className="text-center mb-4">
+                  <Badge variant="outline" className="text-green-500 bg-green-50">
+                    ¥{paymentCode.amount}
+                  </Badge>
+                </div>
+
+                <div className="flex justify-center space-x-4 w-full">
+                  <Button variant="outline" size="sm" onClick={handleDownload}>
+                    <Download className="h-4 w-4 mr-1" />
+                    下载
+                  </Button>
+                  <Button variant="outline" size="sm" onClick={handleShare}>
+                    <Share2 className="h-4 w-4 mr-1" />
+                    分享
+                  </Button>
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => handleCopy(`付款码：${paymentCode.name}，金额：${paymentCode.amount}元`)}
+                  >
+                    <Copy className="h-4 w-4 mr-1" />
+                    复制
+                  </Button>
+                </div>
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">付款码信息</h3>
+                <div className="space-y-3">
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">付款码ID</span>
+                    <span className="font-medium">{paymentCode.id}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">支付方式</span>
+                    <span className="font-medium">
+                      {paymentCode.paymentMethod === "wechat"
+                        ? "微信支付"
+                        : paymentCode.paymentMethod === "alipay"
+                          ? "支付宝"
+                          : "微信和支付宝"}
+                    </span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">创建时间</span>
+                    <span className="font-medium">{paymentCode.createTime}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">支付笔数</span>
+                    <span className="font-medium">{paymentCode.totalPayments}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2">
+                    <span className="text-gray-500">支付金额</span>
+                    <span className="font-medium">¥{paymentCode.totalAmount}</span>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          </TabsContent>
+
+          {/* 支付记录 */}
+          <TabsContent value="payments" className="space-y-4">
+            <Card>
+              <CardContent className="p-4">
+                <div className="flex justify-between items-center mb-3">
+                  <h3 className="font-medium">最近支付记录</h3>
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    className="text-blue-500"
+                    onClick={() => router.push(`/scenarios/payment/${params.id}/payments`)}
+                  >
+                    查看全部
+                  </Button>
+                </div>
+
+                <div className="space-y-3">
+                  {recentPayments.map((payment) => (
+                    <div key={payment.id} className="flex justify-between items-center py-2 border-b last:border-0">
+                      <div>
+                        <p className="font-medium">{payment.user}</p>
+                        <p className="text-xs text-gray-500">{payment.time}</p>
+                      </div>
+                      <div className="text-right">
+                        <p className="font-medium">¥{payment.amount}</p>
+                        <Badge variant="outline" className="text-green-500 bg-green-50 text-xs">
+                          支付成功
+                        </Badge>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">支付统计</h3>
+                <div className="space-y-3">
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">总支付笔数</span>
+                    <span className="font-medium">{paymentCode.totalPayments}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">总支付金额</span>
+                    <span className="font-medium">¥{paymentCode.totalAmount}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">平均客单价</span>
+                    <span className="font-medium">
+                      ¥{(paymentCode.totalAmount / paymentCode.totalPayments).toFixed(2)}
+                    </span>
+                  </div>
+                  <div className="flex justify-between items-center py-2">
+                    <span className="text-gray-500">新增客户数</span>
+                    <span className="font-medium">{Math.floor(paymentCode.totalPayments * 0.9)}</span>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          </TabsContent>
+
+          {/* 高级设置 */}
+          <TabsContent value="settings" className="space-y-4">
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">分销返利设置</h3>
+                <div className="flex items-center justify-between mb-3">
+                  <span className="text-gray-500">启用分销返利</span>
+                  <Switch checked={paymentCode.distribution.enabled} />
+                </div>
+
+                {paymentCode.distribution.enabled && (
+                  <div className="space-y-3 pl-4 border-l-2 border-blue-100">
+                    <div className="flex justify-between items-center py-2 border-b">
+                      <span className="text-gray-500">返利类型</span>
+                      <span className="font-medium">
+                        {paymentCode.distribution.type === "percentage" ? "比例返利" : "固定金额"}
+                      </span>
+                    </div>
+                    <div className="flex justify-between items-center py-2 border-b">
+                      <span className="text-gray-500">返利值</span>
+                      <span className="font-medium">{paymentCode.distribution.value}</span>
+                    </div>
+                    <div className="flex justify-between items-center py-2">
+                      <span className="text-gray-500">已发放金额</span>
+                      <span className="font-medium">¥{paymentCode.distribution.totalDistributed}</span>
+                    </div>
+                  </div>
+                )}
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">红包奖励设置</h3>
+                <div className="flex items-center justify-between mb-3">
+                  <span className="text-gray-500">启用红包奖励</span>
+                  <Switch checked={paymentCode.redPacket.enabled} />
+                </div>
+
+                {paymentCode.redPacket.enabled && (
+                  <div className="space-y-3 pl-4 border-l-2 border-blue-100">
+                    <div className="flex justify-between items-center py-2 border-b">
+                      <span className="text-gray-500">红包金额</span>
+                      <span className="font-medium">¥{paymentCode.redPacket.amount}</span>
+                    </div>
+                    <div className="flex justify-between items-center py-2 border-b">
+                      <span className="text-gray-500">已发放数量</span>
+                      <span className="font-medium">{paymentCode.redPacket.totalSent}</span>
+                    </div>
+                    <div className="flex justify-between items-center py-2">
+                      <span className="text-gray-500">已发放金额</span>
+                      <span className="font-medium">¥{paymentCode.redPacket.totalAmount}</span>
+                    </div>
+                  </div>
+                )}
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">自动欢迎语设置</h3>
+                <div className="flex items-center justify-between mb-3">
+                  <span className="text-gray-500">启用自动欢迎语</span>
+                  <Switch checked={paymentCode.autoWelcome.enabled} />
+                </div>
+
+                {paymentCode.autoWelcome.enabled && (
+                  <div className="pl-4 border-l-2 border-blue-100">
+                    <div className="py-2">
+                      <span className="text-gray-500 block mb-2">欢迎语内容</span>
+                      <div className="bg-gray-50 p-3 rounded-md text-sm">{paymentCode.autoWelcome.message}</div>
+                    </div>
+                  </div>
+                )}
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">客户标签设置</h3>
+                <div className="flex flex-wrap gap-2">
+                  {paymentCode.tags.map((tag, index) => (
+                    <Badge key={index} variant="outline" className="rounded-full">
+                      {tag}
+                    </Badge>
+                  ))}
+                  <Button variant="outline" size="sm" className="rounded-full text-blue-500">
+                    + 添加标签
+                  </Button>
+                </div>
+              </CardContent>
+            </Card>
+
+            <div className="flex justify-center mt-6">
+              <Button
+                variant="outline"
+                className="text-red-500 border-red-200 hover:bg-red-50"
+                onClick={() => {
+                  if (confirm("确定要删除此付款码吗？删除后将无法恢复。")) {
+                    toast({
+                      title: "付款码已删除",
+                      description: "付款码已成功删除",
+                    })
+                    router.push("/scenarios/payment")
+                  }
+                }}
+              >
+                删除付款码
+              </Button>
+            </div>
+          </TabsContent>
+        </Tabs>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/payment/[id]/payments/loading.tsx b/Cunkebao/app/scenarios/payment/[id]/payments/loading.tsx
new file mode 100644
index 00000000..f15322a8
--- /dev/null
+++ b/Cunkebao/app/scenarios/payment/[id]/payments/loading.tsx
@@ -0,0 +1,3 @@
+export default function Loading() {
+  return null
+}
diff --git a/Cunkebao/app/scenarios/payment/[id]/payments/page.tsx b/Cunkebao/app/scenarios/payment/[id]/payments/page.tsx
new file mode 100644
index 00000000..dc7c5748
--- /dev/null
+++ b/Cunkebao/app/scenarios/payment/[id]/payments/page.tsx
@@ -0,0 +1,263 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Download, Filter, Search } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent } from "@/components/ui/card"
+import { Input } from "@/components/ui/input"
+import { Badge } from "@/components/ui/badge"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+import { DatePickerWithRange } from "@/components/ui/date-picker"
+import {
+  Pagination,
+  PaginationContent,
+  PaginationItem,
+  PaginationLink,
+  PaginationNext,
+  PaginationPrevious,
+} from "@/components/ui/pagination"
+import { toast } from "@/components/ui/use-toast"
+
+export default function PaymentRecordsPage({ params }: { params: { id: string } }) {
+  const router = useRouter()
+  const [searchTerm, setSearchTerm] = useState("")
+  const [statusFilter, setStatusFilter] = useState("all")
+  const [currentPage, setCurrentPage] = useState(1)
+  const [showFilters, setShowFilters] = useState(false)
+
+  // 模拟数据
+  const paymentRecords = Array.from({ length: 50 }, (_, i) => ({
+    id: i + 1,
+    transactionId: `WX${Date.now()}${i}`,
+    user: `用户${i + 1}`,
+    platformUserId: `oq_${Math.random().toString(36).substr(2, 9)}`,
+    amount: "19.9",
+    paymentTime: new Date(Date.now() - i * 3600000).toLocaleString(),
+    status: i % 10 === 0 ? "refunded" : "success",
+    paymentMethod: "wechat",
+    customerTags: ["付款客户", "社群会员"],
+  }))
+
+  const itemsPerPage = 10
+  const totalPages = Math.ceil(paymentRecords.length / itemsPerPage)
+  const startIndex = (currentPage - 1) * itemsPerPage
+  const endIndex = startIndex + itemsPerPage
+  const currentRecords = paymentRecords.slice(startIndex, endIndex)
+
+  const handleExport = () => {
+    toast({
+      title: "导出成功",
+      description: "支付记录已导出为Excel文件",
+    })
+  }
+
+  const getStatusBadge = (status: string) => {
+    switch (status) {
+      case "success":
+        return (
+          <Badge variant="outline" className="text-green-500 bg-green-50">
+            支付成功
+          </Badge>
+        )
+      case "refunded":
+        return (
+          <Badge variant="outline" className="text-orange-500 bg-orange-50">
+            已退款
+          </Badge>
+        )
+      case "failed":
+        return (
+          <Badge variant="outline" className="text-red-500 bg-red-50">
+            支付失败
+          </Badge>
+        )
+      default:
+        return <Badge variant="outline">{status}</Badge>
+    }
+  }
+
+  return (
+    <div className="flex flex-col min-h-screen bg-gray-50">
+      {/* 头部 */}
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between h-14 px-4">
+          <div className="flex items-center">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="ml-2 text-lg font-medium">支付记录</h1>
+          </div>
+          <div className="flex items-center gap-2">
+            <Button variant="ghost" size="icon" onClick={() => setShowFilters(!showFilters)}>
+              <Filter className="h-5 w-5" />
+            </Button>
+            <Button variant="ghost" size="icon" onClick={handleExport}>
+              <Download className="h-5 w-5" />
+            </Button>
+          </div>
+        </div>
+      </header>
+
+      {/* 搜索和筛选 */}
+      <div className="p-4 space-y-4">
+        <div className="relative">
+          <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />
+          <Input
+            placeholder="搜索用户名、交易ID"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+            className="pl-10"
+          />
+        </div>
+
+        {showFilters && (
+          <Card>
+            <CardContent className="p-4 space-y-4">
+              <div>
+                <label className="text-sm font-medium mb-1.5 block">支付状态</label>
+                <Select value={statusFilter} onValueChange={setStatusFilter}>
+                  <SelectTrigger>
+                    <SelectValue placeholder="选择状态" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">全部</SelectItem>
+                    <SelectItem value="success">支付成功</SelectItem>
+                    <SelectItem value="refunded">已退款</SelectItem>
+                    <SelectItem value="failed">支付失败</SelectItem>
+                  </SelectContent>
+                </Select>
+              </div>
+
+              <div>
+                <label className="text-sm font-medium mb-1.5 block">支付时间</label>
+                <DatePickerWithRange />
+              </div>
+
+              <div className="flex gap-2">
+                <Button
+                  variant="outline"
+                  className="flex-1"
+                  onClick={() => {
+                    setStatusFilter("all")
+                    setSearchTerm("")
+                  }}
+                >
+                  重置
+                </Button>
+                <Button className="flex-1">应用筛选</Button>
+              </div>
+            </CardContent>
+          </Card>
+        )}
+      </div>
+
+      {/* 统计信息 */}
+      <div className="px-4 pb-4">
+        <Card>
+          <CardContent className="p-4">
+            <div className="grid grid-cols-3 gap-4 text-center">
+              <div>
+                <p className="text-sm text-gray-500">总支付笔数</p>
+                <p className="text-xl font-semibold">{paymentRecords.length}</p>
+              </div>
+              <div>
+                <p className="text-sm text-gray-500">总支付金额</p>
+                <p className="text-xl font-semibold">¥{(paymentRecords.length * 19.9).toFixed(2)}</p>
+              </div>
+              <div>
+                <p className="text-sm text-gray-500">成功率</p>
+                <p className="text-xl font-semibold">90%</p>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+
+      {/* 记录列表 - 移动端优化 */}
+      <div className="flex-1 px-4 pb-20">
+        <div className="space-y-3">
+          {currentRecords.map((record) => (
+            <Card key={record.id}>
+              <CardContent className="p-4">
+                <div className="flex justify-between items-start mb-2">
+                  <div>
+                    <p className="font-medium">{record.user}</p>
+                    <p className="text-xs text-gray-500">交易ID: {record.transactionId}</p>
+                  </div>
+                  {getStatusBadge(record.status)}
+                </div>
+
+                <div className="space-y-1 text-sm">
+                  <div className="flex justify-between">
+                    <span className="text-gray-500">支付金额</span>
+                    <span className="font-medium">¥{record.amount}</span>
+                  </div>
+                  <div className="flex justify-between">
+                    <span className="text-gray-500">支付时间</span>
+                    <span>{record.paymentTime}</span>
+                  </div>
+                  <div className="flex justify-between">
+                    <span className="text-gray-500">支付方式</span>
+                    <span>{record.paymentMethod === "wechat" ? "微信支付" : "支付宝"}</span>
+                  </div>
+                </div>
+
+                <div className="mt-3 flex flex-wrap gap-1">
+                  {record.customerTags.map((tag, index) => (
+                    <Badge key={index} variant="outline" className="text-xs">
+                      {tag}
+                    </Badge>
+                  ))}
+                </div>
+
+                <div className="mt-3 pt-3 border-t">
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    className="w-full text-blue-500"
+                    onClick={() => router.push(`/wechat-accounts/${record.platformUserId}`)}
+                  >
+                    查看客户详情
+                  </Button>
+                </div>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+
+        {/* 分页 */}
+        <div className="mt-6">
+          <Pagination>
+            <PaginationContent>
+              <PaginationItem>
+                <PaginationPrevious
+                  onClick={() => setCurrentPage(Math.max(1, currentPage - 1))}
+                  className={currentPage === 1 ? "pointer-events-none opacity-50" : ""}
+                />
+              </PaginationItem>
+
+              {[...Array(Math.min(5, totalPages))].map((_, i) => {
+                const pageNumber = i + 1
+                return (
+                  <PaginationItem key={pageNumber}>
+                    <PaginationLink onClick={() => setCurrentPage(pageNumber)} isActive={currentPage === pageNumber}>
+                      {pageNumber}
+                    </PaginationLink>
+                  </PaginationItem>
+                )
+              })}
+
+              <PaginationItem>
+                <PaginationNext
+                  onClick={() => setCurrentPage(Math.min(totalPages, currentPage + 1))}
+                  className={currentPage === totalPages ? "pointer-events-none opacity-50" : ""}
+                />
+              </PaginationItem>
+            </PaginationContent>
+          </Pagination>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/payment/new/page.tsx b/Cunkebao/app/scenarios/payment/new/page.tsx
new file mode 100644
index 00000000..d87bbd25
--- /dev/null
+++ b/Cunkebao/app/scenarios/payment/new/page.tsx
@@ -0,0 +1,307 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Info } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent } from "@/components/ui/card"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { Textarea } from "@/components/ui/textarea"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+import { Switch } from "@/components/ui/switch"
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
+import { toast } from "@/components/ui/use-toast"
+
+export default function NewPaymentCodePage() {
+  const router = useRouter()
+  const [formData, setFormData] = useState({
+    name: "",
+    amount: "",
+    description: "",
+    paymentMethod: "wechat",
+    amountType: "fixed",
+    enableDistribution: false,
+    distributionType: "percentage",
+    distributionValue: "",
+    enableRedPacket: false,
+    redPacketAmount: "",
+    enableAutoWelcome: false,
+    welcomeMessage: "",
+    tags: [],
+  })
+
+  const handleChange = (field: string, value: any) => {
+    setFormData((prev) => ({ ...prev, [field]: value }))
+  }
+
+  const handleSubmit = () => {
+    // 表单验证
+    if (!formData.name) {
+      toast({
+        title: "请输入付款码名称",
+        variant: "destructive",
+      })
+      return
+    }
+
+    if (formData.amountType === "fixed" && !formData.amount) {
+      toast({
+        title: "请输入付款金额",
+        variant: "destructive",
+      })
+      return
+    }
+
+    // 模拟API调用
+    setTimeout(() => {
+      toast({
+        title: "付款码创建成功",
+        description: "您可以在付款码列表中查看和管理",
+      })
+      router.push("/scenarios/payment")
+    }, 1000)
+  }
+
+  return (
+    <div className="flex flex-col min-h-screen bg-gray-50">
+      {/* 头部 */}
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between h-14 px-4">
+          <div className="flex items-center">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="ml-2 text-lg font-medium">新建付款码</h1>
+          </div>
+        </div>
+      </header>
+
+      {/* 表单内容 */}
+      <div className="flex-1 p-4 pb-20">
+        <Card className="mb-4">
+          <CardContent className="p-4 space-y-4">
+            <h2 className="font-medium">基本信息</h2>
+
+            <div className="space-y-2">
+              <Label htmlFor="name">付款码名称</Label>
+              <Input
+                id="name"
+                placeholder="请输入付款码名称"
+                value={formData.name}
+                onChange={(e) => handleChange("name", e.target.value)}
+              />
+            </div>
+
+            <div className="space-y-2">
+              <Label htmlFor="paymentMethod">支付方式</Label>
+              <Select value={formData.paymentMethod} onValueChange={(value) => handleChange("paymentMethod", value)}>
+                <SelectTrigger id="paymentMethod">
+                  <SelectValue placeholder="选择支付方式" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="wechat">微信支付</SelectItem>
+                  <SelectItem value="alipay">支付宝</SelectItem>
+                  <SelectItem value="both">微信和支付宝</SelectItem>
+                </SelectContent>
+              </Select>
+            </div>
+
+            <div className="space-y-2">
+              <div className="flex items-center justify-between">
+                <Label>金额设置</Label>
+                <TooltipProvider>
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <Info className="h-4 w-4 text-gray-400" />
+                    </TooltipTrigger>
+                    <TooltipContent>
+                      <p className="w-[200px] text-xs">
+                        固定金额：生成固定金额的付款码
+                        <br />
+                        自由金额：用户可自行输入支付金额
+                      </p>
+                    </TooltipContent>
+                  </Tooltip>
+                </TooltipProvider>
+              </div>
+              <RadioGroup
+                value={formData.amountType}
+                onValueChange={(value) => handleChange("amountType", value)}
+                className="flex flex-col space-y-1"
+              >
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="fixed" id="fixed" />
+                  <Label htmlFor="fixed">固定金额</Label>
+                </div>
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="free" id="free" />
+                  <Label htmlFor="free">自由金额</Label>
+                </div>
+              </RadioGroup>
+            </div>
+
+            {formData.amountType === "fixed" && (
+              <div className="space-y-2">
+                <Label htmlFor="amount">付款金额 (元)</Label>
+                <Input
+                  id="amount"
+                  type="number"
+                  step="0.01"
+                  placeholder="请输入付款金额"
+                  value={formData.amount}
+                  onChange={(e) => handleChange("amount", e.target.value)}
+                />
+              </div>
+            )}
+
+            <div className="space-y-2">
+              <Label htmlFor="description">付款描述</Label>
+              <Textarea
+                id="description"
+                placeholder="请输入付款描述，用户支付时可见"
+                value={formData.description}
+                onChange={(e) => handleChange("description", e.target.value)}
+                rows={3}
+              />
+            </div>
+          </CardContent>
+        </Card>
+
+        <Card className="mb-4">
+          <CardContent className="p-4 space-y-4">
+            <h2 className="font-medium">高级设置</h2>
+
+            <div className="flex items-center justify-between">
+              <div className="space-y-1">
+                <Label htmlFor="enableDistribution">启用分销返利</Label>
+                <p className="text-xs text-gray-500">开启后，用户付款可触发分销返利</p>
+              </div>
+              <Switch
+                id="enableDistribution"
+                checked={formData.enableDistribution}
+                onCheckedChange={(checked) => handleChange("enableDistribution", checked)}
+              />
+            </div>
+
+            {formData.enableDistribution && (
+              <div className="space-y-4 pl-4 border-l-2 border-blue-100">
+                <div className="space-y-2">
+                  <Label htmlFor="distributionType">返利类型</Label>
+                  <Select
+                    value={formData.distributionType}
+                    onValueChange={(value) => handleChange("distributionType", value)}
+                  >
+                    <SelectTrigger id="distributionType">
+                      <SelectValue placeholder="选择返利类型" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value="percentage">比例返利</SelectItem>
+                      <SelectItem value="fixed">固定金额</SelectItem>
+                    </SelectContent>
+                  </Select>
+                </div>
+
+                <div className="space-y-2">
+                  <Label htmlFor="distributionValue">
+                    {formData.distributionType === "percentage" ? "返利比例 (%)" : "返利金额 (元)"}
+                  </Label>
+                  <Input
+                    id="distributionValue"
+                    type="number"
+                    step={formData.distributionType === "percentage" ? "1" : "0.01"}
+                    placeholder={formData.distributionType === "percentage" ? "例如：10" : "例如：5"}
+                    value={formData.distributionValue}
+                    onChange={(e) => handleChange("distributionValue", e.target.value)}
+                  />
+                </div>
+              </div>
+            )}
+
+            <div className="flex items-center justify-between">
+              <div className="space-y-1">
+                <Label htmlFor="enableRedPacket">启用红包奖励</Label>
+                <p className="text-xs text-gray-500">开启后，用户付款可获得红包奖励</p>
+              </div>
+              <Switch
+                id="enableRedPacket"
+                checked={formData.enableRedPacket}
+                onCheckedChange={(checked) => handleChange("enableRedPacket", checked)}
+              />
+            </div>
+
+            {formData.enableRedPacket && (
+              <div className="space-y-2 pl-4 border-l-2 border-blue-100">
+                <Label htmlFor="redPacketAmount">红包金额 (元)</Label>
+                <Input
+                  id="redPacketAmount"
+                  type="number"
+                  step="0.01"
+                  placeholder="例如：5"
+                  value={formData.redPacketAmount}
+                  onChange={(e) => handleChange("redPacketAmount", e.target.value)}
+                />
+              </div>
+            )}
+
+            <div className="flex items-center justify-between">
+              <div className="space-y-1">
+                <Label htmlFor="enableAutoWelcome">自动欢迎语</Label>
+                <p className="text-xs text-gray-500">开启后，用户付款成功后自动发送欢迎语</p>
+              </div>
+              <Switch
+                id="enableAutoWelcome"
+                checked={formData.enableAutoWelcome}
+                onCheckedChange={(checked) => handleChange("enableAutoWelcome", checked)}
+              />
+            </div>
+
+            {formData.enableAutoWelcome && (
+              <div className="space-y-2 pl-4 border-l-2 border-blue-100">
+                <Label htmlFor="welcomeMessage">欢迎语内容</Label>
+                <Textarea
+                  id="welcomeMessage"
+                  placeholder="请输入欢迎语内容"
+                  value={formData.welcomeMessage}
+                  onChange={(e) => handleChange("welcomeMessage", e.target.value)}
+                  rows={3}
+                />
+              </div>
+            )}
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardContent className="p-4 space-y-4">
+            <h2 className="font-medium">客户标签设置</h2>
+            <p className="text-sm text-gray-500">设置通过此付款码添加的客户自动打上的标签</p>
+
+            <div className="flex flex-wrap gap-2">
+              <Button variant="outline" size="sm" className="rounded-full">
+                付款客户
+              </Button>
+              <Button variant="outline" size="sm" className="rounded-full">
+                高价值
+              </Button>
+              <Button variant="outline" size="sm" className="rounded-full">
+                已成交
+              </Button>
+              <Button variant="outline" size="sm" className="rounded-full text-blue-500">
+                + 添加标签
+              </Button>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+
+      {/* 底部操作栏 */}
+      <div className="fixed bottom-0 left-0 right-0 bg-white border-t p-4 flex justify-between">
+        <Button variant="outline" onClick={() => router.back()}>
+          取消
+        </Button>
+        <Button onClick={handleSubmit}>创建付款码</Button>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/payment/page.tsx b/Cunkebao/app/scenarios/payment/page.tsx
new file mode 100644
index 00000000..2470190d
--- /dev/null
+++ b/Cunkebao/app/scenarios/payment/page.tsx
@@ -0,0 +1,278 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Plus, Settings, QrCode, BarChart4, CreditCard, Users, Gift } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent } from "@/components/ui/card"
+import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs"
+import { Badge } from "@/components/ui/badge"
+
+export default function PaymentCodePage() {
+  const router = useRouter()
+  const [activeTab, setActiveTab] = useState("codes")
+
+  // 模拟数据
+  const paymentCodes = [
+    { id: 1, name: "社群会员付款码", amount: "19.9", status: "active", totalPayments: 156, totalAmount: 3104.4 },
+    { id: 2, name: "课程付款码", amount: "99", status: "active", totalPayments: 78, totalAmount: 7722 },
+    { id: 3, name: "咨询服务付款码", amount: "199", status: "active", totalPayments: 45, totalAmount: 8955 },
+    { id: 4, name: "产品购买付款码", amount: "299", status: "active", totalPayments: 32, totalAmount: 9568 },
+  ]
+
+  const statistics = {
+    today: { payments: 24, amount: 2568, customers: 22 },
+    week: { payments: 156, amount: 15420, customers: 142 },
+    month: { payments: 311, amount: 29845, customers: 289 },
+  }
+
+  const distributions = [
+    { id: 1, name: "分销返利规则1", type: "percentage", value: "10%", totalDistributed: 1245.6 },
+    { id: 2, name: "分销返利规则2", type: "fixed", value: "5元", totalDistributed: 890 },
+  ]
+
+  const redPackets = [
+    { id: 1, name: "新客红包", amount: "5", totalSent: 156, totalAmount: 780 },
+    { id: 2, name: "推广红包", amount: "10", totalSent: 89, totalAmount: 890 },
+  ]
+
+  return (
+    <div className="flex flex-col min-h-screen bg-gray-50">
+      {/* 头部 */}
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between h-14 px-4">
+          <div className="flex items-center">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="ml-2 text-lg font-medium">付款码获客</h1>
+          </div>
+          <div className="flex items-center gap-2">
+            <Button variant="ghost" size="icon" onClick={() => router.push("/scenarios/payment/settings")}>
+              <Settings className="h-5 w-5" />
+            </Button>
+          </div>
+        </div>
+      </header>
+
+      {/* 统计卡片 */}
+      <div className="p-4">
+        <Card>
+          <CardContent className="p-4">
+            <div className="flex justify-between items-center mb-4">
+              <h2 className="text-lg font-medium">数据概览</h2>
+              <Badge variant="outline" className="text-blue-500 bg-blue-50">
+                今日
+              </Badge>
+            </div>
+            <div className="grid grid-cols-3 gap-4">
+              <div className="text-center">
+                <p className="text-sm text-gray-500">支付笔数</p>
+                <p className="text-xl font-semibold">{statistics.today.payments}</p>
+              </div>
+              <div className="text-center">
+                <p className="text-sm text-gray-500">支付金额</p>
+                <p className="text-xl font-semibold">¥{statistics.today.amount}</p>
+              </div>
+              <div className="text-center">
+                <p className="text-sm text-gray-500">新增客户</p>
+                <p className="text-xl font-semibold">{statistics.today.customers}</p>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+
+      {/* 标签页 */}
+      <div className="flex-1 px-4 pb-20">
+        <Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
+          <TabsList className="grid grid-cols-4 mb-4">
+            <TabsTrigger value="codes" className="text-xs">
+              <QrCode className="h-4 w-4 mr-1" />
+              付款码
+            </TabsTrigger>
+            <TabsTrigger value="stats" className="text-xs">
+              <BarChart4 className="h-4 w-4 mr-1" />
+              数据统计
+            </TabsTrigger>
+            <TabsTrigger value="distribution" className="text-xs">
+              <Users className="h-4 w-4 mr-1" />
+              分销返利
+            </TabsTrigger>
+            <TabsTrigger value="redpacket" className="text-xs">
+              <Gift className="h-4 w-4 mr-1" />
+              红包池
+            </TabsTrigger>
+          </TabsList>
+
+          {/* 付款码列表 */}
+          <TabsContent value="codes" className="space-y-4">
+            <div className="flex justify-end">
+              <Button onClick={() => router.push("/scenarios/payment/new")} size="sm">
+                <Plus className="h-4 w-4 mr-1" />
+                新建付款码
+              </Button>
+            </div>
+
+            {paymentCodes.map((code) => (
+              <Card key={code.id} className="overflow-hidden">
+                <CardContent className="p-0">
+                  <div className="flex items-center p-4 border-b">
+                    <div className="bg-blue-100 rounded-full p-2 mr-3">
+                      <CreditCard className="h-5 w-5 text-blue-500" />
+                    </div>
+                    <div className="flex-1">
+                      <h3 className="font-medium">{code.name}</h3>
+                      <p className="text-sm text-gray-500">金额: ¥{code.amount}</p>
+                    </div>
+                    <Badge variant={code.status === "active" ? "success" : "secondary"}>
+                      {code.status === "active" ? "启用中" : "已停用"}
+                    </Badge>
+                  </div>
+                  <div className="grid grid-cols-2 divide-x">
+                    <div className="p-3 text-center">
+                      <p className="text-sm text-gray-500">支付笔数</p>
+                      <p className="font-semibold">{code.totalPayments}</p>
+                    </div>
+                    <div className="p-3 text-center">
+                      <p className="text-sm text-gray-500">支付金额</p>
+                      <p className="font-semibold">¥{code.totalAmount}</p>
+                    </div>
+                  </div>
+                  <div className="p-3 border-t">
+                    <Button
+                      variant="ghost"
+                      className="w-full text-blue-500"
+                      onClick={() => router.push(`/scenarios/payment/${code.id}`)}
+                    >
+                      查看详情
+                    </Button>
+                  </div>
+                </CardContent>
+              </Card>
+            ))}
+          </TabsContent>
+
+          {/* 数据统计 */}
+          <TabsContent value="stats" className="space-y-4">
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">支付数据统计</h3>
+                <div className="space-y-4">
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">今日支付笔数</span>
+                    <span className="font-medium">{statistics.today.payments}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">今日支付金额</span>
+                    <span className="font-medium">¥{statistics.today.amount}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">今日新增客户</span>
+                    <span className="font-medium">{statistics.today.customers}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">本周支付笔数</span>
+                    <span className="font-medium">{statistics.week.payments}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">本周支付金额</span>
+                    <span className="font-medium">¥{statistics.week.amount}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2">
+                    <span className="text-gray-500">本月支付金额</span>
+                    <span className="font-medium">¥{statistics.month.amount}</span>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+
+            <div className="flex justify-center">
+              <Button variant="outline" onClick={() => router.push("/scenarios/payment/stats")}>
+                查看详细统计
+              </Button>
+            </div>
+          </TabsContent>
+
+          {/* 分销返利 */}
+          <TabsContent value="distribution" className="space-y-4">
+            <div className="flex justify-end">
+              <Button onClick={() => router.push("/scenarios/payment/distribution/new")} size="sm">
+                <Plus className="h-4 w-4 mr-1" />
+                新建分销规则
+              </Button>
+            </div>
+
+            {distributions.map((rule) => (
+              <Card key={rule.id}>
+                <CardContent className="p-4">
+                  <div className="flex justify-between items-center mb-3">
+                    <h3 className="font-medium">{rule.name}</h3>
+                    <Badge variant="outline">{rule.type === "percentage" ? "比例" : "固定金额"}</Badge>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">返利值</span>
+                    <span className="font-medium">{rule.value}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2">
+                    <span className="text-gray-500">已发放金额</span>
+                    <span className="font-medium">¥{rule.totalDistributed}</span>
+                  </div>
+                  <div className="mt-3">
+                    <Button
+                      variant="ghost"
+                      className="w-full text-blue-500"
+                      onClick={() => router.push(`/scenarios/payment/distribution/${rule.id}`)}
+                    >
+                      查看详情
+                    </Button>
+                  </div>
+                </CardContent>
+              </Card>
+            ))}
+          </TabsContent>
+
+          {/* 红包池 */}
+          <TabsContent value="redpacket" className="space-y-4">
+            <div className="flex justify-end">
+              <Button onClick={() => router.push("/scenarios/payment/redpacket/new")} size="sm">
+                <Plus className="h-4 w-4 mr-1" />
+                新建红包
+              </Button>
+            </div>
+
+            {redPackets.map((packet) => (
+              <Card key={packet.id}>
+                <CardContent className="p-4">
+                  <div className="flex justify-between items-center mb-3">
+                    <h3 className="font-medium">{packet.name}</h3>
+                    <Badge variant="outline" className="text-red-500 bg-red-50">
+                      ¥{packet.amount}
+                    </Badge>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">已发放数量</span>
+                    <span className="font-medium">{packet.totalSent}</span>
+                  </div>
+                  <div className="flex justify-between items-center py-2">
+                    <span className="text-gray-500">已发放金额</span>
+                    <span className="font-medium">¥{packet.totalAmount}</span>
+                  </div>
+                  <div className="mt-3">
+                    <Button
+                      variant="ghost"
+                      className="w-full text-blue-500"
+                      onClick={() => router.push(`/scenarios/payment/redpacket/${packet.id}`)}
+                    >
+                      查看详情
+                    </Button>
+                  </div>
+                </CardContent>
+              </Card>
+            ))}
+          </TabsContent>
+        </Tabs>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/payment/stats/page.tsx b/Cunkebao/app/scenarios/payment/stats/page.tsx
new file mode 100644
index 00000000..23763d5d
--- /dev/null
+++ b/Cunkebao/app/scenarios/payment/stats/page.tsx
@@ -0,0 +1,260 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Download, Calendar, TrendingUp, TrendingDown } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs"
+import { LineChartComponent, BarChartComponent, PieChartComponent } from "@/app/components/common/Charts"
+import { toast } from "@/components/ui/use-toast"
+
+export default function PaymentStatsPage() {
+  const router = useRouter()
+  const [dateRange, setDateRange] = useState("week")
+  const [activeTab, setActiveTab] = useState("overview")
+
+  // 模拟图表数据
+  const lineChartData = [
+    { name: "周一", 支付笔数: 24, 支付金额: 478.8 },
+    { name: "周二", 支付笔数: 32, 支付金额: 636.8 },
+    { name: "周三", 支付笔数: 28, 支付金额: 557.2 },
+    { name: "周四", 支付笔数: 36, 支付金额: 716.4 },
+    { name: "周五", 支付笔数: 42, 支付金额: 835.8 },
+    { name: "周六", 支付笔数: 38, 支付金额: 756.2 },
+    { name: "周日", 支付笔数: 35, 支付金额: 696.5 },
+  ]
+
+  const barChartData = [
+    { name: "社群会员付款码", 支付笔数: 156, 支付金额: 3104.4 },
+    { name: "课程付款码", 支付笔数: 78, 支付金额: 7722 },
+    { name: "咨询服务付款码", 支付笔数: 45, 支付金额: 8955 },
+    { name: "产品购买付款码", 支付笔数: 32, 支付金额: 9568 },
+  ]
+
+  const pieChartData = [
+    { name: "微信支付", value: 75 },
+    { name: "支付宝", value: 25 },
+  ]
+
+  const lineChartConfig = {
+    支付笔数: { label: "支付笔数", color: "#3b82f6" },
+    支付金额: { label: "支付金额", color: "#10b981" },
+  }
+
+  const barChartConfig = {
+    支付笔数: { label: "支付笔数", color: "#3b82f6" },
+    支付金额: { label: "支付金额", color: "#10b981" },
+  }
+
+  const pieChartConfig = {
+    微信支付: { label: "微信支付", color: "#10b981" },
+    支付宝: { label: "支付宝", color: "#3b82f6" },
+  }
+
+  const handleExport = () => {
+    toast({
+      title: "导出成功",
+      description: "数据统计报表已导出为Excel文件",
+    })
+  }
+
+  return (
+    <div className="flex flex-col min-h-screen bg-gray-50">
+      {/* 头部 */}
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between h-14 px-4">
+          <div className="flex items-center">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="ml-2 text-lg font-medium">数据统计</h1>
+          </div>
+          <Button variant="ghost" size="icon" onClick={handleExport}>
+            <Download className="h-5 w-5" />
+          </Button>
+        </div>
+      </header>
+
+      {/* 日期范围选择 */}
+      <div className="p-4">
+        <Select value={dateRange} onValueChange={setDateRange}>
+          <SelectTrigger>
+            <Calendar className="h-4 w-4 mr-2" />
+            <SelectValue placeholder="选择时间范围" />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectItem value="today">今日</SelectItem>
+            <SelectItem value="week">本周</SelectItem>
+            <SelectItem value="month">本月</SelectItem>
+            <SelectItem value="quarter">本季度</SelectItem>
+            <SelectItem value="year">本年</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
+
+      {/* 统计卡片 */}
+      <div className="px-4 pb-4">
+        <div className="grid grid-cols-2 gap-4">
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center justify-between mb-2">
+                <p className="text-sm text-gray-500">总支付笔数</p>
+                <TrendingUp className="h-4 w-4 text-green-500" />
+              </div>
+              <p className="text-2xl font-semibold">311</p>
+              <p className="text-xs text-green-500 mt-1">+12.5% 较上期</p>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center justify-between mb-2">
+                <p className="text-sm text-gray-500">总支付金额</p>
+                <TrendingUp className="h-4 w-4 text-green-500" />
+              </div>
+              <p className="text-2xl font-semibold">¥29,845</p>
+              <p className="text-xs text-green-500 mt-1">+8.3% 较上期</p>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center justify-between mb-2">
+                <p className="text-sm text-gray-500">新增客户</p>
+                <TrendingDown className="h-4 w-4 text-red-500" />
+              </div>
+              <p className="text-2xl font-semibold">289</p>
+              <p className="text-xs text-red-500 mt-1">-3.2% 较上期</p>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center justify-between mb-2">
+                <p className="text-sm text-gray-500">平均客单价</p>
+                <TrendingUp className="h-4 w-4 text-green-500" />
+              </div>
+              <p className="text-2xl font-semibold">¥95.98</p>
+              <p className="text-xs text-green-500 mt-1">+5.6% 较上期</p>
+            </CardContent>
+          </Card>
+        </div>
+      </div>
+
+      {/* 图表标签页 */}
+      <div className="flex-1 px-4 pb-20">
+        <Tabs value={activeTab} onValueChange={setActiveTab}>
+          <TabsList className="grid grid-cols-3 mb-4">
+            <TabsTrigger value="overview">概览</TabsTrigger>
+            <TabsTrigger value="trend">趋势</TabsTrigger>
+            <TabsTrigger value="distribution">分布</TabsTrigger>
+          </TabsList>
+
+          <TabsContent value="overview" className="space-y-4">
+            <LineChartComponent
+              title="支付趋势"
+              description="本周支付笔数和金额趋势"
+              data={lineChartData}
+              config={lineChartConfig}
+              height={250}
+            />
+
+            <BarChartComponent
+              title="付款码对比"
+              description="各付款码支付情况对比"
+              data={barChartData}
+              config={barChartConfig}
+              height={250}
+            />
+          </TabsContent>
+
+          <TabsContent value="trend" className="space-y-4">
+            <Card>
+              <CardHeader>
+                <CardTitle>支付趋势分析</CardTitle>
+              </CardHeader>
+              <CardContent>
+                <LineChartComponent data={lineChartData} config={lineChartConfig} height={300} />
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">趋势说明</h3>
+                <div className="space-y-2 text-sm">
+                  <p>• 本周支付笔数较上周增长 12.5%</p>
+                  <p>• 周五为支付高峰期，建议加强营销推广</p>
+                  <p>• 周末支付量保持稳定，用户活跃度良好</p>
+                  <p>• 平均每日支付笔数为 33.6 笔</p>
+                </div>
+              </CardContent>
+            </Card>
+          </TabsContent>
+
+          <TabsContent value="distribution" className="space-y-4">
+            <PieChartComponent
+              title="支付方式分布"
+              description="各支付方式占比"
+              data={pieChartData}
+              config={pieChartConfig}
+              height={250}
+            />
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">客户分布</h3>
+                <div className="space-y-3">
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">新客户</span>
+                    <div className="flex items-center">
+                      <span className="font-medium mr-2">289</span>
+                      <span className="text-sm text-gray-500">(92.9%)</span>
+                    </div>
+                  </div>
+                  <div className="flex justify-between items-center py-2 border-b">
+                    <span className="text-gray-500">老客户</span>
+                    <div className="flex items-center">
+                      <span className="font-medium mr-2">22</span>
+                      <span className="text-sm text-gray-500">(7.1%)</span>
+                    </div>
+                  </div>
+                  <div className="flex justify-between items-center py-2">
+                    <span className="text-gray-500">复购率</span>
+                    <span className="font-medium">7.1%</span>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardContent className="p-4">
+                <h3 className="font-medium mb-3">地域分布 TOP5</h3>
+                <div className="space-y-3">
+                  {[
+                    { city: "广州", count: 89, percent: 28.6 },
+                    { city: "深圳", count: 67, percent: 21.5 },
+                    { city: "上海", count: 45, percent: 14.5 },
+                    { city: "北京", count: 38, percent: 12.2 },
+                    { city: "杭州", count: 32, percent: 10.3 },
+                  ].map((item, index) => (
+                    <div key={index} className="flex items-center justify-between">
+                      <span className="text-gray-600">{item.city}</span>
+                      <div className="flex items-center">
+                        <div className="w-24 bg-gray-200 rounded-full h-2 mr-2">
+                          <div className="bg-blue-500 h-2 rounded-full" style={{ width: `${item.percent}%` }} />
+                        </div>
+                        <span className="text-sm font-medium w-12 text-right">{item.count}</span>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              </CardContent>
+            </Card>
+          </TabsContent>
+        </Tabs>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/acquired/loading.tsx b/Cunkebao/app/scenarios/phone/acquired/loading.tsx
index cec067bd..f15322a8 100644
--- a/Cunkebao/app/scenarios/phone/acquired/loading.tsx
+++ b/Cunkebao/app/scenarios/phone/acquired/loading.tsx
@@ -1,4 +1,3 @@
 export default function Loading() {
   return null
 }
-
diff --git a/Cunkebao/app/scenarios/phone/acquired/page.tsx b/Cunkebao/app/scenarios/phone/acquired/page.tsx
index eec32fc0..0ff0759e 100644
--- a/Cunkebao/app/scenarios/phone/acquired/page.tsx
+++ b/Cunkebao/app/scenarios/phone/acquired/page.tsx
@@ -176,4 +176,3 @@ export default function PhoneAcquiredPage() {
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/phone/added/loading.tsx b/Cunkebao/app/scenarios/phone/added/loading.tsx
index cec067bd..f15322a8 100644
--- a/Cunkebao/app/scenarios/phone/added/loading.tsx
+++ b/Cunkebao/app/scenarios/phone/added/loading.tsx
@@ -1,4 +1,3 @@
 export default function Loading() {
   return null
 }
-
diff --git a/Cunkebao/app/scenarios/phone/added/page.tsx b/Cunkebao/app/scenarios/phone/added/page.tsx
index 47bbb34d..a6523b80 100644
--- a/Cunkebao/app/scenarios/phone/added/page.tsx
+++ b/Cunkebao/app/scenarios/phone/added/page.tsx
@@ -130,4 +130,3 @@ export default function PhoneAddedPage() {
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/phone/devices/page.tsx b/Cunkebao/app/scenarios/phone/devices/page.tsx
index 830ef594..f97350c5 100644
--- a/Cunkebao/app/scenarios/phone/devices/page.tsx
+++ b/Cunkebao/app/scenarios/phone/devices/page.tsx
@@ -184,4 +184,3 @@ export default function PhoneDevicesPage() {
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/phone/edit/[id]/page.tsx b/Cunkebao/app/scenarios/phone/edit/[id]/page.tsx
index f445ad5b..64817b45 100644
--- a/Cunkebao/app/scenarios/phone/edit/[id]/page.tsx
+++ b/Cunkebao/app/scenarios/phone/edit/[id]/page.tsx
@@ -399,4 +399,3 @@ export default function EditPhoneAcquisitionPlan({ params }: { params: { id: str
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/phone/new/basic/page.tsx b/Cunkebao/app/scenarios/phone/new/basic/page.tsx
new file mode 100644
index 00000000..73343904
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/basic/page.tsx
@@ -0,0 +1,334 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Phone, Settings } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card } from "@/components/ui/card"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { Switch } from "@/components/ui/switch"
+import { toast } from "@/components/ui/use-toast"
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter,
+  DialogDescription,
+} from "@/components/ui/dialog"
+
+// 电话通话标签
+const phoneCallTags = [
+  { id: "tag-1", name: "咨询", color: "bg-blue-100 text-blue-800" },
+  { id: "tag-2", name: "投诉", color: "bg-red-100 text-red-800" },
+  { id: "tag-3", name: "合作", color: "bg-green-100 text-green-800" },
+  { id: "tag-4", name: "价格", color: "bg-orange-100 text-orange-800" },
+  { id: "tag-5", name: "售后", color: "bg-purple-100 text-purple-800" },
+  { id: "tag-6", name: "订单", color: "bg-yellow-100 text-yellow-800" },
+  { id: "tag-7", name: "物流", color: "bg-teal-100 text-teal-800" },
+  { id: "tag-8", name: "退款", color: "bg-pink-100 text-pink-800" },
+  { id: "tag-9", name: "技术支持", color: "bg-indigo-100 text-indigo-800" },
+  { id: "tag-10", name: "其他", color: "bg-gray-100 text-gray-800" },
+]
+
+export default function PhoneAcquisitionBasicPage() {
+  const router = useRouter()
+  const [planName, setPlanName] = useState(`电话获客${new Date().toLocaleDateString("zh-CN").replace(/\//g, "")}`)
+  const [enabled, setEnabled] = useState(true)
+  const [selectedTags, setSelectedTags] = useState<string[]>([])
+  const [phoneCallType, setPhoneCallType] = useState("both")
+  const [isPhoneSettingsOpen, setIsPhoneSettingsOpen] = useState(false)
+
+  // 电话获客设置
+  const [phoneSettings, setPhoneSettings] = useState({
+    autoAdd: true,
+    speechToText: true,
+    questionExtraction: true,
+  })
+
+  // 处理标签选择
+  const handleTagToggle = (tagId: string) => {
+    setSelectedTags((prev) => (prev.includes(tagId) ? prev.filter((id) => id !== tagId) : [...prev, tagId]))
+  }
+
+  // 处理通话类型选择
+  const handleCallTypeToggle = (type: string) => {
+    if (phoneCallType === "both") {
+      setPhoneCallType(type === "outbound" ? "inbound" : "outbound")
+    } else if (phoneCallType === type) {
+      setPhoneCallType("both")
+    } else {
+      setPhoneCallType("both")
+    }
+  }
+
+  // 处理电话获客设置更新
+  const handlePhoneSettingsUpdate = () => {
+    setIsPhoneSettingsOpen(false)
+    toast({
+      title: "设置已更新",
+      description: "电话获客设置已保存",
+    })
+  }
+
+  // 处理下一步
+  const handleNext = () => {
+    if (!planName.trim()) {
+      toast({
+        title: "请输入计划名称",
+        variant: "destructive",
+      })
+      return
+    }
+
+    if (selectedTags.length === 0) {
+      toast({
+        title: "请至少选择一个通话标签",
+        variant: "destructive",
+      })
+      return
+    }
+
+    // 保存数据并跳转到下一步
+    const formData = {
+      scenario: "phone",
+      planName,
+      enabled,
+      phoneSettings,
+      phoneCallType,
+      phoneTags: selectedTags,
+    }
+
+    // 这里应该保存到状态管理或通过路由传递
+    // router.push("/plans/new?step=2&scenario=phone")
+    router.push("/scenarios/phone/new/account")
+  }
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <div className="max-w-[390px] mx-auto bg-white min-h-screen flex flex-col">
+        <header className="sticky top-0 z-10 bg-white border-b">
+          <div className="flex items-center justify-between h-14 px-4">
+            <div className="flex items-center">
+              <Button variant="ghost" size="icon" onClick={() => router.back()}>
+                <ChevronLeft className="h-5 w-5" />
+              </Button>
+              <h1 className="ml-2 text-lg font-medium">电话获客设置</h1>
+            </div>
+            <div className="flex items-center gap-2">
+              <Phone className="h-5 w-5 text-blue-600" />
+              <span className="text-sm text-blue-600 font-medium">电话场景</span>
+            </div>
+          </div>
+        </header>
+
+        <div className="flex-1 p-4 pb-20">
+          <Card className="p-6">
+            <div className="space-y-6">
+              {/* 计划名称 */}
+              <div>
+                <Label htmlFor="planName">计划名称</Label>
+                <Input
+                  id="planName"
+                  value={planName}
+                  onChange={(e) => setPlanName(e.target.value)}
+                  placeholder="请输入计划名称"
+                  className="mt-2"
+                />
+              </div>
+
+              {/* 电话获客设置卡片 */}
+              <Card className="p-4 border-blue-100 bg-blue-50/50">
+                <div className="flex items-center justify-between mb-3">
+                  <Label className="text-base font-medium text-blue-700">电话获客设置</Label>
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => setIsPhoneSettingsOpen(true)}
+                    className="flex items-center gap-1 bg-white border-blue-200 text-blue-700 hover:bg-blue-100"
+                  >
+                    <Settings className="h-3.5 w-3.5" />
+                    修改设置
+                  </Button>
+                </div>
+                <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
+                  <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                    <div className="flex items-center">
+                      <div
+                        className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.autoAdd ? "bg-green-500" : "bg-gray-300"}`}
+                      ></div>
+                      <span>自动添加客户</span>
+                    </div>
+                    <div
+                      className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.autoAdd ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                    >
+                      {phoneSettings.autoAdd ? "已开启" : "已关闭"}
+                    </div>
+                  </div>
+                  <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                    <div className="flex items-center">
+                      <div
+                        className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.speechToText ? "bg-green-500" : "bg-gray-300"}`}
+                      ></div>
+                      <span>语音转文字</span>
+                    </div>
+                    <div
+                      className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.speechToText ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                    >
+                      {phoneSettings.speechToText ? "已开启" : "已关闭"}
+                    </div>
+                  </div>
+                  <div className="flex items-center justify-between bg-white p-3 rounded-lg border border-blue-100 shadow-sm">
+                    <div className="flex items-center">
+                      <div
+                        className={`w-3 h-3 rounded-full mr-2 ${phoneSettings.questionExtraction ? "bg-green-500" : "bg-gray-300"}`}
+                      ></div>
+                      <span>问题提取</span>
+                    </div>
+                    <div
+                      className={`px-2 py-0.5 rounded-full text-xs ${phoneSettings.questionExtraction ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-700"}`}
+                    >
+                      {phoneSettings.questionExtraction ? "已开启" : "已关闭"}
+                    </div>
+                  </div>
+                </div>
+                <p className="text-xs text-blue-600 mt-2">
+                  提示：电话获客功能将自动记录来电信息，并根据设置执行相应操作
+                </p>
+              </Card>
+
+              {/* 通话类型选择 */}
+              <div>
+                <Label className="text-base mb-2 block">通话类型</Label>
+                <div className="grid grid-cols-2 gap-2 mt-2">
+                  <div
+                    className={`p-3 border rounded-lg text-center cursor-pointer ${
+                      phoneCallType === "outbound" || phoneCallType === "both"
+                        ? "bg-blue-50 border-blue-300"
+                        : "bg-white hover:bg-gray-50"
+                    }`}
+                    onClick={() => handleCallTypeToggle("outbound")}
+                  >
+                    <div className="font-medium">发起外呼</div>
+                    <div className="text-sm text-gray-500">主动向客户发起电话</div>
+                  </div>
+                  <div
+                    className={`p-3 border rounded-lg text-center cursor-pointer ${
+                      phoneCallType === "inbound" || phoneCallType === "both"
+                        ? "bg-blue-50 border-blue-300"
+                        : "bg-white hover:bg-gray-50"
+                    }`}
+                    onClick={() => handleCallTypeToggle("inbound")}
+                  >
+                    <div className="font-medium">接收来电</div>
+                    <div className="text-sm text-gray-500">接听客户的来电</div>
+                  </div>
+                </div>
+              </div>
+
+              {/* 通话标签 */}
+              <div>
+                <Label className="text-base mb-2 block">通话标签（可多选）</Label>
+                <div className="flex flex-wrap gap-2 mt-2">
+                  {phoneCallTags.map((tag) => (
+                    <div
+                      key={tag.id}
+                      className={`px-3 py-1.5 rounded-full text-sm cursor-pointer transition-all ${
+                        selectedTags.includes(tag.id) ? tag.color : "bg-gray-100 text-gray-800 hover:bg-gray-200"
+                      }`}
+                      onClick={() => handleTagToggle(tag.id)}
+                    >
+                      {tag.name}
+                    </div>
+                  ))}
+                </div>
+                {selectedTags.length > 0 && (
+                  <p className="text-xs text-gray-500 mt-2">已选择 {selectedTags.length} 个标签</p>
+                )}
+              </div>
+
+              {/* 是否启用 */}
+              <div className="flex items-center justify-between">
+                <Label htmlFor="enabled">是否启用</Label>
+                <Switch id="enabled" checked={enabled} onCheckedChange={setEnabled} />
+              </div>
+
+              {/* 下一步按钮 */}
+              <Button className="w-full h-12 text-base" onClick={handleNext}>
+                下一步
+              </Button>
+            </div>
+          </Card>
+        </div>
+
+        {/* 电话获客设置对话框 */}
+        <Dialog open={isPhoneSettingsOpen} onOpenChange={setIsPhoneSettingsOpen}>
+          <DialogContent className="sm:max-w-md">
+            <DialogHeader>
+              <DialogTitle>电话获客设置</DialogTitle>
+              <DialogDescription>配置电话获客的自动化功能，提高获客效率</DialogDescription>
+            </DialogHeader>
+            <div className="py-4 space-y-6">
+              <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+                <div className="space-y-1">
+                  <Label htmlFor="auto-add" className="font-medium">
+                    自动添加客户
+                  </Label>
+                  <p className="text-sm text-gray-500">来电后自动将客户添加为微信好友</p>
+                  <p className="text-xs text-blue-600">推荐：开启此功能可提高转化率约30%</p>
+                </div>
+                <Switch
+                  id="auto-add"
+                  checked={phoneSettings.autoAdd}
+                  onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, autoAdd: checked })}
+                  className="data-[state=checked]:bg-blue-600"
+                />
+              </div>
+
+              <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+                <div className="space-y-1">
+                  <Label htmlFor="speech-to-text" className="font-medium">
+                    语音转文字
+                  </Label>
+                  <p className="text-sm text-gray-500">自动将通话内容转换为文字记录</p>
+                  <p className="text-xs text-blue-600">支持普通话、粤语等多种方言识别</p>
+                </div>
+                <Switch
+                  id="speech-to-text"
+                  checked={phoneSettings.speechToText}
+                  onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, speechToText: checked })}
+                  className="data-[state=checked]:bg-blue-600"
+                />
+              </div>
+
+              <div className="flex items-center justify-between p-3 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors">
+                <div className="space-y-1">
+                  <Label htmlFor="question-extraction" className="font-medium">
+                    问题提取
+                  </Label>
+                  <p className="text-sm text-gray-500">自动从通话中提取客户的首句问题</p>
+                  <p className="text-xs text-blue-600">AI智能识别客户意图，提高回复精准度</p>
+                </div>
+                <Switch
+                  id="question-extraction"
+                  checked={phoneSettings.questionExtraction}
+                  onCheckedChange={(checked) => setPhoneSettings({ ...phoneSettings, questionExtraction: checked })}
+                  className="data-[state=checked]:bg-blue-600"
+                />
+              </div>
+            </div>
+            <DialogFooter className="flex space-x-2 pt-2">
+              <Button variant="outline" onClick={() => setIsPhoneSettingsOpen(false)} className="flex-1">
+                取消
+              </Button>
+              <Button onClick={handlePhoneSettingsUpdate} className="flex-1 bg-blue-600 hover:bg-blue-700">
+                保存设置
+              </Button>
+            </DialogFooter>
+          </DialogContent>
+        </Dialog>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/components/AIFilterSettings.tsx b/Cunkebao/app/scenarios/phone/new/components/AIFilterSettings.tsx
new file mode 100644
index 00000000..7221f32f
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/components/AIFilterSettings.tsx
@@ -0,0 +1,76 @@
+"use client"
+
+import { Switch } from "@/components/ui/switch"
+import { Label } from "@/components/ui/label"
+
+interface AIFilterSettingsProps {
+  settings: {
+    enabled: boolean
+    removeBlacklist: boolean
+    validateFormat: boolean
+    removeDuplicates: boolean
+  }
+  onChange: (settings: any) => void
+}
+
+export function AIFilterSettings({ settings, onChange }: AIFilterSettingsProps) {
+  const handleToggle = (key: string, value: boolean) => {
+    onChange({
+      ...settings,
+      [key]: value,
+    })
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between">
+        <div>
+          <Label htmlFor="ai-filter">启用AI智能过滤</Label>
+          <p className="text-xs text-gray-500">自动过滤无效号码</p>
+        </div>
+        <Switch
+          id="ai-filter"
+          checked={settings.enabled}
+          onCheckedChange={(checked) => handleToggle("enabled", checked)}
+        />
+      </div>
+
+      {settings.enabled && (
+        <div className="space-y-3 pl-4 border-l-2">
+          <div className="flex items-center justify-between">
+            <Label htmlFor="remove-blacklist" className="text-sm">
+              过滤黑名单
+            </Label>
+            <Switch
+              id="remove-blacklist"
+              checked={settings.removeBlacklist}
+              onCheckedChange={(checked) => handleToggle("removeBlacklist", checked)}
+            />
+          </div>
+
+          <div className="flex items-center justify-between">
+            <Label htmlFor="validate-format" className="text-sm">
+              校验号码格式
+            </Label>
+            <Switch
+              id="validate-format"
+              checked={settings.validateFormat}
+              onCheckedChange={(checked) => handleToggle("validateFormat", checked)}
+            />
+          </div>
+
+          <div className="flex items-center justify-between">
+            <Label htmlFor="remove-duplicates" className="text-sm">
+              去除重复号码
+            </Label>
+            <Switch
+              id="remove-duplicates"
+              checked={settings.removeDuplicates}
+              onCheckedChange={(checked) => handleToggle("removeDuplicates", checked)}
+            />
+          </div>
+        </div>
+      )}
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/components/DeviceConfigDialog.tsx b/Cunkebao/app/scenarios/phone/new/components/DeviceConfigDialog.tsx
new file mode 100644
index 00000000..a33e9903
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/components/DeviceConfigDialog.tsx
@@ -0,0 +1,137 @@
+"use client"
+
+import { useState, useEffect } from "react"
+import { Smartphone, Wifi, WifiOff } from "lucide-react"
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog"
+import { Button } from "@/components/ui/button"
+import { Checkbox } from "@/components/ui/checkbox"
+import { ScrollArea } from "@/components/ui/scroll-area"
+
+interface Device {
+  id: string
+  name: string
+  imei: string
+  status: "online" | "offline"
+  wechatAccount?: string
+}
+
+interface DeviceConfigDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  selectedDevices: string[]
+  onSelect: (devices: string[]) => void
+}
+
+export function DeviceConfigDialog({ open, onOpenChange, selectedDevices, onSelect }: DeviceConfigDialogProps) {
+  const [devices, setDevices] = useState<Device[]>([])
+  const [selected, setSelected] = useState<string[]>(selectedDevices)
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    if (open) {
+      loadDevices()
+    }
+  }, [open])
+
+  const loadDevices = async () => {
+    setLoading(true)
+    try {
+      // 模拟加载设备列表
+      await new Promise((resolve) => setTimeout(resolve, 500))
+      setDevices([
+        {
+          id: "1",
+          name: "设备1",
+          imei: "sd123123",
+          status: "online",
+          wechatAccount: "wxid_abc123",
+        },
+        {
+          id: "2",
+          name: "设备2",
+          imei: "sd123124",
+          status: "online",
+          wechatAccount: "wxid_xyz789",
+        },
+        {
+          id: "3",
+          name: "设备3",
+          imei: "sd123125",
+          status: "offline",
+          wechatAccount: "wxid_def456",
+        },
+      ])
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  const handleToggle = (deviceId: string) => {
+    setSelected((prev) => (prev.includes(deviceId) ? prev.filter((id) => id !== deviceId) : [...prev, deviceId]))
+  }
+
+  const handleConfirm = () => {
+    onSelect(selected)
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-[425px]">
+        <DialogHeader>
+          <DialogTitle>选择执行设备</DialogTitle>
+          <DialogDescription>选择用于执行电话获客任务的设备</DialogDescription>
+        </DialogHeader>
+
+        {loading ? (
+          <div className="py-8 text-center text-gray-500">加载设备列表中...</div>
+        ) : (
+          <>
+            <ScrollArea className="h-[300px] pr-4">
+              <div className="space-y-2">
+                {devices.map((device) => (
+                  <div
+                    key={device.id}
+                    className={`p-3 border rounded-lg ${device.status === "offline" ? "opacity-50" : ""}`}
+                  >
+                    <div className="flex items-start space-x-3">
+                      <Checkbox
+                        checked={selected.includes(device.id)}
+                        onCheckedChange={() => handleToggle(device.id)}
+                        disabled={device.status === "offline"}
+                      />
+                      <div className="flex-1">
+                        <div className="flex items-center justify-between">
+                          <div className="flex items-center gap-2">
+                            <Smartphone className="h-4 w-4" />
+                            <span className="font-medium">{device.name}</span>
+                          </div>
+                          {device.status === "online" ? (
+                            <Wifi className="h-4 w-4 text-green-500" />
+                          ) : (
+                            <WifiOff className="h-4 w-4 text-gray-400" />
+                          )}
+                        </div>
+                        <p className="text-xs text-gray-500 mt-1">IMEI: {device.imei}</p>
+                        {device.wechatAccount && <p className="text-xs text-gray-500">微信: {device.wechatAccount}</p>}
+                      </div>
+                    </div>
+                  </div>
+                ))}
+              </div>
+            </ScrollArea>
+
+            <div className="flex justify-between items-center pt-4">
+              <p className="text-sm text-gray-500">已选择 {selected.length} 个设备</p>
+              <div className="space-x-2">
+                <Button variant="outline" onClick={() => onOpenChange(false)}>
+                  取消
+                </Button>
+                <Button onClick={handleConfirm}>确认</Button>
+              </div>
+            </div>
+          </>
+        )}
+      </DialogContent>
+    </Dialog>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/components/DistributionSettings.tsx b/Cunkebao/app/scenarios/phone/new/components/DistributionSettings.tsx
new file mode 100644
index 00000000..e53b5021
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/components/DistributionSettings.tsx
@@ -0,0 +1,92 @@
+"use client"
+
+import { Switch } from "@/components/ui/switch"
+import { Label } from "@/components/ui/label"
+import { Input } from "@/components/ui/input"
+import { Button } from "@/components/ui/button"
+import { Plus, Trash2 } from "lucide-react"
+
+interface DistributionSettingsProps {
+  settings: {
+    enabled: boolean
+    rules: Array<{
+      level: number
+      percentage: number
+    }>
+  }
+  onChange: (settings: any) => void
+}
+
+export function DistributionSettings({ settings, onChange }: DistributionSettingsProps) {
+  const handleToggle = (value: boolean) => {
+    onChange({
+      ...settings,
+      enabled: value,
+    })
+  }
+
+  const addRule = () => {
+    onChange({
+      ...settings,
+      rules: [...settings.rules, { level: settings.rules.length + 1, percentage: 10 }],
+    })
+  }
+
+  const removeRule = (index: number) => {
+    onChange({
+      ...settings,
+      rules: settings.rules.filter((_, i) => i !== index),
+    })
+  }
+
+  const updateRule = (index: number, percentage: number) => {
+    const newRules = [...settings.rules]
+    newRules[index].percentage = percentage
+    onChange({
+      ...settings,
+      rules: newRules,
+    })
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between">
+        <div>
+          <Label htmlFor="distribution">启用分销返利</Label>
+          <p className="text-xs text-gray-500">自动计算并发放返利</p>
+        </div>
+        <Switch id="distribution" checked={settings.enabled} onCheckedChange={handleToggle} />
+      </div>
+
+      {settings.enabled && (
+        <div className="space-y-3">
+          <div className="flex items-center justify-between">
+            <Label className="text-sm">分销层级设置</Label>
+            <Button size="sm" variant="outline" onClick={addRule}>
+              <Plus className="h-3 w-3 mr-1" />
+              添加层级
+            </Button>
+          </div>
+
+          {settings.rules.map((rule, index) => (
+            <div key={index} className="flex items-center gap-2">
+              <span className="text-sm w-16">{rule.level}级</span>
+              <Input
+                type="number"
+                value={rule.percentage}
+                onChange={(e) => updateRule(index, Number(e.target.value))}
+                className="flex-1"
+                min="0"
+                max="100"
+              />
+              <span className="text-sm">%</span>
+              <Button size="icon" variant="ghost" onClick={() => removeRule(index)}>
+                <Trash2 className="h-4 w-4" />
+              </Button>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/components/FollowUpSettings.tsx b/Cunkebao/app/scenarios/phone/new/components/FollowUpSettings.tsx
new file mode 100644
index 00000000..0b39901e
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/components/FollowUpSettings.tsx
@@ -0,0 +1,123 @@
+"use client"
+
+import { Switch } from "@/components/ui/switch"
+import { Label } from "@/components/ui/label"
+import { Textarea } from "@/components/ui/textarea"
+import { Button } from "@/components/ui/button"
+import { Plus, X } from "lucide-react"
+
+interface FollowUpSettingsProps {
+  settings: {
+    autoWelcome: boolean
+    welcomeMessage: string
+    autoTag: boolean
+    tags: string[]
+  }
+  onChange: (settings: any) => void
+}
+
+export function FollowUpSettings({ settings, onChange }: FollowUpSettingsProps) {
+  const handleToggle = (key: string, value: boolean) => {
+    onChange({
+      ...settings,
+      [key]: value,
+    })
+  }
+
+  const handleMessageChange = (value: string) => {
+    onChange({
+      ...settings,
+      welcomeMessage: value,
+    })
+  }
+
+  const addTag = () => {
+    const tag = prompt("请输入标签名称")
+    if (tag && !settings.tags.includes(tag)) {
+      onChange({
+        ...settings,
+        tags: [...settings.tags, tag],
+      })
+    }
+  }
+
+  const removeTag = (tag: string) => {
+    onChange({
+      ...settings,
+      tags: settings.tags.filter((t) => t !== tag),
+    })
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="space-y-3">
+        <div className="flex items-center justify-between">
+          <div>
+            <Label htmlFor="auto-welcome">自动发送欢迎语</Label>
+            <p className="text-xs text-gray-500">加好友成功后自动发送</p>
+          </div>
+          <Switch
+            id="auto-welcome"
+            checked={settings.autoWelcome}
+            onCheckedChange={(checked) => handleToggle("autoWelcome", checked)}
+          />
+        </div>
+
+        {settings.autoWelcome && (
+          <div>
+            <Label htmlFor="welcome-message" className="text-sm">
+              欢迎语内容
+            </Label>
+            <Textarea
+              id="welcome-message"
+              value={settings.welcomeMessage}
+              onChange={(e) => handleMessageChange(e.target.value)}
+              className="mt-1"
+              rows={3}
+              placeholder="请输入欢迎语内容"
+            />
+          </div>
+        )}
+      </div>
+
+      <div className="space-y-3">
+        <div className="flex items-center justify-between">
+          <div>
+            <Label htmlFor="auto-tag">自动打标签</Label>
+            <p className="text-xs text-gray-500">为新好友自动添加标签</p>
+          </div>
+          <Switch
+            id="auto-tag"
+            checked={settings.autoTag}
+            onCheckedChange={(checked) => handleToggle("autoTag", checked)}
+          />
+        </div>
+
+        {settings.autoTag && (
+          <div>
+            <div className="flex items-center justify-between mb-2">
+              <Label className="text-sm">标签列表</Label>
+              <Button size="sm" variant="outline" onClick={addTag}>
+                <Plus className="h-3 w-3 mr-1" />
+                添加
+              </Button>
+            </div>
+            <div className="flex flex-wrap gap-2">
+              {settings.tags.map((tag) => (
+                <div
+                  key={tag}
+                  className="flex items-center gap-1 px-2 py-1 bg-blue-50 text-blue-600 rounded-md text-sm"
+                >
+                  <span>{tag}</span>
+                  <button onClick={() => removeTag(tag)} className="hover:text-blue-800">
+                    <X className="h-3 w-3" />
+                  </button>
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/components/PhoneImportDialog.tsx b/Cunkebao/app/scenarios/phone/new/components/PhoneImportDialog.tsx
new file mode 100644
index 00000000..dbebde48
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/components/PhoneImportDialog.tsx
@@ -0,0 +1,138 @@
+"use client"
+
+import type React from "react"
+
+import { useState } from "react"
+import { Upload } from "lucide-react"
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog"
+import { Button } from "@/components/ui/button"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
+import { toast } from "@/components/ui/use-toast"
+
+interface PhoneImportDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  onImport: (numbers: string[]) => void
+}
+
+export function PhoneImportDialog({ open, onOpenChange, onImport }: PhoneImportDialogProps) {
+  const [manualInput, setManualInput] = useState("")
+  const [importing, setImporting] = useState(false)
+
+  const handleManualImport = () => {
+    const numbers = manualInput
+      .split(/[\n,，]/)
+      .map((n) => n.trim())
+      .filter((n) => n && /^1[3-9]\d{9}$/.test(n))
+
+    if (numbers.length === 0) {
+      toast({
+        title: "没有有效的电话号码",
+        description: "请输入正确格式的手机号码",
+        variant: "destructive",
+      })
+      return
+    }
+
+    onImport(numbers)
+    setManualInput("")
+    toast({
+      title: "导入成功",
+      description: `成功导入 ${numbers.length} 个电话号码`,
+    })
+  }
+
+  const handleFileUpload = async (event: React.ChangeEvent<HTMLInputElement>) => {
+    const file = event.target.files?.[0]
+    if (!file) return
+
+    setImporting(true)
+    try {
+      // 这里应该解析Excel/CSV文件
+      // 模拟导入过程
+      await new Promise((resolve) => setTimeout(resolve, 1000))
+
+      // 模拟导入的号码
+      const mockNumbers = ["13800138000", "13900139000", "13700137000"]
+
+      onImport(mockNumbers)
+      toast({
+        title: "导入成功",
+        description: `成功导入 ${mockNumbers.length} 个电话号码`,
+      })
+    } catch (error) {
+      toast({
+        title: "导入失败",
+        description: "文件解析失败，请检查文件格式",
+        variant: "destructive",
+      })
+    } finally {
+      setImporting(false)
+    }
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-[425px]">
+        <DialogHeader>
+          <DialogTitle>导入电话号码</DialogTitle>
+          <DialogDescription>支持批量导入Excel/CSV文件或手动输入</DialogDescription>
+        </DialogHeader>
+
+        <Tabs defaultValue="manual" className="w-full">
+          <TabsList className="grid w-full grid-cols-2">
+            <TabsTrigger value="manual">手动输入</TabsTrigger>
+            <TabsTrigger value="file">文件导入</TabsTrigger>
+          </TabsList>
+
+          <TabsContent value="manual" className="space-y-4">
+            <div>
+              <label className="text-sm font-medium">电话号码</label>
+              <textarea
+                className="w-full mt-1 px-3 py-2 border rounded-md"
+                rows={6}
+                placeholder="每行一个号码，或用逗号分隔"
+                value={manualInput}
+                onChange={(e) => setManualInput(e.target.value)}
+              />
+              <p className="text-xs text-gray-500 mt-1">支持格式：13800138000，每行一个或逗号分隔</p>
+            </div>
+            <Button className="w-full" onClick={handleManualImport}>
+              确认导入
+            </Button>
+          </TabsContent>
+
+          <TabsContent value="file" className="space-y-4">
+            <div className="border-2 border-dashed rounded-lg p-8 text-center">
+              <Upload className="h-12 w-12 mx-auto text-gray-400 mb-4" />
+              <p className="text-sm text-gray-600 mb-2">点击或拖拽文件到此处</p>
+              <p className="text-xs text-gray-500 mb-4">支持 Excel (.xlsx, .xls) 和 CSV 文件</p>
+              <input
+                type="file"
+                accept=".xlsx,.xls,.csv"
+                onChange={handleFileUpload}
+                className="hidden"
+                id="file-upload"
+                disabled={importing}
+              />
+              <label htmlFor="file-upload">
+                <Button as="span" disabled={importing}>
+                  {importing ? "导入中..." : "选择文件"}
+                </Button>
+              </label>
+            </div>
+
+            <div className="bg-gray-50 p-3 rounded-md">
+              <p className="text-xs text-gray-600 mb-2">文件格式示例：</p>
+              <div className="bg-white p-2 rounded border text-xs font-mono">
+                <div>姓名,电话,来源,备注</div>
+                <div>张三,13800138000,网站,意向客户</div>
+                <div>李四,13900139000,广告,待跟进</div>
+              </div>
+            </div>
+          </TabsContent>
+        </Tabs>
+      </DialogContent>
+    </Dialog>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/components/RedPacketSettings.tsx b/Cunkebao/app/scenarios/phone/new/components/RedPacketSettings.tsx
new file mode 100644
index 00000000..83637147
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/components/RedPacketSettings.tsx
@@ -0,0 +1,83 @@
+"use client"
+
+import { Switch } from "@/components/ui/switch"
+import { Label } from "@/components/ui/label"
+import { Input } from "@/components/ui/input"
+
+interface RedPacketSettingsProps {
+  settings: {
+    enabled: boolean
+    amount: number
+    pool: number
+  }
+  onChange: (settings: any) => void
+}
+
+export function RedPacketSettings({ settings, onChange }: RedPacketSettingsProps) {
+  const handleToggle = (value: boolean) => {
+    onChange({
+      ...settings,
+      enabled: value,
+    })
+  }
+
+  const handleAmountChange = (value: number) => {
+    onChange({
+      ...settings,
+      amount: value,
+    })
+  }
+
+  const handlePoolChange = (value: number) => {
+    onChange({
+      ...settings,
+      pool: value,
+    })
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between">
+        <div>
+          <Label htmlFor="redpacket">启用红包奖励</Label>
+          <p className="text-xs text-gray-500">加好友成功后自动发红包</p>
+        </div>
+        <Switch id="redpacket" checked={settings.enabled} onCheckedChange={handleToggle} />
+      </div>
+
+      {settings.enabled && (
+        <div className="space-y-3">
+          <div>
+            <Label htmlFor="amount" className="text-sm">
+              单个红包金额（元）
+            </Label>
+            <Input
+              id="amount"
+              type="number"
+              value={settings.amount}
+              onChange={(e) => handleAmountChange(Number(e.target.value))}
+              min="0.01"
+              step="0.01"
+              className="mt-1"
+            />
+          </div>
+
+          <div>
+            <Label htmlFor="pool" className="text-sm">
+              红包池总额（元）
+            </Label>
+            <Input
+              id="pool"
+              type="number"
+              value={settings.pool}
+              onChange={(e) => handlePoolChange(Number(e.target.value))}
+              min="0"
+              className="mt-1"
+            />
+            <p className="text-xs text-gray-500 mt-1">剩余可发：{Math.floor(settings.pool / settings.amount)} 个红包</p>
+          </div>
+        </div>
+      )}
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/new/page.tsx b/Cunkebao/app/scenarios/phone/new/page.tsx
new file mode 100644
index 00000000..6d18308c
--- /dev/null
+++ b/Cunkebao/app/scenarios/phone/new/page.tsx
@@ -0,0 +1,254 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Upload, Phone, Users, Filter, TrendingUp, Gift, MessageSquare } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
+import { toast } from "@/components/ui/use-toast"
+import { PhoneImportDialog } from "./components/PhoneImportDialog"
+import { DeviceConfigDialog } from "./components/DeviceConfigDialog"
+import { AIFilterSettings } from "./components/AIFilterSettings"
+import { DistributionSettings } from "./components/DistributionSettings"
+import { RedPacketSettings } from "./components/RedPacketSettings"
+import { FollowUpSettings } from "./components/FollowUpSettings"
+
+export default function NewPhoneAcquisitionPlan() {
+  const router = useRouter()
+  const [showImportDialog, setShowImportDialog] = useState(false)
+  const [showDeviceDialog, setShowDeviceDialog] = useState(false)
+  const [planData, setPlanData] = useState({
+    name: "",
+    description: "",
+    phoneNumbers: [] as string[],
+    devices: [] as string[],
+    autoAddWechat: true,
+    aiFilter: {
+      enabled: true,
+      removeBlacklist: true,
+      validateFormat: true,
+      removeDuplicates: true,
+    },
+    distribution: {
+      enabled: false,
+      rules: [],
+    },
+    redPacket: {
+      enabled: false,
+      amount: 0,
+      pool: 0,
+    },
+    followUp: {
+      autoWelcome: true,
+      welcomeMessage: "您好，很高兴认识您！",
+      autoTag: true,
+      tags: ["电话获客"],
+    },
+  })
+
+  const handleSave = async () => {
+    try {
+      // 验证必填项
+      if (!planData.name) {
+        toast({
+          title: "请输入计划名称",
+          variant: "destructive",
+        })
+        return
+      }
+
+      if (planData.phoneNumbers.length === 0) {
+        toast({
+          title: "请导入电话号码",
+          variant: "destructive",
+        })
+        return
+      }
+
+      if (planData.devices.length === 0) {
+        toast({
+          title: "请选择执行设备",
+          variant: "destructive",
+        })
+        return
+      }
+
+      // 调用API保存计划
+      await new Promise((resolve) => setTimeout(resolve, 1000))
+
+      toast({
+        title: "创建成功",
+        description: "电话获客计划已创建",
+      })
+      router.push("/scenarios/phone")
+    } catch (error) {
+      toast({
+        title: "创建失败",
+        description: "创建计划失败，请重试",
+        variant: "destructive",
+      })
+    }
+  }
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <div className="max-w-[390px] mx-auto bg-white min-h-screen flex flex-col">
+        <header className="sticky top-0 z-10 bg-white border-b">
+          <div className="flex items-center justify-between h-14 px-4">
+            <div className="flex items-center">
+              <Button variant="ghost" size="icon" onClick={() => router.push("/scenarios/phone")}>
+                <ChevronLeft className="h-5 w-5" />
+              </Button>
+              <h1 className="ml-2 text-lg font-medium">新建电话获客计划</h1>
+            </div>
+          </div>
+        </header>
+
+        <div className="flex-1 overflow-y-auto pb-20">
+          <div className="p-4 space-y-4">
+            {/* 基础信息 */}
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base">基础信息</CardTitle>
+              </CardHeader>
+              <CardContent className="space-y-4">
+                <div>
+                  <label className="text-sm font-medium">计划名称</label>
+                  <input
+                    type="text"
+                    className="w-full mt-1 px-3 py-2 border rounded-md"
+                    placeholder="请输入计划名称"
+                    value={planData.name}
+                    onChange={(e) => setPlanData({ ...planData, name: e.target.value })}
+                  />
+                </div>
+                <div>
+                  <label className="text-sm font-medium">计划描述</label>
+                  <textarea
+                    className="w-full mt-1 px-3 py-2 border rounded-md"
+                    rows={3}
+                    placeholder="请输入计划描述（选填）"
+                    value={planData.description}
+                    onChange={(e) => setPlanData({ ...planData, description: e.target.value })}
+                  />
+                </div>
+              </CardContent>
+            </Card>
+
+            {/* 电话导入 */}
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base flex items-center justify-between">
+                  <span className="flex items-center gap-2">
+                    <Phone className="h-4 w-4" />
+                    电话线索导入
+                  </span>
+                  <Button size="sm" onClick={() => setShowImportDialog(true)}>
+                    <Upload className="h-4 w-4 mr-1" />
+                    导入
+                  </Button>
+                </CardTitle>
+                <CardDescription>已导入 {planData.phoneNumbers.length} 个电话号码</CardDescription>
+              </CardHeader>
+            </Card>
+
+            {/* 设备配置 */}
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base flex items-center justify-between">
+                  <span className="flex items-center gap-2">
+                    <Users className="h-4 w-4" />
+                    执行设备
+                  </span>
+                  <Button size="sm" onClick={() => setShowDeviceDialog(true)}>
+                    选择设备
+                  </Button>
+                </CardTitle>
+                <CardDescription>已选择 {planData.devices.length} 个设备</CardDescription>
+              </CardHeader>
+            </Card>
+
+            {/* 功能配置 */}
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base">功能配置</CardTitle>
+              </CardHeader>
+              <CardContent>
+                <Tabs defaultValue="filter" className="w-full">
+                  <TabsList className="grid w-full grid-cols-4">
+                    <TabsTrigger value="filter">
+                      <Filter className="h-3 w-3" />
+                    </TabsTrigger>
+                    <TabsTrigger value="distribution">
+                      <TrendingUp className="h-3 w-3" />
+                    </TabsTrigger>
+                    <TabsTrigger value="redpacket">
+                      <Gift className="h-3 w-3" />
+                    </TabsTrigger>
+                    <TabsTrigger value="followup">
+                      <MessageSquare className="h-3 w-3" />
+                    </TabsTrigger>
+                  </TabsList>
+                  <TabsContent value="filter" className="mt-4">
+                    <AIFilterSettings
+                      settings={planData.aiFilter}
+                      onChange={(settings) => setPlanData({ ...planData, aiFilter: settings })}
+                    />
+                  </TabsContent>
+                  <TabsContent value="distribution" className="mt-4">
+                    <DistributionSettings
+                      settings={planData.distribution}
+                      onChange={(settings) => setPlanData({ ...planData, distribution: settings })}
+                    />
+                  </TabsContent>
+                  <TabsContent value="redpacket" className="mt-4">
+                    <RedPacketSettings
+                      settings={planData.redPacket}
+                      onChange={(settings) => setPlanData({ ...planData, redPacket: settings })}
+                    />
+                  </TabsContent>
+                  <TabsContent value="followup" className="mt-4">
+                    <FollowUpSettings
+                      settings={planData.followUp}
+                      onChange={(settings) => setPlanData({ ...planData, followUp: settings })}
+                    />
+                  </TabsContent>
+                </Tabs>
+              </CardContent>
+            </Card>
+          </div>
+        </div>
+
+        <div className="fixed bottom-0 left-0 right-0 bg-white border-t p-4">
+          <div className="max-w-[390px] mx-auto">
+            <Button className="w-full" onClick={handleSave}>
+              创建计划
+            </Button>
+          </div>
+        </div>
+
+        {/* 导入对话框 */}
+        <PhoneImportDialog
+          open={showImportDialog}
+          onOpenChange={setShowImportDialog}
+          onImport={(numbers) => {
+            setPlanData({ ...planData, phoneNumbers: [...planData.phoneNumbers, ...numbers] })
+            setShowImportDialog(false)
+          }}
+        />
+
+        {/* 设备选择对话框 */}
+        <DeviceConfigDialog
+          open={showDeviceDialog}
+          onOpenChange={setShowDeviceDialog}
+          selectedDevices={planData.devices}
+          onSelect={(devices) => {
+            setPlanData({ ...planData, devices })
+            setShowDeviceDialog(false)
+          }}
+        />
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/app/scenarios/phone/page.tsx b/Cunkebao/app/scenarios/phone/page.tsx
index 7cc55c49..f31fb323 100644
--- a/Cunkebao/app/scenarios/phone/page.tsx
+++ b/Cunkebao/app/scenarios/phone/page.tsx
@@ -120,4 +120,3 @@ export default function PhoneAcquisitionPage() {
     </div>
   )
 }
-
diff --git a/Cunkebao/app/scenarios/weixinqun/page.tsx b/Cunkebao/app/scenarios/weixinqun/page.tsx
new file mode 100644
index 00000000..f506a9b2
--- /dev/null
+++ b/Cunkebao/app/scenarios/weixinqun/page.tsx
@@ -0,0 +1,233 @@
+"use client"
+
+import { useState } from "react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+import { Badge } from "@/components/ui/badge"
+import { Plus, Settings, Users, MessageSquare, TrendingUp, Calendar } from "lucide-react"
+import Link from "next/link"
+
+// 微信群获客计划数据
+const wechatGroupPlans = [
+  {
+    id: 1,
+    name: "产品推广群计划",
+    status: "运行中",
+    groupCount: 8,
+    memberCount: 1250,
+    dailyMessages: 15,
+    tags: ["产品分享", "优惠信息"],
+    createdAt: "2024-01-15",
+    lastActive: "2小时前",
+  },
+  {
+    id: 2,
+    name: "用户交流群计划",
+    status: "已暂停",
+    groupCount: 5,
+    memberCount: 680,
+    dailyMessages: 8,
+    tags: ["用户交流", "答疑解惑"],
+    createdAt: "2024-01-10",
+    lastActive: "1天前",
+  },
+  {
+    id: 3,
+    name: "新人欢迎群计划",
+    status: "运行中",
+    groupCount: 12,
+    memberCount: 2100,
+    dailyMessages: 25,
+    tags: ["新人欢迎", "群活动"],
+    createdAt: "2024-01-08",
+    lastActive: "30分钟前",
+  },
+]
+
+export default function WechatGroupPage() {
+  const [plans] = useState(wechatGroupPlans)
+
+  const getStatusColor = (status: string) => {
+    switch (status) {
+      case "运行中":
+        return "bg-green-100 text-green-800"
+      case "已暂停":
+        return "bg-yellow-100 text-yellow-800"
+      case "已完成":
+        return "bg-blue-100 text-blue-800"
+      default:
+        return "bg-gray-100 text-gray-800"
+    }
+  }
+
+  const getTagColor = (tag: string) => {
+    const colors = {
+      群活动: "bg-green-100 text-green-800",
+      产品分享: "bg-blue-100 text-blue-800",
+      用户交流: "bg-purple-100 text-purple-800",
+      优惠信息: "bg-pink-100 text-pink-800",
+      答疑解惑: "bg-orange-100 text-orange-800",
+      新人欢迎: "bg-cyan-100 text-cyan-800",
+      群规通知: "bg-indigo-100 text-indigo-800",
+      活跃互动: "bg-emerald-100 text-emerald-800",
+    }
+    return colors[tag as keyof typeof colors] || "bg-gray-100 text-gray-800"
+  }
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      {/* 头部 */}
+      <div className="bg-white border-b">
+        <div className="px-4 py-4">
+          <div className="flex items-center justify-between">
+            <div>
+              <h1 className="text-xl font-semibold text-gray-900">微信群获客</h1>
+              <p className="text-sm text-gray-600 mt-1">管理微信群获客计划，提升群活跃度</p>
+            </div>
+            <Link href="/plans/new?type=weixinqun">
+              <Button className="bg-blue-600 hover:bg-blue-700">
+                <Plus className="w-4 h-4 mr-2" />
+                新建计划
+              </Button>
+            </Link>
+          </div>
+        </div>
+      </div>
+
+      {/* 统计卡片 */}
+      <div className="px-4 py-6">
+        <div className="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center">
+                <Users className="w-8 h-8 text-blue-600" />
+                <div className="ml-3">
+                  <p className="text-sm text-gray-600">总群数</p>
+                  <p className="text-xl font-semibold">25</p>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center">
+                <MessageSquare className="w-8 h-8 text-green-600" />
+                <div className="ml-3">
+                  <p className="text-sm text-gray-600">总成员</p>
+                  <p className="text-xl font-semibold">4,030</p>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center">
+                <TrendingUp className="w-8 h-8 text-purple-600" />
+                <div className="ml-3">
+                  <p className="text-sm text-gray-600">日均消息</p>
+                  <p className="text-xl font-semibold">48</p>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+
+          <Card>
+            <CardContent className="p-4">
+              <div className="flex items-center">
+                <Calendar className="w-8 h-8 text-orange-600" />
+                <div className="ml-3">
+                  <p className="text-sm text-gray-600">活跃计划</p>
+                  <p className="text-xl font-semibold">2</p>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+        </div>
+
+        {/* 计划列表 */}
+        <div className="space-y-4">
+          {plans.map((plan) => (
+            <Card key={plan.id} className="hover:shadow-md transition-shadow">
+              <CardHeader className="pb-3">
+                <div className="flex items-center justify-between">
+                  <CardTitle className="text-lg">{plan.name}</CardTitle>
+                  <div className="flex items-center space-x-2">
+                    <Badge className={getStatusColor(plan.status)}>{plan.status}</Badge>
+                    <Button variant="ghost" size="sm">
+                      <Settings className="w-4 h-4" />
+                    </Button>
+                  </div>
+                </div>
+              </CardHeader>
+
+              <CardContent>
+                <div className="grid grid-cols-2 md:grid-cols-4 gap-4 mb-4">
+                  <div>
+                    <p className="text-sm text-gray-600">群数量</p>
+                    <p className="font-semibold">{plan.groupCount} 个</p>
+                  </div>
+                  <div>
+                    <p className="text-sm text-gray-600">成员数</p>
+                    <p className="font-semibold">{plan.memberCount.toLocaleString()}</p>
+                  </div>
+                  <div>
+                    <p className="text-sm text-gray-600">日均消息</p>
+                    <p className="font-semibold">{plan.dailyMessages} 条</p>
+                  </div>
+                  <div>
+                    <p className="text-sm text-gray-600">最后活跃</p>
+                    <p className="font-semibold">{plan.lastActive}</p>
+                  </div>
+                </div>
+
+                <div className="flex flex-wrap gap-2 mb-4">
+                  {plan.tags.map((tag, index) => (
+                    <Badge key={index} variant="secondary" className={getTagColor(tag)}>
+                      {tag}
+                    </Badge>
+                  ))}
+                </div>
+
+                <div className="flex items-center justify-between text-sm text-gray-600">
+                  <span>创建时间：{plan.createdAt}</span>
+                  <div className="flex space-x-2">
+                    <Button variant="outline" size="sm">
+                      查看详情
+                    </Button>
+                    <Button variant="outline" size="sm">
+                      编辑计划
+                    </Button>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+      </div>
+
+      {/* 底部导航 */}
+      <div className="fixed bottom-0 left-0 right-0 bg-white border-t">
+        <div className="grid grid-cols-4 py-2">
+          <Link href="/" className="flex flex-col items-center py-2 text-gray-600">
+            <div className="w-6 h-6 mb-1">🏠</div>
+            <span className="text-xs">首页</span>
+          </Link>
+          <Link href="/scenarios" className="flex flex-col items-center py-2 text-blue-600">
+            <div className="w-6 h-6 mb-1">🎯</div>
+            <span className="text-xs">场景获客</span>
+          </Link>
+          <Link href="/workspace" className="flex flex-col items-center py-2 text-gray-600">
+            <div className="w-6 h-6 mb-1">💼</div>
+            <span className="text-xs">工作台</span>
+          </Link>
+          <Link href="/profile" className="flex flex-col items-center py-2 text-gray-600">
+            <div className="w-6 h-6 mb-1">👤</div>
+            <span className="text-xs">我的</span>
+          </Link>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/Cunkebao/pnpm-lock.yaml b/Cunkebao/pnpm-lock.yaml
index ca98c481..198b861c 100644
--- a/Cunkebao/pnpm-lock.yaml
+++ b/Cunkebao/pnpm-lock.yaml
@@ -2,4 +2,4171 @@ lockfileVersion: '9.0'
 
 settings:
   autoInstallPeers: true
-  excludeLinksFromLockfile: false
\ No newline at end of file
+  excludeLinksFromLockfile: false
+
+importers:
+
+  .:
+    dependencies:
+      '@ant-design/plots':
+        specifier: latest
+        version: 2.4.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@hookform/resolvers':
+        specifier: ^3.9.1
+        version: 3.10.0(react-hook-form@7.56.4(react@19.1.0))
+      '@radix-ui/react-accordion':
+        specifier: latest
+        version: 1.2.11(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-alert-dialog':
+        specifier: ^1.1.4
+        version: 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-aspect-ratio':
+        specifier: ^1.1.1
+        version: 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-avatar':
+        specifier: latest
+        version: 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-checkbox':
+        specifier: latest
+        version: 1.3.2(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-collapsible':
+        specifier: latest
+        version: 1.1.11(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-context-menu':
+        specifier: ^2.2.4
+        version: 2.2.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-dialog':
+        specifier: latest
+        version: 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-dropdown-menu':
+        specifier: latest
+        version: 2.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-hover-card':
+        specifier: ^1.1.4
+        version: 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-icons':
+        specifier: latest
+        version: 1.3.2(react@19.1.0)
+      '@radix-ui/react-label':
+        specifier: latest
+        version: 2.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-menubar':
+        specifier: ^1.1.4
+        version: 1.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-navigation-menu':
+        specifier: ^1.2.3
+        version: 1.2.13(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-popover':
+        specifier: latest
+        version: 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-progress':
+        specifier: latest
+        version: 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-radio-group':
+        specifier: latest
+        version: 1.3.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-scroll-area':
+        specifier: latest
+        version: 1.2.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-select':
+        specifier: latest
+        version: 2.2.5(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-separator':
+        specifier: ^1.1.1
+        version: 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slider':
+        specifier: latest
+        version: 1.3.5(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot':
+        specifier: ^1.1.1
+        version: 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-switch':
+        specifier: latest
+        version: 1.2.5(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-tabs':
+        specifier: latest
+        version: 1.1.12(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-toast':
+        specifier: latest
+        version: 1.2.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-toggle':
+        specifier: ^1.1.1
+        version: 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-toggle-group':
+        specifier: ^1.1.1
+        version: 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-tooltip':
+        specifier: latest
+        version: 1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@tanstack/react-table':
+        specifier: latest
+        version: 8.21.3(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      autoprefixer:
+        specifier: ^10.4.20
+        version: 10.4.21(postcss@8.5.4)
+      chart.js:
+        specifier: latest
+        version: 4.4.9
+      class-variance-authority:
+        specifier: ^0.7.1
+        version: 0.7.1
+      clsx:
+        specifier: ^2.1.1
+        version: 2.1.1
+      cmdk:
+        specifier: 1.0.4
+        version: 1.0.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      date-fns:
+        specifier: latest
+        version: 4.1.0
+      embla-carousel-react:
+        specifier: 8.5.1
+        version: 8.5.1(react@19.1.0)
+      input-otp:
+        specifier: 1.4.1
+        version: 1.4.1(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      lucide-react:
+        specifier: ^0.454.0
+        version: 0.454.0(react@19.1.0)
+      next:
+        specifier: 15.1.0
+        version: 15.1.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      next-themes:
+        specifier: ^0.4.4
+        version: 0.4.6(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react:
+        specifier: ^19
+        version: 19.1.0
+      react-day-picker:
+        specifier: latest
+        version: 9.7.0(react@19.1.0)
+      react-dom:
+        specifier: ^19
+        version: 19.1.0(react@19.1.0)
+      react-hook-form:
+        specifier: ^7.54.1
+        version: 7.56.4(react@19.1.0)
+      react-hot-toast:
+        specifier: ^2.5.2
+        version: 2.5.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react-resizable-panels:
+        specifier: ^2.1.7
+        version: 2.1.9(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      recharts:
+        specifier: latest
+        version: 2.15.3(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      regenerator-runtime:
+        specifier: latest
+        version: 0.14.1
+      sonner:
+        specifier: ^1.7.4
+        version: 1.7.4(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      tailwind-merge:
+        specifier: ^2.5.5
+        version: 2.6.0
+      tailwindcss-animate:
+        specifier: ^1.0.7
+        version: 1.0.7(tailwindcss@3.4.17)
+      vaul:
+        specifier: ^0.9.6
+        version: 0.9.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      zod:
+        specifier: ^3.24.1
+        version: 3.25.36
+    devDependencies:
+      '@types/node':
+        specifier: ^22
+        version: 22.15.24
+      '@types/react':
+        specifier: ^19
+        version: 19.1.6
+      '@types/react-dom':
+        specifier: ^19
+        version: 19.1.5(@types/react@19.1.6)
+      postcss:
+        specifier: ^8
+        version: 8.5.4
+      tailwindcss:
+        specifier: ^3.4.17
+        version: 3.4.17
+      typescript:
+        specifier: ^5
+        version: 5.8.3
+
+packages:
+
+  '@alloc/quick-lru@5.2.0':
+    resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
+    engines: {node: '>=10'}
+
+  '@ant-design/charts-util@0.0.1':
+    resolution: {integrity: sha512-zz9aCD8z90gzLm3XK17jyFdVtmpLrFApvexzIl5n9+TrxvIgrmOIqemlvx6QvzkmmXcOA6VIEJGzqQBSBAq55A==}
+    peerDependencies:
+      react: '>=16.8.4'
+      react-dom: '>=16.8.4'
+
+  '@ant-design/plots@2.4.0':
+    resolution: {integrity: sha512-5JxX6gDp9VyQizkQsCBKjGqlHpgKhfV6XTRNqKnrJMYet0FBNO0srDsa/rmQoZZLxMRvE8eZhCXnM7DhRUWUdA==}
+    peerDependencies:
+      react: '>=16.8.4'
+      react-dom: '>=16.8.4'
+
+  '@antv/component@2.1.3':
+    resolution: {integrity: sha512-TDePMyrx6rvOeUizcKwrNfSb4vL/hcIsIY01dTD1nXKpR3eDf/q558wN4zGH2NmgX/4TOes7UgSH4iCrpB0eMg==}
+
+  '@antv/coord@0.4.7':
+    resolution: {integrity: sha512-UTbrMLhwJUkKzqJx5KFnSRpU3BqrdLORJbwUbHK2zHSCT3q3bjcFA//ZYLVfIlwqFDXp/hzfMyRtp0c77A9ZVA==}
+
+  '@antv/event-emitter@0.1.3':
+    resolution: {integrity: sha512-4ddpsiHN9Pd4UIlWuKVK1C4IiZIdbwQvy9i7DUSI3xNJ89FPUFt8lxDYj8GzzfdllV0NkJTRxnG+FvLk0llidg==}
+
+  '@antv/expr@1.0.2':
+    resolution: {integrity: sha512-vrfdmPHkTuiS5voVutKl2l06w1ihBh9A8SFdQPEE+2KMVpkymzGOF1eWpfkbGZ7tiFE15GodVdhhHomD/hdIwg==}
+
+  '@antv/g-camera-api@2.0.38':
+    resolution: {integrity: sha512-BgFkUMcTO06Oz37Z+hVqxATwdWFE5DfBgMKlFaMwKKF/8n+7eNhlif1KBfcf2rEfGijS0FD0ZGKCr9uJ06+GIg==}
+
+  '@antv/g-canvas@2.0.43':
+    resolution: {integrity: sha512-iAMX+b1eEhwddhm7qiQAtNsnwJQDQsiE5/ELgzni0UHF28zMVTlc5FdDMXKLPuaYs9S/dw/MXBtqctRj2IjA1g==}
+
+  '@antv/g-dom-mutation-observer-api@2.0.35':
+    resolution: {integrity: sha512-bAl3ViXDHvLEbGvGZwZBg4gpoNjUTwVQ3XTmRAkymkFGkUy+KV0ZwFdqEegP25TQGPl85er/hB6MCu6Yt58AJA==}
+
+  '@antv/g-lite@2.2.19':
+    resolution: {integrity: sha512-QfxZsbLGTSGL18NgSOAVQURXC3xMXbmmS125EF7/vCzW2Lw2nF5I8k0KW4N09ty+/FtVpSESJX652g2phIvd5g==}
+
+  '@antv/g-math@3.0.1':
+    resolution: {integrity: sha512-FvkDBNRpj+HsLINunrL2PW0OlG368MlpHuihbxleuajGim5kra8tgISwCLmAf8Yz2b1CgZ9PvpohqiLzHS7HLg==}
+
+  '@antv/g-plugin-canvas-path-generator@2.1.19':
+    resolution: {integrity: sha512-+tc97NLvVYEFQnrLffmyxPpVXwUuTPbXBGy3aUTBYKd3YXhFBIKJYpQR39jsX2skgUvLh/67ZtA9QeUt6U41oQ==}
+
+  '@antv/g-plugin-canvas-picker@2.1.22':
+    resolution: {integrity: sha512-Pm/N+YTFOlXtjPran3wfN7Iuv0i2YglXrByxvBY8IQ3IzmB68+yZr+yPNRqjgbIM0yh45vIxz3SB/7VwYDPXMA==}
+
+  '@antv/g-plugin-canvas-renderer@2.2.22':
+    resolution: {integrity: sha512-+KyorG9lmwx5mogYZ6DP6BaiE9bnGUHojUxg+pTq032dx3SkCkLBl+CB5pZz1C2LEiQ+NkYtP3PlEjgSeeR/9A==}
+
+  '@antv/g-plugin-dom-interaction@2.1.24':
+    resolution: {integrity: sha512-1IrsUp2k+4oi2brVNstgxoisdwcdwqSNdEYJBDtVP1Bv5KZabKSs9lxlkxVR0DTb8BJtWBi80gmKQFIJ8znofQ==}
+
+  '@antv/g-plugin-dragndrop@2.0.35':
+    resolution: {integrity: sha512-1ZG+j91uEQAiFN0UqRkYCx3G8WWlKYoCXgTTx6m4YFJESJiab5M1C4OAi7zXclt1maOR154x3L/j3sRmBHFA+A==}
+
+  '@antv/g-plugin-html-renderer@2.1.24':
+    resolution: {integrity: sha512-UPEitSu5F42kRgqy8Cr34aC6O4+0cCnC+avv0ZMXUFOf7AMhMnjQLlHHo+GDfM/0r6m//0ZCsqHpv8vB0A+sUA==}
+
+  '@antv/g-plugin-image-loader@2.1.22':
+    resolution: {integrity: sha512-moA+EnV8Gnofj5Kk6btQ6DrufPYiGMvGWXrkBqHNrowfIUD+bFfHPnLm4gV52hHKYEvwnIP2XL+ayHRvzVyffw==}
+
+  '@antv/g-web-animations-api@2.1.25':
+    resolution: {integrity: sha512-xljNU+mDsdaDr+DwP77te2ZkNLcLiwuwppwXuRRpv/wVxUue726c/QbfYj/wMwJoBcOEtl/5hjAks/+gdvr3ag==}
+
+  '@antv/g2-extension-plot@0.2.2':
+    resolution: {integrity: sha512-KJXCXO7as+h0hDqirGXf1omrNuYzQmY3VmBmp7lIvkepbQ7sz3pPwy895r1FWETGF3vTk5UeFcAF5yzzBHWgbw==}
+
+  '@antv/g2@5.3.3':
+    resolution: {integrity: sha512-K+Pf1ZRslGn2IHQzA+2NrukeaNqrpOZB76zytkmt5bhGOhZgSWSfc9ubxi0OAlrBY+Yc6DfYcLiHziuASYoG5w==}
+
+  '@antv/g@6.1.25':
+    resolution: {integrity: sha512-qkXztWRVYQDl/x3tlA9Oww5DwaBCDDYXq6Wai9jfO8TZeIV3T8Dbw5eG/M115doyHX2vIVRkrE6+xiFe5weIHQ==}
+
+  '@antv/scale@0.4.16':
+    resolution: {integrity: sha512-5wg/zB5kXHxpTV5OYwJD3ja6R8yTiqIOkjOhmpEJiowkzRlbEC/BOyMvNUq5fqFIHnMCE9woO7+c3zxEQCKPjw==}
+
+  '@antv/util@2.0.17':
+    resolution: {integrity: sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==}
+
+  '@antv/util@3.3.10':
+    resolution: {integrity: sha512-basGML3DFA3O87INnzvDStjzS+n0JLEhRnRsDzP9keiXz8gT1z/fTdmJAZFOzMMWxy+HKbi7NbSt0+8vz/OsBQ==}
+
+  '@antv/vendor@1.0.11':
+    resolution: {integrity: sha512-LmhPEQ+aapk3barntaiIxJ5VHno/Tyab2JnfdcPzp5xONh/8VSfed4bo/9xKo5HcUAEydko38vYLfj6lJliLiw==}
+
+  '@babel/runtime@7.27.3':
+    resolution: {integrity: sha512-7EYtGezsdiDMyY80+65EzwiGmcJqpmcZCojSXaRgdrBaGtWTgDZKq69cPIVped6MkIM78cTQ2GOiEYjwOlG4xw==}
+    engines: {node: '>=6.9.0'}
+
+  '@date-fns/tz@1.2.0':
+    resolution: {integrity: sha512-LBrd7MiJZ9McsOgxqWX7AaxrDjcFVjWH/tIKJd7pnR7McaslGYOP1QmmiBXdJH/H/yLCT+rcQ7FaPBUxRGUtrg==}
+
+  '@emnapi/runtime@1.4.3':
+    resolution: {integrity: sha512-pBPWdu6MLKROBX05wSNKcNb++m5Er+KQ9QkB+WVM+pW2Kx9hoSrVTnu3BdkI5eBLZoKu/J6mW/B6i6bJB2ytXQ==}
+
+  '@floating-ui/core@1.7.0':
+    resolution: {integrity: sha512-FRdBLykrPPA6P76GGGqlex/e7fbe0F1ykgxHYNXQsH/iTEtjMj/f9bpY5oQqbjt5VgZvgz/uKXbGuROijh3VLA==}
+
+  '@floating-ui/dom@1.7.0':
+    resolution: {integrity: sha512-lGTor4VlXcesUMh1cupTUTDoCxMb0V6bm3CnxHzQcw8Eaf1jQbgQX4i02fYgT0vJ82tb5MZ4CZk1LRGkktJCzg==}
+
+  '@floating-ui/react-dom@2.1.2':
+    resolution: {integrity: sha512-06okr5cgPzMNBy+Ycse2A6udMi4bqwW/zgBF/rwjcNqWkyr82Mcg8b0vjX8OJpZFy/FKjJmw6wV7t44kK6kW7A==}
+    peerDependencies:
+      react: '>=16.8.0'
+      react-dom: '>=16.8.0'
+
+  '@floating-ui/utils@0.2.9':
+    resolution: {integrity: sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==}
+
+  '@hookform/resolvers@3.10.0':
+    resolution: {integrity: sha512-79Dv+3mDF7i+2ajj7SkypSKHhl1cbln1OGavqrsF7p6mbUv11xpqpacPsGDCTRvCSjEEIez2ef1NveSVL3b0Ag==}
+    peerDependencies:
+      react-hook-form: ^7.0.0
+
+  '@img/sharp-darwin-arm64@0.33.5':
+    resolution: {integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@img/sharp-darwin-x64@0.33.5':
+    resolution: {integrity: sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@img/sharp-libvips-darwin-arm64@1.0.4':
+    resolution: {integrity: sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@img/sharp-libvips-darwin-x64@1.0.4':
+    resolution: {integrity: sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@img/sharp-libvips-linux-arm64@1.0.4':
+    resolution: {integrity: sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-libvips-linux-arm@1.0.5':
+    resolution: {integrity: sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-libvips-linux-s390x@1.0.4':
+    resolution: {integrity: sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-libvips-linux-x64@1.0.4':
+    resolution: {integrity: sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-libvips-linuxmusl-arm64@1.0.4':
+    resolution: {integrity: sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@img/sharp-libvips-linuxmusl-x64@1.0.4':
+    resolution: {integrity: sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@img/sharp-linux-arm64@0.33.5':
+    resolution: {integrity: sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-linux-arm@0.33.5':
+    resolution: {integrity: sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-linux-s390x@0.33.5':
+    resolution: {integrity: sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-linux-x64@0.33.5':
+    resolution: {integrity: sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@img/sharp-linuxmusl-arm64@0.33.5':
+    resolution: {integrity: sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@img/sharp-linuxmusl-x64@0.33.5':
+    resolution: {integrity: sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@img/sharp-wasm32@0.33.5':
+    resolution: {integrity: sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [wasm32]
+
+  '@img/sharp-win32-ia32@0.33.5':
+    resolution: {integrity: sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [ia32]
+    os: [win32]
+
+  '@img/sharp-win32-x64@0.33.5':
+    resolution: {integrity: sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+    cpu: [x64]
+    os: [win32]
+
+  '@isaacs/cliui@8.0.2':
+    resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==}
+    engines: {node: '>=12'}
+
+  '@jridgewell/gen-mapping@0.3.8':
+    resolution: {integrity: sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==}
+    engines: {node: '>=6.0.0'}
+
+  '@jridgewell/resolve-uri@3.1.2':
+    resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
+    engines: {node: '>=6.0.0'}
+
+  '@jridgewell/set-array@1.2.1':
+    resolution: {integrity: sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==}
+    engines: {node: '>=6.0.0'}
+
+  '@jridgewell/sourcemap-codec@1.5.0':
+    resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==}
+
+  '@jridgewell/trace-mapping@0.3.25':
+    resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
+
+  '@kurkle/color@0.3.4':
+    resolution: {integrity: sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==}
+
+  '@next/env@15.1.0':
+    resolution: {integrity: sha512-UcCO481cROsqJuszPPXJnb7GGuLq617ve4xuAyyNG4VSSocJNtMU5Fsx+Lp6mlN8c7W58aZLc5y6D/2xNmaK+w==}
+
+  '@next/swc-darwin-arm64@15.1.0':
+    resolution: {integrity: sha512-ZU8d7xxpX14uIaFC3nsr4L++5ZS/AkWDm1PzPO6gD9xWhFkOj2hzSbSIxoncsnlJXB1CbLOfGVN4Zk9tg83PUw==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@next/swc-darwin-x64@15.1.0':
+    resolution: {integrity: sha512-DQ3RiUoW2XC9FcSM4ffpfndq1EsLV0fj0/UY33i7eklW5akPUCo6OX2qkcLXZ3jyPdo4sf2flwAED3AAq3Om2Q==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@next/swc-linux-arm64-gnu@15.1.0':
+    resolution: {integrity: sha512-M+vhTovRS2F//LMx9KtxbkWk627l5Q7AqXWWWrfIzNIaUFiz2/NkOFkxCFyNyGACi5YbA8aekzCLtbDyfF/v5Q==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@next/swc-linux-arm64-musl@15.1.0':
+    resolution: {integrity: sha512-Qn6vOuwaTCx3pNwygpSGtdIu0TfS1KiaYLYXLH5zq1scoTXdwYfdZtwvJTpB1WrLgiQE2Ne2kt8MZok3HlFqmg==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@next/swc-linux-x64-gnu@15.1.0':
+    resolution: {integrity: sha512-yeNh9ofMqzOZ5yTOk+2rwncBzucc6a1lyqtg8xZv0rH5znyjxHOWsoUtSq4cUTeeBIiXXX51QOOe+VoCjdXJRw==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@next/swc-linux-x64-musl@15.1.0':
+    resolution: {integrity: sha512-t9IfNkHQs/uKgPoyEtU912MG6a1j7Had37cSUyLTKx9MnUpjj+ZDKw9OyqTI9OwIIv0wmkr1pkZy+3T5pxhJPg==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@next/swc-win32-arm64-msvc@15.1.0':
+    resolution: {integrity: sha512-WEAoHyG14t5sTavZa1c6BnOIEukll9iqFRTavqRVPfYmfegOAd5MaZfXgOGG6kGo1RduyGdTHD4+YZQSdsNZXg==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@next/swc-win32-x64-msvc@15.1.0':
+    resolution: {integrity: sha512-J1YdKuJv9xcixzXR24Dv+4SaDKc2jj31IVUEMdO5xJivMTXuE6MAdIi4qPjSymHuFG8O5wbfWKnhJUcHHpj5CA==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [win32]
+
+  '@nodelib/fs.scandir@2.1.5':
+    resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
+    engines: {node: '>= 8'}
+
+  '@nodelib/fs.stat@2.0.5':
+    resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==}
+    engines: {node: '>= 8'}
+
+  '@nodelib/fs.walk@1.2.8':
+    resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
+    engines: {node: '>= 8'}
+
+  '@pkgjs/parseargs@0.11.0':
+    resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
+    engines: {node: '>=14'}
+
+  '@radix-ui/number@1.1.1':
+    resolution: {integrity: sha512-MkKCwxlXTgz6CFoJx3pCwn07GKp36+aZyu/u2Ln2VrA5DcdyCZkASEDBTd8x5whTQQL5CiYf4prXKLcgQdv29g==}
+
+  '@radix-ui/primitive@1.1.2':
+    resolution: {integrity: sha512-XnbHrrprsNqZKQhStrSwgRUQzoCI1glLzdw79xiZPoofhGICeZRSQ3dIxAKH1gb3OHfNf4d6f+vAv3kil2eggA==}
+
+  '@radix-ui/react-accordion@1.2.11':
+    resolution: {integrity: sha512-l3W5D54emV2ues7jjeG1xcyN7S3jnK3zE2zHqgn0CmMsy9lNJwmgcrmaxS+7ipw15FAivzKNzH3d5EcGoFKw0A==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-alert-dialog@1.1.14':
+    resolution: {integrity: sha512-IOZfZ3nPvN6lXpJTBCunFQPRSvK8MDgSc1FB85xnIpUKOw9en0dJj8JmCAxV7BiZdtYlUpmrQjoTFkVYtdoWzQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-arrow@1.1.7':
+    resolution: {integrity: sha512-F+M1tLhO+mlQaOWspE8Wstg+z6PwxwRd8oQ8IXceWz92kfAmalTRf0EjrouQeo7QssEPfCn05B4Ihs1K9WQ/7w==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-aspect-ratio@1.1.7':
+    resolution: {integrity: sha512-Yq6lvO9HQyPwev1onK1daHCHqXVLzPhSVjmsNjCa2Zcxy2f7uJD2itDtxknv6FzAKCwD1qQkeVDmX/cev13n/g==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-avatar@1.1.10':
+    resolution: {integrity: sha512-V8piFfWapM5OmNCXTzVQY+E1rDa53zY+MQ4Y7356v4fFz6vqCyUtIz2rUD44ZEdwg78/jKmMJHj07+C/Z/rcog==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-checkbox@1.3.2':
+    resolution: {integrity: sha512-yd+dI56KZqawxKZrJ31eENUwqc1QSqg4OZ15rybGjF2ZNwMO+wCyHzAVLRp9qoYJf7kYy0YpZ2b0JCzJ42HZpA==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-collapsible@1.1.11':
+    resolution: {integrity: sha512-2qrRsVGSCYasSz1RFOorXwl0H7g7J1frQtgpQgYrt+MOidtPAINHn9CPovQXb83r8ahapdx3Tu0fa/pdFFSdPg==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-collection@1.1.7':
+    resolution: {integrity: sha512-Fh9rGN0MoI4ZFUNyfFVNU4y9LUz93u9/0K+yLgA2bwRojxM8JU1DyvvMBabnZPBgMWREAJvU2jjVzq+LrFUglw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-compose-refs@1.1.2':
+    resolution: {integrity: sha512-z4eqJvfiNnFMHIIvXP3CY57y2WJs5g2v3X0zm9mEJkrkNv4rDxu+sg9Jh8EkXyeqBkB7SOcboo9dMVqhyrACIg==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-context-menu@2.2.15':
+    resolution: {integrity: sha512-UsQUMjcYTsBjTSXw0P3GO0werEQvUY2plgRQuKoCTtkNr45q1DiL51j4m7gxhABzZ0BadoXNsIbg7F3KwiUBbw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-context@1.1.2':
+    resolution: {integrity: sha512-jCi/QKUM2r1Ju5a3J64TH2A5SpKAgh0LpknyqdQ4m6DCV0xJ2HG1xARRwNGPQfi1SLdLWZ1OJz6F4OMBBNiGJA==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-dialog@1.1.14':
+    resolution: {integrity: sha512-+CpweKjqpzTmwRwcYECQcNYbI8V9VSQt0SNFKeEBLgfucbsLssU6Ppq7wUdNXEGb573bMjFhVjKVll8rmV6zMw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-direction@1.1.1':
+    resolution: {integrity: sha512-1UEWRX6jnOA2y4H5WczZ44gOOjTEmlqv1uNW4GAJEO5+bauCBhv8snY65Iw5/VOS/ghKN9gr2KjnLKxrsvoMVw==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-dismissable-layer@1.1.10':
+    resolution: {integrity: sha512-IM1zzRV4W3HtVgftdQiiOmA0AdJlCtMLe00FXaHwgt3rAnNsIyDqshvkIW3hj/iu5hu8ERP7KIYki6NkqDxAwQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-dropdown-menu@2.1.15':
+    resolution: {integrity: sha512-mIBnOjgwo9AH3FyKaSWoSu/dYj6VdhJ7frEPiGTeXCdUFHjl9h3mFh2wwhEtINOmYXWhdpf1rY2minFsmaNgVQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-focus-guards@1.1.2':
+    resolution: {integrity: sha512-fyjAACV62oPV925xFCrH8DR5xWhg9KYtJT4s3u54jxp+L/hbpTY2kIeEFFbFe+a/HCE94zGQMZLIpVTPVZDhaA==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-focus-scope@1.1.7':
+    resolution: {integrity: sha512-t2ODlkXBQyn7jkl6TNaw/MtVEVvIGelJDCG41Okq/KwUsJBwQ4XVZsHAVUkK4mBv3ewiAS3PGuUWuY2BoK4ZUw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-hover-card@1.1.14':
+    resolution: {integrity: sha512-CPYZ24Mhirm+g6D8jArmLzjYu4Eyg3TTUHswR26QgzXBHBe64BO/RHOJKzmF/Dxb4y4f9PKyJdwm/O/AhNkb+Q==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-icons@1.3.2':
+    resolution: {integrity: sha512-fyQIhGDhzfc9pK2kH6Pl9c4BDJGfMkPqkyIgYDthyNYoNg3wVhoJMMh19WS4Up/1KMPFVpNsT2q3WmXn2N1m6g==}
+    peerDependencies:
+      react: ^16.x || ^17.x || ^18.x || ^19.0.0 || ^19.0.0-rc
+
+  '@radix-ui/react-id@1.1.1':
+    resolution: {integrity: sha512-kGkGegYIdQsOb4XjsfM97rXsiHaBwco+hFI66oO4s9LU+PLAC5oJ7khdOVFxkhsmlbpUqDAvXw11CluXP+jkHg==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-label@2.1.7':
+    resolution: {integrity: sha512-YT1GqPSL8kJn20djelMX7/cTRp/Y9w5IZHvfxQTVHrOqa2yMl7i/UfMqKRU5V7mEyKTrUVgJXhNQPVCG8PBLoQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-menu@2.1.15':
+    resolution: {integrity: sha512-tVlmA3Vb9n8SZSd+YSbuFR66l87Wiy4du+YE+0hzKQEANA+7cWKH1WgqcEX4pXqxUFQKrWQGHdvEfw00TjFiew==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-menubar@1.1.15':
+    resolution: {integrity: sha512-Z71C7LGD+YDYo3TV81paUs8f3Zbmkvg6VLRQpKYfzioOE6n7fOhA3ApK/V/2Odolxjoc4ENk8AYCjohCNayd5A==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-navigation-menu@1.2.13':
+    resolution: {integrity: sha512-WG8wWfDiJlSF5hELjwfjSGOXcBR/ZMhBFCGYe8vERpC39CQYZeq1PQ2kaYHdye3V95d06H89KGMsVCIE4LWo3g==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-popover@1.1.14':
+    resolution: {integrity: sha512-ODz16+1iIbGUfFEfKx2HTPKizg2MN39uIOV8MXeHnmdd3i/N9Wt7vU46wbHsqA0xoaQyXVcs0KIlBdOA2Y95bw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-popper@1.2.7':
+    resolution: {integrity: sha512-IUFAccz1JyKcf/RjB552PlWwxjeCJB8/4KxT7EhBHOJM+mN7LdW+B3kacJXILm32xawcMMjb2i0cIZpo+f9kiQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-portal@1.1.9':
+    resolution: {integrity: sha512-bpIxvq03if6UNwXZ+HTK71JLh4APvnXntDc6XOX8UVq4XQOVl7lwok0AvIl+b8zgCw3fSaVTZMpAPPagXbKmHQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-presence@1.1.4':
+    resolution: {integrity: sha512-ueDqRbdc4/bkaQT3GIpLQssRlFgWaL/U2z/S31qRwwLWoxHLgry3SIfCwhxeQNbirEUXFa+lq3RL3oBYXtcmIA==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-primitive@2.1.3':
+    resolution: {integrity: sha512-m9gTwRkhy2lvCPe6QJp4d3G1TYEUHn/FzJUtq9MjH46an1wJU+GdoGC5VLof8RX8Ft/DlpshApkhswDLZzHIcQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-progress@1.1.7':
+    resolution: {integrity: sha512-vPdg/tF6YC/ynuBIJlk1mm7Le0VgW6ub6J2UWnTQ7/D23KXcPI1qy+0vBkgKgd38RCMJavBXpB83HPNFMTb0Fg==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-radio-group@1.3.7':
+    resolution: {integrity: sha512-9w5XhD0KPOrm92OTTE0SysH3sYzHsSTHNvZgUBo/VZ80VdYyB5RneDbc0dKpURS24IxkoFRu/hI0i4XyfFwY6g==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-roving-focus@1.1.10':
+    resolution: {integrity: sha512-dT9aOXUen9JSsxnMPv/0VqySQf5eDQ6LCk5Sw28kamz8wSOW2bJdlX2Bg5VUIIcV+6XlHpWTIuTPCf/UNIyq8Q==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-scroll-area@1.2.9':
+    resolution: {integrity: sha512-YSjEfBXnhUELsO2VzjdtYYD4CfQjvao+lhhrX5XsHD7/cyUNzljF1FHEbgTPN7LH2MClfwRMIsYlqTYpKTTe2A==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-select@2.2.5':
+    resolution: {integrity: sha512-HnMTdXEVuuyzx63ME0ut4+sEMYW6oouHWNGUZc7ddvUWIcfCva/AMoqEW/3wnEllriMWBa0RHspCYnfCWJQYmA==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-separator@1.1.7':
+    resolution: {integrity: sha512-0HEb8R9E8A+jZjvmFCy/J4xhbXy3TV+9XSnGJ3KvTtjlIUy/YQ/p6UYZvi7YbeoeXdyU9+Y3scizK6hkY37baA==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-slider@1.3.5':
+    resolution: {integrity: sha512-rkfe2pU2NBAYfGaxa3Mqosi7VZEWX5CxKaanRv0vZd4Zhl9fvQrg0VM93dv3xGLGfrHuoTRF3JXH8nb9g+B3fw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-slot@1.2.3':
+    resolution: {integrity: sha512-aeNmHnBxbi2St0au6VBVC7JXFlhLlOnvIIlePNniyUNAClzmtAUEY8/pBiK3iHjufOlwA+c20/8jngo7xcrg8A==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-switch@1.2.5':
+    resolution: {integrity: sha512-5ijLkak6ZMylXsaImpZ8u4Rlf5grRmoc0p0QeX9VJtlrM4f5m3nCTX8tWga/zOA8PZYIR/t0p2Mnvd7InrJ6yQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-tabs@1.1.12':
+    resolution: {integrity: sha512-GTVAlRVrQrSw3cEARM0nAx73ixrWDPNZAruETn3oHCNP6SbZ/hNxdxp+u7VkIEv3/sFoLq1PfcHrl7Pnp0CDpw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-toast@1.2.14':
+    resolution: {integrity: sha512-nAP5FBxBJGQ/YfUB+r+O6USFVkWq3gAInkxyEnmvEV5jtSbfDhfa4hwX8CraCnbjMLsE7XSf/K75l9xXY7joWg==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-toggle-group@1.1.10':
+    resolution: {integrity: sha512-kiU694Km3WFLTC75DdqgM/3Jauf3rD9wxeS9XtyWFKsBUeZA337lC+6uUazT7I1DhanZ5gyD5Stf8uf2dbQxOQ==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-toggle@1.1.9':
+    resolution: {integrity: sha512-ZoFkBBz9zv9GWer7wIjvdRxmh2wyc2oKWw6C6CseWd6/yq1DK/l5lJ+wnsmFwJZbBYqr02mrf8A2q/CVCuM3ZA==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-tooltip@1.2.7':
+    resolution: {integrity: sha512-Ap+fNYwKTYJ9pzqW+Xe2HtMRbQ/EeWkj2qykZ6SuEV4iS/o1bZI5ssJbk4D2r8XuDuOBVz/tIx2JObtuqU+5Zw==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/react-use-callback-ref@1.1.1':
+    resolution: {integrity: sha512-FkBMwD+qbGQeMu1cOHnuGB6x4yzPjho8ap5WtbEJ26umhgqVXbhekKUQO+hZEL1vU92a3wHwdp0HAcqAUF5iDg==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-controllable-state@1.2.2':
+    resolution: {integrity: sha512-BjasUjixPFdS+NKkypcyyN5Pmg83Olst0+c6vGov0diwTEo6mgdqVR6hxcEgFuh4QrAs7Rc+9KuGJ9TVCj0Zzg==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-effect-event@0.0.2':
+    resolution: {integrity: sha512-Qp8WbZOBe+blgpuUT+lw2xheLP8q0oatc9UpmiemEICxGvFLYmHm9QowVZGHtJlGbS6A6yJ3iViad/2cVjnOiA==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-escape-keydown@1.1.1':
+    resolution: {integrity: sha512-Il0+boE7w/XebUHyBjroE+DbByORGR9KKmITzbR7MyQ4akpORYP/ZmbhAr0DG7RmmBqoOnZdy2QlvajJ2QA59g==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-is-hydrated@0.1.0':
+    resolution: {integrity: sha512-U+UORVEq+cTnRIaostJv9AGdV3G6Y+zbVd+12e18jQ5A3c0xL03IhnHuiU4UV69wolOQp5GfR58NW/EgdQhwOA==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-layout-effect@1.1.1':
+    resolution: {integrity: sha512-RbJRS4UWQFkzHTTwVymMTUv8EqYhOp8dOOviLj2ugtTiXRaRQS7GLGxZTLL1jWhMeoSCf5zmcZkqTl9IiYfXcQ==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-previous@1.1.1':
+    resolution: {integrity: sha512-2dHfToCj/pzca2Ck724OZ5L0EVrr3eHRNsG/b3xQJLA2hZpVCS99bLAX+hm1IHXDEnzU6by5z/5MIY794/a8NQ==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-rect@1.1.1':
+    resolution: {integrity: sha512-QTYuDesS0VtuHNNvMh+CjlKJ4LJickCMUAqjlE3+j8w+RlRpwyX3apEQKGFzbZGdo7XNG1tXa+bQqIE7HIXT2w==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-use-size@1.1.1':
+    resolution: {integrity: sha512-ewrXRDTAqAXlkl6t/fkXWNAhFX9I+CkKlw6zjEwk86RSPKwZr3xpBRso655aqYafwtnbpHLj6toFzmd6xdVptQ==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@radix-ui/react-visually-hidden@1.2.3':
+    resolution: {integrity: sha512-pzJq12tEaaIhqjbzpCuv/OypJY/BPavOofm+dbab+MHLajy277+1lLm6JFcGgF5eskJ6mquGirhXY2GD/8u8Ug==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
+  '@radix-ui/rect@1.1.1':
+    resolution: {integrity: sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==}
+
+  '@swc/counter@0.1.3':
+    resolution: {integrity: sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==}
+
+  '@swc/helpers@0.5.15':
+    resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==}
+
+  '@tanstack/react-table@8.21.3':
+    resolution: {integrity: sha512-5nNMTSETP4ykGegmVkhjcS8tTLW6Vl4axfEGQN3v0zdHYbK4UfoqfPChclTrJ4EoK9QynqAu9oUf8VEmrpZ5Ww==}
+    engines: {node: '>=12'}
+    peerDependencies:
+      react: '>=16.8'
+      react-dom: '>=16.8'
+
+  '@tanstack/table-core@8.21.3':
+    resolution: {integrity: sha512-ldZXEhOBb8Is7xLs01fR3YEc3DERiz5silj8tnGkFZytt1abEvl/GhUmCE0PMLaMPTa3Jk4HbKmRlHmu+gCftg==}
+    engines: {node: '>=12'}
+
+  '@types/d3-array@3.2.1':
+    resolution: {integrity: sha512-Y2Jn2idRrLzUfAKV2LyRImR+y4oa2AntrgID95SHJxuMUrkNXmanDSed71sRNZysveJVt1hLLemQZIady0FpEg==}
+
+  '@types/d3-color@3.1.3':
+    resolution: {integrity: sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==}
+
+  '@types/d3-dispatch@3.0.6':
+    resolution: {integrity: sha512-4fvZhzMeeuBJYZXRXrRIQnvUYfyXwYmLsdiN7XXmVNQKKw1cM8a5WdID0g1hVFZDqT9ZqZEY5pD44p24VS7iZQ==}
+
+  '@types/d3-dsv@3.0.7':
+    resolution: {integrity: sha512-n6QBF9/+XASqcKK6waudgL0pf/S5XHPPI8APyMLLUHd8NqouBGLsU8MgtO7NINGtPBtk9Kko/W4ea0oAspwh9g==}
+
+  '@types/d3-ease@3.0.2':
+    resolution: {integrity: sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA==}
+
+  '@types/d3-fetch@3.0.7':
+    resolution: {integrity: sha512-fTAfNmxSb9SOWNB9IoG5c8Hg6R+AzUHDRlsXsDZsNp6sxAEOP0tkP3gKkNSO/qmHPoBFTxNrjDprVHDQDvo5aA==}
+
+  '@types/d3-force@3.0.10':
+    resolution: {integrity: sha512-ZYeSaCF3p73RdOKcjj+swRlZfnYpK1EbaDiYICEEp5Q6sUiqFaFQ9qgoshp5CzIyyb/yD09kD9o2zEltCexlgw==}
+
+  '@types/d3-format@3.0.4':
+    resolution: {integrity: sha512-fALi2aI6shfg7vM5KiR1wNJnZ7r6UuggVqtDA+xiEdPZQwy/trcQaHnwShLuLdta2rTymCNpxYTiMZX/e09F4g==}
+
+  '@types/d3-geo@3.1.0':
+    resolution: {integrity: sha512-856sckF0oP/diXtS4jNsiQw/UuK5fQG8l/a9VVLeSouf1/PPbBE1i1W852zVwKwYCBkFJJB7nCFTbk6UMEXBOQ==}
+
+  '@types/d3-hierarchy@3.1.7':
+    resolution: {integrity: sha512-tJFtNoYBtRtkNysX1Xq4sxtjK8YgoWUNpIiUee0/jHGRwqvzYxkq0hGVbbOGSz+JgFxxRu4K8nb3YpG3CMARtg==}
+
+  '@types/d3-interpolate@3.0.4':
+    resolution: {integrity: sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==}
+
+  '@types/d3-path@3.1.1':
+    resolution: {integrity: sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==}
+
+  '@types/d3-quadtree@3.0.6':
+    resolution: {integrity: sha512-oUzyO1/Zm6rsxKRHA1vH0NEDG58HrT5icx/azi9MF1TWdtttWl0UIUsjEQBBh+SIkrpd21ZjEv7ptxWys1ncsg==}
+
+  '@types/d3-random@3.0.3':
+    resolution: {integrity: sha512-Imagg1vJ3y76Y2ea0871wpabqp613+8/r0mCLEBfdtqC7xMSfj9idOnmBYyMoULfHePJyxMAw3nWhJxzc+LFwQ==}
+
+  '@types/d3-scale-chromatic@3.1.0':
+    resolution: {integrity: sha512-iWMJgwkK7yTRmWqRB5plb1kadXyQ5Sj8V/zYlFGMUBbIPKQScw+Dku9cAAMgJG+z5GYDoMjWGLVOvjghDEFnKQ==}
+
+  '@types/d3-scale@4.0.9':
+    resolution: {integrity: sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==}
+
+  '@types/d3-shape@3.1.7':
+    resolution: {integrity: sha512-VLvUQ33C+3J+8p+Daf+nYSOsjB4GXp19/S/aGo60m9h1v6XaxjiT82lKVWJCfzhtuZ3yD7i/TPeC/fuKLLOSmg==}
+
+  '@types/d3-time@3.0.4':
+    resolution: {integrity: sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g==}
+
+  '@types/d3-timer@3.0.2':
+    resolution: {integrity: sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==}
+
+  '@types/geojson@7946.0.16':
+    resolution: {integrity: sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==}
+
+  '@types/node@22.15.24':
+    resolution: {integrity: sha512-w9CZGm9RDjzTh/D+hFwlBJ3ziUaVw7oufKA3vOFSOZlzmW9AkZnfjPb+DLnrV6qtgL/LNmP0/2zBNCFHL3F0ng==}
+
+  '@types/react-dom@19.1.5':
+    resolution: {integrity: sha512-CMCjrWucUBZvohgZxkjd6S9h0nZxXjzus6yDfUb+xLxYM7VvjKNH1tQrE9GWLql1XoOP4/Ds3bwFqShHUYraGg==}
+    peerDependencies:
+      '@types/react': ^19.0.0
+
+  '@types/react@19.1.6':
+    resolution: {integrity: sha512-JeG0rEWak0N6Itr6QUx+X60uQmN+5t3j9r/OVDtWzFXKaj6kD1BwJzOksD0FF6iWxZlbE1kB0q9vtnU2ekqa1Q==}
+
+  ansi-regex@5.0.1:
+    resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
+    engines: {node: '>=8'}
+
+  ansi-regex@6.1.0:
+    resolution: {integrity: sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==}
+    engines: {node: '>=12'}
+
+  ansi-styles@4.3.0:
+    resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
+    engines: {node: '>=8'}
+
+  ansi-styles@6.2.1:
+    resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
+    engines: {node: '>=12'}
+
+  any-promise@1.3.0:
+    resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
+
+  anymatch@3.1.3:
+    resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
+    engines: {node: '>= 8'}
+
+  arg@5.0.2:
+    resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
+
+  aria-hidden@1.2.6:
+    resolution: {integrity: sha512-ik3ZgC9dY/lYVVM++OISsaYDeg1tb0VtP5uL3ouh1koGOaUMDPpbFIei4JkFimWUFPn90sbMNMXQAIVOlnYKJA==}
+    engines: {node: '>=10'}
+
+  autoprefixer@10.4.21:
+    resolution: {integrity: sha512-O+A6LWV5LDHSJD3LjHYoNi4VLsj/Whi7k6zG12xTYaU4cQ8oxQGckXNX8cRHK5yOZ/ppVHe0ZBXGzSV9jXdVbQ==}
+    engines: {node: ^10 || ^12 || >=14}
+    hasBin: true
+    peerDependencies:
+      postcss: ^8.1.0
+
+  balanced-match@1.0.2:
+    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
+
+  binary-extensions@2.3.0:
+    resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
+    engines: {node: '>=8'}
+
+  brace-expansion@2.0.1:
+    resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
+
+  braces@3.0.3:
+    resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
+    engines: {node: '>=8'}
+
+  browserslist@4.25.0:
+    resolution: {integrity: sha512-PJ8gYKeS5e/whHBh8xrwYK+dAvEj7JXtz6uTucnMRB8OiGTsKccFekoRrjajPBHV8oOY+2tI4uxeceSimKwMFA==}
+    engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
+    hasBin: true
+
+  busboy@1.6.0:
+    resolution: {integrity: sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==}
+    engines: {node: '>=10.16.0'}
+
+  camelcase-css@2.0.1:
+    resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
+    engines: {node: '>= 6'}
+
+  caniuse-lite@1.0.30001720:
+    resolution: {integrity: sha512-Ec/2yV2nNPwb4DnTANEV99ZWwm3ZWfdlfkQbWSDDt+PsXEVYwlhPH8tdMaPunYTKKmz7AnHi2oNEi1GcmKCD8g==}
+
+  chart.js@4.4.9:
+    resolution: {integrity: sha512-EyZ9wWKgpAU0fLJ43YAEIF8sr5F2W3LqbS40ZJyHIner2lY14ufqv2VMp69MAiZ2rpwxEUxEhIH/0U3xyRynxg==}
+    engines: {pnpm: '>=8'}
+
+  chokidar@3.6.0:
+    resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
+    engines: {node: '>= 8.10.0'}
+
+  class-variance-authority@0.7.1:
+    resolution: {integrity: sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg==}
+
+  client-only@0.0.1:
+    resolution: {integrity: sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==}
+
+  clsx@2.1.1:
+    resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
+    engines: {node: '>=6'}
+
+  cmdk@1.0.4:
+    resolution: {integrity: sha512-AnsjfHyHpQ/EFeAnG216WY7A5LiYCoZzCSygiLvfXC3H3LFGCprErteUcszaVluGOhuOTbJS3jWHrSDYPBBygg==}
+    peerDependencies:
+      react: ^18 || ^19 || ^19.0.0-rc
+      react-dom: ^18 || ^19 || ^19.0.0-rc
+
+  color-convert@2.0.1:
+    resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
+    engines: {node: '>=7.0.0'}
+
+  color-name@1.1.4:
+    resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
+
+  color-string@1.9.1:
+    resolution: {integrity: sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==}
+
+  color@4.2.3:
+    resolution: {integrity: sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==}
+    engines: {node: '>=12.5.0'}
+
+  commander@4.1.1:
+    resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
+    engines: {node: '>= 6'}
+
+  commander@7.2.0:
+    resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
+    engines: {node: '>= 10'}
+
+  cross-spawn@7.0.6:
+    resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
+    engines: {node: '>= 8'}
+
+  cssesc@3.0.0:
+    resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
+    engines: {node: '>=4'}
+    hasBin: true
+
+  csstype@3.1.3:
+    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
+
+  d3-array@3.2.4:
+    resolution: {integrity: sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==}
+    engines: {node: '>=12'}
+
+  d3-binarytree@1.0.2:
+    resolution: {integrity: sha512-cElUNH+sHu95L04m92pG73t2MEJXKu+GeKUN1TJkFsu93E5W8E9Sc3kHEGJKgenGvj19m6upSn2EunvMgMD2Yw==}
+
+  d3-color@3.1.0:
+    resolution: {integrity: sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==}
+    engines: {node: '>=12'}
+
+  d3-dispatch@3.0.1:
+    resolution: {integrity: sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==}
+    engines: {node: '>=12'}
+
+  d3-dsv@3.0.1:
+    resolution: {integrity: sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  d3-ease@3.0.1:
+    resolution: {integrity: sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==}
+    engines: {node: '>=12'}
+
+  d3-fetch@3.0.1:
+    resolution: {integrity: sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==}
+    engines: {node: '>=12'}
+
+  d3-force-3d@3.0.6:
+    resolution: {integrity: sha512-4tsKHUPLOVkyfEffZo1v6sFHvGFwAIIjt/W8IThbp08DYAsXZck+2pSHEG5W1+gQgEvFLdZkYvmJAbRM2EzMnA==}
+    engines: {node: '>=12'}
+
+  d3-force@3.0.0:
+    resolution: {integrity: sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==}
+    engines: {node: '>=12'}
+
+  d3-format@3.1.0:
+    resolution: {integrity: sha512-YyUI6AEuY/Wpt8KWLgZHsIU86atmikuoOmCfommt0LYHiQSPjvX2AcFc38PX0CBpr2RCyZhjex+NS/LPOv6YqA==}
+    engines: {node: '>=12'}
+
+  d3-geo-projection@4.0.0:
+    resolution: {integrity: sha512-p0bK60CEzph1iqmnxut7d/1kyTmm3UWtPlwdkM31AU+LW+BXazd5zJdoCn7VFxNCHXRngPHRnsNn5uGjLRGndg==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  d3-geo@3.1.1:
+    resolution: {integrity: sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==}
+    engines: {node: '>=12'}
+
+  d3-hierarchy@3.1.2:
+    resolution: {integrity: sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==}
+    engines: {node: '>=12'}
+
+  d3-interpolate@3.0.1:
+    resolution: {integrity: sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==}
+    engines: {node: '>=12'}
+
+  d3-octree@1.1.0:
+    resolution: {integrity: sha512-F8gPlqpP+HwRPMO/8uOu5wjH110+6q4cgJvgJT6vlpy3BEaDIKlTZrgHKZSp/i1InRpVfh4puY/kvL6MxK930A==}
+
+  d3-path@3.1.0:
+    resolution: {integrity: sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==}
+    engines: {node: '>=12'}
+
+  d3-quadtree@3.0.1:
+    resolution: {integrity: sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==}
+    engines: {node: '>=12'}
+
+  d3-random@3.0.1:
+    resolution: {integrity: sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==}
+    engines: {node: '>=12'}
+
+  d3-regression@1.3.10:
+    resolution: {integrity: sha512-PF8GWEL70cHHWpx2jUQXc68r1pyPHIA+St16muk/XRokETzlegj5LriNKg7o4LR0TySug4nHYPJNNRz/W+/Niw==}
+
+  d3-scale-chromatic@3.1.0:
+    resolution: {integrity: sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==}
+    engines: {node: '>=12'}
+
+  d3-scale@4.0.2:
+    resolution: {integrity: sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==}
+    engines: {node: '>=12'}
+
+  d3-shape@3.2.0:
+    resolution: {integrity: sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==}
+    engines: {node: '>=12'}
+
+  d3-time-format@4.1.0:
+    resolution: {integrity: sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==}
+    engines: {node: '>=12'}
+
+  d3-time@3.1.0:
+    resolution: {integrity: sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==}
+    engines: {node: '>=12'}
+
+  d3-timer@3.0.1:
+    resolution: {integrity: sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==}
+    engines: {node: '>=12'}
+
+  date-fns-jalali@4.1.0-0:
+    resolution: {integrity: sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg==}
+
+  date-fns@4.1.0:
+    resolution: {integrity: sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==}
+
+  decimal.js-light@2.5.1:
+    resolution: {integrity: sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==}
+
+  detect-libc@2.0.4:
+    resolution: {integrity: sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==}
+    engines: {node: '>=8'}
+
+  detect-node-es@1.1.0:
+    resolution: {integrity: sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==}
+
+  didyoumean@1.2.2:
+    resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
+
+  dlv@1.1.3:
+    resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
+
+  dom-helpers@5.2.1:
+    resolution: {integrity: sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==}
+
+  eastasianwidth@0.2.0:
+    resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
+
+  electron-to-chromium@1.5.161:
+    resolution: {integrity: sha512-hwtetwfKNZo/UlwHIVBlKZVdy7o8bIZxxKs0Mv/ROPiQQQmDgdm5a+KvKtBsxM8ZjFzTaCeLoodZ8jiBE3o9rA==}
+
+  embla-carousel-react@8.5.1:
+    resolution: {integrity: sha512-z9Y0K84BJvhChXgqn2CFYbfEi6AwEr+FFVVKm/MqbTQ2zIzO1VQri6w67LcfpVF0AjbhwVMywDZqY4alYkjW5w==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.1 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+
+  embla-carousel-reactive-utils@8.5.1:
+    resolution: {integrity: sha512-n7VSoGIiiDIc4MfXF3ZRTO59KDp820QDuyBDGlt5/65+lumPHxX2JLz0EZ23hZ4eg4vZGUXwMkYv02fw2JVo/A==}
+    peerDependencies:
+      embla-carousel: 8.5.1
+
+  embla-carousel@8.5.1:
+    resolution: {integrity: sha512-JUb5+FOHobSiWQ2EJNaueCNT/cQU9L6XWBbWmorWPQT9bkbk+fhsuLr8wWrzXKagO3oWszBO7MSx+GfaRk4E6A==}
+
+  emoji-regex@8.0.0:
+    resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
+
+  emoji-regex@9.2.2:
+    resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
+
+  escalade@3.2.0:
+    resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==}
+    engines: {node: '>=6'}
+
+  eventemitter3@4.0.7:
+    resolution: {integrity: sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==}
+
+  eventemitter3@5.0.1:
+    resolution: {integrity: sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==}
+
+  fast-deep-equal@3.1.3:
+    resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
+
+  fast-equals@5.2.2:
+    resolution: {integrity: sha512-V7/RktU11J3I36Nwq2JnZEM7tNm17eBJz+u25qdxBZeCKiX6BkVSZQjwWIr+IobgnZy+ag73tTZgZi7tr0LrBw==}
+    engines: {node: '>=6.0.0'}
+
+  fast-glob@3.3.3:
+    resolution: {integrity: sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==}
+    engines: {node: '>=8.6.0'}
+
+  fastq@1.19.1:
+    resolution: {integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==}
+
+  fecha@4.2.3:
+    resolution: {integrity: sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw==}
+
+  fill-range@7.1.1:
+    resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
+    engines: {node: '>=8'}
+
+  flru@1.0.2:
+    resolution: {integrity: sha512-kWyh8ADvHBFz6ua5xYOPnUroZTT/bwWfrCeL0Wj1dzG4/YOmOcfJ99W8dOVyyynJN35rZ9aCOtHChqQovV7yog==}
+    engines: {node: '>=6'}
+
+  foreground-child@3.3.1:
+    resolution: {integrity: sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==}
+    engines: {node: '>=14'}
+
+  fraction.js@4.3.7:
+    resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
+
+  fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
+  function-bind@1.1.2:
+    resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
+
+  get-nonce@1.0.1:
+    resolution: {integrity: sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==}
+    engines: {node: '>=6'}
+
+  gl-matrix@3.4.3:
+    resolution: {integrity: sha512-wcCp8vu8FT22BnvKVPjXa/ICBWRq/zjFfdofZy1WSpQZpphblv12/bOQLBC1rMM7SGOFS9ltVmKOHil5+Ml7gA==}
+
+  glob-parent@5.1.2:
+    resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
+    engines: {node: '>= 6'}
+
+  glob-parent@6.0.2:
+    resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
+    engines: {node: '>=10.13.0'}
+
+  glob@10.4.5:
+    resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==}
+    hasBin: true
+
+  goober@2.1.16:
+    resolution: {integrity: sha512-erjk19y1U33+XAMe1VTvIONHYoSqE4iS7BYUZfHaqeohLmnC0FdxEh7rQU+6MZ4OajItzjZFSRtVANrQwNq6/g==}
+    peerDependencies:
+      csstype: ^3.0.10
+
+  hasown@2.0.2:
+    resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
+    engines: {node: '>= 0.4'}
+
+  iconv-lite@0.6.3:
+    resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
+    engines: {node: '>=0.10.0'}
+
+  input-otp@1.4.1:
+    resolution: {integrity: sha512-+yvpmKYKHi9jIGngxagY9oWiiblPB7+nEO75F2l2o4vs+6vpPZZmUl4tBNYuTCvQjhvEIbdNeJu70bhfYP2nbw==}
+    peerDependencies:
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0.0 || ^19.0.0-rc
+
+  internmap@2.0.3:
+    resolution: {integrity: sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==}
+    engines: {node: '>=12'}
+
+  is-arrayish@0.3.2:
+    resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==}
+
+  is-binary-path@2.1.0:
+    resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
+    engines: {node: '>=8'}
+
+  is-core-module@2.16.1:
+    resolution: {integrity: sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==}
+    engines: {node: '>= 0.4'}
+
+  is-extglob@2.1.1:
+    resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
+    engines: {node: '>=0.10.0'}
+
+  is-fullwidth-code-point@3.0.0:
+    resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
+    engines: {node: '>=8'}
+
+  is-glob@4.0.3:
+    resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
+    engines: {node: '>=0.10.0'}
+
+  is-number@7.0.0:
+    resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
+    engines: {node: '>=0.12.0'}
+
+  isexe@2.0.0:
+    resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
+
+  jackspeak@3.4.3:
+    resolution: {integrity: sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==}
+
+  jiti@1.21.7:
+    resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==}
+    hasBin: true
+
+  js-tokens@4.0.0:
+    resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
+
+  lilconfig@3.1.3:
+    resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==}
+    engines: {node: '>=14'}
+
+  lines-and-columns@1.2.4:
+    resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
+
+  lodash@4.17.21:
+    resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
+
+  loose-envify@1.4.0:
+    resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
+    hasBin: true
+
+  lru-cache@10.4.3:
+    resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==}
+
+  lucide-react@0.454.0:
+    resolution: {integrity: sha512-hw7zMDwykCLnEzgncEEjHeA6+45aeEzRYuKHuyRSOPkhko+J3ySGjGIzu+mmMfDFG1vazHepMaYFYHbTFAZAAQ==}
+    peerDependencies:
+      react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc
+
+  merge2@1.4.1:
+    resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
+    engines: {node: '>= 8'}
+
+  micromatch@4.0.8:
+    resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==}
+    engines: {node: '>=8.6'}
+
+  minimatch@9.0.5:
+    resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
+  minipass@7.1.2:
+    resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
+  mz@2.7.0:
+    resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
+
+  nanoid@3.3.11:
+    resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+
+  next-themes@0.4.6:
+    resolution: {integrity: sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA==}
+    peerDependencies:
+      react: ^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc
+
+  next@15.1.0:
+    resolution: {integrity: sha512-QKhzt6Y8rgLNlj30izdMbxAwjHMFANnLwDwZ+WQh5sMhyt4lEBqDK9QpvWHtIM4rINKPoJ8aiRZKg5ULSybVHw==}
+    engines: {node: ^18.18.0 || ^19.8.0 || >= 20.0.0}
+    hasBin: true
+    peerDependencies:
+      '@opentelemetry/api': ^1.1.0
+      '@playwright/test': ^1.41.2
+      babel-plugin-react-compiler: '*'
+      react: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0
+      react-dom: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0
+      sass: ^1.3.0
+    peerDependenciesMeta:
+      '@opentelemetry/api':
+        optional: true
+      '@playwright/test':
+        optional: true
+      babel-plugin-react-compiler:
+        optional: true
+      sass:
+        optional: true
+
+  node-releases@2.0.19:
+    resolution: {integrity: sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==}
+
+  normalize-path@3.0.0:
+    resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
+    engines: {node: '>=0.10.0'}
+
+  normalize-range@0.1.2:
+    resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
+    engines: {node: '>=0.10.0'}
+
+  object-assign@4.1.1:
+    resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
+    engines: {node: '>=0.10.0'}
+
+  object-hash@3.0.0:
+    resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
+    engines: {node: '>= 6'}
+
+  package-json-from-dist@1.0.1:
+    resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==}
+
+  path-key@3.1.1:
+    resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
+    engines: {node: '>=8'}
+
+  path-parse@1.0.7:
+    resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
+
+  path-scurry@1.11.1:
+    resolution: {integrity: sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==}
+    engines: {node: '>=16 || 14 >=14.18'}
+
+  pdfast@0.2.0:
+    resolution: {integrity: sha512-cq6TTu6qKSFUHwEahi68k/kqN2mfepjkGrG9Un70cgdRRKLKY6Rf8P8uvP2NvZktaQZNF3YE7agEkLj0vGK9bA==}
+
+  picocolors@1.1.1:
+    resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
+
+  picomatch@2.3.1:
+    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
+    engines: {node: '>=8.6'}
+
+  pify@2.3.0:
+    resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
+    engines: {node: '>=0.10.0'}
+
+  pirates@4.0.7:
+    resolution: {integrity: sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==}
+    engines: {node: '>= 6'}
+
+  postcss-import@15.1.0:
+    resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      postcss: ^8.0.0
+
+  postcss-js@4.0.1:
+    resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
+    engines: {node: ^12 || ^14 || >= 16}
+    peerDependencies:
+      postcss: ^8.4.21
+
+  postcss-load-config@4.0.2:
+    resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
+    engines: {node: '>= 14'}
+    peerDependencies:
+      postcss: '>=8.0.9'
+      ts-node: '>=9.0.0'
+    peerDependenciesMeta:
+      postcss:
+        optional: true
+      ts-node:
+        optional: true
+
+  postcss-nested@6.2.0:
+    resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
+    engines: {node: '>=12.0'}
+    peerDependencies:
+      postcss: ^8.2.14
+
+  postcss-selector-parser@6.1.2:
+    resolution: {integrity: sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==}
+    engines: {node: '>=4'}
+
+  postcss-value-parser@4.2.0:
+    resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
+
+  postcss@8.4.31:
+    resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==}
+    engines: {node: ^10 || ^12 || >=14}
+
+  postcss@8.5.4:
+    resolution: {integrity: sha512-QSa9EBe+uwlGTFmHsPKokv3B/oEMQZxfqW0QqNCyhpa6mB1afzulwn8hihglqAb2pOw+BJgNlmXQ8la2VeHB7w==}
+    engines: {node: ^10 || ^12 || >=14}
+
+  prop-types@15.8.1:
+    resolution: {integrity: sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==}
+
+  queue-microtask@1.2.3:
+    resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
+
+  quickselect@2.0.0:
+    resolution: {integrity: sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw==}
+
+  rbush@3.0.1:
+    resolution: {integrity: sha512-XRaVO0YecOpEuIvbhbpTrZgoiI6xBlz6hnlr6EHhd+0x9ase6EmeN+hdwwUaJvLcsFFQ8iWVF1GAK1yB0BWi0w==}
+
+  react-day-picker@9.7.0:
+    resolution: {integrity: sha512-urlK4C9XJZVpQ81tmVgd2O7lZ0VQldZeHzNejbwLWZSkzHH498KnArT0EHNfKBOWwKc935iMLGZdxXPRISzUxQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      react: '>=16.8.0'
+
+  react-dom@19.1.0:
+    resolution: {integrity: sha512-Xs1hdnE+DyKgeHJeJznQmYMIBG3TKIHJJT95Q58nHLSrElKlGQqDTR2HQ9fx5CN/Gk6Vh/kupBTDLU11/nDk/g==}
+    peerDependencies:
+      react: ^19.1.0
+
+  react-hook-form@7.56.4:
+    resolution: {integrity: sha512-Rob7Ftz2vyZ/ZGsQZPaRdIefkgOSrQSPXfqBdvOPwJfoGnjwRJUs7EM7Kc1mcoDv3NOtqBzPGbcMB8CGn9CKgw==}
+    engines: {node: '>=18.0.0'}
+    peerDependencies:
+      react: ^16.8.0 || ^17 || ^18 || ^19
+
+  react-hot-toast@2.5.2:
+    resolution: {integrity: sha512-Tun3BbCxzmXXM7C+NI4qiv6lT0uwGh4oAfeJyNOjYUejTsm35mK9iCaYLGv8cBz9L5YxZLx/2ii7zsIwPtPUdw==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      react: '>=16'
+      react-dom: '>=16'
+
+  react-is@16.13.1:
+    resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
+
+  react-is@18.3.1:
+    resolution: {integrity: sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==}
+
+  react-remove-scroll-bar@2.3.8:
+    resolution: {integrity: sha512-9r+yi9+mgU33AKcj6IbT9oRCO78WriSj6t/cF8DWBZJ9aOGPOTEDvdUDz1FwKim7QXWwmHqtdHnRJfhAxEG46Q==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  react-remove-scroll@2.7.0:
+    resolution: {integrity: sha512-sGsQtcjMqdQyijAHytfGEELB8FufGbfXIsvUTe+NLx1GDRJCXtCFLBLUI1eyZCKXXvbEU2C6gai0PZKoIE9Vbg==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  react-resizable-panels@2.1.9:
+    resolution: {integrity: sha512-z77+X08YDIrgAes4jl8xhnUu1LNIRp4+E7cv4xHmLOxxUPO/ML7PSrE813b90vj7xvQ1lcf7g2uA9GeMZonjhQ==}
+    peerDependencies:
+      react: ^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+      react-dom: ^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+
+  react-smooth@4.0.4:
+    resolution: {integrity: sha512-gnGKTpYwqL0Iii09gHobNolvX4Kiq4PKx6eWBCYYix+8cdw+cGo3do906l1NBPKkSWx1DghC1dlWG9L2uGd61Q==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
+  react-style-singleton@2.2.3:
+    resolution: {integrity: sha512-b6jSvxvVnyptAiLjbkWLE/lOnR4lfTtDAl+eUC7RZy+QQWc6wRzIV2CE6xBuMmDxc2qIihtDCZD5NPOFl7fRBQ==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  react-transition-group@4.4.5:
+    resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
+    peerDependencies:
+      react: '>=16.6.0'
+      react-dom: '>=16.6.0'
+
+  react@19.1.0:
+    resolution: {integrity: sha512-FS+XFBNvn3GTAWq26joslQgWNoFu08F4kl0J4CgdNKADkdSGXQyTCnKteIAJy96Br6YbpEU1LSzV5dYtjMkMDg==}
+    engines: {node: '>=0.10.0'}
+
+  read-cache@1.0.0:
+    resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
+
+  readdirp@3.6.0:
+    resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
+    engines: {node: '>=8.10.0'}
+
+  recharts-scale@0.4.5:
+    resolution: {integrity: sha512-kivNFO+0OcUNu7jQquLXAxz1FIwZj8nrj+YkOKc5694NbjCvcT6aSZiIzNzd2Kul4o4rTto8QVR9lMNtxD4G1w==}
+
+  recharts@2.15.3:
+    resolution: {integrity: sha512-EdOPzTwcFSuqtvkDoaM5ws/Km1+WTAO2eizL7rqiG0V2UVhTnz0m7J2i0CjVPUCdEkZImaWvXLbZDS2H5t6GFQ==}
+    engines: {node: '>=14'}
+    peerDependencies:
+      react: ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+      react-dom: ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
+  regenerator-runtime@0.14.1:
+    resolution: {integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==}
+
+  resolve@1.22.10:
+    resolution: {integrity: sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==}
+    engines: {node: '>= 0.4'}
+    hasBin: true
+
+  reusify@1.1.0:
+    resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
+    engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
+
+  run-parallel@1.2.0:
+    resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
+
+  rw@1.3.3:
+    resolution: {integrity: sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==}
+
+  safer-buffer@2.1.2:
+    resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
+
+  scheduler@0.26.0:
+    resolution: {integrity: sha512-NlHwttCI/l5gCPR3D1nNXtWABUmBwvZpEQiD4IXSbIDq8BzLIK/7Ir5gTFSGZDUu37K5cMNp0hFtzO38sC7gWA==}
+
+  semver@7.7.2:
+    resolution: {integrity: sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==}
+    engines: {node: '>=10'}
+    hasBin: true
+
+  sharp@0.33.5:
+    resolution: {integrity: sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==}
+    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
+
+  shebang-command@2.0.0:
+    resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
+    engines: {node: '>=8'}
+
+  shebang-regex@3.0.0:
+    resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
+    engines: {node: '>=8'}
+
+  signal-exit@4.1.0:
+    resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
+    engines: {node: '>=14'}
+
+  simple-swizzle@0.2.2:
+    resolution: {integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==}
+
+  sonner@1.7.4:
+    resolution: {integrity: sha512-DIS8z4PfJRbIyfVFDVnK9rO3eYDtse4Omcm6bt0oEr5/jtLgysmjuBl1frJ9E/EQZrFmKx2A8m/s5s9CRXIzhw==}
+    peerDependencies:
+      react: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+      react-dom: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+
+  source-map-js@1.2.1:
+    resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
+    engines: {node: '>=0.10.0'}
+
+  streamsearch@1.1.0:
+    resolution: {integrity: sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==}
+    engines: {node: '>=10.0.0'}
+
+  string-width@4.2.3:
+    resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
+    engines: {node: '>=8'}
+
+  string-width@5.1.2:
+    resolution: {integrity: sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==}
+    engines: {node: '>=12'}
+
+  strip-ansi@6.0.1:
+    resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
+    engines: {node: '>=8'}
+
+  strip-ansi@7.1.0:
+    resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==}
+    engines: {node: '>=12'}
+
+  styled-jsx@5.1.6:
+    resolution: {integrity: sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==}
+    engines: {node: '>= 12.0.0'}
+    peerDependencies:
+      '@babel/core': '*'
+      babel-plugin-macros: '*'
+      react: '>= 16.8.0 || 17.x.x || ^18.0.0-0 || ^19.0.0-0'
+    peerDependenciesMeta:
+      '@babel/core':
+        optional: true
+      babel-plugin-macros:
+        optional: true
+
+  sucrase@3.35.0:
+    resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
+    engines: {node: '>=16 || 14 >=14.17'}
+    hasBin: true
+
+  supports-preserve-symlinks-flag@1.0.0:
+    resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
+    engines: {node: '>= 0.4'}
+
+  svg-path-parser@1.1.0:
+    resolution: {integrity: sha512-jGCUqcQyXpfe38R7RFfhrMyfXcBmpMNJI/B+4CE9/Unkh98UporAc461GTthv+TVDuZXsBx7/WiwJb1Oh4tt4A==}
+
+  tailwind-merge@2.6.0:
+    resolution: {integrity: sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==}
+
+  tailwindcss-animate@1.0.7:
+    resolution: {integrity: sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==}
+    peerDependencies:
+      tailwindcss: '>=3.0.0 || insiders'
+
+  tailwindcss@3.4.17:
+    resolution: {integrity: sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+
+  thenify-all@1.6.0:
+    resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==}
+    engines: {node: '>=0.8'}
+
+  thenify@3.3.1:
+    resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
+
+  tiny-invariant@1.3.3:
+    resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
+
+  to-regex-range@5.0.1:
+    resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
+    engines: {node: '>=8.0'}
+
+  ts-interface-checker@0.1.13:
+    resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
+
+  tslib@2.8.1:
+    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
+
+  typescript@5.8.3:
+    resolution: {integrity: sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==}
+    engines: {node: '>=14.17'}
+    hasBin: true
+
+  undici-types@6.21.0:
+    resolution: {integrity: sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==}
+
+  update-browserslist-db@1.1.3:
+    resolution: {integrity: sha512-UxhIZQ+QInVdunkDAaiazvvT/+fXL5Osr0JZlJulepYu6Jd7qJtDZjlur0emRlT71EN3ScPoE7gvsuIKKNavKw==}
+    hasBin: true
+    peerDependencies:
+      browserslist: '>= 4.21.0'
+
+  use-callback-ref@1.3.3:
+    resolution: {integrity: sha512-jQL3lRnocaFtu3V00JToYz/4QkNWswxijDaCVNZRiRTO3HQDLsdu1ZtmIUvV4yPp+rvWm5j0y0TG/S61cuijTg==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  use-sidecar@1.1.3:
+    resolution: {integrity: sha512-Fedw0aZvkhynoPYlA5WXrMCAMm+nSWdZt6lzJQ7Ok8S6Q+VsHmHpRWndVRJ8Be0ZbkfPc5LRYH+5XrzXcEeLRQ==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  use-sync-external-store@1.5.0:
+    resolution: {integrity: sha512-Rb46I4cGGVBmjamjphe8L/UnvJD+uPPtTkNvX5mZgqdbavhI4EbgIWJiIHXJ8bc/i9EQGPRh4DwEURJ552Do0A==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
+  util-deprecate@1.0.2:
+    resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
+
+  vaul@0.9.9:
+    resolution: {integrity: sha512-7afKg48srluhZwIkaU+lgGtFCUsYBSGOl8vcc8N/M3YQlZFlynHD15AE+pwrYdc826o7nrIND4lL9Y6b9WWZZQ==}
+    peerDependencies:
+      react: ^16.8 || ^17.0 || ^18.0
+      react-dom: ^16.8 || ^17.0 || ^18.0
+
+  victory-vendor@36.9.2:
+    resolution: {integrity: sha512-PnpQQMuxlwYdocC8fIJqVXvkeViHYzotI+NJrCuav0ZYFoq912ZHBk3mCeuj+5/VpodOjPe1z0Fk2ihgzlXqjQ==}
+
+  which@2.0.2:
+    resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
+    engines: {node: '>= 8'}
+    hasBin: true
+
+  wrap-ansi@7.0.0:
+    resolution: {integrity: sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==}
+    engines: {node: '>=10'}
+
+  wrap-ansi@8.1.0:
+    resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
+    engines: {node: '>=12'}
+
+  yaml@2.8.0:
+    resolution: {integrity: sha512-4lLa/EcQCB0cJkyts+FpIRx5G/llPxfP6VQU5KByHEhLxY3IJCH0f0Hy1MHI8sClTvsIb8qwRJ6R/ZdlDJ/leQ==}
+    engines: {node: '>= 14.6'}
+    hasBin: true
+
+  zod@3.25.36:
+    resolution: {integrity: sha512-eRFS3i8T0IrpGdL8HQyqFAugGOn7jOjyGgGdtv5NY4Wkhi7lJDk732bNZ609YMIGFbLoaj6J69O1Mura23gfIw==}
+
+snapshots:
+
+  '@alloc/quick-lru@5.2.0': {}
+
+  '@ant-design/charts-util@0.0.1(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      lodash: 4.17.21
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  '@ant-design/plots@2.4.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@ant-design/charts-util': 0.0.1(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@antv/event-emitter': 0.1.3
+      '@antv/g': 6.1.25
+      '@antv/g2': 5.3.3
+      '@antv/g2-extension-plot': 0.2.2
+      lodash: 4.17.21
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  '@antv/component@2.1.3':
+    dependencies:
+      '@antv/g': 6.1.25
+      '@antv/scale': 0.4.16
+      '@antv/util': 3.3.10
+      svg-path-parser: 1.1.0
+
+  '@antv/coord@0.4.7':
+    dependencies:
+      '@antv/scale': 0.4.16
+      '@antv/util': 2.0.17
+      gl-matrix: 3.4.3
+
+  '@antv/event-emitter@0.1.3': {}
+
+  '@antv/expr@1.0.2': {}
+
+  '@antv/g-camera-api@2.0.38':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/g-canvas@2.0.43':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/g-plugin-canvas-path-generator': 2.1.19
+      '@antv/g-plugin-canvas-picker': 2.1.22
+      '@antv/g-plugin-canvas-renderer': 2.2.22
+      '@antv/g-plugin-dom-interaction': 2.1.24
+      '@antv/g-plugin-html-renderer': 2.1.24
+      '@antv/g-plugin-image-loader': 2.1.22
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      tslib: 2.8.1
+
+  '@antv/g-dom-mutation-observer-api@2.0.35':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@babel/runtime': 7.27.3
+
+  '@antv/g-lite@2.2.19':
+    dependencies:
+      '@antv/g-math': 3.0.1
+      '@antv/util': 3.3.10
+      '@antv/vendor': 1.0.11
+      '@babel/runtime': 7.27.3
+      eventemitter3: 5.0.1
+      gl-matrix: 3.4.3
+      rbush: 3.0.1
+      tslib: 2.8.1
+
+  '@antv/g-math@3.0.1':
+    dependencies:
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-canvas-path-generator@2.1.19':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/g-math': 3.0.1
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-canvas-picker@2.1.22':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/g-math': 3.0.1
+      '@antv/g-plugin-canvas-path-generator': 2.1.19
+      '@antv/g-plugin-canvas-renderer': 2.2.22
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-canvas-renderer@2.2.22':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/g-math': 3.0.1
+      '@antv/g-plugin-canvas-path-generator': 2.1.19
+      '@antv/g-plugin-image-loader': 2.1.22
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-dom-interaction@2.1.24':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@babel/runtime': 7.27.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-dragndrop@2.0.35':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-html-renderer@2.1.24':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/g-plugin-image-loader@2.1.22':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/g-web-animations-api@2.1.25':
+    dependencies:
+      '@antv/g-lite': 2.2.19
+      '@antv/util': 3.3.10
+      '@babel/runtime': 7.27.3
+      tslib: 2.8.1
+
+  '@antv/g2-extension-plot@0.2.2':
+    dependencies:
+      '@antv/g2': 5.3.3
+      '@antv/util': 3.3.10
+      '@antv/vendor': 1.0.11
+
+  '@antv/g2@5.3.3':
+    dependencies:
+      '@antv/component': 2.1.3
+      '@antv/coord': 0.4.7
+      '@antv/event-emitter': 0.1.3
+      '@antv/expr': 1.0.2
+      '@antv/g': 6.1.25
+      '@antv/g-canvas': 2.0.43
+      '@antv/g-plugin-dragndrop': 2.0.35
+      '@antv/scale': 0.4.16
+      '@antv/util': 3.3.10
+      '@antv/vendor': 1.0.11
+      flru: 1.0.2
+      pdfast: 0.2.0
+
+  '@antv/g@6.1.25':
+    dependencies:
+      '@antv/g-camera-api': 2.0.38
+      '@antv/g-dom-mutation-observer-api': 2.0.35
+      '@antv/g-lite': 2.2.19
+      '@antv/g-web-animations-api': 2.1.25
+      '@babel/runtime': 7.27.3
+
+  '@antv/scale@0.4.16':
+    dependencies:
+      '@antv/util': 3.3.10
+      color-string: 1.9.1
+      fecha: 4.2.3
+
+  '@antv/util@2.0.17':
+    dependencies:
+      csstype: 3.1.3
+      tslib: 2.8.1
+
+  '@antv/util@3.3.10':
+    dependencies:
+      fast-deep-equal: 3.1.3
+      gl-matrix: 3.4.3
+      tslib: 2.8.1
+
+  '@antv/vendor@1.0.11':
+    dependencies:
+      '@types/d3-array': 3.2.1
+      '@types/d3-color': 3.1.3
+      '@types/d3-dispatch': 3.0.6
+      '@types/d3-dsv': 3.0.7
+      '@types/d3-ease': 3.0.2
+      '@types/d3-fetch': 3.0.7
+      '@types/d3-force': 3.0.10
+      '@types/d3-format': 3.0.4
+      '@types/d3-geo': 3.1.0
+      '@types/d3-hierarchy': 3.1.7
+      '@types/d3-interpolate': 3.0.4
+      '@types/d3-path': 3.1.1
+      '@types/d3-quadtree': 3.0.6
+      '@types/d3-random': 3.0.3
+      '@types/d3-scale': 4.0.9
+      '@types/d3-scale-chromatic': 3.1.0
+      '@types/d3-shape': 3.1.7
+      '@types/d3-time': 3.0.4
+      '@types/d3-timer': 3.0.2
+      d3-array: 3.2.4
+      d3-color: 3.1.0
+      d3-dispatch: 3.0.1
+      d3-dsv: 3.0.1
+      d3-ease: 3.0.1
+      d3-fetch: 3.0.1
+      d3-force: 3.0.0
+      d3-force-3d: 3.0.6
+      d3-format: 3.1.0
+      d3-geo: 3.1.1
+      d3-geo-projection: 4.0.0
+      d3-hierarchy: 3.1.2
+      d3-interpolate: 3.0.1
+      d3-path: 3.1.0
+      d3-quadtree: 3.0.1
+      d3-random: 3.0.1
+      d3-regression: 1.3.10
+      d3-scale: 4.0.2
+      d3-scale-chromatic: 3.1.0
+      d3-shape: 3.2.0
+      d3-time: 3.1.0
+      d3-timer: 3.0.1
+
+  '@babel/runtime@7.27.3': {}
+
+  '@date-fns/tz@1.2.0': {}
+
+  '@emnapi/runtime@1.4.3':
+    dependencies:
+      tslib: 2.8.1
+    optional: true
+
+  '@floating-ui/core@1.7.0':
+    dependencies:
+      '@floating-ui/utils': 0.2.9
+
+  '@floating-ui/dom@1.7.0':
+    dependencies:
+      '@floating-ui/core': 1.7.0
+      '@floating-ui/utils': 0.2.9
+
+  '@floating-ui/react-dom@2.1.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@floating-ui/dom': 1.7.0
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  '@floating-ui/utils@0.2.9': {}
+
+  '@hookform/resolvers@3.10.0(react-hook-form@7.56.4(react@19.1.0))':
+    dependencies:
+      react-hook-form: 7.56.4(react@19.1.0)
+
+  '@img/sharp-darwin-arm64@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-darwin-arm64': 1.0.4
+    optional: true
+
+  '@img/sharp-darwin-x64@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-darwin-x64': 1.0.4
+    optional: true
+
+  '@img/sharp-libvips-darwin-arm64@1.0.4':
+    optional: true
+
+  '@img/sharp-libvips-darwin-x64@1.0.4':
+    optional: true
+
+  '@img/sharp-libvips-linux-arm64@1.0.4':
+    optional: true
+
+  '@img/sharp-libvips-linux-arm@1.0.5':
+    optional: true
+
+  '@img/sharp-libvips-linux-s390x@1.0.4':
+    optional: true
+
+  '@img/sharp-libvips-linux-x64@1.0.4':
+    optional: true
+
+  '@img/sharp-libvips-linuxmusl-arm64@1.0.4':
+    optional: true
+
+  '@img/sharp-libvips-linuxmusl-x64@1.0.4':
+    optional: true
+
+  '@img/sharp-linux-arm64@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-linux-arm64': 1.0.4
+    optional: true
+
+  '@img/sharp-linux-arm@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-linux-arm': 1.0.5
+    optional: true
+
+  '@img/sharp-linux-s390x@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-linux-s390x': 1.0.4
+    optional: true
+
+  '@img/sharp-linux-x64@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-linux-x64': 1.0.4
+    optional: true
+
+  '@img/sharp-linuxmusl-arm64@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-linuxmusl-arm64': 1.0.4
+    optional: true
+
+  '@img/sharp-linuxmusl-x64@0.33.5':
+    optionalDependencies:
+      '@img/sharp-libvips-linuxmusl-x64': 1.0.4
+    optional: true
+
+  '@img/sharp-wasm32@0.33.5':
+    dependencies:
+      '@emnapi/runtime': 1.4.3
+    optional: true
+
+  '@img/sharp-win32-ia32@0.33.5':
+    optional: true
+
+  '@img/sharp-win32-x64@0.33.5':
+    optional: true
+
+  '@isaacs/cliui@8.0.2':
+    dependencies:
+      string-width: 5.1.2
+      string-width-cjs: string-width@4.2.3
+      strip-ansi: 7.1.0
+      strip-ansi-cjs: strip-ansi@6.0.1
+      wrap-ansi: 8.1.0
+      wrap-ansi-cjs: wrap-ansi@7.0.0
+
+  '@jridgewell/gen-mapping@0.3.8':
+    dependencies:
+      '@jridgewell/set-array': 1.2.1
+      '@jridgewell/sourcemap-codec': 1.5.0
+      '@jridgewell/trace-mapping': 0.3.25
+
+  '@jridgewell/resolve-uri@3.1.2': {}
+
+  '@jridgewell/set-array@1.2.1': {}
+
+  '@jridgewell/sourcemap-codec@1.5.0': {}
+
+  '@jridgewell/trace-mapping@0.3.25':
+    dependencies:
+      '@jridgewell/resolve-uri': 3.1.2
+      '@jridgewell/sourcemap-codec': 1.5.0
+
+  '@kurkle/color@0.3.4': {}
+
+  '@next/env@15.1.0': {}
+
+  '@next/swc-darwin-arm64@15.1.0':
+    optional: true
+
+  '@next/swc-darwin-x64@15.1.0':
+    optional: true
+
+  '@next/swc-linux-arm64-gnu@15.1.0':
+    optional: true
+
+  '@next/swc-linux-arm64-musl@15.1.0':
+    optional: true
+
+  '@next/swc-linux-x64-gnu@15.1.0':
+    optional: true
+
+  '@next/swc-linux-x64-musl@15.1.0':
+    optional: true
+
+  '@next/swc-win32-arm64-msvc@15.1.0':
+    optional: true
+
+  '@next/swc-win32-x64-msvc@15.1.0':
+    optional: true
+
+  '@nodelib/fs.scandir@2.1.5':
+    dependencies:
+      '@nodelib/fs.stat': 2.0.5
+      run-parallel: 1.2.0
+
+  '@nodelib/fs.stat@2.0.5': {}
+
+  '@nodelib/fs.walk@1.2.8':
+    dependencies:
+      '@nodelib/fs.scandir': 2.1.5
+      fastq: 1.19.1
+
+  '@pkgjs/parseargs@0.11.0':
+    optional: true
+
+  '@radix-ui/number@1.1.1': {}
+
+  '@radix-ui/primitive@1.1.2': {}
+
+  '@radix-ui/react-accordion@1.2.11(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collapsible': 1.1.11(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-alert-dialog@1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dialog': 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-arrow@1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-aspect-ratio@1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-avatar@1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-is-hydrated': 0.1.0(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-checkbox@1.3.2(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-previous': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-size': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-collapsible@1.1.11(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-collection@1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-compose-refs@1.1.2(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-context-menu@2.2.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-menu': 2.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-context@1.1.2(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-dialog@1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-focus-guards': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-focus-scope': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      aria-hidden: 1.2.6
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      react-remove-scroll: 2.7.0(@types/react@19.1.6)(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-direction@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-dismissable-layer@1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-escape-keydown': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-dropdown-menu@2.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-menu': 2.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-focus-guards@1.1.2(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-focus-scope@1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-hover-card@1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-popper': 1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-icons@1.3.2(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+
+  '@radix-ui/react-id@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-label@2.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-menu@2.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-focus-guards': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-focus-scope': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-popper': 1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-roving-focus': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      aria-hidden: 1.2.6
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      react-remove-scroll: 2.7.0(@types/react@19.1.6)(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-menubar@1.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-menu': 2.1.15(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-roving-focus': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-navigation-menu@1.2.13(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-previous': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-visually-hidden': 1.2.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-popover@1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-focus-guards': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-focus-scope': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-popper': 1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      aria-hidden: 1.2.6
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      react-remove-scroll: 2.7.0(@types/react@19.1.6)(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-popper@1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@floating-ui/react-dom': 2.1.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-arrow': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-rect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-size': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/rect': 1.1.1
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-portal@1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-presence@1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-primitive@2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-progress@1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-radio-group@1.3.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-roving-focus': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-previous': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-size': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-roving-focus@1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-scroll-area@1.2.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/number': 1.1.1
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-select@2.2.5(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/number': 1.1.1
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-focus-guards': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-focus-scope': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-popper': 1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-previous': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-visually-hidden': 1.2.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      aria-hidden: 1.2.6
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      react-remove-scroll: 2.7.0(@types/react@19.1.6)(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-separator@1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-slider@1.3.5(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/number': 1.1.1
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-previous': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-size': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-slot@1.2.3(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-switch@1.2.5(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-previous': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-size': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-tabs@1.1.12(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-roving-focus': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-toast@1.2.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-collection': 1.1.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-visually-hidden': 1.2.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-toggle-group@1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-direction': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-roving-focus': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-toggle': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-toggle@1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-tooltip@1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.2
+      '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-context': 1.1.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-dismissable-layer': 1.1.10(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-popper': 1.2.7(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-portal': 1.1.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-slot': 1.2.3(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-visually-hidden': 1.2.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/react-use-callback-ref@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-controllable-state@1.2.2(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-use-effect-event': 0.0.2(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-effect-event@0.0.2(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-escape-keydown@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-is-hydrated@0.1.0(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+      use-sync-external-store: 1.5.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-layout-effect@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-previous@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-rect@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/rect': 1.1.1
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-use-size@1.1.1(@types/react@19.1.6)(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      react: 19.1.0
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  '@radix-ui/react-visually-hidden@1.2.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+      '@types/react-dom': 19.1.5(@types/react@19.1.6)
+
+  '@radix-ui/rect@1.1.1': {}
+
+  '@swc/counter@0.1.3': {}
+
+  '@swc/helpers@0.5.15':
+    dependencies:
+      tslib: 2.8.1
+
+  '@tanstack/react-table@8.21.3(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@tanstack/table-core': 8.21.3
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  '@tanstack/table-core@8.21.3': {}
+
+  '@types/d3-array@3.2.1': {}
+
+  '@types/d3-color@3.1.3': {}
+
+  '@types/d3-dispatch@3.0.6': {}
+
+  '@types/d3-dsv@3.0.7': {}
+
+  '@types/d3-ease@3.0.2': {}
+
+  '@types/d3-fetch@3.0.7':
+    dependencies:
+      '@types/d3-dsv': 3.0.7
+
+  '@types/d3-force@3.0.10': {}
+
+  '@types/d3-format@3.0.4': {}
+
+  '@types/d3-geo@3.1.0':
+    dependencies:
+      '@types/geojson': 7946.0.16
+
+  '@types/d3-hierarchy@3.1.7': {}
+
+  '@types/d3-interpolate@3.0.4':
+    dependencies:
+      '@types/d3-color': 3.1.3
+
+  '@types/d3-path@3.1.1': {}
+
+  '@types/d3-quadtree@3.0.6': {}
+
+  '@types/d3-random@3.0.3': {}
+
+  '@types/d3-scale-chromatic@3.1.0': {}
+
+  '@types/d3-scale@4.0.9':
+    dependencies:
+      '@types/d3-time': 3.0.4
+
+  '@types/d3-shape@3.1.7':
+    dependencies:
+      '@types/d3-path': 3.1.1
+
+  '@types/d3-time@3.0.4': {}
+
+  '@types/d3-timer@3.0.2': {}
+
+  '@types/geojson@7946.0.16': {}
+
+  '@types/node@22.15.24':
+    dependencies:
+      undici-types: 6.21.0
+
+  '@types/react-dom@19.1.5(@types/react@19.1.6)':
+    dependencies:
+      '@types/react': 19.1.6
+
+  '@types/react@19.1.6':
+    dependencies:
+      csstype: 3.1.3
+
+  ansi-regex@5.0.1: {}
+
+  ansi-regex@6.1.0: {}
+
+  ansi-styles@4.3.0:
+    dependencies:
+      color-convert: 2.0.1
+
+  ansi-styles@6.2.1: {}
+
+  any-promise@1.3.0: {}
+
+  anymatch@3.1.3:
+    dependencies:
+      normalize-path: 3.0.0
+      picomatch: 2.3.1
+
+  arg@5.0.2: {}
+
+  aria-hidden@1.2.6:
+    dependencies:
+      tslib: 2.8.1
+
+  autoprefixer@10.4.21(postcss@8.5.4):
+    dependencies:
+      browserslist: 4.25.0
+      caniuse-lite: 1.0.30001720
+      fraction.js: 4.3.7
+      normalize-range: 0.1.2
+      picocolors: 1.1.1
+      postcss: 8.5.4
+      postcss-value-parser: 4.2.0
+
+  balanced-match@1.0.2: {}
+
+  binary-extensions@2.3.0: {}
+
+  brace-expansion@2.0.1:
+    dependencies:
+      balanced-match: 1.0.2
+
+  braces@3.0.3:
+    dependencies:
+      fill-range: 7.1.1
+
+  browserslist@4.25.0:
+    dependencies:
+      caniuse-lite: 1.0.30001720
+      electron-to-chromium: 1.5.161
+      node-releases: 2.0.19
+      update-browserslist-db: 1.1.3(browserslist@4.25.0)
+
+  busboy@1.6.0:
+    dependencies:
+      streamsearch: 1.1.0
+
+  camelcase-css@2.0.1: {}
+
+  caniuse-lite@1.0.30001720: {}
+
+  chart.js@4.4.9:
+    dependencies:
+      '@kurkle/color': 0.3.4
+
+  chokidar@3.6.0:
+    dependencies:
+      anymatch: 3.1.3
+      braces: 3.0.3
+      glob-parent: 5.1.2
+      is-binary-path: 2.1.0
+      is-glob: 4.0.3
+      normalize-path: 3.0.0
+      readdirp: 3.6.0
+    optionalDependencies:
+      fsevents: 2.3.3
+
+  class-variance-authority@0.7.1:
+    dependencies:
+      clsx: 2.1.1
+
+  client-only@0.0.1: {}
+
+  clsx@2.1.1: {}
+
+  cmdk@1.0.4(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      '@radix-ui/react-dialog': 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      '@radix-ui/react-id': 1.1.1(@types/react@19.1.6)(react@19.1.0)
+      '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      use-sync-external-store: 1.5.0(react@19.1.0)
+    transitivePeerDependencies:
+      - '@types/react'
+      - '@types/react-dom'
+
+  color-convert@2.0.1:
+    dependencies:
+      color-name: 1.1.4
+
+  color-name@1.1.4: {}
+
+  color-string@1.9.1:
+    dependencies:
+      color-name: 1.1.4
+      simple-swizzle: 0.2.2
+
+  color@4.2.3:
+    dependencies:
+      color-convert: 2.0.1
+      color-string: 1.9.1
+    optional: true
+
+  commander@4.1.1: {}
+
+  commander@7.2.0: {}
+
+  cross-spawn@7.0.6:
+    dependencies:
+      path-key: 3.1.1
+      shebang-command: 2.0.0
+      which: 2.0.2
+
+  cssesc@3.0.0: {}
+
+  csstype@3.1.3: {}
+
+  d3-array@3.2.4:
+    dependencies:
+      internmap: 2.0.3
+
+  d3-binarytree@1.0.2: {}
+
+  d3-color@3.1.0: {}
+
+  d3-dispatch@3.0.1: {}
+
+  d3-dsv@3.0.1:
+    dependencies:
+      commander: 7.2.0
+      iconv-lite: 0.6.3
+      rw: 1.3.3
+
+  d3-ease@3.0.1: {}
+
+  d3-fetch@3.0.1:
+    dependencies:
+      d3-dsv: 3.0.1
+
+  d3-force-3d@3.0.6:
+    dependencies:
+      d3-binarytree: 1.0.2
+      d3-dispatch: 3.0.1
+      d3-octree: 1.1.0
+      d3-quadtree: 3.0.1
+      d3-timer: 3.0.1
+
+  d3-force@3.0.0:
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-quadtree: 3.0.1
+      d3-timer: 3.0.1
+
+  d3-format@3.1.0: {}
+
+  d3-geo-projection@4.0.0:
+    dependencies:
+      commander: 7.2.0
+      d3-array: 3.2.4
+      d3-geo: 3.1.1
+
+  d3-geo@3.1.1:
+    dependencies:
+      d3-array: 3.2.4
+
+  d3-hierarchy@3.1.2: {}
+
+  d3-interpolate@3.0.1:
+    dependencies:
+      d3-color: 3.1.0
+
+  d3-octree@1.1.0: {}
+
+  d3-path@3.1.0: {}
+
+  d3-quadtree@3.0.1: {}
+
+  d3-random@3.0.1: {}
+
+  d3-regression@1.3.10: {}
+
+  d3-scale-chromatic@3.1.0:
+    dependencies:
+      d3-color: 3.1.0
+      d3-interpolate: 3.0.1
+
+  d3-scale@4.0.2:
+    dependencies:
+      d3-array: 3.2.4
+      d3-format: 3.1.0
+      d3-interpolate: 3.0.1
+      d3-time: 3.1.0
+      d3-time-format: 4.1.0
+
+  d3-shape@3.2.0:
+    dependencies:
+      d3-path: 3.1.0
+
+  d3-time-format@4.1.0:
+    dependencies:
+      d3-time: 3.1.0
+
+  d3-time@3.1.0:
+    dependencies:
+      d3-array: 3.2.4
+
+  d3-timer@3.0.1: {}
+
+  date-fns-jalali@4.1.0-0: {}
+
+  date-fns@4.1.0: {}
+
+  decimal.js-light@2.5.1: {}
+
+  detect-libc@2.0.4:
+    optional: true
+
+  detect-node-es@1.1.0: {}
+
+  didyoumean@1.2.2: {}
+
+  dlv@1.1.3: {}
+
+  dom-helpers@5.2.1:
+    dependencies:
+      '@babel/runtime': 7.27.3
+      csstype: 3.1.3
+
+  eastasianwidth@0.2.0: {}
+
+  electron-to-chromium@1.5.161: {}
+
+  embla-carousel-react@8.5.1(react@19.1.0):
+    dependencies:
+      embla-carousel: 8.5.1
+      embla-carousel-reactive-utils: 8.5.1(embla-carousel@8.5.1)
+      react: 19.1.0
+
+  embla-carousel-reactive-utils@8.5.1(embla-carousel@8.5.1):
+    dependencies:
+      embla-carousel: 8.5.1
+
+  embla-carousel@8.5.1: {}
+
+  emoji-regex@8.0.0: {}
+
+  emoji-regex@9.2.2: {}
+
+  escalade@3.2.0: {}
+
+  eventemitter3@4.0.7: {}
+
+  eventemitter3@5.0.1: {}
+
+  fast-deep-equal@3.1.3: {}
+
+  fast-equals@5.2.2: {}
+
+  fast-glob@3.3.3:
+    dependencies:
+      '@nodelib/fs.stat': 2.0.5
+      '@nodelib/fs.walk': 1.2.8
+      glob-parent: 5.1.2
+      merge2: 1.4.1
+      micromatch: 4.0.8
+
+  fastq@1.19.1:
+    dependencies:
+      reusify: 1.1.0
+
+  fecha@4.2.3: {}
+
+  fill-range@7.1.1:
+    dependencies:
+      to-regex-range: 5.0.1
+
+  flru@1.0.2: {}
+
+  foreground-child@3.3.1:
+    dependencies:
+      cross-spawn: 7.0.6
+      signal-exit: 4.1.0
+
+  fraction.js@4.3.7: {}
+
+  fsevents@2.3.3:
+    optional: true
+
+  function-bind@1.1.2: {}
+
+  get-nonce@1.0.1: {}
+
+  gl-matrix@3.4.3: {}
+
+  glob-parent@5.1.2:
+    dependencies:
+      is-glob: 4.0.3
+
+  glob-parent@6.0.2:
+    dependencies:
+      is-glob: 4.0.3
+
+  glob@10.4.5:
+    dependencies:
+      foreground-child: 3.3.1
+      jackspeak: 3.4.3
+      minimatch: 9.0.5
+      minipass: 7.1.2
+      package-json-from-dist: 1.0.1
+      path-scurry: 1.11.1
+
+  goober@2.1.16(csstype@3.1.3):
+    dependencies:
+      csstype: 3.1.3
+
+  hasown@2.0.2:
+    dependencies:
+      function-bind: 1.1.2
+
+  iconv-lite@0.6.3:
+    dependencies:
+      safer-buffer: 2.1.2
+
+  input-otp@1.4.1(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  internmap@2.0.3: {}
+
+  is-arrayish@0.3.2: {}
+
+  is-binary-path@2.1.0:
+    dependencies:
+      binary-extensions: 2.3.0
+
+  is-core-module@2.16.1:
+    dependencies:
+      hasown: 2.0.2
+
+  is-extglob@2.1.1: {}
+
+  is-fullwidth-code-point@3.0.0: {}
+
+  is-glob@4.0.3:
+    dependencies:
+      is-extglob: 2.1.1
+
+  is-number@7.0.0: {}
+
+  isexe@2.0.0: {}
+
+  jackspeak@3.4.3:
+    dependencies:
+      '@isaacs/cliui': 8.0.2
+    optionalDependencies:
+      '@pkgjs/parseargs': 0.11.0
+
+  jiti@1.21.7: {}
+
+  js-tokens@4.0.0: {}
+
+  lilconfig@3.1.3: {}
+
+  lines-and-columns@1.2.4: {}
+
+  lodash@4.17.21: {}
+
+  loose-envify@1.4.0:
+    dependencies:
+      js-tokens: 4.0.0
+
+  lru-cache@10.4.3: {}
+
+  lucide-react@0.454.0(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+
+  merge2@1.4.1: {}
+
+  micromatch@4.0.8:
+    dependencies:
+      braces: 3.0.3
+      picomatch: 2.3.1
+
+  minimatch@9.0.5:
+    dependencies:
+      brace-expansion: 2.0.1
+
+  minipass@7.1.2: {}
+
+  mz@2.7.0:
+    dependencies:
+      any-promise: 1.3.0
+      object-assign: 4.1.1
+      thenify-all: 1.6.0
+
+  nanoid@3.3.11: {}
+
+  next-themes@0.4.6(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  next@15.1.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      '@next/env': 15.1.0
+      '@swc/counter': 0.1.3
+      '@swc/helpers': 0.5.15
+      busboy: 1.6.0
+      caniuse-lite: 1.0.30001720
+      postcss: 8.4.31
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      styled-jsx: 5.1.6(react@19.1.0)
+    optionalDependencies:
+      '@next/swc-darwin-arm64': 15.1.0
+      '@next/swc-darwin-x64': 15.1.0
+      '@next/swc-linux-arm64-gnu': 15.1.0
+      '@next/swc-linux-arm64-musl': 15.1.0
+      '@next/swc-linux-x64-gnu': 15.1.0
+      '@next/swc-linux-x64-musl': 15.1.0
+      '@next/swc-win32-arm64-msvc': 15.1.0
+      '@next/swc-win32-x64-msvc': 15.1.0
+      sharp: 0.33.5
+    transitivePeerDependencies:
+      - '@babel/core'
+      - babel-plugin-macros
+
+  node-releases@2.0.19: {}
+
+  normalize-path@3.0.0: {}
+
+  normalize-range@0.1.2: {}
+
+  object-assign@4.1.1: {}
+
+  object-hash@3.0.0: {}
+
+  package-json-from-dist@1.0.1: {}
+
+  path-key@3.1.1: {}
+
+  path-parse@1.0.7: {}
+
+  path-scurry@1.11.1:
+    dependencies:
+      lru-cache: 10.4.3
+      minipass: 7.1.2
+
+  pdfast@0.2.0: {}
+
+  picocolors@1.1.1: {}
+
+  picomatch@2.3.1: {}
+
+  pify@2.3.0: {}
+
+  pirates@4.0.7: {}
+
+  postcss-import@15.1.0(postcss@8.5.4):
+    dependencies:
+      postcss: 8.5.4
+      postcss-value-parser: 4.2.0
+      read-cache: 1.0.0
+      resolve: 1.22.10
+
+  postcss-js@4.0.1(postcss@8.5.4):
+    dependencies:
+      camelcase-css: 2.0.1
+      postcss: 8.5.4
+
+  postcss-load-config@4.0.2(postcss@8.5.4):
+    dependencies:
+      lilconfig: 3.1.3
+      yaml: 2.8.0
+    optionalDependencies:
+      postcss: 8.5.4
+
+  postcss-nested@6.2.0(postcss@8.5.4):
+    dependencies:
+      postcss: 8.5.4
+      postcss-selector-parser: 6.1.2
+
+  postcss-selector-parser@6.1.2:
+    dependencies:
+      cssesc: 3.0.0
+      util-deprecate: 1.0.2
+
+  postcss-value-parser@4.2.0: {}
+
+  postcss@8.4.31:
+    dependencies:
+      nanoid: 3.3.11
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
+  postcss@8.5.4:
+    dependencies:
+      nanoid: 3.3.11
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
+  prop-types@15.8.1:
+    dependencies:
+      loose-envify: 1.4.0
+      object-assign: 4.1.1
+      react-is: 16.13.1
+
+  queue-microtask@1.2.3: {}
+
+  quickselect@2.0.0: {}
+
+  rbush@3.0.1:
+    dependencies:
+      quickselect: 2.0.0
+
+  react-day-picker@9.7.0(react@19.1.0):
+    dependencies:
+      '@date-fns/tz': 1.2.0
+      date-fns: 4.1.0
+      date-fns-jalali: 4.1.0-0
+      react: 19.1.0
+
+  react-dom@19.1.0(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      scheduler: 0.26.0
+
+  react-hook-form@7.56.4(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+
+  react-hot-toast@2.5.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      csstype: 3.1.3
+      goober: 2.1.16(csstype@3.1.3)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  react-is@16.13.1: {}
+
+  react-is@18.3.1: {}
+
+  react-remove-scroll-bar@2.3.8(@types/react@19.1.6)(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      react-style-singleton: 2.2.3(@types/react@19.1.6)(react@19.1.0)
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  react-remove-scroll@2.7.0(@types/react@19.1.6)(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      react-remove-scroll-bar: 2.3.8(@types/react@19.1.6)(react@19.1.0)
+      react-style-singleton: 2.2.3(@types/react@19.1.6)(react@19.1.0)
+      tslib: 2.8.1
+      use-callback-ref: 1.3.3(@types/react@19.1.6)(react@19.1.0)
+      use-sidecar: 1.1.3(@types/react@19.1.6)(react@19.1.0)
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  react-resizable-panels@2.1.9(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  react-smooth@4.0.4(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      fast-equals: 5.2.2
+      prop-types: 15.8.1
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      react-transition-group: 4.4.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+
+  react-style-singleton@2.2.3(@types/react@19.1.6)(react@19.1.0):
+    dependencies:
+      get-nonce: 1.0.1
+      react: 19.1.0
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  react-transition-group@4.4.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      '@babel/runtime': 7.27.3
+      dom-helpers: 5.2.1
+      loose-envify: 1.4.0
+      prop-types: 15.8.1
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  react@19.1.0: {}
+
+  read-cache@1.0.0:
+    dependencies:
+      pify: 2.3.0
+
+  readdirp@3.6.0:
+    dependencies:
+      picomatch: 2.3.1
+
+  recharts-scale@0.4.5:
+    dependencies:
+      decimal.js-light: 2.5.1
+
+  recharts@2.15.3(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      clsx: 2.1.1
+      eventemitter3: 4.0.7
+      lodash: 4.17.21
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      react-is: 18.3.1
+      react-smooth: 4.0.4(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      recharts-scale: 0.4.5
+      tiny-invariant: 1.3.3
+      victory-vendor: 36.9.2
+
+  regenerator-runtime@0.14.1: {}
+
+  resolve@1.22.10:
+    dependencies:
+      is-core-module: 2.16.1
+      path-parse: 1.0.7
+      supports-preserve-symlinks-flag: 1.0.0
+
+  reusify@1.1.0: {}
+
+  run-parallel@1.2.0:
+    dependencies:
+      queue-microtask: 1.2.3
+
+  rw@1.3.3: {}
+
+  safer-buffer@2.1.2: {}
+
+  scheduler@0.26.0: {}
+
+  semver@7.7.2:
+    optional: true
+
+  sharp@0.33.5:
+    dependencies:
+      color: 4.2.3
+      detect-libc: 2.0.4
+      semver: 7.7.2
+    optionalDependencies:
+      '@img/sharp-darwin-arm64': 0.33.5
+      '@img/sharp-darwin-x64': 0.33.5
+      '@img/sharp-libvips-darwin-arm64': 1.0.4
+      '@img/sharp-libvips-darwin-x64': 1.0.4
+      '@img/sharp-libvips-linux-arm': 1.0.5
+      '@img/sharp-libvips-linux-arm64': 1.0.4
+      '@img/sharp-libvips-linux-s390x': 1.0.4
+      '@img/sharp-libvips-linux-x64': 1.0.4
+      '@img/sharp-libvips-linuxmusl-arm64': 1.0.4
+      '@img/sharp-libvips-linuxmusl-x64': 1.0.4
+      '@img/sharp-linux-arm': 0.33.5
+      '@img/sharp-linux-arm64': 0.33.5
+      '@img/sharp-linux-s390x': 0.33.5
+      '@img/sharp-linux-x64': 0.33.5
+      '@img/sharp-linuxmusl-arm64': 0.33.5
+      '@img/sharp-linuxmusl-x64': 0.33.5
+      '@img/sharp-wasm32': 0.33.5
+      '@img/sharp-win32-ia32': 0.33.5
+      '@img/sharp-win32-x64': 0.33.5
+    optional: true
+
+  shebang-command@2.0.0:
+    dependencies:
+      shebang-regex: 3.0.0
+
+  shebang-regex@3.0.0: {}
+
+  signal-exit@4.1.0: {}
+
+  simple-swizzle@0.2.2:
+    dependencies:
+      is-arrayish: 0.3.2
+
+  sonner@1.7.4(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
+  source-map-js@1.2.1: {}
+
+  streamsearch@1.1.0: {}
+
+  string-width@4.2.3:
+    dependencies:
+      emoji-regex: 8.0.0
+      is-fullwidth-code-point: 3.0.0
+      strip-ansi: 6.0.1
+
+  string-width@5.1.2:
+    dependencies:
+      eastasianwidth: 0.2.0
+      emoji-regex: 9.2.2
+      strip-ansi: 7.1.0
+
+  strip-ansi@6.0.1:
+    dependencies:
+      ansi-regex: 5.0.1
+
+  strip-ansi@7.1.0:
+    dependencies:
+      ansi-regex: 6.1.0
+
+  styled-jsx@5.1.6(react@19.1.0):
+    dependencies:
+      client-only: 0.0.1
+      react: 19.1.0
+
+  sucrase@3.35.0:
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.8
+      commander: 4.1.1
+      glob: 10.4.5
+      lines-and-columns: 1.2.4
+      mz: 2.7.0
+      pirates: 4.0.7
+      ts-interface-checker: 0.1.13
+
+  supports-preserve-symlinks-flag@1.0.0: {}
+
+  svg-path-parser@1.1.0: {}
+
+  tailwind-merge@2.6.0: {}
+
+  tailwindcss-animate@1.0.7(tailwindcss@3.4.17):
+    dependencies:
+      tailwindcss: 3.4.17
+
+  tailwindcss@3.4.17:
+    dependencies:
+      '@alloc/quick-lru': 5.2.0
+      arg: 5.0.2
+      chokidar: 3.6.0
+      didyoumean: 1.2.2
+      dlv: 1.1.3
+      fast-glob: 3.3.3
+      glob-parent: 6.0.2
+      is-glob: 4.0.3
+      jiti: 1.21.7
+      lilconfig: 3.1.3
+      micromatch: 4.0.8
+      normalize-path: 3.0.0
+      object-hash: 3.0.0
+      picocolors: 1.1.1
+      postcss: 8.5.4
+      postcss-import: 15.1.0(postcss@8.5.4)
+      postcss-js: 4.0.1(postcss@8.5.4)
+      postcss-load-config: 4.0.2(postcss@8.5.4)
+      postcss-nested: 6.2.0(postcss@8.5.4)
+      postcss-selector-parser: 6.1.2
+      resolve: 1.22.10
+      sucrase: 3.35.0
+    transitivePeerDependencies:
+      - ts-node
+
+  thenify-all@1.6.0:
+    dependencies:
+      thenify: 3.3.1
+
+  thenify@3.3.1:
+    dependencies:
+      any-promise: 1.3.0
+
+  tiny-invariant@1.3.3: {}
+
+  to-regex-range@5.0.1:
+    dependencies:
+      is-number: 7.0.0
+
+  ts-interface-checker@0.1.13: {}
+
+  tslib@2.8.1: {}
+
+  typescript@5.8.3: {}
+
+  undici-types@6.21.0: {}
+
+  update-browserslist-db@1.1.3(browserslist@4.25.0):
+    dependencies:
+      browserslist: 4.25.0
+      escalade: 3.2.0
+      picocolors: 1.1.1
+
+  use-callback-ref@1.3.3(@types/react@19.1.6)(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  use-sidecar@1.1.3(@types/react@19.1.6)(react@19.1.0):
+    dependencies:
+      detect-node-es: 1.1.0
+      react: 19.1.0
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.1.6
+
+  use-sync-external-store@1.5.0(react@19.1.0):
+    dependencies:
+      react: 19.1.0
+
+  util-deprecate@1.0.2: {}
+
+  vaul@0.9.9(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      '@radix-ui/react-dialog': 1.1.14(@types/react-dom@19.1.5(@types/react@19.1.6))(@types/react@19.1.6)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+    transitivePeerDependencies:
+      - '@types/react'
+      - '@types/react-dom'
+
+  victory-vendor@36.9.2:
+    dependencies:
+      '@types/d3-array': 3.2.1
+      '@types/d3-ease': 3.0.2
+      '@types/d3-interpolate': 3.0.4
+      '@types/d3-scale': 4.0.9
+      '@types/d3-shape': 3.1.7
+      '@types/d3-time': 3.0.4
+      '@types/d3-timer': 3.0.2
+      d3-array: 3.2.4
+      d3-ease: 3.0.1
+      d3-interpolate: 3.0.1
+      d3-scale: 4.0.2
+      d3-shape: 3.2.0
+      d3-time: 3.1.0
+      d3-timer: 3.0.1
+
+  which@2.0.2:
+    dependencies:
+      isexe: 2.0.0
+
+  wrap-ansi@7.0.0:
+    dependencies:
+      ansi-styles: 4.3.0
+      string-width: 4.2.3
+      strip-ansi: 6.0.1
+
+  wrap-ansi@8.1.0:
+    dependencies:
+      ansi-styles: 6.2.1
+      string-width: 5.1.2
+      strip-ansi: 7.1.0
+
+  yaml@2.8.0: {}
+
+  zod@3.25.36: {}