feat: 本次提交更新内容如下

新版本样式完成

Cunkebao/src/pages/workspace/moments-sync/Detail.tsx

@@ -1,19 +1,26 @@
-import React, { useState, useEffect, useCallback } from 'react';
-import { useParams, useNavigate } from 'react-router-dom';
-import { Button } from '@/components/ui/button';
-import { Card } from '@/components/ui/card';
-import { Badge } from '@/components/ui/badge';
-import { Switch } from '@/components/ui/switch';
-import { useToast } from '@/components/ui/toast';
-import { 
-  fetchMomentsSyncTaskDetail, 
-  toggleMomentsSyncTask, 
-  syncMoments
-} from '@/api/momentsSync';
-import { MomentsSyncTask } from '@/types/moments-sync';
-import { ChevronLeft, Edit2, RefreshCw, Clock, Database, Smartphone } from 'lucide-react';
-import Layout from '@/components/Layout';
-import BottomNav from '@/components/BottomNav';
+import React, { useState, useEffect, useCallback } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import { Button } from "@/components/ui/button";
+import { Card } from "@/components/ui/card";
+import { Badge } from "@/components/ui/badge";
+import { Switch } from "@/components/ui/switch";
+import { useToast } from "@/components/ui/toast";
+import {
+  fetchMomentsSyncTaskDetail,
+  toggleMomentsSyncTask,
+  syncMoments,
+} from "@/api/momentsSync";
+import { MomentsSyncTask } from "@/types/moments-sync";
+import {
+  ChevronLeft,
+  Edit2,
+  RefreshCw,
+  Clock,
+  Database,
+  Smartphone,
+} from "lucide-react";
+import Layout from "@/components/Layout";
+import BottomNav from "@/components/BottomNav";
 
 export default function MomentsSyncDetail() {
   const { id } = useParams();
@@ -31,7 +38,7 @@ export default function MomentsSyncDetail() {
         setTask(taskData);
       }
     } catch (error) {
-      toast({ title: '获取任务详情失败', variant: 'destructive' });
+      toast({ title: "获取任务详情失败", variant: "destructive" });
     } finally {
       setLoading(false);
     }
@@ -49,9 +56,9 @@ export default function MomentsSyncDetail() {
       const newStatus = task.status === 1 ? 2 : 1;
       await toggleMomentsSyncTask(id, newStatus.toString());
       setTask({ ...task, status: newStatus });
-      toast({ title: newStatus === 1 ? '任务已开启' : '任务已暂停' });
+      toast({ title: newStatus === 1 ? "任务已开启" : "任务已暂停" });
     } catch (error) {
-      toast({ title: '操作失败', variant: 'destructive' });
+      toast({ title: "操作失败", variant: "destructive" });
     }
   };
 
@@ -59,10 +66,10 @@ export default function MomentsSyncDetail() {
     if (!id) return;
     try {
       await syncMoments(id);
-      toast({ title: '同步任务已启动' });
+      toast({ title: "同步任务已启动" });
       fetchTaskDetail(); // 刷新任务详情
     } catch (error) {
-      toast({ title: '同步失败', variant: 'destructive' });
+      toast({ title: "同步失败", variant: "destructive" });
     }
   };
 
@@ -91,7 +98,10 @@ export default function MomentsSyncDetail() {
         <div className="flex-1 bg-gray-50 min-h-screen flex items-center justify-center">
           <div className="text-center">
             <p className="text-gray-600">任务不存在</p>
-            <Button onClick={() => navigate('/workspace/moments-sync')} className="mt-4">
+            <Button
+              onClick={() => navigate("/workspace/moments-sync")}
+              className="mt-4"
+            >
               返回列表
             </Button>
           </div>
@@ -106,7 +116,11 @@ export default function MomentsSyncDetail() {
         <div className="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={() => navigate('/workspace/moments-sync')}>
+              <Button
+                variant="ghost"
+                size="icon"
+                onClick={() => navigate("/workspace/moments-sync")}
+              >
                 <ChevronLeft className="h-5 w-5" />
               </Button>
               <h1 className="text-lg font-medium">朋友圈同步任务详情</h1>
@@ -116,10 +130,10 @@ export default function MomentsSyncDetail() {
                 <Edit2 className="h-4 w-4 mr-2" />
                 编辑
               </Button>
-              <Button variant="outline" size="sm" onClick={handleSync}>
+              {/* <Button variant="outline" size="sm" onClick={handleSync}>
                 <RefreshCw className="h-4 w-4 mr-2" />
                 立即同步
-              </Button>
+              </Button> */}
             </div>
           </div>
         </div>
@@ -137,7 +151,10 @@ export default function MomentsSyncDetail() {
                   {task.status === 1 ? "进行中" : "已暂停"}
                 </Badge>
               </div>
-              <Switch checked={task.status === 1} onCheckedChange={handleToggleStatus} />
+              <Switch
+                checked={task.status === 1}
+                onCheckedChange={handleToggleStatus}
+              />
             </div>
 
             <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
@@ -154,7 +171,9 @@ export default function MomentsSyncDetail() {
                   </div>
                   <div className="flex items-center justify-between">
                     <span className="text-gray-600">内容库</span>
-                    <span className="font-medium">{task.contentLib || '未设置'}</span>
+                    <span className="font-medium">
+                      {task.contentLib || "未设置"}
+                    </span>
                   </div>
                   <div className="flex items-center justify-between">
                     <span className="text-gray-600">已同步</span>
@@ -180,11 +199,15 @@ export default function MomentsSyncDetail() {
                   </div>
                   <div className="flex items-center justify-between">
                     <span className="text-gray-600">上次同步</span>
-                    <span className="font-medium">{task.lastSyncTime || '暂无'}</span>
+                    <span className="font-medium">
+                      {task.lastSyncTime || "暂无"}
+                    </span>
                   </div>
                   <div className="flex items-center justify-between">
                     <span className="text-gray-600">更新时间</span>
-                    <span className="font-medium">{task.updateTime || '暂无'}</span>
+                    <span className="font-medium">
+                      {task.updateTime || "暂无"}
+                    </span>
                   </div>
                 </div>
               </div>
@@ -203,35 +226,51 @@ export default function MomentsSyncDetail() {
                   <span className="text-gray-600">同步间隔</span>
                   <span className="font-medium">{task.syncInterval} 秒</span>
                 </div>
-                                  <div className="flex items-center justify-between">
-                    <span className="text-gray-600">每日最大</span>
-                    <span className="font-medium">{task.maxSyncPerDay || 100} 条</span>
-                  </div>
+                <div className="flex items-center justify-between">
+                  <span className="text-gray-600">每日最大</span>
+                  <span className="font-medium">
+                    {task.maxSyncPerDay || 100} 条
+                  </span>
+                </div>
                 <div className="flex items-center justify-between">
                   <span className="text-gray-600">时间范围</span>
-                  <span className="font-medium">{task.timeRange.start} - {task.timeRange.end}</span>
+                  <span className="font-medium">
+                    {task.timeRange?.start && task.timeRange?.end
+                      ? `${task.timeRange.start} - ${task.timeRange.end}`
+                      : "未设置"}
+                  </span>
                 </div>
                 <div className="flex items-center justify-between">
                   <span className="text-gray-600">同步模式</span>
-                  <span className="font-medium">{task.syncMode === 'auto' ? '自动' : '手动'}</span>
+                  <span className="font-medium">
+                    {task.syncMode === "auto" ? "自动" : "手动"}
+                  </span>
                 </div>
               </div>
               <div className="space-y-3 text-sm">
-                                  <div className="flex items-center justify-between">
-                    <span className="text-gray-600">今日同步</span>
-                    <span className="font-medium">{task.todaySyncCount || 0} 条</span>
-                  </div>
-                  <div className="flex items-center justify-between">
-                    <span className="text-gray-600">总同步数</span>
-                    <span className="font-medium">{task.totalSyncCount || task.syncCount || 0} 条</span>
-                  </div>
+                <div className="flex items-center justify-between">
+                  <span className="text-gray-600">今日同步</span>
+                  <span className="font-medium">
+                    {task.todaySyncCount || 0} 条
+                  </span>
+                </div>
+                <div className="flex items-center justify-between">
+                  <span className="text-gray-600">总同步数</span>
+                  <span className="font-medium">
+                    {task.totalSyncCount || task.syncCount || 0} 条
+                  </span>
+                </div>
                 <div className="flex items-center justify-between">
                   <span className="text-gray-600">目标标签</span>
-                  <span className="font-medium">{task.targetTags.length} 个</span>
+                  <span className="font-medium">
+                    {task.targetTags?.length || 0} 个
+                  </span>
                 </div>
                 <div className="flex items-center justify-between">
                   <span className="text-gray-600">内容类型</span>
-                  <span className="font-medium">{task.contentTypes.join(', ')}</span>
+                  <span className="font-medium">
+                    {task.contentTypes?.join(", ") || "未设置"}
+                  </span>
                 </div>
               </div>
             </div>
@@ -242,11 +281,13 @@ export default function MomentsSyncDetail() {
             <h3 className="text-lg font-semibold mb-4">最近同步记录</h3>
             <div className="text-center py-8">
               <p className="text-gray-500">暂无同步记录</p>
-              <p className="text-sm text-gray-400 mt-2">任务开始执行后将显示同步记录</p>
+              <p className="text-sm text-gray-400 mt-2">
+                任务开始执行后将显示同步记录
+              </p>
             </div>
           </Card>
         </div>
       </div>
     </Layout>
   );
-} 
+}

Cunkebao/src/types/moments-sync.ts

@@ -26,17 +26,17 @@ export interface MomentsSyncTask {
   creatorName: string;
   syncInterval: number;
   maxSyncPerDay: number;
-  timeRange: { start: string; end: string };
-  contentTypes: ContentType[];
-  targetTags: string[];
+  timeRange?: { start: string; end: string };
+  contentTypes?: ContentType[];
+  targetTags?: string[];
   syncMode: SyncMode;
-  filterKeywords: string[];
+  filterKeywords?: string[];
   contentLib?: string;
-  devices: string[];
-  friends: string[];
-  todaySyncCount: number;
-  totalSyncCount: number;
-  updateTime: string;
+  devices?: string[];
+  friends?: string[];
+  todaySyncCount?: number;
+  totalSyncCount?: number;
+  updateTime?: string;
   config?: MomentsSyncConfig;
 }