/**
 * filekorolheader: 企业管理 - 企业信息管理与维护页面
 * 功能：企业列表查询、详情查看、状态管理、分页筛选
 * 路径：/central-config/tenant/enterprise-management
 * 规范：遵循crop-x/docs/开发项目规范.md，使用useReducer状态管理，API集成，shadcn语义化样式
 */
'use client';

import { useReducer, useEffect, useMemo } from 'react';
import { Card } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Badge } from '@/components/ui/badge';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
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 { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { ScrollArea } from '@/components/ui/scroll-area';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import { Building2, Eye, Power, PowerOff, Search, FileText, CreditCard, User, RefreshCw, AlertCircle, ChevronLeft, ChevronRight, Plus } from 'lucide-react';
import { toast } from 'sonner';

import { enterpriseReducer, initialState, EnterpriseState, EnterpriseAction } from './components/enterpriseReducer';
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 <Badge className="bg-green-50 dark:bg-green-950 text-green-600 dark:text-green-400 border-green-200 dark:border-green-800 font-light">启用</Badge>;
  }
  return <Badge className="bg-gray-50 dark:bg-gray-950 text-gray-600 dark:text-gray-400 border-gray-200 dark:border-gray-800 font-light">禁用</Badge>;
};

const getAuditStatusBadge = (auditStatus: Enterprise['auditStatus']) => {
  switch (auditStatus) {
    case 'draft':
      return <Badge className="bg-gray-50 dark:bg-gray-950 text-gray-600 dark:text-gray-400 border-gray-200 dark:border-gray-800 font-light">草稿</Badge>;
    case 'pending':
      return <Badge className="bg-yellow-50 dark:bg-yellow-950 text-yellow-600 dark:text-yellow-400 border-yellow-200 dark:border-yellow-800 font-light">待审核</Badge>;
    case 'approved':
      return <Badge className="bg-green-50 dark:bg-green-950 text-green-600 dark:text-green-400 border-green-200 dark:border-green-800 font-light">审核通过</Badge>;
    case 'rejected':
      return <Badge className="bg-red-50 dark:bg-red-950 text-red-600 dark:text-red-400 border-red-200 dark:border-red-800 font-light">已拒绝</Badge>;
    default:
      return <Badge className="bg-gray-50 dark:bg-gray-950 text-gray-600 dark:text-gray-400 border-gray-200 dark:border-gray-800 font-light">草稿</Badge>;
  }
};

