Initial CMPP frontend prototype

2026-06-30 16:09:46 +08:00
commit 2f3c274a30
98 changed files with 25255 additions and 0 deletions
@@ -0,0 +1,59 @@
+import { useMemo, useState } from 'react';
+import { Trash2 } from 'lucide-react';
+import { Button, Table, type TableColumn } from '@/components/ui';
+
+type EnterpriseBlacklistItem = {
+  id: string;
+  enterprise: string;
+  application: string;
+  phone: string;
+  createdAt: string;
+  reason: string;
+  expiredAt: string;
+};
+
+const initialItems: EnterpriseBlacklistItem[] = [
+  { id: 'EBL20260630001', enterprise: '四川骠骑企业管理', application: '营销应用1', phone: '13675569095', createdAt: '2026-06-28 10:12:05', reason: '用户回复退订', expiredAt: '2026-12-28 23:59:59' },
+  { id: 'EBL20260630002', enterprise: '重庆进载数智', application: '通知应用', phone: '18607638087', createdAt: '2026-06-27 15:34:22', reason: '投诉拦截', expiredAt: '2026-09-27 23:59:59' },
+  { id: 'EBL20260630003', enterprise: '超感世纪三三网', application: '推广应用2', phone: '15250668026', createdAt: '2026-06-25 09:18:41', reason: '运营手动加入', expiredAt: '2026-08-25 23:59:59' },
+  { id: 'EBL20260630004', enterprise: '重庆香惠慧', application: '客服应用', phone: '18800000555', createdAt: '2026-06-24 18:01:10', reason: '敏感投诉号码', expiredAt: '2026-07-24 23:59:59' },
+];
+
+export function AdminEnterpriseBlacklistPage() {
+  const [items, setItems] = useState(initialItems);
+
+  const columns = useMemo<Array<TableColumn<EnterpriseBlacklistItem>>>(() => [
+    { key: 'enterprise', title: '企业名称', width: '180px', render: (record) => <strong>{record.enterprise}</strong> },
+    { key: 'application', title: '应用名称', width: '150px', render: (record) => record.application },
+    { key: 'phone', title: '手机号码', width: '150px', render: (record) => <strong>{record.phone}</strong> },
+    { key: 'createdAt', title: '入库时间', width: '170px', render: (record) => record.createdAt },
+    { key: 'reason', title: '入库原因', render: (record) => record.reason },
+    { key: 'expiredAt', title: '过期时间', width: '170px', render: (record) => record.expiredAt },
+    {
+      key: 'actions',
+      title: '操作',
+      width: '110px',
+      align: 'right',
+      render: (record) => (
+        <Button icon={<Trash2 size={15} />} onClick={() => setItems((current) => current.filter((item) => item.id !== record.id))} size="sm" variant="danger">
+          删除
+        </Button>
+      ),
+    },
+  ], []);
+
+  return (
+    <section className="page-stack admin-security-page">
+      <div className="page-heading">
+        <div>
+          <div className="breadcrumb-line">安全控制 / <strong>企业黑名单</strong></div>
+          <h1>企业黑名单</h1>
+        </div>
+      </div>
+
+      <div className="surface admin-security-table-card">
+        <Table columns={columns} data={items} emptyText="暂无企业黑名单记录" rowKey="id" />
+      </div>
+    </section>
+  );
+}