amis-editor 4.1.0-beta.4 → 5.2.0-beta.1

package/lib/plugin/Form/Formula.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { BasePlugin } from 'amis-editor-core';
+export declare class FormulaControlPlugin extends BasePlugin {
+    rendererName: string;
+    $schema: string;
+    name: string;
+    isBaseComponent: boolean;
+    icon: string;
+    description: string;
+    docLink: string;
+    tags: string[];
+    scaffold: {
+        type: string;
+        name: string;
+    };
+    previewSchema: any;
+    panelTitle: string;
+    panelBody: any[];
+    renderRenderer(props: any): import("react").DetailedReactHTMLElement<{
+        key: any;
+        className: string;
+        children: import("react").DetailedReactHTMLElement<{
+            className: string;
+            children: string;
+        }, HTMLElement>;
+    }, HTMLElement>;
+}

package/lib/plugin/Form/Formula.js

@@ -0,0 +1,82 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var AMisCodeEditor = require('amis-editor-core');
+
+var FormulaControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(FormulaControlPlugin, _super);
+    function FormulaControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'formula';
+        _this.$schema = '/schemas/FormulaControlSchema.json';
+        // 组件名称
+        _this.name = '公式';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-calculator';
+        _this.description = "\u901A\u8FC7\u516C\u5F0F\u8BA1\u7B97\u6307\u5B9A\u7684\u53D8\u91CF\u503C\uFF0C\u5E76\u5C06\u5176\u7ED3\u679C\u4F5C\u7528\u5230\u6307\u5B9A\u7684\u53D8\u91CF\u4E2D";
+        _this.docLink = '/amis/zh-CN/components/form/formula';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'formula',
+            name: 'formula'
+        };
+        _this.previewSchema = {
+            type: 'tpl',
+            tpl: '计算公式'
+        };
+        _this.panelTitle = '公式';
+        _this.panelBody = [
+            {
+                label: '字段名',
+                name: 'name',
+                type: 'input-text',
+                description: '公式计算结果会作用到此字段名对应的变量中。'
+            },
+            {
+                type: 'input-text',
+                name: 'value',
+                label: '默认值'
+            },
+            {
+                type: 'input-text',
+                name: 'formula',
+                label: '公式',
+                description: '支持 JS 表达式，如： <code>data.var_a + 2</code>，即当表单项 <code>var_a</code> 变化的时候，会自动给当前表单项设置为 <code>var_a + 2</code> 的值。若设置为字符串，则需要加引号'
+            },
+            {
+                type: 'input-text',
+                name: 'condition',
+                label: '作用条件',
+                description: '支持如：<code>\\${xxx}</code>或者<code>data.xxx == "a"</code> 表达式来配置作用条件，当满足该作用条件时，会将计算结果设置到目标变量上。'
+            },
+            AMisCodeEditor.getSchemaTpl('switch', {
+                name: 'initSet',
+                label: '是否初始应用',
+                description: '是否初始化的时候运行公式结果，并设置到目标变量上。',
+                pipeIn: AMisCodeEditor.defaultValue(true)
+            }),
+            AMisCodeEditor.getSchemaTpl('switch', {
+                name: 'autoSet',
+                label: '是否自动应用',
+                description: '是否自动计算公式结果，有变化时自动设置到目标变量上。<br />关闭后，通过按钮也能触发运算。',
+                pipeIn: AMisCodeEditor.defaultValue(true)
+            })
+        ];
+        return _this;
+    }
+    FormulaControlPlugin.prototype.renderRenderer = function (props) {
+        return this.renderPlaceholder('功能组件（公式）', props.key);
+    };
+    return FormulaControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(FormulaControlPlugin);
+
+exports.FormulaControlPlugin = FormulaControlPlugin;

package/{dist → lib}/plugin/Form/Group.d.ts

@@ -1,4 +1,4 @@
-import { BasePlugin, ContextMenuEventContext, ContextMenuItem, RegionConfig } from '../../plugin';
+import { BasePlugin, ContextMenuEventContext, ContextMenuItem, RegionConfig } from 'amis-editor-core';
 export declare class GroupControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;

package/lib/plugin/Form/Group.js