export default function EnterpriseManagement() {
  const [state, dispatch] = useReducer(enterpriseReducer, initialState);

  // 加载企业数据
  const loadEnterprises = async (resetPage = false) => {
    try {
      dispatch({ type: 'SET_LOADING', payload: true });

      const params: TenantsQueryParams = {
        search: state.filters.search || undefined,
        audit_status: state.filters.audit_status || undefined,
        page: resetPage ? 1 : state.pagination.page,
        size: state.pagination.size,
        order_by: state.sortBy,
        sort_order: state.sortOrder,
      };

      const response = await fetchTenants(params);
      const transformedData = response.data.map(transformTenantData);

      console.log('API Response:', response);
      console.log('Transformed Data:', transformedData);

      dispatch({
        type: 'SET_ENTERPRISES',
        payload: {
          data: transformedData,
          pagination: {
            page: response.page,
            size: response.size,
            total: response.total,
            totalPages: response.total_pages,
            hasNext: response.has_next,
            hasPrev: response.has_prev,
          }
        }
      });
    } catch (error) {
      console.error('Failed to load enterprises:', error);
      const errorMessage = error instanceof Error ? error.message : '加载企业数据失败';
      dispatch({ type: 'SET_ERROR', payload: errorMessage });
      toast.error(errorMessage);
    }
  };

  // 初始加载
  useEffect(() => {
    loadEnterprises(true);
  }, [state.filters.search, state.filters.audit_status, state.sortBy, state.sortOrder]);

  // 分页加载
  useEffect(() => {
    if (state.pagination.page > 1) {
      loadEnterprises(false);
    }
  }, [state.pagination.page]);

  // 计算统计数据
  const stats = useMemo(() => ({
    total: state.enterprises.length,
    active: state.enterprises.filter(e => e.status === 'active').length,
    inactive: state.enterprises.filter(e => e.status === 'inactive').length,
  }), [state.enterprises]);

  // 事件处理器
  const handleSearch = (value: string) => {
    dispatch({ type: 'SET_FILTERS', payload: { search: value } });
  };

  const handleAuditStatusFilter = (value: string) => {
    dispatch({ type: 'SET_FILTERS', payload: { audit_status: value === 'all' ? '' : value } });
  };

  const handleSort = (sortBy?: string) => {
    const newSortOrder = state.sortBy === sortBy && state.sortOrder === 'desc' ? 'asc' : 'desc';
    dispatch({ type: 'SET_SORT', payload: { sortBy, sortOrder: newSortOrder } });
  };

  const handlePageChange = (page: number) => {
    // 边界检查，确保页码在有效范围内
    if (page < 1) {
      page = 1;
    } else if (page > state.pagination.totalPages && state.pagination.totalPages > 0) {
      page = state.pagination.totalPages;
    }
    dispatch({ type: 'SET_PAGINATION', payload: { page } });
  };

  const handleRefresh = () => {
    dispatch({ type: 'REFRESH_DATA' });
    loadEnterprises(true);
    toast.success('数据已刷新');
  };

  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 handleCreateNew = () => {
    dispatch({ type: 'RESET_FORM_DATA' });
    dispatch({ type: 'TOGGLE_ADD_DIALOG', payload: true });
  };

  const handleCreateSuccess = () => {
    // 创建成功后刷新数据
    loadEnterprises(true);
  };

  const confirmStatusChange = async () => {
    if (!state.selectedEnterprise) return;

    try {
      dispatch({ type: 'SET_LOADING', payload: true });

      const tenantId = state.selectedEnterprise.id;
      let updatedTenant;

      if (state.statusAction === 'enable') {
        updatedTenant = await enableTenant(tenantId);
        toast.success('企业已启用');
      } else {
        updatedTenant = await disableTenant(tenantId);
        toast.success('企业已禁用');
      }

      // 验证返回的数据是否正确更新了状态
      console.log('API返回的更新数据:', updatedTenant);

      // 更新本地状态
      const updatedEnterprise = transformTenantData(updatedTenant);
      dispatch({
        type: 'SET_ENTERPRISES',
        payload: {
          data: state.enterprises.map(ent =>
            ent.id === tenantId ? updatedEnterprise : ent
          ),
          pagination: state.pagination
        }
      });

      dispatch({ type: 'TOGGLE_STATUS_DIALOG', payload: false });

      // 不需要立即刷新，因为本地状态已经更新
      // 如果用户需要看到最新数据，可以手动点击刷新按钮
    } catch (error) {
      console.error('Status change failed:', error);
      const errorMessage = error instanceof Error ? error.message : '状态更新失败';
      toast.error(errorMessage);
    } finally {
      dispatch({ type: 'SET_LOADING', payload: false });
    }
  };

  return (
    <div className="space-y-6">
      {/* Page Header */}
      <Card className="p-6 bg-gradient-to-r from-blue-50 dark:from-blue-950 to-indigo-50 dark:to-indigo-950 border-blue-200 dark:border-blue-800">
        <div className="flex items-start justify-between">
          <div className="flex items-start gap-3">
            <Building2 className="w-6 h-6 text-blue-600 dark:text-blue-400 flex-shrink-0 mt-1" />
            <div className="flex-1">
              <h2 className="mb-2">企业管理</h2>
              <p className="text-sm text-muted-foreground mb-3">
                管理平台所有企业信息，支持查询、查看详情、启用/禁用企业
              </p>
              <div className="flex flex-wrap gap-2">
                <Badge variant="outline" className="bg-white dark:bg-gray-800 font-light">
                  <Search className="w-3 h-3 mr-1" />
                  智能查询
                </Badge>
                <Badge variant="outline" className="bg-white dark:bg-gray-800 font-light">
                  <Power className="w-3 h-3 mr-1" />
                  状态管理
                </Badge>
                <Badge variant="outline" className="bg-white dark:bg-gray-800 font-light">
                  <Eye className="w-3 h-3 mr-1" />
                  详情查看
                </Badge>
              </div>
            </div>
          </div>
          <div className="flex items-center gap-2">
            <Button onClick={handleCreateNew} disabled={state.loading}>
              <Plus className="w-4 h-4 mr-2" />
              新建企业
            </Button>
            <Button variant="outline" size="sm" onClick={handleRefresh} disabled={state.loading}>
              <RefreshCw className={`w-4 h-4 mr-1 ${state.loading ? 'animate-spin' : ''}`} />
              刷新
            </Button>
          </div>
        </div>
      </Card>

      {/* Statistics Cards */}
      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
        <Card className="p-6 bg-card hover:bg-muted transition-colors">
          <div className="flex items-center justify-between mb-2">
            <div className="text-sm text-muted-foreground">企业总数</div>
            <Building2 className="w-5 h-5 text-blue-500" />
          </div>
          <div className="text-3xl font-bold mb-1">{state.pagination.total}</div>
          <div className="text-xs text-muted-foreground">
            全部企业数量
          </div>
        </Card>

        <Card className="p-6 bg-card hover:bg-muted transition-colors">
          <div className="flex items-center justify-between mb-2">
            <div className="text-sm text-muted-foreground">启用企业</div>
            <Power className="w-5 h-5 text-green-500" />
          </div>
          <div className="text-3xl font-bold mb-1 text-green-600 dark:text-green-400">{stats.active}</div>
          <div className="text-xs text-green-600 dark:text-green-400">
            正常运营中
          </div>
        </Card>

        <Card className="p-6 bg-card hover:bg-muted transition-colors">
          <div className="flex items-center justify-between mb-2">
            <div className="text-sm text-muted-foreground">禁用企业</div>
            <PowerOff className="w-5 h-5 text-gray-500" />
          </div>
          <div className="text-3xl font-bold mb-1 text-gray-600 dark:text-gray-400">{stats.inactive}</div>
          <div className="text-xs text-muted-foreground">
            已暂停使用
          </div>
        </Card>
      </div>

      {/* Enterprise List */}
      <Card className="p-6 bg-card">
        <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4 mb-4">
          <h3>企业列表</h3>
          <div className="flex flex-col sm:flex-row gap-2">
            <div className="relative">
              <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-muted-foreground" />
              <Input
                placeholder="搜索企业名称、编码..."
                value={state.filters.search}
                onChange={(e) => handleSearch(e.target.value)}
                className="pl-10 w-64"
              />
            </div>
            <Select value={state.filters.audit_status || 'all'} onValueChange={handleAuditStatusFilter}>
              <SelectTrigger className="w-40">
                <SelectValue placeholder="审核状态" />
              </SelectTrigger>
              <SelectContent>
                <SelectItem value="all">全部状态</SelectItem>
                <SelectItem value="草稿">草稿</SelectItem>
                <SelectItem value="待审核">待审核</SelectItem>
                <SelectItem value="已通过">审核通过</SelectItem>
                <SelectItem value="已拒绝">已拒绝</SelectItem>
              </SelectContent>
            </Select>
          </div>
        </div>

        {/* Error Display */}
        {state.error && (
          <div className="mb-4 p-4 bg-red-50 dark:bg-red-950 border border-red-200 dark:border-red-800 rounded-lg">
            <div className="flex items-center gap-2 text-red-600 dark:text-red-400">
              <AlertCircle className="w-4 h-4" />
              <span>{state.error}</span>
            </div>
          </div>
        )}

        {/* Loading State */}
        {state.loading && (
          <div className="text-center py-12 text-muted-foreground">
            <RefreshCw className="w-8 h-8 mx-auto mb-2 animate-spin" />
            <p>加载中...</p>
          </div>
        )}

        {/* Data Table */}
        {!state.loading && !state.error && (
          <>
            <div className="border rounded-lg overflow-hidden">
              <Table>
                <TableHeader>
                  <TableRow>
                    <TableHead
                      className="cursor-pointer hover:bg-muted"
                      onClick={() => handleSort('tenant_code')}
                    >
                      企业编码
                      {state.sortBy === 'tenant_code' && (
                        <span className="ml-1">{state.sortOrder === 'asc' ? '↑' : '↓'}</span>
                      )}
                    </TableHead>
                    <TableHead
                      className="cursor-pointer hover:bg-muted"
                      onClick={() => handleSort('company_name')}
                    >
                      企业名称
                      {state.sortBy === 'company_name' && (
                        <span className="ml-1">{state.sortOrder === 'asc' ? '↑' : '↓'}</span>
                      )}
                    </TableHead>
                    <TableHead>企业类型</TableHead>
                    <TableHead>登记人</TableHead>
                    <TableHead>联系电话</TableHead>
                    <TableHead
                      className="cursor-pointer hover:bg-muted"
                      onClick={() => handleSort('created_at')}
                    >
                      创建时间
                      {state.sortBy === 'created_at' && (
                        <span className="ml-1">{state.sortOrder === 'asc' ? '↑' : '↓'}</span>
                      )}
                    </TableHead>
                    <TableHead>审核状态</TableHead>
                    <TableHead>状态</TableHead>
                    <TableHead>操作</TableHead>
                  </TableRow>
                </TableHeader>
                <TableBody>
                  {state.enterprises.map((enterprise) => (
                    <TableRow key={enterprise.id}>
                      <TableCell className="font-medium">{enterprise.code}</TableCell>
                      <TableCell>
                        <div className="flex items-center gap-2">
                          <Building2 className="w-4 h-4 text-blue-500" />
                          <span className="font-medium">{enterprise.name}</span>
                        </div>
                      </TableCell>
                      <TableCell>
                        <Badge variant="outline" className="font-light">{enterprise.type}</Badge>
                      </TableCell>
                      <TableCell>{enterprise.registrant || '-'}</TableCell>
                      <TableCell>{enterprise.contactPhone || '-'}</TableCell>
                      <TableCell className="text-sm">{enterprise.createdAt}</TableCell>
                      <TableCell>{getAuditStatusBadge(enterprise.auditStatus)}</TableCell>
                      <TableCell>{getStatusBadge(enterprise.status)}</TableCell>
                      <TableCell>
                        <div className="flex gap-2">
                          <Button
                            size="sm"
                            variant="outline"
                            onClick={() => handleView(enterprise)}
                          >
                            <Eye className="w-3 h-3 mr-1" />
                            查看
                          </Button>
                          {enterprise.status === 'active' ? (
                            <Button
                              size="sm"
                              variant="outline"
                              className="text-gray-600 dark:text-gray-400 border-gray-300 dark:border-gray-600"
                              onClick={() => handleStatusChange(enterprise, 'disable')}
                            >
                              <PowerOff className="w-3 h-3 mr-1" />
                              禁用
                            </Button>
                          ) : (
                            <Button
                              size="sm"
                              variant="outline"
                              className="text-green-600 dark:text-green-400 border-green-300 dark:border-green-600"
                              onClick={() => handleStatusChange(enterprise, 'enable')}
                            >
                              <Power className="w-3 h-3 mr-1" />
                              启用
                            </Button>
                          )}
                        </div>
                      </TableCell>
                    </TableRow>
                  ))}
                </TableBody>
              </Table>
            </div>

            {state.enterprises.length === 0 && (
              <div className="text-center py-12 text-muted-foreground">
                <Building2 className="w-12 h-12 mx-auto mb-4 opacity-20" />
                <p>暂无企业数据</p>
              </div>
            )}

            {/* Pagination */}
            {state.pagination.totalPages > 1 && (
              <div className="flex items-center justify-between mt-4">
                <div className="text-sm text-muted-foreground">
                  显示第 {state.pagination.page} 页，共 {state.pagination.totalPages} 页
                  <span className="ml-2">总计 {state.pagination.total} 条记录</span>
                </div>
                <div className="flex items-center gap-2">
                  <Button
                    variant="outline"
                    size="sm"
                    onClick={() => handlePageChange(state.pagination.page - 1)}
                    disabled={!state.pagination.hasPrev || state.loading}
                  >
                    <ChevronLeft className="w-4 h-4" />
                    上一页
                  </Button>
                  <span className="text-sm font-medium px-2">
                    {state.pagination.page} / {state.pagination.totalPages}
                  </span>
                  <Button
                    variant="outline"
                    size="sm"
                    onClick={() => handlePageChange(state.pagination.page + 1)}
                    disabled={!state.pagination.hasNext || state.loading}
                  >
                    下一页
                    <ChevronRight className="w-4 h-4" />
                  </Button>
                </div>
              </div>
            )}
          </>
        )}
      </Card>

      {/* View Enterprise Details Dialog */}
      <Dialog open={state.showViewDialog} onOpenChange={(open) => dispatch({ type: 'TOGGLE_VIEW_DIALOG', payload: open })}>
        <DialogContent className="w-[80vw] max-w-6xl max-h-[90vh]">
          <DialogHeader>
            <div className="flex items-center justify-between pr-8">
              <DialogTitle>企业详情</DialogTitle>
              {state.selectedEnterprise && (
                <div className="flex gap-2">
                  {getAuditStatusBadge(state.selectedEnterprise.auditStatus)}
                  {getStatusBadge(state.selectedEnterprise.status)}
                </div>
              )}
            </div>
            <DialogDescription className="sr-only">
              查看企业的详细信息
            </DialogDescription>
          </DialogHeader>
          {state.selectedEnterprise && (
            <ScrollArea className="max-h-[calc(90vh-200px)]">
              <Tabs defaultValue="basic" className="space-y-4">
                <TabsList className="grid grid-cols-4 w-full">
                  <TabsTrigger value="basic">
                    <Building2 className="w-4 h-4 mr-2" />
                    基本信息
                  </TabsTrigger>
                  <TabsTrigger value="other">
                    <FileText className="w-4 h-4 mr-2" />
                    其他信息
                  </TabsTrigger>
                  <TabsTrigger value="bank">
                    <CreditCard className="w-4 h-4 mr-2" />
                    开户信息
                  </TabsTrigger>
                  <TabsTrigger value="legal">
                    <User className="w-4 h-4 mr-2" />
                    法人信息
                  </TabsTrigger>
                </TabsList>

                {/* Basic Information */}
                <TabsContent value="basic" className="space-y-4">
                  <div className="grid grid-cols-2 gap-6">
                    <div>
                      <Label>企业名称</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.name}</div>
                    </div>
                    <div>
                      <Label>企业编码</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.code}</div>
                    </div>
                    <div>
                      <Label>企业类型</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.type}</div>
                    </div>
                    <div>
                      <Label>所在地区</Label>
                      <div className="field-value p-2 bg-muted rounded">
                        {state.selectedEnterprise.province || '-'} {state.selectedEnterprise.city || ''} {state.selectedEnterprise.district || ''}
                      </div>
                    </div>
                    <div className="col-span-2">
                      <Label>详细地址</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.address || '-'}</div>
                    </div>
                    <div>
                      <Label>登记人</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.registrant || '-'}</div>
                    </div>
                    <div>
                      <Label>联系电话</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.contactPhone || '-'}</div>
                    </div>
                  </div>
                </TabsContent>

                {/* Other Information */}
                <TabsContent value="other" className="space-y-4">
                  <div className="grid grid-cols-2 gap-6">
                    <div>
                      <Label>公司规模</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.companySize || '-'}</div>
                    </div>
                    <div>
                      <Label>注册资本</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.registeredCapital || '-'}</div>
                    </div>
                    <div>
                      <Label>成立时间</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.establishmentDate || '-'}</div>
                    </div>
                    <div>
                      <Label>发票类型</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.invoiceType || '-'}</div>
                    </div>
                    <div className="col-span-2">
                      <Label>社会信用代码</Label>
                      <div className="field-value p-2 bg-muted rounded">
                        {state.selectedEnterprise.socialCreditCode ? (
                          <code className="text-sm font-mono">
                            {state.selectedEnterprise.socialCreditCode}
                          </code>
                        ) : '-'}
                      </div>
                    </div>
                    <div className="col-span-2">
                      <Label>经营范围</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.businessScope || '-'}</div>
                    </div>
                    <div>
                      <Label>提交时间</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.submitTime || '-'}</div>
                    </div>
                    <div>
                      <Label>审核时间</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.auditTime || '-'}</div>
                    </div>
                  </div>
                </TabsContent>

                {/* Bank Information */}
                <TabsContent value="bank" className="space-y-4">
                  <div className="grid grid-cols-2 gap-6">
                    <div>
                      <Label>银行账号</Label>
                      <div className="field-value p-2 bg-muted rounded">
                        {state.selectedEnterprise.bankAccount ? (
                          <code className="text-sm font-mono">
                            {state.selectedEnterprise.bankAccount}
                          </code>
                        ) : '-'}
                      </div>
                    </div>
                    <div>
                      <Label>开户行</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.bankName || '-'}</div>
                    </div>
                    <div className="col-span-2">
                      <Label>开户行全称</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.bankFullName || '-'}</div>
                    </div>
                    <div className="col-span-2">
                      <Label>开户行地址</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.bankAddress || '-'}</div>
                    </div>
                  </div>
                </TabsContent>

                {/* Legal Person Information */}
                <TabsContent value="legal" className="space-y-4">
                  <div className="grid grid-cols-2 gap-6">
                    <div>
                      <Label>法人姓名</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.legalPerson || '-'}</div>
                    </div>
                    <div>
                      <Label>联系人</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.registrant || '-'}</div>
                    </div>
                    <div>
                      <Label>审核人</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.auditor || '-'}</div>
                    </div>
                    <div>
                      <Label>审核意见</Label>
                      <div className="field-value p-2 bg-muted rounded">{state.selectedEnterprise.auditComment || '-'}</div>
                    </div>
                  </div>
                </TabsContent>
              </Tabs>
            </ScrollArea>
          )}
          <DialogFooter>
            <Button variant="outline" onClick={() => dispatch({ type: 'TOGGLE_VIEW_DIALOG', payload: false })}>
              关闭
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>

      {/* Status Change Confirmation Dialog */}
      <AlertDialog open={state.showStatusDialog} onOpenChange={(open) => dispatch({ type: 'TOGGLE_STATUS_DIALOG', payload: open })}>
        <AlertDialogContent className="w-[80vw] max-w-md">
          <AlertDialogHeader>
            <AlertDialogTitle>
              确认{state.statusAction === 'enable' ? '启用' : '禁用'}企业
            </AlertDialogTitle>
            <AlertDialogDescription>
              {state.statusAction === 'enable' ? (
                <>
                  启用企业 <strong>{state.selectedEnterprise?.name}</strong> 后，该企业用户将恢复正常登录和使用权限。
                </>
              ) : (
                <>
                  禁用企业 <strong>{state.selectedEnterprise?.name}</strong> 后，该企业所有用户将无法登录系统。此操作不会删除企业数据，可随时重新启用。
                </>
              )}
            </AlertDialogDescription>
          </AlertDialogHeader>
          <AlertDialogFooter>
            <AlertDialogCancel>取消</AlertDialogCancel>
            <AlertDialogAction
              onClick={confirmStatusChange}
              className={state.statusAction === 'enable' ? 'bg-green-600 hover:bg-green-700' : 'bg-gray-600 hover:bg-gray-700'}
            >
              确认{state.statusAction === 'enable' ? '启用' : '禁用'}
            </AlertDialogAction>
          </AlertDialogFooter>
        </AlertDialogContent>
      </AlertDialog>

      {/* Create Enterprise Dialog */}
      <CreateEnterpriseDialog
        open={state.showAddDialog}
        onOpenChange={(open) => dispatch({ type: 'TOGGLE_ADD_DIALOG', payload: open })}
        onSuccess={handleCreateSuccess}
      />
    </div>
  );
}