27 KiB

Raw Permalink Blame History

Genex Web 管理前端开发指南

平台管理后台（Admin Dashboard） — React + TypeScript + Next.js

1. 技术栈

技术	版本	用途
React	18.x	UI框架
TypeScript	5.x	类型安全
Next.js	14.x	SSR/SSG + App Router
Zustand	4.x	轻量状态管理（UI状态）
Redux Toolkit	2.x	复杂业务状态（交易、审核流程）
RTK Query	内置	API数据获取与缓存
Ant Design	5.x	企业级UI组件库
ECharts / Recharts	最新	数据可视化
TanStack Table	8.x	高性能数据表格
React Hook Form	7.x	表单管理
Zod	3.x	运行时类型校验

2. 项目结构

genex-admin/
├── src/
│   ├── app/                          # Next.js App Router
│   │   ├── layout.tsx                # 根布局
│   │   ├── page.tsx                  # Dashboard首页
│   │   ├── (auth)/                   # 认证路由组
│   │   │   ├── login/page.tsx
│   │   │   └── layout.tsx
│   │   ├── (dashboard)/              # 管理面板路由组
│   │   │   ├── layout.tsx            # 侧边栏+顶栏布局
│   │   │   ├── users/                # 用户管理
│   │   │   ├── issuers/              # 发行方管理
│   │   │   ├── coupons/              # 券管理
│   │   │   ├── trading/              # 交易监控
│   │   │   ├── compliance/           # 合规管理
│   │   │   ├── risk/                 # 风控中心
│   │   │   ├── finance/              # 财务管理
│   │   │   ├── chain/                # 链上监控
│   │   │   └── system/               # 系统管理
│   ├── components/
│   │   ├── ui/                       # 基础UI组件
│   │   ├── business/                 # 业务组件
│   │   └── ai-agent/                 # AI Agent组件
│   ├── features/                     # 功能模块（Redux slices）
│   │   ├── auth/
│   │   ├── users/
│   │   ├── issuers/
│   │   ├── coupons/
│   │   ├── trading/
│   │   ├── compliance/
│   │   └── risk/
│   ├── services/                     # API服务层
│   │   ├── api.ts                    # RTK Query base API
│   │   └── endpoints/                # 按模块分的API端点
│   ├── stores/                       # Zustand stores
│   │   ├── ui-store.ts               # UI状态（侧边栏、主题）
│   │   └── ai-agent-store.ts         # AI Agent状态
│   ├── hooks/                        # 自定义Hooks
│   ├── lib/                          # 工具函数
│   │   ├── constants.ts
│   │   ├── utils.ts
│   │   └── types.ts
│   └── styles/                       # 全局样式
├── public/
├── tests/
├── next.config.js
├── tailwind.config.ts
└── package.json

3. 状态管理策略

Zustand vs Redux Toolkit 分工

类型	工具	场景
UI状态	Zustand	侧边栏折叠、主题切换、弹窗控制
服务端数据	RTK Query	API数据获取、缓存、自动刷新
复杂业务流	Redux Toolkit	审核流程、交易状态机、多步骤表单
AI Agent	Zustand	对话历史、Agent面板状态

3.1 RTK Query API定义

// src/services/api.ts
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';

export const api = createApi({
  baseQuery: fetchBaseQuery({
    baseUrl: '/api/v1',
    prepareHeaders: (headers) => {
      const token = getToken();
      if (token) headers.set('Authorization', `Bearer ${token}`);
      return headers;
    },
  }),
  tagTypes: ['Users', 'Issuers', 'Coupons', 'Orders', 'Compliance'],
  endpoints: () => ({}),
});

// src/services/endpoints/issuers.ts
export const issuerApi = api.injectEndpoints({
  endpoints: (builder) => ({
    getIssuers: builder.query<PaginatedResult<Issuer>, IssuerQuery>({
      query: (params) => ({ url: '/issuers', params }),
      providesTags: ['Issuers'],
    }),
    approveIssuer: builder.mutation<void, { id: string; decision: 'approve' | 'reject' }>({
      query: ({ id, ...body }) => ({
        url: `/issuers/${id}/review`,
        method: 'POST',
        body,
      }),
      invalidatesTags: ['Issuers'],
    }),
  }),
});

