refactor: 调整目录结构,重构部分代码

.eslintrc.js

@@ -42,7 +42,8 @@ module.exports = {
     // 允许下划线变量命名
     "no-underscore-dangle": "off",
     "import/no-extraneous-dependencies": "off",
-    "global-require": "off"
+    "global-require": "off",
+    "no-undef": "off",
   },
   parserOptions: {
     parser: "@typescript-eslint/parser",

README.md

@@ -67,6 +67,7 @@ npm i element-pro-crud -S
   <script src="https://unpkg.com/element-ui/lib/index.js"></script>
   <!-- import ElementProCrud -->
   <script src="https://cdn.jsdelivr.net/npm/element-pro-crud/lib/ProCrud.umd.js"></script>
+  <script src="https://cdn.bootcdn.net/ajax/libs/ace/test/ace.js"></script>
 
   <script>
     new Vue({
@@ -111,13 +112,13 @@ npm i element-pro-crud -S
   Vue.use(GenerateForm);
 
   import Vue from 'vue';
-  import { GenerateForm, CrudTable, FormDesignerDialog, TableDesignerDialog } from 'element-pro-crud';
+  import { GenerateForm, CrudTable, FormDesigner, TableDesigner } from 'element-pro-crud';
   import App from './App.vue';
 
   Vue.use(GenerateForm); // 不需要传options
   Vue.use(CrudTable, options);// options介绍如上,getTables,getFormKey两个方法可以缺省
-  Vue.use(FormDesignerDialog, options);// options介绍如上
-  Vue.use(TableDesignerDialog, options);// options介绍如上
+  Vue.use(FormDesigner, options);// options介绍如上
+  Vue.use(TableDesigner, options);// options介绍如上
 
   new Vue({
     el: '#app',
@@ -130,9 +131,9 @@ npm i element-pro-crud -S
 
 - `GenerateForm` // 根据表单设计器json自动渲染表单
 
-- `FormDesignerDialog` // 表单设计器
+- `FormDesigner` // 表单设计器
 
-- `TableDesignerDialog` // 表格设计器
+- `TableDesigner` // 表格设计器
 
 - `CrudTable` // 高级增删改查 ProTable
 

package.json

@@ -1,10 +1,11 @@
 {
   "name": "element-pro-crud",
-  "version": "0.8.0-1",
+  "version": "0.8.0-2",
   "main": "lib/ProCrud.umd.min.js",
   "files": [
     "lib",
-    "types"
+    "types",
+    "public"
   ],
   "typings": "types/index.d.ts",
   "description": "二次封装Table,Form组件,配套表单,表格设计器,一键Crud",
@@ -32,7 +33,6 @@
     "start": "vue-cli-service serve",
     "build": "vue-cli-service build",
     "lint": "vue-cli-service lint",
-    "fix": "eslint --ext .ts,.vue packages --fix",
     "report": "cross-env IS_REPORT=true vue-cli-service build",
     "lib": "vue-cli-service build --target lib --name ProCrud --dest lib src/index.ts",
     "deploy": "npm run lib && npm publish",
@@ -86,7 +86,6 @@
     "vue-cli-plugin-commitlint": "^1.0.12",
     "vue-property-decorator": "^8.5.0",
     "vue-template-compiler": "2.6.11",
-    "vue2-ace-editor": "^0.0.15",
     "vuedraggable": "^2.23.2",
     "webpack": "^4.35.3",
     "webpack-bundle-analyzer": "^3.3.2"
@@ -99,7 +98,6 @@
   },
   "lint-staged": {
     "src/**/*.{js,vue,ts}": [
-      "npm run fix",
       "npm run lint",
       "git add"
     ]

examples/index.html → public/index.html

@@ -17,5 +17,6 @@
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->
+    <script src="https://cdn.bootcdn.net/ajax/libs/ace/test/ace.js"></script>
   </body>
 </html>

packages/crud-table/src/CrudTable.vue → src/component/crud-table/src/CrudTable.vue

@@ -15,9 +15,9 @@
         <h4>{{tableTitle}}</h4>
       </div>
       <!--dev模式可直接编辑表格-->
-      <div v-if="$store.getters.config && $store.getters.config.isDev === '1'" class="dev-module">
-        <el-button type="text" @click="showTableDesignerDialog">当前表格: {{this.tableDesignerName || this.tableName}}  [点此修改]</el-button>
-        <TableDesignerDialog ref="tableDesignerDialog"
+      <div v-if="$store.getters && $store.getters.config && $store.getters.config.isDev === '1'" class="dev-module">
+        <el-button type="text" @click="showTableDesigner">当前表格: {{this.tableDesignerName || this.tableName}}  [点此修改]</el-button>
+        <TableDesigner ref="TableDesigner"
                          @after-save="tableOnSave"/>
       </div>
       <!-- table右上角按钮 -->
@@ -239,7 +239,7 @@ export default class CrudTable extends Vue {
     table: HTMLFormElement;
     dialog: HTMLFormElement;
     searchForm: HTMLFormElement;
-    tableDesignerDialog: HTMLFormElement;
+    TableDesigner: HTMLFormElement;
   };
 
   // 当前点击行
@@ -981,9 +981,9 @@ export default class CrudTable extends Vue {
     }
   }
 
-  async showTableDesignerDialog() {
+  async showTableDesigner() {
     const res = await this.$PROCRUD.getTableDetail(this.tableDesignerName || this.tableName);
-    this.$refs.tableDesignerDialog.showDialog({ id: res.data.id }, 1, res.data);
+    this.$refs.TableDesigner.showDialog({ id: res.data.id }, 1, res.data);
   }
 }
 </script>

packages/crud-table/src/GenerateFormDialog.vue → src/component/crud-table/src/GenerateFormDialog.vue

@@ -43,7 +43,7 @@
 </template>
 
 <script lang="ts">
-import GenerateForm from 'packages/form-designer/src/GenerateForm.vue';
+import GenerateForm from '@/component/form-designer/src/GenerateForm.vue';
 import guid from '@/utils/generator';
 import {
   Component, Vue, Emit, Watch, Prop,

packages/crud-table/src/SeniorSearchForm.vue → src/component/crud-table/src/SeniorSearchForm.vue

@@ -52,7 +52,7 @@
 </template>
 
 <script lang="ts">
-import GenerateForm from 'packages/form-designer/src/GenerateForm.vue';
+import GenerateForm from '@/component/form-designer/src/GenerateForm.vue';
 
 import {
   Component, Vue, Prop, Watch,

packages/form-designer/index.ts → src/component/form-designer/index.ts

@@ -1,12 +1,12 @@
-import FormDesignerDialog from './src/FormDesignerDialog.vue';
+import FormDesigner from './src/FormDesigner.vue';
 import GenerateForm from './src/GenerateForm.vue';
 // 为组件添加 install 方法，用于按需引入
 // eslint-disable-next-line func-names
-FormDesignerDialog.install = function (Vue, options) {
+FormDesigner.install = function (Vue, options) {
   if (options) {
     Vue.prototype.$PROCRUD = options;
   }
-  Vue.component(FormDesignerDialog.name, FormDesignerDialog);
+  Vue.component(FormDesigner.name, FormDesigner);
 };
 
 // eslint-disable-next-line func-names
@@ -18,6 +18,6 @@ GenerateForm.install = function (Vue, options) {
 };
 
 export {
-  FormDesignerDialog,
+  FormDesigner,
   GenerateForm,
 };