vap1 0.1.3 → 0.1.5

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.
Files changed (97) hide show
  1. package/components/Box/Box.js +5 -0
  2. package/components/Tables/VTable.js +7 -5
  3. package/components/UForm/UForm.js +6 -8
  4. package/components/_adapt/Col.js +3 -1
  5. package/components/_adapt/Row.js +1 -1
  6. package/index.d.ts +1 -1
  7. package/package.json +1 -1
  8. package/uform/FormEditor.d.ts +21 -0
  9. package/uform/FormEditor.js +101 -0
  10. package/uform/FormViewer.d.ts +12 -0
  11. package/uform/FormViewer.js +71 -0
  12. package/uform/hooks/useEditor.d.ts +28 -0
  13. package/uform/hooks/useEditor.js +144 -0
  14. package/uform/hooks/useForm.d.ts +4 -0
  15. package/uform/hooks/useForm.js +7 -0
  16. package/uform/index.d.ts +5 -0
  17. package/uform/index.js +35 -0
  18. package/uform/inputs/_advance.d.ts +2 -0
  19. package/uform/inputs/_advance.js +57 -0
  20. package/uform/inputs/_date.d.ts +2 -0
  21. package/uform/inputs/_date.js +178 -0
  22. package/uform/inputs/_input.d.ts +6 -0
  23. package/uform/inputs/_input.js +139 -0
  24. package/uform/inputs/_select.d.ts +2 -0
  25. package/uform/inputs/_select.js +241 -0
  26. package/uform/inputs/_specific.d.ts +2 -0
  27. package/uform/inputs/_specific.js +107 -0
  28. package/uform/inputs/index.d.ts +6 -0
  29. package/uform/inputs/index.js +18 -0
  30. package/uform/inputs/register.d.ts +25 -0
  31. package/uform/inputs/register.js +47 -0
  32. package/uform/panel/Editor/GroupEditor.d.ts +7 -0
  33. package/uform/panel/Editor/GroupEditor.js +126 -0
  34. package/uform/panel/Editor/ListEditor.d.ts +4 -0
  35. package/uform/panel/Editor/ListEditor.js +77 -0
  36. package/uform/panel/Editor/_FieldItems.d.ts +5 -0
  37. package/uform/panel/Editor/_FieldItems.js +45 -0
  38. package/uform/panel/Editor/_GroupCollapse.d.ts +3 -0
  39. package/uform/panel/Editor/_GroupCollapse.js +24 -0
  40. package/uform/panel/Editor/_GroupDefault.d.ts +3 -0
  41. package/uform/panel/Editor/_GroupDefault.js +24 -0
  42. package/uform/panel/Editor/_GroupStep.d.ts +3 -0
  43. package/uform/panel/Editor/_GroupStep.js +49 -0
  44. package/uform/panel/Editor/_GroupTab.d.ts +3 -0
  45. package/uform/panel/Editor/_GroupTab.js +41 -0
  46. package/uform/panel/Editor/index.d.ts +3 -0
  47. package/uform/panel/Editor/index.js +83 -0
  48. package/uform/panel/Items/index.d.ts +3 -0
  49. package/uform/panel/Items/index.js +23 -0
  50. package/uform/panel/Propreties/CanvasProperties.d.ts +3 -0
  51. package/uform/panel/Propreties/CanvasProperties.js +42 -0
  52. package/uform/panel/Propreties/Component/FieldPlugin.d.ts +12 -0
  53. package/uform/panel/Propreties/Component/FieldPlugin.js +39 -0
  54. package/uform/panel/Propreties/Component/LinkAsyncFunction.d.ts +8 -0
  55. package/uform/panel/Propreties/Component/LinkAsyncFunction.js +171 -0
  56. package/uform/panel/Propreties/Component/LinkSyncFunction.d.ts +8 -0
  57. package/uform/panel/Propreties/Component/LinkSyncFunction.js +149 -0
  58. package/uform/panel/Propreties/Component/Links.d.ts +3 -0
  59. package/uform/panel/Propreties/Component/Links.js +114 -0
  60. package/uform/panel/Propreties/Component/OptionTable.d.ts +3 -0
  61. package/uform/panel/Propreties/Component/OptionTable.js +144 -0
  62. package/uform/panel/Propreties/Component/RegexpModal.d.ts +5 -0
  63. package/uform/panel/Propreties/Component/RegexpModal.js +74 -0
  64. package/uform/panel/Propreties/Component/Validate.d.ts +3 -0
  65. package/uform/panel/Propreties/Component/Validate.js +93 -0
  66. package/uform/panel/Propreties/Component/ValidateAsyncFunction.d.ts +3 -0
  67. package/uform/panel/Propreties/Component/ValidateAsyncFunction.js +83 -0
  68. package/uform/panel/Propreties/Component/ValidateSyncFunction.d.ts +3 -0
  69. package/uform/panel/Propreties/Component/ValidateSyncFunction.js +77 -0
  70. package/uform/panel/Propreties/FieldOptions.d.ts +6 -0
  71. package/uform/panel/Propreties/FieldOptions.js +131 -0
  72. package/uform/panel/Propreties/FieldProperties.d.ts +3 -0
  73. package/uform/panel/Propreties/FieldProperties.js +60 -0
  74. package/uform/panel/Propreties/GroupProperties.d.ts +3 -0
  75. package/uform/panel/Propreties/GroupProperties.js +17 -0
  76. package/uform/panel/Propreties/_ItemAdvance.d.ts +4 -0
  77. package/uform/panel/Propreties/_ItemAdvance.js +140 -0
  78. package/uform/panel/Propreties/_ItemBase.d.ts +4 -0
  79. package/uform/panel/Propreties/_ItemBase.js +34 -0
  80. package/uform/panel/Propreties/_ItemLink.d.ts +4 -0
  81. package/uform/panel/Propreties/_ItemLink.js +15 -0
  82. package/uform/panel/Propreties/_ItemValidate.d.ts +4 -0
  83. package/uform/panel/Propreties/_ItemValidate.js +67 -0
  84. package/uform/panel/Propreties/_util.d.ts +9 -0
  85. package/uform/panel/Propreties/_util.js +2 -0
  86. package/uform/plugins/index.d.ts +15 -0
  87. package/uform/plugins/index.js +47 -0
  88. package/uform/schema.d.ts +155 -0
  89. package/uform/schema.js +2 -0
  90. package/uform/utils/Const.d.ts +20 -0
  91. package/uform/utils/Const.js +24 -0
  92. package/uform/utils/Convert.d.ts +3 -0
  93. package/uform/utils/Convert.js +274 -0
  94. package/uform/utils/SchemaConvert.d.ts +6 -0
  95. package/uform/utils/SchemaConvert.js +169 -0
  96. package/uform/utils/arr.d.ts +12 -0
  97. package/uform/utils/arr.js +175 -0
