From 222f3b210832b5d4680724ebd513c1fd6d2e6bbf Mon Sep 17 00:00:00 2001
From: yehuozhili <yehuozhili@outlook.com>
Date: Thu, 17 Sep 2020 11:20:27 +0800
Subject: [PATCH] fix form

---
 package.json                                  |   4 +-
 .../BasicComponents/Carousel/index.tsx        |   1 -
 .../BasicComponents/Carousel/template.ts      |   5 +
 .../BasicComponents/Footer/schema.ts          |  57 ++
 .../BasicComponents/Footer/template.ts        |   5 +
 .../Form/{BaseForm.js => BaseForm.tsx}        |   9 +-
 .../Form/{index.js => index.tsx}              |  23 +-
 .../BasicShop/BasicComponents/Form/schema.ts  |  78 ++
 .../BasicComponents/Form/template.ts          |   5 +
 .../BasicComponents/Header/schema.ts          |  53 ++
 .../BasicComponents/Header/template.ts        |   5 +
 .../BasicShop/BasicComponents/Icon/index.tsx  |   2 +-
 .../BasicShop/BasicComponents/Icon/schema.ts  |  76 ++
 .../BasicComponents/Icon/template.ts          |   5 +
 .../BasicShop/BasicComponents/Image/schema.ts |  28 +
 .../BasicComponents/Image/template.ts         |   5 +
 .../BasicShop/BasicComponents/List/schema.ts  |  89 ++
 .../BasicComponents/List/template.ts          |   5 +
 .../BasicComponents/LongText/schema.ts        |  60 ++
 .../BasicComponents/LongText/template.ts      |   5 +
 .../BasicComponents/Notice/schema.ts          |  55 ++
 .../BasicComponents/Notice/template.ts        |   5 +
 .../BasicComponents/Qrcode/schema.ts          |  41 +
 .../BasicComponents/Qrcode/template.ts        |   5 +
 .../BasicShop/BasicComponents/Tab/schema.ts   |  90 ++
 .../BasicShop/BasicComponents/Tab/template.ts |   5 +
 .../BasicShop/BasicComponents/Text/schema.ts  |  51 ++
 .../BasicComponents/Text/template.ts          |   5 +
 .../BasicShop/BasicComponents/schema.ts       |  28 +
 .../BasicShop/BasicComponents/template.ts     |  32 +
 .../BasicShop/MediaComponents/Video/schema.ts |  27 +
 .../MediaComponents/Video/template.ts         |   5 +
 .../BasicShop/MediaComponents/schema.ts       |   6 +
 .../BasicShop/MediaComponents/template.ts     |   9 +
 .../VisualComponents/Chart/schema.ts          |  51 ++
 .../VisualComponents/Chart/template.ts        |   5 +
 .../VisualComponents/XProgress/schema.ts      |  67 ++
 .../VisualComponents/XProgress/template.ts    |   5 +
 .../BasicShop/VisualComponents/schema.ts      |   8 +
 .../BasicShop/VisualComponents/template.ts    |   9 +
 src/components/BasicShop/schema.ts            |  11 +
 src/components/Calibration/index.tsx          |  79 +-
 src/components/DynamicEngine/components.less  |  43 -
 src/components/DynamicEngine/components.tsx   | 160 ----
 src/components/DynamicEngine/graphTpl.ts      |  17 -
 src/components/DynamicEngine/index.tsx        |   9 +-
 src/components/DynamicEngine/mediaTpl.ts      |  13 -
 src/components/DynamicEngine/schema.ts        | 821 +-----------------
 src/components/DynamicEngine/template.ts      |  65 --
 src/components/ErrorBundaries/index.tsx       |  12 +-
 .../PanelComponents/FormEditor/index.tsx      |   7 +-
 .../PanelComponents/FormEditor/types.ts       |  14 +
 .../FormItems/EditorModal.tsx}                |   0
 .../FormItems/FormItems.tsx}                  |   3 +-
 .../FormItems}/formItems.less                 |   0
 .../PanelComponents/FormItems/index.tsx       |   2 +
 .../PanelComponents/Table/index.tsx           |   5 +-
 .../PanelComponents/Upload/index.tsx          |   4 +-
 src/components/Zan/index.tsx                  |   3 +-
 src/pages/editor/Container.js                 |  33 +-
 src/pages/editor/SourceBox.js                 |   1 -
 src/pages/editor/TargetBox.js                 |   4 +-
 src/pages/editor/index.less                   |  40 +-
 yarn.lock                                     | 177 +++-
 64 files changed, 1295 insertions(+), 1257 deletions(-)
 create mode 100644 src/components/BasicShop/BasicComponents/Carousel/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Footer/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Footer/template.ts
 rename src/components/BasicShop/BasicComponents/Form/{BaseForm.js => BaseForm.tsx} (91%)
 rename src/components/BasicShop/BasicComponents/Form/{index.js => index.tsx} (84%)
 create mode 100644 src/components/BasicShop/BasicComponents/Form/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Form/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Header/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Header/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Icon/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Image/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Image/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/List/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/List/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/LongText/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/LongText/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Notice/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Notice/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Qrcode/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Qrcode/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Tab/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Tab/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Text/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/Text/template.ts
 create mode 100644 src/components/BasicShop/BasicComponents/schema.ts
 create mode 100644 src/components/BasicShop/BasicComponents/template.ts
 create mode 100644 src/components/BasicShop/MediaComponents/Video/schema.ts
 create mode 100644 src/components/BasicShop/MediaComponents/Video/template.ts
 create mode 100644 src/components/BasicShop/MediaComponents/schema.ts
 create mode 100644 src/components/BasicShop/MediaComponents/template.ts
 create mode 100644 src/components/BasicShop/VisualComponents/Chart/schema.ts
 create mode 100644 src/components/BasicShop/VisualComponents/Chart/template.ts
 create mode 100644 src/components/BasicShop/VisualComponents/XProgress/schema.ts
 create mode 100644 src/components/BasicShop/VisualComponents/XProgress/template.ts
 create mode 100644 src/components/BasicShop/VisualComponents/schema.ts
 create mode 100644 src/components/BasicShop/VisualComponents/template.ts
 create mode 100644 src/components/BasicShop/schema.ts
 delete mode 100644 src/components/DynamicEngine/components.less
 delete mode 100644 src/components/DynamicEngine/components.tsx
 delete mode 100644 src/components/DynamicEngine/graphTpl.ts
 delete mode 100644 src/components/DynamicEngine/mediaTpl.ts
 delete mode 100644 src/components/DynamicEngine/template.ts
 create mode 100644 src/components/PanelComponents/FormEditor/types.ts
 rename src/components/{BasicShop/BasicComponents/Form/EditorModal.js => PanelComponents/FormItems/EditorModal.tsx} (100%)
 rename src/components/{BasicShop/BasicComponents/Form/FormItems.js => PanelComponents/FormItems/FormItems.tsx} (97%)
 rename src/components/{BasicShop/BasicComponents/Form => PanelComponents/FormItems}/formItems.less (100%)
 create mode 100644 src/components/PanelComponents/FormItems/index.tsx

diff --git a/package.json b/package.json
index 8ec6473..814407f 100644
--- a/package.json
+++ b/package.json
@@ -88,8 +88,8 @@
     "@types/node": "^14.6.2",
     "@types/react-color": "^3.0.4",
     "@types/redux-logger": "^3.0.8",
-    "@typescript-eslint/eslint-plugin": "2.x",
-    "@typescript-eslint/parser": "2.x",
+    "@typescript-eslint/eslint-plugin": "4.1.1",
+    "@typescript-eslint/parser": "4.1.1",
     "babel-eslint": "10.x",
     "babel-plugin-import": "^1.13.0",
     "eslint": "6.x",
diff --git a/src/components/BasicShop/BasicComponents/Carousel/index.tsx b/src/components/BasicShop/BasicComponents/Carousel/index.tsx
index fc173dc..30411e8 100644
--- a/src/components/BasicShop/BasicComponents/Carousel/index.tsx
+++ b/src/components/BasicShop/BasicComponents/Carousel/index.tsx
@@ -18,7 +18,6 @@ const XCarousel = memo((props: PropsWithChildren<CarouselTypes>) => {
       );
     });
   };
