!41 feat: 表格添加刷新按钮；修改默认字段生成规则

Merge pull request !41 from zongyangleo/dev_20230328
lijwww · Apr 4, 2023 · f6e9076 · f6e9076
2 parents 14da4d7 + 2fefa43
commit f6e9076
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 9 deletions.
diff --git a/mayfly_go_web/src/views/ops/component/TagTree.vue b/mayfly_go_web/src/views/ops/component/TagTree.vue
@@ -19,6 +19,11 @@
                             <span class="ml3">
                                 <slot name="label" :data="data"> {{ data.label }}</slot>
                             </span>
+
+                            <span class="ml3">
+                                <slot name="option" :data="data"></slot>
+                            </span>
+
                         </span>
                     </template>
                 </el-tree>

diff --git a/mayfly_go_web/src/views/ops/db/CreateTable.vue b/mayfly_go_web/src/views/ops/db/CreateTable.vue
@@ -311,10 +311,10 @@ const addDefaultRows = () => {
         { name: 'id', type: 'bigint', length: '20', value: '', notNull: true, pri: true, auto_increment: true, remark: '主键ID' },
         { name: 'creator_id', type: 'bigint', length: '20', value: '', notNull: true, pri: false, auto_increment: false, remark: '创建人id' },
         { name: 'creator', type: 'varchar', length: '100', value: '', notNull: true, pri: false, auto_increment: false, remark: '创建人姓名' },
-        { name: 'creat_time', type: 'datetime', length: '', value: '', notNull: true, pri: false, auto_increment: false, remark: '创建时间' },
-        { name: 'updater_id', type: 'bigint', length: '20', value: '', notNull: true, pri: false, auto_increment: false, remark: '修改人id' },
-        { name: 'updater', type: 'varchar', length: '100', value: '', notNull: true, pri: false, auto_increment: false, remark: '修改人姓名' },
-        { name: 'update_time', type: 'datetime', length: '', value: '', notNull: true, pri: false, auto_increment: false, remark: '修改时间' },
+        { name: 'create_time', type: 'datetime', length: '', value: 'CURRENT_TIMESTAMP', notNull: true, pri: false, auto_increment: false, remark: '创建时间' },
+        { name: 'updator_id', type: 'bigint', length: '20', value: '', notNull: true, pri: false, auto_increment: false, remark: '修改人id' },
+        { name: 'updator', type: 'varchar', length: '100', value: '', notNull: true, pri: false, auto_increment: false, remark: '修改人姓名' },
+        { name: 'update_time', type: 'datetime', length: '', value: 'CURRENT_TIMESTAMP', notNull: true, pri: false, auto_increment: false, remark: '修改时间' },
     );
 };
 
@@ -406,7 +406,8 @@ const genSql = () => {
         let val = cl.value ? (cl.value === 'CURRENT_TIMESTAMP' ? cl.value : '\'' + cl.value + '\'') : '';
         let defVal = `${val ? ('DEFAULT ' + val) : ''}`;
         let length = cl.length ? `(${cl.length})` : '';
-        return ` ${cl.name} ${cl.type}${length} ${cl.notNull ? 'NOT NULL' : 'NULL'} ${cl.auto_increment ? 'AUTO_INCREMENT' : ''} ${defVal} comment '${cl.remark || ''}' `
+        let onUpdate = 'update_time' === cl.name ? ' ON UPDATE CURRENT_TIMESTAMP ' : ''
+        return ` ${cl.name} ${cl.type}${length} ${cl.notNull ? 'NOT NULL' : 'NULL'} ${cl.auto_increment ? 'AUTO_INCREMENT' : ''} ${defVal} ${onUpdate} comment '${cl.remark || ''}' `
     }
 
     let data = state.tableData;
@@ -416,7 +417,7 @@ const genSql = () => {
             let primary_key = '';
             let fields: string[] = [];
             data.fields.res.forEach((item) => {
-                fields.push(genColumnBasicSql(item));
+              item.name && fields.push(genColumnBasicSql(item));
                 if (item.pri) {
                     primary_key += `${item.name},`;
                 }

diff --git a/mayfly_go_web/src/views/ops/db/SqlExec.vue b/mayfly_go_web/src/views/ops/db/SqlExec.vue
@@ -59,6 +59,11 @@
 
                         <SvgIcon name="Files"  v-if="data.type == NodeType.SqlMenu || data.type == NodeType.Sql" color="#f56c6c" />
                     </template>
+                    <template #option="{data}">
+                      <span v-if="data.type == NodeType.TableMenu">
+                        <el-link @click="reloadTables(data.key)" icon="refresh" :underline="false"></el-link>
+                      </span>
+                    </template>
                 </tag-tree>
             </el-col>
             <el-col :span="20">
@@ -125,6 +130,7 @@ const state = reactive({
     nowDbInst: {} as DbInst,
     db: '', // 当前操作的数据库
     activeName: '',
+    reloadStatus: false,
     tabs,
     dataTabsTableHeight: '600',
     editorHeight: '600',
@@ -257,7 +263,8 @@ const nodeClick = async (data: any) => {
 
 const getTables = async (params: any) => {
     const { id, db } = params;
-    let tables = await DbInst.getInst(id).loadTables(db);
+    let tables = await DbInst.getInst(id).loadTables(db, state.reloadStatus);
+    state.reloadStatus=false
     return tables.map((x: any) => {
         return new TagTreeNode(`${id}.${db}.${x.tableName}`, x.tableName, NodeType.Table).withIsLeaf(true).withParams({
             id,
@@ -406,6 +413,11 @@ const getSqlMenuNodeKey = (dbId: number, db: string) => {
     return `${dbId}.${db}.sql-menu`
 }
 
+const reloadTables = (nodeKey:string) => {
+  state.reloadStatus=true
+  tagTreeRef.value.reloadNode(nodeKey);
+}
+
 const registerSqlCompletionItemProvider = () => {
     // 参考 https://microsoft.github.io/monaco-editor/playground.html#extending-language-services-completion-provider-example
     self.completionItemProvider = self.completionItemProvider || monaco.languages.registerCompletionItemProvider('sql', {

diff --git a/mayfly_go_web/src/views/ops/db/db.ts b/mayfly_go_web/src/views/ops/db/db.ts
@@ -58,13 +58,14 @@ export class DbInst {
     /**
      * 加载数据库表信息
      * @param dbName 数据库名
+     * @param reload 是否重新请求接口获取数据
      * @returns 表信息
      */
-    async loadTables(dbName: string) {
+    async loadTables(dbName: string, reload?: boolean) {
         const db = this.getDb(dbName);
         // 优先从 table map中获取
         let tables = db.tables;
-        if (tables) {
+        if (!reload && tables) {
             return tables;
         }
         console.log(`load tables -> dbName: ${dbName}`);