Initial CMPP frontend prototype

src/components/PagePlaceholder.tsx

@@ -0,0 +1,39 @@
+import { useLocation } from 'react-router-dom';
+
+const pageTitleMap: Record<string, string> = {
+  '/client/send': '短信发送',
+  '/client/templates': '模板管理',
+  '/client/signatures': '签名与引流信息',
+  '/client/billing': '充值套餐',
+  '/client/invoices': '账单流水',
+  '/client/settings': '账号设置',
+  '/admin/monitor': '发送监控',
+  '/admin/analytics': '数据统计',
+  '/admin/customers': '客户管理',
+  '/admin/templates': '模板审核',
+  '/admin/signatures': '签名审核',
+  '/admin/channels': '通道管理',
+  '/admin/billing': '账单流水',
+  '/admin/settings': '系统配置',
+};
+
+export function PagePlaceholder() {
+  const location = useLocation();
+  const title = pageTitleMap[location.pathname] ?? '页面建设中';
+
+  return (
+    <section className="page-stack">
+      <div className="page-heading">
+        <div>
+          <p className="eyebrow">模块</p>
+          <h1>{title}</h1>
+        </div>
+        <p className="muted">后续步骤会在这里补齐表格、筛选、表单和交互流程。</p>
+      </div>
+      <div className="surface empty-state">
+        <strong>{title}</strong>
+        <span>页面骨架已接入，等待业务组件填充。</span>
+      </div>
+    </section>
+  );
+}