@hzab/form-render 1.7.18 → 1.7.19

package/README.md

@@ -1,330 +0,0 @@
-# @hzab/form-render
-
-formily schema 表单渲染组件
-
-# 组件
-
-## Tips
-
-- antd 组件样式需要手动引入
-
-## 自研组件
-
-| x-component | 说明 | 文档 |
-| ----------- | ---- | ---- |
-| Upload | 文件上传（OSS / 私有化等） | [README](docs/components/Upload.md) |
-| LocationPicker | 地图选点 | [README](docs/components/LocationPicker.md) |
-| LocationListPicker | 多地址 / 点位列表选择 | [README](docs/components/LocationListPicker.md) |
-| RichEditor / Editor | 富文本编辑器 | [README](docs/components/RichEditor.md) |
-| TreeCheckbox | 树形多选复选框 | [README](docs/components/TreeCheckbox.md) |
-| UserSelect | 人员下拉（本地 options） | [README](docs/components/UserSelect.md) |
-| PersonnelSelect / RemoteSelect | 远程人员搜索下拉 | [README](docs/components/PersonnelSelect.md) |
-| DatePicker | 日期选择（含 RangePicker 拆分字段） | [README](docs/components/DatePicker.md) |
-| RadioGroupWithTip | 带描述的单选 | [README](docs/components/RadioGroupWithTip.md) |
-| CheckboxWithTip | 带描述的多选 | [README](docs/components/CheckboxWithTip.md) |
-| ArrayTable | 自增表格 | [README](docs/components/ArrayTable.md) |
-| ArrayCards | 自增卡片 | [README](docs/components/ArrayCards.md) |
-| Text | 只读文本展示 | [README](docs/components/Text.md) |
-
-内置 antd / c-formily-antd 组件（Input、Select、FormGrid 等）通过 `FormRender` 注册，Schema 约定见下方 Schema 章节。
-
-## 示例
-
-本地文档站（antd 风格）：左侧组件列表，组件页上方为 Demo、下方为 API。
-
-```bash
-npm run dev
-```
-
-打开 http://localhost:3000 （HashRouter，路径形如 `/#/components/upload`）：
-
-- `/#/` 组件总览
-- `/#/components/*` 各组件 Demo + API
-- `/#/lab/*` 综合 / 场景示例
-
-#### 项目初始化时挂载全局组件
-
-```jsx
-import { setFormilyGlobalComponents } from "@hzab/utils/src/formily/global-components";
-
-// 挂载 Test1 组件到 formRender 组件
-setFormilyGlobalComponents({
-  Test1() {
-    return <div>Test1</div>;
-  },
-});
-
-// 挂载 Test2 组件到 formRender 组件
-setFormilyGlobalComponents({
-  Test2() {
-    return <div>Test2</div>;
-  },
-  Test3() {
-    return <div>Test3</div>;
-  },
-});
-```
-
-```jsx
-import FormRender from "@hzab/form-render";
-
-// testSchema 为 formily 生成的 schema json
-<FormRender schema={testSchema} />;
-```
-
-#### 组件远程数据
-
-- 使用 schemaScope 传入全局配置变量，在响应器的动作响应中调用
-
-```jsx
-// schema
-{
-  "form": {
-    "labelCol": 6,
-    "wrapperCol": 12
-  },
-  "schema": {
-    "type": "object",
-    "properties": {
-      "parentId": {
-        "type": "string",
-        "title": "上级菜单",
-        "x-decorator": "FormItem",
-        "x-component": "TreeSelect",
-        "x-validator": [],
-        "x-component-props": {},
-        "x-decorator-props": {},
-        "x-reactions": {
-          "fulfill": {
-            "run": "fetchMenuTree($self);"
-          }
-        },
-        "name": "parentId",
-        "x-designable-id": "i012z5nbd5z",
-        "x-index": 0
-      }
-    }
-  }
-}
-
-// formRender
-  <FormRender
-    schema={testSchema}
-    schemaScope={{
-      fetchMenuTree(field) {
-        // 模拟请求
-        setTimeout(() => {
-          // field 目标组件的 配置参数
-          // 通过 field.component[1] 可以动态配置目标组件的 props
-          // 树选择器 数据源
-          field.component[1].treeData = [{ value: 1, label: 1 }];
-        }, 1000)
-      },
-    }}
-  />
-```
-
-#### 自定义组件
-
-- 使用 components 传入自定义组件，在 schema 中 x-component 配置对应的组件名称
-
-```jsx
-// schema
-{
-  "form": {
-    "labelCol": 6,
-    "wrapperCol": 12
-  },
-  "schema": {
-    "type": "object",
-    "properties": {
-      "parentId": {
-        "type": "string",
-        "title": "图标选择器",
-        "x-decorator": "FormItem",
-        "x-component": "IconSelect",
-        "x-validator": [],
-        "x-component-props": {},
-        "x-decorator-props": {},
-        "x-reactions": {},
-        "name": "parentId",
-        "x-designable-id": "i012z5nbd5z",
-        "x-index": 0
-      }
-    }
-  }
-}
-
-// formRender
-  <FormRender
-    schema={testSchema}
-    components={{
-      // 自定义组件
-      IconSelect() {
-        return "IconSelect";
-      },
-    }}
-  />
-```
-
-## API
-
-### FormRender Attributes
-
-| 参数               | 类型     | 必填 | 默认值     | 说明                                                                                       |
-| ------------------ | -------- | ---- | ---------- | ------------------------------------------------------------------------------------------ |
-| schema             | Object   | 是   | -          | 数据信息的 schema                                                                          |
-| schemaScope        | Object   | 否   | -          | 全局作用域，用于实现协议表达式变量注入                                                     |
-| layout             | Object   | 否   | horizontal | 表单布局，horizontal vertical \ inline                                                     |
-| initialValues      | Object   | 否   | -          | form 初始值                                                                                |
-| components         | Object   | 否   | -          | 自定义组件                                                                                 |
-| formOptions        | Object   | 否   | -          | createForm 的参数                                                                          |
-| emptyValue         | string   | 否   | N/A        | 只读模式 PreviewText emptyValue 配置                                                       |
-| disabled           | boolean  | 否   | -          | 禁用状态                                                                                   |
-| readOnly           | boolean  | 否   | -          | 只读状态                                                                                   |
-| onFormValuesChange | Function | 否   | -          | 表单事件 (form)=>{} https://core.formilyjs.org/zh-CN/api/entry/form-effect-hooks           |
-| onFieldValueChange | Function | 否   | -          | 表单项事件 (field, form)=>{} https://core.formilyjs.org/zh-CN/api/entry/field-effect-hooks |
-
-### 方法 Methods
-
-| 名称 | 参数      | 说明           |
-| ---- | --------- | -------------- |
-| init | form 实例 | 组件初始化执行 |
-
-### 全局配置（缩略图 / 预览域名）
-
-项目初始化时可配置上传预览相关全局参数（见 `src/globalConfig.ts`）：
-
-```js
-import {
-  setFormRenderPCGlobalServeConfig,
-  setFormRenderPCGlobalServeConfigs,
-  getFormRenderPCGlobalServeConfig,
-} from "@hzab/form-render/src/globalConfig";
-
-// 设置单个配置
-setFormRenderPCGlobalServeConfig("serverUrl", "/api/v1/user/oss/getWebOssConfig");
-
-// 批量设置
-setFormRenderPCGlobalServeConfigs({
-  serverUrl: "/api/v1/user/oss/getWebOssConfig",
-  // 其他如缩略图相关配置
-});
-
-getFormRenderPCGlobalServeConfig();
-```
-
-### Schema
-
-- 使用 表单编辑器生成：https://designable-antd.formilyjs.org/
-
-```js
-{
-  "form": {
-    "labelCol": 6,
-    "wrapperCol": 12
-  },
-  "schema": {
-    "type": "object",
-    "properties": {
-      // 参数 key
-      "parentId": {
-        "type": "string",
-        // 参数 label
-        "title": "上级菜单",
-        "x-decorator": "FormItem",
-        // 渲染的组件
-        "x-component": "TreeSelect",
-        // 组件校验
-        "x-validator": [],
-        // 组件配置
-        "x-component-props": {
-          "virtual": true,
-          "allowClear": true,
-          "showSearch": true
-        },
-        // 容器配置
-        "x-decorator-props": {},
-        // 响应器
-        "x-reactions": {
-          // 依赖字段
-          "dependencies": [
-            {
-              "property": "value",
-              "type": "any"
-            }
-          ],
-          // 响应动作
-          "fulfill": {
-            // 属性响应，只支持 JS 表达式
-            "state": {
-              "visible": "{{$deps.menuType === \"C\" || $deps.menuType === \"F\"}}"
-            },
-            // 动作响应，支持 JS 语句
-            "run": "fetchMenuTree($self);"
-          }
-        },
-        // 参数 key
-        "name": "parentId",
-        // 组件在编辑器中的 ID（必须唯一）
-        "x-designable-id": "i012z5nbd5z",
-        // 组件在表单中的顺序（必须唯一）
-        "x-index": 0,
-        // 是否在 table 中展示，目前需要手动添加配置
-        "inTable": false
-      }
-    }
-  }
-}
-```
-
-# 组件开发流程
-
-- 在 config/webpack.config/webpack.config.dev.js 中按需修改 alias 配置的包名，便于本地调试
-- 在 example/typings.d.ts 中按需修改 declare module 配置的包名，解决 ts 报错问题
-- npm run dev
-
-## 文件目录
-
-- example 本地 demo / 手工测试页面
-- src 组件源码
-- docs 组件文档
-- tests 单元测试
-
-## 命令
-
-- 本地运行：npm run dev
-- 打包编译：npm run build
-- 单元测试：npm test
-- 测试监听：npm run test:watch
-- 测试覆盖率：npm run test:coverage
-
-## 发布
-
-- npm 源和云效源都需要发布
-
-- 命令：npm publish --access public
-- 发布目录：
-  - src
-
-### nrm
-
-- 安装
-  npm install -g nrm
-- 增加源
-  nrm add aliyun https://packages.aliyun.com/62046985b3ead41b374a17f7/npm/npm-registry/
-- 切换源
-  nrm use aliyun
-  nrm use npm
-- 登录（账号密码在 https://packages.aliyun.com/npm/npm-registry/guide 查看）
-  npm login --registry=https://packages.aliyun.com/62046985b3ead41b374a17f7/npm/npm-registry/
-
-## 配置
-
-### 配置文件
-
-- 本地配置文件：config/config.js
-
-### webpack 配置文件
-
-- config/webpack.config.js

