【操盘手】 内容库 - 修复选择好友或群直接渲染数据的BUG

Cunkebao/app/content/new/page.tsx

@@ -207,9 +207,9 @@ export default function NewContentLibraryPage() {
                             >
                               <Users className="h-4 w-4" />
                             </Button>
-                            <Button variant="ghost" size="sm" onClick={() => removeGroup(group.id)}>
-                              <X className="h-4 w-4" />
-                            </Button>
+                          <Button variant="ghost" size="sm" onClick={() => removeGroup(group.id)}>
+                            <X className="h-4 w-4" />
+                          </Button>
                           </div>
                         </div>
                       ))}

Cunkebao/components/WechatFriendSelector.tsx

@@ -48,13 +48,15 @@ export function WechatFriendSelector({ open, onOpenChange, selectedFriends, onSe
   const [page, setPage] = useState(1)
   const [totalPages, setTotalPages] = useState(1)
   const [totalItems, setTotalItems] = useState(0)
+  const [tempSelectedFriends, setTempSelectedFriends] = useState<WechatFriend[]>([])
   const pageSize = 20
 
   useEffect(() => {
     if (open) {
       fetchFriends(1)
+      setTempSelectedFriends([...selectedFriends])
     }
-  }, [open])
+  }, [open, selectedFriends])
 
   const fetchFriends = async (pageNum: number) => {
     setLoading(true)
@@ -145,12 +147,12 @@ export function WechatFriendSelector({ open, onOpenChange, selectedFriends, onSe
             friends.map((friend) => (
               <div key={friend.id} className="flex items-center space-x-3 p-2 hover:bg-gray-100 rounded-lg">
                 <Checkbox
-                  checked={selectedFriends.some((f) => f.id === friend.id)}
+                  checked={tempSelectedFriends.some((f) => f.id === friend.id)}
                   onCheckedChange={(checked) => {
                     if (checked) {
-                      onSelect([...selectedFriends, friend])
+                      setTempSelectedFriends([...tempSelectedFriends, friend])
                     } else {
-                      onSelect(selectedFriends.filter((f) => f.id !== friend.id))
+                      setTempSelectedFriends(tempSelectedFriends.filter((f) => f.id !== friend.id))
                     }
                   }}
                 />
@@ -204,7 +206,12 @@ export function WechatFriendSelector({ open, onOpenChange, selectedFriends, onSe
           <Button variant="outline" onClick={() => onOpenChange(false)}>
             取消
           </Button>
-          <Button onClick={() => onOpenChange(false)}>确定 ({selectedFriends.length})</Button>
+          <Button onClick={() => {
+            onSelect(tempSelectedFriends)
+            onOpenChange(false)
+          }}>
+            确定 ({tempSelectedFriends.length})
+          </Button>
         </div>
       </DialogContent>
     </Dialog>

Cunkebao/components/WechatGroupMemberSelector.tsx

@@ -43,13 +43,15 @@ export function WechatGroupMemberSelector({
   const [page, setPage] = useState(1)
   const [totalPages, setTotalPages] = useState(1)
   const [totalItems, setTotalItems] = useState(0)
+  const [tempSelectedMembers, setTempSelectedMembers] = useState<WechatGroupMember[]>([])
   const pageSize = 20
 
   useEffect(() => {
     if (open && groupId) {
       fetchGroupMembers(1)
+      setTempSelectedMembers([...selectedMembers])
     }
-  }, [open, groupId])
+  }, [open, groupId, selectedMembers])
 
   const fetchGroupMembers = async (pageNum: number) => {
     setLoading(true)
@@ -64,14 +66,26 @@ export function WechatGroupMemberSelector({
       const response = await api.get<ApiResponse<GroupMemberListResponse>>(`/v1/chatroom/getMemberList?${queryParams.toString()}`)
       
       if (response.code === 200 && response.data) {
-        const membersList = response.data.list.map((item: any) => ({
-          id: item.id || `member-${Math.random()}`,
-          nickname: item.nickname || '未知成员',
-          wechatId: item.identifier || '',
-          avatar: item.avatar || '/placeholder.svg',
-          role: item.isOwner ? 'owner' : (item.isAdmin ? 'admin' : 'member'),
-          joinTime: item.createTime ? new Date(item.createTime * 1000).toLocaleString() : '--'
-        }))
+        const membersList = response.data.list.map((item: any) => {
+          // 确定角色类型
+          let role: "owner" | "admin" | "member" | undefined;
+          if (item.isOwner) {
+            role = "owner";
+          } else if (item.isAdmin) {
+            role = "admin";
+          } else {
+            role = "member";
+          }
+          
+          return {
+            id: item.id || `member-${Math.random()}`,
+            nickname: item.name || item.ownerNickname || '未知成员',
+            wechatId: item.ownerWechatId || item.identifier || '',
+            avatar: item.ownerAvatar || item.avatar || '/placeholder.svg',
+            role: role,
+            joinTime: item.createTime ? new Date(item.createTime * 1000).toLocaleString() : '--'
+          };
+        });
         
         setMembers(membersList)
         setTotalItems(response.data.total)
@@ -139,12 +153,12 @@ export function WechatGroupMemberSelector({
             members.map((member) => (
               <div key={member.id} className="flex items-center space-x-3 p-2 hover:bg-gray-100 rounded-lg">
                 <Checkbox
-                  checked={selectedMembers.some((m) => m.id === member.id)}
+                  checked={tempSelectedMembers.some((m) => m.id === member.id)}
                   onCheckedChange={(checked) => {
                     if (checked) {
-                      onSelect([...selectedMembers, member])
+                      setTempSelectedMembers([...tempSelectedMembers, member])
                     } else {
-                      onSelect(selectedMembers.filter((m) => m.id !== member.id))
+                      setTempSelectedMembers(tempSelectedMembers.filter((m) => m.id !== member.id))
                     }
                   }}
                 />
@@ -201,8 +215,11 @@ export function WechatGroupMemberSelector({
           <Button variant="outline" onClick={() => onOpenChange(false)}>
             取消
           </Button>
-          <Button onClick={() => onOpenChange(false)}>
-            确定 ({selectedMembers.length})
+          <Button onClick={() => {
+            onSelect(tempSelectedMembers)
+            onOpenChange(false)
+          }}>
+            确定 ({tempSelectedMembers.length})
           </Button>
         </div>
       </DialogContent>

Cunkebao/components/WechatGroupSelector.tsx

@@ -36,13 +36,15 @@ export function WechatGroupSelector({ open, onOpenChange, selectedGroups, onSele
   const [page, setPage] = useState(1)
   const [totalPages, setTotalPages] = useState(1)
   const [totalItems, setTotalItems] = useState(0)
+  const [tempSelectedGroups, setTempSelectedGroups] = useState<WechatGroup[]>([])
   const pageSize = 20
 
   useEffect(() => {
     if (open) {
       fetchGroups(1)
+      setTempSelectedGroups([...selectedGroups])
     }
-  }, [open])
+  }, [open, selectedGroups])
 
   const fetchGroups = async (pageNum: number) => {
     setLoading(true)
@@ -130,12 +132,12 @@ export function WechatGroupSelector({ open, onOpenChange, selectedGroups, onSele
             groups.map((group) => (
               <div key={group.id} className="flex items-center space-x-3 p-2 hover:bg-gray-100 rounded-lg">
                 <Checkbox
-                  checked={selectedGroups.some((g) => g.id === group.id)}
+                  checked={tempSelectedGroups.some((g) => g.id === group.id)}
                   onCheckedChange={(checked) => {
                     if (checked) {
-                      onSelect([...selectedGroups, group])
+                      setTempSelectedGroups([...tempSelectedGroups, group])
                     } else {
-                      onSelect(selectedGroups.filter((g) => g.id !== group.id))
+                      setTempSelectedGroups(tempSelectedGroups.filter((g) => g.id !== group.id))
                     }
                   }}
                 />
@@ -188,7 +190,12 @@ export function WechatGroupSelector({ open, onOpenChange, selectedGroups, onSele
           <Button variant="outline" onClick={() => onOpenChange(false)}>
             取消
           </Button>
-          <Button onClick={() => onOpenChange(false)}>确定 ({selectedGroups.length})</Button>
+          <Button onClick={() => {
+            onSelect(tempSelectedGroups)
+            onOpenChange(false)
+          }}>
+            确定 ({tempSelectedGroups.length})
+          </Button>
         </div>
       </DialogContent>
     </Dialog>