feat：样式构建完成

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

@@ -100,33 +100,34 @@ export default function MomentsSyncDetail() {
     );
   }
 
-  const header = (
-    <div 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={() => navigate('/workspace/moments-sync')}>
-            <ChevronLeft className="h-5 w-5" />
-          </Button>
-          <h1 className="text-lg font-medium">朋友圈同步任务详情</h1>
-        </div>
-        <div className="flex items-center space-x-2">
-          <Button variant="outline" size="sm" onClick={handleEdit}>
-            <Edit2 className="h-4 w-4 mr-2" />
-            编辑
-          </Button>
-          <Button variant="outline" size="sm" onClick={handleSync}>
-            <RefreshCw className="h-4 w-4 mr-2" />
-            立即同步
-          </Button>
-        </div>
-      </div>
-    </div>
-  );
-
   return (
-    <Layout header={header} footer={<BottomNav />}>
-      <div className="flex-1 bg-gray-50 min-h-screen pb-20">
-        <div className="p-4 max-w-4xl mx-auto space-y-6">
+    <Layout
+      header={
+        <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')}>
+                <ChevronLeft className="h-5 w-5" />
+              </Button>
+              <h1 className="text-lg font-medium">朋友圈同步任务详情</h1>
+            </div>
+            <div className="flex items-center space-x-2">
+              <Button variant="outline" size="sm" onClick={handleEdit}>
+                <Edit2 className="h-4 w-4 mr-2" />
+                编辑
+              </Button>
+              <Button variant="outline" size="sm" onClick={handleSync}>
+                <RefreshCw className="h-4 w-4 mr-2" />
+                立即同步
+              </Button>
+            </div>
+          </div>
+        </div>
+      }
+      footer={<BottomNav />}
+    >
+      <div className="bg-gray-50">
+        <div className="p-4 space-y-6">
           {/* 基本信息卡片 */}
           <Card className="p-6">
             <div className="flex items-center justify-between mb-6">

nkebao/src/pages/workspace/moments-sync/new.tsx

@@ -248,94 +248,97 @@ export default function NewMomentsSyncTask() {
     }
   };
 