-
   return (
     <div style={{ width: '100%', overflow: 'hidden' }}>
       {isTpl ? (
diff --git a/src/components/BasicShop/BasicComponents/Carousel/template.ts b/src/components/BasicShop/BasicComponents/Carousel/template.ts
new file mode 100644
index 0000000..b915ba4
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Carousel/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Carousel',
+  h: 82,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Footer/schema.ts b/src/components/BasicShop/BasicComponents/Footer/schema.ts
new file mode 100644
index 0000000..32b99ab
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Footer/schema.ts
@@ -0,0 +1,57 @@
+const Footer = {
+  editData: [
+    {
+      key: 'bgColor',
+      name: '背景色',
+      type: 'Color',
+    },
+    {
+      key: 'height',
+      name: '高度',
+      type: 'Number',
+    },
+    {
+      key: 'text',
+      name: '文字',
+      type: 'Text',
+    },
+    {
+      key: 'fontSize',
+      name: '字体大小',
+      type: 'Number',
+    },
+    {
+      key: 'color',
+      name: '文字颜色',
+      type: 'Color',
+    },
+    {
+      key: 'align',
+      name: '对齐方式',
+      type: 'Select',
+      range: [
+        {
+          key: 'left',
+          text: '左对齐',
+        },
+        {
+          key: 'center',
+          text: '居中对齐',
+        },
+        {
+          key: 'right',
+          text: '右对齐',
+        },
+      ],
+    },
+  ],
+  config: {
+    bgColor: 'rgba(0,0,0,1)',
+    text: '页脚Footer',
+    color: 'rgba(255,255,255,1)',
+    align: 'center',
+    fontSize: 16,
+    height: 48,
+  },
+};
+export default Footer;
diff --git a/src/components/BasicShop/BasicComponents/Footer/template.ts b/src/components/BasicShop/BasicComponents/Footer/template.ts
new file mode 100644
index 0000000..e2fae3e
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Footer/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Footer',
+  h: 24,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Form/BaseForm.js b/src/components/BasicShop/BasicComponents/Form/BaseForm.tsx
similarity index 91%
rename from src/components/BasicShop/BasicComponents/Form/BaseForm.js
rename to src/components/BasicShop/BasicComponents/Form/BaseForm.tsx
index dd63d0b..feaece3 100644
--- a/src/components/BasicShop/BasicComponents/Form/BaseForm.js
+++ b/src/components/BasicShop/BasicComponents/Form/BaseForm.tsx
@@ -30,14 +30,7 @@ const BaseForm = {
     const { label, placeholder, onChange } = props;
     return (
       <Cell title={label}>
-        <Input
-          type="number"
-          rows={3}
-          autoHeight
-          showLength
-          placeholder={placeholder}
-          onChange={onChange}
-        />
+        <Input type="number" placeholder={placeholder} onChange={onChange} />
       </Cell>
     );
   },
diff --git a/src/components/BasicShop/BasicComponents/Form/index.js b/src/components/BasicShop/BasicComponents/Form/index.tsx
similarity index 84%
rename from src/components/BasicShop/BasicComponents/Form/index.js
rename to src/components/BasicShop/BasicComponents/Form/index.tsx
index 37b9e1d..5267a91 100644
--- a/src/components/BasicShop/BasicComponents/Form/index.js
+++ b/src/components/BasicShop/BasicComponents/Form/index.tsx
@@ -1,4 +1,4 @@
-import React, { memo, useState, useEffect } from 'react';
+import React, { memo, useState, useEffect, useMemo, useCallback } from 'react';
 import { Button } from 'zarm';
 import BaseForm from './BaseForm';
 import req from 'utils/req';
@@ -14,17 +14,17 @@ function unParams(params = '?a=1&b=2&c=3') {
 }
 const FormComponent = props => {
   const { title, bgColor, fontSize, titColor, btnColor, btnTextColor, api, formControls } = props;
-
   const formData = {};
-
-  const handleChange = (item, v) => {
-    if (item.options) {
-      formData[item.label] = v[0].label;
-      return;
-    }
-    formData[item.label] = v;
-  };
-
+  const handleChange = useCallback(
+    (item, v) => {
+      if (item.options) {
+        formData[item.label] = v[0].label;
+        return;
+      }
+      formData[item.label] = v;
+    },
+    [formData],
+  );
   const handleSubmit = () => {
     if (api) {
       fetch(api, {
@@ -38,7 +38,6 @@ const FormComponent = props => {
       });
     }
   };
-
   return (
     <div className={styles.formWrap} style={{ backgroundColor: bgColor }}>
       {title && (
diff --git a/src/components/BasicShop/BasicComponents/Form/schema.ts b/src/components/BasicShop/BasicComponents/Form/schema.ts
new file mode 100644
index 0000000..0a41175
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Form/schema.ts
@@ -0,0 +1,78 @@
+const Form = {
+  editData: [
+    {
+      key: 'title',
+      name: '标题',
+      type: 'Text',
+    },
+    {
+      key: 'fontSize',
+      name: '标题大小',
+      type: 'Number',
+    },
+    {
+      key: 'titColor',
+      name: '标题颜色',
+      type: 'Color',
+    },
+    {
+      key: 'bgColor',
+      name: '背景色',
+      type: 'Color',
+    },
+    {
+      key: 'btnColor',
+      name: '按钮颜色',
+      type: 'Color',
+    },
+    {
+      key: 'btnTextColor',
+      name: '按钮文本颜色',
+      type: 'Color',
+    },
+    {
+      key: 'api',
+      name: '表单Api地址',
+      type: 'Text',
+    },
+    {
+      key: 'formControls',
+      name: '表单控件',
+      type: 'FormItems',
+    },
+  ],
+  config: {
+    title: '表单定制组件',
+    fontSize: 18,
+    titColor: 'rgba(60,60,60,1)',
+    bgColor: 'rgba(255,255,255,1)',
+    btnColor: 'rgba(129,173,173,1)',
+    btnTextColor: 'rgba(255,255,255,1)',
+    api: '',
+    formControls: [
+      {
+        id: '1',
+        type: 'Text',
+        label: '姓名',
+        placeholder: '请输入姓名',
+      },
+      {
+        id: '2',
+        type: 'Number',
+        label: '年龄',
+        placeholder: ' 请输入年龄',
+      },
+      {
+        id: '4',
+        type: 'MySelect',
+        label: '爱好',
+        options: [
+          { label: '选项一', value: '1' },
+          { label: '选项二', value: '2' },
+          { label: '选项三', value: '3' },
+        ],
+      },
+    ],
+  },
+};
+export default Form;
diff --git a/src/components/BasicShop/BasicComponents/Form/template.ts b/src/components/BasicShop/BasicComponents/Form/template.ts
new file mode 100644
index 0000000..2861692
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Form/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Form',
+  h: 172,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Header/schema.ts b/src/components/BasicShop/BasicComponents/Header/schema.ts
new file mode 100644
index 0000000..fb02ad5
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Header/schema.ts
@@ -0,0 +1,53 @@
+const Header = {
+  editData: [
+    {
+      key: 'bgColor',
+      name: '背景色',
+      type: 'Color',
+    },
+    {
+      key: 'height',
+      name: '高度',
+      type: 'Number',
+    },
+    {
+      key: 'logo',
+      name: 'logo',
+      type: 'Upload',
+      isCrop: true,
+      cropRate: 1000 / 618,
+    },
+    {
+      key: 'logoText',
+      name: 'logo文字',
+      type: 'Text',
+    },
+    {
+      key: 'color',
+      name: '文字颜色',
+      type: 'Color',
+    },
+    {
+      key: 'fontSize',
+      name: '文字大小',
+      type: 'Number',
+    },
+  ],
+  config: {
+    bgColor: 'rgba(0,0,0,1)',
+    logo: [
+      {
+        uid: '001',
+        name: 'image.png',
+        status: 'done',
+        url: 'http://io.nainor.com/uploads/3_1740be8a482.png',
+      },
+    ],
+    logoText: '页头Header',
+    fontSize: 20,
+    color: 'rgba(255,255,255,1)',
+    height: 50,
+  },
+};
+
+export default Header;
diff --git a/src/components/BasicShop/BasicComponents/Header/template.ts b/src/components/BasicShop/BasicComponents/Header/template.ts
new file mode 100644
index 0000000..ecc13de
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Header/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Header',
+  h: 28,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Icon/index.tsx b/src/components/BasicShop/BasicComponents/Icon/index.tsx
index 7902b4b..e61fcb0 100644
--- a/src/components/BasicShop/BasicComponents/Icon/index.tsx
+++ b/src/components/BasicShop/BasicComponents/Icon/index.tsx
@@ -2,7 +2,7 @@ import React, { memo } from 'react';
 import * as Icon from '@ant-design/icons';
 import IconImg from 'assets/icon.png';
 import { AntdIconProps } from '@ant-design/icons/lib/components/AntdIcon';
-import { IconConfigType } from '../DynamicEngine/schema';
+import { IconConfigType } from '../../../DynamicEngine/schema';
 import { AntdIconType } from './icon';
 
 interface IconType extends Omit<IconConfigType, 'spin' | 'color'> {
diff --git a/src/components/BasicShop/BasicComponents/Icon/schema.ts b/src/components/BasicShop/BasicComponents/Icon/schema.ts
index 75e5569..3aa49f8 100644
--- a/src/components/BasicShop/BasicComponents/Icon/schema.ts
+++ b/src/components/BasicShop/BasicComponents/Icon/schema.ts
@@ -40,3 +40,79 @@ export type IconTypes =
   | 'SafetyCertificateTwoTone'
   | 'SettingTwoTone'
   | 'RocketTwoTone';
+
+const Icon = {
+  editData: [
+    {
+      key: 'color',
+      name: '颜色',
+      type: 'Color',
+    },
+    {
+      key: 'size',
+      name: '大小',
+      type: 'Number',
+    },
+    {
+      key: 'spin',
+      name: '旋转动画',
+      type: 'Switch',
+    },
+    {
+      key: 'type',
+      name: '图标类型',
+      type: 'CardPicker',
+      icons: [
+        'AccountBookTwoTone',
+        'AlertTwoTone',
+        'ApiTwoTone',
+        'AppstoreTwoTone',
+        'AudioTwoTone',
+        'BankTwoTone',
+        'BellTwoTone',
+        'BookTwoTone',
+        'BugTwoTone',
+        'BuildTwoTone',
+        'BulbTwoTone',
+        'CalculatorTwoTone',
+        'CalendarTwoTone',
+        'CameraTwoTone',
+        'CarTwoTone',
+        'CarryOutTwoTone',
+        'CiCircleTwoTone',
+        'CloudTwoTone',
+        'CodeTwoTone',
+        'CrownTwoTone',
+        'CustomerServiceTwoTone',
+        'DollarCircleTwoTone',
+        'EnvironmentTwoTone',
+        'ExperimentTwoTone',
+        'FireTwoTone',
+        'GiftTwoTone',
+        'InsuranceTwoTone',
+        'LikeTwoTone',
+        'LockTwoTone',
+        'MailTwoTone',
+        'MessageTwoTone',
+        'PhoneTwoTone',
+        'PictureTwoTone',
+        'PlaySquareTwoTone',
+        'RedEnvelopeTwoTone',
+        'ShopTwoTone',
+        'TrademarkCircleTwoTone',
+        'StarTwoTone',
+        'SafetyCertificateTwoTone',
+        'SettingTwoTone',
+        'RocketTwoTone',
+      ],
+    },
+  ],
+  config: {
+    color: 'rgba(74,144,226,1)',
+    size: 36,
+    spin: false,
+    type: 'CarTwoTone',
+  },
+};
+
+export default Icon;
diff --git a/src/components/BasicShop/BasicComponents/Icon/template.ts b/src/components/BasicShop/BasicComponents/Icon/template.ts
new file mode 100644
index 0000000..b21cabe
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Icon/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Icon',
+  h: 23,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Image/schema.ts b/src/components/BasicShop/BasicComponents/Image/schema.ts
new file mode 100644
index 0000000..607e367
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Image/schema.ts
@@ -0,0 +1,28 @@
+const Image = {
+  editData: [
+    {
+      key: 'imgUrl',
+      name: '上传',
+      type: 'Upload',
+      isCrop: false,
+    },
+    {
+      key: 'round',
+      name: '圆角',
+      type: 'Number',
+    },
+  ],
+  config: {
+    imgUrl: [
+      {
+        uid: '001',
+        name: 'image.png',
+        status: 'done',
+        url: 'http://io.nainor.com/uploads/4_1740bf4535c.png',
+      },
+    ],
+    round: 0,
+  },
+};
+
+export default Image;
diff --git a/src/components/BasicShop/BasicComponents/Image/template.ts b/src/components/BasicShop/BasicComponents/Image/template.ts
new file mode 100644
index 0000000..a012259
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Image/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Image',
+  h: 188,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/List/schema.ts b/src/components/BasicShop/BasicComponents/List/schema.ts
new file mode 100644
index 0000000..ebbee48
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/List/schema.ts
@@ -0,0 +1,89 @@
+const List = {
+  editData: [
+    {
+      key: 'sourceData',
+      name: '数据源',
+      type: 'DataList',
+    },
+    {
+      key: 'round',
+      name: '圆角',
+      type: 'Number',
+    },
+    {
+      key: 'imgSize',
+      name: '图片大小',
+      type: 'Select',
+      range: [
+        {
+          key: 60,
+          text: '60 x 60',
+        },
+        {
+          key: 80,
+          text: '80 x 80',
+        },
+        {
+          key: 100,
+          text: '100 x 100',
+        },
+        {
+          key: 120,
+          text: '120 x 120',
+        },
+        {
+          key: 150,
+          text: '150 x 150',
+        },
+      ],
+    },
+    {
+      key: 'fontSize',
+      name: '文字大小',
+      type: 'Number',
+    },
+    {
+      key: 'color',
+      name: '文字颜色',
+      type: 'Color',
+    },
+  ],
+  config: {
+    sourceData: [
+      {
+        id: '1',
+        title: '趣谈小课',
+        desc: '致力于打造优质小课程',
+        link: 'xxxxx',
+        imgUrl: [
+          {
+            uid: '001',
+            name: 'image.png',
+            status: 'done',
+            url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
+          },
+        ],
+      },
+      {
+        id: '2',
+        title: '趣谈小课',
+        desc: '致力于打造优质小课程',
+        link: 'xxxxx',
+        imgUrl: [
+          {
+            uid: '002',
+            name: 'image.png',
+            status: 'done',
+            url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
+          },
+        ],
+      },
+    ],
+    round: 0,
+    imgSize: 80,
+    fontSize: 16,
+    color: 'rgba(153,153,153,1)',
+  },
+};
+
+export default List;
diff --git a/src/components/BasicShop/BasicComponents/List/template.ts b/src/components/BasicShop/BasicComponents/List/template.ts
new file mode 100644
index 0000000..d9f5d44
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/List/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'List',
+  h: 110,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/LongText/schema.ts b/src/components/BasicShop/BasicComponents/LongText/schema.ts
new file mode 100644
index 0000000..f4a9ccc
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/LongText/schema.ts
@@ -0,0 +1,60 @@
+const LongText = {
+  editData: [
+    {
+      key: 'text',
+      name: '文字',
+      type: 'TextArea',
+    },
+    {
+      key: 'color',
+      name: '标题颜色',
+      type: 'Color',
+    },
+    {
+      key: 'fontSize',
+      name: '字体大小',
+      type: 'Number',
+    },
+    {
+      key: 'indent',
+      name: '首行缩进',
+      type: 'Number',
+      range: [0, 100],
+    },
+    {
+      key: 'textAlign',
+      name: '对齐方式',
+      type: 'Select',
+      range: [
+        {
+          key: 'left',
+          text: '左对齐',
+        },
+        {
+          key: 'center',
+          text: '居中对齐',
+        },
+        {
+          key: 'right',
+          text: '右对齐',
+        },
+      ],
+    },
+    {
+      key: 'lineHeight',
+      name: '行高',
+      type: 'Number',
+      step: 0.1,
+    },
+  ],
+  config: {
+    text: '我是长文本有一段故事，dooring可视化编辑器无限可能，赶快来体验吧，骚年们，奥利给~',
+    color: 'rgba(60,60,60,1)',
+    fontSize: 14,
+    indent: 20,
+    lineHeight: 1.8,
+    textAlign: 'left',
+  },
+};
+
+export default LongText;
diff --git a/src/components/BasicShop/BasicComponents/LongText/template.ts b/src/components/BasicShop/BasicComponents/LongText/template.ts
new file mode 100644
index 0000000..2cc5650
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/LongText/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'LongText',
+  h: 36,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Notice/schema.ts b/src/components/BasicShop/BasicComponents/Notice/schema.ts
new file mode 100644
index 0000000..b04a08c
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Notice/schema.ts
@@ -0,0 +1,55 @@
+const Notice = {
+  editData: [
+    {
+      key: 'text',
+      name: '文本',
+      type: 'Text',
+    },
+    {
+      key: 'speed',
+      name: '滚动速度',
+      type: 'Number',
+    },
+    {
+      key: 'theme',
+      name: '主题',
+      type: 'Select',
+      range: [
+        {
+          key: 'default',
+          text: '默认',
+        },
+        {
+          key: 'warning',
+          text: '警告',
+        },
+        {
+          key: 'primary',
+          text: '主要',
+        },
+        {
+          key: 'success',
+          text: '成功',
+        },
+        {
+          key: 'danger',
+          text: '危险',
+        },
+      ],
+    },
+    {
+      key: 'isClose',
+      name: '是否可关闭',
+      type: 'Switch',
+    },
+  ],
+  config: {
+    text: '通知栏: 趣谈前端上线啦',
+    link: '',
+    speed: 50,
+    theme: 'warning',
+    isClose: false,
+  },
+};
+
+export default Notice;
diff --git a/src/components/BasicShop/BasicComponents/Notice/template.ts b/src/components/BasicShop/BasicComponents/Notice/template.ts
new file mode 100644
index 0000000..fd0e415
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Notice/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Notice',
+  h: 20,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Qrcode/schema.ts b/src/components/BasicShop/BasicComponents/Qrcode/schema.ts
new file mode 100644
index 0000000..6db4f6c
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Qrcode/schema.ts
@@ -0,0 +1,41 @@
+const Qrcode = {
+  editData: [
+    {
+      key: 'qrcode',
+      name: '二维码',
+      type: 'Upload',
+      isCrop: true,
+      cropRate: 1,
+    },
+    {
+      key: 'text',
+      name: '文字',
+      type: 'Text',
+    },
+    {
+      key: 'color',
+      name: '文字颜色',
+      type: 'Color',
+    },
+    {
+      key: 'fontSize',
+      name: '文字大小',
+      type: 'Number',
+    },
+  ],
+  config: {
+    qrcode: [
+      {
+        uid: '001',
+        name: 'image.png',
+        status: 'done',
+        url: 'http://io.nainor.com/uploads/code_173e1705e0c.png',
+      },
+    ],
+    text: '二维码',
+    color: 'rgba(153,153,153,1)',
+    fontSize: 14,
+  },
+};
+
+export default Qrcode;
diff --git a/src/components/BasicShop/BasicComponents/Qrcode/template.ts b/src/components/BasicShop/BasicComponents/Qrcode/template.ts
new file mode 100644
index 0000000..c5883f8
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Qrcode/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Qrcode',
+  h: 150,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Tab/schema.ts b/src/components/BasicShop/BasicComponents/Tab/schema.ts
new file mode 100644
index 0000000..841e409
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Tab/schema.ts
@@ -0,0 +1,90 @@
+const Tab = {
+  editData: [
+    {
+      key: 'tabs',
+      name: '项目类别',
+      type: 'MutiText',
+    },
+    {
+      key: 'activeColor',
+      name: '激活颜色',
+      type: 'Color',
+    },
+    {
+      key: 'color',
+      name: '文字颜色',
+      type: 'Color',
+    },
+    {
+      key: 'fontSize',
+      name: '文字大小',
+      type: 'Number',
+    },
+    {
+      key: 'imgSize',
+      name: '图片大小',
+      type: 'Number',
+    },
+    {
+      key: 'sourceData',
+      name: '数据源',
+      type: 'DataList',
+    },
+  ],
+  config: {
+    tabs: ['类别一', '类别二'],
+    color: 'rgba(153,153,153,1)',
+    activeColor: 'rgba(0,102,204,1)',
+    fontSize: 16,
+    imgSize: 100,
+    sourceData: [
+      {
+        id: '1',
+        title: '趣谈小课1',
+        desc: '致力于打造优质小课程',
+        link: 'xxxxx',
+        type: 0,
+        imgUrl: [
+          {
+            uid: '001',
+            name: 'image.png',
+            status: 'done',
+            url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
+          },
+        ],
+      },
+      {
+        id: '2',
+        title: '趣谈小课2',
+        desc: '致力于打造优质小课程',
+        link: 'xxxxx',
+        type: 0,
+        imgUrl: [
+          {
+            uid: '001',
+            name: 'image.png',
+            status: 'done',
+            url: 'http://io.nainor.com/uploads/2_1740c7033a9.png',
+          },
+        ],
+      },
+      {
+        id: '3',
+        title: '趣谈小课3',
+        desc: '致力于打造优质小课程',
+        link: 'xxxxx',
+        type: 1,
+        imgUrl: [
+          {
+            uid: '001',
+            name: 'image.png',
+            status: 'done',
+            url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
+          },
+        ],
+      },
+    ],
+  },
+};
+
+export default Tab;
diff --git a/src/components/BasicShop/BasicComponents/Tab/template.ts b/src/components/BasicShop/BasicComponents/Tab/template.ts
new file mode 100644
index 0000000..dbab411
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Tab/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Tab',
+  h: 130,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/Text/schema.ts b/src/components/BasicShop/BasicComponents/Text/schema.ts
new file mode 100644
index 0000000..cc31a8f
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Text/schema.ts
@@ -0,0 +1,51 @@
+const Text = {
+  editData: [
+    {
+      key: 'text',
+      name: '文字',
+      type: 'Text',
+    },
+    {
+      key: 'color',
+      name: '标题颜色',
+      type: 'Color',
+    },
+    {
+      key: 'fontSize',
+      name: '字体大小',
+      type: 'Number',
+    },
+    {
+      key: 'align',
+      name: '对齐方式',
+      type: 'Select',
+      range: [
+        {
+          key: 'left',
+          text: '左对齐',
+        },
+        {
+          key: 'center',
+          text: '居中对齐',
+        },
+        {
+          key: 'right',
+          text: '右对齐',
+        },
+      ],
+    },
+    {
+      key: 'lineHeight',
+      name: '行高',
+      type: 'Number',
+    },
+  ],
+  config: {
+    text: '我是文本',
+    color: 'rgba(60,60,60,1)',
+    fontSize: 18,
+    align: 'center',
+    lineHeight: 2,
+  },
+};
+export default Text;
diff --git a/src/components/BasicShop/BasicComponents/Text/template.ts b/src/components/BasicShop/BasicComponents/Text/template.ts
new file mode 100644
index 0000000..5869d49
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/Text/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Text',
+  h: 20,
+};
+export default template;
diff --git a/src/components/BasicShop/BasicComponents/schema.ts b/src/components/BasicShop/BasicComponents/schema.ts
new file mode 100644
index 0000000..983dff2
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/schema.ts
@@ -0,0 +1,28 @@
+import Carousel from './Carousel/schema';
+import Footer from './Footer/schema';
+import Form from './Form/schema';
+import Header from './Header/schema';
+import Icon from './Icon/schema';
+import Image from './Image/schema';
+import List from './List/schema';
+import LongText from './LongText/schema';
+import Notice from './Notice/schema';
+import Qrcode from './Qrcode/schema';
+import Tab from './Tab/schema';
+import Text from './Text/schema';
+
+const basicSchema = {
+  Carousel,
+  Footer,
+  Form,
+  Header,
+  Icon,
+  Image,
+  List,
+  LongText,
+  Notice,
+  Qrcode,
+  Tab,
+  Text,
+};
+export default basicSchema;
diff --git a/src/components/BasicShop/BasicComponents/template.ts b/src/components/BasicShop/BasicComponents/template.ts
new file mode 100644
index 0000000..ae567de
--- /dev/null
+++ b/src/components/BasicShop/BasicComponents/template.ts
@@ -0,0 +1,32 @@
+import Carousel from './Carousel/template';
+import Footer from './Footer/template';
+import Form from './Form/template';
+import Header from './Header/template';
+import Icon from './Icon/template';
+import Image from './Image/template';
+import List from './List/template';
+import LongText from './LongText/template';
+import Notice from './Notice/template';
+import Qrcode from './Qrcode/template';
+import Tab from './Tab/template';
+import Text from './Text/template';
+
+const basicTemplate = [
+  Carousel,
+  Footer,
+  Form,
+  Header,
+  Icon,
+  Image,
+  List,
+  LongText,
+  Notice,
+  Qrcode,
+  Tab,
+  Text,
+];
+const BasicTemplate = basicTemplate.map(v => {
+  return { ...v, category: 'base' };
+});
+
+export default BasicTemplate;
diff --git a/src/components/BasicShop/MediaComponents/Video/schema.ts b/src/components/BasicShop/MediaComponents/Video/schema.ts
new file mode 100644
index 0000000..8e7b97f
--- /dev/null
+++ b/src/components/BasicShop/MediaComponents/Video/schema.ts
@@ -0,0 +1,27 @@
+const Video = {
+  editData: [
+    {
+      key: 'poster',
+      name: '视频封面',
+      type: 'Upload',
+    },
+    {
+      key: 'url',
+      name: '视频链接',
+      type: 'Text',
+    },
+  ],
+  config: {
+    poster: [
+      {
+        uid: '001',
+        name: 'image.png',
+        status: 'done',
+        url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
+      },
+    ],
+    url: '',
+  },
+};
+
+export default Video;
diff --git a/src/components/BasicShop/MediaComponents/Video/template.ts b/src/components/BasicShop/MediaComponents/Video/template.ts
new file mode 100644
index 0000000..ebe4212
--- /dev/null
+++ b/src/components/BasicShop/MediaComponents/Video/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Video',
+  h: 107,
+};
+export default template;
diff --git a/src/components/BasicShop/MediaComponents/schema.ts b/src/components/BasicShop/MediaComponents/schema.ts
new file mode 100644
index 0000000..ff1e05b
--- /dev/null
+++ b/src/components/BasicShop/MediaComponents/schema.ts
@@ -0,0 +1,6 @@
+import Video from './Video/schema';
+
+const mediaSchema = {
+  Video,
+};
+export default mediaSchema;
diff --git a/src/components/BasicShop/MediaComponents/template.ts b/src/components/BasicShop/MediaComponents/template.ts
new file mode 100644
index 0000000..5697673
--- /dev/null
+++ b/src/components/BasicShop/MediaComponents/template.ts
@@ -0,0 +1,9 @@
+import Video from './Video/template';
+
+const mediaTemplate = [Video];
+
+const MediaTemplate = mediaTemplate.map(v => {
+  return { ...v, category: 'media' };
+});
+
+export default MediaTemplate;
diff --git a/src/components/BasicShop/VisualComponents/Chart/schema.ts b/src/components/BasicShop/VisualComponents/Chart/schema.ts
new file mode 100644
index 0000000..042255b
--- /dev/null
+++ b/src/components/BasicShop/VisualComponents/Chart/schema.ts
@@ -0,0 +1,51 @@
+const Chart = {
+  editData: [
+    {
+      key: 'title',
+      name: '标题',
+      type: 'Text',
+    },
+    {
+      key: 'size',
+      name: '标题大小',
+      type: 'Number',
+    },
+    {
+      key: 'color',
+      name: '标题颜色',
+      type: 'Color',
+    },
+    {
+      key: 'paddingTop',
+      name: '上边距',
+      type: 'Number',
+    },
+    {
+      key: 'data',
+      name: '数据源',
+      type: 'Table',
+    },
+  ],
+  config: {
+    title: '柱状图',
+    size: 14,
+    color: 'rgba(0,0,0,1)',
+    paddingTop: 10,
+    data: [
+      {
+        name: 'A',
+        value: 20,
+      },
+      {
+        name: 'B',
+        value: 60,
+      },
+      {
+        name: 'C',
+        value: 20,
+      },
+    ],
+  },
+};
+
+export default Chart;
diff --git a/src/components/BasicShop/VisualComponents/Chart/template.ts b/src/components/BasicShop/VisualComponents/Chart/template.ts
new file mode 100644
index 0000000..524fbe4
--- /dev/null
+++ b/src/components/BasicShop/VisualComponents/Chart/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'Chart',
+  h: 102,
+};
+export default template;
diff --git a/src/components/BasicShop/VisualComponents/XProgress/schema.ts b/src/components/BasicShop/VisualComponents/XProgress/schema.ts
new file mode 100644
index 0000000..5e87173
--- /dev/null
+++ b/src/components/BasicShop/VisualComponents/XProgress/schema.ts
@@ -0,0 +1,67 @@
+const XProgress = {
+  editData: [
+    {
+      key: 'theme',
+      name: '主题',
+      type: 'Select',
+      range: [
+        {
+          key: 'success',
+          text: '成功',
+        },
+        {
+          key: 'warning',
+          text: '警告',
+        },
+        {
+          key: 'danger',
+          text: '危险',
+        },
+      ],
+    },
+    {
+      key: 'shape',
+      name: '形状',
+      type: 'Radio',
+      range: [
+        {
+          key: 'circle',
+          text: '圆形',
+        },
+        {
+          key: 'line',
+          text: '线形',
+        },
+        {
+          key: 'semi-circle',
+          text: '半圆形',
+        },
+      ],
+    },
+    {
+      key: 'size',
+      name: '大小',
+      type: 'Number',
+    },
+    {
+      key: 'percent',
+      name: '进度值',
+      type: 'Number',
+      range: [0, 100],
+    },
+    {
+      key: 'strokeWidth',
+      name: '线条粗细',
+      type: 'Number',
+    },
+  ],
+  config: {
+    theme: 'success',
+    shape: 'circle',
+    size: 200,
+    percent: 30,
+    strokeWidth: 10,
+  },
+};
+
+export default XProgress;
diff --git a/src/components/BasicShop/VisualComponents/XProgress/template.ts b/src/components/BasicShop/VisualComponents/XProgress/template.ts
new file mode 100644
index 0000000..5460258
--- /dev/null
+++ b/src/components/BasicShop/VisualComponents/XProgress/template.ts
@@ -0,0 +1,5 @@
+const template = {
+  type: 'XProgress',
+  h: 102,
+};
+export default template;
diff --git a/src/components/BasicShop/VisualComponents/schema.ts b/src/components/BasicShop/VisualComponents/schema.ts
new file mode 100644
index 0000000..93370ae
--- /dev/null
+++ b/src/components/BasicShop/VisualComponents/schema.ts
@@ -0,0 +1,8 @@
+import Chart from './Chart/schema';
+import XProgress from './XProgress/schema';
+
+const visualSchema = {
+  Chart,
+  XProgress,
+};
+export default visualSchema;
diff --git a/src/components/BasicShop/VisualComponents/template.ts b/src/components/BasicShop/VisualComponents/template.ts
new file mode 100644
index 0000000..d0068f6
--- /dev/null
+++ b/src/components/BasicShop/VisualComponents/template.ts
@@ -0,0 +1,9 @@
+import Chart from './Chart/template';
+import XProgress from './XProgress/template';
+
+const visualTemplate = [Chart, XProgress];
+
+const VisualTemplate = visualTemplate.map(v => {
+  return { ...v, category: 'visual' };
+});
+export default VisualTemplate;
diff --git a/src/components/BasicShop/schema.ts b/src/components/BasicShop/schema.ts
new file mode 100644
index 0000000..777b122
--- /dev/null
+++ b/src/components/BasicShop/schema.ts
@@ -0,0 +1,11 @@
+import BasicSchema from './BasicComponents/schema';
+import MediaSchema from './MediaComponents/schema';
+import VisualSchema from './VisualComponents/schema';
+
+const schema = {
+  ...BasicSchema,
+  ...MediaSchema,
+  ...VisualSchema,
+};
+
+export default schema;
diff --git a/src/components/Calibration/index.tsx b/src/components/Calibration/index.tsx
index d15a38c..bb7b9c4 100644
--- a/src/components/Calibration/index.tsx
+++ b/src/components/Calibration/index.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState, useEffect, useRef, useCallback } from 'react';
 
 import styles from './index.less';
 
@@ -16,6 +16,45 @@ export default function Calibration(props: CalibrationTypes) {
   const [calibrationLength, setCalibration] = useState<calibrationTypes>({ width: 0, height: 0 });
   const calibrationRef = useRef<HTMLDivElement>(null);
 
+  const generateElement = useCallback(
+    (item?: boolean, num?: number) => {
+      if (calibrationRef.current) {
+        let createSpan = document.createElement('div');
+        createSpan.className = 'calibrationLine';
+        createSpan.style.backgroundColor = '#ccc';
+        calibrationRef.current.style.display = 'flex';
+        calibrationRef.current.style.justifyContent = 'space-between';
+        if (direction === 'up') {
+          calibrationRef.current.style.marginLeft = '50px';
+          createSpan.style.width = '1px';
+          createSpan.style.height = '6px';
+          createSpan.style.display = 'inline-block';
+        } else {
+          calibrationRef.current.style.flexDirection = 'column';
+          createSpan.style.height = '1px';
+          createSpan.style.width = '6px';
+        }
+        if (item) {
+          let createSpanContent = document.createElement('span');
+          if (direction === 'up') {
+            createSpan.style.height = '12px';
+            createSpanContent.style.transform = 'translate3d(-4px, 20px, 0px)';
+            createSpan.style.transform = 'translateY(0px)';
+          } else {
+            createSpan.style.width = '12px';
+            createSpanContent.style.paddingLeft = '20px';
+          }
+          createSpanContent.style.display = 'block';
+          createSpanContent.className = 'calibrationNumber';
+          createSpanContent.innerHTML = num! * 5 + '';
+          createSpan.appendChild(createSpanContent);
+        }
+        calibrationRef.current.appendChild(createSpan);
+      }
+    },
+    [direction],
+  );
+
   useEffect(() => {
     if (calibrationRef.current) {
       let calibration = calibrationRef.current.getBoundingClientRect();
@@ -29,43 +68,7 @@ export default function Calibration(props: CalibrationTypes) {
         }
       }
     }
-  }, [direction]);
-
-  const generateElement = (item?: boolean, num?: number) => {
-    if (calibrationRef.current) {
-      let createSpan = document.createElement('div');
-      createSpan.className = 'calibrationLine';
-      createSpan.style.backgroundColor = '#ccc';
-      calibrationRef.current.style.display = 'flex';
-      calibrationRef.current.style.justifyContent = 'space-between';
-      if (direction === 'up') {
-        calibrationRef.current.style.marginLeft = '50px';
-        createSpan.style.width = '1px';
-        createSpan.style.height = '6px';
-        createSpan.style.display = 'inline-block';
-      } else {
-        calibrationRef.current.style.flexDirection = 'column';
-        createSpan.style.height = '1px';
-        createSpan.style.width = '6px';
-      }
-      if (item) {
-        let createSpanContent = document.createElement('span');
-        if (direction === 'up') {
-          createSpan.style.height = '12px';
-          createSpanContent.style.transform = 'translate3d(-4px, 20px, 0px)';
-          createSpan.style.transform = 'translateY(0px)';
-        } else {
-          createSpan.style.width = '12px';
-          createSpanContent.style.paddingLeft = '20px';
-        }
-        createSpanContent.style.display = 'block';
-        createSpanContent.className = 'calibrationNumber';
-        createSpanContent.innerHTML = num! * 5 + '';
-        createSpan.appendChild(createSpanContent);
-      }
-      calibrationRef.current.appendChild(createSpan);
-    }
-  };
+  }, [direction, generateElement]);
 
   useEffect(() => {
     if (calibrationRef.current) {
diff --git a/src/components/DynamicEngine/components.less b/src/components/DynamicEngine/components.less
deleted file mode 100644
index 0468179..0000000
--- a/src/components/DynamicEngine/components.less
+++ /dev/null
@@ -1,43 +0,0 @@
-.header {
-  box-sizing: content-box;
-  padding: 3px 12px;
-  display: flex;
-  align-items: center;
-  height: 50px;
-  background-color: #000;
-  .logo {
-    margin-right: 10px;
-    max-width: 160px;
-    max-height: 46px;
-    height: 46px;
-    overflow: hidden;
-    img {
-      height: 100%;
-      object-fit: contain;
-    }
-  }
-  .title {
-    font-size: 20px;
-    color: #fff;
-  }
-}
-.list {
-  margin: 20px auto;
-  width: 94%;
-  .sourceList {
-    .sourceItem {
-      display: flex;
-      align-items: center;
-      margin-bottom: 16px;
-      .imgWrap {
-
-      }
-      .content {
-        margin-left: 12px;
-        .tit {
-          line-height: 2;
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/src/components/DynamicEngine/components.tsx b/src/components/DynamicEngine/components.tsx
deleted file mode 100644
index c0fb77d..0000000
--- a/src/components/DynamicEngine/components.tsx
+++ /dev/null
@@ -1,160 +0,0 @@
-import { memo } from 'react';
-import { NoticeBar, Progress } from 'zarm';
-import styles from './components.less';
-import React from 'react';
-import {
-  HeaderConfigType,
-  TextConfigType,
-  LongTextConfigType,
-  NoticeConfigType,
-  QRCodeConfigType,
-  FooterConfigType,
-  ImageConfigType,
-  ListConfigType,
-  XProgressConfigType,
-} from './schema';
-
-const Header = memo((props: HeaderConfigType) => {
-  const { bgColor, logo, logoText, fontSize, color } = props;
-  return (
-    <header className={styles.header} style={{ backgroundColor: bgColor }}>
-      <div className={styles.logo}>
-        <img src={logo && logo[0].url} alt={logoText} />
-      </div>
-      <div className={styles.title} style={{ fontSize, color }}>
-        {logoText}
-      </div>
-    </header>
-  );
-});
-
-const Text = memo((props: TextConfigType) => {
-  const { align, text, fontSize, color, lineHeight } = props;
-  return (
-    <div className={styles.textWrap} style={{ color, textAlign: align, fontSize, lineHeight }}>
-      {text}
-    </div>
-  );
-});
-
-const Notice = memo((props: NoticeConfigType) => {
-  const { text, speed, theme, link, isClose = false } = props;
-  return (
-    <NoticeBar theme={theme === 'default' ? undefined : theme} closable={isClose} speed={speed}>
-      <a style={{ color: 'inherit' }}>{text}</a>
-    </NoticeBar>
-  );
-});
-
-const Qrcode = memo((props: QRCodeConfigType) => {
-  const { qrcode, text, color, fontSize = 14 } = props;
-  return (
-    <div style={{ width: '240px', margin: '16px auto' }}>
-      <img src={qrcode && qrcode[0].url} alt={text} style={{ width: '100%' }} />
-      <div style={{ textAlign: 'center', color, fontSize, paddingTop: '8px' }}>{text}</div>
-    </div>
-  );
-});
-
-const LongText = memo((props: LongTextConfigType) => {
-  const { text, fontSize, color, indent, lineHeight, textAlign } = props;
-  return (
-    <div
-      className={styles.textWrap}
-      style={{ color, textIndent: indent + 'px', fontSize, lineHeight, textAlign }}
-    >
-      {text}
-    </div>
-  );
-});
-
-const Footer = memo((props: FooterConfigType) => {
-  const { bgColor, text, color, align, fontSize, height } = props;
-  return (
-    <footer
-      style={{
-        backgroundColor: bgColor,
-        color,
-        fontSize,
-        textAlign: align,
-        height,
-        lineHeight: height + 'px',
-      }}
-    >
-      {text}
-    </footer>
-  );
-});
-
-const Image = memo((props: ImageConfigType) => {
-  const { imgUrl, round = 0 } = props;
-  return (
-    <div style={{ borderRadius: round, width: '100%', textAlign: 'center', overflow: 'hidden' }}>
-      <img src={imgUrl && imgUrl[0].url} alt="" style={{ width: '100%' }} />
-    </div>
-  );
-});
-
-const List = memo((props: ListConfigType) => {
-  const { round, sourceData, imgSize, fontSize, color } = props;
-  return (
-    <div className={styles.list}>
-      <div className={styles.sourceList}>
-        {sourceData.map((item, i) => {
-          return (
-            <div className={styles.sourceItem} key={i}>
-              <div className={styles.imgWrap}>
-                <img
-                  src={
-                    item.imgUrl[0]
-                      ? item.imgUrl[0].url
-                      : 'http://io.nainor.com/uploads/01_173e15d3493.png'
-                  }
-                  alt={item.desc}
-                  style={{
-                    width: imgSize,
-                    height: imgSize,
-                    objectFit: 'cover',
-                    borderRadius: round,
-                  }}
-                />
-              </div>
-              <div className={styles.content}>
-                <a
-                  className={styles.tit}
-                  style={{ fontSize, color }}
-                  href={item.link ? item.link : '#'}
-                >
-                  {item.title}
-                  <div
-                    className={styles.desc}
-                    style={{ fontSize: fontSize * 0.8, color: 'rgba(0,0,0, .3)' }}
-                  >
-                    {item.desc}
-                  </div>
-                </a>
-              </div>
-            </div>
-          );
-        })}
-      </div>
-    </div>
-  );
-});
-
-const XProgress = memo((props: XProgressConfigType) => {
-  const { theme, size, shape, percent, strokeWidth } = props;
-  return (
-    <div className={styles.textWrap} style={{ textAlign: 'center' }}>
-      <Progress
-        shape={shape}
-        size={size}
-        percent={percent}
-        theme={theme}
-        strokeWidth={strokeWidth}
-      />
-    </div>
-  );
-});
-
-export { Header, Text, LongText, Notice, Qrcode, Footer, Image, List, XProgress };
diff --git a/src/components/DynamicEngine/graphTpl.ts b/src/components/DynamicEngine/graphTpl.ts
deleted file mode 100644
index d62fee4..0000000
--- a/src/components/DynamicEngine/graphTpl.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { BasicTemplateItem } from './schema';
-
-export type GraphTplKeyType = 'XProgress' | 'Chart';
-export type GraphTplType = Array<BasicTemplateItem<GraphTplKeyType>>;
-
-const graphTpl: GraphTplType = [
-  {
-    type: 'XProgress',
-    h: 102,
-  },
-  {
-    type: 'Chart',
-    h: 102,
-  },
-];
-
-export default graphTpl;
diff --git a/src/components/DynamicEngine/index.tsx b/src/components/DynamicEngine/index.tsx
index f60c5f0..d506f0f 100644
--- a/src/components/DynamicEngine/index.tsx
+++ b/src/components/DynamicEngine/index.tsx
@@ -20,7 +20,6 @@ const DynamicFunc = (type: AllTemplateType, componentsType: componentsType) =>
         const { default: Graph } = await import(`@/components/BasicShop/VisualComponents/${type}`);
         Component = Graph;
       }
-
       return (props: DynamicType) => {
         const { config, isTpl } = props;
         return <Component {...config} isTpl={isTpl} />;
@@ -38,14 +37,16 @@ type DynamicType = {
   config: { [key: string]: any };
   type: AllTemplateType;
   componentsType: componentsType;
+  category: componentsType;
 };
 const DynamicEngine = memo((props: DynamicType) => {
-  const { type, config, isTpl, componentsType } = props;
+  const { type, config, category } = props;
   const Dynamic = useMemo(() => {
-    return (DynamicFunc(type, componentsType) as unknown) as FC<DynamicType>;
+    return (DynamicFunc(type, category) as unknown) as FC<DynamicType>;
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [type, config]);
-  return <Dynamic type={type} config={config} isTpl={isTpl} componentsType={componentsType} />;
+
+  return <Dynamic {...props} />;
 });
 
 export default DynamicEngine;
diff --git a/src/components/DynamicEngine/mediaTpl.ts b/src/components/DynamicEngine/mediaTpl.ts
deleted file mode 100644
index a9d7e5f..0000000
--- a/src/components/DynamicEngine/mediaTpl.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { BasicTemplateItem } from './schema';
-
-export type MediaTplKeyType = 'Video';
-export type MediaTplType = Array<BasicTemplateItem<MediaTplKeyType>>;
-
-const mediaTpl: MediaTplType = [
-  {
-    type: 'Video',
-    h: 107,
-  },
-];
-
-export default mediaTpl;
diff --git a/src/components/DynamicEngine/schema.ts b/src/components/DynamicEngine/schema.ts
index d6b522c..3974f14 100644
--- a/src/components/DynamicEngine/schema.ts
+++ b/src/components/DynamicEngine/schema.ts
@@ -1,9 +1,5 @@
 //_______basic___________
 
-import { TemplateKeyType } from './template';
-import { MediaTplKeyType } from './mediaTpl';
-import { GraphTplKeyType } from './graphTpl';
-
 export type BasicSchemaType =
   | 'Radio'
   | 'Switch'
@@ -23,7 +19,20 @@ export type BasicTemplateItem<T> = {
   h: number;
 };
 export type BasicTheme = 'warning' | 'success' | 'danger';
-
+type TemplateKeyType =
+  | 'Text'
+  | 'LongText'
+  | 'Carousel'
+  | 'Tab'
+  | 'Notice'
+  | 'Qrcode'
+  | 'Icon'
+  | 'Image'
+  | 'Header'
+  | 'List'
+  | 'Footer';
+type MediaTplKeyType = 'Video';
+type GraphTplKeyType = 'XProgress' | 'Chart';
 export type AllTemplateType = TemplateKeyType | MediaTplKeyType | GraphTplKeyType;
 
 export type SchemaImplement = {
@@ -475,805 +484,3 @@ export interface SchemaType extends SchemaImplement {
   XProgress: XProgressSchema;
   Chart: XChartSchema;
 }
-
-const schema: SchemaType = {
-  Carousel: {
-    editData: [
-      {
-        key: 'direction',
-        name: '方向',
-        type: 'Radio',
-        range: [
-          {
-            key: 'down',
-            text: '从上到下',
-          },
-          {
-            key: 'left',
-            text: '从左到右',
-          },
-        ],
-      },
-      {
-        key: 'swipeable',
-        name: '是否可拖拽',
-        type: 'Switch',
-      },
-      {
-        key: 'autoPlay',
-        name: '是否自动播放',
-        type: 'Switch',
-      },
-      {
-        key: 'imgList',
-        name: '图片列表',
-        type: 'DataList',
-      },
-    ],
-    config: {
-      direction: 'left',
-      swipeable: false,
-      autoPlay: false,
-      imgList: [
-        {
-          id: '1',
-          title: '趣谈小课1',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          imgUrl: [
-            {
-              uid: '001',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/1_1740bd7c3dc.png',
-            },
-          ],
-        },
-        {
-          id: '2',
-          title: '趣谈小课1',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          imgUrl: [
-            {
-              uid: '001',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/2_1740bd8d525.png',
-            },
-          ],
-        },
-      ],
-      tplImg: 'http://io.nainor.com/uploads/carousal_17442e1420f.png',
-    },
-  },
-  Text: {
-    editData: [
-      {
-        key: 'text',
-        name: '文字',
-        type: 'Text',
-      },
-      {
-        key: 'color',
-        name: '标题颜色',
-        type: 'Color',
-      },
-      {
-        key: 'fontSize',
-        name: '字体大小',
-        type: 'Number',
-      },
-      {
-        key: 'align',
-        name: '对齐方式',
-        type: 'Select',
-        range: [
-          {
-            key: 'left',
-            text: '左对齐',
-          },
-          {
-            key: 'center',
-            text: '居中对齐',
-          },
-          {
-            key: 'right',
-            text: '右对齐',
-          },
-        ],
-      },
-      {
-        key: 'lineHeight',
-        name: '行高',
-        type: 'Number',
-      },
-    ],
-    config: {
-      text: '我是文本',
-      color: 'rgba(60,60,60,1)',
-      fontSize: 18,
-      align: 'center',
-      lineHeight: 2,
-    },
-  },
-  LongText: {
-    editData: [
-      {
-        key: 'text',
-        name: '文字',
-        type: 'TextArea',
-      },
-      {
-        key: 'color',
-        name: '标题颜色',
-        type: 'Color',
-      },
-      {
-        key: 'fontSize',
-        name: '字体大小',
-        type: 'Number',
-      },
-      {
-        key: 'indent',
-        name: '首行缩进',
-        type: 'Number',
-        range: [0, 100],
-      },
-      {
-        key: 'textAlign',
-        name: '对齐方式',
-        type: 'Select',
-        range: [
-          {
-            key: 'left',
-            text: '左对齐',
-          },
-          {
-            key: 'center',
-            text: '居中对齐',
-          },
-          {
-            key: 'right',
-            text: '右对齐',
-          },
-        ],
-      },
-      {
-        key: 'lineHeight',
-        name: '行高',
-        type: 'Number',
-        step: 0.1,
-      },
-    ],
-    config: {
-      text: '我是长文本有一段故事，dooring可视化编辑器无限可能，赶快来体验吧，骚年们，奥利给~',
-      color: 'rgba(60,60,60,1)',
-      fontSize: 14,
-      indent: 20,
-      lineHeight: 1.8,
-      textAlign: 'left',
-    },
-  },
-  Tab: {
-    editData: [
-      {
-        key: 'tabs',
-        name: '项目类别',
-        type: 'MutiText',
-      },
-      {
-        key: 'activeColor',
-        name: '激活颜色',
-        type: 'Color',
-      },
-      {
-        key: 'color',
-        name: '文字颜色',
-        type: 'Color',
-      },
-      {
-        key: 'fontSize',
-        name: '文字大小',
-        type: 'Number',
-      },
-      {
-        key: 'imgSize',
-        name: '图片大小',
-        type: 'Number',
-        isCrop: true,
-        cropRate: 1,
-      },
-      {
-        key: 'sourceData',
-        name: '数据源',
-        type: 'DataList',
-      },
-    ],
-    config: {
-      tabs: ['类别一', '类别二'],
-      color: 'rgba(153,153,153,1)',
-      activeColor: 'rgba(0,102,204,1)',
-      fontSize: 16,
-      imgSize: 100,
-      sourceData: [
-        {
-          id: '1',
-          title: '趣谈小课1',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          type: 0,
-          imgUrl: [
-            {
-              uid: '001',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
-            },
-          ],
-        },
-        {
-          id: '2',
-          title: '趣谈小课2',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          type: 0,
-          imgUrl: [
-            {
-              uid: '001',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/2_1740c7033a9.png',
-            },
-          ],
-        },
-        {
-          id: '3',
-          title: '趣谈小课3',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          type: 1,
-          imgUrl: [
-            {
-              uid: '001',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
-            },
-          ],
-        },
-      ],
-    },
-  },
-  Notice: {
-    editData: [
-      {
-        key: 'text',
-        name: '文本',
-        type: 'Text',
-      },
-      // {
-      //   "key": "link",
-      //   "name": "链接",
-      //   "type": "Text"
-      // },
-      {
-        key: 'speed',
-        name: '滚动速度',
-        type: 'Number',
-      },
-      {
-        key: 'theme',
-        name: '主题',
-        type: 'Select',
-        range: [
-          {
-            key: 'default',
-            text: '默认',
-          },
-          {
-            key: 'warning',
-            text: '警告',
-          },
-          {
-            key: 'primary',
-            text: '主要',
-          },
-          {
-            key: 'success',
-            text: '成功',
-          },
-          {
-            key: 'danger',
-            text: '危险',
-          },
-        ],
-      },
-      {
-        key: 'isClose',
-        name: '是否可关闭',
-        type: 'Switch',
-      },
-    ],
-    config: {
-      text: '通知栏: 趣谈前端上线啦',
-      link: '',
-      speed: 50,
-      theme: 'warning',
-      isClose: false,
-    },
-  },
-  Qrcode: {
-    editData: [
-      {
-        key: 'qrcode',
-        name: '二维码',
-        type: 'Upload',
-        isCrop: true,
-        cropRate: 1,
-      },
-      {
-        key: 'text',
-        name: '文字',
-        type: 'Text',
-      },
-      {
-        key: 'color',
-        name: '文字颜色',
-        type: 'Color',
-      },
-      {
-        key: 'fontSize',
-        name: '文字大小',
-        type: 'Number',
-      },
-    ],
-    config: {
-      qrcode: [
-        {
-          uid: '001',
-          name: 'image.png',
-          status: 'done',
-          url: 'http://io.nainor.com/uploads/code_173e1705e0c.png',
-        },
-      ],
-      text: '二维码',
-      color: 'rgba(153,153,153,1)',
-      fontSize: 14,
-    },
-  },
-  Footer: {
-    editData: [
-      {
-        key: 'bgColor',
-        name: '背景色',
-        type: 'Color',
-      },
-      {
-        key: 'height',
-        name: '高度',
-        type: 'Number',
-      },
-      {
-        key: 'text',
-        name: '文字',
-        type: 'Text',
-      },
-      {
-        key: 'fontSize',
-        name: '字体大小',
-        type: 'Number',
-      },
-      {
-        key: 'color',
-        name: '文字颜色',
-        type: 'Color',
-      },
-      {
-        key: 'align',
-        name: '对齐方式',
-        type: 'Select',
-        range: [
-          {
-            key: 'left',
-            text: '左对齐',
-          },
-          {
-            key: 'center',
-            text: '居中对齐',
-          },
-          {
-            key: 'right',
-            text: '右对齐',
-          },
-        ],
-      },
-    ],
-    config: {
-      bgColor: 'rgba(0,0,0,1)',
-      text: '页脚Footer',
-      color: 'rgba(255,255,255,1)',
-      align: 'center',
-      fontSize: 16,
-      height: 48,
-    },
-  },
-  Image: {
-    editData: [
-      {
-        key: 'imgUrl',
-        name: '上传',
-        type: 'Upload',
-        isCrop: false,
-      },
-      {
-        key: 'round',
-        name: '圆角',
-        type: 'Number',
-      },
-    ],
-    config: {
-      imgUrl: [
-        {
-          uid: '001',
-          name: 'image.png',
-          status: 'done',
-          url: 'http://io.nainor.com/uploads/4_1740bf4535c.png',
-        },
-      ],
-      round: 0,
-    },
-  },
-  Header: {
-    editData: [
-      {
-        key: 'bgColor',
-        name: '背景色',
-        type: 'Color',
-      },
-      {
-        key: 'height',
-        name: '高度',
-        type: 'Number',
-      },
-      {
-        key: 'logo',
-        name: 'logo',
-        type: 'Upload',
-        isCrop: true,
-        cropRate: 1000 / 618,
-      },
-      {
-        key: 'logoText',
-        name: 'logo文字',
-        type: 'Text',
-      },
-      {
-        key: 'color',
-        name: '文字颜色',
-        type: 'Color',
-      },
-      {
-        key: 'fontSize',
-        name: '文字大小',
-        type: 'Number',
-      },
-    ],
-    config: {
-      bgColor: 'rgba(0,0,0,1)',
-      logo: [
-        {
-          uid: '001',
-          name: 'image.png',
-          status: 'done',
-          url: 'http://io.nainor.com/uploads/3_1740be8a482.png',
-        },
-      ],
-      logoText: '页头Header',
-      fontSize: 20,
-      color: 'rgba(255,255,255,1)',
-      height: 50,
-    },
-  },
-  List: {
-    editData: [
-      {
-        key: 'sourceData',
-        name: '数据源',
-        type: 'DataList',
-      },
-      {
-        key: 'round',
-        name: '圆角',
-        type: 'Number',
-      },
-      {
-        key: 'imgSize',
-        name: '图片大小',
-        type: 'Select',
-        range: [
-          {
-            key: 60,
-            text: '60 x 60',
-          },
-          {
-            key: 80,
-            text: '80 x 80',
-          },
-          {
-            key: 100,
-            text: '100 x 100',
-          },
-          {
-            key: 120,
-            text: '120 x 120',
-          },
-          {
-            key: 150,
-            text: '150 x 150',
-          },
-        ],
-      },
-      {
-        key: 'fontSize',
-        name: '文字大小',
-        type: 'Number',
-      },
-      {
-        key: 'color',
-        name: '文字颜色',
-        type: 'Color',
-      },
-    ],
-    config: {
-      sourceData: [
-        {
-          id: '1',
-          title: '趣谈小课',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          imgUrl: [
-            {
-              uid: '001',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
-            },
-          ],
-        },
-        {
-          id: '2',
-          title: '趣谈小课',
-          desc: '致力于打造优质小课程',
-          link: 'xxxxx',
-          imgUrl: [
-            {
-              uid: '002',
-              name: 'image.png',
-              status: 'done',
-              url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
-            },
-          ],
-        },
-      ],
-      round: 0,
-      imgSize: 80,
-      fontSize: 16,
-      color: 'rgba(153,153,153,1)',
-    },
-  },
-  Icon: {
-    editData: [
-      {
-        key: 'color',
-        name: '颜色',
-        type: 'Color',
-      },
-      {
-        key: 'size',
-        name: '大小',
-        type: 'Number',
-      },
-      {
-        key: 'spin',
-        name: '旋转动画',
-        type: 'Switch',
-      },
-      {
-        key: 'type',
-        name: '图标类型',
-        type: 'CardPicker',
-        icons: [
-          'AccountBookTwoTone',
-          'AlertTwoTone',
-          'ApiTwoTone',
-          'AppstoreTwoTone',
-          'AudioTwoTone',
-          'BankTwoTone',
-          'BellTwoTone',
-          'BookTwoTone',
-          'BugTwoTone',
-          'BuildTwoTone',
-          'BulbTwoTone',
-          'CalculatorTwoTone',
-          'CalendarTwoTone',
-          'CameraTwoTone',
-          'CarTwoTone',
-          'CarryOutTwoTone',
-          'CiCircleTwoTone',
-          'CloudTwoTone',
-          'CodeTwoTone',
-          'CrownTwoTone',
-          'CustomerServiceTwoTone',
-          'DollarCircleTwoTone',
-          'EnvironmentTwoTone',
-          'ExperimentTwoTone',
-          'FireTwoTone',
-          'GiftTwoTone',
-          'InsuranceTwoTone',
-          'LikeTwoTone',
-          'LockTwoTone',
-          'MailTwoTone',
-          'MessageTwoTone',
-          'PhoneTwoTone',
-          'PictureTwoTone',
-          'PlaySquareTwoTone',
-          'RedEnvelopeTwoTone',
-          'ShopTwoTone',
-          'TrademarkCircleTwoTone',
-          'StarTwoTone',
-          'SafetyCertificateTwoTone',
-          'SettingTwoTone',
-          'RocketTwoTone',
-        ],
-      },
-    ],
-    config: {
-      color: '',
-      size: 36,
-      spin: false,
-      type: 'CarTwoTone',
-    },
-  },
-  Video: {
-    editData: [
-      {
-        key: 'poster',
-        name: '视频封面',
-        type: 'Upload',
-      },
-      {
-        key: 'url',
-        name: '视频链接',
-        type: 'Text',
-      },
-    ],
-    config: {
-      poster: [
-        {
-          uid: '001',
-          name: 'image.png',
-          status: 'done',
-          url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
-        },
-      ],
-      url: '',
-    },
-  },
-  XProgress: {
-    editData: [
-      {
-        key: 'theme',
-        name: '主题',
-        type: 'Select',
-        range: [
-          {
-            key: 'success',
-            text: '成功',
-          },
-          {
-            key: 'warning',
-            text: '警告',
-          },
-          {
-            key: 'danger',
-            text: '危险',
-          },
-        ],
-      },
-      {
-        key: 'shape',
-        name: '形状',
-        type: 'Radio',
-        range: [
-          {
-            key: 'circle',
-            text: '圆形',
-          },
-          {
-            key: 'line',
-            text: '线形',
-          },
-          {
-            key: 'semi-circle',
-            text: '半圆形',
-          },
-        ],
-      },
-      {
-        key: 'size',
-        name: '大小',
-        type: 'Number',
-      },
-      {
-        key: 'percent',
-        name: '进度值',
-        type: 'Number',
-        range: [0, 100],
-      },
-      {
-        key: 'strokeWidth',
-        name: '线条粗细',
-        type: 'Number',
-      },
-    ],
-    config: {
-      theme: 'success',
-      shape: 'circle',
-      size: 200,
-      percent: 30,
-      strokeWidth: 10,
-    },
-  },
-  Chart: {
-    editData: [
-      {
-        key: 'title',
-        name: '标题',
-        type: 'Text',
-      },
-      {
-        key: 'size',
-        name: '标题大小',
-        type: 'Number',
-      },
-      {
-        key: 'color',
-        name: '标题颜色',
-        type: 'Color',
-      },
-      {
-        key: 'paddingTop',
-        name: '上边距',
-        type: 'Number',
-      },
-      {
-        key: 'data',
-        name: '数据源',
-        type: 'Table',
-      },
-    ],
-    config: {
-      title: '柱状图',
-      size: 14,
-      color: 'rgba(0,0,0,1)',
-      paddingTop: 10,
-      data: [
-        {
-          name: 'A',
-          value: 20,
-        },
-        {
-          name: 'B',
-          value: 60,
-        },
-        {
-          name: 'C',
-          value: 20,
-        },
-      ],
-    },
-  },
-};
-
-export default schema;
diff --git a/src/components/DynamicEngine/template.ts b/src/components/DynamicEngine/template.ts
deleted file mode 100644
index cf413d5..0000000
--- a/src/components/DynamicEngine/template.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import { BasicTemplateItem } from './schema';
-
-export type TemplateKeyType =
-  | 'Text'
-  | 'LongText'
-  | 'Carousel'
-  | 'Tab'
-  | 'Notice'
-  | 'Qrcode'
-  | 'Icon'
-  | 'Image'
-  | 'Header'
-  | 'List'
-  | 'Footer';
-
-export type TemplateType = Array<BasicTemplateItem<TemplateKeyType>>;
-
-const template: TemplateType = [
-  {
-    type: 'Text',
-    h: 20,
-  },
-  {
-    type: 'LongText',
-    h: 36,
-  },
-  {
-    type: 'Carousel',
-    h: 82,
-  },
-  {
-    type: 'Tab',
-    h: 130,
-  },
-  {
-    type: 'Notice',
-    h: 20,
-  },
-  {
-    type: 'Qrcode',
-    h: 150,
-  },
-  {
-    type: 'Icon',
-    h: 23,
-  },
-  {
-    type: 'Image',
-    h: 188,
-  },
-  {
-    type: 'Header',
-    h: 28,
-  },
-  {
-    type: 'List',
-    h: 110,
-  },
-  {
-    type: 'Footer',
-    h: 24,
-  },
-];
-
-export default template;
diff --git a/src/components/ErrorBundaries/index.tsx b/src/components/ErrorBundaries/index.tsx
index 8d11e9e..8de0f26 100644
--- a/src/components/ErrorBundaries/index.tsx
+++ b/src/components/ErrorBundaries/index.tsx
@@ -1,12 +1,16 @@
-import React from 'react';
+import React, { ErrorInfo, PropsWithChildren } from 'react';
 
-class ErrorBoundary extends React.Component<any, any> {
-  constructor(props: any) {
+interface ErrorBoundaryState {
+  hasError: boolean;
+}
+
+class ErrorBoundary extends React.Component<PropsWithChildren<{}>, ErrorBoundaryState> {
+  constructor(props: PropsWithChildren<{}>) {
     super(props);
     this.state = { hasError: false };
   }
 
-  componentDidCatch(error: any, info: any) {
+  componentDidCatch(_error: Error, _info: ErrorInfo) {
     // Display fallback UI
     this.setState({ hasError: true });
     // You can also log the error to an error reporting service
diff --git a/src/components/PanelComponents/FormEditor/index.tsx b/src/components/PanelComponents/FormEditor/index.tsx
index 2296093..a699ee3 100644
--- a/src/components/PanelComponents/FormEditor/index.tsx
+++ b/src/components/PanelComponents/FormEditor/index.tsx
@@ -8,6 +8,7 @@ import CardPicker from '../CardPicker';
 import Table from '../Table';
 import { Store } from 'antd/lib/form/interface';
 import { BasicRangeType, IconSchema } from '../../DynamicEngine/schema';
+import FormItems from '../FormItems';
 // import styles from './index.less';
 const normFile = (e: any) => {
   console.log('Upload event:', e);
@@ -51,7 +52,6 @@ const FormEditor = (props: FormEditorProps) => {
       form.resetFields();
     };
   }, [defaultValue]);
-
   return (
     <Form
       form={form}
@@ -147,6 +147,11 @@ const FormEditor = (props: FormEditorProps) => {
                 <Table data={item.data} />
               </Form.Item>
             )}
+            {item.type === 'FormItems' && (
+              <Form.Item label={item.name} name={item.key} valuePropName="formList">
+                <FormItems data={item.data} />
+              </Form.Item>
+            )}
           </React.Fragment>
         );
       })}
diff --git a/src/components/PanelComponents/FormEditor/types.ts b/src/components/PanelComponents/FormEditor/types.ts
new file mode 100644
index 0000000..75098ec
--- /dev/null
+++ b/src/components/PanelComponents/FormEditor/types.ts
@@ -0,0 +1,14 @@
+export interface ItextAreaConfigType {
+  key: string;
+  name: string;
+  type: 'TextArea';
+}
+export type TtextAreaDefaultType = string;
+
+export interface InumberConfigType {
+  key: string;
+  name: string;
+  type: 'Number';
+  range?: [number, number];
+  step?: number;
+}
diff --git a/src/components/BasicShop/BasicComponents/Form/EditorModal.js b/src/components/PanelComponents/FormItems/EditorModal.tsx
similarity index 100%
rename from src/components/BasicShop/BasicComponents/Form/EditorModal.js
rename to src/components/PanelComponents/FormItems/EditorModal.tsx
diff --git a/src/components/BasicShop/BasicComponents/Form/FormItems.js b/src/components/PanelComponents/FormItems/FormItems.tsx
similarity index 97%
rename from src/components/BasicShop/BasicComponents/Form/FormItems.js
rename to src/components/PanelComponents/FormItems/FormItems.tsx
index b9f6f63..9834e4b 100644
--- a/src/components/BasicShop/BasicComponents/Form/FormItems.js
+++ b/src/components/PanelComponents/FormItems/FormItems.tsx
@@ -1,5 +1,5 @@
 import React, { memo, useState, useEffect } from 'react';
-import BaseForm from './BaseForm';
+import BaseForm from '../../BasicShop/BasicComponents/Form/BaseForm';
 import EditorModal from './EditorModal';
 
 import { EditOutlined, MinusCircleOutlined } from '@ant-design/icons';
@@ -55,6 +55,7 @@ const formTpl = [
 
 const FormItems = props => {
   const { formList, onChange } = props;
+  console.log(props);
   const [formData, setFormData] = useState(formList || []);
   const [visible, setVisible] = useState(false);
   const [curItem, setCurItem] = useState();
diff --git a/src/components/BasicShop/BasicComponents/Form/formItems.less b/src/components/PanelComponents/FormItems/formItems.less
similarity index 100%
rename from src/components/BasicShop/BasicComponents/Form/formItems.less
rename to src/components/PanelComponents/FormItems/formItems.less
diff --git a/src/components/PanelComponents/FormItems/index.tsx b/src/components/PanelComponents/FormItems/index.tsx
new file mode 100644
index 0000000..9c70a18
--- /dev/null
+++ b/src/components/PanelComponents/FormItems/index.tsx
@@ -0,0 +1,2 @@
+import FormItems from './FormItems';
+export default FormItems;
diff --git a/src/components/PanelComponents/Table/index.tsx b/src/components/PanelComponents/Table/index.tsx
index e7d660c..09251b4 100644
--- a/src/components/PanelComponents/Table/index.tsx
+++ b/src/components/PanelComponents/Table/index.tsx
@@ -134,13 +134,14 @@ class EditableTable extends React.Component<any, any> {
         render: (text: string, record) =>
           this.state.dataSource.length >= 1 ? (
             <Popconfirm title="Sure to delete?" onConfirm={() => this.handleDelete(record.key)}>
-              <span>删除</span>
+              <Button type="link">删除</Button>
             </Popconfirm>
           ) : null,
       },
     ];
 
-    const dataSource = props.data.map((item: any, i: number) => ({ key: i + '', ...item }));
+    const dataSource =
+      props.data && props.data.map((item: any, i: number) => ({ key: i + '', ...item }));
 
     this.state = {
       dataSource: dataSource,
diff --git a/src/components/PanelComponents/Upload/index.tsx b/src/components/PanelComponents/Upload/index.tsx
index bed62d7..641f523 100644
--- a/src/components/PanelComponents/Upload/index.tsx
+++ b/src/components/PanelComponents/Upload/index.tsx
@@ -4,9 +4,7 @@ import { PlusOutlined } from '@ant-design/icons';
 import ImgCrop from 'antd-img-crop';
 import styles from './index.less';
 import { UploadFile, UploadChangeParam, RcFile } from 'antd/lib/upload/interface';
-
-const isDev = process.env.NODE_ENV === 'development';
-
+import { isDev } from '@/utils/tool';
 function getBase64(file: File | Blob) {
   return new Promise<string>((resolve, reject) => {
     const reader = new FileReader();
diff --git a/src/components/Zan/index.tsx b/src/components/Zan/index.tsx
index 130dbc5..dd4154b 100644
--- a/src/components/Zan/index.tsx
+++ b/src/components/Zan/index.tsx
@@ -2,9 +2,10 @@ import React, { memo } from 'react';
 import { Button, Popover } from 'antd';
 import styles from './index.less';
 
+///这组件写的有问题  popover会重定位
 const content = (
   <div className={styles.imgWrap}>
-    <img src="http://io.nainor.com/uploads/WechatIMG2_1742b586c3d.jpeg" />
+    <img src="http://io.nainor.com/uploads/WechatIMG2_1742b586c3d.jpeg" alt="sponsorship" />
   </div>
 );
 
diff --git a/src/pages/editor/Container.js b/src/pages/editor/Container.js
index c83c085..0c89388 100644
--- a/src/pages/editor/Container.js
+++ b/src/pages/editor/Container.js
@@ -14,10 +14,10 @@ import TargetBox from './TargetBox';
 import Calibration from 'components/Calibration';
 import DynamicEngine from 'components/DynamicEngine';
 import FormEditor from 'components/PanelComponents/FormEditor';
-import template from 'components/DynamicEngine/template';
-import mediaTpl from 'components/DynamicEngine/mediaTpl';
-import graphTpl from 'components/DynamicEngine/graphTpl';
-import schema from 'components/DynamicEngine/schema';
+import template from 'components/BasicShop/BasicComponents/template';
+import mediaTpl from 'components/BasicShop/MediaComponents/template';
+import graphTpl from 'components/BasicShop/VisualComponents/template';
+import schema from 'components/BasicShop/schema';
 import { ActionCreators } from 'redux-undo';
 
 import styles from './index.less';
@@ -63,7 +63,6 @@ const Container = props => {
       setScale(prev => (prev <= 0.5 ? 0.5 : prev - 0.1));
     }
   };
-
   const handleFormSave = data => {
     dispatch({
       type: 'editorModal/modPointData',
@@ -90,7 +89,7 @@ const Container = props => {
   useEffect(() => {
     if (window.innerWidth < 1024) {
       props.history.push('/mobileTip');
-    }
+    } //待修改
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -135,16 +134,18 @@ const Container = props => {
           <div className={styles.componentList}>
             <Tabs defaultActiveKey="1">
               <TabPane tab={generateHeader('base', '基础组件')} key="1">
-                {template.map((value, i) => (
-                  <TargetBox item={value} key={i} canvasId={canvasId}>
-                    <DynamicEngine
-                      {...value}
-                      config={schema[value.type].config}
-                      componentsType="base"
-                      isTpl={true}
-                    />
-                  </TargetBox>
-                ))}
+                {template.map((value, i) => {
+                  return (
+                    <TargetBox item={value} key={i} canvasId={canvasId}>
+                      <DynamicEngine
+                        {...value}
+                        config={schema[value.type].config}
+                        componentsType="base"
+                        isTpl={true}
+                      />
+                    </TargetBox>
+                  );
+                })}
               </TabPane>
               <TabPane tab={generateHeader('media', '媒体组件')} key="2">
                 {mediaTpl.map((value, i) => (
diff --git a/src/pages/editor/SourceBox.js b/src/pages/editor/SourceBox.js
index 26b4295..44a9954 100644
--- a/src/pages/editor/SourceBox.js
+++ b/src/pages/editor/SourceBox.js
@@ -79,7 +79,6 @@ const SourceBox = memo(props => {
       window.clearTimeout(timer);
     };
   }, []);
-
   const opacity = isOver ? 0.7 : 1;
   const backgroundColor = isOver ? 1 : 0.7;
   return (
diff --git a/src/pages/editor/TargetBox.js b/src/pages/editor/TargetBox.js
index 74c2ab0..ca5f2aa 100644
--- a/src/pages/editor/TargetBox.js
+++ b/src/pages/editor/TargetBox.js
@@ -1,7 +1,6 @@
 import React, { useMemo, memo } from 'react';
 import { useDrag } from 'react-dnd';
-import schema from 'components/DynamicEngine/schema';
-
+import schema from 'components/BasicShop/schema';
 import styles from './index.less';
 
 const TargetBox = memo(props => {
@@ -12,6 +11,7 @@ const TargetBox = memo(props => {
       config: schema[item.type].config,
       h: item.h,
       editableEl: schema[item.type].editData,
+      category: item.category,
     },
     collect: monitor => ({
       isDragging: monitor.isDragging(),
diff --git a/src/pages/editor/index.less b/src/pages/editor/index.less
index 51900ee..258119a 100644
--- a/src/pages/editor/index.less
+++ b/src/pages/editor/index.less
@@ -1,30 +1,30 @@
-.layout{
+.layout {
   .editorWrap {
-    background-color: rgba(245,245,245,1);
+    background-color: rgba(245, 245, 245, 1);
   }
   .container {
     width: 100vw;
     // height: 100vh;
     display: flex;
-    .list{
+    .list {
       width: 350px;
       height: 100vh;
       padding: 10px 16px 16px;
-      box-shadow: 2px 0px 10px rgba(0,0,0,0.2);
+      box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);
       display: inline-block;
       background-color: #fff;
       overflow: scroll;
       .searchBar {
         margin-bottom: 20px;
       }
-      .module{
+      .module {
         position: relative;
         margin-bottom: 12px;
         width: 100%;
         overflow: hidden;
         user-select: none;
         border: 2px solid transparent;
-        transition: border .3s;
+        transition: border 0.3s;
         &:hover {
           border: 2px solid #06c;
         }
@@ -39,7 +39,7 @@
         }
       }
     }
-    .tickMark{
+    .tickMark {
       width: calc(100% - 750px);
       overflow: hidden;
       height: 100vh;
@@ -58,7 +58,7 @@
         bottom: 0;
         left: 0;
       }
-      .canvasBox{
+      .canvasBox {
         width: 375px;
         min-height: 664px;
         height: 664px;
@@ -66,18 +66,18 @@
         left: 50%;
         margin-left: -200px;
         top: 80px;
-        .canvas{
+        .canvas {
           position: relative;
           width: 375px;
           min-height: 664px;
           background-color: #fff;
-          box-shadow: 2px 0px 10px rgba(0,0,0,0.2);
+          box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);
           position: absolute;
           left: 0;
           top: 0;
           transition: transform 300ms ease-out;
           .dragItem {
-            display: inline-block; 
+            display: inline-block;
             position: absolute;
             z-index: 2;
             border: 2px solid transparent;
@@ -104,7 +104,7 @@
         }
         .sliderBtn {
           cursor: pointer;
-          user-select:none;
+          user-select: none;
         }
         span {
           margin: 0 12px;
@@ -122,9 +122,10 @@
     .attrSetting {
       width: 400px;
       padding: 20px 0 20px 20px;
-      background:#fff;
+      background: #fff;
       height: 100vh;
-      box-shadow:-2px 0px 4px 0px rgba(0,0,0,0.1);
+      box-shadow: -2px 0px 4px 0px rgba(0, 0, 0, 0.1);
+      overflow: scroll;
       .tit {
         margin-bottom: 16px;
         font-size: 18px;
@@ -135,7 +136,7 @@
         .posItem {
           margin-bottom: 12px;
           font-size: 14px;
-          color: rgba(0,0,0, .5);
+          color: rgba(0, 0, 0, 0.5);
           .posTit {
             margin-right: 50px;
           }
@@ -144,7 +145,7 @@
             color: #000;
             &::before {
               content: attr(data-flag);
-              color: rgba(0,0,0,.4);
+              color: rgba(0, 0, 0, 0.4);
               margin-right: 8px;
             }
           }
@@ -159,7 +160,7 @@
             .iptLabel {
               width: 108px;
               flex-shrink: 0;
-              color: rgba(0,0,0,.5);
+              color: rgba(0, 0, 0, 0.5);
             }
             .cpSelector {
               img {
@@ -190,8 +191,3 @@
     }
   }
 }
-
-
-
-
-
diff --git a/yarn.lock b/yarn.lock
index 147cf88..1fd9bfa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1643,6 +1643,27 @@
     "@types/yargs" "^15.0.0"
     chalk "^3.0.0"
 
+"@nodelib/fs.scandir@2.1.3":
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz#3a582bdb53804c6ba6d146579c46e52130cf4a3b"
+  integrity sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==
+  dependencies:
+    "@nodelib/fs.stat" "2.0.3"
+    run-parallel "^1.1.9"
+
+"@nodelib/fs.stat@2.0.3", "@nodelib/fs.stat@^2.0.2":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz#34dc5f4cabbc720f4e60f75a747e7ecd6c175bd3"
+  integrity sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==
+
+"@nodelib/fs.walk@^1.2.3":
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz#011b9202a70a6366e436ca5c065844528ab04976"
+  integrity sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==
+  dependencies:
+    "@nodelib/fs.scandir" "2.1.3"
+    fastq "^1.6.0"
+
 "@npmcli/move-file@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@npmcli/move-file/-/move-file-1.0.1.tgz#de103070dac0f48ce49cf6693c23af59c0f70464"
@@ -1907,11 +1928,6 @@
   resolved "https://registry.yarnpkg.com/@types/ejs/-/ejs-3.0.4.tgz#8851fcdedb96e410fbb24f83b8be6763ef9afa77"
   integrity sha512-ZxnwyBGO4KX/82AsFHTX82eMw0PsoBcIngEat+zx0y+3yxoNDJucAihg9nAcrc+g4Cwiv/4WcWsX4oiy0ySrRQ==
 
-"@types/eslint-visitor-keys@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#1ee30d79544ca84d68d4b3cdb0af4f205663dd2d"
-  integrity sha512-OCutwjDZ4aFS6PB1UZ988C4YgwlBHJd6wCeQqaLdmadZ/7e+w79+hbMUFC1QXDNCmdyoRfAFdm0RypzwR+Qpag==
-
 "@types/estree@*":
   version "0.0.45"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.45.tgz#e9387572998e5ecdac221950dab3e8c3b16af884"
@@ -2428,49 +2444,76 @@
   dependencies:
     "@types/yargs-parser" "*"
 
-"@typescript-eslint/eslint-plugin@2.x":
-  version "2.34.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-2.34.0.tgz#6f8ce8a46c7dea4a6f1d171d2bb8fbae6dac2be9"
-  integrity sha512-4zY3Z88rEE99+CNvTbXSyovv2z9PNOVffTWD2W8QF5s2prBQtwN2zadqERcrHpcR7O/+KMI3fcTAmUUhK/iQcQ==
+"@typescript-eslint/eslint-plugin@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.1.1.tgz#78d5b18e259b13c2f4ec41dd9105af269a161a75"
+  integrity sha512-Hoxyt99EA9LMmqo/5PuWWPeWeB3mKyvibfJ1Hy5SfiUpjE8Nqp+5QNd9fOkzL66+fqvIWSIE+Ett16LGMzCGnQ==
   dependencies:
-    "@typescript-eslint/experimental-utils" "2.34.0"
+    "@typescript-eslint/experimental-utils" "4.1.1"
+    "@typescript-eslint/scope-manager" "4.1.1"
+    debug "^4.1.1"
     functional-red-black-tree "^1.0.1"
     regexpp "^3.0.0"
+    semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/experimental-utils@2.34.0":
-  version "2.34.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.34.0.tgz#d3524b644cdb40eebceca67f8cf3e4cc9c8f980f"
-  integrity sha512-eS6FTkq+wuMJ+sgtuNTtcqavWXqsflWcfBnlYhg/nS4aZ1leewkXGbvBhaapn1q6qf4M71bsR1tez5JTRMuqwA==
+"@typescript-eslint/experimental-utils@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.1.1.tgz#52ff4e37c93113eb96385a4e6d075abece1ea72d"
+  integrity sha512-jzYsNciHoa4Z3c1URtmeT/bamYm8Dwfw6vuN3WHIE/BXb1iC4KveAnXDErTAZtPVxTYBaYn3n2gbt6F6D2rm1A==
   dependencies:
     "@types/json-schema" "^7.0.3"
-    "@typescript-eslint/typescript-estree" "2.34.0"
+    "@typescript-eslint/scope-manager" "4.1.1"
+    "@typescript-eslint/types" "4.1.1"
+    "@typescript-eslint/typescript-estree" "4.1.1"
     eslint-scope "^5.0.0"
     eslint-utils "^2.0.0"
 
-"@typescript-eslint/parser@2.x":
-  version "2.34.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-2.34.0.tgz#50252630ca319685420e9a39ca05fe185a256bc8"
-  integrity sha512-03ilO0ucSD0EPTw2X4PntSIRFtDPWjrVq7C3/Z3VQHRC7+13YB55rcJI3Jt+YgeHbjUdJPcPa7b23rXCBokuyA==
-  dependencies:
-    "@types/eslint-visitor-keys" "^1.0.0"
-    "@typescript-eslint/experimental-utils" "2.34.0"
-    "@typescript-eslint/typescript-estree" "2.34.0"
-    eslint-visitor-keys "^1.1.0"
-
-"@typescript-eslint/typescript-estree@2.34.0":
-  version "2.34.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-2.34.0.tgz#14aeb6353b39ef0732cc7f1b8285294937cf37d5"
-  integrity sha512-OMAr+nJWKdlVM9LOqCqh3pQQPwxHAN7Du8DR6dmwCrAmxtiXQnhHJ6tBNtf+cggqfo51SG/FCwnKhXCIM7hnVg==
+"@typescript-eslint/parser@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-4.1.1.tgz#324b4b35e314075adbc92bd8330cf3ef0c88cf3e"
+  integrity sha512-NLIhmicpKGfJbdXyQBz9j48PA6hq6e+SDOoXy7Ak6bq1ebGqbgG+fR1UIDAuay6OjQdot69c/URu2uLlsP8GQQ==
   dependencies:
+    "@typescript-eslint/scope-manager" "4.1.1"
+    "@typescript-eslint/types" "4.1.1"
+    "@typescript-eslint/typescript-estree" "4.1.1"
     debug "^4.1.1"
-    eslint-visitor-keys "^1.1.0"
-    glob "^7.1.6"
+
+"@typescript-eslint/scope-manager@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.1.1.tgz#bdb8526e82435f32b4ccd9dd4cec01af97b48850"
+  integrity sha512-0W8TTobCvIIQ2FsrYTffyZGAAFUyIbEHq5EYJb1m7Rpd005jrnOvKOo8ywCLhs/Bm17C+KsrUboBvBAARQVvyA==
+  dependencies:
+    "@typescript-eslint/types" "4.1.1"
+    "@typescript-eslint/visitor-keys" "4.1.1"
+
+"@typescript-eslint/types@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.1.1.tgz#57500c4a86b28cb47094c1a62f1177ea279a09cb"
+  integrity sha512-zrBiqOKYerMTllKcn+BP+i1b7LW/EbMMYytroXMxUTvFPn1smkCu0D7lSAx29fTUO4jnwV0ljSvYQtn2vNrNxA==
+
+"@typescript-eslint/typescript-estree@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.1.1.tgz#2015a84d71303ecdb6f46efd807ac19a51aab490"
+  integrity sha512-2AUg5v0liVBsqbGxBphbJ0QbGqSRVaF5qPoTPWcxop+66vMdU1h4CCvHxTC47+Qb+Pr4l2RhXDd41JNpwcQEKw==
+  dependencies:
+    "@typescript-eslint/types" "4.1.1"
+    "@typescript-eslint/visitor-keys" "4.1.1"
+    debug "^4.1.1"
+    globby "^11.0.1"
     is-glob "^4.0.1"
     lodash "^4.17.15"
     semver "^7.3.2"
     tsutils "^3.17.1"
 
+"@typescript-eslint/visitor-keys@4.1.1":
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.1.1.tgz#bb05664bf4bea28dc120d1da94f3027d42ab0f6f"
+  integrity sha512-/EOOXbA2ferGLG6RmCHEQ0lTTLkOlXYDgblCmQk3tIU7mTPLm4gKhFMeeUSe+bcchTUsKeCk8xcpbop5Zr/8Rw==
+  dependencies:
+    "@typescript-eslint/types" "4.1.1"
+    eslint-visitor-keys "^2.0.0"
+
 "@umijs/ast@3.2.20":
   version "3.2.20"
   resolved "https://registry.yarnpkg.com/@umijs/ast/-/ast-3.2.20.tgz#d76835dcbfcd3d0310b3ac728d0ee90797196ef2"
@@ -3418,6 +3461,11 @@ array-union@^1.0.1:
   dependencies:
     array-uniq "^1.0.1"
 
+array-union@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
+  integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==
+
 array-uniq@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/array-uniq/-/array-uniq-1.0.3.tgz#af6ac877a25cc7f74e058894753858dfdb24fdb6"
@@ -5357,6 +5405,13 @@ dir-glob@^2.0.0:
   dependencies:
     path-type "^3.0.0"
 
+dir-glob@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f"
+  integrity sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==
+  dependencies:
+    path-type "^4.0.0"
+
 dnd-core@^11.1.3:
   version "11.1.3"
   resolved "https://registry.yarnpkg.com/dnd-core/-/dnd-core-11.1.3.tgz#f92099ba7245e49729d2433157031a6267afcc98"
@@ -5930,6 +5985,11 @@ eslint-visitor-keys@^1.0.0, eslint-visitor-keys@^1.1.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e"
   integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==
 
+eslint-visitor-keys@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.0.0.tgz#21fdc8fbcd9c795cc0321f0563702095751511a8"
+  integrity sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ==
+
 eslint@6.x:
   version "6.8.0"
   resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.8.0.tgz#62262d6729739f9275723824302fb227c8c93ffb"
@@ -6257,6 +6317,18 @@ fast-deep-equal@^3.1.1:
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
   integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
 
+fast-glob@^3.1.1:
+  version "3.2.4"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.4.tgz#d20aefbf99579383e7f3cc66529158c9b98554d3"
+  integrity sha512-kr/Oo6PX51265qeuCYsyGypiO5uJFgBS0jksyG7FUeCyQzNwYnzrNIMR1NXfkZXsMYXYLRAHgISHBz8gQcxKHQ==
+  dependencies:
+    "@nodelib/fs.stat" "^2.0.2"
+    "@nodelib/fs.walk" "^1.2.3"
+    glob-parent "^5.1.0"
+    merge2 "^1.3.0"
+    micromatch "^4.0.2"
+    picomatch "^2.2.1"
+
 fast-json-stable-stringify@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
@@ -6267,6 +6339,13 @@ fast-levenshtein@~2.0.6:
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
 
+fastq@^1.6.0:
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.8.0.tgz#550e1f9f59bbc65fe185cb6a9b4d95357107f481"
+  integrity sha512-SMIZoZdLh/fgofivvIkmknUXyPnvxRE3DhtZ5Me3Mrsk5gyPL42F0xr51TdRXskBxHfMp+07bcYzfsYEsSQA9Q==
+  dependencies:
+    reusify "^1.0.4"
+
 faye-websocket@^0.10.0:
   version "0.10.0"
   resolved "https://registry.yarnpkg.com/faye-websocket/-/faye-websocket-0.10.0.tgz#4e492f8d04dfb6f89003507f6edbf2d501e7c6f4"
@@ -6700,14 +6779,14 @@ glob-parent@^3.1.0:
     is-glob "^3.1.0"
     path-dirname "^1.0.0"
 
-glob-parent@^5.0.0, glob-parent@~5.1.0:
+glob-parent@^5.0.0, glob-parent@^5.1.0, glob-parent@~5.1.0:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.1.tgz#b6c1ef417c4e5663ea498f1c45afac6916bbc229"
   integrity sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==
   dependencies:
     is-glob "^4.0.1"
 
-glob@7.1.6, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6:
+glob@7.1.6, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4:
   version "7.1.6"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6"
   integrity sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==
@@ -6739,6 +6818,18 @@ globals@^12.1.0:
   dependencies:
     type-fest "^0.8.1"
 
+globby@^11.0.1:
+  version "11.0.1"
+  resolved "https://registry.yarnpkg.com/globby/-/globby-11.0.1.tgz#9a2bf107a068f3ffeabc49ad702c79ede8cfd357"
+  integrity sha512-iH9RmgwCmUJHi2z5o2l3eTtGBtXek1OYlHrbcxOYugyHLmAsZrPj43OtHThd62Buh/Vv6VyCBD2bdyWcGNQqoQ==
+  dependencies:
+    array-union "^2.1.0"
+    dir-glob "^3.0.1"
+    fast-glob "^3.1.1"
+    ignore "^5.1.4"
+    merge2 "^1.3.0"
+    slash "^3.0.0"
+
 globby@^7.1.1:
   version "7.1.1"
   resolved "https://registry.yarnpkg.com/globby/-/globby-7.1.1.tgz#fb2ccff9401f8600945dfada97440cca972b8680"
@@ -7176,6 +7267,11 @@ ignore@^4.0.6:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
   integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
 
+ignore@^5.1.4:
+  version "5.1.8"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57"
+  integrity sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==
+
 image-size@~0.5.0:
   version "0.5.5"
   resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.5.5.tgz#09dfd4ab9d20e29eb1c3e80b8990378df9e3cb9c"
@@ -9103,6 +9199,11 @@ merge-stream@2.0.0, merge-stream@^2.0.0:
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
   integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==
 
+merge2@^1.3.0:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
+  integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
+
 methods@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
@@ -12182,6 +12283,11 @@ ret@~0.1.10:
   resolved "https://registry.yarnpkg.com/ret/-/ret-0.1.15.tgz#b8a4825d5bdb1fc3f6f53c2bc33f81388681c7bc"
   integrity sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==
 
+reusify@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
+  integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
+
 rgb-regex@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/rgb-regex/-/rgb-regex-1.0.1.tgz#c0e0d6882df0e23be254a475e8edd41915feaeb1"
@@ -12383,6 +12489,11 @@ run-async@^2.4.0:
   resolved "https://registry.yarnpkg.com/run-async/-/run-async-2.4.1.tgz#8440eccf99ea3e70bd409d49aab88e10c189a455"
   integrity sha512-tvVnVv01b8c1RrA6Ep7JkStj85Guv/YrMcwqYQnwjsAS2cTmmPGBBjAjpCW7RrSodNSoE2/qg9O4bceNvUuDgQ==
 
+run-parallel@^1.1.9:
+  version "1.1.9"
+  resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.1.9.tgz#c9dd3a7cf9f4b2c4b6244e173a6ed866e61dd679"
+  integrity sha512-DEqnSRTDw/Tc3FXf49zedI638Z9onwUotBMiUFKmrO2sdFKIbXamXGQ3Axd4qgphxKB4kw/qP1w5kTxnfU1B9Q==
+
 run-queue@^1.0.0, run-queue@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/run-queue/-/run-queue-1.0.3.tgz#e848396f057d223f24386924618e25694161ec47"