3.2 Zustand UI Store

// src/stores/ui-store.ts
import { create } from 'zustand';

interface UiState {
  sidebarCollapsed: boolean;
  theme: 'light' | 'dark';
  toggleSidebar: () => void;
  setTheme: (theme: 'light' | 'dark') => void;
}

export const useUiStore = create<UiState>((set) => ({
  sidebarCollapsed: false,
  theme: 'light',
  toggleSidebar: () => set((s) => ({ sidebarCollapsed: !s.sidebarCollapsed })),
  setTheme: (theme) => set({ theme }),
}));

4. 核心页面模块

4.1 Dashboard 首页

关键指标卡片：日交易量、活跃用户、新发行方、待审核数
交易量趋势图（ECharts线图）
异常交易告警列表
AI洞察面板

4.2 用户管理

用户列表（TanStack Table，支持搜索/排序/分页）
KYC审核详情
用户资产查看（我的券、余额、交易记录）
风控标记用户处理

4.3 发行方管理

// 发行方审核流程
interface IssuerReview {
  issuerId: string;
  companyName: string;
  businessLicense: string;
  documents: Document[];
  creditRating: CreditRating;
  aiRiskScore: number;          // AI预审风险分
  aiRiskFlags: string[];        // AI标记的风险点
  reviewStatus: 'pending' | 'approved' | 'rejected';
}

功能	说明
入驻审核	AI预审+人工复核，标记风险点
信用管理	查看/调整信用评级，额度管理
发行监控	发行量、兑付率、Breakage率监控
违约处理	降级、冻结发行、账户冻结

4.4 交易监控

实时交易流（WebSocket推送）
订单簿深度图
异常交易检测告警
做市商活动监控

4.5 合规管理

interface ComplianceCase {
  id: string;
  type: 'KYC' | 'AML' | 'OFAC' | 'TravelRule';
  severity: 'low' | 'medium' | 'high' | 'critical';
  status: 'open' | 'investigating' | 'resolved' | 'escalated';
  aiAnalysis: string;           // AI合规分析
  suggestedAction: string;      // AI建议操作
}

4.6 风控中心

风控仪表盘（实时风险指标）
异常交易图谱（关联分析可视化）
自动冻结记录
SAR（可疑交易报告）管理

4.7 系统管理

页面	功能
管理员账号	管理员列表、RBAC角色权限、操作日志
系统配置	手续费率、KYC阈值、交易限额
合约管理	合约部署状态、升级提案、升级日志
系统监控	服务健康、API响应时间、Genex Chain节点状态

5. AI Agent 集成

5.1 管理端AI Agent功能

场景	AI能力	UI实现
风险预警	实时检测异常交易模式	仪表盘AI警告卡片+处理建议
审核辅助	AI预审发行方资料，标记风险点	审核页面AI评分+风险标签
合规报告	自动生成SAR/CTR/监管报表草稿	合规报表页AI生成按钮
运营洞察	分析运营数据，提出优化建议	Dashboard AI洞察面板
智能搜索	自然语言查询用户/订单/交易	全局搜索框支持NL查询
决策支持	手续费率调整建议、额度配置建议	系统配置页AI建议标签

5.2 AI Agent侧边面板

// src/components/ai-agent/AgentPanel.tsx
export function AgentPanel() {
  const { messages, sendMessage, isStreaming } = useAgentChat();

  return (
    <Drawer title="AI助手" placement="right" width={400}>
      <ChatMessageList messages={messages} />
      {isStreaming && <StreamingIndicator />}
      <ChatInput onSend={sendMessage} placeholder="描述你要查询或分析的内容..." />
    </Drawer>
  );
}

6. 权限管理（RBAC）

// 角色定义
enum AdminRole {
  SuperAdmin = 'super_admin',     // 超级管理员：全部权限
  OperationAdmin = 'ops_admin',   // 运营管理员：用户+发行方+券管理
  ComplianceOfficer = 'compliance', // 合规官：合规+风控
  FinanceAdmin = 'finance_admin', // 财务管理员：财务+结算
  Viewer = 'viewer',              // 只读：仅查看Dashboard
}

