feat(vue3-core): 完成 @lljj/vue3-form-element package，更新文档

re #27

ci(workflow): 更新workflow

Author: lljj-x

.github/workflows/dev-docs-demo.yml

@@ -0,0 +1,43 @@
+name: Deploy docs
+
+on:
+  push:
+    branches: [ master-dev ]
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout # checkout
+      uses: actions/checkout@v2
+
+    - name: Setup node
+      uses: actions/setup-node@v1
+      with:
+        node-version: "12.x"
+
+    - name: Install yarn
+      run: npm install -g yarn
+
+    - name: Build
+      run: |
+        yarn install
+        yarn run demo:build
+        yarn run demo3:build
+
+    - name: Setup aliyun oss
+      # 设置阿里云OSS配置
+      uses: manyuanrong/setup-ossutil@v2.0
+      with:
+        endpoint: "oss-cn-hongkong.aliyuncs.com"
+        access-key-id: ${{ secrets.OSS_ACCESSKEYID }}
+        access-key-secret: ${{ secrets.OSS_ACCESSKEYSECRET }}
+
+    - name: Deploy demo-v2
+      # 发布demo-v2
+      run: ossutil cp -rf ./packages/demo/demo-v2/dist/ oss://dev-form/
+
+    - name: Deploy demo-v3
+      # 发布demo-v3
+      run: ossutil cp -rf ./packages/demo/demo-v3/dist/v3 oss://dev-form/v3

.github/workflows/docs-demo.yml

@@ -22,6 +22,7 @@ jobs:
         yarn install
         yarn run docs:build
         yarn run demo:build
+        yarn run demo3:build
 
     - name: Setup aliyun oss
       # 设置阿里云OSS配置
@@ -38,3 +39,7 @@ jobs:
     - name: Deploy demo
       # 发布demo
       run: ossutil cp -rf ./packages/demo/demo-v2/dist/ oss://form-buhuida/
+
+    - name: Deploy demo-v3
+        # 发布demo-v3
+      run: ossutil cp -rf ./packages/demo/demo-v3/dist/v3 oss://form-buhuida/v3

README.md

