@hzab/form-render 1.6.19 → 1.6.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -1
- package/README.md +29 -21
- package/package.json +1 -1
- package/src/components/TreeCheckbox/components/CheckboxTable/index.tsx +10 -4
- package/src/components/TreeCheckbox/components/Render/index.tsx +28 -28
- package/src/components/TreeCheckbox/components/TabsRender/index.tsx +10 -7
- package/src/components/TreeCheckbox/index.less +6 -0
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -116,18 +116,18 @@ import FormRender from "@hzab/form-render";
|
|
|
116
116
|
|
|
117
117
|
### InfoPanel Attributes
|
|
118
118
|
|
|
119
|
-
| 参数 | 类型 | 必填 | 默认值 | 说明
|
|
120
|
-
| ------------------ | -------- | ---- | ---------- |
|
|
121
|
-
| schema | Object | 是 | - | 数据信息的 schema
|
|
122
|
-
| schemaScope | Object | 否 | - | 全局作用域,用于实现协议表达式变量注入
|
|
123
|
-
| layout | Object | 否 | horizontal | 表单布局,horizontal vertical \ inline
|
|
124
|
-
| initialValues | Object | 否 | - | form 初始值
|
|
125
|
-
| components | Object | 否 | - | 自定义组件
|
|
126
|
-
| formOptions | Object | 否 | - | createForm 的参数
|
|
127
|
-
| disabled | boolean | 否 | - | 禁用状态
|
|
128
|
-
| readOnly | boolean | 否 | - | 只读状态
|
|
129
|
-
| onFormValuesChange | Function | 否 | - | 表单事件 (form)=>{}
|
|
130
|
-
| onFieldValueChange | Function | 否 | - | 表单项事件 (field, form)=>{} https://core.formilyjs.org/zh-CN/api/entry/field-effect-hooks
|
|
119
|
+
| 参数 | 类型 | 必填 | 默认值 | 说明 |
|
|
120
|
+
| ------------------ | -------- | ---- | ---------- | ------------------------------------------------------------------------------------------ |
|
|
121
|
+
| schema | Object | 是 | - | 数据信息的 schema |
|
|
122
|
+
| schemaScope | Object | 否 | - | 全局作用域,用于实现协议表达式变量注入 |
|
|
123
|
+
| layout | Object | 否 | horizontal | 表单布局,horizontal vertical \ inline |
|
|
124
|
+
| initialValues | Object | 否 | - | form 初始值 |
|
|
125
|
+
| components | Object | 否 | - | 自定义组件 |
|
|
126
|
+
| formOptions | Object | 否 | - | createForm 的参数 |
|
|
127
|
+
| disabled | boolean | 否 | - | 禁用状态 |
|
|
128
|
+
| readOnly | boolean | 否 | - | 只读状态 |
|
|
129
|
+
| onFormValuesChange | Function | 否 | - | 表单事件 (form)=>{} https://core.formilyjs.org/zh-CN/api/entry/form-effect-hooks |
|
|
130
|
+
| onFieldValueChange | Function | 否 | - | 表单项事件 (field, form)=>{} https://core.formilyjs.org/zh-CN/api/entry/field-effect-hooks |
|
|
131
131
|
|
|
132
132
|
### 方法 Methods
|
|
133
133
|
|
|
@@ -209,30 +209,38 @@ import FormRender from "@hzab/form-render";
|
|
|
209
209
|
|
|
210
210
|
- example 本地测试代码
|
|
211
211
|
- src 组件源码
|
|
212
|
-
- lib 组件打包编译后的代码
|
|
213
212
|
|
|
214
213
|
## 命令
|
|
215
214
|
|
|
215
|
+
- 生成文档:npm run docs
|
|
216
216
|
- 本地运行:npm run dev
|
|
217
|
-
-
|
|
218
|
-
- 生产环境打包编译:npm run build
|
|
217
|
+
- 打包编译:npm run build
|
|
219
218
|
|
|
220
219
|
## 发布
|
|
221
220
|
|
|
222
|
-
-
|
|
223
|
-
|
|
221
|
+
- npm 源和云效源都需要发布
|
|
222
|
+
|
|
224
223
|
- 命令:npm publish --access public
|
|
225
224
|
- 发布目录:
|
|
226
|
-
- lib
|
|
227
225
|
- src
|
|
228
226
|
|
|
227
|
+
### nrm
|
|
228
|
+
|
|
229
|
+
- 安装
|
|
230
|
+
npm install -g nrm
|
|
231
|
+
- 增加源
|
|
232
|
+
nrm add aliyun https://packages.aliyun.com/62046985b3ead41b374a17f7/npm/npm-registry/
|
|
233
|
+
- 切换源
|
|
234
|
+
nrm use aliyun
|
|
235
|
+
nrm use npm
|
|
236
|
+
- 登录(账号密码在 https://packages.aliyun.com/npm/npm-registry/guide 查看)
|
|
237
|
+
npm login --registry=https://packages.aliyun.com/62046985b3ead41b374a17f7/npm/npm-registry/
|
|
238
|
+
|
|
229
239
|
## 配置
|
|
230
240
|
|
|
231
241
|
### 配置文件
|
|
232
242
|
|
|
233
|
-
- 本地配置文件:config/
|
|
234
|
-
- 测试环境配置文件:config/global-config/config.flowDev.js
|
|
235
|
-
- 生产环境配置文件:config/global-config/config.production.js
|
|
243
|
+
- 本地配置文件:config/config.js
|
|
236
244
|
|
|
237
245
|
### webpack 配置文件
|
|
238
246
|
|
package/package.json
CHANGED
|
@@ -26,20 +26,26 @@ export const CheckboxTable = (props) => {
|
|
|
26
26
|
{col?.map((it, itIdx) => {
|
|
27
27
|
const itKey = it?.value;
|
|
28
28
|
return (
|
|
29
|
-
it &&
|
|
29
|
+
it &&
|
|
30
|
+
(it?.readOnly ? (
|
|
31
|
+
<span className="tree-checkbox-read-only">{it.label}</span>
|
|
32
|
+
) : (
|
|
30
33
|
<Checkbox onChange={onChange} value={itKey} key={itKey}>
|
|
31
34
|
{it.label}
|
|
32
35
|
</Checkbox>
|
|
33
|
-
)
|
|
36
|
+
))
|
|
34
37
|
);
|
|
35
38
|
})}
|
|
36
39
|
</>
|
|
37
40
|
) : (
|
|
38
|
-
col &&
|
|
41
|
+
col &&
|
|
42
|
+
(col?.readOnly ? (
|
|
43
|
+
<span className="tree-checkbox-read-only">{col.label}</span>
|
|
44
|
+
) : (
|
|
39
45
|
<Checkbox onChange={onChange} value={colKey} key={colKey}>
|
|
40
46
|
{col.label}
|
|
41
47
|
</Checkbox>
|
|
42
|
-
)
|
|
48
|
+
))
|
|
43
49
|
)}
|
|
44
50
|
</td>
|
|
45
51
|
);
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import CheckboxTable from "../CheckboxTable";
|
|
2
|
-
|
|
3
|
-
import TabsRender from "../TabsRender";
|
|
4
|
-
|
|
5
|
-
export const Render = (props) => {
|
|
6
|
-
const { list, fieldNames, tabConfList = [], emptyNode = "暂无数据" } = props;
|
|
7
|
-
const { label: labelKey, value: valueKey, children: childrenKey } = fieldNames || {};
|
|
8
|
-
|
|
9
|
-
if (!list) {
|
|
10
|
-
return <div className="tree-checkbox-empty">{emptyNode}</div>;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
return (
|
|
14
|
-
<>
|
|
15
|
-
{list?.map((item, i) => {
|
|
16
|
-
if (item?.tabList) {
|
|
17
|
-
return <TabsRender {...props} key={i} item={item} index={i} />;
|
|
18
|
-
}
|
|
19
|
-
if (item.tableData) {
|
|
20
|
-
return <CheckboxTable key={i} {...props} data={item.tableData || []} />;
|
|
21
|
-
}
|
|
22
|
-
return null;
|
|
23
|
-
})}
|
|
24
|
-
</>
|
|
25
|
-
);
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
export default Render;
|
|
1
|
+
import CheckboxTable from "../CheckboxTable";
|
|
2
|
+
|
|
3
|
+
import TabsRender from "../TabsRender";
|
|
4
|
+
|
|
5
|
+
export const Render = (props) => {
|
|
6
|
+
const { list, fieldNames, tabConfList = [], emptyNode = "暂无数据" } = props;
|
|
7
|
+
const { label: labelKey, value: valueKey, children: childrenKey } = fieldNames || {};
|
|
8
|
+
|
|
9
|
+
if (!list) {
|
|
10
|
+
return <div className="tree-checkbox-empty">{emptyNode}</div>;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
return (
|
|
14
|
+
<>
|
|
15
|
+
{list?.map((item, i) => {
|
|
16
|
+
if (item?.tabList) {
|
|
17
|
+
return <TabsRender {...props} key={i} item={item} index={i} />;
|
|
18
|
+
}
|
|
19
|
+
if (item.tableData) {
|
|
20
|
+
return <CheckboxTable key={i} {...props} data={item.tableData || []} />;
|
|
21
|
+
}
|
|
22
|
+
return null;
|
|
23
|
+
})}
|
|
24
|
+
</>
|
|
25
|
+
);
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
export default Render;
|
|
@@ -36,13 +36,16 @@ export const TabRender = (props) => {
|
|
|
36
36
|
forceRender
|
|
37
37
|
tab={
|
|
38
38
|
<>
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
39
|
+
{!it?.readOnly && (
|
|
40
|
+
<Checkbox
|
|
41
|
+
className="tab-level-checkbox-item"
|
|
42
|
+
value={it[valueKey]}
|
|
43
|
+
onChange={props?.onChange}
|
|
44
|
+
key={it[valueKey]}
|
|
45
|
+
onClick={onStopPropagation}
|
|
46
|
+
></Checkbox>
|
|
47
|
+
)}
|
|
48
|
+
{it[labelKey]}
|
|
46
49
|
</>
|
|
47
50
|
}
|
|
48
51
|
key={"" + it[valueKey]}
|