// 路由守卫
function AuthGuard({ children, requiredRole }: GuardProps) {
  const { user } = useAuth();
  if (!hasPermission(user.role, requiredRole)) {
    return <ForbiddenPage />;
  }
  return children;
}

7. 实时数据

// WebSocket连接管理
class AdminWebSocket {
  private ws: WebSocket;

  connect() {
    this.ws = new WebSocket('wss://api.gogenex.com/admin/ws');
    this.ws.onmessage = (event) => {
      const data = JSON.parse(event.data);
      switch (data.type) {
        case 'trade_alert':
          store.dispatch(addTradeAlert(data.payload));
          break;
        case 'risk_warning':
          store.dispatch(addRiskWarning(data.payload));
          break;
        case 'chain_event':
          store.dispatch(updateChainStatus(data.payload));
          break;
      }
    };
  }
}

8. 测试策略

类型	工具	覆盖
单元测试	Vitest	Redux slices、工具函数、Hooks
组件测试	React Testing Library	关键表单、表格、弹窗
E2E测试	Playwright	审核流程、配置变更、报表导出

9. 部署

# Next.js部署配置
# Docker + Kubernetes
FROM node:20-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build

FROM node:20-alpine
WORKDIR /app
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/public ./public
COPY --from=builder /app/package.json ./
RUN npm ci --production
EXPOSE 3000
CMD ["npm", "start"]

10. 数据报表与分析

10.1 平台数据报表

// src/features/reports/types.ts
interface PlatformReport {
  type: 'daily' | 'monthly' | 'quarterly';
  metrics: {
    totalTransactionVolume: number;
    totalTransactionAmount: number;
    activeUsers: number;
    newIssuers: number;
    avgDiscountRate: number;
    platformRevenue: number; // 手续费收入
    breakageRevenue: number;
  };
}

10.2 用户行为分析

// src/features/analytics/user-analytics.ts
interface UserBehaviorAnalytics {
  registrationFunnel: FunnelData;      // 注册→KYC→首次交易转化率
  retentionRate: RetentionData;        // 留存率（日/周/月）
  activeUserTrend: TimeSeriesData;     // DAU/WAU/MAU
  tradingPatterns: TradingPatternData; // 交易行为模式
  kycLevelDistribution: PieData;       // KYC等级分布
  walletModeDistribution: PieData;     // 标准/Pro模式占比
}

10.3 券类别分析

// src/features/analytics/coupon-analytics.ts
interface CouponCategoryAnalytics {
  byIndustry: CategoryBreakdown[];    // 按行业（餐饮/购物/娱乐）
  byTemplate: CategoryBreakdown[];    // 按模板（满减/折扣/礼品卡/储值）
  byIssuerTier: CategoryBreakdown[];  // 按发行方层级
  redemptionByCategory: BarData;      // 各品类兑付率
  breakageByCategory: BarData;        // 各品类Breakage率
  priceDistribution: HistogramData;   // 价格分布
}

11. 税务合规报表

11.1 IRS 1099报表管理

// src/features/compliance/tax-reports.ts
interface Tax1099Management {
  // IRS Form 1099-DA/1099-B 生成与管理
  generateBatch: (taxYear: number) => Promise<Tax1099Report[]>;
  reviewReport: (reportId: string) => Promise<Tax1099Report>;
  submitToIRS: (reportIds: string[]) => Promise<SubmissionResult>;
  userPortalExport: (userId: string, taxYear: number) => Promise<TaxDocument>;
}

// 1099报表页面
export function Tax1099Page() {
  const [taxYear, setTaxYear] = useState(2025);
  const reports = useQuery(['tax1099', taxYear], () => taxApi.getReports(taxYear));

  return (
    <div>
      <YearSelector value={taxYear} onChange={setTaxYear} />
      <StatsCards>
        <Card title="需生成1099" value={reports.pendingCount} />
        <Card title="已生成" value={reports.generatedCount} />
        <Card title="已提交IRS" value={reports.submittedCount} />
      </StatsCards>
      <Button onClick={() => taxApi.generateBatch(taxYear)}>批量生成1099</Button>
      <TanStackTable data={reports.data} columns={tax1099Columns} />
    </div>
  );
}

