member-management-system-excel-4tS6CDLA/src/components/MemberList.jsx

import React, { useState, useEffect, useCallback, useRef } from 'react';
import { Table, Button, message, Modal, Space, Input, Image } from 'antd';
import { PlusOutlined, SearchOutlined, DownloadOutlined } from '@ant-design/icons';
import Highlighter from 'react-highlight-words';
import { deviceApi, testConnection } from '../api/deviceApi';
import ExcelImportExport from './ExcelImportExport';
import MemberForm from './MemberForm';

const MemberList = () => {
  // ... 保持其他状态和函数不变

  useEffect(() => {
    const checkConnection = async () => {
      const isConnected = await testConnection();
      if (!isConnected) {
        message.error('无法连接到服务器，请检查网络连接和服务器状态');
      }
    };
    checkConnection();
    fetchMembers();
  }, [fetchMembers]);

  const handleSubmit = async (values) => {
    try {
      if (editingMember) {
        await deviceApi.updatePerson(editingMember.personId, values);
        message.success('会友信息更新成功');
      } else {
        await deviceApi.createPerson(values);
        message.success('会友添加成功');
      }
      setIsModalVisible(false);
      fetchMembers();
    } catch (error) {
      console.error('保存会友信息失败', error);
      message.error(`保存会友信息失败：${error.message}`);
    }
  };

  // ... 保持其他代码不变

  return (
    // ... 保持返回的 JSX 不变
  );
};

export default MemberList;