package/docs/README.md

@@ -1,21 +0,0 @@
-# 组件文档
-
-自研表单组件说明，与源码目录分离，位于仓库根目录 `docs/`。
-
-| 组件 | 文档 |
-| ---- | ---- |
-| Upload | [Upload.md](./components/Upload.md) |
-| LocationPicker | [LocationPicker.md](./components/LocationPicker.md) |
-| LocationListPicker | [LocationListPicker.md](./components/LocationListPicker.md) |
-| RichEditor | [RichEditor.md](./components/RichEditor.md) |
-| TreeCheckbox | [TreeCheckbox.md](./components/TreeCheckbox.md) |
-| UserSelect | [UserSelect.md](./components/UserSelect.md) |
-| PersonnelSelect | [PersonnelSelect.md](./components/PersonnelSelect.md) |
-| DatePicker | [DatePicker.md](./components/DatePicker.md) |
-| RadioGroupWithTip | [RadioGroupWithTip.md](./components/RadioGroupWithTip.md) |
-| CheckboxWithTip | [CheckboxWithTip.md](./components/CheckboxWithTip.md) |
-| ArrayTable | [ArrayTable.md](./components/ArrayTable.md) |
-| ArrayCards | [ArrayCards.md](./components/ArrayCards.md) |
-| Text | [Text.md](./components/Text.md) |
-
-FormRender 总览见根目录 [README.md](../README.md)。

