refactor(web): 16 个列表页 columns 定义 useMemo 化 — 减少 Table 不必要 re-render
Some checks failed
CI / rust-check (push) Has been cancelled
CI / rust-test (push) Has been cancelled
CI / frontend-build (push) Has been cancelled
CI / security-audit (push) Has been cancelled

- AiPromptList/AiAnalysisList/AppointmentList 等 14 个主页面
- HealthRecordsTab/LabReportsTab 2 个 Tab 组件
- 每个 columns 依赖数组包含其引用的闭包变量(handleDelete/navigate 等)
This commit is contained in:
iven
2026-04-28 19:45:14 +08:00
parent e76f4feb4f
commit 99093d8143
16 changed files with 48 additions and 48 deletions

View File

@@ -1,4 +1,4 @@
import { useCallback, useState } from 'react';
import { useCallback, useState, useMemo } from 'react';
import { Table, Tag, Button, Modal, Form, Select, DatePicker, Input, message, Popconfirm, Space } from 'antd';
import { PlusOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons';
import { dayjs } from '../../../utils/dayjs';
@@ -102,7 +102,7 @@ export function HealthRecordsTab({ patientId }: Props) {
}
};
const columns = [
const columns = useMemo(() => [
{ title: '记录类型', dataIndex: 'record_type', key: 'record_type', width: 120, render: (v: string) => <Tag>{RECORD_TYPE_MAP[v] || v}</Tag> },
{ title: '记录日期', dataIndex: 'record_date', key: 'record_date', width: 120 },
{ title: '内容', dataIndex: 'content', key: 'content', ellipsis: true },
@@ -139,7 +139,7 @@ export function HealthRecordsTab({ patientId }: Props) {
</Space>
),
},
];
], [openEditModal, handleDelete]);
return (
<div>

View File

@@ -1,4 +1,4 @@
import { useCallback, useState } from 'react';
import { useCallback, useState, useMemo } from 'react';
import { Table, Tag, Button, Modal, Form, Input, DatePicker, message, Popconfirm, Space } from 'antd';
import { PlusOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons';
import { dayjs } from '../../../utils/dayjs';
@@ -88,7 +88,7 @@ export function LabReportsTab({ patientId }: Props) {
}
};
const columns = [
const columns = useMemo(() => [
{ title: '报告日期', dataIndex: 'report_date', key: 'report_date', width: 120 },
{ title: '报告类型', dataIndex: 'report_type', key: 'report_type', width: 120, render: (v: string) => <Tag>{v}</Tag> },
{ title: '医生解读', dataIndex: 'doctor_interpretation', key: 'doctor_interpretation', ellipsis: true },
@@ -112,7 +112,7 @@ export function LabReportsTab({ patientId }: Props) {
</AuthButton>
),
},
];
], [openEditModal, handleDelete]);
return (
<div>