暂时优化体检加项面板
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import { useState } from 'react';
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
|
||||
import type { ExamClient } from '../../data/mockData';
|
||||
import { searchPhysicalExamAddItem } from '../../api';
|
||||
import { Button, Input } from '../ui';
|
||||
|
||||
interface AddonTag {
|
||||
@@ -15,40 +15,56 @@ interface AddonItem {
|
||||
tags?: AddonTag[];
|
||||
originalPrice?: string;
|
||||
currentPrice?: string;
|
||||
price?: number; // 兼容 addonOptions 结构
|
||||
}
|
||||
|
||||
export const ExamAddonPanel = ({ client }: { client: ExamClient }) => {
|
||||
// 从 client 获取加项选项数据
|
||||
const addonOptions = (client['addonOptions' as keyof ExamClient] as AddonItem[] | undefined) || [];
|
||||
const addonSummary = (client['addonSummary' as keyof ExamClient] as AddonItem[] | undefined) || [];
|
||||
export const ExamAddonPanel = () => {
|
||||
const [addonList, setAddonList] = useState<AddonItem[]>([]);
|
||||
const [addonSearch, setAddonSearch] = useState('');
|
||||
const [addonLoading, setAddonLoading] = useState(false);
|
||||
const [addonError, setAddonError] = useState<string | null>(null);
|
||||
|
||||
// 合并数据,优先使用 addonOptions,如果没有则使用 addonSummary
|
||||
const allAddons: AddonItem[] = addonOptions.length > 0
|
||||
? addonOptions.map(item => ({
|
||||
id: item.id || `addon_${item.name}`,
|
||||
name: item.name,
|
||||
paid: item.paid || false,
|
||||
tags: item.tags || [],
|
||||
originalPrice: item.originalPrice || (item.price ? item.price.toFixed(2) : '0.00'),
|
||||
currentPrice: item.currentPrice || (item.price ? item.price.toFixed(2) : '0.00'),
|
||||
}))
|
||||
: addonSummary;
|
||||
// 拉取加项列表
|
||||
useEffect(() => {
|
||||
const fetchList = async () => {
|
||||
setAddonLoading(true);
|
||||
setAddonError(null);
|
||||
try {
|
||||
const res = await searchPhysicalExamAddItem({ item_name: addonSearch.trim() });
|
||||
if (res.Status === 200 && Array.isArray(res.Data)) {
|
||||
const list: AddonItem[] = res.Data.map((item) => ({
|
||||
id: item.item_id ? String(item.item_id) : `addon_${item.item_name}`,
|
||||
name: item.item_name || '',
|
||||
originalPrice: item.original_price !== undefined ? Number(item.original_price).toFixed(2) : '0.00',
|
||||
currentPrice: item.actual_received_amount !== undefined
|
||||
? Number(item.actual_received_amount).toFixed(2)
|
||||
: (item.original_price !== undefined ? Number(item.original_price).toFixed(2) : '0.00'),
|
||||
tags: [],
|
||||
paid: false,
|
||||
}));
|
||||
setAddonList(list);
|
||||
} else {
|
||||
setAddonError(res.Message || '获取加项列表失败');
|
||||
setAddonList([]);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取加项列表失败', err);
|
||||
setAddonError('获取加项列表失败,请稍后重试');
|
||||
setAddonList([]);
|
||||
} finally {
|
||||
setAddonLoading(false);
|
||||
}
|
||||
};
|
||||
fetchList();
|
||||
}, [addonSearch]);
|
||||
|
||||
const [selectedIds, setSelectedIds] = useState<Set<string>>(
|
||||
new Set(allAddons.filter(item => item.paid).map(item => item.id || item.name))
|
||||
);
|
||||
const allAddons = useMemo(() => addonList, [addonList]);
|
||||
|
||||
const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());
|
||||
|
||||
const maxSelect = 15;
|
||||
const selectedCount = selectedIds.size;
|
||||
|
||||
const [addonSearch, setAddonSearch] = useState('');
|
||||
|
||||
const filteredAddons = addonSearch.trim()
|
||||
? allAddons.filter(item =>
|
||||
item.name.toLowerCase().includes(addonSearch.toLowerCase())
|
||||
)
|
||||
: allAddons;
|
||||
const filteredAddons = allAddons;
|
||||
|
||||
const toggleSelect = (id: string) => {
|
||||
if (selectedIds.has(id)) {
|
||||
@@ -125,6 +141,15 @@ export const ExamAddonPanel = ({ client }: { client: ExamClient }) => {
|
||||
|
||||
{/* 加项网格 */}
|
||||
<div className='grid grid-cols-5 gap-3 min-h-[142px]'>
|
||||
{addonError && (
|
||||
<div className='col-span-5 text-xs text-amber-600'>{addonError}</div>
|
||||
)}
|
||||
{addonLoading && (
|
||||
<div className='col-span-5 text-xs text-gray-500'>加载中...</div>
|
||||
)}
|
||||
{!addonLoading && !addonError && filteredAddons.length === 0 && (
|
||||
<div className='col-span-5 text-xs text-gray-500'>暂无数据</div>
|
||||
)}
|
||||
{filteredAddons.map((item) => {
|
||||
const id = item.id || item.name;
|
||||
const isSelected = selectedIds.has(id);
|
||||
|
||||
@@ -153,7 +153,7 @@ export const ExamModal = ({ client, tab, onTabChange, onClose }: ExamModalProps)
|
||||
/>
|
||||
)}
|
||||
{tab === 'sign' && <ExamSignPanel examId={Number(client.id)} onBusyChange={setSignBusy} />}
|
||||
{tab === 'addon' && <ExamAddonPanel client={client} />}
|
||||
{tab === 'addon' && <ExamAddonPanel />}
|
||||
{tab === 'print' && <ExamPrintPanel client={client} />}
|
||||
{tab === 'delivery' && <ExamDeliveryPanel client={client} />}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user