urit-qf-ui 0.2.6 → 1.0.0

package/dist/model/table-page.d.ts

@@ -0,0 +1,44 @@
+import { TableOptions } from './table';
+import { SearchOptions } from './search';
+/**
+ * 列表页用到的接口地址（yaml 的 api 段原样带出）。
+ *
+ * ⚠️ **只在配了对应地址时组件才发请求**，没配就把交互 emit 给使用方 —— 这是
+ * UTablePage 愿意内建请求的前提（与 UForm / UTable / USearch 的「组件不发请求」不冲突：
+ * 那几个组件没有 api 配置这一说，永远不会自己发）。
+ */
+export interface TablePageApi {
+    /** 列表查询接口（GET）。查询 / 重置 / 翻页 / 增删改成功后都打它 */
+    list?: string;
+    /** 删除接口（POST）。主键走 query：`POST <delete>?<key>=<row[key]>` */
+    delete?: string;
+    /** 其它自定义接口地址原样保留（使用方自己消费） */
+    [key: string]: any;
+}
+/** 列表页配置：搜索条件 + 表格 + 页面级接口，前两者都能单独喂给对应组件 */
+export interface TablePageConfig {
+    /** 表格配置，直接喂 <UTable :options> */
+    tableOptions: TableOptions;
+    /** 搜索栏配置，直接喂 <USearch :options> */
+    searchOptions: SearchOptions;
+    /**
+     * 主键字段名（yaml 的 `key`，如 `id`）。
+     * 删除与编辑回显都靠它拼参数：`?<key>=<row[key]>`；不写时组件兜底用 `'id'`。
+     */
+    key?: string;
+    /**
+     * 关联的表单配置 ID（yaml 的 `form`，如 `user`）。
+     * edit / add 时用它调 `GetFormConfig(form)` 取表单；也可由行按钮的 `action.form` 覆盖。
+     */
+    form?: string;
+    /** 接口地址（yaml 的 `api` 段）：list / delete */
+    api?: TablePageApi;
+    /**
+     * 分页方式（yaml 的 `pagination`）。
+     * 非空表示列表接口吃 `page` / `pageSize`，组件会自动把这两个参数拼上，
+     * 并按 `{rows, total}` 解析响应（见 qfcms 的 pageSlice）。
+     */
+    pagination?: any;
+    /** 后端 yaml 的 meta 段原样带出（tableId / title / version） */
+    meta?: Record<string, any>;
+}

package/dist/model/table.d.ts

@@ -0,0 +1,163 @@
+/**
+ * UTable —— 动态列表格的数据结构定义（model 层）
+ *
+ * 本层只定义**数据结构**，不放任何逻辑：
+ *   - 逻辑（取值 / 显示文案 / 列宽解析）在 ../utils/table.ts；
+ *   - 后端 yaml → 本层结构的转换在 ../parser/table-page.ts。
+ *
+ * 设计原则：
+ *   1. 基于 el-table / el-table-column 封装，属性语义 = EP 原生语义。
+ *   2. 组件本身不发任何请求。数据、分页、排序、筛选全由使用方通过 props 传入，
+ *      交互一律通过事件抛出，操作栏一律通过插槽交给使用方渲染。
+ *   3. 列的个性化配置走 column.props 逃生舱，EP 的 el-table-column 有什么属性能配什么；
+ *      单元格内容默认按 field 取值渲染，需要自定义就配 column.slot 走具名插槽。
+ */
+/**
+ * 列类型（渲染方式），与 form.ts 的 type 同思路，但表格列只区分「怎么显示」：
+ *   text      —— 纯文本（默认），按 field 取值
+ *   tag       —— el-tag 标签，可用 options 映射文字与颜色
+ *   image     —— el-image 图片
+ *   link      —— el-link 链接
+ *   switch    —— el-switch（只读展示场景少见，一般配 disabled）
+ *   progress  —— el-progress 进度条
+ *   index     —— 行序号（不需要 field）
+ *   selection —— 多选勾选框（不需要 field）
+ *   expand    —— 展开行（内容走 expand 插槽）
+ *   slot      —— 完全交给使用方的具名插槽渲染
+ */
+export type TableColumnType = 'text' | 'tag' | 'image' | 'link' | 'switch' | 'progress' | 'index' | 'selection' | 'expand' | 'slot';
+/** tag 列的值映射项（把后端的 1/0 等映射成文字 + 颜色） */
+export interface TableColumnOption {
+    /** 匹配的值 */
+    value: any;
+    /** 显示文字 */
+    label: string;
+    /** el-tag 的类型：primary / success / info / warning / danger */
+    type?: 'primary' | 'success' | 'info' | 'warning' | 'danger';
+    /** 自定义颜色（优先于 type，直接给 el-tag 的 color） */
+    color?: string;
+}
+/**
+ * 行操作按钮配置（对应 yaml 里 tables/<id>.yaml 的 actions）。
+ *
+ * 组件只负责把按钮画出来，点击时把**整个 action 配置**连同行数据通过
+ * `action-click` 事件原样抛出 —— 具体干什么（打开表单 / 调删除接口 …）由使用方决定。
+ * 所以 yaml 里附加的自定义字段（如 form: user）会一路保留到事件参数里。
+ *
+ * 注：页面底部的工具栏（导出/返回/设置…）是**页面级**的，不归 UTable。
+ */
+export interface TableActionConfig {
+    /** 点击意图（edit / delete / add / 自定义），使用方按它分发 */
+    action: string;
+    /** 按钮文字 */
+    text?: string;
+    /** 按钮颜色类型（给 el-button 的 type）：primary / success / warning / danger / info */
+    style?: 'primary' | 'success' | 'warning' | 'danger' | 'info';
+    /** 关联的表单配置 ID（edit / add 场景的提示信息，组件只透传不使用） */
+    form?: string;
+    /** 透传给 el-button 的其它属性（size / icon / plain / disabled …） */
+    props?: Record<string, any>;
+    /** 其它自定义字段原样保留（emit 时一并抛出） */
+    [key: string]: any;
+}
+/** 单列配置 */
+export interface TableColumnConfig {
+    /**
+     * 取值字段名，对应行数据里的 key。
+     * 支持点路径（如 'user.name'）。
+     * index / selection / expand 三类列不需要 field。
+     */
+    field?: string;
+    /** 列标题 */
+    label?: string;
+    /** 列渲染类型，默认 'text' */
+    type?: TableColumnType;
+    /**
+     * 透传给 el-table-column 的属性：
+     * width / minWidth / fixed / align / headerAlign / sortable / showOverflowTooltip …
+     */
+    props?: Record<string, any>;
+    /** 该列是否显示（false 或 hidden: true 都不渲染），默认显示 */
+    hidden?: boolean;
+    /** 列宽快捷写法（等价于 props.width），数字按 px */
+    width?: number | string;
+    /** 最小列宽快捷写法（等价于 props.minWidth），数字按 px */
+    minWidth?: number | string;
+    /** 固定列快捷写法（等价于 props.fixed） */
+    fixed?: boolean | 'left' | 'right';
+    /** 对齐快捷写法（等价于 props.align） */
+    align?: 'left' | 'center' | 'right';
+    /** 是否可排序快捷写法（等价于 props.sortable） */
+    sortable?: boolean | 'custom';
+    /** 内容超出是否显示 tooltip（等价于 props.showOverflowTooltip） */
+    showOverflowTooltip?: boolean;
+    /** tag 列的值映射（type: 'tag' 时生效） */
+    options?: TableColumnOption[];
+    /**
+     * 是否使用具名插槽渲染该列。
+     * 传字符串则作为插槽名（便于 field 与插槽名不一致）；传 true 时用 field 当插槽名。
+     * 插槽作用域：{ row, column, $index, value }
+     */
+    slot?: boolean | string;
+    /** 空值占位文字，默认 '-' */
+    emptyText?: string;
+    /** 简单格式化：只有是函数时才生效（Vue 模板里也能配，适合日期等轻量转换） */
+    formatter?: (row: any, value: any, index: number) => any;
+}
+/** UTable 表格级配置 */
+export interface TableOptions {
+    /** 列配置 */
+    columns: TableColumnConfig[];
+    /** 表格数据（也可以走组件的 data prop，两处取其一，data prop 优先） */
+    data?: any[];
+    /** 行数据的唯一键，透传给 el-table 的 row-key；不传则自动尝试用 id */
+    rowKey?: string;
+    /** 是否显示边框（等价于 el-table 的 border），默认 true */
+    border?: boolean;
+    /** 是否斑马纹，默认 false */
+    stripe?: boolean;
+    /** 是否显示表头，默认 true */
+    showHeader?: boolean;
+    /** 空数据文案，默认 '暂无数据' */
+    emptyText?: string;
+    /** 表格尺寸，默认继承 el-form 默认值 */
+    size?: 'large' | 'default' | 'small';
+    /** 是否默认展开所有行 */
+    defaultExpandAll?: boolean;
+    /** 行高（表头行高 + 数据行高快捷配置） */
+    headerRowClassName?: string | ((data: any) => string);
+    rowClassName?: string | ((data: any) => string);
+    /** 是否高亮当前行，默认 false */
+    highlightCurrentRow?: boolean;
+    /** 最大高度 / 高度（给 el-table 做固定表头用），数字按 px */
+    maxHeight?: number | string;
+    height?: number | string;
+    /** 默认排序，同 el-table 的 default-sort，如 {prop: 'createTime', order: 'descending'} */
+    defaultSort?: Record<string, any>;
+    /** 行操作按钮配置（点击意图 action + 文字 text + 颜色 style …）。点击时 emit action-click(整个配置, 行数据, 行号) */
+    actions?: TableActionConfig[];
+    /** 操作栏固定位置，默认 'right'（配了 actions 或传了 #actions 插槽才渲染操作栏） */
+    actionFixed?: boolean | 'left' | 'right';
+    /** 操作栏宽度，默认 160 */
+    actionWidth?: number | string;
+    /** 操作栏对齐，默认 'center' */
+    actionAlign?: 'left' | 'center' | 'right';
+}
+/** 表格列插槽作用域 */
+export interface TableColumnSlotProps {
+    /** 当前行数据 */
+    row: any;
+    /** el-table-column 的 column 对象 */
+    column: any;
+    /** 行索引 */
+    $index: number;
+    /** 该列对应的值（已按 field 取好） */
+    value: any;
+}
+/** 操作栏插槽作用域（每行一份） */
+export interface TableActionSlotProps {
+    /** 当前行数据 */
+    row: any;
+    /** 行索引 */
+    $index: number;
+}

