amis-editor 4.1.0-beta.28 → 5.2.0-beta.0

package/src/plugin/Others/DataDebug.tsx

@@ -1,134 +0,0 @@
-import {registerEditorPlugin} from '../../manager';
-import {BaseEventContext, BasePlugin, BasicToolbarItem} from '../../plugin';
-import React from 'react';
-import JsonView, {InteractionProps} from 'react-json-view';
-
-/**
- * 添加调试功能
- */
-export class DataDebugPlugin extends BasePlugin {
-  buildEditorToolbar(
-    {id, schema, node}: BaseEventContext,
-    toolbars: Array<BasicToolbarItem>
-  ) {
-    const comp = node.getComponent();
-    if (!comp || !comp.props.data || !comp.props.store) {
-      return;
-    }
-
-    // const renderers = getRenderers();
-    // const renderInfo = find(
-    //   renderers,
-    //   renderer => renderer.Renderer && comp instanceof renderer.Renderer
-    // ) as RendererConfig;
-
-    // if (!renderInfo || !renderInfo.storeType) {
-    //   return;
-    // }
-    const store = comp.props.store;
-
-    toolbars.push({
-      icon: 'fa fa-bug',
-      order: -1000,
-      placement: 'bottom',
-      tooltip: '上下文数据',
-      onClick: () =>
-        this.openDebugForm(
-          comp.props.data,
-          store.updateData && store.data === comp.props.data
-            ? values => store.updateData(values)
-            : undefined
-        )
-    });
-  }
-
-  dataViewer = {
-    type: 'json',
-    name: 'ctx',
-    asFormItem: true,
-    className: 'm-b-none',
-    component: ({
-      value,
-      onChange,
-      readOnly
-    }: {
-      value: any;
-      onChange: (value: any) => void;
-      readOnly?: boolean;
-    }) => {
-      const [index, setIndex] = React.useState(0);
-      let start = value || {};
-      const stacks = [start];
-
-      while (Object.getPrototypeOf(start) !== Object.prototype) {
-        const superData = Object.getPrototypeOf(start);
-
-        if (Object.prototype.toString.call(superData) !== '[object Object]') {
-          break;
-        }
-
-        stacks.push(superData);
-        start = superData;
-      }
-
-      function emitChange(e: InteractionProps) {
-        const obj = Object.create(stacks[1] || Object.prototype);
-        Object.keys(e.updated_src).forEach(
-          key => (obj[key] = (e.updated_src as any)[key])
-        );
-        onChange(obj);
-      }
-
-      return (
-        <div className="aeDataChain">
-          <div className="aeDataChain-aside">
-            <ul>
-              {stacks.map((_, i) => (
-                <li
-                  className={i === index ? 'is-active' : ''}
-                  key={i}
-                  onClick={() => setIndex(i)}
-                >
-                  {i === 0 ? '当前' : i === 1 ? '上层' : `上${i}层`}
-                </li>
-              ))}
-            </ul>
-          </div>
-          <div className="aeDataChain-main">
-            <JsonView
-              name={false}
-              src={stacks[index]}
-              enableClipboard={false}
-              iconStyle="square"
-              onAdd={index === 0 && !readOnly ? emitChange : false}
-              onEdit={index === 0 && !readOnly ? emitChange : false}
-              onDelete={index === 0 && !readOnly ? emitChange : false}
-              collapsed={2}
-            />
-          </div>
-        </div>
-      );
-    }
-  };
-
-  async openDebugForm(data: any, callback?: (values: any) => void) {
-    const result = await this.manager.scaffold(
-      {
-        title: '上下文数据',
-        body: [
-          {
-            ...this.dataViewer,
-            readOnly: callback ? false : true
-          }
-        ]
-      },
-      {
-        ctx: data
-      }
-    );
-
-    callback?.((result as any).ctx);
-  }
-}
-
-registerEditorPlugin(DataDebugPlugin);

package/src/plugin/Others/TableCell.tsx