@@ -96,6 +96,11 @@ exports.Box = (0, react_1.forwardRef)((props, ref) => {
96
96
  style.height = '100%';
97
97
  }
98
98
  }
99
+ (0, react_1.useEffect)(() => {
100
+ if (state && state.height && contextRef && contextRef.current) {
101
+ contextRef.current.style.height = (state.height + 'px');
102
+ }
103
+ }, [state === null || state === void 0 ? void 0 : state.height]);
99
104
  const resize = () => {
100
105
  if (props.mode == undefined || props.mode == 'common' || app == null) {
101
106
  if (state === null)
@@ -137,11 +137,13 @@ const _VTable = (0, react_1.forwardRef)((props, ref) => {
137
137
  // if (props.mode == undefined || props.mode == 'common') return;
138
138
  // let height = state?.height;
139
139
  // if (!height) return;
140
- // setTimeout(() => {
141
- // height -= getHeightByTagName(root.current, 'thead');
142
- // setScroll({ y: Math.ceil(height), x: true })
143
- // }, 2);
144
- // }, [state?.height])
140
+ // // VAP1.5 scroll table bug
141
+ // root.current.style.height = height + 'px';
142
+ // // setTimeout(() => {
143
+ // // height -= getHeightByTagName(root.current, 'thead');
144
+ // // setScroll({ y: Math.ceil(height), x: true })
145
+ // // }, 2);
146
+ // }, [state?.height]);
145
147
  // @ts-ignore
146
148
  const effectKey = props.model.effect;
147
149
  (0, react_1.useEffect)(() => {
@@ -40,8 +40,6 @@ const react_1 = __importStar(require("react"));
40
40
  const lodash_1 = __importDefault(require("lodash"));
41
41
  const utils_1 = require("../../utils");
42
42
  const antd_1 = require("antd");
43
- const Row_1 = require("../_adapt/Row");
44
- const Col_1 = require("../_adapt/Col");
45
43
  const Popconfirm_1 = require("../_adapt/Popconfirm");
46
44
  const Popover_1 = require("../_adapt/Popover");
47
45
  const Button_1 = require("../_adapt/Button");
@@ -220,7 +218,7 @@ const renderFormField = (state, field, form, update, data) => {
220
218
  itemProps.wrapperCol = { span: 24 - label };
221
219
  }
222
220
  }
223
- return react_1.default.createElement(Col_1.Col, Object.assign({}, colProps),
221
+ return react_1.default.createElement(antd_1.Col, Object.assign({}, colProps),
224
222
  react_1.default.createElement(antd_1.Form.Item, Object.assign({}, itemProps), form.getFieldDecorator(field.field, options)(react_1.default.createElement(input.component, {
225
223
  form,
226
224
  field,
@@ -239,10 +237,10 @@ const renderFormActions = (state, buttons, form, initRef) => {
239
237
  if (btns.length == 0)
240
238
  return utils_1.Const.NONE;
241
239
  var labelWidth = (state.labelSpan / 24) * (1 / state.cols) * 100;
242
- return react_1.default.createElement(Col_1.Col, { span: 24, className: 'c-form-buttons' },
243
- react_1.default.createElement(Row_1.Row, { wrap: false },
244
- react_1.default.createElement(Col_1.Col, { style: { width: utils_1.Format.formatPercent(labelWidth) } }),
245
- react_1.default.createElement(Col_1.Col, { style: { width: utils_1.Format.formatPercent(99 - labelWidth) }, className: 'c-form-actions' }, btns.map(btn => {
240
+ return react_1.default.createElement(antd_1.Col, { span: 24, className: 'c-form-buttons' },
241
+ react_1.default.createElement(antd_1.Row, null,
242
+ react_1.default.createElement(antd_1.Col, { style: { width: utils_1.Format.formatPercent(labelWidth) } }),
243
+ react_1.default.createElement(antd_1.Col, { style: { width: utils_1.Format.formatPercent(99 - labelWidth) }, className: 'c-form-actions' }, btns.map(btn => {
246
244
  if (btn.roleCode && !utils_1.PageUtil.hasRole(btn.roleCode))
247
245
  return utils_1.Const.NONE;
248
246
  let onClick;
@@ -394,7 +392,7 @@ const _FormGroup = (props) => {
394
392
  if (group == null || group === false)
395
393
  return utils_1.Const.NONE;
396
394
  return react_1.default.createElement(react_1.default.Fragment, null,
397
- react_1.default.createElement(Col_1.Col, { span: 24, className: "c-form-group-title" }, utils_1.i18n.getText(group.ik, group.title)),
395
+ react_1.default.createElement(antd_1.Col, { span: 24, className: "c-form-group-title" }, utils_1.i18n.getText(group.ik, group.title)),
398
396
  group.fields.map(field => {
399
397
  if (field == null || field === false)
400
398
  return utils_1.Const.NONE;
@@ -40,7 +40,9 @@ const Col = (props) => {
40
40
  if (props.className) {
41
41
  clazz.push(props.className);
42
42
  }
43
- if (lodash_1.default.has(props, 'span') || lodash_1.default.has(props, 'width') || lodash_1.default.has(props, 'height') || lodash_1.default.has(props.style, 'width') || lodash_1.default.has(props.style, 'height')) {
43
+ if (lodash_1.default.has(props, 'span') || lodash_1.default.has(props, 'width') || lodash_1.default.has(props, 'height')
44
+ || lodash_1.default.has(props, 'sm') || lodash_1.default.has(props, 'md') || lodash_1.default.has(props, 'lg')
45
+ || (lodash_1.default.has(props, 'style') && (lodash_1.default.has(props.style, 'width') || lodash_1.default.has(props.style, 'height')))) {
44
46
  clazz.push('v-col-fix');
45
47
  }
46
48
  else {
@@ -8,7 +8,7 @@ const react_1 = __importDefault(require("react"));
8
8
  const antd_1 = require("antd");
9
9
  const Global_1 = require("../../utils/Global");
10
10
  const Row = (props) => {
11
- let clazz = ['v-row'];
11
+ let clazz = ['ant-row', 'v-row'];
12
12
  if (props.className)
13
13
  clazz.push(props.className);
14
14
  if (props.wrap)
package/index.d.ts CHANGED
@@ -132,7 +132,7 @@ export { VTable, ApiTable, ApiTableModal, STable, TopTable, TopTableModal } from
132
132
  export { STree, DTree, FTree } from './components/Trees';
133
133
  export { UploadFile, UploadImage, UploadModal } from './components/Upload';
134
134
  export { SList } from './components/Lists/SList';
135
- export type { UFromProps, UModalProps, UFormField, UFormFieldGroup, LinkResult, UDescriptionsProps, UFormRef } from './components/UForm';
135
+ export type { UFromProps, UModalProps, UFormField, UFormFieldGroup, LinkResult, UDescriptionsProps, UFormRef, Link, LinkValue } from './components/UForm';
136
136
  export type { TableColumn } from './components/Tables/index';
137
137
  export type { VTableProps, VTableRef } from './components/Tables/VTable';
138
138
  export type { ApiTableProps } from './components/Tables/ApiTable';
package/package.json CHANGED
@@ -1 +1 @@
1
- {"name":"vap1","version":"0.1.3","description":"vap1, Both support MicroService and SAP FrameWork, Support IE>9","main":"index.js","author":"Xiang da","license":"ISC"}
1
+ {"name":"vap1","version":"0.1.5","description":"vap1, Both support MicroService and SAP FrameWork, Support IE>9","main":"index.js","author":"Xiang da","license":"ISC"}
@@ -0,0 +1,21 @@
1
+ import React from 'react';
2
+ import type { FormSchema } from './schema';
3
+ /**
4
+ * TODO
5
+ * 1. input-with-select
6
+ * select 宽度
7
+ * select 位置
8
+ * 2. fieldCount>2 默认值
9
+ * 3. 默认显示/disable
10
+ * 4. tree-select
11
+ * 5. dtree-select
12
+ * 6. 所有日期:日期格式设置
13
+ * */
14
+ type FormEditorProps = {
15
+ data?: string | FormSchema;
16
+ name?: string;
17
+ onSave: (schema: string, isCtrlS?: boolean) => void;
18
+ onBack?: () => void;
19
+ };
20
+ export declare const FormEditor: React.FC<FormEditorProps>;
21
+ export {};
@@ -0,0 +1,101 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ exports.FormEditor = void 0;
30
+ const react_1 = __importStar(require("react"));
31
+ const lodash_1 = __importDefault(require("lodash"));
32
+ const index_1 = require("../index");
33
+ const index_2 = __importDefault(require("./panel/Items/index"));
34
+ const index_3 = __importDefault(require("./panel/Editor/index"));
35
+ const useForm_1 = require("./hooks/useForm");
36
+ const FormViewer_1 = require("./FormViewer");
37
+ const CanvasProperties_1 = __importDefault(require("./panel/Propreties/CanvasProperties"));
38
+ const FieldProperties_1 = __importDefault(require("./panel/Propreties/FieldProperties"));
39
+ const GroupProperties_1 = __importDefault(require("./panel/Propreties/GroupProperties"));
40
+ const useEditor_1 = require("./hooks/useEditor");
41
+ const FormViewer_2 = require("./FormViewer");
42
+ const FormEditor = (props) => {
43
+ const schema = (0, react_1.useMemo)(() => (0, FormViewer_2.initSchama)(props.data), [props.data]);
44
+ const editor = (0, useEditor_1.useFormEditor)(schema);
45
+ const [open, setOpen] = (0, react_1.useState)(false);
46
+ const save = (isCtrlS = false) => {
47
+ props.onSave(JSON.stringify(editor.getForm()), isCtrlS);
48
+ };
49
+ (0, react_1.useLayoutEffect)(() => {
50
+ const onKeyDown = (evt) => {
51
+ if (evt.ctrlKey && (evt.key == 's' || evt.key == 'S')) {
52
+ evt.preventDefault();
53
+ evt.stopPropagation();
54
+ save(true);
55
+ }
56
+ };
57
+ document.addEventListener('keydown', onKeyDown, false);
58
+ return () => document.removeEventListener('keydown', onKeyDown);
59
+ }, []);
60
+ return react_1.default.createElement(useForm_1.UFORM.Provider, { value: editor.form },
61
+ react_1.default.createElement(useEditor_1.FORM_EDITOR.Provider, { value: editor },
62
+ react_1.default.createElement(index_1.Row, { className: 'uform-editor' },
63
+ react_1.default.createElement(index_1.Col, { style: { width: 210, flexShrink: 0 } },
64
+ react_1.default.createElement(index_2.default, null)),
65
+ react_1.default.createElement(index_1.Col, { style: { flexGrow: 1 } },
66
+ react_1.default.createElement("div", { className: 'panel-title' },
67
+ "\u8868\u5355 ",
68
+ props.name && react_1.default.createElement("small", null,
69
+ react_1.default.createElement("b", null, props.name)),
70
+ react_1.default.createElement(index_1.Button.Group, { style: { float: 'right', marginRight: 6, display: 'block' } },
71
+ editor.form.isGroup && react_1.default.createElement(index_1.Button, { icon: "plus", onClick: () => editor.addGroup() }, "\u6DFB\u52A0\u5206\u7EC4"),
72
+ react_1.default.createElement(index_1.Button, { icon: 'eye', type: "primary", onClick: () => {
73
+ if (schema.fields && schema.fields.length > 1) {
74
+ setOpen(true);
75
+ }
76
+ else {
77
+ index_1.message.error('至少添加一个字段');
78
+ }
79
+ } }, "\u9884\u89C8"))),
80
+ react_1.default.createElement(index_3.default, null)),
81
+ react_1.default.createElement(index_1.Col, { style: { width: 320, flexShrink: 0 }, className: "uform-prperties" },
82
+ react_1.default.createElement("div", { className: 'panel-title' },
83
+ "\u5C5E\u6027",
84
+ react_1.default.createElement(index_1.Button.Group, { style: { float: 'right', marginRight: 6, display: 'block' } },
85
+ lodash_1.default.isFunction(props.onBack) && react_1.default.createElement(index_1.Button, { icon: 'rollback', onClick: () => props.onBack() }, "\u8FD4\u56DE"),
86
+ react_1.default.createElement(index_1.Button, { onClick: () => save(), icon: 'save', type: 'primary' }, "\u4FDD\u5B58"))),
87
+ react_1.default.createElement(index_1.Form, { className: 'panel-content', labelCol: { sm: 6 }, wrapperCol: { sm: 17 } }, editor.selected == null ? react_1.default.createElement(CanvasProperties_1.default, null) : (editor.selected.field ? react_1.default.createElement(FieldProperties_1.default, null) : react_1.default.createElement(GroupProperties_1.default, null))))),
88
+ react_1.default.createElement(FormViewer_1.FormModal, { title: editor.form.title || '表单预览', schema: editor.form, open: open, onOk: (data) => {
89
+ setOpen(false);
90
+ index_1.notification.info({
91
+ role: 'alert',
92
+ style: { padding: 0 },
93
+ icon: react_1.default.createElement(react_1.default.Fragment, null),
94
+ placement: 'top',
95
+ message: react_1.default.createElement(react_1.default.Fragment, null,
96
+ react_1.default.createElement("h4", null, "JSON \u9884\u89C8"),
97
+ react_1.default.createElement("pre", null, JSON.stringify(data, null, 1)))
98
+ });
99
+ }, onCancel: () => setOpen(false) })));
100
+ };
101
+ exports.FormEditor = FormEditor;
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import type { FormSchema } from './schema';
3
+ import type { UModalProps, PlainObject } from '../index';
4
+ type ModalProps = Pick<UModalProps, 'open' | 'onOk' | 'onCancel' | 'title' | 'data'>;
5
+ type FormViewProps = {
6
+ schema: FormSchema | string;
7
+ data?: PlainObject;
8
+ };
9
+ export declare const initSchama: (data: string | FormSchema) => FormSchema;
10
+ export declare const FormViewer: React.FC<FormViewProps>;
11
+ export declare const FormModal: React.FC<FormViewProps & ModalProps>;
12
+ export {};
@@ -0,0 +1,71 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ exports.FormModal = exports.FormViewer = exports.initSchama = void 0;
30
+ const lodash_1 = __importDefault(require("lodash"));
31
+ const react_1 = __importStar(require("react"));
32
+ const index_1 = require("../index");
33
+ const Convert_1 = require("./utils/Convert");
34
+ const DEFAULT = { fields: [] };
35
+ const initSchama = (data) => {
36
+ if (lodash_1.default.isString(data)) {
37
+ try {
38
+ const schema = JSON.parse(data);
39
+ if (lodash_1.default.isPlainObject(schema) && lodash_1.default.isArray(schema.fields)) {
40
+ return schema;
41
+ }
42
+ }
43
+ catch (_a) {
44
+ }
45
+ }
46
+ else if (lodash_1.default.isPlainObject(data) && lodash_1.default.isArray(data.fields)) {
47
+ return data;
48
+ }
49
+ return DEFAULT;
50
+ };
51
+ exports.initSchama = initSchama;
52
+ const _FormRender = props => {
53
+ const uformProps = (0, react_1.useMemo)(() => (0, Convert_1.schemaToForm)(props.schema), [props]);
54
+ return react_1.default.createElement(index_1.UForm, Object.assign({}, uformProps, { data: props.data }));
55
+ };
56
+ const _ModalRender = props => {
57
+ const uformProps = (0, react_1.useMemo)(() => (0, Convert_1.schemaToForm)(props.schema), [props]);
58
+ let modalProps = {};
59
+ modalProps.title = props.title || props.schema.title || '';
60
+ return react_1.default.createElement(index_1.UFormModal, Object.assign({}, uformProps, modalProps, { data: props.data, open: props.open, onOk: props.onOk, onCancel: props.onCancel }));
61
+ };
62
+ const FormViewer = props => {
63
+ const schema = (0, react_1.useMemo)(() => (0, exports.initSchama)(props.schema), [props.schema]);
64
+ return react_1.default.createElement(_FormRender, { schema: schema, data: props.data });
65
+ };
66
+ exports.FormViewer = FormViewer;
67
+ const FormModal = props => {
68
+ const schema = (0, react_1.useMemo)(() => (0, exports.initSchama)(props.schema), [props.schema]);
69
+ return react_1.default.createElement(_ModalRender, Object.assign({}, props, { schema: schema }));
70
+ };
71
+ exports.FormModal = FormModal;
@@ -0,0 +1,28 @@
1
+ /// <reference types="react" />
2
+ import type { FormGroup, FormItem, FormSchema, Cursor } from '../schema';
3
+ type CurrentSelected = {
4
+ group?: string;
5
+ field?: string;
6
+ };
7
+ type FormEditorContext = {
8
+ form: FormSchema;
9
+ selected: CurrentSelected;
10
+ baseSpan: number;
11
+ getForm: () => FormSchema;
12
+ setSelected: (selected: {
13
+ field?: string;
14
+ group?: string;
15
+ }) => void;
16
+ deleteField: (groupId?: string) => void;
17
+ addGroup: () => void;
18
+ deleteGroup: (groupId: string) => void;
19
+ getSelect: () => FormItem | FormGroup;
20
+ sortField: (itemId: string, targetPos: any, groupId?: string) => void;
21
+ addField: (type: string, pointer?: Cursor, groupId?: string) => void;
22
+ setFormProperties: (param: Partial<FormSchema>) => void;
23
+ setFieldProperties: (properties: string, value: any) => void;
24
+ };
25
+ export declare const FORM_EDITOR: import("react").Context<FormEditorContext>;
26
+ export declare const useEditor: () => FormEditorContext;
27
+ export declare const useFormEditor: (dataJson: FormSchema) => FormEditorContext;
28
+ export {};
@@ -0,0 +1,144 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.useFormEditor = exports.useEditor = exports.FORM_EDITOR = void 0;
7
+ const react_1 = require("react");
8
+ const hooks_1 = require("../../hooks");
9
+ const utils_1 = require("../../utils");
10
+ const lodash_1 = __importDefault(require("lodash"));
11
+ const arr_1 = require("../utils/arr");
12
+ exports.FORM_EDITOR = (0, react_1.createContext)(null);
13
+ const useEditor = () => (0, react_1.useContext)(exports.FORM_EDITOR);
14
+ exports.useEditor = useEditor;
15
+ const BASESPAN_MAP = new Map([['simple', 24], ['compress', 8], ['common', 12]]);
16
+ const useFormEditor = (dataJson) => {
17
+ const [form, setForm] = (0, hooks_1.useSetState)(dataJson);
18
+ const FORM_REF = (0, react_1.useRef)(form);
19
+ const { layout, isGroup, fields } = form;
20
+ (0, react_1.useLayoutEffect)(() => { FORM_REF.current = form; }, [form]);
21
+ const [selected, setSelected] = (0, react_1.useState)(null);
22
+ const setFields = (fields) => setForm({ fields });
23
+ const baseSpan = (0, react_1.useMemo)(() => {
24
+ if (layout && BASESPAN_MAP.has(layout))
25
+ return BASESPAN_MAP.get(layout);
26
+ if (!isGroup)
27
+ return fields.length >= 8 ? 12 : 24;
28
+ let len = lodash_1.default.sum(fields.map(group => group.fields.length));
29
+ return len >= 8 ? 12 : 24;
30
+ }, [isGroup, layout, fields === null || fields === void 0 ? void 0 : fields.length]);
31
+ // 添加字段
32
+ const addField = (type, temPosition, groupId) => {
33
+ if (groupId) {
34
+ setFields((0, arr_1.insertInGroup)(type, fields, groupId, temPosition));
35
+ }
36
+ else {
37
+ setFields((0, arr_1.insertInList)(type, fields, temPosition));
38
+ }
39
+ };
40
+ // 删除字段
41
+ const deleteField = () => {
42
+ if (selected == null || selected.field == undefined) {
43
+ return;
44
+ }
45
+ if (!isGroup) {
46
+ setSelected(null);
47
+ setFields(lodash_1.default.filter(fields, item => item.id != selected.field));
48
+ return;
49
+ }
50
+ let list = fields;
51
+ let gdx = lodash_1.default.findIndex(list, { id: selected.group });
52
+ if (gdx < 0) {
53
+ return;
54
+ }
55
+ let idx = lodash_1.default.findIndex(list[gdx].fields, { id: selected.field });
56
+ if (idx < 0) {
57
+ return;
58
+ }
59
+ setSelected(null);
60
+ let group = Object.assign(Object.assign({}, list[gdx]), { fields: lodash_1.default.filter(list[gdx].fields, (f => f.id != selected.field)) });
61
+ setFields([...lodash_1.default.slice(list, 0, gdx), group, ...lodash_1.default.slice(list, gdx + 1)]);
62
+ };
63
+ // 删除分组
64
+ const deleteGroup = (groupId) => {
65
+ setSelected(null);
66
+ setFields(lodash_1.default.filter(fields, item => item.id != groupId));
67
+ };
68
+ // 字段/分组 排序
69
+ const sortField = (itemId, targetPos, groupId) => {
70
+ if (groupId) {
71
+ setFields((0, arr_1.sortListInGroup)(itemId, fields, groupId, targetPos));
72
+ }
73
+ else {
74
+ setFields((0, arr_1.sortList)(itemId, fields, targetPos));
75
+ }
76
+ setSelected(null);
77
+ };
78
+ // 获取当前选中项
79
+ const getSelect = () => {
80
+ if (selected == null) {
81
+ return null;
82
+ }
83
+ if (isGroup) {
84
+ let group = lodash_1.default.find(fields, { id: selected.group });
85
+ if (group) {
86
+ if (selected.field) {
87
+ let p = lodash_1.default.find(group.fields, { id: selected.field });
88
+ if (p) {
89
+ return p;
90
+ }
91
+ }
92
+ else {
93
+ return group;
94
+ }
95
+ }
96
+ }
97
+ else {
98
+ let p = lodash_1.default.find(fields, { id: selected.field });
99
+ if (p) {
100
+ return p;
101
+ }
102
+ }
103
+ return null;
104
+ };
105
+ // // 设置表单属性
106
+ // const setFormProperties = (key: string, value: any) => {
107
+ // setForm({ [key]: value })
108
+ // }
109
+ // 设置字段/分组属性
110
+ const setFieldProperties = (property, value) => {
111
+ if (selected == null) {
112
+ return;
113
+ }
114
+ if (isGroup && selected.field) {
115
+ setFields((0, arr_1.setPropertiesInGroup)(fields, selected.group, selected.field, property, value));
116
+ return;
117
+ }
118
+ setFields((0, arr_1.setProperties)(fields, selected.field || selected.group, property, value));
119
+ };
120
+ // 添加分组
121
+ const addGroup = () => {
122
+ if (!form.isGroup)
123
+ return;
124
+ let id = utils_1.StringUtil.genKey();
125
+ setFields([...fields, { title: '新分组 ' + id, id, fields: [] }]);
126
+ };
127
+ // const getForm = useCallback(()=>{})
128
+ return {
129
+ form,
130
+ selected,
131
+ baseSpan,
132
+ getForm: () => FORM_REF.current,
133
+ setSelected,
134
+ deleteField,
135
+ deleteGroup,
136
+ getSelect,
137
+ sortField,
138
+ addGroup,
139
+ addField,
140
+ setFormProperties: setForm,
141
+ setFieldProperties,
142
+ };
143
+ };
144
+ exports.useFormEditor = useFormEditor;
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import type { FormSchema } from '../schema';
3
+ export declare const UFORM: import("react").Context<FormSchema>;
4
+ export declare const useForm: () => FormSchema;
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useForm = exports.UFORM = void 0;
4
+ const react_1 = require("react");
5
+ exports.UFORM = (0, react_1.createContext)({ fields: [] });
6
+ const useForm = () => (0, react_1.useContext)(exports.UFORM);
7
+ exports.useForm = useForm;
@@ -0,0 +1,5 @@
1
+ export { FormEditor } from './FormEditor';
2
+ export { FormViewer, FormModal } from './FormViewer';
3
+ export { registerEditorPlugin, registerFieldPlugin, registerGroupPlugin } from './plugins';
4
+ import { registerCustom } from './inputs/register';
5
+ export { registerCustom };
package/uform/index.js ADDED
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.registerCustom = exports.registerGroupPlugin = exports.registerFieldPlugin = exports.registerEditorPlugin = exports.FormModal = exports.FormViewer = exports.FormEditor = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const index_1 = require("../index");
9
+ const lodash_1 = __importDefault(require("lodash"));
10
+ var FormEditor_1 = require("./FormEditor");
11
+ Object.defineProperty(exports, "FormEditor", { enumerable: true, get: function () { return FormEditor_1.FormEditor; } });
12
+ var FormViewer_1 = require("./FormViewer");
13
+ Object.defineProperty(exports, "FormViewer", { enumerable: true, get: function () { return FormViewer_1.FormViewer; } });
14
+ Object.defineProperty(exports, "FormModal", { enumerable: true, get: function () { return FormViewer_1.FormModal; } });
15
+ var plugins_1 = require("./plugins");
16
+ Object.defineProperty(exports, "registerEditorPlugin", { enumerable: true, get: function () { return plugins_1.registerEditorPlugin; } });
17
+ Object.defineProperty(exports, "registerFieldPlugin", { enumerable: true, get: function () { return plugins_1.registerFieldPlugin; } });
18
+ Object.defineProperty(exports, "registerGroupPlugin", { enumerable: true, get: function () { return plugins_1.registerGroupPlugin; } });
19
+ const register_1 = require("./inputs/register");
20
+ Object.defineProperty(exports, "registerCustom", { enumerable: true, get: function () { return register_1.registerCustom; } });
21
+ const picOptions = lodash_1.default.range(1, 17).map((key) => ({ label: key, value: `/data/images/dashboard/${key}.png` }));
22
+ (0, register_1.registerCustom)({
23
+ type: 'dashboard-cover',
24
+ title: '快速图片选择',
25
+ icon: 'text.png',
26
+ Component: () => {
27
+ const width = 144, height = 81;
28
+ return react_1.default.createElement("div", null,
29
+ react_1.default.createElement(index_1.Upload, { name: "file", withCredentials: true, listType: "picture", showUploadList: false, onChange: () => { }, accept: "image/*", className: 'upload-icon-empty', data: { namespace: 'app-data', } }, react_1.default.createElement("div", { style: { width, height, marginRight: 6, textAlign: 'center', paddingTop: 12, cursor: 'pointer', borderRadius: 4, marginBottom: 6, border: '1px solid rgb(24 144 255 / 24%)' } },
30
+ react_1.default.createElement(index_1.Icon, { type: 'plus' }),
31
+ react_1.default.createElement("div", { className: "ant-upload-text" }, "\u4E0A\u4F20"))),
32
+ react_1.default.createElement(index_1.Row, { style: { height: 140, width: 436, overflowX: 'hidden', overflowY: 'auto', flexWrap: 'wrap' }, gutter: 8 }, picOptions.map((img) => react_1.default.createElement(index_1.Col, { span: 6, style: { height: 64, marginBottom: 6, cursor: 'pointer' } },
33
+ react_1.default.createElement("img", { style: { height: '100%', width: '100%', borderWidth: 1, borderStyle: 'solid', borderRadius: 6, borderColor: 'transparent' }, src: img.value })))));
34
+ }
35
+ });
@@ -0,0 +1,2 @@
1
+ import type { FormInput } from './register';
2
+ export declare const FROM_ADVANCE: FormInput[];
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.FROM_ADVANCE = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const index_1 = require("../../index");
9
+ const defaultPlaceholder = '请上传';
10
+ const style = { pointerEvents: 'none' };
11
+ // 内置输入
12
+ exports.FROM_ADVANCE = [
13
+ {
14
+ type: 'file',
15
+ title: '上传文件',
16
+ icon: 'text.png',
17
+ defaultPlaceholder,
18
+ fieldCount: 2,
19
+ Component: props => react_1.default.createElement(index_1.Button, { style: style, icon: "upload" }, props.placeholder || '上传文件')
20
+ },
21
+ {
22
+ type: 'img',
23
+ title: '上传图片',
24
+ icon: 'text.png',
25
+ defaultPlaceholder,
26
+ Component: props => react_1.default.createElement(index_1.UploadImage, { onChange: () => { } })
27
+ },
28
+ {
29
+ type: 'organization',
30
+ title: '机构选择',
31
+ icon: 'text.png',
32
+ fieldCount: 4,
33
+ defaultPlaceholder: "请选择",
34
+ Component: props => react_1.default.createElement(index_1.Button, { style: style, icon: "upload" }, props.placeholder || '请选择机构')
35
+ },
36
+ {
37
+ type: 'role',
38
+ title: '角色选择',
39
+ icon: 'text.png',
40
+ defaultPlaceholder: "请选择",
41
+ Component: props => react_1.default.createElement(index_1.Select, { style: style, placeholder: props.placeholder || '请选择角色' })
42
+ },
43
+ {
44
+ type: 'roles',
45
+ title: '角色多选',
46
+ icon: 'text.png',
47
+ defaultPlaceholder: "请选择",
48
+ Component: props => react_1.default.createElement(index_1.Select, { style: style, placeholder: props.placeholder || '请选择角色' })
49
+ },
50
+ {
51
+ type: 'json-array',
52
+ title: '列表',
53
+ icon: 'text.png',
54
+ defaultPlaceholder: "请选择",
55
+ Component: props => react_1.default.createElement(index_1.Table, { style: style, locale: { emptyText: react_1.default.createElement(index_1.Empty, { description: "\u4EC5\u4E3A\u9884\u89C8\u6548\u679C\uFF0C\u8868\u683C\u914D\u7F6E\u6B63\u5728\u652F\u6301\u4E2D" }) } })
56
+ }
57
+ ];
@@ -0,0 +1,2 @@
1
+ import type { FormInput } from './register';
2
+ export declare const FORM_DATE: FormInput[];