11.2 FATCA跨境税务

interface FatcaReport {
  foreignAccountHolders: ForeignUser[];
  totalUsSourceIncome: number;
  reportingStatus: 'pending' | 'submitted';
}

12. 消费者保护与虚假宣传监控

// src/features/compliance/consumer-protection.ts
interface ConsumerProtectionCase {
  id: string;
  type: 'misleading_description' | 'false_advertising' | 'undisclosed_conditions';
  couponId: string;
  issuerId: string;
  reportedBy: 'user' | 'ai_scan' | 'admin';
  evidence: {
    couponDescription: string;        // 券描述
    actualRedemptionInfo: string;     // 实际兑付情况
    discrepancy: string;              // 差异说明
  };
  status: 'reported' | 'investigating' | 'confirmed' | 'dismissed';
  action: 'warning' | 'delist' | 'suspend_issuer' | 'none';
}

// AI扫描券描述一致性
export function FalseAdvertisingMonitor() {
  return (
    <div>
      <h3>虚假宣传监控</h3>
      {/* AI自动扫描所有上架券的描述 vs 实际兑付记录 */}
      <AlertList alerts={consumerProtectionAlerts} />
      {/* 手动审查队列 */}
      <CaseQueue cases={pendingCases} onResolve={handleResolve} />
    </div>
  );
}

13. SOX审计模块

// src/features/compliance/sox-audit.ts
interface SoxAuditDashboard {
  // Section 302: CEO/CFO认证追踪
  certifications: CertificationRecord[];
  // Section 404: 内部控制评估
  internalControls: InternalControlAssessment[];
  // 智能合约升级审计追踪
  contractUpgradeAudit: ContractUpgradeLog[];
  // 链上记录与GAAP对账
  chainToGaapReconciliation: ReconciliationReport;
}

interface ContractUpgradeLog {
  proposalId: string;
  contractName: string;
  oldImplementation: string;
  newImplementation: string;
  proposedBy: string;
  approvedBy: string[];           // 多签审批人
  timelockExpiry: Date;
  executedAt: Date;
  auditReport: string;           // 第三方审计报告链接
}

// SOX审计页面
export function SoxAuditPage() {
  return (
    <Tabs>
      <Tab label="内部控制">
        <InternalControlMatrix />
      </Tab>
      <Tab label="合约升级日志">
        <ContractUpgradeAuditTrail />
      </Tab>
      <Tab label="链上对账">
        <ChainGaapReconciliation />
      </Tab>
      <Tab label="操作审计日志">
        <AuditLogViewer />  {/* 全链路操作日志，append-only */}
      </Tab>
    </Tabs>
  );
}

14. 财务管理

14.1 手续费管理

// src/features/finance/fee-management.ts
interface FeeConfiguration {
  tradingFees: {
    takerBuy: number;    // 0.5%
    takerSell: number;
    makerBuy: number;    // 0.1%
    makerSell: number;
  };
  issuanceFees: Record<IssuerTier, number>;
  breakageSharePercent: number; // 平台Breakage分润比例
}

// 手续费收入仪表盘
export function FeeRevenueDashboard() {
  return (
    <div>
      <RevenueCards>
        <Card title="交易手续费" value={tradingFeeRevenue} />
        <Card title="发行服务费" value={issuanceFeeRevenue} />
        <Card title="Breakage分润" value={breakageRevenue} />
        <Card title="增值服务" value={vasRevenue} />
      </RevenueCards>
      <RevenueChart data={revenueTimeSeries} />
    </div>
  );
}

14.2 结算管理

// 发行方结算管理
interface SettlementManagement {
  pendingSettlements: SettlementBatch[];
  completedSettlements: SettlementBatch[];
  issuerBalances: IssuerBalance[];
  withdrawalRequests: WithdrawalRequest[];
}

15. 争议与仲裁处理

