AI: 修复 MemberList.jsx 中的语法错误

src/components/MemberList.jsx

@@ -6,7 +6,75 @@ import ExcelImportExport from './ExcelImportExport';
 import MemberForm from './MemberForm';
 
 const MemberList = () => {
-  // ... 其他代码保持不变
+  const [members, setMembers] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [isModalVisible, setIsModalVisible] = useState(false);
+  const [editingMember, setEditingMember] = useState(null);
+
+  const fetchMembers = useCallback(async () => {
+    setLoading(true);
+    try {
+      const data = await deviceApi.getAllPersons();
+      console.log('获取到的会友列表数据:', data);
+      setMembers(data);
+      message.success('会友列表获取成功');
+    } catch (error) {
+      console.error('获取会友列表失败', error);
+      message.error(`获取会友列表失败: ${error.message}`);
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchMembers();
+  }, [fetchMembers]);
+
+  const handleAdd = () => {
+    setEditingMember(null);
+    setIsModalVisible(true);
+  };
+
+  const handleEdit = (record) => {
+    setEditingMember(record);
+    setIsModalVisible(true);
+  };
+
+  const handleDelete = (id) => {
+    Modal.confirm({
+      title: '确认删除',
+      content: '您确定要删除这个会友吗？此操作不可逆。',
+      onOk: async () => {
+        try {
+          await deviceApi.deletePerson(id);
+          message.success('会友删除成功');
+          fetchMembers();
+        } catch (error) {
+          console.error('删除会友失败', error);
+          message.error(`删除会友失败: ${error.message}`);
+        }
+      },
+    });
+  };
+
+  const handleSubmit = async (values) => {
+    try {
+      if (editingMember) {
+        console.log('更新会员信息:', values);
+        await deviceApi.updatePerson(editingMember.personId, values);
+        message.success('会友信息更新成功');
+      } else {
+        console.log('添加新会员:', values);
+        await deviceApi.addPerson(values);
+        message.success('会友添加成功');
+      }
+      setIsModalVisible(false);
+      fetchMembers();
+    } catch (error) {
+      console.error('操作失败', error);
+      message.error(`操作失败: ${error.message}`);
+    }
+  };
 
   const columns = [
     { 
@@ -41,10 +109,37 @@ const MemberList = () => {
     },
   ];
 
-  // ... 其他代码保持不变
-
   return (
-    // ... JSX 保持不变
+    <div>
+      <h2>会友列表</h2>
+      <div style={{ marginBottom: 16 }}>
+        <Button onClick={fetchMembers} type="primary" style={{ marginRight: 8 }}>
+          刷新列表
+        </Button>
+        <Button onClick={handleAdd} type="primary" icon={<PlusOutlined />}>
+          添加会友
+        </Button>
+      </div>
+      <ExcelImportExport members={members} onImport={fetchMembers} />
+      <Table
+        columns={columns}
+        dataSource={members}
+        rowKey="personId"
+        loading={loading}
+      />
+      <Modal
+        title={editingMember ? "编辑会友" : "添加会友"}
+        visible={isModalVisible}
+        onCancel={() => setIsModalVisible(false)}
+        footer={null}
+        width={600}
+      >
+        <MemberForm 
+          initialValues={editingMember} 
+          onSubmit={handleSubmit}
+        />
+      </Modal>
+    </div>
   );
 };