refactor: 页面配置UI改为下拉添加模式,每个类型只能添加一次

1. +添加按钮改为下拉选择可用页面类型,已添加的自动隐藏
2. 每个条目的key改为固定tag显示,不可再通过下拉修改
3. URL placeholder 去掉{base},直接用相对路径
4. resolveUrl 改为自动拼接站点baseUrl
This commit is contained in:
mediabot-pt
2026-07-08 13:22:49 +08:00
parent 6e53e8c014
commit 0f69fecb8f

View File

@@ -89,14 +89,22 @@
<!-- 页面入口 -->
<div style="font-size:13px;font-weight:500;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center">
<span>页面入口</span>
<el-button size="small" @click="addEntry">+ 添加</el-button>
<el-dropdown v-if="availableKeys.length" @command="addEntryByKey">
<el-button size="small" type="primary">+ 添加</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="k in availableKeys" :key="k.key" :command="k">
{{ k.key }} - {{ k.label }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-button v-else size="small" disabled>已全部添加</el-button>
</div>
<div v-if="!parsed.length" style="text-align:center;padding:40px;color:#909399">暂无,点击添加</div>
<div v-for="(entry, idx) in parsed" :key="idx" style="margin-bottom:12px;padding:12px;border:1px solid #ebeef5;border-radius:4px;background:#fafafa">
<div style="display:flex;gap:8px;align-items:center;margin-bottom:8px">
<el-select v-model="entry.key" size="small" @change="onKeyChange(entry)" filterable style="width:140px" placeholder="选择操作">
<el-option v-for="k in pageKeys" :key="k.key" :label="k.key+' - '+k.label" :value="k.key" />
</el-select>
<el-tag size="small" type="primary">{{ entry.key }} - {{ keyLabel(entry.key) }}</el-tag>
<el-select v-model="entry.method" size="small" @change="syncToJson" style="width:80px">
<el-option label="GET" value="GET"/><el-option label="POST" value="POST"/>
</el-select>
@@ -104,7 +112,7 @@
<el-button size="small" type="danger" text @click="remove(idx)">删除</el-button>
</div>
<div style="display:flex;gap:8px;align-items:flex-start;margin-bottom:6px;max-width:500px">
<el-input v-model="entry.url" size="small" placeholder="URL模板,支持{base}{keyword}{page}{id}{passkey}" @input="syncToJson" style="flex:1" />
<el-input v-model="entry.url" size="small" placeholder="URL路径,如 /torrents.php" @input="syncToJson" style="flex:1" />
<el-button size="small" @click="verifyEntry(entry, idx)" :loading="verifying[idx]" :type="verifyResults[idx]?.success===true ? 'success' : verifyResults[idx]?.success===false ? 'danger' : ''">
{{ verifyResults[idx]?.success===true ? '✓' : verifyResults[idx]?.success===false ? '✗' : '验证' }}
</el-button>
@@ -146,6 +154,12 @@ const loadPageKeys = async () => {
catch {}
}
const keyLabel = (key) => pageKeys.value.find(k => k.key === key)?.label || key
const availableKeys = computed(() => {
const used = new Set(parsed.value.map(e => e.key).filter(Boolean))
return pageKeys.value.filter(k => !used.has(k.key))
})
const onKeyChange = (row) => {
const pk = pageKeys.value.find(k => k.key === row.key)
if (pk?.defaultMethod) row.method = pk.defaultMethod
@@ -163,12 +177,16 @@ const syncToJson = () => {
const obj = { authType: authType.value, entries: parsed.value }
editorJson.value = JSON.stringify(obj, null, 2)
}
const resolveUrl = (url) => url?.replace('{base}', sitesList.value.find(s=>s.siteId===editSiteId.value)?.urls?.[0] || '{base}') || ''
const resolveUrl = (url) => {
const base = sitesList.value.find(s=>s.siteId===editSiteId.value)?.urls?.[0] || ''
if (!url || !base) return url || ''
return url.startsWith('/') ? base.replace(/\/$/, '') + url : url
}
const verifyEntry = async (entry, idx) => {
const resolved = resolveUrl(entry.url)
if (!resolved || resolved === entry.url) {
ElMessage.warning('请先配置站点地址,URL中需包含 {base} 占位符')
ElMessage.warning('请先配置站点地址')
return
}
verifying.value = { ...verifying.value, [idx]: true }
@@ -276,7 +294,10 @@ const discardDraft = async () => {
}
const remove = (idx) => { parsed.value.splice(idx,1); syncToJson() }
const addEntry = () => { parsed.value.push({key:'',method:'GET',url:'{base}'}); syncToJson() }
const addEntryByKey = (k) => {
parsed.value.push({ key: k.key, method: k.defaultMethod || 'GET', url: '' })
syncToJson()
}
const deletePages = async () => {
try { await ElMessageBox.confirm('删除后站点将使用默认模板','确认',{type:'warning',confirmButtonText:'确认删除'}) } catch { return }
deleting.value = true