AI: 会友信息管理模块实现

package.json

@@ -1,33 +1,35 @@
 {
-  "name": "vite-react-typescript-starter",
+  "name": "church-management-system",
   "private": true,
-  "version": "0.0.0",
+  "version": "0.1.0",
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
-    "lint": "eslint .",
+    "build": "tsc && vite build",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview"
   },
   "dependencies": {
-    "lucide-react": "^0.344.0",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^6.22.3",
+    "@ant-design/icons": "^5.3.5",
+    "antd": "^5.15.3",
+    "axios": "^1.6.8",
+    "dayjs": "^1.11.10",
+    "react-query": "^3.39.3",
+    "zustand": "^4.5.2"
   },
   "devDependencies": {
-    "@eslint/js": "^9.9.1",
     "@types/react": "^18.3.5",
     "@types/react-dom": "^18.3.0",
+    "@typescript-eslint/eslint-plugin": "^7.3.1",
+    "@typescript-eslint/parser": "^7.3.1",
     "@vitejs/plugin-react": "^4.3.1",
-    "autoprefixer": "^10.4.18",
     "eslint": "^9.9.1",
     "eslint-plugin-react-hooks": "^5.1.0-rc.0",
     "eslint-plugin-react-refresh": "^0.4.11",
-    "globals": "^15.9.0",
-    "postcss": "^8.4.35",
-    "tailwindcss": "^3.4.1",
     "typescript": "^5.5.3",
-    "typescript-eslint": "^8.3.0",
     "vite": "^5.4.2"
   }
-}
+}

src/components/MemberForm.tsx

@@ -0,0 +1,72 @@
+import React from 'react';
+import { Form, Input, Select, DatePicker, Switch, Button } from 'antd';
+import { MemberFormData } from '../types/member';
+
+const { Option } = Select;
+
+interface MemberFormProps {
+  initialValues?: MemberFormData;
+  onSubmit: (values: MemberFormData) => void;
+}
+
+const MemberForm: React.FC<MemberFormProps> = ({ initialValues, onSubmit }) => {
+  const [form] = Form.useForm();
+
+  const handleSubmit = (values: MemberFormData) => {
+    onSubmit(values);
+  };
+
+  return (
+    <Form form={form} layout="vertical" onFinish={handleSubmit} initialValues={initialValues}>
+      <Form.Item name="name" label="姓名" rules={[{ required: true }]}>
+        <Input />
+      </Form.Item>
+      <Form.Item name="gender" label="性别" rules={[{ required: true }]}>
+        <Select>
+          <Option value="male">男</Option>
+          <Option value="female">女</Option>
+        </Select>
+      </Form.Item>
+      <Form.Item name="age" label="年龄" rules={[{ required: true, type: 'number' }]}>
+        <Input type="number" />
+      </Form.Item>
+      <Form.Item name="birthDate" label="出生日期" rules={[{ required: true }]}>
+        <DatePicker />
+      </Form.Item>
+      <Form.Item name="contact" label="联系方式" rules={[{ required: true }]}>
+        <Input />
+      </Form.Item>
+      <Form.Item name="occupation" label="职业">
+        <Input />
+      </Form.Item>
+      <Form.Item name="districtLeader" label="区长">
+        <Input />
+      </Form.Item>
+      <Form.Item name="groupLeader" label="组长">
+        <Input />
+      </Form.Item>
+      <Form.Item name="servicePosition" label="服侍岗位">
+        <Input />
+      </Form.Item>
+      <Form.Item name="isBaptized" label="是否受洗" valuePropName="checked">
+        <Switch />
+      </Form.Item>
+      <Form.Item name="baptismDate" label="受洗日期">
+        <DatePicker />
+      </Form.Item>
+      <Form.Item name="birthdayReminder" label="生日提醒" valuePropName="checked">
+        <Switch />
+      </Form.Item>
+      <Form.Item name="notes" label="备注">
+        <Input.TextArea />
+      </Form.Item>
+      <Form.Item>
+        <Button type="primary" htmlType="submit">
+          提交
+        </Button>
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default MemberForm;

src/index.css

@@ -1,3 +1,16 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import 'antd/dist/reset.css';
+
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.logo {
+  height: 32px;
+  margin: 16px;
+  background: rgba(255, 255, 255, 0.3);
+}

src/types/member.ts

@@ -0,0 +1,18 @@
+export interface Member {
+  id: string;
+  name: string;
+  gender: 'male' | 'female';
+  age: number;
+  birthDate: string;
+  contact: string;
+  occupation: string;
+  districtLeader: string;
+  groupLeader: string;
+  servicePosition: string;
+  isBaptized: boolean;
+  baptismDate?: string;
+  birthdayReminder: boolean;
+  notes?: string;
+}
+
+export interface MemberFormData extends Omit<Member, 'id'> {}