/** * filekorolheader: 企业管理 - 企业信息管理与维护页面 * 功能:企业列表查询、详情查看、状态管理、分页筛选 * 路径:/central-config/tenant/enterprise-management * 规范:遵循crop-x/docs/开发项目规范.md,使用useReducer状态管理,API集成,shadcn语义化样式 */ 'use client'; import { useEffect, useMemo, useState, useCallback } from 'react'; import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from '@/components/ui/dialog'; import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from '@/components/ui/alert-dialog'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import { ScrollArea } from '@/components/ui/scroll-area'; import { Label } from '@/components/ui/label'; import { Button } from '@/components/ui/button'; import { Card } from '@/components/ui/card'; import { Building2, Eye, Power, PowerOff, Plus, FileText, CreditCard, User, Search } from 'lucide-react'; import { toast } from 'sonner'; import SearchFormPagination, { type SearchFieldConfig, type TableColumnConfig } from '@/components/common/searchFormPagination'; import { fetchTenants, transformTenantData, enableTenant, disableTenant, createEnterprise, TenantsQueryParams, Enterprise } from './components/enterpriseApi'; import { CreateEnterpriseDialog } from './components/CreateEnterpriseDialog'; // Utility functions const getStatusBadge = (status: 'active' | 'inactive') => { if (status === 'active') { return (
启用
); } return (
禁用
); }; const getAuditStatusBadge = (auditStatus: Enterprise['auditStatus']) => { switch (auditStatus) { case 'draft': return (
草稿
); case 'pending': return (
待审核
); case 'approved': return (
审核通过
); case 'rejected': return (
已拒绝
); default: return (
草稿
); } }; export default function EnterpriseManagement() { // 对话框状态管理 const [dialogs, setDialogs] = useState({ showViewDialog: false, showAddDialog: false, showStatusDialog: false, selectedEnterprise: null as Enterprise | null, statusAction: 'enable' as 'enable' | 'disable' }); const dispatch = (action: any) => { switch (action.type) { case 'SET_SELECTED_ENTERPRISE': setDialogs(prev => ({ ...prev, selectedEnterprise: action.payload })); break; case 'TOGGLE_VIEW_DIALOG': setDialogs(prev => ({ ...prev, showViewDialog: action.payload })); break; case 'TOGGLE_ADD_DIALOG': setDialogs(prev => ({ ...prev, showAddDialog: action.payload })); break; case 'TOGGLE_STATUS_DIALOG': setDialogs(prev => ({ ...prev, showStatusDialog: action.payload })); break; case 'SET_STATUS_ACTION': setDialogs(prev => ({ ...prev, statusAction: action.payload })); break; case 'RESET_FORM_DATA': setDialogs(prev => ({ ...prev, selectedEnterprise: null })); break; } }; // 搜索字段配置 const searchFields: SearchFieldConfig[] = [ { key: 'search', label: '搜索', type: 'text', placeholder: '搜索企业名称、编码...', }, { key: 'audit_status', label: '审核状态', type: 'select', placeholder: '审核状态', defaultValue: 'all', options: [ { value: 'all', label: '全部状态' }, { value: '草稿', label: '草稿' }, { value: '待审核', label: '待审核' }, { value: '已通过', label: '审核通过' }, { value: '已拒绝', label: '已拒绝' }, ], }, ]; // 表格列配置 const columns: TableColumnConfig[] = [ { key: 'code', label: '企业编码', width: '120px', }, { key: 'name', label: '企业名称', render: (value: string) => (
{value}
), }, { key: 'type', label: '企业类型', render: (value: string) => (
{value}
), }, { key: 'registrant', label: '登记人', render: (value?: string) => value || '-', }, { key: 'contactPhone', label: '联系电话', render: (value?: string) => value || '-', }, { key: 'createdAt', label: '创建时间', width: '160px', }, { key: 'auditStatus', label: '审核状态', render: (value: Enterprise['auditStatus']) => getAuditStatusBadge(value), }, { key: 'status', label: '状态', render: (value: Enterprise['status']) => getStatusBadge(value), }, { key: 'actions', label: '操作', render: (_: any, row: Enterprise) => (
{row.status === 'active' ? ( ) : ( )}
), }, ]; // 简化的状态管理 - 只需要存储数据和加载状态 const [enterprises, setEnterprises] = useState([]); const [pagination, setPagination] = useState({ page: 1, size: 10, total: 0, totalPages: 0, hasNext: false, hasPrev: false, }); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [searchFilters, setSearchFilters] = useState>({ search: '', audit_status: 'all' }); // 数据加载函数 - 移除不必要的依赖避免重复调用 const loadEnterprises = useCallback(async (params?: { filters?: Record; pagination?: { page: number; size: number }; sort?: { sortBy?: string; sortOrder?: 'asc' | 'desc' }; }) => { try { console.log('调用了loadEnterprises') setLoading(true); setError(null); const finalParams: TenantsQueryParams = { search: (params?.filters?.search ?? searchFilters.search) || undefined, audit_status: params?.filters?.audit_status ?? searchFilters.audit_status, page: params?.pagination?.page || pagination.page, size: params?.pagination?.size || pagination.size, order_by: params?.sort?.sortBy, sort_order: params?.sort?.sortOrder, }; // 处理audit_status,如果为'all'则不传该参数 if (finalParams.audit_status === 'all') { finalParams.audit_status = undefined; } const response = await fetchTenants(finalParams); const transformedData = response.data.map(transformTenantData); setEnterprises(transformedData); setPagination({ page: response.page, size: response.size, total: response.total, totalPages: response.total_pages, hasNext: response.has_next, hasPrev: response.has_prev, }); } catch (err) { const errorMessage = err instanceof Error ? err.message : '加载企业数据失败'; setError(errorMessage); toast.error(errorMessage); } finally { setLoading(false); } }, []); // 移除所有依赖,使用参数传递状态变化 // 事件处理器 const handleSearch = useCallback((filters: Record) => { setSearchFilters(filters); // 搜索时重置到第一页 loadEnterprises({ filters, pagination: { page: 1, size: pagination.size } }); }, [loadEnterprises, pagination.size]); const handleSort = useCallback((sortBy: string, sortOrder: 'asc' | 'desc') => { // 排序时重置到第一页 loadEnterprises({ pagination: { page: 1, size: pagination.size }, sort: { sortBy, sortOrder } }); }, [loadEnterprises, pagination.size]); const handlePageChange = useCallback((page: number) => { setPagination(prev => ({ ...prev, page })); loadEnterprises({ pagination: { page, size: pagination.size } }); }, [loadEnterprises, pagination.size]); const handleSizeChange = useCallback((size: number) => { setPagination(prev => ({ ...prev, size, page: 1 })); loadEnterprises({ pagination: { page: 1, size } }); }, [loadEnterprises]); // 初始化数据加载 // useEffect(() => { // loadEnterprises(); // }, []); // 计算统计数据 const stats = useMemo(() => { if (enterprises.length === 0) { return { total: pagination.total, active: 0, inactive: 0 }; } const active = enterprises.filter(e => e.status === 'active').length; const inactive = enterprises.filter(e => e.status === 'inactive').length; return { total: pagination.total, active, inactive }; }, [enterprises, pagination.total]); // 业务事件处理器 const handleView = (enterprise: Enterprise) => { dispatch({ type: 'SET_SELECTED_ENTERPRISE', payload: enterprise }); dispatch({ type: 'TOGGLE_VIEW_DIALOG', payload: true }); }; const handleStatusChange = (enterprise: Enterprise, action: 'enable' | 'disable') => { dispatch({ type: 'SET_SELECTED_ENTERPRISE', payload: enterprise }); dispatch({ type: 'SET_STATUS_ACTION', payload: action }); dispatch({ type: 'TOGGLE_STATUS_DIALOG', payload: true }); }; const confirmStatusChange = async () => { if (!dialogs.selectedEnterprise) return; try { setLoading(true); const tenantId = dialogs.selectedEnterprise.id; let updatedTenant; if (dialogs.statusAction === 'enable') { updatedTenant = await enableTenant(tenantId); toast.success('企业已启用'); } else { updatedTenant = await disableTenant(tenantId); toast.success('企业已禁用'); } // 状态更新成功后关闭对话框 dispatch({ type: 'TOGGLE_STATUS_DIALOG', payload: false }); // 重新加载数据来反映状态变化 const reloadParams: any = { filters: searchFilters, pagination: { page: pagination.page, size: pagination.size } }; loadEnterprises(reloadParams); } catch (error) { console.error('Status change failed:', error); const errorMessage = error instanceof Error ? error.message : '状态更新失败'; toast.error(errorMessage); } finally { setLoading(false); } }; const handleCreateNew = () => { dispatch({ type: 'RESET_FORM_DATA' }); dispatch({ type: 'TOGGLE_ADD_DIALOG', payload: true }); }; const handleCreateSuccess = () => { // 创建成功后需要手动刷新页面数据 window.location.reload(); }; // 操作按钮配置 const actionButtons = ( ); return (
{/* Page Header - 自定义页面头部 */}