// src/features/disputes/types.ts
interface DisputeCase {
  id: string;
  type: 'buyer_complaint' | 'seller_complaint' | 'refund_request';
  status: 'submitted' | 'evidence_collection' | 'arbitration' | 'resolved' | 'escalated';
  orderId: string;
  buyerId: string;
  sellerId: string;
  chainEvidence: {
    txHash: string;
    blockNumber: number;
    timestamp: Date;
    transferRecord: string;
  };
  sla: {
    responseDeadline: Date;    // 24h响应
    resolutionDeadline: Date;  // 72h处理
  };
  arbitrationDecision?: {
    decidedBy: string;
    decision: 'refund' | 'reject' | 'partial_refund';
    reason: string;
  };
}

// 争议处理页面
export function DisputeManagementPage() {
  return (
    <div>
      <SlaOverview />
      <DisputeList
        columns={[
          { key: 'id', title: '工单号' },
          { key: 'type', title: '类型' },
          { key: 'status', title: '状态' },
          { key: 'sla', title: 'SLA倒计时', render: (sla) => <SlaCountdown deadline={sla.resolutionDeadline} /> },
          { key: 'actions', title: '操作', render: (_, row) => <ArbitrationActions dispute={row} /> },
        ]}
      />
    </div>
  );
}

16. Web商户核销后台

// src/app/(dashboard)/merchant-redemption/page.tsx
// 门店管理员通过浏览器核销+查看核销记录
export default function MerchantRedemptionPage() {
  return (
    <div>
      <h2>Web端核销后台</h2>

      {/* 输码核销 */}
      <Card title="核销券">
        <Input placeholder="输入券码" />
        <Button type="primary">查询并核销</Button>
      </Card>

      {/* 核销记录 */}
      <Card title="核销记录">
        <DateRangePicker />
        <TanStackTable
          data={redemptionRecords}
          columns={[
            { key: 'couponCode', title: '券码' },
            { key: 'couponName', title: '券名' },
            { key: 'faceValue', title: '面值' },
            { key: 'operator', title: '核销员' },
            { key: 'store', title: '门店' },
            { key: 'time', title: '核销时间' },
            { key: 'status', title: '状态' },
          ]}
        />
      </Card>

      {/* 门店数据汇总 */}
      <StoreRedemptionStats />
    </div>
  );
}

17. 做市商管理

// src/features/trading/market-maker-management.ts
interface MarketMakerManagement {
  marketMakers: MarketMaker[];
  obligations: MarketMakerObligation[];
  performanceMetrics: MmPerformanceMetric[];
  violationAlerts: MmViolation[];
}

// 做市商活动监控页面
export function MarketMakerMonitorPage() {
  return (
    <div>
      <h3>做市商监控</h3>
      <MmPerformanceTable data={marketMakers} />
      {/* Spoofing/Layering检测告警 */}
      <ManipulationAlerts alerts={spoofingAlerts} />
      {/* 做市义务合规检查 */}
      <ObligationComplianceCheck />
    </div>
  );
}

18. Nasdaq上市合规管理

18.1 SEC Filing管理

// src/features/compliance/sec-filing.ts
interface SecFiling {
  type: '10-K' | '10-Q' | '8-K' | 'S-1' | 'Form ATS' | 'Form ATS-N';
  status: 'drafting' | 'internal_review' | 'legal_review' | 'filed' | 'accepted';
  period?: string;            // 报告期间（如 "FY2027", "Q1 2027"）
  dueDate: Date;
  filedDate?: Date;
  preparedBy: string;
  reviewedBy: string[];
  secEdgarLink?: string;       // SEC EDGAR提交链接
  attachments: FilingAttachment[];
}

interface FilingSchedule {
  annual: { type: '10-K', deadline: '年度结束后60天（加速申报人）' };
  quarterly: { type: '10-Q', deadline: '季度结束后40天' };
  materialEvent: { type: '8-K', deadline: '事件发生后4个工作日' };
}