package/dist/parser/cascader.d.ts

@@ -0,0 +1,35 @@
+import { CascaderLevelMeta, CascaderOption, CascaderOptions } from '../model/cascader';
+export declare class CascaderParser {
+    /**
+     * 逐级往下走 children，得到层级链（第 1 级在最前）。
+     * 一个 field 都没写就返回空数组（不猜）。
+     */
+    parseLevels(yaml: Record<string, any>): CascaderLevelMeta[];
+    /**
+     * 该 yaml 项是不是一个**级联** select。
+     * 判定依据只看结构，不看 dictType —— 单层字典下拉（type: dict + dictType）不是级联：
+     *   - 内联树里有嵌套（节点带 children）或节点上描述了下一级（带 field）→ 是级联；
+     *   - children 链声明了不止一级 → 是级联。
+     */
+    isCascade(yaml: Record<string, any>): boolean;
+    /**
+     * yaml 的级联项 → UCascader 配置。
+     * - 写法 B（有 options 树）→ options 直接就是规范化后的树；
+     * - 写法 A（children 链）→ options 是空数组，真实选项要用 stampLevels(字典树, levels) 拿到后再补上。
+     */
+    parse(yaml: Record<string, any>): CascaderOptions;
+    /**
+     * 把「每级一个字段名」的层级链打到字典树上：
+     * 深度 0 的节点打上 levels[1] 的 field/fieldLabel（**描述的是下一级**），
+     * 深度 1 的节点打上 levels[2]，以此类推；最后一层的节点不带 field。
+     *
+     * 用于写法 A —— 整棵级联树来自一个 dictType，yaml 里只声明了每级叫什么。
+     * 返回新树，不改原数据。
+     */
+    stampLevels(tree: any, levels: CascaderLevelMeta[]): CascaderOption[];
+    /**
+     * 便捷组合：解析 + 打层级（拿到字典树之后一步到位）。
+     * 已经内联了 options 树（写法 B）时不会覆盖它。
+     */
+    build(yaml: Record<string, any>, tree: any): CascaderOptions;
+}

package/dist/parser/form.d.ts

@@ -0,0 +1,7 @@
+import { FormConfig, FormFieldConfig } from '../model/form';
+export declare class FormParser {
+    /** 单个 yaml 字段 → UForm 字段配置 */
+    parseField(yamlField: Record<string, any>): FormFieldConfig;
+    /** 表单 yaml → FormConfig（formOptions + api / layout / meta） */
+    parse(yaml: Record<string, any>): FormConfig;
+}

package/dist/parser/menu.d.ts

@@ -0,0 +1,5 @@
+import { MenuConfig } from '../model/menu';
+export declare class MenuParser {
+    /** 菜单 yaml → MenuConfig（menuOptions + menuId / meta） */
+    parse(yaml: Record<string, any>): MenuConfig;
+}

package/dist/parser/table-page.d.ts

@@ -0,0 +1,15 @@
+import { TablePageConfig } from '../model/table-page';
+import { TableColumnConfig } from '../model/table';
+import { SearchItem, SearchOptions } from '../model/search';
+export declare class TablePageParser {
+    /** 级联（多级联动 select）单独处理，本类通过它把级联配置组合进搜索项 */
+    private readonly cascader;
+    /** 单个 yaml 列 → UTable 列配置 */
+    parseColumn(yamlColumn: Record<string, any>): TableColumnConfig;
+    /** 单个 yaml 搜索条件 → USearch 搜索项（级联项在这里交给 CascaderParser） */
+    parseSearchItem(yamlItem: Record<string, any>): SearchItem;
+    /** yaml 的 search 段 → USearch 配置（传数组或整份 yaml 都行） */
+    parseSearch(yaml: Record<string, any>[] | Record<string, any>): SearchOptions;
+    /** 列表页 yaml → TablePageConfig（表格 + 搜索条件 + 页面级参数） */
+    parse(yaml: Record<string, any>): TablePageConfig;
+}

