Merge branch 'feat/joint-editor' of gitlab.alibaba-inc.com:ali-lowcode/ali-lowcode-engine into feat/joint-editor

packages/editor/package.json

@@ -23,7 +23,7 @@
     "store": "^2.0.12"
   },
   "devDependencies": {
-    "@ice/spec": "^0.1.1",
+    "@ice/spec": "^1.0.1",
     "@types/debug": "^4.1.5",
     "@types/events": "^3.0.0",
     "@types/react": "^16.8.3",

packages/editor/src/config/components.js

@@ -13,11 +13,13 @@ import Settings from '../../../plugin-settings';
 import undoRedo from '../plugins/undoRedo';
 import Designer from '../plugins/designer';
 import logo from '../plugins/logo';
+import save from '../plugins/save';
 
 import PluginFactory from '../framework/pluginFactory';
 
 export default {
   logo: PluginFactory(logo),
+  save: PluginFactory(save),
   designer: PluginFactory(Designer),
   settings: PluginFactory(Settings),
   undoRedo: PluginFactory(undoRedo),

packages/editor/src/config/skeleton.js

@@ -69,6 +69,35 @@ export default {
         },
         pluginProps: {}
       },
+      {
+        pluginKey: 'topLinkIcon',
+        type: 'LinkIcon',
+        props: {
+          align: 'left',
+          title: 'link',
+          icon: 'dengpao',
+          linkProps: {
+            href: '//www.taobao.com',
+            target: 'blank'
+          }
+        },
+        config: {},
+        pluginProps: {}
+      },
+      {
+        pluginKey: 'topIcon',
+        type: 'Icon',
+        props: {
+          align: 'left',
+          title: 'icon',
+          icon: 'dengpao',
+          onClick(editor) {
+            alert(`icon addon invoke, current activeKey: ${editor.activeKey}`);
+          }
+        },
+        config: {},
+        pluginProps: {}
+      },
       {
         pluginKey: 'undoRedo',
         type: 'Custom',
@@ -89,33 +118,16 @@ export default {
         }
       },
       {
-        pluginKey: 'topLinkIcon',
-        type: 'LinkIcon',
+        pluginKey: 'save',
+        type: 'Custom',
         props: {
           align: 'right',
-          title: 'link',
-          icon: 'dengpao',
-          linkProps: {
-            href: '//www.taobao.com',
-            target: 'blank'
-          }
+          width: 64
         },
-        config: {},
-        pluginProps: {}
-      },
-      {
-        pluginKey: 'topIcon',
-        type: 'Icon',
-        props: {
-          align: 'right',
-          title: 'icon',
-          icon: 'dengpao',
-          onClick(editor) {
-            alert(`icon addon invoke, current activeKey: ${editor.activeKey}`);
-          }
-        },
-        config: {},
-        pluginProps: {}
+        config: {
+          package: '@ali/lowcode-plugin-save',
+          version: '1.0.0'
+        }
       }
     ],
     leftArea: [

packages/editor/src/plugins/save/index.scss

@@ -0,0 +1,3 @@
+.lowcode-plugin-save {
+  padding: 10px 4px;
+}

packages/editor/src/plugins/save/index.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import {Button} from '@alifd/next';
+import './index.scss';
+import { PluginProps } from '../../framework/definitions';
+
+
+
+const Save: React.FC<PluginProps> = (props): React.ReactElement => {
+  const handleClick = (): void => {
+    console.log('save data:', props.editor.designer.currentDocument.schema);
+  };
+
+  return (
+    <div className="lowcode-plugin-save">
+      <Button type="primary" onClick={handleClick}>保存</Button>
+    </div>
+  );
+};
+
+export default Save;

packages/editor/src/skeleton/layouts/TopArea/index.scss

@@ -21,7 +21,7 @@
   }
   .right-area {
     position: absolute;
-    right: 12px;
+    right: 0;
     top: 0;
     padding: 0 16px;
     height: 100%;