Merge pull request #133 from go-admin-team/dev

Dev

.env.development

@@ -4,11 +4,3 @@ ENV = 'development'
 # base api
 VUE_APP_BASE_API = 'http://127.0.0.1:8000'
 
-# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
-# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
-# It only does one thing by converting all import() to require().
-# This configuration can significantly increase the speed of hot updates,
-# when you have a large number of pages.
-# Detail:  https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
-
-VUE_CLI_BABEL_TRANSPILE_MODULES = true

babel.config.js

@@ -1,5 +1,10 @@
 module.exports = {
   presets: [
-    '@vue/app'
-  ]
+    '@vue/cli-plugin-babel/preset'
+  ],
+  env: {
+    development: {
+      plugins: ['dynamic-import-node']
+    }
+  }
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "go-admin",
-  "version": "2.0.0-beta.8",
+  "version": "2.0.0-beta.10",
   "description": "A magical vue admin. An out-of-box UI solution for enterprise applications. Newest development stack of vue. Lots of awesome features",
   "author": "https://github.com/wenjianzhang",
   "license": "MIT",
@@ -50,7 +50,7 @@
     "awe-dnd": "^0.3.4",
     "axios": "0.21.1",
     "clipboard": "2.0.6",
-    "codemirror": "5.56.0",
+    "codemirror": "5.62.0",
     "core-js": "^3.6.5",
     "driver.js": "0.9.8",
     "dropzone": "5.7.2",
@@ -75,6 +75,7 @@
     "uuid": "^8.3.0",
     "viser-vue": "^2.4.8",
     "vue": "2.6.11",
+    "vue-codemirror": "^4.0.6",
     "vue-count-to": "1.0.13",
     "vue-cropper": "^0.5.5",
     "vue-particles": "^1.0.9",
@@ -94,12 +95,13 @@
     "@vue/cli-plugin-babel": "4.4.6",
     "@vue/cli-plugin-eslint": "^4.4.6",
     "@vue/cli-plugin-unit-jest": "4.4.6",
-    "@vue/cli-service": "4.4.6",
+    "@vue/cli-service": "^4.5.13",
     "@vue/test-utils": "1.0.3",
     "autoprefixer": "^9.8.6",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "10.1.0",
     "babel-jest": "26.2.2",
+    "babel-plugin-dynamic-import-node": "^2.3.3",
     "beautifier": "^0.1.7",
     "chalk": "4.1.0",
     "chokidar": "3.4.2",
@@ -113,9 +115,9 @@
     "lint-staged": "10.2.11",
     "mockjs": "1.1.0",
     "monaco-editor-webpack-plugin": "^1.9.0",
-    "node-sass": "^4.14.1",
     "plop": "2.7.4",
     "runjs": "^4.4.2",
+    "sass": "^1.35.1",
     "sass-loader": "^9.0.3",
     "script-ext-html-webpack-plugin": "2.1.4",
     "script-loader": "0.7.2",

src/components/CustomDialog/index.vue