@@ -0,0 +1,252 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var amis = require('amis');
+var React = require('react');
+var AMisCodeEditor = require('amis-editor-core');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var GroupControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(GroupControlPlugin, _super);
+    function GroupControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'group';
+        _this.$schema = '/schemas/GroupControlSchema.json';
+        _this.disabledRendererPlugin = true; // 组件面板不显示
+        // 组件名称
+        _this.name = '表单组';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-id-card-o';
+        _this.description = '水平展示多个表单项';
+        _this.docLink = '/amis/zh-CN/components/form/group';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'group',
+            body: [
+                {
+                    type: 'input-text',
+                    label: '文本',
+                    name: 'var1'
+                },
+                {
+                    type: 'input-text',
+                    label: '文本',
+                    name: 'var2'
+                }
+            ],
+            label: false
+        };
+        _this.previewSchema = {
+            type: 'form',
+            className: 'text-left',
+            wrapWithPanel: false,
+            mode: 'horizontal',
+            body: [
+                tslib.__assign(tslib.__assign({}, _this.scaffold), { mode: 'normal' })
+            ]
+        };
+        // 容器配置
+        _this.regions = [
+            {
+                key: 'body',
+                label: '子表单',
+                renderMethod: 'renderInput',
+                preferTag: '表单项',
+                wrapperResolve: function (dom) { return dom; }
+            }
+        ];
+        _this.panelTitle = '表单组';
+        _this.panelBody = [
+            AMisCodeEditor.getSchemaTpl('tabs', [
+                {
+                    title: '常规',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('label'),
+                        AMisCodeEditor.getSchemaTpl('description', {
+                            visible: 'this.label'
+                        }),
+                        {
+                            children: (React__default["default"].createElement(amis.Button, { className: "m-b", onClick: function () {
+                                    // this.manager.showInsertPanel('body')
+                                    _this.manager.showRendererPanel('表单项', '请从左侧组件面板中点击添加表单项');
+                                }, level: "danger", tooltip: "\u63D2\u5165\u4E00\u4E2A\u65B0\u7684\u5143\u7D20", size: "sm", block: true }, "\u65B0\u589E\u5143\u7D20"))
+                        },
+                        AMisCodeEditor.getSchemaTpl('remark'),
+                        AMisCodeEditor.getSchemaTpl('labelRemark')
+                    ]
+                },
+                {
+                    title: '外观',
+                    body: [
+                        AMisCodeEditor.getSchemaTpl('formItemMode'),
+                        AMisCodeEditor.getSchemaTpl('horizontalMode'),
+                        AMisCodeEditor.getSchemaTpl('horizontal', {
+                            visibleOn: '(data.$$formMode == "horizontal" || data.mode == "horizontal") && data.label !== false && data.horizontal',
+                            pipeIn: function (value, data) {
+                                value =
+                                    value ||
+                                        (data.formHorizontal &&
+                                            AMisCodeEditor.makeHorizontalDeeper(data.formHorizontal, data.body.length));
+                                return {
+                                    leftRate: value && typeof value.left === 'number'
+                                        ? value.left
+                                        : value &&
+                                            /\bcol\-(?:xs|sm|md|lg)\-(\d+)\b/.test(value.left)
+                                            ? parseInt(RegExp.$1, 10)
+                                            : 2,
+                                    leftFixed: (value && value.leftFixed) || ''
+                                };
+                            }
+                        }),
+                        AMisCodeEditor.getSchemaTpl('subFormItemMode'),
+                        AMisCodeEditor.getSchemaTpl('subFormHorizontalMode'),
+                        AMisCodeEditor.getSchemaTpl('subFormHorizontal'),
+                        {
+                            name: 'body',
+                            type: 'combo',
+                            label: '列宽度配置',
+                            multiple: true,
+                            removable: false,
+                            addable: false,
+                            multiLine: true,
+                            visibleOn: 'data.$$formMode != "inline"',
+                            items: [
+                                {
+                                    type: 'button-group-select',
+                                    name: 'columnRatio',
+                                    label: '宽度设置',
+                                    tiled: true,
+                                    pipeIn: function (value, data) {
+                                        if (typeof value === 'number') {
+                                            return 'custom';
+                                        }
+                                        else if (data.columnClassName &&
+                                            /\bcol\-(?:xs|sm|md|lg)\-(\d+)\b/.test(data.columnClassName)) {
+                                            return 'custom';
+                                        }
+                                        return value || '';
+                                    },
+                                    pipeOut: function (value) { return (value === 'custom' ? 2 : value); },
+                                    options: [
+                                        {
+                                            value: '',
+                                            label: '适配宽度'
+                                        },
+                                        {
+                                            value: 'auto',
+                                            label: '适配内容'
+                                        },
+                                        {
+                                            value: 'custom',
+                                            label: '自定义'
+                                        }
+                                    ]
+                                },
+                                {
+                                    label: '宽度占比',
+                                    type: 'input-range',
+                                    name: 'columnRatio',
+                                    visibleOn: 'typeof this.columnRatio === "number" || this.columnClassName && /\\bcol\\-(?:xs|sm|md|lg)\\-(\\d+)\\b/.test(this.columnClassName)',
+                                    pipeIn: function (value, data) {
+                                        if (typeof value === 'number') {
+                                            return value;
+                                        }
+                                        if (!data.columnClassName ||
+                                            !/\bcol\-(?:xs|sm|md|lg)\-(\d+)\b/.test(data.columnClassName)) {
+                                            return 2;
+                                        }
+                                        return parseInt(RegExp.$1, 10) || 2;
+                                    },
+                                    min: 1,
+                                    max: 12,
+                                    step: 1
+                                }
+                            ]
+                        },
+                        {
+                            type: 'button-group-select',
+                            name: 'gap',
+                            label: '间隔大小',
+                            pipeIn: AMisCodeEditor.defaultValue(''),
+                            size: 'sm',
+                            tiled: true,
+                            clearable: true,
+                            options: [
+                                {
+                                    value: 'xs',
+                                    label: '极小'
+                                },
+                                {
+                                    value: 'sm',
+                                    label: '小'
+                                },
+                                {
+                                    value: 'md',
+                                    label: '中'
+                                },
+                                {
+                                    value: 'lg',
+                                    label: '大'
+                                }
+                            ]
+                        },
+                        AMisCodeEditor.getSchemaTpl('className'),
+                        {
+                            name: 'body',
+                            type: 'combo',
+                            label: '列 CSS 类名配置',
+                            multiple: true,
+                            removable: false,
+                            addable: false,
+                            items: [
+                                {
+                                    type: 'input-text',
+                                    name: 'columnClassName'
+                                }
+                            ]
+                        }
+                    ]
+                },
+                {
+                    title: '显隐',
+                    body: [AMisCodeEditor.getSchemaTpl('ref'), AMisCodeEditor.getSchemaTpl('visible')]
+                }
+            ])
+        ];
+        return _this;
+    }
+    GroupControlPlugin.prototype.buildEditorContextMenu = function (_a, menus) {
+        var _this = this;
+        var id = _a.id, schema = _a.schema; _a.region; var selections = _a.selections, info = _a.info;
+        if (selections.length ||
+            info.plugin !== this ||
+            !Array.isArray(schema.body) ||
+            schema.body.length < 2) {
+            return;
+        }
+        menus.push({
+            label: '变成多行',
+            onSelect: function () {
+                var store = _this.manager.store;
+                var rootSchema = store.schema;
+                rootSchema = AMisCodeEditor.JSONUpdate(rootSchema, id, AMisCodeEditor.JSONPipeIn(schema.body), true);
+                store.traceableSetSchema(rootSchema);
+            }
+        });
+    };
+    return GroupControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(GroupControlPlugin);
+
+exports.GroupControlPlugin = GroupControlPlugin;