企业管理

管理平台所有企业信息,支持查询、查看详情、启用/禁用企业

智能查询
状态管理
详情查看
{/* Statistics Cards - 保持原有统计功能 */}
企业总数
{pagination.total}
全部企业数量
启用企业
{stats.active}
正常运营中
禁用企业
{stats.inactive}
已暂停使用
{/* 使用SearchFormPagination组件替换原有的企业列表 */} } emptyText="暂无企业数据" /> {/* View Enterprise Details Dialog */} dispatch({ type: 'TOGGLE_VIEW_DIALOG', payload: open })}>
企业详情 {dialogs.selectedEnterprise && (
{getAuditStatusBadge(dialogs.selectedEnterprise.auditStatus)} {getStatusBadge(dialogs.selectedEnterprise.status)}
)}
查看企业的详细信息
{dialogs.selectedEnterprise && ( 基本信息 其他信息 开户信息 法人信息 {/* Basic Information */}
{dialogs.selectedEnterprise.name}
{dialogs.selectedEnterprise.code}
{dialogs.selectedEnterprise.type}
{dialogs.selectedEnterprise.province || '-'} {dialogs.selectedEnterprise.city || ''} {dialogs.selectedEnterprise.district || ''}
{dialogs.selectedEnterprise.address || '-'}
{dialogs.selectedEnterprise.registrant || '-'}
{dialogs.selectedEnterprise.contactPhone || '-'}
{/* Other Information */}
{dialogs.selectedEnterprise.companySize || '-'}
{dialogs.selectedEnterprise.registeredCapital || '-'}
{dialogs.selectedEnterprise.establishmentDate || '-'}
{dialogs.selectedEnterprise.invoiceType || '-'}
{dialogs.selectedEnterprise.socialCreditCode ? ( {dialogs.selectedEnterprise.socialCreditCode} ) : '-'}
{dialogs.selectedEnterprise.businessScope || '-'}
{dialogs.selectedEnterprise.submitTime || '-'}
{dialogs.selectedEnterprise.auditTime || '-'}
{/* Bank Information */}
{dialogs.selectedEnterprise.bankAccount ? ( {dialogs.selectedEnterprise.bankAccount} ) : '-'}
{dialogs.selectedEnterprise.bankName || '-'}
{dialogs.selectedEnterprise.bankFullName || '-'}
{dialogs.selectedEnterprise.bankAddress || '-'}
{/* Legal Person Information */}
{dialogs.selectedEnterprise.legalPerson || '-'}
{dialogs.selectedEnterprise.registrant || '-'}
{dialogs.selectedEnterprise.auditor || '-'}
{dialogs.selectedEnterprise.auditComment || '-'}
)}
{/* Status Change Confirmation Dialog */} dispatch({ type: 'TOGGLE_STATUS_DIALOG', payload: open })}> 确认{dialogs.statusAction === 'enable' ? '启用' : '禁用'}企业 {dialogs.statusAction === 'enable' ? ( <> 启用企业 {dialogs.selectedEnterprise?.name} 后,该企业用户将恢复正常登录和使用权限。 ) : ( <> 禁用企业 {dialogs.selectedEnterprise?.name} 后,该企业所有用户将无法登录系统。此操作不会删除企业数据,可随时重新启用。 )} 取消 确认{dialogs.statusAction === 'enable' ? '启用' : '禁用'} {/* Create Enterprise Dialog */} dispatch({ type: 'TOGGLE_ADD_DIALOG', payload: open })} onSuccess={handleCreateSuccess} />
); }