// SEC Filing管理页面
export function SecFilingManagementPage() {
  return (
    <div>
      <h2>SEC Filing管理</h2>

      {/* Filing日历 */}
      <Card title="申报日历">
        <FilingCalendar
          filings={upcomingFilings}
          onSelect={(filing) => openFilingDetail(filing)}
        />
      </Card>

      {/* 10-K/10-Q编制追踪 */}
      <Card title="定期报告">
        <TanStackTable
          data={periodicFilings}
          columns={[
            { key: 'type', title: '类型' },
            { key: 'period', title: '报告期' },
            { key: 'status', title: '状态', render: (s) => <FilingStatusBadge status={s} /> },
            { key: 'dueDate', title: '截止日期', render: (d) => <DueDateCountdown date={d} /> },
            { key: 'preparedBy', title: '编制人' },
            { key: 'actions', title: '操作', render: (_, row) => (
              <>
                <Button onClick={() => openDraft(row)}>编辑</Button>
                <Button onClick={() => submitForReview(row)}>提交审核</Button>
              </>
            )},
          ]}
        />
      </Card>

      {/* 8-K重大事件快速申报 */}
      <Card title="8-K重大事件">
        <Button type="primary" onClick={create8K}>新建8-K申报</Button>
        <EventList events={materialEvents} />
      </Card>
    </div>
  );
}

18.2 牌照与注册管理

// src/features/compliance/license-management.ts
interface LicenseRecord {
  type: 'MSB' | 'MTL' | 'BitLicense' | 'DFAL' | 'Broker-Dealer' | 'Form ATS';
  jurisdiction: string;       // 联邦 / 州名
  regulatoryBody: string;     // FinCEN / NYDFS / SEC等
  status: 'active' | 'pending' | 'expired' | 'not_applied';
  obtainedDate?: Date;
  expiryDate?: Date;
  renewalDate?: Date;
  applicationRef?: string;
  notes: string;
}

// 牌照看板
export function LicenseDashboardPage() {
  return (
    <div>
      <h2>牌照与注册状态</h2>

      {/* 联邦级牌照 */}
      <Card title="联邦级">
        <LicenseStatusCard license={msbLicense} icon="federal" />
      </Card>

      {/* 州级MTL地图 */}
      <Card title="州级MTL覆盖">
        <UsStateMap
          data={stateLicenses}
          colorScale={{
            active: 'green',
            pending: 'yellow',
            not_applied: 'gray',
            restricted: 'red',
          }}
          onClick={(state) => openStateDetail(state)}
        />
        <StateLicenseTable data={stateLicenses} />
      </Card>

      {/* 到期提醒 */}
      <Card title="续期提醒">
        <RenewalAlertList licenses={expiringLicenses} />
      </Card>
    </div>
  );
}

18.3 商业保险管理

// src/features/compliance/insurance-management.ts
interface InsurancePolicy {
  type: 'D&O' | 'E&O' | 'CYBER' | 'FIDELITY' | 'GL';
  name: string;
  carrier: string;
  policyNumber: string;
  coverageAmount: number;
  annualPremium: number;
  effectiveDate: Date;
  expiryDate: Date;
  status: 'active' | 'expiring_soon' | 'expired' | 'not_purchased';
  isAdequate: boolean;        // 覆盖额度是否满足要求
}

// 保险管理页面
export function InsuranceManagementPage() {
  return (
    <div>
      <h2>商业保险管理</h2>

      {/* 保险概览卡片 */}
      <Row gutter={16}>
        {insurancePolicies.map(policy => (
          <Col span={8} key={policy.type}>
            <InsurancePolicyCard
              policy={policy}
              required={requiredPolicies[policy.type]}
            />
          </Col>
        ))}
      </Row>

      {/* 保险充足性分析 */}
      <Card title="覆盖充足性">
        <CoverageAdequacyChart
          policies={insurancePolicies}
          benchmarks={industryBenchmarks}
        />
      </Card>

      {/* 到期/续期日历 */}
      <Card title="续期日历">
        <InsuranceRenewalCalendar policies={insurancePolicies} />
      </Card>
    </div>
  );
}

18.4 IPO准备清单

// src/features/compliance/ipo-readiness.ts
interface IpoChecklistItem {
  category: 'legal' | 'financial' | 'compliance' | 'governance' | 'insurance' | 'technical';
  item: string;
  status: 'completed' | 'in_progress' | 'not_started' | 'blocked';
  owner: string;
  targetDate: Date;
  dependencies: string[];
  notes: string;
}

