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

功能、和样式修复
2025-07-22 14:37:57 +08:00
parent 34df010769
commit f33bdf42e2
14 changed files with 205 additions and 74 deletions
--- a/nkebao/src/components/SelectionTest.tsx
+++ b/nkebao/src/components/SelectionTest.tsx
@@ -0,0 +1,80 @@
+import React, { useState } from "react";
+import DeviceSelection from "./DeviceSelection";
+import { DeviceSelectionDialog } from "./DeviceSelectionDialog";
+import FriendSelection from "./FriendSelection";
+import GroupSelection from "./GroupSelection";
+import { Button, Space } from "antd-mobile";
+
+export default function SelectionTest() {
+  // 设备选择
+  const [selectedDevices, setSelectedDevices] = useState<string[]>([]);
+  const [deviceDialogOpen, setDeviceDialogOpen] = useState(false);
+
+  // 好友选择
+  const [selectedFriends, setSelectedFriends] = useState<string[]>([]);
+  const [friendDialogOpen, setFriendDialogOpen] = useState(false);
+
+  // 群组选择
+  const [selectedGroups, setSelectedGroups] = useState<string[]>([]);
+  const [groupDialogOpen, setGroupDialogOpen] = useState(false);
+
+  return (
+    <div style={{ padding: 24 }}>
+      <h2>选择弹窗测试</h2>
+      <Space direction="vertical" block>
+        <div>
+          <b>DeviceSelection（内嵌输入框+弹窗）</b>
+          <DeviceSelection
+            selectedDevices={selectedDevices}
+            onSelect={setSelectedDevices}
+          />
+        </div>
+        <div>
+          <b>DeviceSelectionDialog（纯弹窗）</b>
+          <Button color="primary" onClick={() => setDeviceDialogOpen(true)}>
+            打开设备选择弹窗
+          </Button>
+          <DeviceSelectionDialog
+            open={deviceDialogOpen}
+            onOpenChange={setDeviceDialogOpen}
+            selectedDevices={selectedDevices}
+            onSelect={setSelectedDevices}
+          />
+        </div>
+        <div>
+          <b>FriendSelection</b>
+          <Button color="primary" onClick={() => setFriendDialogOpen(true)}>
+            打开好友选择弹窗
+          </Button>
+          <FriendSelection
+            selectedFriends={selectedFriends}
+            onSelect={setSelectedFriends}
+            placeholder="请选择微信好友"
+            className=""
+            visible={friendDialogOpen}
+            onVisibleChange={setFriendDialogOpen}
+          />
+        </div>
+        <div>
+          <b>GroupSelection</b>
+          <Button color="primary" onClick={() => setGroupDialogOpen(true)}>
+            打开群组选择弹窗
+          </Button>
+          <GroupSelection
+            selectedGroups={selectedGroups}
+            onSelect={setSelectedGroups}
+            placeholder="请选择群聊"
+            className=""
+            visible={groupDialogOpen}
+            onVisibleChange={setGroupDialogOpen}
+          />
+        </div>
+      </Space>
+      <div style={{ marginTop: 32 }}>
+        <div>已选设备ID: {selectedDevices.join(", ")}</div>
+        <div>已选好友ID: {selectedFriends.join(", ")}</div>
+        <div>已选群组ID: {selectedGroups.join(", ")}</div>
+      </div>
+    </div>
+  );
+}