@@ -1,13 +1,14 @@
-# vue-json-schema-form
-* 基于 `Vue`、`ElementUi`、`JSON Schema` 动态生成一个带完整校验的Form表单
-* 支持通过 [可视化Schema编辑器](https://form.lljj.me/schema-generator.html "Vue JSON Schema Form 可视化编辑器") 快速生成表单对应Schema
-* :star2: :star2: :star2: 你的 `star` 就是最大的支持
+## vue-json-schema-form
 
-## 快速体验
-* [查看文档](https://vue-json-schema-form.lljj.me/ "Vue JSON Schema Docs")
-* [Playground 演示](https://form.lljj.me/ "Vue JSON Schema Form Demo") / [可视化表单Schema编辑器](https://form.lljj.me/schema-generator.html "Vue JSON Schema Form 可视化编辑器") / [可视化活动编辑器](https://form.lljj.me/vue-editor.html)
+基于 Vue2 / Vue3、 [JSON Schema](https://json-schema.org/understanding-json-schema/index.html) 生成带完整校验的Form表单，你的 :star2: :star2: :star2: 就是最大的支持
 
-> 查看如何启动 [Playground,表单Schema生成器,活动编辑器相关页面](#如何启动相关编辑器页面)
+[查看文档](https://vue-json-schema-form.lljj.me) - [Playground](https://form.lljj.me) - [可视化表单Schema生成器](https://form.lljj.me/schema-generator.html)
+
+## ui框架支持
+* [vue2 ElementUi](https://github.com/lljj-x/vue-json-schema-form/tree/master/packages/lib/vue2/vue2-form-element)
+* [vue2 Iview3](https://github.com/lljj-x/vue-json-schema-form/tree/master/packages/lib/vue2/vue2-form-iview3)
+* [vue3 Element Plus](https://github.com/lljj-x/vue-json-schema-form/tree/master/packages/lib/vue3/vue3-form-element)
+* vue3 Antdv (todo)
 
 ![](https://lljj-xxxx.oss-cn-hongkong.aliyuncs.com/vue-json-schema-form.gif)
 
@@ -55,8 +56,7 @@ yarn run demo:dev --dir=vue-editor
 
 ## 相关资料
 [JSON Schema](https://json-schema.org/understanding-json-schema/index.html) |
-[Vue](https://cn.vuejs.org/) |
-[Element Ui](https://element.eleme.io/)
+[Vue](https://cn.vuejs.org/)
 
 ### 为何开发
 在做前端可视化编辑时，为了解决数据配置表单的通用性，所以使用 `JSON Schema` 描述数据结构，动态生成表单。

package.json

@@ -12,10 +12,13 @@
     "scripts": {
         "docs:dev": "yarn workspace docs dev",
         "docs:build": "yarn workspace docs build",
-        "lib:watch": "yarn workspace @lljj/vue-json-schema-form watch",
-        "lib:build": "yarn workspace @lljj/vue-json-schema-form build",
+        "lib:build": "yarn lib-element:build && yarn lib-iview3:build && yarn lib3-element:build",
+        "lib-element:watch": "yarn workspace @lljj/vue-json-schema-form watch",
+        "lib-element:build": "yarn workspace @lljj/vue-json-schema-form build",
         "lib-iview3:watch": "yarn workspace @lljj/vue2-form-iview3 watch",
         "lib-iview3:build": "yarn workspace @lljj/vue2-form-iview3 build",
+        "lib3-element:watch": "yarn workspace @lljj/vue3-form-element watch",
+        "lib3-element:build": "yarn workspace @lljj/vue3-form-element build",
         "demo:dev": "yarn workspace demo dev",
         "demo:build": "yarn workspace demo build",
         "demo3:dev": "yarn workspace demo-v3 dev",
@@ -44,11 +47,12 @@
     "devDependencies": {
         "@commitlint/cli": "^8.3.5",
         "@commitlint/config-conventional": "^8.3.4",
+        "@vue/compiler-sfc": "^3.0.0",
         "commitizen": "^4.1.2",
-        "cz-conventional-changelog": "^3.2.0",
         "conventional-changelog-cli": "^2.0.34",
+        "cz-conventional-changelog": "^3.2.0",
         "husky": "^4.2.5",
-        "lerna": "^3.22.1",
-        "@vue/compiler-sfc": "^3.0.0"
-    }
+        "lerna": "^3.22.1"
+    },
+    "version": "0.0.0"
 }

packages/demo/demo-common/components/CodeEditorV3.vue

@@ -15,10 +15,29 @@
             </h1>
             <Menu
                 :class="$style.menu"
+                :version="version"
                 v-bind="$attrs"
             ></Menu>
         </div>
         <div :class="$style.btns">
+            <el-select
+                v-if="showVersion"
+                :model-value="version"
+                :value="version"
+                placeholder="版本"
+                size="small"
+                style="margin-right: 6px;width: 84px;"
+                @change="handleVersionChange"
+            >
+                <el-option
+                    value="vue2"
+                    label="vue2"
+                ></el-option>
+                <el-option
+                    value="vue3"
+                    label="vue3"
+                ></el-option>
+            </el-select>
             <slot></slot>
         </div>
     </div>
@@ -31,12 +50,35 @@ export default {
     name: 'EditorHeader',
     components: {
         Menu
+    },
+    props: {
+        version: {
+            default: 'vue2',
+            type: String
+        },
+        showVersion: {
+            default: false,
+            type: Boolean
+        }
+    },
+    methods: {
+        handleVersionChange(val) {
+            window.location.href = window.location.href.replace(
+                `${window.location.origin}${val === 'vue3' ? '' : '/v3'}`,
+                `${window.location.origin}${val === 'vue3' ? '/v3' : ''}`
+            );
+        },
     }
 };
 </script>
 
 <style module>
     @import "../css/variable.css";
+    .btns {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
     .box {
         position: relative;
         margin: 0 auto;

packages/demo/demo-common/components/EditorHeader.vue

@@ -32,7 +32,10 @@
                     ></i>Playground
                 </a>
             </el-menu-item>
-            <el-menu-item index="3">
+            <el-menu-item
+                v-if="$attrs.version==='vue2'"
+                index="3"
+            >
                 <a
                     :class="$style.menuLink"
                     href="/vue-editor.html#/editor"
@@ -43,7 +46,10 @@
                     ></i>活动编辑器
                 </a>
             </el-menu-item>
-            <el-menu-item index="4">
+            <el-menu-item
+                v-if="$attrs.version==='vue2'"
+                index="4"
+            >
                 <a
                     :class="$style.menuLink"
                     href="/schema-generator.html#/index"