-  const header = (
-    <div className="sticky top-0 z-10 bg-white">
-      <div className="flex items-center h-14 px-4">
-        <Button variant="ghost" size="icon" onClick={() => navigate(-1)} className="hover:bg-gray-50">
-          <ChevronLeft className="h-6 w-6" />
-        </Button>
-        <h1 className="ml-2 text-lg font-medium">新建朋友圈同步</h1>
-      </div>
-    </div>
-  );
-
   return (
-    <Layout header={header} footer={<BottomNav />}>
-      <div className="min-h-screen bg-[#F8F9FA] pb-20">
-        <div className="mt-8">
-          <StepIndicator currentStep={currentStep} />
+    <Layout
+      header={
+        <div className="bg-white border-b">
+          <div className="flex items-center p-4">
+            <Button variant="ghost" size="icon" onClick={() => navigate(-1)} className="hover:bg-gray-50 mr-2">
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="text-lg font-medium">新建朋友圈同步</h1>
+          </div>
+        </div>
+      }
+      footer={<BottomNav />}
+    >
+      <div className="bg-gray-50">
+        <div className="p-4 space-y-6">
+          <div className="mt-4">
+            <StepIndicator currentStep={currentStep} />
 
-          <div className="mt-8">
-            {currentStep === 1 && (
-              <BasicSettings formData={formData} onChange={handleUpdateFormData} onNext={handleNext} />
-            )}
+            <div className="mt-8">
+              {currentStep === 1 && (
+                <BasicSettings formData={formData} onChange={handleUpdateFormData} onNext={handleNext} />
+              )}
 
-            {currentStep === 2 && (
-              <div className="space-y-6 px-6">
-                <div className="relative">
-                  <Search className="absolute left-3 top-4 h-5 w-5 text-gray-400" />
-                  <Input
-                    placeholder="选择设备"
-                    className="h-12 pl-11 rounded-xl border-gray-200 text-base"
-                    onClick={() => {
-                      // TODO: 打开设备选择弹窗
-                      toast({ title: '设备选择功能开发中' });
-                    }}
-                    readOnly
-                  />
+              {currentStep === 2 && (
+                <div className="space-y-6">
+                  <div className="relative">
+                    <Search className="absolute left-3 top-4 h-5 w-5 text-gray-400" />
+                    <Input
+                      placeholder="选择设备"
+                      className="h-12 pl-11 rounded-xl border-gray-200 text-base"
+                      onClick={() => {
+                        // TODO: 打开设备选择弹窗
+                        toast({ title: '设备选择功能开发中' });
+                      }}
+                      readOnly
+                    />
+                  </div>
+
+                  {formData.selectedDevices.length > 0 && (
+                    <div className="text-base text-gray-500">已选设备：{formData.selectedDevices.length} 个</div>
+                  )}
+
+                  <div className="flex space-x-4 pt-4">
+                    <Button variant="outline" onClick={handlePrev} className="flex-1 h-12 rounded-xl text-base">
+                      上一步
+                    </Button>
+                    <Button
+                      onClick={handleNext}
+                      className="flex-1 h-12 bg-blue-600 hover:bg-blue-700 rounded-xl text-base shadow-sm"
+                    >
+                      下一步
+                    </Button>
+                  </div>
                 </div>
+              )}
 
-                {formData.selectedDevices.length > 0 && (
-                  <div className="text-base text-gray-500">已选设备：{formData.selectedDevices.length} 个</div>
-                )}
+              {currentStep === 3 && (
+                <div className="space-y-6">
+                  <div className="relative">
+                    <Search className="absolute left-3 top-4 h-5 w-5 text-gray-400" />
+                    <Input 
+                      placeholder="选择内容库" 
+                      className="h-12 pl-11 rounded-xl border-gray-200 text-base"
+                      onClick={() => {
+                        // TODO: 打开内容库选择弹窗
+                        toast({ title: '内容库选择功能开发中' });
+                      }}
+                      readOnly
+                    />
+                  </div>
 
-                <div className="flex space-x-4 pt-4">
-                  <Button variant="outline" onClick={handlePrev} className="flex-1 h-12 rounded-xl text-base">
-                    上一步
-                  </Button>
-                  <Button
-                    onClick={handleNext}
-                    className="flex-1 h-12 bg-blue-600 hover:bg-blue-700 rounded-xl text-base shadow-sm"
-                  >
-                    下一步
-                  </Button>
+                  {formData.selectedLibraries.length > 0 && (
+                    <div className="text-base text-gray-500">已选内容库：{formData.selectedLibraries.join(', ')}</div>
+                  )}
+
+                  <div className="flex space-x-4 pt-4">
+                    <Button variant="outline" onClick={handlePrev} className="flex-1 h-12 rounded-xl text-base">
+                      上一步
+                    </Button>
+                    <Button
+                      onClick={handleComplete}
+                      loading={loading}
+                      className="flex-1 h-12 bg-blue-600 hover:bg-blue-700 rounded-xl text-base shadow-sm"
+                    >
+                      {loading ? '创建中...' : '完成'}
+                    </Button>
+                  </div>
                 </div>
-              </div>
-            )}
-
-            {currentStep === 3 && (
-              <div className="space-y-6 px-6">
-                <div className="relative">
-                  <Search className="absolute left-3 top-4 h-5 w-5 text-gray-400" />
-                  <Input 
-                    placeholder="选择内容库" 
-                    className="h-12 pl-11 rounded-xl border-gray-200 text-base"
-                    onClick={() => {
-                      // TODO: 打开内容库选择弹窗
-                      toast({ title: '内容库选择功能开发中' });
-                    }}
-                    readOnly
-                  />
-                </div>
-
-                {formData.selectedLibraries.length > 0 && (
-                  <div className="text-base text-gray-500">已选内容库：{formData.selectedLibraries.join(', ')}</div>
-                )}
-
-                <div className="flex space-x-4 pt-4">
-                  <Button variant="outline" onClick={handlePrev} className="flex-1 h-12 rounded-xl text-base">
-                    上一步
-                  </Button>
-                  <Button
-                    onClick={handleComplete}
-                    loading={loading}
-                    className="flex-1 h-12 bg-blue-600 hover:bg-blue-700 rounded-xl text-base shadow-sm"
-                  >
-                    {loading ? '创建中...' : '完成'}
-                  </Button>
-                </div>
-              </div>
-            )}
+              )}
+            </div>
           </div>
         </div>
       </div>