feat: write README

Liberty-liu · Mar 23, 2023 · ca08f97 · ca08f97
1 parent a5dd894
commit ca08f97
Show file tree

Hide file tree

Showing 5 changed files with 128 additions and 22 deletions.
diff --git a/README.md b/README.md
@@ -1,7 +1,61 @@
-# Vue 3 + Vite
+# Everright-formEditor
 
-This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+[![vue](https://img.shields.io/badge/vue-%3E%3D%203-green.svg)](https://vuejs.org/)
+[![element-plus](https://img.shields.io/badge/element--plus-%3E%3D%202.3.1-green.svg)](https://element-plus.gitee.io/)
+[![vant](https://img.shields.io/badge/vant-%3E%3D%204.1.1-green.svg)](https://vant-ui.github.io/)
+[![sortablejs](https://img.shields.io/badge/sortablejs-1.14.0-green.svg)](https://github.com/SortableJS/Sortable)
+[![jss](https://img.shields.io/badge/jss-%3E%3D%2010.10.0-green.svg)](https://github.com/cssinjs/jss)
+[![lodash](https://img.shields.io/badge/lodash--es-%3E%3D%204.17.21-green.svg)](https://lodash.com/custom-builds)
+[![nanoid](https://img.shields.io/badge/nanoid-%3E%3D%204.0.1-green.svg)](https://github.com/ai/nanoid)
+[![async](https://img.shields.io/badge/async-%3E%3D%203.2.4-green.svg)](https://caolan.github.io/async/)
+[![@vuelidate/core](https://img.shields.io/badge/@vuelidate/core-%3E%3D%202.0.0-green.svg)](https://github.com/vuelidate/vuelidate)
+[![axios](https://img.shields.io/badge/axios-%3E%3D%201.3.4-green.svg)](https://github.com/axios/axios)
+[![signature_pad](https://img.shields.io/badge/signature_pad-%3E%3D%204.1.5-green.svg)](https://github.com/szimek/signature_pad)
 
-## Recommended IDE Setup
+[简体中文](./README.zh-cn.md) | English
 
-- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar)
+Everright-formEditor is a free and open source javascript visual low-code editor. It can creates forms with simple operations through the gui interface. It has a flexible interactive interface. The PC side depends on element-plus, and the mobile depends on vant. There is a set of internal Adapter, the component that adapts element-plus and vant
+
+## Features
+
+* 1.Support Chinese and English
+* 2.Support Pc and Mobile
+* 3.Rich fields and layout containers
+* 4.Flexible interaction
+
+## Fields adaptation
+
+| Type  | Pc | Mobile |
+| ------------- | ------------- | ------------- |
+| Input  | :white_check_mark:  | :white_check_mark:  |
+| Email  | :white_check_mark: | :white_check_mark:  |
+| ID  |  :white_check_mark: | :white_check_mark:  |
+| Phone  | :white_check_mark:  | :white_check_mark:  |
+| URL  | :white_check_mark:  | :white_check_mark:  |
+| Textarea  | :white_check_mark:  | :white_check_mark:  |
+| Number  | :white_check_mark:  | :white_check_mark:  |
+| Radio  | :white_check_mark:  | :white_check_mark:  |
+| Checkbox  | :white_check_mark:  | :white_check_mark:  |
+| Select  | :white_check_mark:  | :white_check_mark:  |
+| Time  |  :white_check_mark: | :white_check_mark:  |
+| Date  | :white_check_mark:  | :white_check_mark:  |
+| Rate  |  :white_check_mark: | :white_check_mark:  |
+| Switch  | :white_check_mark:  | :white_check_mark:  |
+| Slider  | :white_check_mark: | :white_check_mark:  |
+| Html  | :white_check_mark:  | :white_check_mark:  |
+| Cascader  | :white_check_mark:  | :white_check_mark:  |
+| File  |  :white_check_mark: | :white_check_mark:  |
+| Signature  | :white_check_mark: | :white_check_mark:  |
+| Region  |  :white_check_mark: | :white_check_mark:  |
+
+
+
+## Container adaptation
+
+| Type  | Pc | Mobile |
+| ------------- | ------------- | ------------- |
+| Grid  | :white_check_mark:  | :white_check_mark:  |
+| Table  | :white_check_mark: | :x:  |
+| Tabs  |  :white_check_mark: | :white_check_mark:  |
+| Collapse  | :white_check_mark:  | :white_check_mark:  |
+| Divider  | :white_check_mark:  | :white_check_mark:  |
diff --git a/README.zh-cn.md b/README.zh-cn.md
@@ -0,0 +1,61 @@
+# Everright-formEditor
+
+[![vue](https://img.shields.io/badge/vue-%3E%3D%203-green.svg)](https://vuejs.org/)
+[![element-plus](https://img.shields.io/badge/element--plus-%3E%3D%202.3.1-green.svg)](https://element-plus.gitee.io/)
+[![vant](https://img.shields.io/badge/vant-%3E%3D%204.1.1-green.svg)](https://vant-ui.github.io/)
+[![sortablejs](https://img.shields.io/badge/sortablejs-1.14.0-green.svg)](https://github.com/SortableJS/Sortable)
+[![jss](https://img.shields.io/badge/jss-%3E%3D%2010.10.0-green.svg)](https://github.com/cssinjs/jss)
+[![lodash](https://img.shields.io/badge/lodash--es-%3E%3D%204.17.21-green.svg)](https://lodash.com/custom-builds)
+[![nanoid](https://img.shields.io/badge/nanoid-%3E%3D%204.0.1-green.svg)](https://github.com/ai/nanoid)
+[![async](https://img.shields.io/badge/async-%3E%3D%203.2.4-green.svg)](https://caolan.github.io/async/)
+[![@vuelidate/core](https://img.shields.io/badge/@vuelidate/core-%3E%3D%202.0.0-green.svg)](https://github.com/vuelidate/vuelidate)
+[![axios](https://img.shields.io/badge/axios-%3E%3D%201.3.4-green.svg)](https://github.com/axios/axios)
+[![signature_pad](https://img.shields.io/badge/signature_pad-%3E%3D%204.1.5-green.svg)](https://github.com/szimek/signature_pad)
+
+[English](./README.md) | 简体中文
+
+Everright-formEditor是一个免费开源的javascript可视化低代码编辑器，通过gui的界面只需简单的操作即可创建出表单，拥有灵活的交互界面，pc端依赖element-plus，mobile依赖vant,内部有一套适配器，适配element和vant的组件
+
+## 特点
+
+* 1.支持中文和英文
+* 2.多终端适配
+* 3.丰富的字段和布局容器
+* 4.灵活的交互方式
+
+## 字段适配
+
+| Field  | Pc | Mobile |
+| ------------- | ------------- | ------------- |
+| Input  | :white_check_mark:  | :white_check_mark:  |
+| Email  | :white_check_mark: | :white_check_mark:  |
+| ID  |  :white_check_mark: | :white_check_mark:  |
+| Phone  | :white_check_mark:  | :white_check_mark:  |
+| URL  | :white_check_mark:  | :white_check_mark:  |
+| Textarea  | :white_check_mark:  | :white_check_mark:  |
+| Number  | :white_check_mark:  | :white_check_mark:  |
+| Radio  | :white_check_mark:  | :white_check_mark:  |
+| Checkbox  | :white_check_mark:  | :white_check_mark:  |
+| Select  | :white_check_mark:  | :white_check_mark:  |
+| Time  |  :white_check_mark: | :white_check_mark:  |
+| Date  | :white_check_mark:  | :white_check_mark:  |
+| Rate  |  :white_check_mark: | :white_check_mark:  |
+| Switch  | :white_check_mark:  | :white_check_mark:  |
+| Slider  | :white_check_mark: | :white_check_mark:  |
+| Html  | :white_check_mark:  | :white_check_mark:  |
+| Cascader  | :white_check_mark:  | :white_check_mark:  |
+| File  |  :white_check_mark: | :white_check_mark:  |
+| Signature  | :white_check_mark: | :white_check_mark:  |
+| Region  |  :white_check_mark: | :white_check_mark:  |
+
+
+
+## 容器适配
+
+| Field  | Pc | Mobile |
+| ------------- | ------------- | ------------- |
+| Grid  | :white_check_mark:  | :white_check_mark:  |
+| Table  | :white_check_mark: | :x:  |
+| Tabs  |  :white_check_mark: | :white_check_mark:  |
+| Collapse  | :white_check_mark:  | :white_check_mark:  |
+| Divider  | :white_check_mark:  | :white_check_mark:  |
diff --git a/package.json b/package.json
@@ -37,21 +37,20 @@
     "async": "^3.2.4",
     "axios": "^1.2.2",
     "dayjs": "^1.11.7",
-    "element-plus": "^2.2.28",
-    "express": "^4.18.2",
     "jss": "^10.9.2",
     "jss-preset-default": "^10.9.2",
     "lodash-es": "^4.17.21",
-    "magic-string": "^0.30.0",
     "nanoid": "^4.0.0",
     "nzh": "^1.0.8",
     "signature_pad": "^4.1.4",
-    "vant": "^4.0.8",
-    "vue": "^3.2.45",
-    "vue-router": "^4.1.6",
     "vuedraggable": "^4.1.0"
   },
   "devDependencies": {
+    "element-plus": "^2.2.28",
+    "vant": "^4.0.8",
+    "vue": "^3.2.45",
+    "vue-router": "^4.1.6",
+    "express": "^4.18.2",
     "@babel/core": "^7.21.0",
     "@babel/eslint-parser": "^7.19.1",
     "@ckeditor/ckeditor5-alignment": "^35.4.0",

diff --git a/packages/formEditor/components/Panels/Blocks/index.jsx b/packages/formEditor/components/Panels/Blocks/index.jsx
@@ -71,8 +71,10 @@ export default {
       state.store.push(newElement)
       utils.addContext(newElement, state.store)
       nextTick(() => {
-        ER.canvesScrollRef.value.setScrollTop(ER.canvesScrollRef.value.wrapRef.scrollHeight)
         setSector(newElement)
+        setTimeout(() => {
+          ER.canvesScrollRef.value.setScrollTop(ER.canvesScrollRef.value.wrapRef.scrollHeight)
+        }, 100)
       })
     }
     const slots = {

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml