feat: wire admin workflows to real APIs

src/apps/admin/AdminTemplateAuditPage.tsx

@@ -1,35 +1,53 @@
-import { useMemo, useState } from 'react';
-import { Check, X } from 'lucide-react';
-import { Breadcrumb, Button, Table, Tag, type TableColumn } from '@/components/ui';
-import { adminService } from '@/mock';
-import type { AuditItem, AuditStatus } from '@/mock';
+import { useEffect, useMemo, useState } from 'react';
+import { Check, Search, X } from 'lucide-react';
+import { Breadcrumb, Button, Input, Select, Table, Tag, type TableColumn } from '@/components/ui';
+import { adminApi, type SmsTemplateAudit } from '@/api/adminApi';
 
-const applicationMap: Record<string, string> = {
-  'AUD-2401': '验证码服务',
-  'AUD-2403': '营销推广平台',
-};
-
-const auditStatusLabelMap: Record<AuditStatus, string> = {
+const auditStatusLabelMap: Record<string, string> = {
   pending: '待审核',
   approved: '已通过',
   rejected: '已驳回',
+  draft: '草稿',
 };
 
+const statusOptions = [
+  { label: '全部状态', value: 'all' },
+  { label: '待审核', value: 'pending' },
+  { label: '已通过', value: 'approved' },
+  { label: '已驳回', value: 'rejected' },
+];
+
 export function AdminTemplateAuditPage() {
-  const [audits, setAudits] = useState(() => adminService.getAudits());
-  const columns = useMemo<Array<TableColumn<AuditItem>>>(
+  const [audits, setAudits] = useState<SmsTemplateAudit[]>([]);
+  const [keyword, setKeyword] = useState('');
+  const [status, setStatus] = useState('all');
+
+  useEffect(() => {
+    adminApi.listTemplateAudits({ keyword, status })
+      .then(setAudits)
+      .catch(() => setAudits([]));
+  }, [keyword, status]);
+
+  async function reviewTemplate(id: string, nextStatus: 'approved' | 'rejected') {
+    const updated = nextStatus === 'approved'
+      ? await adminApi.approveTemplate(id)
+      : await adminApi.rejectTemplate(id);
+    setAudits((items) => items.map((item) => (item.id === id ? updated : item)));
+  }
+
+  const columns = useMemo<Array<TableColumn<SmsTemplateAudit>>>(
     () => [
       { key: 'id', title: '审核编号', render: (record) => record.id },
-      { key: 'customer', title: '客户', render: (record) => record.customer },
-      { key: 'application', title: '短信应用', render: (record) => applicationMap[record.id] ?? '客户通知服务' },
+      { key: 'customer', title: '客户', render: (record) => record.tenant?.name ?? record.tenantId },
+      { key: 'application', title: '短信应用', render: (record) => record.application?.name ?? record.applicationId },
       { key: 'content', title: '短信模板内容', render: (record) => record.content },
-      { key: 'submittedAt', title: '提交时间', render: (record) => record.submittedAt },
+      { key: 'submittedAt', title: '提交时间', render: (record) => new Date(record.createdAt).toLocaleString('zh-CN', { hour12: false }) },
       {
         key: 'status',
         title: '状态',
         render: (record) => (
-          <Tag tone={record.status === 'approved' ? 'success' : record.status === 'rejected' ? 'danger' : 'info'}>
-            {auditStatusLabelMap[record.status]}
+          <Tag tone={record.auditStatus === 'approved' ? 'success' : record.auditStatus === 'rejected' ? 'danger' : 'info'}>
+            {auditStatusLabelMap[record.auditStatus] ?? record.auditStatus}
           </Tag>
         ),
       },
@@ -40,18 +58,18 @@ export function AdminTemplateAuditPage() {
         render: (record) => (
           <div className="table-actions">
             <Button
-              disabled={record.status !== 'pending'}
+              disabled={record.auditStatus !== 'pending'}
               icon={<Check size={15} />}
-              onClick={() => setAudits(adminService.updateAuditStatus(record.id, 'approved'))}
+              onClick={() => void reviewTemplate(record.id, 'approved')}
               size="sm"
               variant="secondary"
             >
               通过
             </Button>
             <Button
-              disabled={record.status !== 'pending'}
+              disabled={record.auditStatus !== 'pending'}
               icon={<X size={15} />}
-              onClick={() => setAudits(adminService.updateAuditStatus(record.id, 'rejected'))}
+              onClick={() => void reviewTemplate(record.id, 'rejected')}
               size="sm"
               variant="ghost"
             >
@@ -63,15 +81,25 @@ export function AdminTemplateAuditPage() {
     ],
     [],
   );
-  const templateAudits = audits.filter((item) => item.type === '模板');
+  const templateAudits = audits;
 
   return (
-    <section className="page-stack">
+    <section className="page-stack admin-template-audit-page">
       <div className="page-heading">
         <div>
           <Breadcrumb items={['短信模板审核']} />
         </div>
       </div>
+      <div className="surface audit-filter-card">
+        <div className="audit-filter-grid audit-filter-grid--template">
+          <Input label="搜索" onChange={(event) => setKeyword(event.target.value)} placeholder="搜索客户、应用、模板内容或审核编号" value={keyword} />
+          <Select label="审核状态" onChange={(event) => setStatus(event.target.value)} options={statusOptions} value={status} />
+          <div className="audit-filter-actions">
+            <Button icon={<Search size={17} />}>查询</Button>
+            <Button onClick={() => { setKeyword(''); setStatus('all'); }} variant="ghost">重置</Button>
+          </div>
+        </div>
+      </div>
       <div className="surface">
         <Table columns={columns} data={templateAudits} rowKey="id" />
       </div>