package/dist/parser/yaml-parser.d.ts

@@ -0,0 +1,41 @@
+import { Http } from '../qf/http';
+import { FormConfig } from '../model/form';
+import { TablePageConfig } from '../model/table-page';
+import { MenuConfig } from '../model/menu';
+/**
+ * 配置类别（对应后端 /api/form 的 type 参数）
+ *   forms  —— 表单配置（config/forms/<id>.yaml）
+ *   tables —— 表格配置（config/tables/<id>.yaml）
+ *   menus  —— 菜单配置（config/menus/<id>.yaml）
+ */
+export type CfgType = 'forms' | 'tables' | 'menus';
+/**
+ * 配置接口路径 —— 本文件是唯一真源，使用方要自己取原始 yaml 时也用它拼地址：
+ * `GetQf(options).Get(formCfgApi('user', 'tables'))`。
+ *
+ * GET /api/form?type=<forms|tables|menus>&id=<配置文件名称>
+ * 后端读取 ./output/config/<type>/<id>.yaml
+ *
+ * @param id 配置文件名称（不带 .yaml）
+ * @param type 配置类别：forms（表单）/ tables（表格）/ menus（菜单）
+ */
+export declare function formCfgApi(id: string, type?: CfgType): string;
+export declare class YamlParser {
+    /** Qf 的请求出口（qf/http 的 Http 实例，由 QfImpl 构造时传进来） */
+    private readonly WebApi;
+    private readonly formParser;
+    private readonly tablePageParser;
+    private readonly menuParser;
+    constructor(WebApi: Http);
+    /** 表单配置：取 forms/<id>.yaml → 交给 FormParser → FormConfig */
+    parseForm(id: string): Promise<FormConfig>;
+    /** 列表页配置：取 tables/<id>.yaml → 交给 TablePageParser → TablePageConfig */
+    parseTablePage(id: string): Promise<TablePageConfig>;
+    /** 菜单配置：取 menus/<id>.yaml → 交给 MenuParser → MenuConfig */
+    parseMenu(id: string): Promise<MenuConfig>;
+    /**
+     * 取一份后端配置（yaml 转出的 JSON，原样返回、不做转换）。
+     * 三个 parse 方法共用；请求失败 / 业务码非 0 时抛错，message 带上配置 ID 方便定位。
+     */
+    private getYaml;
+}

package/dist/qf/http.d.ts

@@ -1,48 +1,70 @@
-import { QfOptions } from './interface.ts';
+import { HttpResponse, QfOptions } from './interface.ts';
 /**
- * 解析「免配」时的默认基地址 —— 也就是「后端 = 前端的 IP + 端口」这件事的兜底实现。
+ * 解析「本页面所在**目录**」的绝对地址（不含结尾斜杠）—— 免配模式下接口前缀的推导依据。
  *
- * 优先级（最终由 Http 决定）：
- *   1. `QfOptions.baseUrl`（public/config/config.json 的 qfOptions.baseUrl）—— 配了就以它为准，
- *      用于前后端不同机/不同端口/走网关的场景；
- *   2. 本文档自己的地址 `document.baseURI` —— 免配默认值；
- *   3. `window.$wujie.location.origin` —— 无界子应用的兜底；
- *   4. `window.location.origin` —— 最后兜底。
+ * 结果只取决于**页面自己的地址**（`document.baseURI`），与构建/部署方式无关，
+ * 所以同一份产物放到任意路径下都能用：
  *
- * ⚠️ 为什么不能直接用 `window.location.origin`（历史写法，已改掉）：
- *    被无界（wujie）以微前端方式嵌入时，子应用跑在一个 **同源的 `blob:` 空 iframe** 里，
- *    那个 iframe 的 location 就是**主应用**的地址 → `window.location.origin` 返回主应用的
- *    域名/端口，接口会被打到主应用上去（实测：主应用 8111、子应用 8000，登录请求发成了
- *    `POST http://127.0.0.1:8111/api/user/Login`，必然失败）。
- *    而 `document.baseURI` 描述的是**文档自身**的地址 —— 无界会给子应用注入正确的
- *    `<base href="子应用地址">`，所以「独立运行」和「被嵌入」两种情况下它都指向子应用自己。
+ * | 页面地址 | 返回 |
+ * |---|---|
+ * | `http://host/` | `http://host` |
+ * | `http://host/index.html` | `http://host` |
+ * | `http://host/qfcms/` | `http://host/qfcms` |
+ * | `http://host/qfcms`（末尾无斜杠，nginx try_files 的常见形态） | `http://host/qfcms` |
+ * | `http://host/qfcms/index.html` | `http://host/qfcms` |
  *
- * 只取 origin（不含路径）：与前端的部署路径无关，接口一律按「同 IP + 同端口」发。
- * 需要带路径/别的域名时，在 config.json 里显式配 baseUrl。
+ * 两条容易踩的细节：
+ *  1. **只有当最后一段含 `.` 时才当成文件名丢掉**（`index.html` → 丢，`qfcms` → 保留）。
+ *     否则访问 `/qfcms`（无斜杠）会被误判成文件，前缀掉成站点根。
+ *  2. 不用 `window.location.origin`：无界（wujie）嵌入时子应用跑在同源 `blob:` 空 iframe 里，
+ *     `window.location` 指向**主应用**（实测把请求发成了 `http://主应用:8111/api/...`）。
+ *     `document.baseURI` 描述文档自身，无界会注入正确的 `<base href="子应用地址">`，
+ *     「独立运行」和「被嵌入」两种情况下都指向子应用自己。
+ */
+export declare function resolveAppBase(): string;
+/**
+ * 全库**唯一**的 HTTP 客户端（`Qf.WebApi`）。
+ *
+ * 组件、渲染器、工具函数一律通过 `getQf().Get/Post/...` 发请求，
+ * 不再各自 `axios.create`（历史上另有一份 `ts/http.ts`，已删）。
+ *
+ * 三条约定：
+ *   1. **鉴权头是 `token`**，不是 `Authorization`。httptoqfapi 会把全部 HTTP header
+ *      合并进请求参数，后端按 `Token` 取用 —— 所以只有 `token` 头能通过鉴权。
+ *   2. **响应做「业务码归一化」**：后端恒返回 `{code, message, data}`，`code === 0` 为成功。
+ *      这里给成功的响应补一个 `status = 200` 字段，让调用方可以继续写
+ *      `if (res.status === 200)`（兼容旧后端的 status 字段，两边都认）。
+ *   3. **blob 原样返回**：下载/导出走 `Download` / `PostDownload`，拦截器不脱壳，
+ *      调用方自己取 `res.data as Blob`。
  */