@@ -66,7 +66,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  /deep/ .el-dialog__body{
+  ::v-deep .el-dialog__body{
     padding: 20px!important;
   }
 
@@ -74,17 +74,17 @@ export default {
     margin: 0!important;
   }
 
-  /deep/ .el-dialog__header {
+  ::v-deep .el-dialog__header {
     border-bottom: 1px solid #e8e8e8;
   }
 
-  /deep/ .el-dialog__footer{
+  ::v-deep .el-dialog__footer{
     border-top: 1px solid #e8e8e8;
     padding: 10px 20px!important;
     box-sizing: border-box;
   }
 
-  /deep/ .el-dialog__title{
+  ::v-deep .el-dialog__title{
     font-size: 16px;
   }
 </style>

src/components/JsonEditor/index.vue

@@ -1,72 +0,0 @@
-<template>
-  <div class="json-editor">
-    <textarea ref="textarea" />
-  </div>
-</template>
-
-<script>
-import CodeMirror from 'codemirror'
-import 'codemirror/addon/lint/lint.css'
-import 'codemirror/lib/codemirror.css'
-import 'codemirror/theme/rubyblue.css'
-require('script-loader!jsonlint')
-import 'codemirror/mode/javascript/javascript'
-import 'codemirror/addon/lint/lint'
-import 'codemirror/addon/lint/json-lint'
-
-export default {
-  name: 'JsonEditor',
-  /* eslint-disable vue/require-prop-types */
-  props: ['value'],
-  data() {
-    return {
-      jsonEditor: false
-    }
-  },
-  watch: {
-    value(value) {
-      const editorValue = this.jsonEditor.getValue()
-      if (value !== editorValue) {
-        this.jsonEditor.setValue(JSON.stringify(this.value, null, 2))
-      }
-    }
-  },
-  mounted() {
-    this.jsonEditor = CodeMirror.fromTextArea(this.$refs.textarea, {
-      lineNumbers: true,
-      mode: 'application/json',
-      gutters: ['CodeMirror-lint-markers'],
-      theme: 'rubyblue',
-      lint: true
-    })
-
-    this.jsonEditor.setValue(JSON.stringify(this.value, null, 2))
-    this.jsonEditor.on('change', cm => {
-      this.$emit('changed', cm.getValue())
-      this.$emit('input', cm.getValue())
-    })
-  },
-  methods: {
-    getValue() {
-      return this.jsonEditor.getValue()
-    }
-  }
-}
-</script>
-
-<style scoped>
-.json-editor{
-  height: 100%;
-  position: relative;
-}
-.json-editor >>> .CodeMirror {
-  height: auto;
-  min-height: 300px;
-}
-.json-editor >>> .CodeMirror-scroll{
-  min-height: 300px;
-}
-.json-editor >>> .cm-s-rubyblue span.cm-string {
-  color: #F08047;
-}
-</style>

src/components/Tinymce/index.vue

@@ -212,7 +212,7 @@ export default {
 
 <style lang="scss" scoped>
 
-.tinymce-container /deep/{
+.tinymce-container ::v-deep{
   position: relative;
   line-height: normal;
   width: 100%;

src/components/tableAction.vue

@@ -302,7 +302,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  /deep/ .el-table{
+  ::v-deep .el-table{
     margin-top: 10px;
     thead {
       th{

src/layout/components/TagsView/index.vue

@@ -247,7 +247,7 @@ String.prototype.colorRgb = function() {
 </script>
 
 <style lang="scss" scoped>
-.tags-view-container /deep/{
+.tags-view-container ::v-deep{
   height: 43px;
   width: 100%;
   background: #fff;

src/main.js

@@ -10,6 +10,10 @@ import './styles/element-variables.scss'
 import '@/styles/index.scss' // global css
 import '@/styles/admin.scss'
 
+import VueCodemirror from 'vue-codemirror'
+import 'codemirror/lib/codemirror.css'
+Vue.use(VueCodemirror)
+
 import App from './App'
 import store from './store'
 import router from './router'
@@ -18,7 +22,7 @@ import permission from './directive/permission'
 import { getDicts } from '@/api/admin/dict/data'
 import { getItems, setItems } from '@/api/table'
 import { getConfigKey } from '@/api/admin/sys-config'
-import { parseTime, resetForm, addDateRange, selectDictLabel, download, selectItemsLabel } from '@/utils/costum'
+import { parseTime, resetForm, addDateRange, selectDictLabel, /* download,*/ selectItemsLabel } from '@/utils/costum'
 
 import './icons' // icon
 import './permission' // permission control
@@ -47,7 +51,7 @@ Vue.prototype.resetForm = resetForm
 Vue.prototype.addDateRange = addDateRange
 Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.selectItemsLabel = selectItemsLabel
-Vue.prototype.download = download
+// Vue.prototype.download = download
 
 // 全局组件挂载
 Vue.component('Pagination', Pagination)

src/store/modules/system.js

@@ -1,4 +1,4 @@
-import { getSetting, updateSetting } from '@/api/login'
+import { getSetting } from '@/api/login'
 import storage from '@/utils/storage'
 const state = {
   info: storage.get('app_info')
@@ -22,17 +22,6 @@ const actions = {
         reject(error)
       })
     })
-  },
-  updateSetting({ commit }, info) {
-    return new Promise((resolve, reject) => {
-      updateSetting(info).then(response => {
-        const { data } = response
-        commit('SET_INFO', data)
-        resolve(response)
-      }).catch(error => {
-        reject(error)
-      })
-    })
   }
 }
 

src/styles/admin.css

@@ -207,3 +207,7 @@
 .el-tabs__item {
   font-size: 13px;
 }
+
+.delete-popconfirm{
+  margin-left: 10px;
+  }

src/styles/admin.scss

@@ -289,4 +289,7 @@
 .el-drawer {
   overflow-y: scroll;
   
+}
+.delete-popconfirm{
+margin-left: 10px;
 }

src/styles/variables.css

@@ -7,7 +7,7 @@
   menuLightHover: #f0f1f5;
   subMenuBg: #000c17;
   subMenuHover: #001528;
-  sideBarWidth: 256px;
+  sideBarWidth: 210px;
   sidebarTitle: #ffffff;
   sidebarLightTitle: #001529;
 }

src/styles/variables.scss

@@ -24,7 +24,7 @@ $sidebarLightTitle: #001529;
 $subMenuBg:#000c17;
 $subMenuHover:#001528;
 
-$sideBarWidth: 256px;
+$sideBarWidth: 210px;
 
 // the :export directive is the magic sauce for webpack
 // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass

src/views/admin/sys-login-log/index.vue

@@ -280,7 +280,7 @@ export default {
         cancelButtonText: '取消',
         type: 'warning'
       }).then(function() {
-        return delSysLoginlog(Ids)
+        return delSysLoginlog({ 'ids': Ids })
       }).then((response) => {
         if (response.code === 200) {
           this.msgSuccess(response.msg)

src/views/admin/sys-menu/index.vue

@@ -49,10 +49,6 @@
           </el-table-column>
           <el-table-column prop="sort" label="排序" width="60px" />
           <el-table-column prop="permission" label="权限标识" :show-overflow-tooltip="true">
-            <!-- <template slot-scope="scope">
-              <span v-if="scope.row.permission==''">-</span>
-              <span v-else>{{ scope.row.permission }}</span>
-           > -->
             <template slot-scope="scope">
               <el-popover v-if="scope.row.sysApi.length>0" trigger="hover" placement="top">
                 <el-table

src/views/dashboard/admin/index.vue

@@ -162,7 +162,7 @@ export default {
   }
 }
 
-/deep/ .el-tabs__item{
+::v-deep .el-tabs__item{
    padding-left: 16px!important;
    height: 50px;
    line-height: 50px;

src/views/dev-tools/gen/basicInfoForm.vue

@@ -2,26 +2,44 @@
   <el-form ref="basicInfoForm" :model="info" :rules="rules" label-width="150px">
     <el-row>
       <el-col :span="12">
-        <el-form-item label="表名称" prop="tableName">
-          <el-input v-model="info.tableName" placeholder="请输入仓库名称" />
+        <el-form-item prop="tableName">
+          <span slot="label">
+            数据表名称
+            <el-tooltip content="数据库表名称，针对gorm对应的table()使用，⚠️这里必须是蛇形结构" placement="top">
+              <i class="el-icon-question" />
+            </el-tooltip>
+          </span>
+          <el-input v-model="info.tableName" placeholder="请输入表名称" />
         </el-form-item>
       </el-col>
       <el-col :span="12">
-        <el-form-item label="表描述" prop="tableComment">
-          <el-input v-model="info.tableComment" placeholder="请输入" />
+        <el-form-item prop="tableComment">
+          <span slot="label">
+            菜单名称
+            <el-tooltip content="同步的数据库表名称，生成配置数据时，用作菜单名称" placement="top">
+              <i class="el-icon-question" />
+            </el-tooltip>
+          </span>
+          <el-input v-model="info.tableComment" placeholder="请输入菜单名称" />
         </el-form-item>
       </el-col>
       <el-col :span="12">
-        <el-form-item label="实体类名称" prop="className">
+        <el-form-item prop="className">
+          <span slot="label">
+            结构体模型名称
+            <el-tooltip content="结构体模型名称，代码中的struct名称定义使用" placement="top">
+              <i class="el-icon-question" />
+            </el-tooltip>
+          </span>
           <el-input v-model="info.className" placeholder="请输入" />
         </el-form-item>
       </el-col>
       <el-col :span="12">
-        <el-form-item label="作者" prop="functionAuthor">
-          <el-input v-model="info.functionAuthor" placeholder="请输入" />
+        <el-form-item label="作者名称" prop="functionAuthor">
+          <el-input v-model="info.functionAuthor" placeholder="请输入作者名称" />
         </el-form-item>
       </el-col>
-      <el-col :span="12">
+      <!-- <el-col :span="12">
         <el-form-item prop="isLogicalDelete">
           <span slot="label">
             是否逻辑删除
@@ -40,7 +58,7 @@
         <el-form-item v-if="info.isLogicalDelete == '1'" label="逻辑删除字段" prop="logicalDeleteColumn">
           <el-input v-model="info.logicalDeleteColumn" placeholder="请输入" />
         </el-form-item>
-      </el-col>
+      </el-col> -->
       <el-col :span="24">
         <el-form-item label="备注" prop="remark">
           <el-input v-model="info.remark" type="textarea" :rows="3" />
@@ -62,16 +80,19 @@ export default {
     return {
       rules: {
         tableName: [
-          { required: true, message: '请输入表名称', trigger: 'blur' }
+          { required: true, message: '请输入表名称', trigger: 'blur' },
+          { pattern: /^[a-z\._]*$/g, trigger: 'blur', message: '只允许小写字母,例如 sys_demo 格式' }
         ],
         tableComment: [
-          { required: true, message: '请输入表描述', trigger: 'blur' }
+          { required: true, message: '请输入菜单名称', trigger: 'blur' }
         ],
         className: [
-          { required: true, message: '请输入实体类名称', trigger: 'blur' }
+          { required: true, message: '请输入模型名称', trigger: 'blur' },
+          { pattern: /^[A-Z][A-z0-9]*$/g, trigger: 'blur', message: '必须以大写字母开头,例如 SysDemo 格式' }
         ],
         functionAuthor: [
-          { required: true, message: '请输入作者', trigger: 'blur' }
+          { required: true, message: '请输入作者', trigger: 'blur' },
+          { pattern: /^[A-Za-z]+$/, trigger: 'blur', message: '校验规则:  只允许输入字母 a-z 或大写 A-Z' }
         ]
       }
     }

src/views/dev-tools/gen/editTable.vue

@@ -5,6 +5,11 @@
         <basic-info-form ref="basicInfo" :info="info" />
       </el-tab-pane>
       <el-tab-pane label="字段信息" name="cloum">
+        <el-alert
+          title="⚠️表字段中的id、create_by、update_by、created_at、updated_at、deleted_at的字段在此列表中已经隐藏"
+          type="warning"
+          show-icon
+        />
         <el-table :data="columns" :max-height="tableHeight" style="width: 100%">
           <el-table-column fixed label="序号" type="index" width="50" />
           <el-table-column

src/views/dev-tools/gen/genInfoForm.vue

@@ -15,7 +15,7 @@
       <el-col :span="12">
         <el-form-item prop="packageName">
           <span slot="label">
-            指定应用名
+            应用名
             <el-tooltip content="应用名，例如：在app文件夹下将该功能发到那个应用中，默认：admin" placement="top">
               <i class="el-icon-question" />
             </el-tooltip>
@@ -24,19 +24,7 @@
         </el-form-item>
       </el-col>
 
-      <el-col :span="12">
-        <el-form-item prop="moduleName">
-          <span slot="label">
-            服务端文件名
-            <el-tooltip content="服务端项目文件名，例如 sys_user.go" placement="top">
-              <i class="el-icon-question" />
-            </el-tooltip>
-          </span>
-          <el-input v-model="info.moduleName" />
-        </el-form-item>
-      </el-col>
-
-      <el-col :span="12">
+      <!-- <el-col :span="12">
         <el-form-item prop="moduleFrontName">
           <span slot="label">
             前端文件名
@@ -46,12 +34,12 @@
           </span>
           <el-input v-model="info.moduleFrontName" />
         </el-form-item>
-      </el-col>
+      </el-col> -->
 
       <el-col :span="12">
         <el-form-item prop="businessName">
           <span slot="label">
-            生成业务名
+            业务名
             <el-tooltip content="可理解为功能英文名，例如 user" placement="top">
               <i class="el-icon-question" />
             </el-tooltip>
@@ -63,8 +51,8 @@
       <el-col :span="12">
         <el-form-item prop="functionName">
           <span slot="label">
-            生成功能名
-            <el-tooltip content="用作类描述，例如 用户" placement="top">
+            功能描述
+            <el-tooltip content="同步的数据库表备注，用作类描述，例如：用户" placement="top">
               <i class="el-icon-question" />
             </el-tooltip>
           </span>
@@ -72,6 +60,26 @@
         </el-form-item>
       </el-col>
       <el-col :span="12">
+        <el-form-item prop="moduleName">
+          <span slot="label">
+            接口路径
+            <el-tooltip content="接口路径，例如：api/v1/{sys-user}" placement="top">
+              <i class="el-icon-question" />
+            </el-tooltip>
+          </span>
+          <el-input v-model="info.moduleName">
+            <template slot="prepend">api/{version}/</template>
+            <template slot="append">...</template>
+          </el-input>
+        </el-form-item>
+        <!-- <el-alert
+          title="接口地址示例"
+          description="[get]api/{version}/{接口路径} \r\n [post]"
+          type="success"
+          show-icon
+        /> -->
+      </el-col>
+      <!-- <el-col :span="12">
         <el-form-item prop="isDataScope">
           <span slot="label">
             是否认证
@@ -84,8 +92,8 @@
             <el-option label="false" value="2" />
           </el-select>
         </el-form-item>
-      </el-col>
-      <el-col :span="12">
+      </el-col> -->
+      <!-- <el-col :span="12">
         <el-form-item prop="isDataScope">
           <span slot="label">
             数据权限
@@ -98,8 +106,8 @@
             <el-option label="false" value="2" />
           </el-select>
         </el-form-item>
-      </el-col>
-      <el-col :span="12">
+      </el-col> -->
+      <!-- <el-col :span="12">
         <el-form-item prop="isActions">
           <span slot="label">
             是否actions
@@ -108,11 +116,10 @@
             </el-tooltip>
           </span>
           <el-select v-model="info.isActions" disabled>
-            <!-- <el-option label="true" value="1" /> -->
             <el-option label="false" value="2" />
           </el-select>
         </el-form-item>
-      </el-col>
+      </el-col> -->
     </el-row>
 
     <el-row v-show="info.tplCategory == 'tree'">
@@ -190,13 +197,16 @@ export default {
           { required: true, message: '请选择生成模板', trigger: 'blur' }
         ],
         packageName: [
-          { required: true, message: '请输入生成包路径', trigger: 'blur' }
+          { required: true, message: '请输入生成包路径', trigger: 'blur' },
+          { pattern: /^[a-z]*$/g, trigger: 'blur', message: '只允许小写字母,例如 system 格式' }
         ],
         moduleName: [
-          { required: true, message: '请输入生成模块名', trigger: 'blur' }
+          { required: true, message: '请输入生成模块名', trigger: 'blur' },
+          { pattern: /^[a-z\-]*[a-z]$/g, trigger: 'blur', message: '只允许小写字母,例如 sys-demo 格式' }
         ],
         businessName: [
-          { required: true, message: '请输入生成业务名', trigger: 'blur' }
+          { required: true, message: '请输入生成业务名', trigger: 'blur' },
+          { pattern: /^[a-z][A-Za-z]+$/, trigger: 'blur', message: '校验规则:  只允许输入字母 a-z 或大写 A-Z ，并且小写字母开头' }
         ],
         functionName: [
           { required: true, message: '请输入生成功能名', trigger: 'blur' }

src/views/dev-tools/gen/index.vue

@@ -12,10 +12,10 @@
               @keyup.enter.native="handleQuery"
             />
           </el-form-item>
-          <el-form-item label="表描述" prop="tableComment">
+          <el-form-item label="菜单名称" prop="tableComment">
             <el-input
               v-model="queryParams.tableComment"
-              placeholder="请输入表描述"
+              placeholder="请输入菜单名称"
               clearable
               size="small"
               @keyup.enter.native="handleQuery"
@@ -77,14 +77,14 @@
             width="130"
           />
           <el-table-column
-            label="表描述"
+            label="菜单名称"
             align="center"
             prop="tableComment"
             :show-overflow-tooltip="true"
             width="130"
           />
           <el-table-column
-            label="实体"
+            label="模型名称"
             align="center"
             prop="className"
             :show-overflow-tooltip="true"
@@ -98,47 +98,71 @@
           <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
             <template slot-scope="scope">
               <el-button
-
-                type="text"
-                size="small"
-                icon="el-icon-view"
-                @click="handlePreview(scope.row)"
-              >预览</el-button>
-              <el-button
-
                 type="text"
                 size="small"
-                icon="el-icon-view"
-                @click="handleToProject(scope.row)"
-              >代码生成</el-button>
+                icon="el-icon-edit"
+                @click="handleEditTable(scope.row)"
+              >编辑</el-button>
               <el-button
-
                 type="text"
                 size="small"
                 icon="el-icon-view"
-                @click="handleToApiFile(scope.row)"
-              >配置迁移脚本</el-button>
-              <el-button
+                @click="handlePreview(scope.row)"
+              >预览</el-button>
+              <el-popconfirm
+                class="delete-popconfirm"
+                title="正在使用代码生成请确认?"
+                confirm-button-text="生成"
+                @onConfirm="handleToProject(scope.row)"
+              >
+                <el-button
+                  slot="reference"
+                  type="text"
+                  size="small"
+                  icon="el-icon-view"
+                >代码生成</el-button>
+              </el-popconfirm>
 
-                type="text"
-                size="small"
-                icon="el-icon-view"
-                @click="handleToDB(scope.row)"
-              >配置生成</el-button>
-              <el-button
+              <el-popconfirm
+                class="delete-popconfirm"
+                title="正在使用代码生成配置迁移脚本请确认?"
+                confirm-button-text="生成"
+                @onConfirm="handleToApiFile(scope.row)"
+              >
+                <el-button
+                  slot="reference"
+                  type="text"
+                  size="small"
+                  icon="el-icon-view"
+                >配置迁移脚本</el-button>
+              </el-popconfirm>
 
-                type="text"
-                size="small"
-                icon="el-icon-edit"
-                @click="handleEditTable(scope.row)"
-              >编辑</el-button>
-              <el-button
+              <el-popconfirm
+                class="delete-popconfirm"
+                title="正在使用【菜单以及API生成到数据库】请确认?"
+                confirm-button-text="写入DB"
+                @onConfirm="handleToDB(scope.row)"
+              >
+                <el-button
+                  slot="reference"
+                  type="text"
+                  size="small"
+                  icon="el-icon-view"
+                >配置生成</el-button>
+              </el-popconfirm>
 
-                type="text"
-                size="small"
-                icon="el-icon-delete"
-                @click="handleDelete(scope.row)"
-              >删除</el-button>
+              <el-popconfirm
+                class="delete-popconfirm"
+                title="确认删除数据项？"
+                @onConfirm="handleSingleDelete(scope.row)"
+              >
+                <el-button
+                  slot="reference"
+                  type="text"
+                  size="small"
+                  icon="el-icon-delete"
+                >删除</el-button>
+              </el-popconfirm>
             </template>
           </el-table-column>
         </el-table>
@@ -153,9 +177,20 @@
 
       <!-- 预览界面 -->
 
-      <el-dialog :title="preview.title" :visible.sync="preview.open" top="5vh">
+      <el-dialog class="preview" :title="preview.title" :visible.sync="preview.open" fullscreen>
         <div class="el-dialog-container">
-          <el-tabs v-model="preview.activeName">
+          <div class="tag-group">
+            <!-- eslint-disable-next-line vue/valid-v-for -->
+            <el-tag v-for="(value, key) in preview.data" @click="codeChange(key)">
+              <template>
+                {{ key.substring(key.lastIndexOf('/')+1,key.indexOf('.go.template')) }}
+              </template>
+            </el-tag>
+          </div>
+          <div id="codemirror">
+            <codemirror ref="cmEditor" :value="codestr" :options="cmOptions" />
+          </div>
+          <!-- <el-tabs v-model="preview.activeName" tab-position="left">
             <el-tab-pane
               v-for="(value, key) in preview.data"
               :key="key"
@@ -163,14 +198,10 @@
               :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.template'))"
             >
 
-              <pre class="pre">
-                <el-scrollbar>
-                 {{ value }}
-                 </el-scrollbar>
-              </pre>
+              <pre class="pre"/>
 
             </el-tab-pane>
-          </el-tabs>
+            </el-tabs> -->
         </div>
 
       </el-dialog>
@@ -183,12 +214,28 @@
 import { listTable, previewTable, delTable, toDBTable, toProjectTableCheckRole, apiToFile } from '@/api/tools/gen'
 import importTable from './importTable'
 import { downLoadFile } from '@/utils/zipdownload'
+import { codemirror } from 'vue-codemirror'
+import 'codemirror/theme/material-palenight.css'
+
+require('codemirror/mode/javascript/javascript')
+import 'codemirror/mode/javascript/javascript'
+import 'codemirror/mode/go/go'
+import 'codemirror/mode/vue/vue'
 
 export default {
   name: 'Gen',
-  components: { importTable },
+  components: { importTable, codemirror },
   data() {
     return {
+      cmOptions: {
+        tabSize: 4,
+        theme: 'material-palenight',
+        mode: 'text/javascript',
+        lineNumbers: true,
+        line: true
+        // more CodeMirror options...
+      },
+      codestr: '',
       // 遮罩层
       loading: true,
       // 唯一标识符
@@ -244,6 +291,18 @@ export default {
       }
       )
     },
+    codeChange(e) {
+      if (e.indexOf('js') > -1) {
+        this.cmOptions.mode = 'text/javascript'
+      }
+      if (e.indexOf('model') > -1 || e.indexOf('router') > -1 || e.indexOf('api') > -1 || e.indexOf('service') > -1 || e.indexOf('dto') > -1) {
+        this.cmOptions.mode = 'text/x-go'
+      }
+      if (e.indexOf('vue') > -1) {
+        this.cmOptions.mode = 'text/x-vue'
+      }
+      this.codestr = this.preview.data[e]
+    },
     /** 搜索按钮操作 */
     handleQuery() {
       this.queryParams.pageIndex = 1
@@ -273,38 +332,21 @@ export default {
       previewTable(row.tableId).then(response => {
         this.preview.data = response.data
         this.preview.open = true
+        this.codeChange('template/api.go.template')
       })
     },
     handleToProject(row) {
-      this.$confirm('正在使用代码生成请确认?', '提示', {
-        confirmButtonText: '生成',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(function() {
-        return toProjectTableCheckRole(row.tableId, false)
-      }).then((response) => {
+      toProjectTableCheckRole(row.tableId, false).then((response) => {
         this.msgSuccess(response.msg)
       }).catch(function() {})
     },
     handleToApiFile(row) {
-      this.$confirm('正在使用代码生成配置迁移脚本请确认?', '提示', {
-        confirmButtonText: '生成',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(function() {
-        return apiToFile(row.tableId, true)
-      }).then((response) => {
+      apiToFile(row.tableId, true).then((response) => {
         this.msgSuccess(response.msg)
       }).catch(function() {})
     },
     handleToDB(row) {
-      this.$confirm('正在使用【菜单以及API生成到数据库】请确认?', '提示', {
-        confirmButtonText: '写入DB',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(function() {
-        return toDBTable(row.tableId)
-      }).then((response) => {
+      toDBTable(row.tableId).then((response) => {
         this.msgSuccess(response.msg)
       }).catch(function() {})
     },
@@ -338,13 +380,25 @@ export default {
           this.msgError(response.msg)
         }
       }).catch(function() {})
+    },
+    handleSingleDelete(row) {
+      const tableIds = row.tableId || this.ids
+      delTable(tableIds).then((response) => {
+        if (response.code === 200) {
+          this.msgSuccess(response.msg)
+          this.open = false
+          this.getList()
+        } else {
+          this.msgError(response.msg)
+        }
+      }).catch(function() {})
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
- .el-dialog-container /deep/{
+ .el-dialog-container ::v-deep{
    height:600px;
    overflow: hidden;
    .el-scrollbar__view{
@@ -361,4 +415,26 @@ export default {
      display: none;
    }
  }
+ ::v-deep .el-dialog__body{
+    padding: 0 20px;
+    margin:0;
+  }
+
+   .tag-group .el-tag{
+    margin-left: 10px;
+  }
+
+</style>
+
+<style lang="scss">
+  #codemirror {
+      height: auto;
+      margin: 0;
+      overflow: auto;
+    }
+  .CodeMirror {
+      overflow:auto;
+      border: 1px solid #eee;
+      height: 600px;
+    }
 </style>

src/views/login/index.vue

@@ -432,7 +432,7 @@ $cursor: #fff;
 
 /* reset element-ui css */
 .login-container {
-  /deep/ .el-input {
+  ::v-deep .el-input {
     display: inline-block;
     height: 47px;
     width: 85%;

src/views/sys-tools/monitor.vue

@@ -42,11 +42,11 @@
               </div>
               <div class="monitor">
                 <div class="monitor-header">
-                  <el-progress :color="$store.state.settings.theme" type="circle" :percentage=" Number(( info.disk.free / info.disk.total * 100).toFixed(2))" />
+                  <el-progress :color="$store.state.settings.theme" type="circle" :percentage=" Number(( (info.disk.total-info.disk.free) / info.disk.total * 100).toFixed(2))" />
                 </div>
                 <div class="monitor-footer">
                   <Cell label="总磁盘" :value="info.disk.total+'G'" border />
-                  <Cell label="已用磁盘" :value="info.disk.free+'G'" />
+                  <Cell label="已用磁盘" :value="info.disk.total-info.disk.free+'G'" />
                 </div>
               </div>
             </el-card>
@@ -74,7 +74,7 @@
             <Cell label="服务器IP" :value="info.os.ip" border />
             <Cell label="系统架构" :value="info.os.arch" border />
             <Cell label="CPU" :value="info.cpu.cpuInfo[0].modelName" border />
-            <Cell label="当前时间" :value="info.os.time"/>
+            <Cell label="当前时间" :value="info.os.time" />
           </div>
         </el-card>
 

vue.config.js

@@ -60,8 +60,11 @@ module.exports = {
     }
   },
   chainWebpack(config) {
-    config.plugins.delete('preload') // TODO: need test
-    config.plugins.delete('prefetch') // TODO: need test
+    // it can improve the speed of the first screen, it is recommended to turn on preload
+    // config.plugins.delete('preload')
+
+    // when there are many pages, it will cause too many meaningless requests
+    config.plugins.delete('prefetch') //
 
     config.module
       .rule('svg')