feat(ECR-042): OpsCMS FeedSlot 薄写面
Admin POST/PUT 复用 admin.cms.write；C 端 GET /home/feed-slots；首页无 active 槽隐藏推荐区、失败回退展示；无新 migration。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
jackyu66git
@@ -521,6 +521,43 @@ export const adminApi = {
|
||||
system: boolean
|
||||
updated_at: string
|
||||
}>('GET', `/cms/feed-slots/${id}`),
|
||||
createFeedSlot: (body: {
|
||||
code: string
|
||||
title: string
|
||||
slot_key: string
|
||||
placement: string
|
||||
active: boolean
|
||||
}) =>
|
||||
request<{
|
||||
id: string
|
||||
code: string
|
||||
title: string
|
||||
slot_key: string
|
||||
placement: string
|
||||
active: boolean
|
||||
system: boolean
|
||||
updated_at: string
|
||||
}>('POST', '/cms/feed-slots', body),
|
||||
updateFeedSlot: (
|
||||
id: string,
|
||||
body: {
|
||||
code: string
|
||||
title: string
|
||||
slot_key: string
|
||||
placement: string
|
||||
active: boolean
|
||||
},
|
||||
) =>
|
||||
request<{
|
||||
id: string
|
||||
code: string
|
||||
title: string
|
||||
slot_key: string
|
||||
placement: string
|
||||
active: boolean
|
||||
system: boolean
|
||||
updated_at: string
|
||||
}>('PUT', `/cms/feed-slots/${id}`, body),
|
||||
publications: () =>
|
||||
request<{ items: Array<Record<string, unknown>> }>('GET', '/cms/publications'),
|
||||
publication: (id: string) =>
|
||||
|
||||
@@ -24,6 +24,15 @@ const slotsLoading = ref(false)
|
||||
const slotsError = ref('')
|
||||
const slots = ref<FeedSlot[]>([])
|
||||
const selectedSlot = ref<FeedSlot | null>(null)
|
||||
const slotSaving = ref(false)
|
||||
const slotFormErr = ref('')
|
||||
const slotForm = reactive({
|
||||
code: '',
|
||||
title: '',
|
||||
slot_key: 'home.main',
|
||||
placement: 'home',
|
||||
active: true,
|
||||
})
|
||||
|
||||
async function load() {
|
||||
loading.value = true
|
||||
@@ -79,13 +88,75 @@ async function openBanner(id: string) {
|
||||
}
|
||||
|
||||
async function openSlot(id: string) {
|
||||
slotFormErr.value = ''
|
||||
try {
|
||||
selectedSlot.value = await adminApi.feedSlot(id)
|
||||
const s = await adminApi.feedSlot(id)
|
||||
selectedSlot.value = s
|
||||
slotForm.code = s.code
|
||||
slotForm.title = s.title
|
||||
slotForm.slot_key = s.slot_key
|
||||
slotForm.placement = s.placement
|
||||
slotForm.active = s.active
|
||||
} catch {
|
||||
selectedSlot.value = null
|
||||
}
|
||||
}
|
||||
|
||||
function resetSlotForm() {
|
||||
slotForm.code = ''
|
||||
slotForm.title = ''
|
||||
slotForm.slot_key = 'home.main'
|
||||
slotForm.placement = 'home'
|
||||
slotForm.active = true
|
||||
selectedSlot.value = null
|
||||
slotFormErr.value = ''
|
||||
}
|
||||
|
||||
function slotPayload() {
|
||||
return {
|
||||
code: slotForm.code.trim(),
|
||||
title: slotForm.title.trim(),
|
||||
slot_key: slotForm.slot_key.trim(),
|
||||
placement: slotForm.placement,
|
||||
active: slotForm.active,
|
||||
}
|
||||
}
|
||||
|
||||
async function createSlot() {
|
||||
slotSaving.value = true
|
||||
slotFormErr.value = ''
|
||||
try {
|
||||
const row = await adminApi.createFeedSlot(slotPayload())
|
||||
await loadSlots()
|
||||
await openSlot(row.id)
|
||||
} catch (e) {
|
||||
slotFormErr.value = e instanceof Error ? e.message : '创建失败'
|
||||
} finally {
|
||||
slotSaving.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function saveSlot() {
|
||||
if (!selectedSlot.value) return
|
||||
slotSaving.value = true
|
||||
slotFormErr.value = ''
|
||||
try {
|
||||
const row = await adminApi.updateFeedSlot(selectedSlot.value.id, slotPayload())
|
||||
selectedSlot.value = row
|
||||
await loadSlots()
|
||||
} catch (e) {
|
||||
slotFormErr.value = e instanceof Error ? e.message : '保存失败'
|
||||
} finally {
|
||||
slotSaving.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function toggleSlotActive() {
|
||||
if (!selectedSlot.value) return
|
||||
slotForm.active = !slotForm.active
|
||||
await saveSlot()
|
||||
}
|
||||
|
||||
function payload() {
|
||||
return {
|
||||
code: form.code.trim(),
|
||||
@@ -141,7 +212,7 @@ 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">
|
||||
@@ -198,30 +269,50 @@ 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>
|
||||
<button class="btn" type="button" @click="resetSlotForm">新建</button>
|
||||
<p v-if="!slots.length" class="muted">暂无</p>
|
||||
<table v-else>
|
||||
<thead>
|
||||
<tr><th>代码</th><th>标题</th><th>slot_key</th><th>位置</th><th></th></tr>
|
||||
<tr><th>代码</th><th>标题</th><th>slot_key</th><th>状态</th><th></th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="s in slots" :key="s.id">
|
||||
<td><code>{{ s.code }}</code></td>
|
||||
<td>{{ s.title }}</td>
|
||||
<td><code>{{ s.slot_key }}</code></td>
|
||||
<td>{{ s.placement }}</td>
|
||||
<td><button class="btn" type="button" @click="openSlot(s.id)">查看</button></td>
|
||||
<td>{{ s.active ? '启用' : '停用' }}</td>
|
||||
<td><button class="btn" type="button" @click="openSlot(s.id)">编辑</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h2>栏目位详情</h2>
|
||||
<template v-if="selectedSlot">
|
||||
<p>{{ selectedSlot.title }} · {{ selectedSlot.placement }}</p>
|
||||
<p class="muted">slot_key {{ selectedSlot.slot_key }}</p>
|
||||
</template>
|
||||
<p v-else class="muted">选择左侧栏目位</p>
|
||||
<h2>{{ selectedSlot ? '编辑栏目位' : '新建栏目位' }}</h2>
|
||||
<label>代码 <input v-model="slotForm.code" :disabled="!!selectedSlot?.system" /></label>
|
||||
<label>标题 <input v-model="slotForm.title" /></label>
|
||||
<label>slot_key <input v-model="slotForm.slot_key" /></label>
|
||||
<label>
|
||||
位置
|
||||
<select v-model="slotForm.placement">
|
||||
<option value="home">home</option>
|
||||
<option value="explore">explore</option>
|
||||
<option value="ask">ask</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="check"><input v-model="slotForm.active" type="checkbox" /> 启用</label>
|
||||
<p v-if="slotFormErr" class="err">{{ slotFormErr }}</p>
|
||||
<div class="actions">
|
||||
<button v-if="!selectedSlot" class="btn primary" type="button" :disabled="slotSaving" @click="createSlot">
|
||||
创建
|
||||
</button>
|
||||
<template v-else>
|
||||
<button class="btn primary" type="button" :disabled="slotSaving" @click="saveSlot">保存</button>
|
||||
<button class="btn" type="button" :disabled="slotSaving" @click="toggleSlotActive">
|
||||
{{ slotForm.active ? '下架' : '上架' }}
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user