package/{dist → lib}/plugin/Form/Hidden.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BasePlugin } from '../../plugin';
+import { BasePlugin } from 'amis-editor-core';
 export declare class HiddenControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;

package/lib/plugin/Form/Hidden.js

@@ -0,0 +1,58 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var AMisCodeEditor = require('amis-editor-core');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var HiddenControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(HiddenControlPlugin, _super);
+    function HiddenControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'hidden';
+        _this.$schema = '/schemas/HiddenControlSchema.json';
+        // 组件名称
+        _this.name = '隐藏域';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-eye-slash';
+        _this.description = "\u9690\u85CF\u8868\u5355\u9879";
+        _this.docLink = '/amis/zh-CN/components/form/hidden';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'hidden',
+            name: 'var1'
+        };
+        _this.previewSchema = {
+            type: 'tpl',
+            tpl: '隐藏域'
+        };
+        _this.panelTitle = '隐藏域';
+        _this.panelBody = [
+            {
+                type: 'input-text',
+                name: 'value',
+                label: '默认值'
+            }
+        ];
+        return _this;
+    }
+    HiddenControlPlugin.prototype.renderRenderer = function (props) {
+        return (React__default["default"].createElement("div", { key: props.key, className: "wrapper-sm b-a b-light m-b-sm" },
+            React__default["default"].createElement("span", { className: "text-muted" }, "\u529F\u80FD\u7EC4\u4EF6\uFF08\u9690\u85CF\u5B57\u6BB5\uFF09")));
+    };
+    return HiddenControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(HiddenControlPlugin);
+
+exports.HiddenControlPlugin = HiddenControlPlugin;

