frontend: add the template configuration UI
The shell: the app mark at both ends of the header, the two top-level
entries between them, and the second-level menu on the right. That menu is
driven entirely by `route.meta.section`, so a route declares which menu it
belongs to and a deep link renders the right one on first paint; routes with
no section (the welcome page) show none.
Screens:
/ welcome, with live template and field counts so the
page doubles as a connectivity check
/papers 论文, content still to be decided
/templates/list the template table: search, create, edit, preview,
delete, batch delete, pagination
/templates/fields the field library: the same CRUD, plus level filter
The template form is the centre of it. Fields are chosen from the flat
library by clicking — any subset, any order, the same field more than once —
and the selection is always rendered sorted by `sort`, so editing a number
reorders the outline immediately. Repeats and duplicate sorts are surfaced as
warnings rather than blocked, because a repeat is often deliberate and a tie
is legal; a "自动排序" button renumbers the selection 1..N. The panel on the
right of the picker opens 字段管理 in a second tab, so a half-filled form is
never lost to a navigation.
The preview drawer renders the outline exactly as it will read, at each
field's own size and colour, with the sort value shown alongside — the
quickest way to confirm the ordering before writing against a template.
Also in this change:
- ApiError now extends Error. It was a plain object, so the common
`error instanceof Error ? error.message : ...` idiom fell through to a
generic message and threw away what the server actually said — such as
which template name is already taken. Server messages now reach the user.
- font colours are normalised client-side on blur, matching the backend,
so a hand-typed rgb(255, 0, 0) is tidied up rather than rejected later.
- api/health.ts is removed: the rewritten welcome page was its only
consumer, and the counts already prove connectivity.
This commit is contained in:
@@ -0,0 +1,85 @@
|
||||
import http from './client'
|
||||
import type { BatchDeleteResult, PageQuery, PageResult } from './types'
|
||||
|
||||
/** One placement of a library field inside a template, with its typography. */
|
||||
export interface TemplateField {
|
||||
id: number
|
||||
field_id: number
|
||||
/** Display position. The only thing that decides render order. */
|
||||
sort: number
|
||||
name: string
|
||||
level: number
|
||||
font_size: number
|
||||
font_color: string
|
||||
}
|
||||
|
||||
/** A template as it appears in the list table. */
|
||||
export interface TemplateListItem {
|
||||
id: number
|
||||
name: string
|
||||
abstract: string | null
|
||||
field_count: number
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
/** A template with its outline, already ordered by `sort`. */
|
||||
export interface TemplateDetail {
|
||||
id: number
|
||||
name: string
|
||||
abstract: string | null
|
||||
fields: TemplateField[]
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
/** One entry of the selection sent on create/update. */
|
||||
export interface TemplateFieldInput {
|
||||
field_id: number
|
||||
sort: number
|
||||
}
|
||||
|
||||
export interface TemplatePayload {
|
||||
name: string
|
||||
abstract: string | null
|
||||
fields: TemplateFieldInput[]
|
||||
}
|
||||
|
||||
export async function listTemplates(
|
||||
query: PageQuery = {},
|
||||
): Promise<PageResult<TemplateListItem>> {
|
||||
const params: Record<string, unknown> = {}
|
||||
if (query.keyword) params.keyword = query.keyword
|
||||
if (query.page) params.page = query.page
|
||||
if (query.page_size) params.page_size = query.page_size
|
||||
|
||||
const { data } = await http.get<PageResult<TemplateListItem>>('/templates', { params })
|
||||
return data
|
||||
}
|
||||
|
||||
export async function getTemplate(id: number): Promise<TemplateDetail> {
|
||||
const { data } = await http.get<TemplateDetail>(`/templates/${id}`)
|
||||
return data
|
||||
}
|
||||
|
||||
export async function createTemplate(payload: TemplatePayload): Promise<TemplateDetail> {
|
||||
const { data } = await http.post<TemplateDetail>('/templates', payload)
|
||||
return data
|
||||
}
|
||||
|
||||
export async function updateTemplate(
|
||||
id: number,
|
||||
payload: Partial<TemplatePayload>,
|
||||
): Promise<TemplateDetail> {
|
||||
const { data } = await http.patch<TemplateDetail>(`/templates/${id}`, payload)
|
||||
return data
|
||||
}
|
||||
|
||||
export async function deleteTemplate(id: number): Promise<void> {
|
||||
await http.delete(`/templates/${id}`)
|
||||
}
|
||||
|
||||
export async function batchDeleteTemplates(ids: number[]): Promise<BatchDeleteResult> {
|
||||
const { data } = await http.post<BatchDeleteResult>('/templates/batch-delete', { ids })
|
||||
return data
|
||||
}
|
||||
Reference in New Issue
Block a user