feat(ECR-041): OpsCMS Banner 薄写面（Write-Wave 首刀）

Admin POST/PUT + admin.cms.write/审计；C 端 GET /home/banners；首页投影回退静态 homeFeeds；migration 000051；不碰 FeedSlot/支付/UGC。

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/admin-h5/src/api/client.ts

@@ -452,6 +452,51 @@ export const adminApi = {
       system: boolean
       updated_at: string
     }>('GET', `/cms/banners/${id}`),
+  createBanner: (body: {
+    code: string
+    title: string
+    placement: string
+    image_url?: string | null
+    link_path?: string | null
+    sort_order: number
+    active: boolean
+  }) =>
+    request<{
+      id: string
+      code: string
+      title: string
+      placement: string
+      image_url?: string
+      link_path?: string
+      sort_order: number
+      active: boolean
+      system: boolean
+      updated_at: string
+    }>('POST', '/cms/banners', body),
+  updateBanner: (
+    id: string,
+    body: {
+      code: string
+      title: string
+      placement: string
+      image_url?: string | null
+      link_path?: string | null
+      sort_order: number
+      active: boolean
+    },
+  ) =>
+    request<{
+      id: string
+      code: string
+      title: string
+      placement: string
+      image_url?: string
+      link_path?: string
+      sort_order: number
+      active: boolean
+      system: boolean
+      updated_at: string
+    }>('PUT', `/cms/banners/${id}`, body),
   feedSlots: () =>
     request<{
       items: Array<{

apps/admin-h5/src/pages/CMSPage.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { adminApi } from '@/api/client'
 
 type Banner = Awaited<ReturnType<typeof adminApi.banners>>['items'][number]
@@ -9,6 +9,16 @@ const loading = ref(false)
 const error = ref('')
 const items = ref<Banner[]>([])
 const selected = ref<Banner | null>(null)
+const saving = ref(false)
+const formErr = ref('')
+const form = reactive({
+  code: '',
+  title: '',
+  placement: 'home',
+  link_path: '',
+  sort_order: 0,
+  active: true,
+})
 
 const slotsLoading = ref(false)
 const slotsError = ref('')
@@ -41,9 +51,28 @@ async function loadSlots() {
   }
 }
 
+function resetForm() {
+  form.code = ''
+  form.title = ''
+  form.placement = 'home'
+  form.link_path = ''
+  form.sort_order = 0
+  form.active = true
+  selected.value = null
+  formErr.value = ''
+}
+
 async function openBanner(id: string) {
+  formErr.value = ''
   try {
-    selected.value = await adminApi.banner(id)
+    const b = await adminApi.banner(id)
+    selected.value = b
+    form.code = b.code
+    form.title = b.title
+    form.placement = b.placement
+    form.link_path = b.link_path || ''
+    form.sort_order = b.sort_order
+    form.active = b.active
   } catch {
     selected.value = null
   }
@@ -57,6 +86,52 @@ async function openSlot(id: string) {
   }
 }
 
+function payload() {
+  return {
+    code: form.code.trim(),
+    title: form.title.trim(),
+    placement: form.placement,
+    link_path: form.link_path.trim() || null,
+    sort_order: Number(form.sort_order) || 0,
+    active: form.active,
+  }
+}
+
+async function createBanner() {
+  saving.value = true
+  formErr.value = ''
+  try {
+    const row = await adminApi.createBanner(payload())
+    await load()
+    await openBanner(row.id)
+  } catch (e) {
+    formErr.value = e instanceof Error ? e.message : '创建失败'
+  } finally {
+    saving.value = false
+  }
+}
+
+async function saveBanner() {
+  if (!selected.value) return
+  saving.value = true
+  formErr.value = ''
+  try {
+    const row = await adminApi.updateBanner(selected.value.id, payload())
+    selected.value = row
+    await load()
+  } catch (e) {
+    formErr.value = e instanceof Error ? e.message : '保存失败'
+  } finally {
+    saving.value = false
+  }
+}
+
+async function toggleActive() {
+  if (!selected.value) return
+  form.active = !form.active
+  await saveBanner()
+}
+
 onMounted(() => {
   void load()
   void loadSlots()
@@ -66,12 +141,13 @@ onMounted(() => {
 <template>
   <section>
     <h1>运营位 CMS</h1>
-    <p class="muted">Banner / FeedSlot 只读 · 非 UGC · 本切片不可发布</p>
+    <p class="muted">Banner 可写 · FeedSlot 只读 · 非 UGC · 下架用停用</p>
     <p v-if="loading" class="muted">加载中…</p>
     <p v-else-if="error" class="err">{{ error }}</p>
     <div v-else class="layout">
       <div class="card">
         <h2>横幅</h2>
+        <button class="btn" type="button" @click="resetForm">新建</button>
         <p v-if="!items.length" class="muted">暂无</p>
         <table v-else>
           <thead>
@@ -83,18 +159,38 @@ onMounted(() => {
               <td>{{ b.title }}</td>
               <td>{{ b.placement }}</td>
               <td>{{ b.active ? '启用' : '停用' }}</td>
-              <td><button class="btn" type="button" @click="openBanner(b.id)">查看</button></td>
+              <td><button class="btn" type="button" @click="openBanner(b.id)">编辑</button></td>
             </tr>
           </tbody>
         </table>
       </div>
       <div class="card">
-        <h2>横幅详情</h2>
-        <template v-if="selected">
-          <p>{{ selected.title }} · {{ selected.placement }}</p>
-          <p class="muted">链接 {{ selected.link_path || '—' }} · 排序 {{ selected.sort_order }}</p>
-        </template>
-        <p v-else class="muted">选择左侧横幅</p>
+        <h2>{{ selected ? '编辑横幅' : '新建横幅' }}</h2>
+        <label>代码 <input v-model="form.code" :disabled="!!selected?.system" /></label>
+        <label>标题 <input v-model="form.title" /></label>
+        <label>
+          位置
+          <select v-model="form.placement">
+            <option value="home">home</option>
+            <option value="explore">explore</option>
+            <option value="ask">ask</option>
+          </select>
+        </label>
+        <label>链接 <input v-model="form.link_path" placeholder="/membership" /></label>
+        <label>排序 <input v-model.number="form.sort_order" type="number" /></label>
+        <label class="check"><input v-model="form.active" type="checkbox" /> 启用</label>
+        <p v-if="formErr" class="err">{{ formErr }}</p>
+        <div class="actions">
+          <button v-if="!selected" class="btn primary" type="button" :disabled="saving" @click="createBanner">
+            创建
+          </button>
+          <template v-else>
+            <button class="btn primary" type="button" :disabled="saving" @click="saveBanner">保存</button>
+            <button class="btn" type="button" :disabled="saving" @click="toggleActive">
+              {{ form.active ? '下架' : '上架' }}
+            </button>
+          </template>
+        </div>
       </div>
     </div>
 
@@ -102,7 +198,7 @@ onMounted(() => {
     <p v-else-if="slotsError" class="err gap">{{ slotsError }}</p>
     <div v-else class="layout gap">
       <div class="card">
-        <h2>栏目位 FeedSlot</h2>
+        <h2>栏目位 FeedSlot（只读）</h2>
         <p v-if="!slots.length" class="muted">暂无</p>
         <table v-else>
           <thead>
@@ -137,5 +233,10 @@ h2 { margin: 0 0 0.6rem; font-size: 1.05rem; }
 .layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem; margin-top: 1rem; }
 .gap { margin-top: 1.5rem; }
 code { font-size: 0.8rem; }
+.card label { display: block; margin: 0.4rem 0; font-size: 0.9rem; }
+.card input, .card select { width: 100%; margin-top: 0.2rem; }
+.check { display: flex; align-items: center; gap: 0.4rem; }
+.actions { display: flex; gap: 0.5rem; margin-top: 0.75rem; }
+.btn.primary { font-weight: 600; }
 @media (max-width: 900px) { .layout { grid-template-columns: 1fr; } }
 </style>