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

新建内容库构建完成

nkebao/src/pages/content/NewContent.tsx

@@ -2,15 +2,16 @@ import React, { useState, useEffect } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import Layout from '@/components/Layout';
 import UnifiedHeader from '@/components/UnifiedHeader';
-import BottomNav from '@/components/BottomNav';
 import { Input } from '@/components/ui/input';
 import { Textarea } from '@/components/ui/textarea';
 import { Switch } from '@/components/ui/switch';
-import { Button } from '@/components/ui/button';
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/tabs';
 import { Card } from '@/components/ui/card';
-import { Collapse, CollapsePanel } from 'tdesign-mobile-react';
+import { Collapse, CollapsePanel ,Button} from 'tdesign-mobile-react';
 import { toast } from '@/components/ui/toast';
+import FriendSelection from '@/components/FriendSelection';
+import GroupSelection from '@/components/GroupSelection';
+import { post } from '@/api/request';
 // TODO: 引入微信好友/群组选择器、日期选择器等组件
 
 interface WechatFriend { id: string; nickname: string; avatar: string; }
@@ -45,6 +46,8 @@ export default function NewContentLibraryPage() {
     aiPrompt: '',
     enabled: true,
   });
+  const [selectedFriendObjs, setSelectedFriendObjs] = useState<WechatFriend[]>([]);
+  const [selectedGroupObjs, setSelectedGroupObjs] = useState<WechatGroup[]>([]);
   const [isFriendSelectorOpen, setIsFriendSelectorOpen] = useState(false);
   const [isGroupSelectorOpen, setIsGroupSelectorOpen] = useState(false);
   const [isSubmitting, setIsSubmitting] = useState(false);
