feat(tab): 结构化字段端到端传对象,给人看的边界走 _label/stringify
tab 字段原把对象 JSON.stringify 成字符串下发(复用 json 的 resFilter),
导致前端 FieldTab 收到字符串:表格 display 显示 '-'、编辑回退默认值。
改为:
- 库/响应/编辑全程对象(去掉 tab 的 resFilter stringify)
- 新增 resLabel 钩子 → 写入 ${key}_label,承载给人看的字符串文本
- export 边界用 _label 文本替换对象列(可读且可被 import 的 parse 还原)
- 字段级可配 stringify/parse,默认 JSON
This commit is contained in:
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "shrimp-server",
|
"name": "shrimp-server",
|
||||||
"version": "0.6.2",
|
"version": "0.6.3",
|
||||||
"description": "Shrimp 框架后端 — 声明式字段驱动的 Node.js 管理后台框架(Express + Mongoose + JWT)",
|
"description": "Shrimp 框架后端 — 声明式字段驱动的 Node.js 管理后台框架(Express + Mongoose + JWT)",
|
||||||
"main": "dist/main/index.js",
|
"main": "dist/main/index.js",
|
||||||
"types": "dist/main/index.d.ts",
|
"types": "dist/main/index.d.ts",
|
||||||
|
|||||||
@@ -248,6 +248,8 @@ export interface IFieldTypeHandler {
|
|||||||
reqFilter?: (value: any, field: IFieldConfig, item: Record<string, any>) => any | Promise<any>
|
reqFilter?: (value: any, field: IFieldConfig, item: Record<string, any>) => any | Promise<any>
|
||||||
/** 响应过滤:数据库取出 → 返回前端前转换(如密码脱敏为 ***、日期格式化) */
|
/** 响应过滤:数据库取出 → 返回前端前转换(如密码脱敏为 ***、日期格式化) */
|
||||||
resFilter?: (value: any, field: IFieldConfig, item: Record<string, any>) => any
|
resFilter?: (value: any, field: IFieldConfig, item: Record<string, any>) => any
|
||||||
|
/** 响应附带的展示文本:返回值写入 `${key}_label`,本体不变。用于结构化字段(如 tab)给人看的字符串,前端表格直接显示,不必自己序列化 */
|
||||||
|
resLabel?: (value: any, field: IFieldConfig, item: Record<string, any>) => string
|
||||||
/** 验证:保存前校验,返回错误 ILabel 或 null(可直接返回字面字符串、{t}、{tc} 等) */
|
/** 验证:保存前校验,返回错误 ILabel 或 null(可直接返回字面字符串、{t}、{tc} 等) */
|
||||||
validate?: (value: any, field: IFieldConfig, item: Record<string, any>) => ILabel | null | Promise<ILabel | null>
|
validate?: (value: any, field: IFieldConfig, item: Record<string, any>) => ILabel | null | Promise<ILabel | null>
|
||||||
/** 新增时的默认值(静态值或工厂函数) */
|
/** 新增时的默认值(静态值或工厂函数) */
|
||||||
@@ -276,6 +278,10 @@ export interface IFieldConfig {
|
|||||||
rules?: IFieldRule[] // 通用验证规则(前后端共用)
|
rules?: IFieldRule[] // 通用验证规则(前后端共用)
|
||||||
/** tab 类型专用:每个 type 对应的子字段配置 */
|
/** tab 类型专用:每个 type 对应的子字段配置 */
|
||||||
tabs?: { key: any; label: ILabel; fields: IFieldConfig[] }[]
|
tabs?: { key: any; label: ILabel; fields: IFieldConfig[] }[]
|
||||||
|
/** tab 类型专用:自定义序列化(export 列 / `${key}_label` 用),默认 JSON.stringify */
|
||||||
|
stringify?: (value: any) => string
|
||||||
|
/** tab 类型专用:自定义反序列化(import 还原对象),默认 JSON.parse */
|
||||||
|
parse?: (text: string) => any
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 通用验证规则(前后端共用) */
|
/** 通用验证规则(前后端共用) */
|
||||||
|
|||||||
@@ -48,24 +48,20 @@ export const defaultTypeHandlers: Record<string, IFieldTypeHandler> = {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
[ShrimpFieldTypes.Tab]: {
|
[ShrimpFieldTypes.Tab]: {
|
||||||
reqFilter: (value) => {
|
// tab 是结构化字段:库里/响应/编辑全程是对象,只在"给人看"的边界(import/export/label)走字符串。
|
||||||
|
reqFilter: (value, field) => {
|
||||||
if (value == null || value === "") return undefined
|
if (value == null || value === "") return undefined
|
||||||
if (typeof value === "string") {
|
if (typeof value === "string") {
|
||||||
try {
|
try {
|
||||||
return JSON.parse(value)
|
return (field.parse ?? JSON.parse)(value)
|
||||||
} catch {
|
} catch {
|
||||||
throw new ShrimpError({ t: 'shrimp.invalidJson' })
|
throw new ShrimpError({ t: 'shrimp.invalidJson' })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return value
|
return value
|
||||||
},
|
},
|
||||||
resFilter: (value) => {
|
// 本体原样下发对象(不再 stringify);展示文本走 _label
|
||||||
if (value == null) return value
|
resLabel: (value, field) => (field.stringify ?? JSON.stringify)(value),
|
||||||
if (typeof value === "object") {
|
|
||||||
return JSON.stringify(value)
|
|
||||||
}
|
|
||||||
return value
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -225,6 +221,9 @@ export class ShrimpTableModule<T, P extends ITableCrudProto<T> = ITableCrudProto
|
|||||||
if (handler?.resFilter && result[field.key] !== undefined) {
|
if (handler?.resFilter && result[field.key] !== undefined) {
|
||||||
result[field.key] = await handler.resFilter(result[field.key], field, result)
|
result[field.key] = await handler.resFilter(result[field.key], field, result)
|
||||||
}
|
}
|
||||||
|
if (handler?.resLabel && result[field.key] !== undefined) {
|
||||||
|
result[`${field.key}_label`] = handler.resLabel(result[field.key], field, result)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
@@ -396,7 +395,17 @@ export class ShrimpTableModule<T, P extends ITableCrudProto<T> = ITableCrudProto
|
|||||||
delete shrimpQuery.limit
|
delete shrimpQuery.limit
|
||||||
const result = await this.dataSource.list(shrimpQuery)
|
const result = await this.dataSource.list(shrimpQuery)
|
||||||
result.list = await this.prepareResponseItems(result.list)
|
result.list = await this.prepareResponseItems(result.list)
|
||||||
return result.list.map(item => this.filterHidden(item))
|
// 导出是"给人看"的边界:把带 resLabel 的结构化字段(如 tab)用其字符串文本替换对象本体,
|
||||||
|
// 列保持可读,且能被 import 的 reqFilter(parse)原样还原;去掉额外的 _label 列。
|
||||||
|
const labelFields = this.fields.filter(f => this.getTypeHandler(f)?.resLabel)
|
||||||
|
return result.list.map(item => {
|
||||||
|
const row = this.filterHidden(item)
|
||||||
|
for (const f of labelFields) {
|
||||||
|
if (row[`${f.key}_label`] !== undefined) row[f.key] = row[`${f.key}_label`]
|
||||||
|
delete row[`${f.key}_label`]
|
||||||
|
}
|
||||||
|
return row
|
||||||
|
})
|
||||||
}
|
}
|
||||||
async import(data?: T[], ownerId?: string): Promise<void> {
|
async import(data?: T[], ownerId?: string): Promise<void> {
|
||||||
if (!data || data.length === 0) return
|
if (!data || data.length === 0) return
|
||||||
|
|||||||
Reference in New Issue
Block a user