package/docs/components/ArrayCards.md

@@ -1,68 +0,0 @@
-# ArrayCards
-
-自增卡片列表，基于 Formily ArrayCards，通过 ArrayBase mixin 提供增删改排序子组件。
-
-ArrayBase 回调（`onAdd` / `onRemove` / `onSortStart` 等）与导出 hooks 说明见 [ArrayTable README](./ArrayTable.md)。
-
-## Schema 示例
-
-```json
-{
-  "type": "array",
-  "x-component": "ArrayCards",
-  "x-component-props": {
-    "title": "卡片"
-  },
-  "items": {
-    "type": "object",
-    "properties": {
-      "index": { "type": "void", "x-component": "ArrayCards.Index" },
-      "name": {
-        "type": "string",
-        "title": "名称",
-        "x-decorator": "FormItem",
-        "x-component": "Input"
-      },
-      "remove": { "type": "void", "x-component": "ArrayCards.Remove" },
-      "moveDown": { "type": "void", "x-component": "ArrayCards.MoveDown" },
-      "moveUp": { "type": "void", "x-component": "ArrayCards.MoveUp" }
-    }
-  },
-  "properties": {
-    "addition": {
-      "type": "void",
-      "title": "添加条目",
-      "x-component": "ArrayCards.Addition"
-    }
-  }
-}
-```
-
-### ArrayCards Attributes
-
-| 参数                  | 类型     | 必填 | 默认值 | 说明 |
-| --------------------- | -------- | ---- | ------ | ---- |
-| title                 | ReactNode | 否  | -      | 卡片标题（可与 Index 组合） |
-| onAdd                 | Function | 否   | -      | 新增回调 |
-| onCopy                | Function | 否   | -      | 复制回调 |
-| onRemove              | Function | 否   | -      | 删除回调 |
-| onMoveDown            | Function | 否   | -      | 下移回调 |
-| onMoveUp              | Function | 否   | -      | 上移回调 |
-| deletePopconfirm      | boolean  | 否   | -      | 删除是否二次确认 |
-| deletePopconfirmTitle | Function\|ReactNode | 否 | - | 删除确认文案 |
-| disabled              | boolean  | 否   | -      | 禁用 |
-
-其余 props 透传 antd Card。
-
-### 子组件（x-component）
-
-| 名称                 | 说明 |
-| -------------------- | ---- |
-| ArrayCards.Index     | 序号 |
-| ArrayCards.Remove    | 删除 |
-| ArrayCards.Copy      | 复制 |
-| ArrayCards.MoveDown  | 下移 |
-| ArrayCards.MoveUp    | 上移 |
-| ArrayCards.Addition  | 新增卡片 |
-
-完整交互示例见 `example/pages/array-base-demo`。

