@xrenders/schema-builder 1.0.0-alpha.2 → 1.0.0-alpha.21
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/README.md +2 -2
- package/es/createIframe.js +1 -1
- package/es/main.d.ts +4 -6
- package/es/main.js +27 -14
- package/es/settings/index.d.ts +21 -0
- package/es/settings/index.js +24 -0
- package/es/settings/meta/card.d.ts +2 -0
- package/es/settings/meta/card.js +108 -0
- package/es/settings/meta/cardList.d.ts +2 -0
- package/es/settings/meta/cardList.js +203 -0
- package/es/settings/meta/checkbox.d.ts +2 -0
- package/es/settings/meta/checkbox.js +29 -0
- package/es/settings/meta/checkboxes.d.ts +2 -0
- package/es/settings/meta/checkboxes.js +66 -0
- package/es/settings/meta/color.d.ts +2 -0
- package/es/settings/meta/color.js +21 -0
- package/es/settings/meta/date.d.ts +2 -0
- package/es/settings/meta/date.js +28 -0
- package/es/settings/meta/dateRange.d.ts +2 -0
- package/es/settings/meta/dateRange.js +37 -0
- package/es/settings/meta/form.d.ts +2 -0
- package/es/settings/meta/form.js +115 -0
- package/es/settings/meta/imageInput.d.ts +2 -0
- package/es/settings/meta/imageInput.js +21 -0
- package/es/settings/meta/input.d.ts +2 -0
- package/es/settings/meta/input.js +62 -0
- package/es/settings/meta/number.d.ts +2 -0
- package/es/settings/meta/number.js +69 -0
- package/es/settings/meta/radio.d.ts +2 -0
- package/es/settings/meta/radio.js +65 -0
- package/es/settings/meta/rate.d.ts +2 -0
- package/es/settings/meta/rate.js +56 -0
- package/es/settings/meta/select.d.ts +2 -0
- package/es/settings/meta/select.js +58 -0
- package/es/settings/meta/slider.d.ts +2 -0
- package/es/settings/meta/slider.js +40 -0
- package/es/settings/meta/switch.d.ts +2 -0
- package/es/settings/meta/switch.js +48 -0
- package/es/settings/meta/textarea.d.ts +2 -0
- package/es/settings/meta/textarea.js +69 -0
- package/es/settings/meta/time.d.ts +2 -0
- package/es/settings/meta/time.js +29 -0
- package/es/settings/meta/timeRange.d.ts +2 -0
- package/es/settings/meta/timeRange.js +37 -0
- package/es/settings/meta/treeSelect.d.ts +2 -0
- package/es/settings/meta/treeSelect.js +85 -0
- package/es/settings/meta/urlInput.d.ts +2 -0
- package/es/settings/meta/urlInput.js +34 -0
- package/es/settings/utils.d.ts +110 -0
- package/es/settings/utils.js +251 -0
- package/es/type.d.ts +33 -0
- package/es/type.js +1 -0
- package/lib/createIframe.js +3 -4
- package/lib/index.js +2 -3
- package/lib/main.d.ts +4 -6
- package/lib/main.js +29 -17
- package/lib/settings/index.d.ts +21 -0
- package/lib/settings/index.js +153 -0
- package/lib/settings/meta/card.d.ts +2 -0
- package/lib/settings/meta/card.js +114 -0
- package/lib/settings/meta/cardList.d.ts +2 -0
- package/lib/settings/meta/cardList.js +209 -0
- package/lib/settings/meta/checkbox.d.ts +2 -0
- package/lib/settings/meta/checkbox.js +35 -0
- package/lib/settings/meta/checkboxes.d.ts +2 -0
- package/lib/settings/meta/checkboxes.js +72 -0
- package/lib/settings/meta/color.d.ts +2 -0
- package/lib/settings/meta/color.js +27 -0
- package/lib/settings/meta/date.d.ts +2 -0
- package/lib/settings/meta/date.js +34 -0
- package/lib/settings/meta/dateRange.d.ts +2 -0
- package/lib/settings/meta/dateRange.js +43 -0
- package/lib/settings/meta/form.d.ts +2 -0
- package/lib/settings/meta/form.js +121 -0
- package/lib/settings/meta/imageInput.d.ts +2 -0
- package/lib/settings/meta/imageInput.js +27 -0
- package/lib/settings/meta/input.d.ts +2 -0
- package/lib/settings/meta/input.js +68 -0
- package/lib/settings/meta/number.d.ts +2 -0
- package/lib/settings/meta/number.js +75 -0
- package/lib/settings/meta/radio.d.ts +2 -0
- package/lib/settings/meta/radio.js +71 -0
- package/lib/settings/meta/rate.d.ts +2 -0
- package/lib/settings/meta/rate.js +62 -0
- package/lib/settings/meta/select.d.ts +2 -0
- package/lib/settings/meta/select.js +64 -0
- package/lib/settings/meta/slider.d.ts +2 -0
- package/lib/settings/meta/slider.js +46 -0
- package/lib/settings/meta/switch.d.ts +2 -0
- package/lib/settings/meta/switch.js +54 -0
- package/lib/settings/meta/textarea.d.ts +2 -0
- package/lib/settings/meta/textarea.js +75 -0
- package/lib/settings/meta/time.d.ts +2 -0
- package/lib/settings/meta/time.js +35 -0
- package/lib/settings/meta/timeRange.d.ts +2 -0
- package/lib/settings/meta/timeRange.js +43 -0
- package/lib/settings/meta/treeSelect.d.ts +2 -0
- package/lib/settings/meta/treeSelect.js +91 -0
- package/lib/settings/meta/urlInput.d.ts +2 -0
- package/lib/settings/meta/urlInput.js +40 -0
- package/lib/settings/utils.d.ts +110 -0
- package/lib/settings/utils.js +258 -0
- package/lib/type.d.ts +33 -0
- package/lib/type.js +5 -0
- package/package.json +5 -6
- package/es/utils/createIconFont.d.ts +0 -3
- package/es/utils/createIconFont.js +0 -9
- package/lib/utils/createIconFont.d.ts +0 -3
- package/lib/utils/createIconFont.js +0 -18
package/README.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
### 安装
|
|
4
4
|
|
|
5
5
|
```bash
|
|
6
|
-
npm i @
|
|
6
|
+
npm i @xrenders/schema-builder
|
|
7
7
|
```
|
|
8
8
|
|
|
9
9
|
### 代码演示
|
|
@@ -14,7 +14,7 @@ npm i @xrender/schema-builder
|
|
|
14
14
|
* defaultShowCode: true
|
|
15
15
|
*/
|
|
16
16
|
import React from 'react';
|
|
17
|
-
import SchemaBuilder from '@
|
|
17
|
+
import SchemaBuilder from '@xrenders/schema-builder';
|
|
18
18
|
|
|
19
19
|
const defaultValue = {
|
|
20
20
|
type: 'object',
|
package/es/createIframe.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
var createIframeContent = function createIframeContent() {
|
|
2
|
-
var html = "\n <html>\n <head>\n <meta charset=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\" />\n <title>XRender</title>\n <link rel=\"icon\" href=\"https://img.alicdn.com/tfs/TB17UtINiLaK1RjSZFxXXamPFXa-606-643.png\">\n <link href=\"https://alifd.alicdn.com/npm/@alifd/theme-lowcode-light@0.2.1/variables.css\" rel=\"stylesheet\" />\n <link href=\"https://alifd.alicdn.com/npm/@alifd/theme-lowcode-light@0.2.1/dist/next.var.min.css\" rel=\"stylesheet\" />\n <link rel=\"stylesheet\" href=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/1.
|
|
2
|
+
var html = "\n <html>\n <head>\n <meta charset=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\" />\n <title>XRender</title>\n <link rel=\"icon\" href=\"https://img.alicdn.com/tfs/TB17UtINiLaK1RjSZFxXXamPFXa-606-643.png\">\n <link href=\"https://alifd.alicdn.com/npm/@alifd/theme-lowcode-light@0.2.1/variables.css\" rel=\"stylesheet\" />\n <link href=\"https://alifd.alicdn.com/npm/@alifd/theme-lowcode-light@0.2.1/dist/next.var.min.css\" rel=\"stylesheet\" />\n <link rel=\"stylesheet\" href=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/1.2.3/dist/css/engine-core.css\" />\n <link rel=\"stylesheet\" href=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine-ext/1.0.6/dist/css/engine-ext.css\" />\n <link rel=\"stylesheet\" href=\"https://g.alicdn.com/fone-lowcode/fr-generator/1.1.1/css/index.css\" />\n\n <script>\n window.React = window.parent.React;\n window.ReactDOM = window.parent.ReactDOM;\n </script>\n \n <script src=\"https://g.alicdn.com/code/lib/prop-types/15.7.2/prop-types.js\"></script>\n <script src=\"https://g.alicdn.com/platform/c/react15-polyfill/0.0.1/dist/index.js\"></script>\n <script src=\"https://g.alicdn.com/platform/c/lodash/4.6.1/lodash.min.js\"></script>\n <script src=\"https://g.alicdn.com/mylib/moment/2.24.0/min/moment.min.js\"></script>\n <script src=\"https://g.alicdn.com/code/lib/alifd__next/1.23.24/next.min.js\"></script>\n <script crossorigin=\"anonymous\" src=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/1.2.3/dist/js/engine-core.js\"></script>\n <script crossorigin=\"anonymous\" src=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine-ext/1.0.6/dist/js/engine-ext.js\"></script>\n </head>\n\n <body>\n <div id=\"lce-container\"></div>\n <script type=\"text/javascript\" src=\"https://g.alicdn.com/fone-lowcode/fr-generator/1.1.1/js/index.js\"></script>\n </body>\n </html>\n ";
|
|
3
3
|
return html;
|
|
4
4
|
};
|
|
5
5
|
export default (function () {
|
package/es/main.d.ts
CHANGED
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
declare const Design: (props: IProps) => JSX.Element;
|
|
6
|
-
export default Design;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { TSchemaBuilder } from './type';
|
|
3
|
+
declare const _default: React.ForwardRefExoticComponent<Omit<TSchemaBuilder, "ref"> & React.RefAttributes<unknown>>;
|
|
4
|
+
export default _default;
|
package/es/main.js
CHANGED
|
@@ -1,20 +1,33 @@
|
|
|
1
|
-
function _typeof(
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
2
|
var _excluded = ["widgets", "settings"];
|
|
3
|
-
function ownKeys(
|
|
4
|
-
function _objectSpread(
|
|
5
|
-
function _defineProperty(
|
|
6
|
-
function _toPropertyKey(
|
|
7
|
-
function _toPrimitive(
|
|
8
|
-
function _objectWithoutProperties(
|
|
9
|
-
function _objectWithoutPropertiesLoose(
|
|
10
|
-
import React, { useEffect, useRef } from 'react';
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
7
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
8
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
9
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
|
|
10
|
+
import React, { useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
|
|
11
11
|
import createIframe from './createIframe';
|
|
12
|
+
import * as defaultSetting from './settings';
|
|
12
13
|
var iframe;
|
|
13
|
-
var Design = function Design(props) {
|
|
14
|
+
var Design = function Design(props, ref) {
|
|
14
15
|
var widgets = props.widgets,
|
|
15
16
|
settings = props.settings,
|
|
16
17
|
restProps = _objectWithoutProperties(props, _excluded);
|
|
17
18
|
var containerRef = useRef();
|
|
19
|
+
useImperativeHandle(ref, function () {
|
|
20
|
+
return {
|
|
21
|
+
getValue: function getValue() {
|
|
22
|
+
var _iframe, _iframe$contentWindow, _iframe$contentWindow2, _iframe$contentWindow3;
|
|
23
|
+
return (_iframe = iframe) === null || _iframe === void 0 ? void 0 : (_iframe$contentWindow = _iframe.contentWindow) === null || _iframe$contentWindow === void 0 ? void 0 : (_iframe$contentWindow2 = _iframe$contentWindow.__FR_ENGINE__) === null || _iframe$contentWindow2 === void 0 ? void 0 : (_iframe$contentWindow3 = _iframe$contentWindow2.exportSchema) === null || _iframe$contentWindow3 === void 0 ? void 0 : _iframe$contentWindow3.call(_iframe$contentWindow2);
|
|
24
|
+
},
|
|
25
|
+
setValue: function setValue(schema) {
|
|
26
|
+
var _iframe2, _iframe2$contentWindo, _iframe2$contentWindo2, _iframe2$contentWindo3;
|
|
27
|
+
return (_iframe2 = iframe) === null || _iframe2 === void 0 ? void 0 : (_iframe2$contentWindo = _iframe2.contentWindow) === null || _iframe2$contentWindo === void 0 ? void 0 : (_iframe2$contentWindo2 = _iframe2$contentWindo.__FR_ENGINE__) === null || _iframe2$contentWindo2 === void 0 ? void 0 : (_iframe2$contentWindo3 = _iframe2$contentWindo2.importSchema) === null || _iframe2$contentWindo3 === void 0 ? void 0 : _iframe2$contentWindo3.call(_iframe2$contentWindo2, schema);
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
});
|
|
18
31
|
useEffect(function () {
|
|
19
32
|
initIframe();
|
|
20
33
|
window.addEventListener('message', engineOnLoad);
|
|
@@ -27,12 +40,12 @@ var Design = function Design(props) {
|
|
|
27
40
|
containerRef.current.appendChild(iframe);
|
|
28
41
|
};
|
|
29
42
|
var engineOnLoad = function engineOnLoad(event) {
|
|
30
|
-
var
|
|
43
|
+
var _iframe3, _iframe3$contentWindo, _iframe3$contentWindo2;
|
|
31
44
|
if (event.data.type !== 'engine-load') {
|
|
32
45
|
return;
|
|
33
46
|
}
|
|
34
|
-
(
|
|
35
|
-
settings: settings,
|
|
47
|
+
(_iframe3 = iframe) === null || _iframe3 === void 0 ? void 0 : (_iframe3$contentWindo = _iframe3.contentWindow) === null || _iframe3$contentWindo === void 0 ? void 0 : (_iframe3$contentWindo2 = _iframe3$contentWindo.__FR_ENGINE__) === null || _iframe3$contentWindo2 === void 0 ? void 0 : _iframe3$contentWindo2.init(_objectSpread({
|
|
48
|
+
settings: _objectSpread(_objectSpread({}, defaultSetting), settings),
|
|
36
49
|
widgets: widgets,
|
|
37
50
|
// recordEnable: true,
|
|
38
51
|
logo: {
|
|
@@ -48,4 +61,4 @@ var Design = function Design(props) {
|
|
|
48
61
|
}
|
|
49
62
|
});
|
|
50
63
|
};
|
|
51
|
-
export default Design;
|
|
64
|
+
export default /*#__PURE__*/forwardRef(Design);
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export { default as Input } from './meta/input';
|
|
2
|
+
export { default as Number } from './meta/number';
|
|
3
|
+
export { default as Select } from './meta/select';
|
|
4
|
+
export { default as Radio } from './meta/radio';
|
|
5
|
+
export { default as Checkbox } from './meta/checkbox';
|
|
6
|
+
export { default as Checkboxes } from './meta/checkboxes';
|
|
7
|
+
export { default as Textarea } from './meta/textarea';
|
|
8
|
+
export { default as DatePicker } from './meta/date';
|
|
9
|
+
export { default as DateRange } from './meta/dateRange';
|
|
10
|
+
export { default as TimePicker } from './meta/time';
|
|
11
|
+
export { default as TimeRange } from './meta/timeRange';
|
|
12
|
+
export { default as Rate } from './meta/rate';
|
|
13
|
+
export { default as Switch } from './meta/switch';
|
|
14
|
+
export { default as Slider } from './meta/slider';
|
|
15
|
+
export { default as Color } from './meta/color';
|
|
16
|
+
export { default as ImageInput } from './meta/imageInput';
|
|
17
|
+
export { default as UrlInput } from './meta/urlInput';
|
|
18
|
+
export { default as TreeSelect } from './meta/treeSelect';
|
|
19
|
+
export { default as Form } from './meta/form';
|
|
20
|
+
export { default as card } from './meta/card';
|
|
21
|
+
export { default as CardList } from './meta/cardList';
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
// 常用组件配置
|
|
2
|
+
export { default as Input } from './meta/input';
|
|
3
|
+
export { default as Number } from './meta/number';
|
|
4
|
+
export { default as Select } from './meta/select';
|
|
5
|
+
export { default as Radio } from './meta/radio';
|
|
6
|
+
export { default as Checkbox } from './meta/checkbox';
|
|
7
|
+
export { default as Checkboxes } from './meta/checkboxes';
|
|
8
|
+
export { default as Textarea } from './meta/textarea';
|
|
9
|
+
export { default as DatePicker } from './meta/date';
|
|
10
|
+
export { default as DateRange } from './meta/dateRange';
|
|
11
|
+
export { default as TimePicker } from './meta/time';
|
|
12
|
+
export { default as TimeRange } from './meta/timeRange';
|
|
13
|
+
export { default as Rate } from './meta/rate';
|
|
14
|
+
export { default as Switch } from './meta/switch';
|
|
15
|
+
export { default as Slider } from './meta/slider';
|
|
16
|
+
// 其他组件配置
|
|
17
|
+
export { default as Color } from './meta/color';
|
|
18
|
+
export { default as ImageInput } from './meta/imageInput';
|
|
19
|
+
export { default as UrlInput } from './meta/urlInput';
|
|
20
|
+
export { default as TreeSelect } from './meta/treeSelect';
|
|
21
|
+
// 容器组件配置
|
|
22
|
+
export { default as Form } from './meta/form';
|
|
23
|
+
export { default as card } from './meta/card';
|
|
24
|
+
export { default as CardList } from './meta/cardList';
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { createMeta } from '../utils';
|
|
2
|
+
var props = [{
|
|
3
|
+
name: 'title',
|
|
4
|
+
title: {
|
|
5
|
+
label: '标题',
|
|
6
|
+
tip: 'title | 卡片主题'
|
|
7
|
+
},
|
|
8
|
+
setter: 'StringSetter'
|
|
9
|
+
}, {
|
|
10
|
+
name: 'code',
|
|
11
|
+
title: {
|
|
12
|
+
label: '字段名',
|
|
13
|
+
tip: 'key | 字段名'
|
|
14
|
+
},
|
|
15
|
+
setter: 'StringSetter'
|
|
16
|
+
}, {
|
|
17
|
+
name: 'description',
|
|
18
|
+
title: {
|
|
19
|
+
label: '描述',
|
|
20
|
+
tip: 'description | 卡片的描述'
|
|
21
|
+
},
|
|
22
|
+
setter: 'StringSetter'
|
|
23
|
+
}, {
|
|
24
|
+
name: 'column',
|
|
25
|
+
title: {
|
|
26
|
+
label: '一行多列',
|
|
27
|
+
tip: 'column | 表单内容分成几列展示'
|
|
28
|
+
},
|
|
29
|
+
defaultValue: 1,
|
|
30
|
+
setter: {
|
|
31
|
+
componentName: 'RadioGroupSetter',
|
|
32
|
+
props: {
|
|
33
|
+
options: [{
|
|
34
|
+
title: '一列',
|
|
35
|
+
value: 1
|
|
36
|
+
}, {
|
|
37
|
+
title: '两列',
|
|
38
|
+
value: 2
|
|
39
|
+
}, {
|
|
40
|
+
title: '三列',
|
|
41
|
+
value: 3
|
|
42
|
+
}, {
|
|
43
|
+
title: '四列',
|
|
44
|
+
value: 4
|
|
45
|
+
}]
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}, {
|
|
49
|
+
name: 'widget',
|
|
50
|
+
title: {
|
|
51
|
+
label: '类型',
|
|
52
|
+
tip: 'widget | 类型'
|
|
53
|
+
},
|
|
54
|
+
defaultValue: 1,
|
|
55
|
+
setter: {
|
|
56
|
+
componentName: 'RadioGroupSetter',
|
|
57
|
+
props: {
|
|
58
|
+
options: [{
|
|
59
|
+
title: '卡片',
|
|
60
|
+
value: 'card'
|
|
61
|
+
}, {
|
|
62
|
+
title: '折叠面板',
|
|
63
|
+
value: 'collapse'
|
|
64
|
+
}, {
|
|
65
|
+
title: '标题线',
|
|
66
|
+
value: 'lineTitle'
|
|
67
|
+
}, {
|
|
68
|
+
title: '内联',
|
|
69
|
+
value: 'subInline'
|
|
70
|
+
}]
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
}];
|
|
74
|
+
var snippets = [{
|
|
75
|
+
title: '对象',
|
|
76
|
+
screenshot: 'icon-object',
|
|
77
|
+
schema: {
|
|
78
|
+
componentName: 'Card',
|
|
79
|
+
props: {
|
|
80
|
+
title: '卡片主题',
|
|
81
|
+
description: '这是一个对象类型',
|
|
82
|
+
column: 3,
|
|
83
|
+
type: 'object',
|
|
84
|
+
widget: 'collapse'
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
}];
|
|
88
|
+
export default createMeta('Card', {
|
|
89
|
+
title: '对象',
|
|
90
|
+
category: '布局',
|
|
91
|
+
group: '基础组件',
|
|
92
|
+
priority: 1,
|
|
93
|
+
props: props,
|
|
94
|
+
snippets: snippets,
|
|
95
|
+
configure: {
|
|
96
|
+
supports: {
|
|
97
|
+
loop: false,
|
|
98
|
+
condition: false
|
|
99
|
+
},
|
|
100
|
+
component: {
|
|
101
|
+
isContainer: true,
|
|
102
|
+
isModal: false,
|
|
103
|
+
nestingRule: {
|
|
104
|
+
parentWhitelist: ['FormRender', 'Card', 'CardList']
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
});
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
import { createMeta } from '../utils';
|
|
2
|
+
var props = [{
|
|
3
|
+
name: 'title',
|
|
4
|
+
title: {
|
|
5
|
+
label: '标题',
|
|
6
|
+
tip: 'title | 卡片主题'
|
|
7
|
+
},
|
|
8
|
+
setter: 'StringSetter'
|
|
9
|
+
}, {
|
|
10
|
+
name: 'code',
|
|
11
|
+
title: {
|
|
12
|
+
label: '字段名',
|
|
13
|
+
tip: 'key | 字段名'
|
|
14
|
+
},
|
|
15
|
+
setter: 'StringSetter'
|
|
16
|
+
}, {
|
|
17
|
+
name: 'description',
|
|
18
|
+
title: {
|
|
19
|
+
label: '描述',
|
|
20
|
+
tip: 'description | 卡片的描述'
|
|
21
|
+
},
|
|
22
|
+
setter: 'StringSetter'
|
|
23
|
+
}, {
|
|
24
|
+
title: '模版配置',
|
|
25
|
+
display: 'block',
|
|
26
|
+
type: 'group',
|
|
27
|
+
items: [{
|
|
28
|
+
name: 'widget',
|
|
29
|
+
title: {
|
|
30
|
+
label: '类型',
|
|
31
|
+
tip: 'widget | 类型'
|
|
32
|
+
},
|
|
33
|
+
setter: {
|
|
34
|
+
componentName: 'SelectSetter',
|
|
35
|
+
props: {
|
|
36
|
+
options: [{
|
|
37
|
+
title: 'SimpleList',
|
|
38
|
+
value: 'simpleList'
|
|
39
|
+
}, {
|
|
40
|
+
title: 'CardList',
|
|
41
|
+
value: 'cardList'
|
|
42
|
+
}, {
|
|
43
|
+
title: 'DrawerList',
|
|
44
|
+
value: 'drawerList'
|
|
45
|
+
}, {
|
|
46
|
+
title: 'TableList',
|
|
47
|
+
value: 'tableList'
|
|
48
|
+
}, {
|
|
49
|
+
title: 'VirtualList',
|
|
50
|
+
value: 'virtualList'
|
|
51
|
+
}, {
|
|
52
|
+
title: 'TabList',
|
|
53
|
+
value: 'tabList'
|
|
54
|
+
}]
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
extraProps: {
|
|
58
|
+
setValue: function setValue(target, value) {
|
|
59
|
+
var node = target.getNode();
|
|
60
|
+
if (value !== 'cardList') {
|
|
61
|
+
node.setPropValue('items.widget', undefined);
|
|
62
|
+
node.setPropValue('items.title', undefined);
|
|
63
|
+
node.setPropValue('items.description', undefined);
|
|
64
|
+
node.setPropValue('items.column', undefined);
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
}, {
|
|
69
|
+
name: 'items.widget',
|
|
70
|
+
title: {
|
|
71
|
+
label: '样式类型',
|
|
72
|
+
tip: '样式类型'
|
|
73
|
+
},
|
|
74
|
+
setter: {
|
|
75
|
+
componentName: 'RadioGroupSetter',
|
|
76
|
+
props: {
|
|
77
|
+
options: [{
|
|
78
|
+
title: '卡片',
|
|
79
|
+
value: 'card'
|
|
80
|
+
}, {
|
|
81
|
+
title: '折叠面板',
|
|
82
|
+
value: 'collapse'
|
|
83
|
+
}, {
|
|
84
|
+
title: '标题线',
|
|
85
|
+
value: 'lineTitle'
|
|
86
|
+
}, {
|
|
87
|
+
title: '内联',
|
|
88
|
+
value: 'subInline'
|
|
89
|
+
}]
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
condition: function condition(target) {
|
|
93
|
+
return target.getProps().getPropValue('widget') === 'cardList';
|
|
94
|
+
}
|
|
95
|
+
}, {
|
|
96
|
+
name: 'items.title',
|
|
97
|
+
title: {
|
|
98
|
+
label: '标题',
|
|
99
|
+
tip: 'title | 卡片主题'
|
|
100
|
+
},
|
|
101
|
+
setter: 'StringSetter',
|
|
102
|
+
condition: function condition(target) {
|
|
103
|
+
return target.getProps().getPropValue('widget') === 'cardList';
|
|
104
|
+
}
|
|
105
|
+
}, {
|
|
106
|
+
name: 'items.description',
|
|
107
|
+
title: {
|
|
108
|
+
label: '描述',
|
|
109
|
+
tip: 'description | 卡片的描述'
|
|
110
|
+
},
|
|
111
|
+
setter: 'StringSetter',
|
|
112
|
+
condition: function condition(target) {
|
|
113
|
+
return target.getProps().getPropValue('widget') === 'cardList';
|
|
114
|
+
}
|
|
115
|
+
}, {
|
|
116
|
+
name: 'items.column',
|
|
117
|
+
title: {
|
|
118
|
+
label: '一行多列',
|
|
119
|
+
tip: 'column | 表单内容分成几列展示'
|
|
120
|
+
},
|
|
121
|
+
defaultValue: 1,
|
|
122
|
+
setter: {
|
|
123
|
+
componentName: 'RadioGroupSetter',
|
|
124
|
+
props: {
|
|
125
|
+
options: [{
|
|
126
|
+
title: '一列',
|
|
127
|
+
value: 1
|
|
128
|
+
}, {
|
|
129
|
+
title: '两列',
|
|
130
|
+
value: 2
|
|
131
|
+
}, {
|
|
132
|
+
title: '三列',
|
|
133
|
+
value: 3
|
|
134
|
+
}, {
|
|
135
|
+
title: '四列',
|
|
136
|
+
value: 4
|
|
137
|
+
}]
|
|
138
|
+
}
|
|
139
|
+
},
|
|
140
|
+
condition: function condition(target) {
|
|
141
|
+
return target.getProps().getPropValue('widget') === 'cardList';
|
|
142
|
+
},
|
|
143
|
+
extraProps: {
|
|
144
|
+
setValue: function setValue(target, value) {
|
|
145
|
+
var node = target.getNode();
|
|
146
|
+
var labelSpan = 8;
|
|
147
|
+
var wrapperColSpan = 16;
|
|
148
|
+
if (value === 1) {
|
|
149
|
+
labelSpan = 4;
|
|
150
|
+
wrapperColSpan = 6;
|
|
151
|
+
} else if (value === 2) {
|
|
152
|
+
wrapperColSpan = 10;
|
|
153
|
+
}
|
|
154
|
+
node.setPropValue('labelCol.span', labelSpan);
|
|
155
|
+
node.setPropValue('wrapperCol.span', wrapperColSpan);
|
|
156
|
+
node.mergeChildren(function (child) {
|
|
157
|
+
var span = 24 / value;
|
|
158
|
+
child.setPropValue('span', span);
|
|
159
|
+
return false;
|
|
160
|
+
}, function () {}, function () {});
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
}]
|
|
164
|
+
}];
|
|
165
|
+
var snippets = [{
|
|
166
|
+
title: '列表',
|
|
167
|
+
screenshot: 'icon-list',
|
|
168
|
+
schema: {
|
|
169
|
+
componentName: 'CardList',
|
|
170
|
+
props: {
|
|
171
|
+
title: '列表',
|
|
172
|
+
description: '这是一个列表',
|
|
173
|
+
type: 'array',
|
|
174
|
+
items: {
|
|
175
|
+
title: '卡片主题',
|
|
176
|
+
description: '这是一个对象类型',
|
|
177
|
+
column: 3,
|
|
178
|
+
type: 'object'
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
}];
|
|
183
|
+
export default createMeta('CardList', {
|
|
184
|
+
title: '列表',
|
|
185
|
+
category: '布局',
|
|
186
|
+
group: '基础组件',
|
|
187
|
+
priority: 1,
|
|
188
|
+
props: props,
|
|
189
|
+
snippets: snippets,
|
|
190
|
+
configure: {
|
|
191
|
+
supports: {
|
|
192
|
+
loop: false,
|
|
193
|
+
condition: false
|
|
194
|
+
},
|
|
195
|
+
component: {
|
|
196
|
+
isContainer: true,
|
|
197
|
+
isModal: false,
|
|
198
|
+
nestingRule: {
|
|
199
|
+
parentWhitelist: ['FormRender', 'Card']
|
|
200
|
+
}
|
|
201
|
+
}
|
|
202
|
+
}
|
|
203
|
+
});
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { createMeta, getNotInputPropsBasic } from '../utils';
|
|
2
|
+
export default createMeta('Checkbox', {
|
|
3
|
+
title: '是否选择',
|
|
4
|
+
priority: 994,
|
|
5
|
+
props: [{
|
|
6
|
+
title: '基础配置',
|
|
7
|
+
type: 'group',
|
|
8
|
+
display: 'accordion',
|
|
9
|
+
items: getNotInputPropsBasic({
|
|
10
|
+
name: 'defaultValue',
|
|
11
|
+
title: {
|
|
12
|
+
label: '默认值',
|
|
13
|
+
tip: 'defaultValue | 默认值'
|
|
14
|
+
},
|
|
15
|
+
setter: 'BoolSetter'
|
|
16
|
+
})
|
|
17
|
+
}],
|
|
18
|
+
snippets: [{
|
|
19
|
+
title: '是否选择',
|
|
20
|
+
screenshot: 'icon-isNot',
|
|
21
|
+
schema: {
|
|
22
|
+
componentName: 'Checkbox',
|
|
23
|
+
props: {
|
|
24
|
+
title: '是否选择',
|
|
25
|
+
type: 'boolean'
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
}]
|
|
29
|
+
});
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { createMeta, optionsProp, getNotInputPropsBasic } from '../utils';
|
|
2
|
+
export default createMeta('Checkboxes', {
|
|
3
|
+
title: '点击多选框',
|
|
4
|
+
// priority: 996,
|
|
5
|
+
props: [{
|
|
6
|
+
title: '基础配置',
|
|
7
|
+
type: 'group',
|
|
8
|
+
display: 'accordion',
|
|
9
|
+
items: getNotInputPropsBasic({
|
|
10
|
+
name: 'defaultValue',
|
|
11
|
+
title: {
|
|
12
|
+
label: '默认值',
|
|
13
|
+
tip: 'defaultValue | 默认值'
|
|
14
|
+
},
|
|
15
|
+
setter: 'JsonSetter'
|
|
16
|
+
})
|
|
17
|
+
}, optionsProp, {
|
|
18
|
+
title: '其他配置',
|
|
19
|
+
display: 'accordion',
|
|
20
|
+
type: 'group',
|
|
21
|
+
items: [{
|
|
22
|
+
name: 'props.direction',
|
|
23
|
+
title: {
|
|
24
|
+
label: '排列方向',
|
|
25
|
+
tip: '选项的排列方向'
|
|
26
|
+
},
|
|
27
|
+
defaultValue: 'row',
|
|
28
|
+
setter: {
|
|
29
|
+
componentName: 'RadioGroupSetter',
|
|
30
|
+
props: {
|
|
31
|
+
options: [{
|
|
32
|
+
title: '水平',
|
|
33
|
+
value: 'row'
|
|
34
|
+
}, {
|
|
35
|
+
title: '垂直',
|
|
36
|
+
value: 'column'
|
|
37
|
+
}]
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}]
|
|
41
|
+
}],
|
|
42
|
+
snippets: [{
|
|
43
|
+
title: '点击多选',
|
|
44
|
+
screenshot: 'icon-checkbox',
|
|
45
|
+
schema: {
|
|
46
|
+
componentName: 'Checkboxes',
|
|
47
|
+
props: {
|
|
48
|
+
title: '点击多选',
|
|
49
|
+
type: 'array',
|
|
50
|
+
props: {
|
|
51
|
+
options: [{
|
|
52
|
+
label: 'A',
|
|
53
|
+
value: 'A'
|
|
54
|
+
}, {
|
|
55
|
+
label: 'B',
|
|
56
|
+
value: 'B'
|
|
57
|
+
}, {
|
|
58
|
+
label: 'C',
|
|
59
|
+
value: 'C'
|
|
60
|
+
}],
|
|
61
|
+
direction: 'row'
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
}]
|
|
66
|
+
});
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { createMeta, notInputPropsBasic } from '../utils';
|
|
2
|
+
export default createMeta('Color', {
|
|
3
|
+
title: '颜色选择',
|
|
4
|
+
category: '其他',
|
|
5
|
+
props: [{
|
|
6
|
+
title: '基础配置',
|
|
7
|
+
type: 'group',
|
|
8
|
+
display: 'accordion',
|
|
9
|
+
items: notInputPropsBasic
|
|
10
|
+
}],
|
|
11
|
+
snippets: [{
|
|
12
|
+
title: '颜色选择',
|
|
13
|
+
screenshot: 'icon-color',
|
|
14
|
+
schema: {
|
|
15
|
+
componentName: 'Color',
|
|
16
|
+
props: {
|
|
17
|
+
title: '颜色选择'
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}]
|
|
21
|
+
});
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { createMeta, getInputPropsBasic } from '../utils';
|
|
2
|
+
export default createMeta('DatePicker', {
|
|
3
|
+
title: '日期选择',
|
|
4
|
+
props: [{
|
|
5
|
+
title: '基础配置',
|
|
6
|
+
type: 'group',
|
|
7
|
+
display: 'accordion',
|
|
8
|
+
items: getInputPropsBasic({
|
|
9
|
+
name: 'defaultValue',
|
|
10
|
+
title: {
|
|
11
|
+
label: '默认值',
|
|
12
|
+
tip: 'defaultValue | 默认值'
|
|
13
|
+
},
|
|
14
|
+
setter: 'CustomDateSetter'
|
|
15
|
+
})
|
|
16
|
+
}],
|
|
17
|
+
snippets: [{
|
|
18
|
+
title: '日期选择',
|
|
19
|
+
screenshot: 'icon-date',
|
|
20
|
+
schema: {
|
|
21
|
+
componentName: 'DatePicker',
|
|
22
|
+
props: {
|
|
23
|
+
title: '日期选择',
|
|
24
|
+
type: 'string'
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}]
|
|
28
|
+
});
|