feat: 页面配置+风险规则编辑器支持表格/JSON双模式切换
This commit is contained in:
@@ -28,26 +28,39 @@
|
||||
</el-table>
|
||||
</el-card>
|
||||
|
||||
<el-dialog v-model="editorVisible" :title="'页面配置: ' + editorSiteId" width="750px" destroy-on-close>
|
||||
<el-table :data="editingEntries" stripe size="small" style="margin-bottom:12px">
|
||||
<el-table-column prop="key" label="标识" width="100">
|
||||
<template #default="s"><el-input v-model="s.row.key" size="small" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="label" label="名称" width="100">
|
||||
<template #default="s"><el-input v-model="s.row.label" size="small" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="url" label="URL" min-width="180">
|
||||
<template #default="s"><el-input v-model="s.row.url" size="small" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="method" label="方法" width="80">
|
||||
<template #default="s"><el-select v-model="s.row.method" size="small"><el-option label="GET" value="GET" /><el-option label="POST" value="POST" /></el-select></template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="60">
|
||||
<template #default="s"><el-button size="small" type="danger" text @click="editingEntries.splice(s.$index,1)">删除</el-button></template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-dialog v-model="editorVisible" :title="'页面配置: ' + editorSiteId" width="800px" destroy-on-close>
|
||||
<div style="margin-bottom:8px;display:flex;gap:8px;align-items:center">
|
||||
<el-radio-group v-model="editorMode" size="small">
|
||||
<el-radio-button label="table">表格编辑</el-radio-button>
|
||||
<el-radio-button label="json">JSON 编辑</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<template v-if="editorMode === 'table'">
|
||||
<el-table :data="editingEntries" stripe size="small" style="margin-bottom:12px">
|
||||
<el-table-column prop="key" label="标识" width="100">
|
||||
<template #default="s"><el-input v-model="s.row.key" size="small" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="label" label="名称" width="100">
|
||||
<template #default="s"><el-input v-model="s.row.label" size="small" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="url" label="URL" min-width="180">
|
||||
<template #default="s"><el-input v-model="s.row.url" size="small" /></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="method" label="方法" width="80">
|
||||
<template #default="s"><el-select v-model="s.row.method" size="small"><el-option label="GET" value="GET" /><el-option label="POST" value="POST" /></el-select></template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="60">
|
||||
<template #default="s"><el-button size="small" type="danger" text @click="editingEntries.splice(s.$index,1)">删除</el-button></template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-button size="small" @click="editingEntries.push({key:'',label:'',url:'{base}','method':'GET'})" style="margin-bottom:12px">+ 添加入口</el-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div style="height:400px;border-radius:4px;overflow:hidden;margin-bottom:12px">
|
||||
<CodeEditor v-model="editorJson" language="json" />
|
||||
</div>
|
||||
</template>
|
||||
<div style="display:flex;gap:8px">
|
||||
<el-button size="small" @click="editingEntries.push({key:'',label:'',url:'{base}','method':'GET'})">+ 添加入口</el-button>
|
||||
<el-button size="small" type="primary" @click="savePages" :loading="saving">保存</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
@@ -59,7 +72,15 @@ import api from '../api'
|
||||
|
||||
const loading = ref(false), saving = ref(false)
|
||||
const sites = ref([]), pagesMap = ref({})
|
||||
const editorVisible = ref(false), editorSiteId = ref(''), editingEntries = ref([])
|
||||
const editorVisible = ref(false), editorSiteId = ref(''), editorMode = ref('table'), editorJson = ref('')
|
||||
const editingEntries = ref([])
|
||||
|
||||
watch(editorMode, (m) => {
|
||||
if (m === 'json') editorJson.value = JSON.stringify(editingEntries.value, null, 2)
|
||||
else {
|
||||
try { editingEntries.value = JSON.parse(editorJson.value) } catch { /* keep table data */ }
|
||||
}
|
||||
})
|
||||
|
||||
const fmt = (t) => t ? (t.substring(0,19)||'').replace('T',' ') : '-'
|
||||
|
||||
@@ -104,7 +125,8 @@ const showEditor = (row) => {
|
||||
const savePages = async () => {
|
||||
saving.value = true
|
||||
try {
|
||||
await api.raw.put('/sites/' + editorSiteId.value + '/pages', { entries: editingEntries.value })
|
||||
const entries = editorMode.value === 'json' ? JSON.parse(editorJson.value) : editingEntries.value
|
||||
await api.raw.put('/sites/' + editorSiteId.value + '/pages', { entries })
|
||||
ElMessage.success('已保存')
|
||||
editorVisible.value = false
|
||||
fetchAll()
|
||||
|
||||
Reference in New Issue
Block a user