// IPO准备看板
export function IpoReadinessPage() {
  const categories = [
    {
      name: '法律与牌照',
      items: [
        { item: 'MSB注册（FinCEN Form 107）', status: 'completed' },
        { item: '州级MTL（49州+DC）', status: 'in_progress' },
        { item: 'NY BitLicense', status: 'in_progress' },
        { item: '券法律属性意见书', status: 'not_started' },
        { item: 'GNX代币法律分类', status: 'not_started' },
      ],
    },
    {
      name: '财务与审计',
      items: [
        { item: '聘请PCAOB注册审计师', status: 'not_started' },
        { item: '2年+经审计GAAP财报', status: 'not_started' },
        { item: 'FASB ASU 2023-08数字资产会计', status: 'not_started' },
        { item: 'ASC 606收入确认（Breakage/递延负债）', status: 'in_progress' },
        { item: '链上数据与GAAP对账机制', status: 'in_progress' },
      ],
    },
    {
      name: 'SOX合规',
      items: [
        { item: 'Section 302 CEO/CFO认证流程', status: 'in_progress' },
        { item: 'Section 404(a) 内部控制评估', status: 'not_started' },
        { item: 'Section 404(b) 外部审计师审计', status: 'not_started' },
        { item: '智能合约升级审计追踪', status: 'completed' },
      ],
    },
    {
      name: '公司治理',
      items: [
        { item: '独立董事（多数席位）', status: 'not_started' },
        { item: '审计委员会（全部独立董事）', status: 'not_started' },
        { item: '薪酬委员会', status: 'not_started' },
        { item: 'SEC注册声明（Form S-1）', status: 'not_started' },
      ],
    },
    {
      name: '商业保险',
      items: [
        { item: 'D&O保险（匹配市值）', status: 'not_started' },
        { item: 'E&O专业责任险', status: 'not_started' },
        { item: '网络安全险（覆盖数字资产托管）', status: 'not_started' },
        { item: '忠诚保证金', status: 'not_started' },
      ],
    },
  ];

  return (
    <div>
      <h2>IPO准备清单</h2>
      <OverallProgress categories={categories} />
      {categories.map(cat => (
        <Card key={cat.name} title={cat.name}>
          <ChecklistTable items={cat.items} />
        </Card>
      ))}
      <TimelineGantt categories={categories} ipoTargetDate={ipoTarget} />
    </div>
  );
}

文档版本: v2.1 基于: Genex 券交易平台 - 软件需求规格说明书 v4.1 技术栈: React 18 + TypeScript 5 + Next.js 14 + Zustand + Redux Toolkit 更新: v2.1补充Nasdaq上市合规管理（SEC Filing/牌照管理/商业保险/IPO准备清单）

27 KiB Raw Permalink Blame History Unescape Escape

Genex Web 管理前端开发指南

1. 技术栈

2. 项目结构

3. 状态管理策略

Zustand vs Redux Toolkit 分工

3.1 RTK Query API定义

3.2 Zustand UI Store

4. 核心页面模块

4.1 Dashboard 首页

4.2 用户管理

4.3 发行方管理

4.4 交易监控

4.5 合规管理

4.6 风控中心

4.7 系统管理

5. AI Agent 集成

5.1 管理端AI Agent功能

5.2 AI Agent侧边面板

6. 权限管理（RBAC）

7. 实时数据

8. 测试策略

9. 部署

10. 数据报表与分析

10.1 平台数据报表

10.2 用户行为分析

10.3 券类别分析

11. 税务合规报表

11.1 IRS 1099报表管理

11.2 FATCA跨境税务

12. 消费者保护与虚假宣传监控

13. SOX审计模块

14. 财务管理

14.1 手续费管理

14.2 结算管理

15. 争议与仲裁处理

16. Web商户核销后台

17. 做市商管理

18. Nasdaq上市合规管理

18.1 SEC Filing管理

18.2 牌照与注册管理

18.3 商业保险管理

18.4 IPO准备清单

27 KiB

Raw Permalink Blame History