Merge branch 'develop' of https://e.coding.net/g-xtcy5189/cunkebao/cunkebao_v3 into develop

2025-09-11 15:16:50 +08:00
parent bea5f44565 18fbf79fa8
commit db9e4eb004
21 changed files with 899 additions and 719 deletions
--- a/Cunkebao/src/pages/mobile/scenarios/plan/list/components/DeviceListModal.tsx
+++ b/Cunkebao/src/pages/mobile/scenarios/plan/list/components/DeviceListModal.tsx
@@ -38,7 +38,7 @@ const DeviceListModal: React.FC<DeviceListModalProps> = ({
    setLoading(true);
    try {
      const detailRes = await getPlanDetail(ruleId.toString());
-      const deviceData = detailRes?.deveiceGroupsOptions || [];
+      const deviceData = detailRes?.deviceGroupsOptions || [];
      setDevices(deviceData);
    } catch (error) {
      console.error("获取设备详情失败:", error);
--- a/Cunkebao/src/pages/mobile/scenarios/plan/new/index.data.ts
+++ b/Cunkebao/src/pages/mobile/scenarios/plan/new/index.data.ts
@@ -25,8 +25,8 @@ export interface FormData {
  device: string[];
  customTags: string[];
  customTagsOptions: string[];
-  deveiceGroups: string[];
-  deveiceGroupsOptions: DeviceSelectionItem[];
+  deviceGroups: string[];
+  deviceGroupsOptions: DeviceSelectionItem[];
  wechatGroups: string[];
  wechatGroupsOptions: GroupSelectionItem[];
  messagePlans: any[];
@@ -50,8 +50,8 @@ export const defFormData: FormData = {
  customTags: [],
  customTagsOptions: [],
  messagePlans: [],
-  deveiceGroups: [],
-  deveiceGroupsOptions: [],
+  deviceGroups: [],
+  deviceGroupsOptions: [],
  wechatGroups: [],
  wechatGroupsOptions: [],
  contentGroups: [],
--- a/Cunkebao/src/pages/mobile/scenarios/plan/new/index.tsx
+++ b/Cunkebao/src/pages/mobile/scenarios/plan/new/index.tsx
@@ -67,8 +67,8 @@ export default function NewPlan() {
        remarkFormat: detail.remarkFormat ?? "",
        addFriendInterval: detail.addFriendInterval ?? 1,
        tips: detail.tips ?? "",
-        deveiceGroups: detail.deveiceGroups ?? [],
-        deveiceGroupsOptions: detail.deveiceGroupsOptions ?? [],
+        deviceGroups: detail.deviceGroups ?? [],
+        deviceGroupsOptions: detail.deviceGroupsOptions ?? [],
        wechatGroups: detail.wechatGroups ?? [],
        wechatGroupsOptions: detail.wechatGroupsOptions ?? [],
        contentGroups: detail.contentGroups ?? [],
--- a/Cunkebao/src/pages/mobile/scenarios/plan/new/steps/FriendRequestSettings.tsx
+++ b/Cunkebao/src/pages/mobile/scenarios/plan/new/steps/FriendRequestSettings.tsx
@@ -76,11 +76,11 @@ const FriendRequestSettings: React.FC<FriendRequestSettingsProps> = ({
    onChange({ ...formData, greeting: template });
    setIsTemplateDialogOpen(false);
  };
-  const handleDevicesChange = (deveiceGroupsOptions: DeviceSelectionItem[]) => {
+  const handleDevicesChange = (deviceGroupsOptions: DeviceSelectionItem[]) => {
    onChange({
      ...formData,
-      deveiceGroups: deveiceGroupsOptions.map(d => d.id),
-      deveiceGroupsOptions: deveiceGroupsOptions,
+      deviceGroups: deviceGroupsOptions.map(d => d.id),
+      deviceGroupsOptions: deviceGroupsOptions,
    });
  };

@@ -90,7 +90,7 @@ const FriendRequestSettings: React.FC<FriendRequestSettingsProps> = ({
      <div className={styles["friend-label"]}>选择设备</div>
      <div className={styles["friend-block"]}>
        <DeviceSelection
-          selectedOptions={formData.deveiceGroupsOptions}
+          selectedOptions={formData.deviceGroupsOptions}
          onSelect={handleDevicesChange}
          placeholder="选择设备"
        />
--- a/Cunkebao/src/pages/mobile/workspace/auto-group/form/components/DeviceSelector.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/auto-group/form/components/DeviceSelector.tsx
@@ -6,8 +6,8 @@ import { DeviceSelectionItem } from "@/components/DeviceSelection/data";
 interface DeviceSelectorProps {
  selectedDevices: DeviceSelectionItem[];
  onNext: (data: {
-    deveiceGroups: string[];
-    deveiceGroupsOptions: DeviceSelectionItem[];
+    deviceGroups: string[];
+    deviceGroupsOptions: DeviceSelectionItem[];
  }) => void;
 }

@@ -37,15 +37,13 @@ const DeviceSelector = forwardRef<DeviceSelectorRef, DeviceSelectorProps>(
    }));

    // 设备选择
-    const handleDeviceSelect = (
-      deveiceGroupsOptions: DeviceSelectionItem[],
-    ) => {
-      const deveiceGroups = deveiceGroupsOptions.map(item => item.id);
-      form.setFieldValue("deveiceGroups", deveiceGroups);
+    const handleDeviceSelect = (deviceGroupsOptions: DeviceSelectionItem[]) => {
+      const deviceGroups = deviceGroupsOptions.map(item => item.id);
+      form.setFieldValue("deviceGroups", deviceGroups);
      // 通知父组件数据变化
      onNext({
-        deveiceGroups: deveiceGroups.map(id => String(id)),
-        deveiceGroupsOptions,
+        deviceGroups: deviceGroups.map(id => String(id)),
+        deviceGroupsOptions,
      });
    };

@@ -55,7 +53,7 @@ const DeviceSelector = forwardRef<DeviceSelectorRef, DeviceSelectorProps>(
          form={form}
          layout="vertical"
          initialValues={{
-            deveiceGroups: selectedDevices.map(item => item.id),
+            deviceGroups: selectedDevices.map(item => item.id),
          }}
        >
          <div style={{ marginBottom: 20 }}>
@@ -68,7 +66,7 @@ const DeviceSelector = forwardRef<DeviceSelectorRef, DeviceSelectorProps>(
          </div>

          <Form.Item
-            name="deveiceGroups"
+            name="deviceGroups"
            rules={[
              {
                required: true,
--- a/Cunkebao/src/pages/mobile/workspace/auto-group/form/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/auto-group/form/index.tsx
@@ -23,8 +23,8 @@ const steps: StepItem[] = [
 const defaultForm: AutoGroupFormData = {
  name: "",
  type: 4,
-  deveiceGroups: [], // 设备组
-  deveiceGroupsOptions: [], // 设备组选项
+  deviceGroups: [], // 设备组
+  deviceGroupsOptions: [], // 设备组选项
  poolGroups: [], // 内容库
  poolGroupsOptions: [], // 内容库选项
  startTime: dayjs().format("HH:mm"), // 开始时间 (HH:mm)
@@ -64,8 +64,8 @@ const AutoGroupForm: React.FC = () => {
      const updatedForm = {
        ...defaultForm,
        name: res.name,
-        deveiceGroups: res.config.deveiceGroups || [],
-        deveiceGroupsOptions: res.config.deveiceGroupsOptions || [],
+        deviceGroups: res.config.deviceGroups || [],
+        deviceGroupsOptions: res.config.deviceGroupsOptions || [],
        poolGroups: res.config.poolGroups || [],
        poolGroupsOptions: res.config.poolGroupsOptions || [],
        startTime: res.config.startTime,
@@ -80,7 +80,7 @@ const AutoGroupForm: React.FC = () => {
        id: res.id,
      };
      setFormData(updatedForm);
-      setDeviceGroupsOptions(res.config.deveiceGroupsOptions || []);
+      setDeviceGroupsOptions(res.config.deviceGroupsOptions || []);
      setpoolGroupsOptions(res.config.poolGroupsOptions || []);
      setDataLoaded(true); // 标记数据已加载
    });
@@ -92,14 +92,14 @@ const AutoGroupForm: React.FC = () => {

  // 设备组选择
  const handleDevicesChange = (data: {
-    deveiceGroups: string[];
-    deveiceGroupsOptions: DeviceSelectionItem[];
+    deviceGroups: string[];
+    deviceGroupsOptions: DeviceSelectionItem[];
  }) => {
    setFormData(prev => ({
      ...prev,
-      deveiceGroups: data.deveiceGroups,
+      deviceGroups: data.deviceGroups,
    }));
-    setDeviceGroupsOptions(data.deveiceGroupsOptions);
+    setDeviceGroupsOptions(data.deviceGroupsOptions);
  };

  // 流量池包选择
@@ -116,7 +116,7 @@ const AutoGroupForm: React.FC = () => {
      Toast.show({ content: "请输入任务名称" });
      return;
    }
-    if (formData.deveiceGroups.length === 0) {
+    if (formData.deviceGroups.length === 0) {
      Toast.show({ content: "请选择至少一个设备组" });
      return;
    }
@@ -129,7 +129,7 @@ const AutoGroupForm: React.FC = () => {
    try {
      const submitData = {
        ...formData,
-        deveiceGroupsOptions: deviceGroupsOptions,
+        deviceGroupsOptions: deviceGroupsOptions,
        poolGroupsOptions: poolGroupsOptions,
      };

--- a/Cunkebao/src/pages/mobile/workspace/auto-group/form/types.ts
+++ b/Cunkebao/src/pages/mobile/workspace/auto-group/form/types.ts
@@ -6,8 +6,8 @@ export interface AutoGroupFormData {
  id?: string; // 任务ID
  type: number; // 任务类型
  name: string; // 任务名称
-  deveiceGroups: string[]; // 设备组
-  deveiceGroupsOptions: DeviceSelectionItem[]; // 设备组选项
+  deviceGroups: string[]; // 设备组
+  deviceGroupsOptions: DeviceSelectionItem[]; // 设备组选项
  poolGroups: string[]; // 流量池
  poolGroupsOptions: PoolSelectionItem[]; // 流量池选项
  startTime: string; // 开始时间 (YYYY-MM-DD HH:mm:ss)
@@ -34,7 +34,7 @@ export const formValidationRules = {
    { required: true, message: "请输入任务名称" },
    { min: 2, max: 50, message: "任务名称长度应在2-50个字符之间" },
  ],
-  deveiceGroups: [
+  deviceGroups: [
    { required: true, message: "请选择设备组" },
    { type: "array", min: 1, message: "至少选择一个设备组" },
  ],
--- a/Cunkebao/src/pages/mobile/workspace/auto-like/new/data.ts
+++ b/Cunkebao/src/pages/mobile/workspace/auto-like/new/data.ts
@@ -79,8 +79,8 @@ export interface CreateLikeTaskData {
  startTime: string;
  endTime: string;
  contentTypes: ContentType[];
-  deveiceGroups: number[];
-  deveiceGroupsOptions: DeviceSelectionItem[];
+  deviceGroups: number[];
+  deviceGroupsOptions: DeviceSelectionItem[];
  friendsGroups: number[];
  friendsGroupsOptions: FriendSelectionItem[];
  friendMaxLikes: number;
--- a/Cunkebao/src/pages/mobile/workspace/auto-like/new/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/auto-like/new/index.tsx
@@ -43,8 +43,8 @@ const NewAutoLike: React.FC = () => {
    startTime: "08:00",
    endTime: "22:00",
    contentTypes: ["text", "image", "video"],
-    deveiceGroups: [],
-    deveiceGroupsOptions: [],
+    deviceGroups: [],
+    deviceGroupsOptions: [],
    friendsGroups: [],
    friendsGroupsOptions: [],
    targetTags: [],
@@ -72,8 +72,8 @@ const NewAutoLike: React.FC = () => {
          startTime: config.timeRange?.start || config.startTime || "08:00",
          endTime: config.timeRange?.end || config.endTime || "22:00",
          contentTypes: config.contentTypes || ["text", "image", "video"],
-          deveiceGroups: config.deveiceGroups || [],
-          deveiceGroupsOptions: config.deveiceGroupsOptions || [],
+          deviceGroups: config.deviceGroups || [],
+          deviceGroupsOptions: config.deviceGroupsOptions || [],
          friendsGroups: config.friendsgroups || [],
          friendsGroupsOptions: config.friendsGroupsOptions || [],
          targetTags: config.targetTags || [],
@@ -121,7 +121,7 @@ const NewAutoLike: React.FC = () => {
      message.warning("请输入任务名称");
      return;
    }
-    if (!formData.deveiceGroups || formData.deveiceGroups.length === 0) {
+    if (!formData.deviceGroups || formData.deviceGroups.length === 0) {
      message.warning("请选择执行设备");
      return;
    }
@@ -329,11 +329,11 @@ const NewAutoLike: React.FC = () => {
    <div className={style.basicSection}>
      <div className={style.formItem}>
        <DeviceSelection
-          selectedOptions={formData.deveiceGroupsOptions}
+          selectedOptions={formData.deviceGroupsOptions}
          onSelect={devices =>
            handleUpdateFormData({
-              deveiceGroups: devices.map(v => v.id),
-              deveiceGroupsOptions: devices,
+              deviceGroups: devices.map(v => v.id),
+              deviceGroupsOptions: devices,
            })
          }
          showInput={true}
@@ -353,7 +353,7 @@ const NewAutoLike: React.FC = () => {
        onClick={handleNext}
        className={style.nextBtn}
        size="large"
-        disabled={formData.deveiceGroups.length === 0}
+        disabled={formData.deviceGroups.length === 0}
      >
        下一步
      </Button>
@@ -372,7 +372,7 @@ const NewAutoLike: React.FC = () => {
              friendsGroupsOptions: friends,
            })
          }
-          deviceIds={formData.deveiceGroups}
+          deviceIds={formData.deviceGroups}
        />
      </div>
      <Button
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/detail/index.module.scss
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/detail/index.module.scss
@@ -1,7 +1,5 @@
 .container {
  padding: 12px;
-  background-color: #f5f5f5;
-  min-height: 100vh;
 }

 .loading {
@@ -25,8 +23,7 @@
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-  margin-bottom: 16px;
-  
+
  :global(.adm-card-body) {
    padding: 16px;
  }
@@ -61,8 +58,8 @@

 .actions {
  display: flex;
-  gap: 8px;
-  
+  gap: 20px;
+
  :global(.adm-button) {
    flex: 1;
    border-radius: 6px;
@@ -75,21 +72,21 @@
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  overflow: hidden;
-  
+
  :global(.adm-tabs-header) {
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
  }
-  
+
  :global(.adm-tabs-tab) {
    font-size: 15px;
    font-weight: 500;
-    
+
    &.adm-tabs-tab-active {
      color: #1890ff;
    }
  }
-  
+
  :global(.adm-tabs-tab-line) {
    background: #1890ff;
  }
@@ -106,7 +103,7 @@
  background: #fff;
  border-radius: 8px;
  border: 1px solid #f0f0f0;
-  
+
  :global(.adm-card-body) {
    padding: 16px;
  }
@@ -158,11 +155,11 @@
  border-radius: 8px;
  border: 1px solid #f0f0f0;
  margin-bottom: 12px;
-  
+
  :global(.adm-list-item-content) {
    padding: 16px;
  }
-  
+
  &:last-child {
    margin-bottom: 0;
  }
@@ -201,12 +198,12 @@
  display: flex;
  align-items: center;
  font-size: 13px;
-  
+
  .label {
    min-width: 70px;
    color: #666;
  }
-  
+
  .value {
    color: #333;
  }
@@ -237,19 +234,19 @@
    border-radius: 12px;
    font-size: 12px;
    padding: 2px 8px;
-    
+
    &.adm-tag-success {
      background: #f6ffed;
      border-color: #b7eb8f;
      color: #52c41a;
    }
-    
+
    &.adm-tag-danger {
      background: #fff2f0;
      border-color: #ffccc7;
      color: #ff4d4f;
    }
-    
+
    &.adm-tag-warning {
      background: #fff7e6;
      border-color: #ffd591;
@@ -267,47 +264,43 @@

 // 响应式设计
@media (max-width: 480px) {
-  .container {
-    padding: 8px;
-  }
-  
  .taskName {
    font-size: 16px;
  }
-  
+
  .taskStatus {
    font-size: 13px;
    padding: 3px 10px;
  }
-  
+
  .cardTitle {
    font-size: 15px;
  }
-  
+
  .infoItem {
    font-size: 13px;
  }
-  
+
  .label {
    min-width: 70px;
  }
-  
+
  .recordDevice {
    font-size: 13px;
  }
-  
+
  .recordTime {
    font-size: 11px;
  }
-  
+
  .recordDetail {
    font-size: 12px;
-    
+
    .label {
      min-width: 60px;
    }
  }
-  
+
  .recordError {
    font-size: 12px;
    padding: 6px 10px;
@@ -317,16 +310,16 @@
 // 空状态样式
 :global(.adm-empty) {
  padding: 40px 20px;
-  
+
  .adm-empty-image {
    width: 60px;
    height: 60px;
    opacity: 0.3;
  }
-  
+
  .adm-empty-description {
    color: #999;
    font-size: 14px;
    margin-top: 12px;
  }
-}
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/detail/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/detail/index.tsx
@@ -21,10 +21,7 @@ import {
  triggerImport,
  toggleContactImportTask,
 } from "../list/api";
-import {
-  ContactImportTask,
-  ContactImportRecord,
-} from "../list/data";
+import { ContactImportTask, ContactImportRecord } from "../list/data";
 import {
  PlayCircleOutlined,
  PauseCircleOutlined,
@@ -39,8 +36,8 @@ import style from "./index.module.scss";
 const ContactImportDetail: React.FC = () => {
  const navigate = useNavigate();
  const { id } = useParams<{ id: string }>();
-  
-  const [task, setTask] = useState<ContactImportTask | null>(null);
+
+  const [task, setTask] = useState<any>(null);
  const [records, setRecords] = useState<ContactImportRecord[]>([]);
  const [loading, setLoading] = useState(false);
  const [recordsLoading, setRecordsLoading] = useState(false);
@@ -51,7 +48,7 @@ const ContactImportDetail: React.FC = () => {
  // 获取任务详情
  const loadTaskDetail = async () => {
    if (!id) return;
-    
+
    setLoading(true);
    try {
      const response = await fetchContactImportTaskDetail(id);
@@ -71,7 +68,7 @@ const ContactImportDetail: React.FC = () => {
  // 获取导入记录
  const loadRecords = async (pageNum: number = 1, reset: boolean = false) => {
    if (!id) return;
-    
+
    setRecordsLoading(true);
    try {
      const response = await fetchImportRecords(id, pageNum, 20);
@@ -96,7 +93,7 @@ const ContactImportDetail: React.FC = () => {
  // 切换任务状态
  const handleToggleStatus = async () => {
    if (!task) return;
-    
+
    try {
      await toggleContactImportTask({
        id: task.id,
@@ -118,7 +115,7 @@ const ContactImportDetail: React.FC = () => {
  // 手动触发导入
  const handleTriggerImport = async () => {
    if (!task) return;
-    
+
    try {
      await triggerImport(task.id);
      Toast.show({
@@ -190,9 +187,9 @@ const ContactImportDetail: React.FC = () => {
  }, [id]);

  useEffect(() => {
-    if (activeTab === "records" && records.length === 0) {
-      loadRecords(1, true);
-    }
+    // if (activeTab === "records" && records.length === 0) {
+    //   loadRecords(1, true);
+    // }
  }, [activeTab]);

  if (loading) {
@@ -250,31 +247,20 @@ const ContactImportDetail: React.FC = () => {
  return (
    <Layout
      header={
-        <NavCommon
-          left={
-            <Button
-              fill="none"
-              size="small"
-              onClick={() => navigate("/workspace/contact-import/list")}
-            >
-              返回
-            </Button>
-          }
-          title="任务详情"
-          right={
-            <Button
-              fill="none"
-              size="small"
-              onClick={() => navigate(`/workspace/contact-import/form/${task.id}`)}
-            >
-              <EditOutlined /> 编辑
-            </Button>
-          }
-        />
-      }
-    >
-      <PullToRefresh onRefresh={handleRefresh}>
-        <div className={style.container}>
+        <>
+          <NavCommon
+            title="任务详情"
+            right={
+              <Button
+                color="primary"
+                onClick={() =>
+                  navigate(`/workspace/contact-import/form/${task.id}`)
+                }
+              >
+                <EditOutlined /> 编辑
+              </Button>
+            }
+          />
          {/* 任务操作栏 */}
          <Card className={style.actionCard}>
            <div className={style.taskHeader}>
@@ -290,14 +276,17 @@ const ContactImportDetail: React.FC = () => {
            </div>
            <div className={style.actions}>
              <Button
-                size="small"
                onClick={handleToggleStatus}
                color={task.status === 1 ? "warning" : "primary"}
              >
                {task.status === 1 ? (
-                  <><PauseCircleOutlined /> 暂停</>
+                  <>
+                    <PauseCircleOutlined /> 暂停
+                  </>
                ) : (
-                  <><PlayCircleOutlined /> 启动</>
+                  <>
+                    <PlayCircleOutlined /> 启动
+                  </>
                )}
              </Button>
              <Button
@@ -309,7 +298,11 @@ const ContactImportDetail: React.FC = () => {
              </Button>
            </div>
          </Card>
-
+        </>
+      }
+    >
+      <PullToRefresh onRefresh={handleRefresh}>
+        <div className={style.container}>
          {/* 标签页 */}
          <Tabs
            activeKey={activeTab}
@@ -328,7 +321,9 @@ const ContactImportDetail: React.FC = () => {
                    </div>
                    <div className={style.infoItem}>
                      <span className={style.label}>设备组数:</span>
-                      <span className={style.value}>{task.deviceGroups?.length || 0}</span>
+                      <span className={style.value}>
+                        {task.deviceGroups?.length || 0}
+                      </span>
                    </div>
                    <div className={style.infoItem}>
                      <span className={style.label}>导入数量:</span>
@@ -363,11 +358,15 @@ const ContactImportDetail: React.FC = () => {
                    </div>
                    <div className={style.infoItem}>
                      <span className={style.label}>每日最大导入:</span>
-                      <span className={style.value}>{task.maxImportsPerDay}</span>
+                      <span className={style.value}>
+                        {task.maxImportsPerDay}
+                      </span>
                    </div>
                    <div className={style.infoItem}>
                      <span className={style.label}>导入间隔:</span>
-                      <span className={style.value}>{task.importInterval}分钟</span>
+                      <span className={style.value}>
+                        {task.importInterval}分钟
+                      </span>
                    </div>
                  </div>
                </Card>
@@ -378,11 +377,15 @@ const ContactImportDetail: React.FC = () => {
                  <div className={style.infoList}>
                    <div className={style.infoItem}>
                      <span className={style.label}>今日导入:</span>
-                      <span className={style.value}>{task.todayImportCount}</span>
+                      <span className={style.value}>
+                        {task.todayImportCount}
+                      </span>
                    </div>
                    <div className={style.infoItem}>
                      <span className={style.label}>总导入数:</span>
-                      <span className={style.value}>{task.totalImportCount}</span>
+                      <span className={style.value}>
+                        {task.totalImportCount}
+                      </span>
                    </div>
                    <div className={style.infoItem}>
                      <span className={style.label}>创建时间:</span>
@@ -403,7 +406,7 @@ const ContactImportDetail: React.FC = () => {
                  <Empty description="暂无导入记录" />
                ) : (
                  <List className={style.recordList}>
-                    {records.map((record) => (
+                    {records.map(record => (
                      <List.Item key={record.id} className={style.recordItem}>
                        <div className={style.recordHeader}>
                          <div className={style.recordInfo}>
@@ -440,7 +443,7 @@ const ContactImportDetail: React.FC = () => {
                    ))}
                  </List>
                )}
-                
+
                <InfiniteScroll
                  loadMore={loadMoreRecords}
                  hasMore={hasMore}
@@ -461,4 +464,4 @@ const ContactImportDetail: React.FC = () => {
  );
 };

-export default ContactImportDetail;
+export default ContactImportDetail;
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/form/api.ts
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/form/api.ts
@@ -0,0 +1,91 @@
+import request from "@/api/request";
+import {
+  Allocation,
+  CreateContactImportTaskData,
+  UpdateContactImportTaskData,
+  ContactImportRecord,
+  PaginatedResponse,
+  ImportStats,
+} from "./data";
+
+// 获取通讯录导入任务列表
+export function fetchContactImportTasks(
+  params = { type: 6, page: 1, limit: 10 },
+) {
+  return request("/v1/workbench/list", params, "GET");
+}
+
+// 获取单个任务详情
+export function fetchContactImportTaskDetail(id: number) {
+  return request("/v1/workbench/detail", { id }, "GET");
+}
+
+// 创建通讯录导入任务
+export function createContactImportTask(data: Allocation): Promise<any> {
+  return request("/v1/workbench/create", { ...data, type: 6 }, "POST");
+}
+
+// 更新通讯录导入任务
+export function updateContactImportTask(data: Allocation): Promise<any> {
+  return request("/v1/workbench/update", { ...data, type: 6 }, "POST");
+}
+
+// 删除通讯录导入任务
+export function deleteContactImportTask(id: number): Promise<any> {
+  return request("/v1/workbench/delete", { id }, "DELETE");
+}
+
+// 切换任务状态
+export function toggleContactImportTask(data: {
+  id: number;
+  status: number;
+}): Promise<any> {
+  return request("/v1/workbench/update-status", { ...data }, "POST");
+}
+
+// 复制通讯录导入任务
+export function copyContactImportTask(id: number): Promise<any> {
+  return request("/v1/workbench/copy", { id }, "POST");
+}
+
+// 获取导入记录
+export function fetchImportRecords(
+  workbenchId: number,
+  page: number = 1,
+  limit: number = 20,
+  keyword?: string,
+): Promise<PaginatedResponse<ContactImportRecord>> {
+  return request(
+    "/v1/workbench/import-records",
+    {
+      workbenchId,
+      page,
+      limit,
+      keyword,
+    },
+    "GET",
+  );
+}
+
+// 获取统计数据
+export function fetchImportStats(): Promise<ImportStats> {
+  return request("/v1/workbench/import-stats", {}, "GET");
+}
+
+// 获取设备组列表
+export function fetchDeviceGroups(): Promise<any[]> {
+  return request("/v1/device/groups", {}, "GET");
+}
+
+// 手动触发导入
+export function triggerImport(taskId: number): Promise<any> {
+  return request("/v1/workbench/trigger-import", { taskId }, "POST");
+}
+
+// 批量操作任务
+export function batchOperateTasks(data: {
+  taskIds: number[];
+  operation: "start" | "stop" | "delete";
+}): Promise<any> {
+  return request("/v1/workbench/batch-operate", data, "POST");
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/form/data.ts
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/form/data.ts
@@ -0,0 +1,168 @@
+// 分配接口类型
+export interface Allocation {
+  /** 主键ID */
+  id?: number;
+  /** 任务名称 */
+  name: string;
+  //是否启用0关闭，1启用
+  status: number;
+  //任务类型，固定为6
+  type: number;
+  /** 工作台ID */
+  workbenchId: number;
+
+  /** 设备id */
+  deviceGroups: number[];
+  /** 流量池 */
+  pools?: JSON | null;
+
+  /** 分配数量 */
+  num?: number | null;
+
+  /** 是否清除现有联系人，默认0 */
+  clearContact?: number;
+
+  /** 备注类型 0不备注 1年月日 2月日 3自定义，默认0 */
+  remarkType: number;
+
+  /** 备注 */
+  remark?: string | null;
+
+  /** 开始时间 */
+  startTime?: string | null;
+
+  /** 结束时间 */
+  endTime?: string | null;
+  [key: string]: any;
+}
+// 通讯录导入任务状态
+export type ContactImportTaskStatus = 1 | 2; // 1: 开启, 2: 关闭
+
+// 设备组信息
+export interface DeviceGroup {
+  id: string;
+  name: string;
+  deviceCount: number;
+  status: "online" | "offline";
+  lastActive: string;
+}
+
+// 通讯录导入记录
+export interface ContactImportRecord {
+  id: string;
+  workbenchId: string;
+  wechatAccountId: string;
+  deviceId: string;
+  num: number;
+  clientId: string;
+  remarkType: string;
+  remarkValue: string;
+  startTime: string;
+  endTime: string;
+  createTime: string;
+  operatorName: string;
+  operatorAvatar: string;
+  deviceName: string;
+  importStatus: "success" | "failed" | "pending";
+  errorMessage?: string;
+}
+
+// 通讯录导入任务配置
+export interface ContactImportTaskConfig {
+  id: number;
+  workbenchId: number;
+  devices: number[];
+  pools: number[];
+  num: number;
+  clearContact: number;
+  remarkType: number;
+  remark: string;
+  startTime: string;
+  endTime: string;
+  createTime: string;
+}
+
+// 通讯录导入任务
+export interface ContactImportTask {
+  id: number;
+  companyId: number;
+  name: string;
+  type: number;
+  status: ContactImportTaskStatus;
+  autoStart: number;
+  userId: number;
+  createTime: string;
+  updateTime: string;
+  config: ContactImportTaskConfig;
+  creatorName: string;
+  auto_like: any;
+  moments_sync: any;
+  traffic_config: any;
+  group_push: any;
+  group_create: any;
+  // 计算属性，用于向后兼容
+  deviceGroups?: string[];
+  todayImportCount?: number;
+  totalImportCount?: number;
+  maxImportsPerDay?: number;
+  importInterval?: number;
+}
+
+// 创建通讯录导入任务数据
+export interface CreateContactImportTaskData {
+  name: string;
+  type: number;
+  config: {
+    devices: number[];
+    pools: number[];
+    num: number;
+    clearContact: number;
+    remarkType: number;
+    remark: string;
+    startTime: string;
+    endTime: string;
+  };
+}
+
+// 更新通讯录导入任务数据
+export interface UpdateContactImportTaskData
+  extends CreateContactImportTaskData {
+  id: number;
+}
+
+// 任务配置
+export interface TaskConfig {
+  deviceGroups: string[];
+  num: number;
+  clientId: string;
+  remarkType: string;
+  remarkValue: string;
+  startTime: string;
+  endTime: string;
+  maxImportsPerDay: number;
+  importInterval: number;
+}
+
+// API响应
+export interface ApiResponse<T = any> {
+  code: number;
+  msg: string;
+  data: T;
+}
+
+// 分页响应
+export interface PaginatedResponse<T> {
+  list: T[];
+  total: number;
+  page: number;
+  limit: number;
+}
+
+// 统计数据
+export interface ImportStats {
+  totalTasks: number;
+  activeTasks: number;
+  todayImports: number;
+  totalImports: number;
+  successRate: number;
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/form/index.module.scss
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/form/index.module.scss
@@ -1,229 +1,146 @@
-.container {
-  padding: 12px;
-  background-color: #f5f5f5;
-  min-height: 100vh;
+.basicSection {
+  background: none;
+  border-radius: 0;
+  box-shadow: none;
+  padding: 24px 16px 0 16px;
+  width: 100%;
+  max-width: 600px;
+  margin: 0 auto;
 }

-.form {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
+.formItem {
+  margin-bottom: 24px;
 }

-.section {
-  background: #fff;
+.formLabel {
+  font-size: 15px;
+  color: #222;
+  font-weight: 500;
+  margin-bottom: 10px;
+  display: block;
+}
+
+.input {
+  height: 44px;
  border-radius: 8px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-  
-  :global(.adm-card-body) {
-    padding: 16px;
+  font-size: 15px;
+  width: 100%;
+}
+
+.select {
+  width: 100%;
+  height: 44px;
+
+  :global(.ant-select-selector) {
+    height: 44px !important;
+    border-radius: 8px !important;
+    font-size: 15px !important;
+  }
+
+  :global(.ant-select-selection-item) {
+    line-height: 42px !important;
  }
 }

-.sectionTitle {
-  font-size: 16px;
-  font-weight: 600;
-  color: #333;
-  margin-bottom: 16px;
-  padding-bottom: 8px;
-  border-bottom: 1px solid #f0f0f0;
-}
+.timePicker {
+  width: 100%;
+  height: 44px;

-.actions {
-  margin-top: 24px;
-  padding: 16px;
-  background: #fff;
-  border-radius: 8px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-}
-
-// Form样式覆盖
-:global {
-  .adm-form-item {
-    margin-bottom: 20px;
-    
-    &:last-child {
-      margin-bottom: 0;
-    }
-  }
-  
-  .adm-form-item-label {
-    font-size: 14px;
-    font-weight: 500;
-    color: #333;
-    margin-bottom: 8px;
-  }
-  
-  .adm-input {
-    border: 1px solid #d9d9d9;
-    border-radius: 6px;
-    padding: 10px 12px;
-    font-size: 14px;
-    
-    &:focus {
-      border-color: #1890ff;
-      box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
-    }
-    
-    &::placeholder {
-      color: #bfbfbf;
-    }
-  }
-  
-  .adm-selector {
-    .adm-selector-item {
-      border: 1px solid #d9d9d9;
-      border-radius: 6px;
-      margin: 4px;
-      padding: 8px 12px;
-      font-size: 14px;
-      
-      &.adm-selector-item-active {
-        border-color: #1890ff;
-        background-color: #e6f7ff;
-        color: #1890ff;
-      }
-    }
-  }
-  
-  .adm-stepper {
-    .adm-stepper-button {
-      border: 1px solid #d9d9d9;
-      border-radius: 4px;
-      width: 32px;
-      height: 32px;
-      
-      &:hover {
-        border-color: #1890ff;
-        color: #1890ff;
-      }
-    }
-    
-    .adm-stepper-input {
-      border: 1px solid #d9d9d9;
-      border-radius: 4px;
-      height: 32px;
-      margin: 0 4px;
-      text-align: center;
-      font-size: 14px;
-    }
-  }
-  
-  .adm-picker {
-    .adm-picker-view-column {
-      font-size: 14px;
-    }
-  }
-  
-  .adm-button {
-    border-radius: 6px;
-    font-size: 16px;
-    font-weight: 500;
-    
-    &.adm-button-primary {
-      background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%);
-      border: none;
-      
-      &:hover {
-        background: linear-gradient(135deg, #40a9ff 0%, #1890ff 100%);
-      }
-    }
-  }
-}
-
-// 表单验证错误样式
-:global(.adm-form-item-feedback-error) {
-  color: #ff4d4f;
-  font-size: 12px;
-  margin-top: 4px;
-}
-
-:global(.adm-form-item-has-error) {
-  .adm-input {
-    border-color: #ff4d4f;
-    
-    &:focus {
-      border-color: #ff4d4f;
-      box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2);
-    }
-  }
-  
-  .adm-selector-item {
-    border-color: #ff4d4f;
-  }
-  
-  .adm-stepper-button,
-  .adm-stepper-input {
-    border-color: #ff4d4f;
-  }
-}
-
-// 响应式设计
-@media (max-width: 480px) {
-  .container {
-    padding: 8px;
-  }
-  
-  .sectionTitle {
+  :global(.ant-picker) {
+    width: 100%;
+    height: 44px;
+    border-radius: 8px;
    font-size: 15px;
  }
-  
-  .actions {
-    margin-top: 16px;
-    padding: 12px;
-  }
-  
-  :global {
-    .adm-form-item-label {
-      font-size: 13px;
-    }
-    
-    .adm-input {
-      padding: 8px 10px;
-      font-size: 13px;
-    }
-    
-    .adm-selector-item {
-      padding: 6px 10px;
-      font-size: 13px;
-    }
-    
-    .adm-button {
-      font-size: 15px;
-    }
-  }
 }

-// 加载状态
-.loading {
+.counterRow {
+  display: flex;
+  align-items: center;
+  gap: 0;
+}
+
+.stepperContainer {
+  display: flex;
+  align-items: center;
+  gap: 0;
+}
+
+.stepperButton {
+  width: 40px;
+  height: 40px;
+  border-radius: 8px;
+  background: #fff;
+  border: 1px solid #e5e7eb;
+  font-size: 16px;
+  color: #188eee;
  display: flex;
  align-items: center;
  justify-content: center;
-  padding: 40px;
-  color: #666;
-  font-size: 14px;
-  gap: 8px;
+  cursor: pointer;
+  transition: border 0.2s;
+
+  &:hover {
+    border: 1px solid #188eee;
+  }
 }

-// 提示信息
-.tip {
-  background: #f6ffed;
-  border: 1px solid #b7eb8f;
-  border-radius: 6px;
-  padding: 12px;
-  margin-bottom: 16px;
-  font-size: 13px;
-  color: #52c41a;
-  line-height: 1.5;
+.stepperInput {
+  width: 80px;
+  height: 40px;
+  border-radius: 0;
+  border: 1px solid #e5e7eb;
+  border-left: none;
+  border-right: none;
+  text-align: center;
+  font-size: 16px;
+  font-weight: 600;
+  color: #222;
+  padding: 0 8px;
 }

-.warning {
-  background: #fff7e6;
-  border: 1px solid #ffd591;
-  border-radius: 6px;
-  padding: 12px;
-  margin-bottom: 16px;
-  font-size: 13px;
-  color: #fa8c16;
-  line-height: 1.5;
-}
+.counterTip {
+  font-size: 12px;
+  color: #aaa;
+  margin-top: 4px;
+}
+
+.buttonGroup {
+  display: flex;
+  gap: 12px;
+  padding: 14px;
+  background: #fff;
+}
+
+.submitButton {
+  height: 44px;
+  border-radius: 8px;
+  font-size: 15px;
+  min-width: 120px;
+  flex: 1;
+}
+
+.resetButton {
+  height: 44px;
+  border-radius: 8px;
+  font-size: 15px;
+  min-width: 100px;
+}
+
+.deviceSelection {
+  width: 100%;
+
+  :global {
+    .ant-input {
+      border-radius: 8px;
+      border: 1px solid #e8e8e8;
+      padding: 12px 16px;
+      font-size: 14px;
+
+      &:focus {
+        border-color: #1890ff;
+        box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
+      }
+    }
+  }
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/form/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/form/index.tsx
@@ -1,140 +1,153 @@
 import React, { useState, useEffect } from "react";
 import { useNavigate, useParams } from "react-router-dom";
-import {
-  Button,
-  Toast,
-  Form,
-  Input,
-  Selector,
-  Stepper,
-  DatePicker,
-  Card,
-  Space,
-} from "antd-mobile";
+import { PlusOutlined, MinusOutlined } from "@ant-design/icons";
+import { Button, Input, message, TimePicker, Select, Switch } from "antd";
 import NavCommon from "@/components/NavCommon";
 import Layout from "@/components/Layout/Layout";
+import DeviceSelection from "@/components/DeviceSelection";
 import {
  createContactImportTask,
  updateContactImportTask,
  fetchContactImportTaskDetail,
-  fetchDeviceGroups,
-} from "../list/api";
-import {
-  CreateContactImportTaskData,
-  UpdateContactImportTaskData,
-  ContactImportTask,
-  DeviceGroup,
-} from "../list/data";
+} from "./api";
+import { Allocation } from "./data";
+
 import style from "./index.module.scss";
+import dayjs from "dayjs";

 const ContactImportForm: React.FC = () => {
  const navigate = useNavigate();
  const { id } = useParams<{ id?: string }>();
  const isEdit = !!id;
-  
-  const [form] = Form.useForm();
+
  const [loading, setLoading] = useState(false);
-  const [deviceGroups, setDeviceGroups] = useState<DeviceGroup[]>([]);
-  const [taskData, setTaskData] = useState<ContactImportTask | null>(null);
-  const [showStartTimePicker, setShowStartTimePicker] = useState(false);
-  const [showEndTimePicker, setShowEndTimePicker] = useState(false);
-  const [startTime, setStartTime] = useState<Date | null>(null);
-  const [endTime, setEndTime] = useState<Date | null>(null);
+  const [formData, setFormData] = useState({
+    name: "", // 任务名称
+    status: 1, // 是否启用，默认启用
+    type: 6, // 任务类型，固定为6
+    workbenchId: 1, // 默认工作台ID
+    deviceGroups: [] as number[],
+    pools: [] as any[],
+    num: 50,
+    clearContact: 0,
+    remarkType: 0,
+    remark: "",
+    startTime: dayjs("09:00", "HH:mm"),
+    endTime: dayjs("21:00", "HH:mm"),
+    // 保留原有字段用于UI显示
+    deviceGroupsOptions: [] as any[],
+  });

-  // 备注类型选项
-  const remarkTypeOptions = [
-    { label: "公司名称", value: "公司名称" },
-    { label: "职位", value: "职位" },
-    { label: "部门", value: "部门" },
-    { label: "地区", value: "地区" },
-    { label: "行业", value: "行业" },
-    { label: "来源", value: "来源" },
-    { label: "标签", value: "标签" },
-    { label: "自定义", value: "自定义" },
-  ];
-
-  // 获取设备组列表
-  const loadDeviceGroups = async () => {
-    try {
-      const data = await fetchDeviceGroups();
-      setDeviceGroups(data);
-    } catch (error) {
-      Toast.show({
-        content: "获取设备组失败",
-        icon: "fail",
-      });
-    }
+  // 处理设备选择
+  const handleDeviceSelect = (selectedDevices: any[]) => {
+    setFormData(prev => ({
+      ...prev,
+      deviceGroupsOptions: selectedDevices,
+      deviceGroups: selectedDevices.map(device => device.id), // 提取设备ID存储到deviceGroups数组
+    }));
  };

  // 获取任务详情（编辑模式）
  const loadTaskDetail = async () => {
    if (!id) return;
-    
+
    try {
-      const data = await fetchContactImportTaskDetail(id);
+      setLoading(true);
+      const data = await fetchContactImportTaskDetail(Number(id));
      if (data) {
-        setTaskData(data);
-        form.setFieldsValue({
-          name: data.name,
-          deviceGroups: data.deviceGroups,
-          num: data.num,
-          clientId: data.clientId,
-          remarkType: data.remarkType,
-          remarkValue: data.remarkValue,
-          startTime: data.startTime,
-          endTime: data.endTime,
-          maxImportsPerDay: data.maxImportsPerDay,
-          importInterval: data.importInterval,
+        const config = data.config || {};
+
+        // 构造设备选择组件需要的数据格式
+        const deviceGroupsOptions = config.deviceGroupsOptions || [];
+
+        setFormData({
+          name: data.name || "",
+          status: data.status || 1,
+          type: data.type || 6,
+          workbenchId: config.workbenchId || 1,
+          deviceGroups:
+            deviceGroupsOptions.map((device: any) => device.id) || [],
+          pools: config.pools ? JSON.parse(JSON.stringify(config.pools)) : [],
+          num: config.num || 50,
+          clearContact: config.clearContact || 0,
+          remarkType: config.remarkType || 0,
+          remark: config.remark || "",
+          startTime: config.startTime ? dayjs(config.startTime, "HH:mm") : null,
+          endTime: config.endTime ? dayjs(config.endTime, "HH:mm") : null,
+          deviceGroupsOptions,
        });
      }
    } catch (error) {
-      Toast.show({
-        content: "获取任务详情失败",
-        icon: "fail",
-      });
+      console.error("Failed to load task detail:", error);
+      message.error("获取任务详情失败");
      navigate("/workspace/contact-import/list");
+    } finally {
+      setLoading(false);
    }
  };

+  // 更新表单数据
+  const handleUpdateFormData = (data: Partial<typeof formData>) => {
+    setFormData(prev => ({ ...prev, ...data }));
+  };
+
  // 提交表单
  const handleSubmit = async () => {
-    try {
-      const values = await form.validateFields();
-      setLoading(true);
+    // 表单验证
+    if (!formData.name.trim()) {
+      message.error("请输入任务名称");
+      return;
+    }

-      const taskData: CreateContactImportTaskData | UpdateContactImportTaskData = {
-        name: values.name,
-        deviceGroups: values.deviceGroups,
-        num: values.num,
-        clientId: values.clientId,
-        remarkType: values.remarkType,
-        remarkValue: values.remarkValue,
-        startTime: values.startTime,
-        endTime: values.endTime,
-        maxImportsPerDay: values.maxImportsPerDay,
-        importInterval: values.importInterval,
+    if (formData.deviceGroups.length === 0) {
+      message.error("请选择设备");
+      return;
+    }
+
+    if (!formData.num || formData.num <= 0) {
+      message.error("请输入有效的分配数量");
+      return;
+    }
+
+    // 验证开始时间不得大于结束时间
+    if (formData.startTime && formData.endTime) {
+      if (formData.startTime.isAfter(formData.endTime)) {
+        message.error("开始时间不得大于结束时间");
+        return;
+      }
+    }
+
+    setLoading(true);
+    try {
+      const submitData: Partial<Allocation> = {
+        name: formData.name,
+        status: formData.status,
+        type: formData.type,
+        workbenchId: formData.workbenchId,
+        deviceGroups: formData.deviceGroups,
+        pools: JSON.parse(JSON.stringify(formData.pools)),
+        num: formData.num,
+        clearContact: formData.clearContact,
+        remarkType: formData.remarkType,
+        remark: formData.remark || null,
+        startTime: formData.startTime?.format("HH:mm") || null,
+        endTime: formData.endTime?.format("HH:mm") || null,
      };

      if (isEdit && id) {
-        await updateContactImportTask({ ...taskData, id });
-        Toast.show({
-          content: "更新成功",
-          icon: "success",
-        });
+        await updateContactImportTask({
+          ...submitData,
+          id: Number(id),
+        } as Allocation);
+        message.success("更新成功");
      } else {
-        await createContactImportTask(taskData);
-        Toast.show({
-          content: "创建成功",
-          icon: "success",
-        });
+        await createContactImportTask(submitData as Allocation);
+        message.success("创建成功");
      }

      navigate("/workspace/contact-import/list");
    } catch (error) {
-      Toast.show({
-        content: isEdit ? "更新失败" : "创建失败",
-        icon: "fail",
-      });
+      message.error(isEdit ? "更新失败" : "创建失败");
    } finally {
      setLoading(false);
    }
@@ -142,11 +155,24 @@ const ContactImportForm: React.FC = () => {

  // 重置表单
  const handleReset = () => {
-    form.resetFields();
+    setFormData({
+      name: "",
+      status: 1,
+      type: 6,
+      workbenchId: 1,
+      deviceGroups: [],
+      pools: [],
+      num: 50,
+      clearContact: 0,
+      remarkType: 0,
+      remark: "",
+      startTime: dayjs("09:00", "HH:mm"),
+      endTime: dayjs("21:00", "HH:mm"),
+      deviceGroupsOptions: [],
+    });
  };

  useEffect(() => {
-    loadDeviceGroups();
    if (isEdit) {
      loadTaskDetail();
    }
@@ -154,200 +180,176 @@ const ContactImportForm: React.FC = () => {

  return (
    <Layout
-      header={
-        <NavCommon
-          left={
-            <Button
-              fill="none"
-              size="small"
-              onClick={() => navigate("/workspace/contact-import/list")}
-            >
-              返回
-            </Button>
-          }
-          title={isEdit ? "编辑通讯录导入" : "新建通讯录导入"}
-        />
+      header={<NavCommon title={isEdit ? "编辑导入任务" : "新建导入任务"} />}
+      footer={
+        <div className={style.buttonGroup}>
+          <Button
+            type="primary"
+            size="large"
+            loading={loading}
+            onClick={handleSubmit}
+            className={style.submitButton}
+          >
+            {isEdit ? "更新" : "创建"}
+          </Button>
+          <Button
+            size="large"
+            onClick={handleReset}
+            className={style.resetButton}
+          >
+            重置
+          </Button>
+        </div>
      }
+      loading={loading}
    >
-      <div className={style.container}>
-        <Form
-          form={form}
-          layout="vertical"
-          className={style.form}
-          initialValues={{
-            num: 50,
-            maxImportsPerDay: 100,
-            importInterval: 30,
-            startTime: "09:00",
-            endTime: "18:00",
-          }}
-        >
-          {/* 基本信息 */}
-          <Card className={style.section}>
-            <div className={style.sectionTitle}>基本信息</div>
-            
-            <Form.Item
-              name="name"
-              label="任务名称"
-              rules={[{ required: true, message: "请输入任务名称" }]}
-            >
-              <Input placeholder="请输入任务名称" />
-            </Form.Item>
-
-            <Form.Item
-              name="deviceGroups"
-              label="设备组"
-              rules={[{ required: true, message: "请选择设备组" }]}
-            >
-              <Selector
-                multiple
-                options={deviceGroups.map(group => ({
-                  label: `${group.name} (${group.deviceCount}台设备)`,
-                  value: group.id,
-                }))}
-                placeholder="请选择设备组"
-              />
-            </Form.Item>
-          </Card>
-
-          {/* 导入配置 */}
-          <Card className={style.section}>
-            <div className={style.sectionTitle}>导入配置</div>
-            
-            <Form.Item
-              name="num"
-              label="导入数量"
-              rules={[{ required: true, message: "请设置导入数量" }]}
-            >
-              <Stepper min={1} max={1000} />
-            </Form.Item>
-
-            <Form.Item
-              name="clientId"
-              label="客户端ID"
-              rules={[{ required: true, message: "请输入客户端ID" }]}
-            >
-              <Input placeholder="请输入客户端ID" />
-            </Form.Item>
-
-            <Form.Item
-              name="remarkType"
-              label="备注类型"
-              rules={[{ required: true, message: "请选择备注类型" }]}
-            >
-              <Selector
-                options={remarkTypeOptions}
-                placeholder="请选择备注类型"
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="remarkValue"
-              label="备注内容"
-              rules={[{ required: true, message: "请输入备注内容" }]}
-            >
-              <Input placeholder="请输入备注内容" />
-            </Form.Item>
-          </Card>
-
-          {/* 时间配置 */}
-          <Card className={style.section}>
-            <div className={style.sectionTitle}>时间配置</div>
-            
-            <Form.Item
-              name="startTime"
-              label="开始时间"
-              rules={[{ required: true, message: "请选择开始时间" }]}
-            >
-              <Input
-                readOnly
-                value={startTime ? `${startTime.getHours().toString().padStart(2, '0')}:${startTime.getMinutes().toString().padStart(2, '0')}` : ""}
-                placeholder="请选择开始时间"
-                onClick={() => setShowStartTimePicker(true)}
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="endTime"
-              label="结束时间"
-              rules={[{ required: true, message: "请选择结束时间" }]}
-            >
-              <Input
-                readOnly
-                value={endTime ? `${endTime.getHours().toString().padStart(2, '0')}:${endTime.getMinutes().toString().padStart(2, '0')}` : ""}
-                placeholder="请选择结束时间"
-                onClick={() => setShowEndTimePicker(true)}
-              />
-            </Form.Item>
-
-            <DatePicker
-              visible={showStartTimePicker}
-              title="选择开始时间"
-              precision="minute"
-              value={startTime}
-              onClose={() => setShowStartTimePicker(false)}
-              onConfirm={(val) => {
-                setStartTime(val);
-                form.setFieldValue('startTime', `${val.getHours().toString().padStart(2, '0')}:${val.getMinutes().toString().padStart(2, '0')}`);
-                setShowStartTimePicker(false);
-              }}
+      <div className={style.formBg}>
+        <div className={style.basicSection}>
+          <div className={style.formItem}>
+            <div className={style.formLabel}>任务名称</div>
+            <Input
+              placeholder="请输入任务名称"
+              value={formData.name}
+              onChange={e => handleUpdateFormData({ name: e.target.value })}
+              className={style.input}
            />
-
-            <DatePicker
-              visible={showEndTimePicker}
-              title="选择结束时间"
-              precision="minute"
-              value={endTime}
-              onClose={() => setShowEndTimePicker(false)}
-              onConfirm={(val) => {
-                setEndTime(val);
-                form.setFieldValue('endTime', `${val.getHours().toString().padStart(2, '0')}:${val.getMinutes().toString().padStart(2, '0')}`);
-                setShowEndTimePicker(false);
-              }}
-            />
-
-            <Form.Item
-              name="maxImportsPerDay"
-              label="每日最大导入数"
-              rules={[{ required: true, message: "请设置每日最大导入数" }]}
-            >
-              <Stepper min={1} max={10000} />
-            </Form.Item>
-
-            <Form.Item
-              name="importInterval"
-              label="导入间隔（分钟）"
-              rules={[{ required: true, message: "请设置导入间隔" }]}
-            >
-              <Stepper min={1} max={1440} />
-            </Form.Item>
-          </Card>
-
-          {/* 操作按钮 */}
-          <div className={style.actions}>
-            <Space direction="vertical" style={{ width: "100%" }}>
-              <Button
-                color="primary"
-                size="large"
-                block
-                loading={loading}
-                onClick={handleSubmit}
-              >
-                {isEdit ? "更新任务" : "创建任务"}
-              </Button>
-              <Button
-                size="large"
-                block
-                onClick={handleReset}
-              >
-                重置
-              </Button>
-            </Space>
+            <div className={style.counterTip}>为此导入任务设置一个名称</div>
          </div>
-        </Form>
+
+          <div className={style.formItem}>
+            <div className={style.formLabel}>设备选择</div>
+            <DeviceSelection
+              selectedOptions={formData.deviceGroupsOptions}
+              onSelect={handleDeviceSelect}
+              placeholder="请选择设备"
+              className={style.deviceSelection}
+            />
+            <div className={style.counterTip}>选择要分配联系人的设备</div>
+          </div>
+
+          <div className={style.formItem}>
+            <div className={style.formLabel}>分配数量</div>
+            <div className={style.stepperContainer}>
+              <Button
+                icon={<MinusOutlined />}
+                onClick={() =>
+                  handleUpdateFormData({ num: Math.max(1, formData.num - 1) })
+                }
+                disabled={formData.num <= 1}
+                className={style.stepperButton}
+              />
+              <Input
+                value={formData.num}
+                onChange={e => {
+                  const value = parseInt(e.target.value) || 1;
+                  handleUpdateFormData({
+                    num: Math.min(1000, Math.max(1, value)),
+                  });
+                }}
+                className={style.stepperInput}
+              />
+              <Button
+                icon={<PlusOutlined />}
+                onClick={() =>
+                  handleUpdateFormData({
+                    num: Math.min(1000, formData.num + 1),
+                  })
+                }
+                disabled={formData.num >= 1000}
+                className={style.stepperButton}
+              />
+            </div>
+            <div className={style.counterTip}>要分配给设备的联系人数量</div>
+          </div>
+
+          <div className={style.formItem}>
+            <div className={style.formLabel}>清除现有联系人</div>
+            <Switch
+              checked={formData.clearContact === 1}
+              onChange={checked =>
+                handleUpdateFormData({ clearContact: checked ? 1 : 0 })
+              }
+            />
+            <div className={style.counterTip}>是否清除设备上现有的联系人</div>
+          </div>
+
+          <div className={style.formItem}>
+            <div className={style.formLabel}>备注类型</div>
+            <Select
+              placeholder="请选择备注类型"
+              value={formData.remarkType}
+              onChange={value => handleUpdateFormData({ remarkType: value })}
+              className={style.select}
+            >
+              <Select.Option value={0}>不备注</Select.Option>
+              <Select.Option value={1}>年月日</Select.Option>
+              <Select.Option value={2}>月日</Select.Option>
+              <Select.Option value={3}>自定义</Select.Option>
+            </Select>
+            <div className={style.counterTip}>选择联系人备注的格式</div>
+          </div>
+
+          {formData.remarkType === 3 && (
+            <div className={style.formItem}>
+              <div className={style.formLabel}>自定义备注</div>
+              <Input
+                placeholder="请输入备注内容"
+                value={formData.remark}
+                onChange={e => handleUpdateFormData({ remark: e.target.value })}
+                className={style.input}
+              />
+              <div className={style.counterTip}>输入自定义的备注内容</div>
+            </div>
+          )}
+
+          <div className={style.formItem}>
+            <div className={style.formLabel}>开始时间</div>
+            <TimePicker
+              value={formData.startTime}
+              onChange={time =>
+                handleUpdateFormData({
+                  startTime: time,
+                })
+              }
+              format="HH:mm"
+              placeholder="请选择开始时间"
+              className={style.timePicker}
+            />
+            <div className={style.counterTip}>设置每天开始导入的时间</div>
+          </div>
+
+          <div className={style.formItem}>
+            <div className={style.formLabel}>结束时间</div>
+            <TimePicker
+              value={formData.endTime}
+              onChange={time =>
+                handleUpdateFormData({
+                  endTime: time,
+                })
+              }
+              format="HH:mm"
+              placeholder="请选择结束时间"
+              className={style.timePicker}
+            />
+            <div className={style.counterTip}>设置每天结束导入的时间</div>
+          </div>
+
+          <div
+            className={style.formItem}
+            style={{ display: "flex", justifyContent: "space-between" }}
+          >
+            <span>是否启用</span>
+            <Switch
+              checked={formData.status === 1}
+              onChange={check =>
+                handleUpdateFormData({ status: check ? 1 : 0 })
+              }
+            />
+          </div>
+        </div>
      </div>
    </Layout>
  );
 };

-export default ContactImportForm;
+export default ContactImportForm;
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/list/api.ts
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/list/api.ts
@@ -11,22 +11,28 @@ import {
 // 获取通讯录导入任务列表
 export function fetchContactImportTasks(
  params = { type: 6, page: 1, limit: 10 },
-): Promise<{ code: number; msg: string; data: { list: ContactImportTask[] } }> {
+) {
  return request("/v1/workbench/list", params, "GET");
 }

 // 获取单个任务详情
-export function fetchContactImportTaskDetail(id: number): Promise<ContactImportTask | null> {
+export function fetchContactImportTaskDetail(
+  id: number,
+): Promise<ContactImportTask | null> {
  return request("/v1/workbench/detail", { id }, "GET");
 }

 // 创建通讯录导入任务
-export function createContactImportTask(data: CreateContactImportTaskData): Promise<any> {
+export function createContactImportTask(
+  data: CreateContactImportTaskData,
+): Promise<any> {
  return request("/v1/workbench/create", { ...data, type: 6 }, "POST");
 }

 // 更新通讯录导入任务
-export function updateContactImportTask(data: UpdateContactImportTaskData): Promise<any> {
+export function updateContactImportTask(
+  data: UpdateContactImportTaskData,
+): Promise<any> {
  return request("/v1/workbench/update", { ...data, type: 6 }, "POST");
 }

@@ -36,7 +42,10 @@ export function deleteContactImportTask(id: number): Promise<any> {
 }

 // 切换任务状态
-export function toggleContactImportTask(data: { id: number; status: number }): Promise<any> {
+export function toggleContactImportTask(data: {
+  id: number;
+  status: number;
+}): Promise<any> {
  return request("/v1/workbench/update-status", { ...data }, "POST");
 }

@@ -52,12 +61,16 @@ export function fetchImportRecords(
  limit: number = 20,
  keyword?: string,
 ): Promise<PaginatedResponse<ContactImportRecord>> {
-  return request("/v1/workbench/import-records", {
-    workbenchId,
-    page,
-    limit,
-    keyword,
-  }, "GET");
+  return request(
+    "/v1/workbench/import-records",
+    {
+      workbenchId,
+      page,
+      limit,
+      keyword,
+    },
+    "GET",
+  );
 }

 // 获取统计数据
@@ -81,4 +94,4 @@ export function batchOperateTasks(data: {
  operation: "start" | "stop" | "delete";
 }): Promise<any> {
  return request("/v1/workbench/batch-operate", data, "POST");
-}
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/list/data.ts
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/list/data.ts
@@ -88,7 +88,8 @@ export interface CreateContactImportTaskData {
 }

 // 更新通讯录导入任务数据
-export interface UpdateContactImportTaskData extends CreateContactImportTaskData {
+export interface UpdateContactImportTaskData
+  extends CreateContactImportTaskData {
  id: number;
 }

@@ -127,4 +128,4 @@ export interface ImportStats {
  todayImports: number;
  totalImports: number;
  successRate: number;
-}
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/list/index.module.scss
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/list/index.module.scss
@@ -1,7 +1,5 @@
 .container {
-  padding: 12px;
-  background-color: #f5f5f5;
-  min-height: 100vh;
+  padding: 0 14px;
 }

 .toolbar {
@@ -17,15 +15,15 @@

 .searchBox {
  flex: 1;
-  
+
  :global(.ant-input-affix-wrapper) {
    border-radius: 6px;
    border: 1px solid #d9d9d9;
-    
+
    &:hover {
      border-color: #40a9ff;
    }
-    
+
    &:focus-within {
      border-color: #1890ff;
      box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
@@ -36,7 +34,7 @@
 .actions {
  display: flex;
  gap: 8px;
-  
+
  :global(.adm-button) {
    border-radius: 6px;
  }
@@ -87,12 +85,12 @@
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: all 0.2s ease;
-  
+
  &:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  }
-  
+
  :global(.adm-card-body) {
    padding: 16px;
  }
@@ -133,7 +131,7 @@
 .menuButton {
  padding: 4px 8px;
  color: #666;
-  
+
  &:hover {
    color: #1890ff;
    background-color: #f0f8ff;
@@ -162,14 +160,14 @@
  color: #333;
  cursor: pointer;
  transition: background-color 0.2s;
-  
+
  &:hover {
    background-color: #f5f5f5;
  }
-  
+
  &:last-child {
    color: #ff4d4f;
-    
+
    &:hover {
      background-color: #fff2f0;
    }
@@ -185,7 +183,7 @@
  align-items: center;
  margin-bottom: 8px;
  font-size: 14px;
-  
+
  &:last-child {
    margin-bottom: 0;
  }
@@ -209,7 +207,7 @@
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid #f0f0f0;
-  
+
  :global(.adm-button) {
    flex: 1;
    border-radius: 6px;
@@ -219,29 +217,25 @@

 // 响应式设计
@media (max-width: 480px) {
-  .container {
-    padding: 8px;
-  }
-  
  .toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
-  
+
  .actions {
    justify-content: space-between;
  }
-  
+
  .taskName {
    font-size: 15px;
  }
-  
+
  .taskDetail {
    font-size: 13px;
  }
-  
+
  .label {
    min-width: 60px;
  }
-}
+}
--- a/Cunkebao/src/pages/mobile/workspace/contact-import/list/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/contact-import/list/index.tsx
@@ -97,7 +97,7 @@ const ContactImport: React.FC = () => {
    setLoading(true);
    try {
      const response = await fetchContactImportTasks();
-      const data = response.list || [];
+      const data = response?.list || [];
      setTasks(data);
      setFilteredTasks(data);
    } catch (error) {
@@ -117,10 +117,12 @@ const ContactImport: React.FC = () => {
      setFilteredTasks(tasks);
    } else {
      const filtered = tasks.filter(
-        (task) =>
+        task =>
          task.name.toLowerCase().includes(keyword.toLowerCase()) ||
-          (task.config?.remark || '').toLowerCase().includes(keyword.toLowerCase()) ||
-          task.creatorName.toLowerCase().includes(keyword.toLowerCase())
+          (task.config?.remark || "")
+            .toLowerCase()
+            .includes(keyword.toLowerCase()) ||
+          task.creatorName.toLowerCase().includes(keyword.toLowerCase()),
      );
      setFilteredTasks(filtered);
    }
@@ -212,51 +214,45 @@ const ContactImport: React.FC = () => {
  return (
    <Layout
      header={
-        <NavCommon
-          left={
-            <Button
-              fill="none"
-              size="small"
-              onClick={() => navigate("/workspace")}
-            >
-              返回
-            </Button>
-          }
-          title="通讯录导入"
-        />
-      }
-    >
-      <div className={style.container}>
-        {/* 搜索和操作栏 */}
-        <div className={style.toolbar}>
-          <div className={style.searchBox}>
-            <Input
-              placeholder="搜索任务名称或备注类型"
-              prefix={<SearchOutlined />}
-              value={searchKeyword}
-              onChange={(e) => handleSearch(e.target.value)}
-              allowClear
-            />
-          </div>
-          <div className={style.actions}>
+        <>
+          <NavCommon
+            backFn={() => navigate("/workspace")}
+            title="通讯录导入"
+            right={
+              <Button
+                size="small"
+                color="primary"
+                onClick={() => navigate("/workspace/contact-import/form")}
+              >
+                <PlusOutlined /> 新建
+              </Button>
+            }
+          />
+          {/* 搜索栏 */}
+          <div className="search-bar">
+            <div className="search-input-wrapper">
+              <Input
+                placeholder="搜索计划名称"
+                value={searchKeyword}
+                onChange={e => setSearchKeyword(e.target.value)}
+                prefix={<SearchOutlined />}
+                allowClear
+                size="large"
+              />
+            </div>
            <Button
              size="small"
-              fill="none"
-              onClick={loadTasks}
+              onClick={() => handleSearch(searchKeyword)}
              loading={loading}
+              className="refresh-btn"
            >
              <ReloadOutlined />
            </Button>
-            <Button
-              color="primary"
-              size="small"
-              onClick={() => navigate("/workspace/contact-import/form")}
-            >
-              <PlusOutlined /> 新建
-            </Button>
          </div>
-        </div>
-
+        </>
+      }
+    >
+      <div className={style.container}>
        {/* 任务列表 */}
        <div className={style.taskList}>
          {loading ? (
@@ -280,7 +276,7 @@ const ContactImport: React.FC = () => {
              )}
            </div>
          ) : (
-            filteredTasks.map((task) => (
+            filteredTasks.map(task => (
              <Card key={task.id} className={style.taskCard}>
                <div className={style.cardHeader}>
                  <div className={style.taskInfo}>
@@ -302,11 +298,15 @@ const ContactImport: React.FC = () => {
                <div className={style.cardContent}>
                  <div className={style.taskDetail}>
                    <span className={style.label}>备注类型:</span>
-                    <span className={style.value}>{task.config?.remarkType === 1 ? '自定义备注' : '其他'}</span>
+                    <span className={style.value}>
+                      {task.config?.remarkType === 1 ? "自定义备注" : "其他"}
+                    </span>
                  </div>
                  <div className={style.taskDetail}>
                    <span className={style.label}>设备数量:</span>
-                    <span className={style.value}>{task.config?.devices?.length || 0}</span>
+                    <span className={style.value}>
+                      {task.config?.devices?.length || 0}
+                    </span>
                  </div>
                  <div className={style.taskDetail}>
                    <span className={style.label}>导入数量:</span>
--- a/Cunkebao/src/pages/mobile/workspace/moments-sync/new/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/moments-sync/new/index.tsx
@@ -33,7 +33,7 @@ const defaultForm = {
  syncType: 1, // 1=业务号 2=人设号
  accountType: "business" as "business" | "personal", // 仅UI用
  enabled: true,
-  deveiceGroups: [] as any[],
+  deviceGroups: [] as any[],
  contentGroups: [] as any[], // 存完整内容库对象数组
  contentTypes: ["text", "image", "video"],
  targetTags: [] as string[],
@@ -47,7 +47,7 @@ const NewMomentsSync: React.FC = () => {
  const [currentStep, setCurrentStep] = useState(0);
  const [loading, setLoading] = useState(false);
  const [formData, setFormData] = useState({ ...defaultForm });
-  const [deveiceGroupsOptions, setSelectedDevicesOptions] = useState<
+  const [deviceGroupsOptions, setSelectedDevicesOptions] = useState<
    DeviceSelectionItem[]
  >([]);
  const [contentGroupsOptions, setContentGroupsOptions] = useState<
@@ -70,14 +70,14 @@ const NewMomentsSync: React.FC = () => {
          syncType: res.accountType === 1 ? 1 : 2,
          accountType: res.accountType === 1 ? "business" : "personal",
          enabled: res.status === 1,
-          deveiceGroups: res.config?.deveiceGroups || [],
+          deviceGroups: res.config?.deviceGroups || [],
          // 关键：用id字符串数组回填
          contentGroups: res.config?.contentGroups || [], // 直接用对象数组
          contentTypes: res.config?.contentTypes || ["text", "image", "video"],
          targetTags: res.config?.targetTags || [],
          filterKeywords: res.config?.filterKeywords || [],
        });
-        setSelectedDevicesOptions(res.config?.deveiceGroupsOptions || []);
+        setSelectedDevicesOptions(res.config?.deviceGroupsOptions || []);
        setContentGroupsOptions(res.config?.contentGroupsOptions || []);
      }
    } catch {
@@ -110,7 +110,7 @@ const NewMomentsSync: React.FC = () => {
  };
  const handleDevicesChange = (devices: DeviceSelectionItem[]) => {
    setSelectedDevicesOptions(devices);
-    updateForm({ deveiceGroups: devices.map(d => d.id) });
+    updateForm({ deviceGroups: devices.map(d => d.id) });
  };
  const handleContentChange = (libs: ContentItem[]) => {
    setContentGroupsOptions(libs);
@@ -122,7 +122,7 @@ const NewMomentsSync: React.FC = () => {
      message.error("请输入任务名称");
      return;
    }
-    if (formData.deveiceGroups.length === 0) {
+    if (formData.deviceGroups.length === 0) {
      message.error("请选择设备");
      return;
    }
@@ -134,7 +134,7 @@ const NewMomentsSync: React.FC = () => {
    try {
      const params = {
        name: formData.taskName,
-        deveiceGroups: formData.deveiceGroups,
+        deviceGroups: formData.deviceGroups,
        contentGroups: formData.contentGroups.map((lib: any) => lib.id),
        syncInterval: formData.syncInterval,
        syncCount: formData.syncCount,
@@ -260,7 +260,7 @@ const NewMomentsSync: React.FC = () => {
          <div className={style.formItem}>
            <div className={style.formLabel}>选择设备</div>
            <DeviceSelection
-              selectedOptions={deveiceGroupsOptions}
+              selectedOptions={deviceGroupsOptions}
              onSelect={handleDevicesChange}
              placeholder="请选择设备"
              showSelectedList={true}
--- a/Cunkebao/src/pages/mobile/workspace/traffic-distribution/list/components/DeviceListModal.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/traffic-distribution/list/components/DeviceListModal.tsx
@@ -38,7 +38,7 @@ const DeviceListModal: React.FC<DeviceListModalProps> = ({
    setLoading(true);
    try {
      const detailRes = await fetchDistributionRuleDetail(ruleId);
-      const deviceData = detailRes?.config?.deveiceGroupsOptions || [];
+      const deviceData = detailRes?.config?.deviceGroupsOptions || [];
      setDevices(deviceData);
    } catch (error) {
      console.error("获取设备详情失败:", error);