package/docs/components/ArrayTable.md

@@ -1,111 +0,0 @@
-# ArrayTable
-
-自增表格，基于 Formily ArrayTable 扩展，支持分页、拖拽排序回调，并通过 ArrayBase mixin 暴露增删改操作子组件。
-
-## Schema 示例
-
-```json
-{
-  "type": "array",
-  "x-component": "ArrayTable",
-  "x-component-props": {
-    "onSortStart": "{{onSortStart}}",
-    "onSortEnd": "{{onSortEnd}}",
-    "deletePopconfirm": true
-  },
-  "items": {
-    "type": "object",
-    "properties": {
-      "column1": {
-        "type": "void",
-        "x-component": "ArrayTable.Column",
-        "x-component-props": { "title": "排序", "width": 50 },
-        "properties": {
-          "sort": { "type": "void", "x-component": "ArrayTable.SortHandle" }
-        }
-      },
-      "column2": {
-        "type": "void",
-        "x-component": "ArrayTable.Column",
-        "x-component-props": { "title": "序号", "width": 50 },
-        "properties": {
-          "index": { "type": "void", "x-component": "ArrayTable.Index" }
-        }
-      },
-      "name": {
-        "type": "void",
-        "x-component": "ArrayTable.Column",
-        "x-component-props": { "title": "名称" },
-        "properties": {
-          "name": {
-            "type": "string",
-            "x-decorator": "FormItem",
-            "x-component": "Input"
-          }
-        }
-      },
-      "operations": {
-        "type": "void",
-        "x-component": "ArrayTable.Column",
-        "x-component-props": { "title": "操作" },
-        "properties": {
-          "remove": { "type": "void", "x-component": "ArrayTable.Remove" },
-          "moveDown": { "type": "void", "x-component": "ArrayTable.MoveDown" },
-          "moveUp": { "type": "void", "x-component": "ArrayTable.MoveUp" }
-        }
-      }
-    }
-  },
-  "properties": {
-    "addition": {
-      "type": "void",
-      "title": "添加条目",
-      "x-component": "ArrayTable.Addition"
-    }
-  }
-}
-```
-
-### ArrayTable Attributes
-
-| 参数                  | 类型     | 必填 | 默认值 | 说明 |
-| --------------------- | -------- | ---- | ------ | ---- |
-| onAdd                 | Function | 否   | -      | 新增回调 `(index) => void` |
-| onCopy                | Function | 否   | -      | 复制回调 |
-| onRemove              | Function | 否   | -      | 删除回调 |
-| onMoveDown            | Function | 否   | -      | 下移回调 |
-| onMoveUp              | Function | 否   | -      | 上移回调 |
-| onSortStart           | Function | 否   | -      | 拖拽排序开始 |
-| onSortEnd             | Function | 否   | -      | 拖拽排序结束 |
-| deletePopconfirm      | boolean  | 否   | -      | 删除是否二次确认 |
-| deletePopconfirmTitle | Function\|ReactNode | 否 | - | 删除确认文案 |
-| disabled              | boolean  | 否   | -      | 禁用 |
-
-其余 props 透传 antd Table。
-
-### 子组件（x-component）
-
-| 名称                    | 说明 |
-| ----------------------- | ---- |
-| ArrayTable.Column       | 列容器 |
-| ArrayTable.SortHandle   | 拖拽排序手柄 |
-| ArrayTable.Index        | 行序号 |
-| ArrayTable.Remove       | 删除 |
-| ArrayTable.MoveDown     | 下移 |
-| ArrayTable.MoveUp       | 上移 |
-| ArrayTable.Addition     | 新增行 |
-
-### 从 ArrayTable 导出的 API（ArrayBase）
-
-可通过 `ArrayTable`（或直接从包内 ArrayBase 相关导出）使用：
-
-| 名称                | 说明 |
-| ------------------- | ---- |
-| useArray            | 获取当前 Array 上下文 |
-| useIndex            | 获取当前行 index |
-| useRecord           | 获取当前行 record |
-| isAdditionComponent | 判断 schema 是否为 Addition 组件 |
-| isColumnComponent   | 判断是否为 Column |
-| isOperationsComponent | 判断是否为 Operations |
-
-完整交互示例见 `example/pages/array-base-demo`。