-export declare function resolveBaseUrl(): string;
 export declare class Http {
     private axiosInstance;
-    private baseUrl;
+    private baseCache;
     constructor(options: QfOptions);
     /**
-     * POST 请求
+     * GET 请求（params 会被 axios 序列化成 query string）
      */
-    Post(url: string, data?: any): Promise<any>;
+    Get<T = any>(url: string, params?: any): Promise<HttpResponse<T>>;
     /**
-     * GET 请求
+     * POST 请求（body 支持普通对象与 FormData；
+     * FormData 时 axios 会自动让浏览器设置带 boundary 的 Content-Type）
      */
-    Get(url: string, params?: any): Promise<any>;
+    Post<T = any>(url: string, data?: any): Promise<HttpResponse<T>>;
     /**
-     * DELETE 请求
+     * DELETE 请求（参数走 query string，与后端路由约定一致）
      */
-    Delete(url: string, params?: any): Promise<any>;
+    Delete<T = any>(url: string, params?: any): Promise<HttpResponse<T>>;
     /**
      * PUT 请求
      */
-    Put(url: string, data?: any): Promise<any>;
+    Put<T = any>(url: string, data?: any): Promise<HttpResponse<T>>;
+    /**
+     * 下载文件（GET + blob）—— 返回**完整 AxiosResponse**，调用方取 `res.data as Blob`
+     */
+    Download<T = any>(url: string, params?: any): Promise<T>;
     /**
-     * 下载文件
+     * 下载文件（POST + blob，用于「按查询条件导出」这类接口）——
+     * 同样返回完整 AxiosResponse。
      */
-    Download(url: string, params?: any): Promise<any>;
+    PostDownload<T = any>(url: string, data?: any): Promise<T>;
 }

package/dist/qf/interface.d.ts

