|
|
@@ -1,39 +1,10 @@
|
|
|
import React, { useState } from 'react';
|
|
|
-import MemberList from './components/MemberList';
|
|
|
-import MemberForm from './components/MemberForm';
|
|
|
-import ExcelImportExport from './components/ExcelImportExport';
|
|
|
|
|
|
function App() {
|
|
|
- const [members, setMembers] = useState([]);
|
|
|
- const [editingMember, setEditingMember] = useState(null);
|
|
|
-
|
|
|
- const addMember = (member) => {
|
|
|
- setMembers([...members, { ...member, id: Date.now() }]);
|
|
|
- };
|
|
|
-
|
|
|
- const updateMember = (updatedMember) => {
|
|
|
- setMembers(members.map(m => m.id === updatedMember.id ? updatedMember : m));
|
|
|
- setEditingMember(null);
|
|
|
- };
|
|
|
-
|
|
|
- const deleteMember = (id) => {
|
|
|
- setMembers(members.filter(m => m.id !== id));
|
|
|
- };
|
|
|
-
|
|
|
- const handleImport = (importedMembers) => {
|
|
|
- setMembers([...members, ...importedMembers.map(m => ({ ...m, id: Date.now() + Math.random() }))]);
|
|
|
- };
|
|
|
-
|
|
|
return (
|
|
|
<div className="App">
|
|
|
<h1>会友信息管理系统</h1>
|
|
|
- <ExcelImportExport members={members} onImport={handleImport} />
|
|
|
- <MemberForm onSubmit={editingMember ? updateMember : addMember} initialData={editingMember} />
|
|
|
- <MemberList
|
|
|
- members={members}
|
|
|
- onEdit={setEditingMember}
|
|
|
- onDelete={deleteMember}
|
|
|
- />
|
|
|
+ <p>欢迎使用会友信息管理系统！</p>
|
|
|
</div>
|
|
|
);
|
|
|
}
|