package/docs/components/CheckboxWithTip.md

@@ -1,43 +0,0 @@
-# CheckboxWithTip
-
-带描述文案、支持单项禁用的多选组。数据优先取 `dataSource`，否则取 Formily `field.dataSource`（schema `enum`）。
-
-## Schema 示例
-
-```json
-{
-  "x-component": "CheckboxWithTip",
-  "enum": [
-    {
-      "label": "人力填报",
-      "value": 1,
-      "desc": "由人力在后台填报信息。"
-    },
-    {
-      "label": "个人填报",
-      "value": 2,
-      "desc": "由个人在移动端填报信息。",
-      "disabled": true
-    }
-  ]
-}
-```
-
-### CheckboxWithTip Attributes
-
-| 参数       | 类型     | 必填 | 默认值 | 说明 |
-| ---------- | -------- | ---- | ------ | ---- |
-| value      | Array    | 否   | -      | 当前选中值数组 |
-| onChange   | Function | 否   | -      | 选中变化回调 |
-| dataSource | Array    | 否   | field.dataSource | 选项列表，见下表 |
-
-其余 props 透传 antd `Checkbox.Group`。
-
-### dataSource / enum 子项
-
-| 参数     | 类型           | 必填 | 默认值 | 说明 |
-| -------- | -------------- | ---- | ------ | ---- |
-| label    | string         | 是   | -      | 主标题 |
-| value    | string\|number | 是   | -      | 选项值 |
-| desc     | string         | 否   | -      | 描述文案 |
-| disabled | boolean        | 否   | false  | 单项禁用 |