@@ -54,7 +57,22 @@ export default function NewContentLibraryPage() {
   const handleSave = async () => {
     setIsSubmitting(true);
     try {
-      await new Promise((resolve) => setTimeout(resolve, 500));
+      // 组装提交参数
+      const payload = {
+        name: form.name,
+        sourceType: form.sourceType === 'friends' ? 1 : 2,
+        friends: form.selectedFriends.map(f => Number(f.id)),
+        groups: form.selectedGroups.map(g => Number(g.id)),
+        groupMembers: {},
+        keywordInclude: form.keywordsInclude ? form.keywordsInclude.split(',').map(s => s.trim()).filter(Boolean) : [],
+        keywordExclude: form.keywordsExclude ? form.keywordsExclude.split(',').map(s => s.trim()).filter(Boolean) : [],
+        aiPrompt: form.aiPrompt,
+        timeEnabled: form.startDate || form.endDate ? 1 : 0,
+        startTime: form.startDate || '',
+        endTime: form.endDate || '',
+        status: form.enabled ? 1 : 0
+      };
+      await post('/v1/content/library/create', payload);
       toast({ title: '创建成功', description: '内容库已保存' });
       navigate('/content');
     } catch (error) {
@@ -67,7 +85,13 @@ export default function NewContentLibraryPage() {
   return (
     <Layout
       header={<UnifiedHeader title="新建内容库" showBack onBack={() => navigate(-1)} />}
-      footer={<BottomNav />}
+      footer={
+      <div className="p-4">
+        <Button  theme="primary" block onClick={handleSave} disabled={isSubmitting || !form.name} >
+          {isSubmitting ? '创建中...' : '创建内容库'}
+        </Button>
+      </div>
+      }
     >
       <div className="flex-1 bg-gray-50 min-h-screen pb-16">
         <div className="p-4 space-y-4 max-w-lg mx-auto">
@@ -90,28 +114,84 @@ export default function NewContentLibraryPage() {
                     <TabsTrigger value="groups">选择聊天群</TabsTrigger>
                   </TabsList>
                   <TabsContent value="friends">
-                    <Button variant="outline" className="w-full" onClick={() => setIsFriendSelectorOpen(true)}>
-                      选择微信好友
-                    </Button>
-                    {form.selectedFriends.length > 0 && (
+                    <FriendSelection
+                      selectedFriends={form.selectedFriends.map(f => f.id)}
+                      onSelect={ids => setForm(f => ({
+                        ...f,
+                        selectedFriends: ids.map(id => ({ id, nickname: id, avatar: '' }))
+                      }))}
+                      onSelectDetail={setSelectedFriendObjs}
+                      enableDeviceFilter={false}
+                      placeholder="选择微信好友"
+                    />
+                    {selectedFriendObjs.length > 0 && (
                       <div className="mt-2 space-y-2">
-                        {form.selectedFriends.map(friend => (
+                        {selectedFriendObjs.map(friend => (
                           <div key={friend.id} className="flex items-center justify-between bg-gray-100 p-2 rounded-md">
-                            <span>{friend.nickname}</span>
+                            <div className="flex items-center gap-2">
+                              {friend.avatar ? (
+                                <img src={friend.avatar} alt={friend.nickname} className="w-8 h-8 rounded-full object-cover" />
+                              ) : (
+                                <div className="w-8 h-8 rounded-full bg-gray-300 flex items-center justify-center text-white text-sm">{friend.nickname?.charAt(0) || '友'}</div>
+                              )}
+                              <span>{friend.nickname}</span>
+                            </div>
+                            <button
+                              className="text-gray-400 hover:text-red-500 ml-2"
+                              onClick={() => {
+                                setForm(f => ({
+                                  ...f,
+                                  selectedFriends: f.selectedFriends.filter(frd => frd.id !== friend.id)
+                                }));
+                                setSelectedFriendObjs(objs => objs.filter(frd => frd.id !== friend.id));
+                              }}
+                              title="移除"
+                            >
+                              ×
+                            </button>
                           </div>
                         ))}
                       </div>
                     )}
                   </TabsContent>
                   <TabsContent value="groups">
-                    <Button variant="outline" className="w-full" onClick={() => setIsGroupSelectorOpen(true)}>
-                      选择聊天群
-                    </Button>
-                    {form.selectedGroups.length > 0 && (
+                    <GroupSelection
+                      selectedGroups={form.selectedGroups.map(g => g.id)}
+                      onSelect={ids => setForm(f => ({
+                        ...f,
+                        selectedGroups: ids.map(id => {
+                          const old = f.selectedGroups.find(g => g.id === id);
+                          return old || { id, name: id, avatar: '' };
+                        })
+                      }))}
+                      onSelectDetail={setSelectedGroupObjs}
+                      placeholder="选择群聊"
+                    />
+                    {selectedGroupObjs.length > 0 && (
                       <div className="mt-2 space-y-2">
-                        {form.selectedGroups.map(group => (
+                        {selectedGroupObjs.map(group => (
                           <div key={group.id} className="flex items-center justify-between bg-gray-100 p-2 rounded-md">
-                            <span>{group.name}</span>
+                            <div className="flex items-center gap-2">
+                              {group.avatar ? (
+                                <img src={group.avatar} alt={group.name} className="w-8 h-8 rounded-full object-cover" />
+                              ) : (
+                                <div className="w-8 h-8 rounded-full bg-gray-300 flex items-center justify-center text-white text-sm">{group.name?.charAt(0) || '群'}</div>
+                              )}
+                              <span>{group.name}</span>
+                            </div>
+                            <button
+                              className="text-gray-400 hover:text-red-500 ml-2"
+                              onClick={() => {
+                                setForm(f => ({
+                                  ...f,
+                                  selectedGroups: f.selectedGroups.filter(grp => grp.id !== group.id)
+                                }));
+                                setSelectedGroupObjs(objs => objs.filter(grp => grp.id !== group.id));
+                              }}
+                              title="移除"
+                            >
+                              ×
+                            </button>
                           </div>
                         ))}
                       </div>
@@ -187,11 +267,7 @@ export default function NewContentLibraryPage() {
                 <label className="block font-medium mb-1">是否启用</label>
                 <Switch checked={form.enabled} onCheckedChange={checked => setForm(f => ({ ...f, enabled: checked }))} />
               </div>
-              <div className="flex justify-end mt-4">
-                <Button onClick={handleSave} disabled={isSubmitting || !form.name}>
-                  {isSubmitting ? '创建中...' : '创建内容库'}
-                </Button>
-              </div>
+            
             </div>
           </Card>
         </div>