package/{dist → lib}/plugin/Form/InputArray.d.ts

@@ -1,4 +1,4 @@
-import { BaseEventContext, BasePlugin, BasicToolbarItem, ContextMenuEventContext, ContextMenuItem } from '../../plugin';
+import { BaseEventContext, BasePlugin, BasicToolbarItem, ContextMenuEventContext, ContextMenuItem } from 'amis-editor-core';
 export declare class ArrayControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;

package/lib/plugin/Form/InputArray.js

@@ -0,0 +1,181 @@
+/**
+ * amis-editor v5.2.0-beta.1
+ * Copyright 2018-2022 @fex
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var amis = require('amis');
+var AMisCodeEditor = require('amis-editor-core');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ArrayControlPlugin = /** @class */ (function (_super) {
+    tslib.__extends(ArrayControlPlugin, _super);
+    function ArrayControlPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        // 关联渲染器名字
+        _this.rendererName = 'input-array';
+        _this.$schema = '/schemas/ArrayControlSchema.json';
+        _this.disabledRendererPlugin = true;
+        // 组件名称
+        _this.name = '数组输入框';
+        _this.isBaseComponent = true;
+        _this.icon = 'fa fa-bars';
+        _this.description = 'Array 数组输入框，可自定义成员输入形式。其实是 Combo 的 flat 值打平的一种用法，可直接用 combo 代替。';
+        _this.docLink = '/amis/zh-CN/components/form/input-array';
+        _this.tags = ['表单项'];
+        _this.scaffold = {
+            type: 'input-array',
+            label: '数组输入框',
+            name: 'array',
+            items: {
+                type: 'input-text',
+                placeholder: '请输入'
+            }
+        };
+        _this.previewSchema = {
+            type: 'form',
+            className: 'text-left',
+            wrapWithPanel: false,
+            mode: 'horizontal',
+            body: [
+                tslib.__assign(tslib.__assign({}, _this.scaffold), { value: ['row1', ''], draggable: true })
+            ]
+        };
+        _this.panelTitle = '数组框';
+        _this.panelBodyCreator = function (context) {
+            return [
+                AMisCodeEditor.getSchemaTpl('switchDefaultValue'),
+                {
+                    type: 'textarea',
+                    name: 'value',
+                    label: '默认值',
+                    visibleOn: 'typeof this.value !== "undefined"',
+                    pipeOut: AMisCodeEditor.valuePipeOut
+                },
+                {
+                    children: (React__default["default"].createElement(amis.Button, { size: "sm", level: "danger", className: "m-b", block: true, onClick: _this.editDetail.bind(_this, context.id) }, "\u914D\u7F6E\u5B50\u8868\u5355\u9879"))
+                },
+                AMisCodeEditor.getSchemaTpl('switch', {
+                    label: '是否可新增',
+                    name: 'addable',
+                    pipeIn: AMisCodeEditor.defaultValue(true)
+                }),
+                {
+                    label: '新增按钮文字',
+                    name: 'addButtonText',
+                    type: 'input-text',
+                    visibleOn: 'data.addable',
+                    pipeIn: AMisCodeEditor.defaultValue('新增')
+                },
+                {
+                    type: 'textarea',
+                    name: 'scaffold',
+                    label: '新增初始值',
+                    visibleOn: 'this.addable !== false',
+                    pipeOut: AMisCodeEditor.valuePipeOut,
+                    pipeIn: AMisCodeEditor.defaultValue('')
+                },
+                AMisCodeEditor.getSchemaTpl('switch', {
+                    label: '是否可删除',
+                    name: 'removable',
+                    pipeIn: AMisCodeEditor.defaultValue(true)
+                }),
+                AMisCodeEditor.getSchemaTpl('api', {
+                    name: 'deleteApi',
+                    label: '删除前的请求',
+                    visibleOn: 'data.removable'
+                }),
+                {
+                    label: '删除确认提示',
+                    name: 'deleteConfirmText',
+                    type: 'input-text',
+                    visibleOn: 'data.deleteApi',
+                    pipeIn: AMisCodeEditor.defaultValue('确认要删除')
+                },
+                AMisCodeEditor.getSchemaTpl('switch', {
+                    name: 'draggable',
+                    label: '启用拖拽排序'
+                }),
+                {
+                    name: 'draggableTip',
+                    visibleOn: 'data.draggable',
+                    type: 'input-text',
+                    label: '可拖拽排序提示文字',
+                    pipeIn: AMisCodeEditor.defaultValue('可通过拖动每行中的【交换】按钮进行顺序调整')
+                },
+                {
+                    name: 'addButtonText',
+                    type: 'input-text',
+                    label: '新增按钮文字',
+                    pipeIn: AMisCodeEditor.defaultValue('新增')
+                },
+                AMisCodeEditor.getSchemaTpl('minLength'),
+                AMisCodeEditor.getSchemaTpl('maxLength')
+            ];
+        };
+        return _this;
+    }
+    ArrayControlPlugin.prototype.filterProps = function (props) {
+        props = AMisCodeEditor.JSONPipeOut(props);
+        // 至少显示一个成员，否则啥都不显示。
+        if (!props.value) {
+            props.value = [''];
+        }
+        return props;
+    };
+    ArrayControlPlugin.prototype.buildEditorToolbar = function (_a, toolbars) {
+        var id = _a.id, info = _a.info;
+        if (info.renderer.name === 'input-array') {
+            toolbars.push({
+                icon: 'fa fa-expand',
+                order: 100,
+                tooltip: '配置子表单项',
+                onClick: this.editDetail.bind(this, id)
+            });
+        }
+    };
+    ArrayControlPlugin.prototype.buildEditorContextMenu = function (_a, menus) {
+        var id = _a.id; _a.schema; _a.region; var info = _a.info;
+        if (info.renderer.name === 'input-array') {
+            menus.push('|', {
+                label: '配置成员渲染器',
+                onSelect: this.editDetail.bind(this, id)
+            });
+        }
+    };
+    ArrayControlPlugin.prototype.editDetail = function (id) {
+        var manager = this.manager;
+        var store = manager.store;
+        var node = store.getNodeById(id);
+        var value = store.getValueOf(id);
+        node &&
+            value &&
+            this.manager.openSubEditor({
+                title: '配置子表单项',
+                value: value.items,
+                slot: {
+                    type: 'form',
+                    mode: 'normal',
+                    body: '$$',
+                    wrapWithPanel: false,
+                    className: 'wrapper'
+                },
+                onChange: function (newValue) {
+                    newValue = tslib.__assign(tslib.__assign({}, value), { items: newValue });
+                    manager.panelChangeValue(newValue, AMisCodeEditor.diff(value, newValue));
+                }
+            });
+    };
+    return ArrayControlPlugin;
+}(AMisCodeEditor.BasePlugin));
+AMisCodeEditor.registerEditorPlugin(ArrayControlPlugin);
+
+exports.ArrayControlPlugin = ArrayControlPlugin;

package/{dist → lib}/plugin/Form/InputCity.d.ts

@@ -1,4 +1,5 @@
-import { BasePlugin } from '../../plugin';
+import { BasePlugin, BaseEventContext } from 'amis-editor-core';
+import { RendererAction, RendererEvent } from 'amis-editor-comp/dist/renderers/event-action';
 export declare class CityControlPlugin extends BasePlugin {
     rendererName: string;
     $schema: string;
@@ -14,6 +15,9 @@ export declare class CityControlPlugin extends BasePlugin {
         name: string;
     };
     previewSchema: any;
+    notRenderFormZone: boolean;
     panelTitle: string;
-    panelBody: any[];
+    events: RendererEvent[];
+    actions: RendererAction[];
+    panelBodyCreator: (context: BaseEventContext) => any[];
 }