package/docs/components/DatePicker.md

@@ -1,54 +0,0 @@
-# DatePicker
-
-基于 `c-formily-antd` DatePicker 的封装，统一日期格式化；`RangePicker` 支持将起止时间拆分写入同级字段。
-
-## Schema 示例
-
-```json
-{
-  "x-component": "DatePicker",
-  "x-component-props": {
-    "showTime": true
-  }
-}
-```
-
-```json
-{
-  "x-component": "DatePicker.RangePicker",
-  "x-component-props": {
-    "isSplitTimes": true,
-    "startKey": "startTime",
-    "endKey": "endTime"
-  }
-}
-```
-
-### DatePicker Attributes
-
-| 参数     | 类型    | 必填 | 默认值 | 说明 |
-| -------- | ------- | ---- | ------ | ---- |
-| format   | string  | 否   | 按 picker / showTime 推导 | 日期展示与解析格式 |
-| picker   | string  | 否   | date   | `date` / `week` / `month` / `quarter` / `year` |
-| showTime | boolean | 否   | false  | 是否显示时间；为 true 时默认 format 为 `YYYY-MM-DD HH:mm:ss` |
-
-未传 `format` 时的默认值：
-
-| picker / showTime | 默认 format |
-| ----------------- | ----------- |
-| month             | `YYYY-MM` |
-| quarter           | `YYYY-\QQ` |
-| year              | `YYYY` |
-| week              | `gggg-wo` |
-| showTime=true     | `YYYY-MM-DD HH:mm:ss` |
-| 其他              | `YYYY-MM-DD` |
-
-### DatePicker.RangePicker Attributes
-
-| 参数         | 类型    | 必填 | 默认值      | 说明 |
-| ------------ | ------- | ---- | ----------- | ---- |
-| isSplitTimes | boolean | 否   | false       | 为 true 时，将起止时间写入同级 `startKey` / `endKey` 字段 |
-| startKey     | string  | 否   | startTime   | 拆分后的开始时间字段名 |
-| endKey       | string  | 否   | endTime     | 拆分后的结束时间字段名 |
-
-嵌套在 `ArrayTable` / `ArrayCards` 内时，拆分结果写入当前行（父级）对象。

package/docs/components/LocationListPicker.md

@@ -1,41 +0,0 @@
-# LocationListPicker
-
-多地址 / 点位列表选择器，基于高德地图，支持点位与多边形绘制。
-
-## 使用前安装依赖
-
-```bash
-npm install @amap/amap-jsapi-loader
-```
-
-## Schema 示例
-
-```json
-{
-  "x-component": "LocationListPicker",
-  "x-component-props": {
-    "hasPoint": true,
-    "hasPolygon": false,
-    "isAutoSearch": true
-  }
-}
-```
-
-### LocationListPicker Attributes
-
-| 参数           | 类型     | 必填 | 默认值 | 说明 |
-| -------------- | -------- | ---- | ------ | ---- |
-| value          | Array    | 否   | -      | 地址列表数据 |
-| readOnly       | boolean  | 否   | false  | 只读 |
-| disabled       | boolean  | 否   | false  | 禁用 |
-| hasPoint       | boolean  | 否   | true   | 是否支持新增点位 |
-| hasPolygon     | boolean  | 否   | false  | 是否支持新增多边形 |
-| isAutoSearch   | boolean  | 否   | -      | 搜索框是否自动搜索 |
-| listProps      | Object   | 否   | -      | 左侧地址列表区域配置 |
-| popupProps     | Object   | 否   | -      | 弹层 / 编辑弹窗配置 |
-| ItemRender     | Function | 否   | -      | 自定义列表项渲染 |
-| markerIconConf | Object   | 否   | -      | marker 图标配置 |
-| loading        | boolean  | 否   | false  | 加载态 |
-| onChange       | Function | 否   | -      | 列表变化回调 |
-
-表单值一般为地址对象数组（组件会为缺失项自动补 `id`）。