@@ -1,13 +1,54 @@
+import { FormConfig } from '../model/form';
+import { TablePageConfig } from '../model/table-page';
+import { MenuConfig } from '../model/menu';
+/**
+ * 后端统一响应包。
+ *
+ * httptoqfapi 恒返回 `{code, message, data}`，`code === 0` 表示成功；
+ * Http 的响应拦截器会给成功响应补一个 `status = 200`，所以
+ * `if (res.status === 200)` 与 `if (res.code === 0)` 两种写法都可用。
+ */
+export interface HttpResponse<T = any> {
+    code?: number;
+    status?: number;
+    message?: string;
+    data: T;
+    [key: string]: any;
+}
 export interface QfInterface {
     On(event: string, callback: any): void;
     Emit(event: string, data: any): void;
     Off(event: string, callback: any): void;
-    Post<T>(url: string, data: any): Promise<T>;
-    Get<T>(url: string, params: any): Promise<T>;
-    Delete<T>(url: string, params: any): Promise<T>;
-    Put<T>(url: string, data: any): Promise<T>;
+    Post<T>(url: string, data?: any): Promise<HttpResponse<T>>;
+    /** GET；params 可选（省略即不带 query string） */
+    Get<T>(url: string, params?: any): Promise<HttpResponse<T>>;
+    /** DELETE；参数走 query string */
+    Delete<T>(url: string, params?: any): Promise<HttpResponse<T>>;
+    Put<T>(url: string, data?: any): Promise<HttpResponse<T>>;
+    /** 下载（GET + blob）：返回**完整 AxiosResponse**，调用方取 .data as Blob */
     Download<T>(url: string, params?: any): Promise<T>;
+    /** 导出（POST + blob）：返回**完整 AxiosResponse**，调用方取 .data as Blob */
+    PostDownload<T>(url: string, data?: any): Promise<T>;
     RegNotice(topic: string, cb: (data: any) => void): void;
+    /**
+     * 取表单配置（GET /api/form?type=forms&id=<id>）并解析成 FormConfig。
+     * `config.formOptions` 直接喂 `<UForm :options="...">`；
+     * `config.api`（get / add / edit）与 `config.layout`（弹窗宽度等）由打开表单的一方消费。
+     */
+    GetFormConfig(id: string): Promise<FormConfig>;
+    /**
+     * 取列表页配置（GET /api/form?type=tables&id=<id>）并解析成 TablePageConfig。
+     * 直接喂 `<UTablePage :options="...">`（或只给 tableId，让它自己取）；
+     * 也可以拆开分别给 `<UTable>` / `<USearch>` 用。
+     */
+    GetTablePageConfig(id: string): Promise<TablePageConfig>;
+    /**
+     * 取菜单配置（GET /api/form?type=menus&id=<id>）并解析成 MenuConfig。
+     * `config.menuOptions` 直接喂 `<UMenu :options="...">`。
+     * 字典菜单的 dictType 会原样带在 menuOptions 上 ——
+     * 字典树要使用方自己取好后填进 menus。
+     */
+    GetMenuConfig(id: string): Promise<MenuConfig>;
 }
 export interface QfOptions {
     module: string;

package/dist/qf/qf.d.ts

@@ -1,13 +1,42 @@
 import { Http } from './http';
-import { QfInterface, QfOptions } from './interface';
+import { HttpResponse, QfInterface, QfOptions } from './interface';
 import { EventBus } from './event-bus';
 import { MqttAdapter } from './mqtt-adapter';
+import { YamlParser } from '../parser/yaml-parser';
+import { FormConfig } from '../model/form';
+import { TablePageConfig } from '../model/table-page';
+import { MenuConfig } from '../model/menu';
+/**
+ * 初始化（或取回）Qf 单例 —— **使用方入口调用一次**，通常在 main.ts / App.vue 里：
+ *
+ * ```ts
+ * const options = await fetch('./config/config.json').then(r => r.json()).then(c => c.qfOptions)
+ * const Qf = GetQf(options)
+ * Qf.Get('/api/user', {})
+ * ```
+ *
+ * 重复调用只会返回首次创建的那个实例；若此前是 getQf() 的兜底实例，
+ * 则用本次传入的 options 重建（保证入口配置最终生效）。
+ */
 export declare const GetQf: (options: QfOptions) => QfInterface;
+/**
+ * 取 Qf 单例 —— **库内部与使用方通用**。
+ *
+ * 与 GetQf(options) 的区别：不需要传 options，且在「使用方还没初始化」时不会报错，
+ * 而是用一个「免配 options」惰性建一个实例（后端 = 页面所在目录 + /api，即 resolveAppBase 的语义）。
+ *
+ * 为什么需要它：Qf 一般在 App.vue 里**异步**初始化（要先 fetch config.json），
+ * 而使用方与解析层（parser）可能在同一帧就已经想要取配置了。
+ * 兜底实例随后会被真正的 GetQf(options) 替换，所以不会影响最终配置。
+ */
+export declare const getQf: () => QfInterface;
 export declare class QfImpl implements QfInterface {
     EventBus: EventBus;
     WebApi: Http;
     Mqtt: MqttAdapter;
     options: QfOptions;
+    /** 动态配置解析器（parser/）：Qf 只做转发，实现都在解析层 */
+    yamlParser: YamlParser;
     constructor(options: QfOptions);
     /**
      * 初始化 Qf
@@ -16,10 +45,27 @@ export declare class QfImpl implements QfInterface {
     On(event: string, callback: any): void;
     Emit(event: string, data: any): void;
     Off(event: string, callback: any): void;
-    Post(url: string, data?: any): Promise<any>;
-    Get(url: string, params?: any): Promise<any>;
-    Delete(url: string, params?: any): Promise<any>;
-    Put(url: string, data?: any): Promise<any>;
-    Download(url: string, params?: any): Promise<any>;
+    Post<T>(url: string, data?: any): Promise<HttpResponse<T>>;
+    Get<T>(url: string, params?: any): Promise<HttpResponse<T>>;
+    Delete<T>(url: string, params?: any): Promise<HttpResponse<T>>;
+    Put<T>(url: string, data?: any): Promise<HttpResponse<T>>;
+    Download<T>(url: string, params?: any): Promise<T>;
+    PostDownload<T>(url: string, data?: any): Promise<T>;
     RegNotice(topic: string, cb: (data: any) => void): void;
+    /**
+     * 取表单配置并解析（GET /api/form?type=forms&id=<id>）。
+     * 返回 FormConfig：`config.formOptions` 喂 <UForm :options>，
+     * `config.api` / `config.layout` 是页面级参数（提交地址、弹窗宽度），组件不吃。
+     */
+    GetFormConfig(id: string): Promise<FormConfig>;
+    /**
+     * 取列表页配置并解析（GET /api/form?type=tables&id=<id>）。
+     * 返回 TablePageConfig：直接喂 <UTablePage :options="...">（也可以只给 tableId 让它自己取）。
+     */
+    GetTablePageConfig(id: string): Promise<TablePageConfig>;
+    /**
+     * 取菜单配置并解析（GET /api/form?type=menus&id=<id>）。
+     * 返回 MenuConfig：`config.menuOptions` 喂 <UMenu :options>。
+     */
+    GetMenuConfig(id: string): Promise<MenuConfig>;
 }

package/dist/style.css

@@ -1 +1 @@
-@charset "UTF-8";.u-input[data-v-ecf5177c]{display:flex;width:100%}.u-input.u-input-label-left .u-input-label[data-v-ecf5177c]{padding-top:10px;flex-shrink:0;text-align:right;padding-right:12px;font-size:14px;color:#606266;white-space:nowrap}.u-input.u-input-label-left .u-input-field[data-v-ecf5177c]{flex:1}.u-input.u-input-label-top[data-v-ecf5177c]{flex-direction:column}.u-input.u-input-label-top .u-input-label[data-v-ecf5177c]{width:100%;font-size:14px;color:#606266;margin-bottom:8px;white-space:nowrap}.u-input .required-star[data-v-ecf5177c]{color:#f56c6c;display:inline-block;width:10px}.u-input .required-star[data-v-ecf5177c]:not(.required-star--visible){color:transparent}.u-input .u-input-field--top[data-v-ecf5177c]{width:100%}.u-input-number[data-v-cb70bd5b]{display:flex;width:100%}.u-input-number.u-input-number-label-left .u-input-number-label[data-v-cb70bd5b]{padding-top:10px;flex-shrink:0;text-align:right;padding-right:12px;font-size:14px;color:#606266;white-space:nowrap}.u-input-number.u-input-number-label-left .u-input-number-field[data-v-cb70bd5b]{flex:1}.u-input-number.u-input-number-label-top[data-v-cb70bd5b]{flex-direction:column}.u-input-number.u-input-number-label-top .u-input-number-label[data-v-cb70bd5b]{width:100%;font-size:14px;color:#606266;margin-bottom:8px;white-space:nowrap}.u-input-number .required-star[data-v-cb70bd5b]{color:#f56c6c;display:inline-block;width:10px}.u-input-number .required-star[data-v-cb70bd5b]:not(.required-star--visible){color:transparent}.u-dict[data-v-8bfd4dcf]{display:flex;width:100%}.u-dict.u-dict-label-left .u-dict-label[data-v-8bfd4dcf]{padding-top:10px;flex-shrink:0;text-align:right;padding-right:12px;font-size:14px;color:#606266;white-space:nowrap}.u-dict.u-dict-label-left .u-dict-field[data-v-8bfd4dcf]{flex:1}.u-dict.u-dict-label-top[data-v-8bfd4dcf]{flex-direction:column}.u-dict.u-dict-label-top .u-dict-label[data-v-8bfd4dcf]{width:100%;font-size:14px;color:#606266;margin-bottom:8px;white-space:nowrap}.u-dict .required-star[data-v-8bfd4dcf]{color:#f56c6c;display:inline-block;width:10px}.u-dict .required-star[data-v-8bfd4dcf]:not(.required-star--visible){color:transparent}.u-toggle[data-v-94c1fd38]{display:flex;width:100%}.u-toggle.u-toggle-label-left[data-v-94c1fd38]{flex-direction:row;align-items:flex-start}.u-toggle.u-toggle-label-left .u-toggle-label[data-v-94c1fd38]{padding-top:10px;flex-shrink:0;text-align:right;padding-right:12px;margin-bottom:0;white-space:nowrap}.u-toggle.u-toggle-label-left .u-toggle-field[data-v-94c1fd38]{flex:1}.u-toggle[data-v-94c1fd38]:not(.u-toggle-label-left){flex-direction:column}.u-toggle:not(.u-toggle-label-left) .u-toggle-label[data-v-94c1fd38]{width:100%;margin-bottom:4px;white-space:nowrap}.u-toggle .u-toggle-label[data-v-94c1fd38]{font-size:14px;color:#606266}.u-toggle .u-toggle-label .required-star[data-v-94c1fd38]{color:#f56c6c;display:inline-block;width:10px}.u-toggle .u-toggle-label .required-star[data-v-94c1fd38]:not(.required-star--visible){color:transparent}.u-toggle .u-toggle-field[data-v-94c1fd38]{display:flex;align-items:center}.u-cascader[data-v-d66c339c]{display:flex;width:100%}.u-cascader.u-cascader-label-left[data-v-d66c339c]{flex-direction:row;align-items:flex-start}.u-cascader.u-cascader-label-left .u-cascader-label[data-v-d66c339c]{padding-top:10px;flex-shrink:0;text-align:right;padding-right:12px;margin-bottom:0;white-space:nowrap}.u-cascader.u-cascader-label-left .u-cascader-levels[data-v-d66c339c]{flex:1}.u-cascader[data-v-d66c339c]:not(.u-cascader-label-left){flex-direction:column}.u-cascader:not(.u-cascader-label-left) .u-cascader-label[data-v-d66c339c]{width:100%;margin-bottom:8px;white-space:nowrap}.u-cascader .u-cascader-label[data-v-d66c339c]{font-size:14px;color:#606266}.u-cascader .u-cascader-label .required-star[data-v-d66c339c]{color:#f56c6c;display:inline-block;width:10px}.u-cascader .u-cascader-label .required-star[data-v-d66c339c]:not(.required-star--visible){color:transparent}.u-cascader .u-cascader-levels[data-v-d66c339c]{display:flex;gap:8px;flex-wrap:wrap}.u-cascader .u-cascader-level[data-v-d66c339c]{flex:1;min-width:120px}.u-date[data-v-9cd05064]{display:flex;width:100%}.u-date.u-date-label-left[data-v-9cd05064]{flex-direction:row;align-items:flex-start}.u-date.u-date-label-left .u-date-label[data-v-9cd05064]{padding-top:10px;flex-shrink:0;text-align:right;padding-right:12px;margin-bottom:0;white-space:nowrap}.u-date.u-date-label-left .u-date-field[data-v-9cd05064]{flex:1}.u-date[data-v-9cd05064]:not(.u-date-label-left){flex-direction:column}.u-date:not(.u-date-label-left) .u-date-label[data-v-9cd05064]{width:100%;margin-bottom:8px;white-space:nowrap}.u-date .u-date-label[data-v-9cd05064]{font-size:14px;color:#606266}.u-date .u-date-label .required-star[data-v-9cd05064]{color:#f56c6c;display:inline-block;width:10px}.u-date .u-date-label .required-star[data-v-9cd05064]:not(.required-star--visible){color:transparent}.u-menu[data-v-fe63251c]{display:flex;height:100%;min-height:0;background:#fff}.u-menu .u-menu-icon[data-v-fe63251c]{margin-right:6px}.u-menu.u-menu--sidebar[data-v-fe63251c]{flex-direction:column;border-right:1px solid #e4e7ed}.u-menu.u-menu--sidebar .u-menu-brand[data-v-fe63251c]{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:16px 12px;border-bottom:1px solid #e4e7ed}.u-menu.u-menu--sidebar .u-menu-list[data-v-fe63251c]{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;border-right:none}.u-menu.u-menu--sidebar .u-menu-logout[data-v-fe63251c]{flex-shrink:0;width:100%;border-top:1px solid #e4e7ed}.u-menu.u-menu--sidebar .u-menu-logout-btn[data-v-fe63251c]{display:block;width:100%}.u-menu.u-menu--horizontal[data-v-fe63251c]{flex-direction:row;align-items:center;width:100%;border-bottom:1px solid #e4e7ed}.u-menu.u-menu--horizontal .u-menu-brand[data-v-fe63251c]{flex-shrink:0;display:flex;align-items:center;padding:0 16px;white-space:nowrap}.u-menu.u-menu--horizontal .u-menu-list[data-v-fe63251c]{flex:1;min-width:0;border-bottom:none}.u-menu.u-menu--horizontal .u-menu-logout[data-v-fe63251c]{flex-shrink:0;display:flex;align-items:center;padding:0 12px;margin-left:auto}.u-menu .u-menu-logo[data-v-fe63251c]{height:28px;margin-right:8px}.u-menu .u-menu-brand-text[data-v-fe63251c]{font-size:18px;font-weight:600;color:#303133;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.form-content[data-v-83362259]{min-height:100px}.form-layout[data-v-83362259]{width:100%;background:#fff}.form-header[data-v-83362259]{display:flex;align-items:center;padding:16px;border-bottom:1px solid #eee}.form-header .title[data-v-83362259]{font-size:18px;font-weight:500}.form-body[data-v-83362259]{padding:16px;min-height:100px}.form-footer[data-v-83362259]{display:flex;justify-content:flex-end;gap:8px;padding:16px;border-top:1px solid #eee}.is-loading[data-v-83362259]{display:flex;justify-content:center;align-items:center;min-height:100px;color:#409eff}.form-grid[data-v-90ed35a4]{display:grid;grid-template-columns:repeat(var(--grid-columns, 1),minmax(0,1fr));gap:8px;width:100%}.form-grid-item[data-v-90ed35a4]{min-width:0}.form-field[data-v-10299c8d]{width:100%}.field-error[data-v-10299c8d]{color:#f56c6c;font-size:12px;min-height:12px;line-height:1.5;transition:opacity .2s}.field-error[data-v-10299c8d]:not(.field-error--visible){opacity:0}.form-render[data-v-b3267c00]{width:100%}.form-actions[data-v-b3267c00]{display:flex;gap:8px}.justify-end[data-v-b3267c00]{justify-content:flex-end}.justify-start[data-v-b3267c00]{justify-content:flex-start}.table-search[data-v-0281d2ce]{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:16px;background:#fff;border-bottom:1px solid #eee}.table-search .search-fields[data-v-0281d2ce]{display:flex;flex-wrap:wrap;gap:12px}.table-search .search-field[data-v-0281d2ce]{display:flex;align-items:center;gap:8px;min-width:200px}.table-search .search-actions[data-v-0281d2ce]{display:flex;gap:8px;flex-shrink:0}.table-toolbar[data-v-0538c013]{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;padding:12px 16px;border-top:1px solid darkgrey}.table-toolbar .toolbar-items[data-v-0538c013]{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.u-input-show[data-v-c78b151e]{font-size:14px;line-height:1.5;color:#333;word-break:break-all}.u-input-show.u-input-multiline[data-v-c78b151e]{white-space:pre-wrap}.u-dict-show[data-v-908045c4]{font-size:14px;line-height:1.5;color:#333}.u-dict-show.u-dict-loading[data-v-908045c4]{color:#999}.u-toggle-show[data-v-bac05efc]{display:inline-block;padding:2px 8px;border-radius:4px;font-size:14px;line-height:1.5}.u-toggle-show.toggle-true[data-v-bac05efc]{background-color:#e6f7ed;color:#52c41a}.u-toggle-show.toggle-false[data-v-bac05efc]{background-color:#fff1f0;color:#ff4d4f}.u-toggle-show.toggle-default[data-v-bac05efc]{color:#999}.u-cascader-show[data-v-5d84df67]{font-size:14px;line-height:1.5;color:#333}.u-cascader-show.u-cascader-loading[data-v-5d84df67]{color:#999}.u-date-show[data-v-930657df]{font-size:14px;line-height:1.5;color:#333}.u-date-show.u-date-empty[data-v-930657df]{color:#999}.u-field-view[data-v-05ef52d9]{display:inline-block}.table-grid[data-v-d3eed11d]{background:#fff}.table-grid .no-data[data-v-d3eed11d]{padding:48px;text-align:center;color:#999}.table-grid[data-v-d3eed11d] .table-grid-active-row td.el-table__cell{background-color:var(--el-color-primary-light-9, #ecf5ff)!important}.table-pagination[data-v-2ca77d18]{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#fff;border-top:1px solid #eee}.table-pagination .page-size-select[data-v-2ca77d18]{display:flex;align-items:center;gap:12px}.table-pagination .total-text[data-v-2ca77d18]{color:#666;font-size:14px}.table-pagination .load-more[data-v-2ca77d18]{flex:1;text-align:center}.table-detail[data-v-7e47b0ba]{display:flex;flex-direction:column;height:100%;min-height:0;background:#fff}.table-detail .detail-header[data-v-7e47b0ba]{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #ebeef5}.table-detail .detail-header .detail-title[data-v-7e47b0ba]{font-size:15px;font-weight:500}.table-detail .detail-body[data-v-7e47b0ba]{flex:1;min-height:0;overflow:auto}.table-detail .detail-status[data-v-7e47b0ba]{display:flex;align-items:center;justify-content:center;height:100%;padding:24px;color:#999;font-size:13px}.table-detail .detail-content[data-v-7e47b0ba]{padding:4px 16px 16px}.table-detail .detail-item[data-v-7e47b0ba]{display:flex;padding:12px 0;border-bottom:1px solid #eee}.table-detail .detail-item[data-v-7e47b0ba]:last-child{border-bottom:none}.table-detail .detail-item .detail-label[data-v-7e47b0ba]{width:100px;flex-shrink:0;color:#666;font-size:14px}.table-detail .detail-item .detail-value[data-v-7e47b0ba]{flex:1;min-width:0;color:#333;font-size:14px;word-break:break-all}.table-render[data-v-5d8fe268]{display:flex;flex-direction:column;height:100%;min-height:0;background:#fff}.table-render .table-body[data-v-5d8fe268]{display:flex;flex:1;min-height:0;overflow:hidden}.table-render .table-container[data-v-5d8fe268]{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.table-render .table-container[data-v-5d8fe268] .table-grid{flex:1;min-height:0;max-height:var(--table-grid-max-height, none)}.table-render .table-container[data-v-5d8fe268] .table-grid>.el-table{height:100%}.table-render .table-pagination[data-v-5d8fe268]{flex-shrink:0}.table-render .table-detail-inline[data-v-5d8fe268]{flex-shrink:0;height:100%;overflow:hidden;border-left:1px solid #ebeef5}.table-render .table-detail-inline.table-detail-inline-left[data-v-5d8fe268]{order:-1;border-left:none;border-right:1px solid #ebeef5}.table-render .table-toolbar-bottom[data-v-5d8fe268]{flex-shrink:0}
+@charset "UTF-8";.u-form[data-v-4d3a2327]{width:100%}.u-form-tip[data-v-4d3a2327]{width:100%;font-size:12px;line-height:1.5;color:#909399;margin-top:2px}.u-table[data-v-4abfaa00]{width:100%}.u-table-image[data-v-4abfaa00]{width:40px;height:40px;border-radius:4px;vertical-align:middle}.u-table-actions[data-v-4abfaa00]{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap}.u-cascader[data-v-8fb1ac06]{display:flex;width:100%}.u-cascader .u-cascader-label[data-v-8fb1ac06]{flex-shrink:0;font-size:14px;color:#606266;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.u-cascader .u-cascader-level[data-v-8fb1ac06]{display:flex;align-items:center;flex:1 1 0;min-width:0}.u-cascader .u-cascader-control[data-v-8fb1ac06]{flex:1;min-width:0}.u-cascader.u-cascader--label-left .u-cascader-label[data-v-8fb1ac06]{padding-right:8px}.u-cascader.u-cascader--label-top[data-v-8fb1ac06]{align-items:flex-start}.u-cascader.u-cascader--label-top .u-cascader-level[data-v-8fb1ac06]{flex-direction:column;align-items:stretch}.u-cascader.u-cascader--label-top .u-cascader-label[data-v-8fb1ac06]{line-height:1.6;margin-bottom:4px;padding-right:0;text-align:left}.u-cascader.u-cascader--disabled[data-v-8fb1ac06]{opacity:.85}.u-search[data-v-bf97f714]{display:flex;align-items:flex-start;flex-wrap:wrap;gap:12px;width:100%}.u-search.u-search--disabled[data-v-bf97f714]{opacity:.85}.u-search .u-search-fields[data-v-bf97f714]{display:flex;align-items:flex-start;flex-wrap:wrap;flex:1;min-width:0}.u-search .u-search-item[data-v-bf97f714]{display:flex;flex-shrink:0;min-width:0}.u-search .u-search-label[data-v-bf97f714]{flex-shrink:0;font-size:14px;line-height:32px;color:#606266;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.u-search .u-search-control[data-v-bf97f714],.u-search .u-search-cascade[data-v-bf97f714]{flex:1;min-width:0}.u-search .u-search-actions[data-v-bf97f714]{display:flex;align-items:center;flex-shrink:0;margin-left:auto}.u-search.u-search--label-left .u-search-item[data-v-bf97f714]{align-items:center}.u-search.u-search--label-left .u-search-label[data-v-bf97f714]{padding-right:8px}.u-search.u-search--label-top .u-search-item[data-v-bf97f714]{flex-direction:column;align-items:stretch}.u-search.u-search--label-top .u-search-label[data-v-bf97f714]{line-height:1.6;margin-bottom:4px;padding-right:0;text-align:left}.u-search.u-search--label-top .u-search-actions[data-v-bf97f714]{align-self:flex-end}.u-dialog-body[data-v-1343d239]{min-height:24px}.u-dialog-loading[data-v-1343d239]{padding:24px 0;text-align:center;font-size:13px;color:#909399}.u-dialog--no-header .el-dialog__header{display:none}.u-table-page[data-v-ab43e7b3]{display:flex;flex-direction:column;gap:12px;width:100%;min-width:0}.u-table-page--fill[data-v-ab43e7b3]{overflow:hidden}.u-table-page-search[data-v-ab43e7b3],.u-table-page-pagination[data-v-ab43e7b3],.u-table-page-footer[data-v-ab43e7b3]{flex-shrink:0}.u-table-page-table[data-v-ab43e7b3]{flex:1 1 auto;min-height:0}.u-table-page--fill .u-table-page-table[data-v-ab43e7b3]{overflow:hidden}.u-table-page--fill .u-table-page-table>.u-table[data-v-ab43e7b3]{height:100%}.u-table-page-pagination[data-v-ab43e7b3]{display:flex;justify-content:flex-end}.u-table-page-footer[data-v-ab43e7b3]{display:flex;align-items:center}.u-table-page-form[data-v-ab43e7b3]{min-height:80px}.u-table-page-form-tip[data-v-ab43e7b3]{padding:24px 0;text-align:center;font-size:13px;color:#909399}.u-menu[data-v-fd5c101a]{display:flex;height:100%;min-height:0;background:#fff}.u-menu .u-menu-icon[data-v-fd5c101a]{margin-right:6px}.u-menu .u-menu-list[data-v-fd5c101a] .el-sub-menu__title{font-weight:600}.u-menu.u-menu--sidebar[data-v-fd5c101a]{flex-direction:column;border-right:1px solid #e4e7ed}.u-menu.u-menu--sidebar .u-menu-brand[data-v-fd5c101a]{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:16px 12px;border-bottom:1px solid #e4e7ed}.u-menu.u-menu--sidebar .u-menu-list[data-v-fd5c101a]{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;border-right:none}.u-menu.u-menu--sidebar .u-menu-logout[data-v-fd5c101a]{flex-shrink:0;width:100%;border-top:1px solid #e4e7ed}.u-menu.u-menu--sidebar .u-menu-logout-btn[data-v-fd5c101a]{display:block;width:100%}.u-menu.u-menu--horizontal[data-v-fd5c101a]{flex-direction:row;align-items:center;width:100%;border-bottom:1px solid #e4e7ed}.u-menu.u-menu--horizontal .u-menu-brand[data-v-fd5c101a]{flex-shrink:0;display:flex;align-items:center;padding:0 16px;white-space:nowrap}.u-menu.u-menu--horizontal .u-menu-list[data-v-fd5c101a]{flex:1;min-width:0;border-bottom:none}.u-menu.u-menu--horizontal .u-menu-logout[data-v-fd5c101a]{flex-shrink:0;display:flex;align-items:center;padding:0 12px;margin-left:auto}.u-menu .u-menu-logo[data-v-fd5c101a]{height:28px;margin-right:8px}.u-menu .u-menu-brand-text[data-v-fd5c101a]{font-size:18px;font-weight:600;color:#303133;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.u-base-info[data-v-ad75dd63]{box-sizing:border-box;width:100%;min-width:0}.u-base-info-grid[data-v-ad75dd63]{display:grid;align-items:start}.u-base-info-item[data-v-ad75dd63]{display:flex;align-items:center;min-width:0;font-size:14px;line-height:1.6}.u-base-info-item.is-top[data-v-ad75dd63]{flex-direction:column;align-items:flex-start;gap:2px}.u-base-info-label[data-v-ad75dd63]{display:inline-block;flex-shrink:0;box-sizing:border-box;color:#606266}.u-base-info-label.is-justify .u-base-info-label-text[data-v-ad75dd63]{display:inline-block;width:calc(100% - 1em);text-align:justify;text-align-last:justify}.u-base-info-value[data-v-ad75dd63]{flex:1;min-width:0;color:#303133;word-break:break-word}.u-base-info-empty[data-v-ad75dd63]{display:flex;align-items:center;justify-content:center;min-height:48px;font-size:13px;color:#c0c4cc}.u-results[data-v-a44e2489]{box-sizing:border-box;display:flex;flex-direction:column;width:100%;min-width:0;font-size:14px;line-height:1.5;color:#303133;background:var(--u-results-item-bg)}.u-results-body[data-v-a44e2489]{flex:1;min-height:0;overflow:auto}.u-results-head[data-v-a44e2489]{display:grid;position:sticky;top:0;z-index:2;background:var(--u-results-header-bg);color:var(--u-results-header-color);font-weight:600}.u-results-row[data-v-a44e2489]{display:grid;background:var(--u-results-item-bg)}.u-results-row.is-striped[data-v-a44e2489]:nth-child(2n){background:var(--u-results-stripe-bg)}.u-results-cell[data-v-a44e2489]{display:flex;align-items:center;box-sizing:border-box;min-width:0;padding:8px 12px;overflow-wrap:break-word;word-break:break-word}.u-results.is-border[data-v-a44e2489]{border:1px solid var(--u-results-line)}.u-results.is-border .u-results-head[data-v-a44e2489]{border-bottom:1px solid var(--u-results-line)}.u-results.is-border .u-results-row+.u-results-row[data-v-a44e2489]{border-top:1px solid var(--u-results-line)}.u-results.is-border .u-results-cell+.u-results-cell[data-v-a44e2489]{border-left:1px solid var(--u-results-line)}.u-results-empty[data-v-a44e2489]{display:flex;align-items:center;justify-content:center;padding:24px 12px;font-size:13px;color:#909399}.u-grid[data-v-8011a025]{box-sizing:border-box;overflow:hidden}.u-grid-cards[data-v-8011a025]{box-sizing:border-box;width:100%;height:100%;align-content:flex-start;overflow:auto}.u-grid-card-col[data-v-8011a025]{box-sizing:border-box;min-width:0;min-height:0}.u-grid-card[data-v-8011a025]{box-sizing:border-box;width:100%;height:100%;background:#fff;border:1px solid #ebeef5;overflow:hidden;min-width:0;min-height:0;justify-content:center;align-items:center}.u-grid-card-default[data-v-8011a025]{font-size:14px;color:#909399}.u-grid-empty[data-v-8011a025]{display:flex;align-items:center;justify-content:center;min-height:120px;font-size:13px;color:#c0c4cc}

package/dist/utils/base-info.d.ts

@@ -0,0 +1,39 @@
+import { BaseInfoItem, BaseInfoLabelAlign, BaseInfoLayout, BaseInfoOptions } from '../model/base-info';
+import { getByPath, toCssSize, toDisplayText } from './form';
+export { getByPath, toCssSize, toDisplayText };
+/** label 在 value 左边时的默认宽度：5em = 4 个汉字 + 1 个全角冒号（跟着字号缩放） */
+export declare const DEFAULT_LABEL_WIDTH = "5em";
+/** 默认间距（行间距 8px、栏间距 24px） */
+export declare const DEFAULT_GAP = "8px 24px";
+/** 栏数：默认 3，至少 1；非法值（0 / 负数 / NaN / 字符串垃圾）一律回退默认 */
+export declare function resolveColumns(columns?: number): number;
+/** 布局：默认 left（label 在 value 左边）；只有明确写 top 才走上下布局 */
+export declare function resolveLayout(layout?: BaseInfoLayout): BaseInfoLayout;
+/**
+ * label 对齐：默认 right（右对齐，报告单最常见）。
+ * 上下布局时强制 left —— 顶部 label 是整行宽度，右对齐 / 两端对齐都没有意义。
+ */
+export declare function resolveLabelAlign(align: BaseInfoLabelAlign | undefined, layout: BaseInfoLayout): BaseInfoLabelAlign;
+/** label 宽度 -> css 尺寸（不给或给了空串就用默认 5em） */
+export declare function resolveLabelWidth(width: number | string | undefined): string;
+/**
+ * 冒号：只有「label 在左边」时才会出现。
+ *   `layout: 'top'`  → 永远返回空串（顶部不带冒号）
+ *   `colon: false`   → 返回空串（显式关掉）
+ *   其余             → `colonText`，不给则全角冒号 `：`
+ */
+export declare function resolveColon(colon: boolean | undefined, layout: BaseInfoLayout, colonText?: string): string;
+/**
+ * 取该条的原始值：`item.value` 优先（写死的常量），否则按 `field` 从数据对象里取。
+ * `value` 用 `!== undefined` 判断，所以 `value: ''` / `value: null` 算「显式给了空值」，不会再去取 field。
+ */
+export declare function resolveItemValue(item: BaseInfoItem | undefined, record?: Record<string, any>): any;
+/** 该条是否用插槽渲染 value（字符串 = 插槽名；true = 用 field 当插槽名）；没用插槽返回 undefined */
+export declare function resolveItemSlotName(item: BaseInfoItem | undefined): string | undefined;
+/** 跨栏数：默认 1（不跨栏），最多不超过总栏数 */
+export declare function resolveSpan(span: number | undefined, columns: number): number;
+/** 栅格样式：栏数 + 间距（间距走 toCssSize，数字按 px；不传用默认 '8px 24px'） */
+export declare function gridStyle(options: BaseInfoOptions | null | undefined, columns: number): {
+    gridTemplateColumns: string;
+    gap: string;
+};