完善挂账显示

src/components/exam/ExamAddonPanel.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useMemo, useState, useRef } from 'react';
 
 import type { ExamClient } from '../../data/mockData';
-import { searchPhysicalExamAddItem, getAddItemCustomerInfo } from '../../api';
+import { searchPhysicalExamAddItem, getAddItemCustomerInfo, getChannelCompanyList } from '../../api';
 import { Button, Input } from '../ui';
 import { cls } from '../../utils/cls';
 import nozImage from '../../assets/image/noz.png';
@@ -50,6 +50,10 @@ export const ExamAddonPanel = ({ client }: ExamAddonPanelProps) => {
   const [accountCompany, setAccountCompany] = useState<string>('圆和');
   const [isAccountCompanyDropdownOpen, setIsAccountCompanyDropdownOpen] = useState(false);
   const accountCompanyDropdownRef = useRef<HTMLDivElement>(null);
+  // 挂账公司列表
+  const [accountCompanyList, setAccountCompanyList] = useState<
+    Array<{ company_id: number; company_name?: string | null; pinyin?: string | null }>
+  >([]);
 
   // 点击外部关闭下拉框
   useEffect(() => {
@@ -99,6 +103,44 @@ export const ExamAddonPanel = ({ client }: ExamAddonPanelProps) => {
     fetchCustomerInfo();
   }, [client.id]);
 
+  // 获取挂账公司列表
+  useEffect(() => {
+    const fetchCompanyList = async () => {
+      try {
+        const res = await getChannelCompanyList({});
+        if (res.Status === 200 && Array.isArray(res.Data) && res.Data.length > 0) {
+          setAccountCompanyList(res.Data);
+          // 设置默认值为第一个公司
+          const firstCompany = res.Data[0];
+          if (firstCompany?.company_name) {
+            setAccountCompany(firstCompany.company_name);
+          }
+        } else {
+          setAccountCompanyList([]);
+        }
+      } catch (err) {
+        console.error('获取挂账公司列表失败', err);
+        setAccountCompanyList([]);
+      }
+    };
+
+    fetchCompanyList();
+  }, []);
+
+  // 当挂账公司列表更新时，确保当前选中的公司在列表中
+  useEffect(() => {
+    if (accountCompanyList.length > 0) {
+      const companyNames = accountCompanyList.map((c) => c.company_name).filter(Boolean) as string[];
+      if (!companyNames.includes(accountCompany)) {
+        // 如果当前选中的公司不在列表中，更新为第一个公司
+        const firstCompany = accountCompanyList[0];
+        if (firstCompany?.company_name) {
+          setAccountCompany(firstCompany.company_name);
+        }
+      }
+    }
+  }, [accountCompanyList, accountCompany]);
+
   // 防抖：当输入值变化时，延迟 0.5 秒后更新 debouncedAddonSearch（用于 API 调用）
   useEffect(() => {
     if (debounceTimerRef.current) {
@@ -264,10 +306,17 @@ export const ExamAddonPanel = ({ client }: ExamAddonPanelProps) => {
     { value: 'account', label: '挂账' },
   ];
 
-  // 挂账公司选项（可以根据实际需求从接口获取）
-  const accountCompanyOptions: Array<{ value: string; label: string }> = [
-    { value: '圆和', label: '圆和' },
-  ];
+  // 挂账公司选项（从接口获取）
+  const accountCompanyOptions = useMemo(() => {
+    if (accountCompanyList.length === 0) {
+      // 如果没有数据，返回默认的"圆和"
+      return [{ value: '圆和', label: '圆和' }];
+    }
+    return accountCompanyList.map((company) => ({
+      value: company.company_name || `公司${company.company_id}`,
+      label: company.company_name || `公司${company.company_id}`,
+    }));
+  }, [accountCompanyList]);
 
   return (
     <div className='space-y-4'>
@@ -498,7 +547,7 @@ export const ExamAddonPanel = ({ client }: ExamAddonPanelProps) => {
                   </span>
                 </button>
                 {isAccountCompanyDropdownOpen && (
-                  <div className='absolute z-50 w-full bottom-full mb-1 bg-white border border-gray-300 rounded-lg shadow-lg overflow-hidden'>
+                  <div className='absolute z-50 w-full bottom-full mb-1 bg-white border border-gray-300 rounded-lg shadow-lg overflow-hidden max-h-[500px] overflow-y-auto'>
                     {accountCompanyOptions.map((option) => (
                       <button
                         key={option.value}