@@ -1,480 +0,0 @@
-import {Button} from 'amis';
-import React from 'react';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  BasicRendererInfo,
-  BaseEventContext,
-  RendererInfoResolveEventContext,
-  ReplaceEventContext,
-  PluginEvent
-} from '../../plugin';
-import {defaultValue, getSchemaTpl} from '../../component/schemaTpl';
-import {getVariable} from 'amis/lib/utils/helper';
-
-export class TableCellPlugin extends BasePlugin {
-  panelTitle = '列配置';
-  panelIcon = 'fa fa-columns';
-  panelBodyCreator = (context: BaseEventContext) => {
-    return [
-      getSchemaTpl('tabs', [
-        {
-          title: '常规',
-          body: [
-            /*{
-              children: (
-                <Button
-                  size="sm"
-                  level="info"
-                  className="m-b"
-                  block
-                  onClick={this.exchangeRenderer.bind(this, context.id)}
-                >
-                  更改渲染器类型
-                </Button>
-              )
-            },*/
-            {
-              name: 'label',
-              label: '列名称',
-              type: 'input-text'
-            },
-
-            {
-              name: 'name',
-              type: 'input-text',
-              label: '绑定字段名'
-            },
-
-            {
-              name: 'remark',
-              label: '提示',
-              type: 'input-text',
-              description: '显示一个提示图标，鼠标放上去会提示该内容。'
-            },
-
-            {
-              name: 'placeholder',
-              type: 'input-text',
-              label: '占位符',
-              value: '-',
-              description: '当没有值时用这个来替代展示'
-            },
-
-            {
-              name: 'sortable',
-              type: 'switch',
-              label: '是否可排序',
-              mode: 'inline',
-              className: 'w-full',
-              description: '开启后可以根据当前列排序(后端排序)。'
-            }
-          ]
-        },
-        {
-          title: '高级',
-          body: [
-            {
-              name: 'groupName',
-              label: '列分组名称',
-              type: 'input-text',
-              description:
-                '当多列的分组名称设置一致时，表格会在显示表头的上层显示超级表头，<a href="https://baidu.github.io/amis/crud/header-group" target="_blank">示例</a>'
-            },
-            {
-              name: 'quickEdit',
-              label: '启用快速编辑',
-              type: 'switch',
-              pipeIn: (value: any) => !!value,
-              mode: 'inline',
-              className: 'w-full'
-            },
-
-            {
-              visibleOn: 'data.quickEdit',
-              name: 'quickEdit.mode',
-              type: 'button-group-select',
-              value: 'popOver',
-              label: '快速编辑模式',
-              size: 'xs',
-              mode: 'inline',
-              className: 'w-full',
-              options: [
-                {
-                  label: '下拉',
-                  value: 'popOver'
-                },
-                {
-                  label: '内嵌',
-                  value: 'inline'
-                }
-              ]
-            },
-
-            {
-              visibleOn: 'data.quickEdit',
-              name: 'quickEdit.saveImmediately',
-              label: '是否立即保存',
-              type: 'switch',
-              mode: 'inline',
-              className: 'w-full',
-              description: '开启后修改即提交，而不是标记修改批量提交。',
-              descriptionClassName: 'help-block m-b-none',
-              pipeIn: (value: any) => !!value
-            },
-
-            getSchemaTpl('api', {
-              label: '立即保存接口',
-              description:
-                '是否单独给立即保存配置接口，如果不配置，则默认使用quickSaveItemApi。',
-              name: 'quickEdit.saveImmediately.api',
-              visibleOn: 'this.quickEdit && this.quickEdit.saveImmediately'
-            }),
-
-            {
-              visibleOn: 'data.quickEdit',
-              name: 'quickEdit',
-              asFormItem: true,
-              children: ({value, onChange, data}: any) => {
-                if (value === true) {
-                  value = {};
-                } else if (typeof value === 'undefined') {
-                  value = getVariable(data, 'quickEdit');
-                }
-
-                const originMode = value.mode;
-
-                value = {
-                  type: 'input-text',
-                  name: data.name,
-                  ...value
-                };
-                delete value.mode;
-
-                // todo 多个快速编辑表单模式看来只能代码模式编辑了。
-
-                return (
-                  <Button
-                    level="info"
-                    className="m-b"
-                    size="sm"
-                    block
-                    onClick={() => {
-                      this.manager.openSubEditor({
-                        title: '配置快速编辑类型',
-                        value: value,
-                        slot: {
-                          type: 'form',
-                          mode: 'normal',
-                          body: ['$$'],
-                          wrapWithPanel: false
-                        },
-                        onChange: value =>
-                          onChange(
-                            {
-                              ...value,
-                              mode: originMode
-                            },
-                            'quickEdit'
-                          )
-                      });
-                    }}
-                  >
-                    配置快速编辑
-                  </Button>
-                );
-              }
-            },
-
-            {
-              name: 'popOver',
-              label: '启用查看更多展示',
-              type: 'switch',
-              pipeIn: (value: any) => !!value,
-              mode: 'inline',
-              className: 'w-full'
-            },
-
-            {
-              name: 'popOver.mode',
-              label: '查看更多弹出模式',
-              type: 'select',
-              visibleOn: 'data.popOver',
-              pipeIn: defaultValue('popOver'),
-              options: [
-                {
-                  label: '默认',
-                  value: 'popOver'
-                },
-
-                {
-                  label: '弹框',
-                  value: 'dialog'
-                },
-
-                {
-                  label: '抽出式弹框',
-                  value: 'drawer'
-                }
-              ]
-            },
-
-            {
-              name: 'popOver.position',
-              label: '查看更多弹出模式',
-              type: 'select',
-              visibleOn: 'data.popOver && data.popOver.mode === "popOver"',
-              pipeIn: defaultValue('center'),
-              options: [
-                {
-                  label: '目标中部',
-                  value: 'center'
-                },
-
-                {
-                  label: '目标左上角',
-                  value: 'left-top'
-                },
-
-                {
-                  label: '目标右上角',
-                  value: 'right-top'
-                },
-
-                {
-                  label: '目标左下角',
-                  value: 'left-bottom'
-                },
-
-                {
-                  label: '目标右下角',
-                  value: 'right-bottom'
-                },
-
-                {
-                  label: '页面左上角',
-                  value: 'fixed-left-top'
-                },
-
-                {
-                  label: '页面右上角',
-                  value: 'fixed-right-top'
-                },
-
-                {
-                  label: '页面左下角',
-                  value: 'fixed-left-bottom'
-                },
-
-                {
-                  label: '页面右下角',
-                  value: 'fixed-right-bottom'
-                }
-              ]
-            },
-
-            {
-              visibleOn: 'data.popOver',
-              name: 'popOver',
-              asFormItem: true,
-              children: ({value, onChange}: any) => {
-                value = {
-                  type: 'panel',
-                  title: '查看详情',
-                  body: '内容详情',
-                  ...value
-                };
-
-                return (
-                  <Button
-                    level="info"
-                    className="m-b"
-                    size="sm"
-                    block
-                    onClick={() => {
-                      this.manager.openSubEditor({
-                        title: '配置查看更多展示内容',
-                        value: value,
-                        onChange: value => onChange(value, 'popOver')
-                      });
-                    }}
-                  >
-                    查看更多内容配置
-                  </Button>
-                );
-              }
-            },
-
-            {
-              name: 'copyable',
-              label: '启用内容复制功能',
-              type: 'switch',
-              pipeIn: (value: any) => !!value,
-              mode: 'inline',
-              className: 'w-full'
-            },
-
-            {
-              visibleOn: 'data.copyable',
-              name: 'copyable.content',
-              type: 'textarea',
-              label: '复制内容模板',
-              description: '默认为当前字段值，可定制。'
-            }
-          ]
-        },
-        {
-          title: '外观',
-          body: [
-            {
-              name: 'fixed',
-              type: 'button-group-select',
-              label: '固定位置',
-              pipeIn: defaultValue(''),
-              size: 'xs',
-              mode: 'inline',
-              className: 'w-full',
-              options: [
-                {
-                  value: '',
-                  label: '不固定'
-                },
-
-                {
-                  value: 'left',
-                  label: '左侧'
-                },
-
-                {
-                  value: 'right',
-                  label: '右侧'
-                }
-              ]
-            },
-
-            {
-              name: 'toggled',
-              type: 'switch',
-              label: '默认展示',
-              mode: 'inline',
-              className: 'w-full',
-              pipeIn: defaultValue(true)
-            },
-
-            {
-              name: 'breakpoint',
-              type: 'button-group-select',
-              label: '触发底部显示条件',
-              visibleOn: 'data.tableFootableEnabled',
-              size: 'xs',
-              multiple: true,
-              options: [
-                {
-                  label: '总是',
-                  value: '*'
-                },
-                {
-                  label: '手机端',
-                  value: 'xs'
-                },
-                {
-                  label: '平板',
-                  value: 'sm'
-                },
-                {
-                  label: 'PC小屏',
-                  value: 'md'
-                },
-                {
-                  label: 'PC大屏',
-                  value: 'lg'
-                }
-              ],
-              pipeIn: (value: any) =>
-                value ? (typeof value === 'string' ? value : '*') : '',
-              pipeOut: (value: any) =>
-                typeof value === 'string' &&
-                ~value.indexOf('*') &&
-                /xs|sm|md|lg/.test(value)
-                  ? value.replace(/\*\s*,\s*|\s*,\s*\*/g, '')
-                  : value
-            },
-
-            {
-              type: 'switch',
-              name: 'className',
-              label: '内容强制换行',
-              mode: 'inline',
-              className: 'w-full',
-              pipeIn: (value: any) =>
-                typeof value === 'string' && /\word\-break\b/.test(value),
-              pipeOut: (value: any, originValue: any) =>
-                (value ? 'word-break ' : '') +
-                (originValue || '').replace(/\bword\-break\b/g, '').trim()
-            },
-
-            getSchemaTpl('className'),
-            getSchemaTpl('className', {
-              name: 'innerClassName',
-              label: '内部 CSS 类名'
-            }),
-
-            {
-              name: 'width',
-              type: 'input-number',
-              label: '列宽',
-              description: '固定列的宽度，不推荐设置。'
-            }
-          ]
-        }
-      ])
-    ];
-  };
-
-  // filterProps(props: any) {
-  //   props = JSONPipeOut(props, true);
-  //   return props;
-  // }
-
-  getRendererInfo({
-    renderer,
-    schema
-  }: RendererInfoResolveEventContext): BasicRendererInfo | void {
-    if (renderer.name === 'table-cell') {
-      return {
-        name: schema.label ? `<${schema.label}>列` : '匿名列',
-        $schema: '/schemas/TableColumn.json',
-        multifactor: true,
-        wrapperResolve: (dom: HTMLTableCellElement) => {
-          const siblings = [].slice.call(dom.parentElement!.children);
-          const index = siblings.indexOf(dom) + 1;
-          const table = dom.closest('table')!;
-
-          return [].slice.call(
-            table.querySelectorAll(
-              `th:nth-child(${index}):not([data-editor-id="${schema.id}"]),
-              td:nth-child(${index}):not([data-editor-id="${schema.id}"])`
-            )
-          );
-        }
-        // filterProps: this.filterProps
-      };
-    }
-  }
-
-  /*exchangeRenderer(id: string) {
-    this.manager.showReplacePanel(id, '展示');
-  }*/
-
-  beforeReplace(event: PluginEvent<ReplaceEventContext>) {
-    const context = event.context;
-
-    // 替换字段的时候保留 label 和 name 值。
-    if (context.info.plugin === this && context.data) {
-      context.data.label = context.data.label || context.schema.label;
-      context.data.name = context.data.name || context.schema.name;
-    }
-  }
-}
-
-registerEditorPlugin(TableCellPlugin);

package/src/plugin/Others/Unknown.tsx

@@ -1,37 +0,0 @@
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  BasicRendererInfo,
-  PluginInterface,
-  RendererInfoResolveEventContext
-} from '../../plugin';
-
-export class UnkownRendererPlugin extends BasePlugin {
-  order = 9999;
-
-  getRendererInfo({
-    renderer,
-    schema,
-    path
-  }: RendererInfoResolveEventContext): BasicRendererInfo | void {
-    if (schema.$$id && renderer) {
-      // 有些就是不想做编辑器
-      if (/(^|\/)static\-field/.test(path)) {
-        return;
-      } else if (
-        renderer.name === 'card-item' ||
-        renderer.name === 'list-item-field'
-      ) {
-        return;
-      }
-
-      // 复制部分信息出去
-      return {
-        name: 'Unkown',
-        $schema: '/schemas/UnkownSchema.json'
-      };
-    }
-  }
-}
-
-registerEditorPlugin(UnkownRendererPlugin);