数据库表编辑新增合并

ruoyi-ui/src/views/dataEngine/datamodeling/editTable.vue

@@ -1,15 +1,19 @@
 <template>
   <div class="app-container">
-    <el-card style="margin-bottom: 15px;">
+    <el-card style="margin-bottom: 15px">
       <el-form ref="form" :model="form" label-width="100px">
         <!-- <el-form-item label="数据库名称">
             <el-input v-model="form.dataBaseName" style="width: 600px;"></el-input>
         </el-form-item> -->
         <el-form-item label="数据表名称">
-          <el-input v-model="form.tableName" style="width: 600px;" :disabled="true"></el-input>
+          <el-input
+            v-model="form.tableName"
+            style="width: 600px"
+            :disabled="true"
+          ></el-input>
         </el-form-item>
         <el-form-item label="表描述">
-          <el-input v-model="form.tableComment" style="width: 600px;"></el-input>
+          <el-input v-model="form.tableComment" style="width: 600px"></el-input>
         </el-form-item>
       </el-form>
     </el-card>
@@ -31,7 +35,6 @@
               <el-option label="varchar" value="varchar"></el-option>
             </el-select>
           </template>
-
         </el-table-column>
 
         <el-table-column prop="fieldLength" label="长度" width="200">
@@ -79,7 +82,6 @@
           </template>
         </el-table-column>
 
-
         <el-table-column prop="isPrimary" label="键" width="100">
           <template slot-scope="scope">
             <!-- <el-radio-group v-model="scope.row.isPrimary">
@@ -88,7 +90,10 @@
             </el-radio-group> -->
 
             <!-- <span v-if="scope.$index == 0"></span> -->
-            <el-checkbox v-model="scope.row.isPrimary" @change="hanleCheckbox(scope.$index)"></el-checkbox>
+            <el-checkbox
+              v-model="scope.row.isPrimary"
+              @change="hanleCheckbox(scope.$index)"
+            ></el-checkbox>
           </template>
         </el-table-column>
 
@@ -109,47 +114,54 @@
         </el-table-column>
         <el-table-column prop="operate" label="操作">
           <template slot-scope="scope">
-            <el-button size="mini" type="success" icon="el-icon-save"
+            <!-- <el-button size="mini" type="success" icon="el-icon-save"
                        @click="handlesaveExperience(scope.$index, scope.row)">保存
+            </el-button> -->
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="handleDeleteExperience(scope.$index, scope.row)"
+              >删除
             </el-button>
-            <el-button size="mini" type="danger" icon="el-icon-delete"
-                       @click="handleDeleteExperience(scope.$index, scope.row)">删除
-            </el-button>
-
           </template>
         </el-table-column>
       </el-table>
       <div>
-        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAddExperienceline">新增字段
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAddExperienceline"
+          >新增字段
         </el-button>
       </div>
     </el-card>
 
-    <div style="margin-top: 15px;">
+    <div style="margin-top: 15px">
       <el-button @click="edit" type="primary">修改</el-button>
     </div>
   </div>
 </template>
 
 <script>
-import {tableInfo, editTable} from '@/api/dataEngine/index'
+import { tableInfo, editTable } from "@/api/dataEngine/index";
 
 export default {
   name: "Datasheet",
   data() {
     return {
       form: {
-        dataBaseName: '',
-        tableName: '',
-        tableComment: '',
+        dataBaseName: "",
+        tableName: "",
+        tableComment: "",
       },
       experienceData: [],
-      dataBase: {}
-
-    }
+      dataBase: {},
+    };
   },
   created() {
-    this.info()
+    this.info();
   },
   methods: {
     hanleCheckbox(ind) {
@@ -158,10 +170,9 @@ export default {
           item.isPrimary = false;
         }
         if (index == ind) {
-          item.isNull = true
+          item.isNull = true;
         }
-
-      })
+      });
     },
     //增加经验行
     handleAddExperienceline() {
@@ -169,13 +180,13 @@ export default {
         this.experienceData = new Array();
       }
       let obj = {
-        fieldName: '',
-        fieldType: '',
+        fieldName: "",
+        fieldType: "",
         fieldLength: undefined,
         isNull: false,
         isPrimary: false,
-        fieldDescription: '',
-        isAuto: false
+        fieldDescription: "",
+        isAuto: false,
       };
 
       this.experienceData.push(obj);
@@ -188,55 +199,54 @@ export default {
     //删除经验行
     handleDeleteExperience(index) {
       console.log(index);
-      this.experienceData.splice(index, 1)
+      this.experienceData.splice(index, 1);
     },
     info() {
-      const tableName = this.$route.query.tableName
-      const tableComment = this.$route.query.tableComment
+      const tableName = this.$route.query.tableName;
+      const tableComment = this.$route.query.tableComment;
 
       let data = {
         tableName: this.$route.query.tableName,
         databaseType: this.$store.state.user.dataSource.databaseType,
         databaseName: this.$store.state.user.dataSource.databaseName,
-      }
+      };
 
-      tableInfo(data).then(response => {
+      tableInfo(data).then((response) => {
         console.log(response);
-        this.experienceData = response.data
-        this.form.tableName = tableName
-        this.form.tableComment = tableComment
+        this.experienceData = response.data;
+        this.form.tableName = tableName;
+        this.form.tableComment = tableComment;
       });
     },
     edit() {
       this.experienceData.forEach((field) => {
         if (field.fieldLength) {
-          field.fieldType = `${field.fieldType}(${field.fieldLength})`
+          field.fieldType = `${field.fieldType}(${field.fieldLength})`;
         }
-      })
+      });
       let query = {
         databaseType: this.$store.state.user.dataSource.databaseType,
         databaseName: this.$store.state.user.dataSource.databaseName,
         tableName: this.form.tableName,
         tableComment: this.form.tableComment,
-        field: this.experienceData
-      }
-      editTable(query).then(res => {
-
-        this.$modal.msgSuccess(res.msg);
-        if (res.code === 200) {
-          this.visible = false;
-          this.$emit("ok");
-          Object.keys(this.form).forEach(key => (this.form[key] = ''));
-          this.experienceData = []
-
-        }
-      }).catch(err => {
-        console.log(err);
-      })
+        field: this.experienceData,
+      };
+      editTable(query)
+        .then((res) => {
+          this.$modal.msgSuccess(res.msg);
+          if (res.code === 200) {
+            this.visible = false;
+            this.$emit("ok");
+            Object.keys(this.form).forEach((key) => (this.form[key] = ""));
+            this.experienceData = [];
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+        });
       // 关闭当前页面
       this.$tab.closePage();
-    }
-
-  }
-}
+    },
+  },
+};
 </script>

ruoyi-ui/src/views/dataEngine/datamodeling/index.vue

@@ -176,7 +176,7 @@ export default {
     },
     handleUpdate(row) {
       this.$router.push({
-        path: "/datasheet/editTable",
+        path: "/datasheet/mysql",
         query: {
           tableName: row.tableName,
           tableComment: row.tableComment,

ruoyi-ui/src/views/tableMange/index.vue

@@ -810,12 +810,6 @@ export default {
       for (let i = 0; i < tableFieldList.length; i++) {
         let temp = tableFieldList[i];
         if (temp.isShow) {
-          // console.log("字段描述:", temp.fieldDescription);
-          // if (!temp.fieldDescription) {
-          //   console.log("有空的字段描述");
-          //   //字段描述不能为空
-          //   return true;
-          // }
           let tempArr = temp.tableName + "." + temp.fieldName;
           if (temp.isChildren) {
             tempArr += " as " + temp.tableName + "_" + temp.fieldName;
@@ -904,22 +898,28 @@ export default {
       if (!tableFieldList.length) return;
       for (let i = 0; i < tableFieldList.length; i++) {
         let temp = tableFieldList[i];
+        let tempFieldName = "";
+        if (temp.isChildren) {
+          tempFieldName = temp.tableName + "_" + temp.fieldName;
+        } else {
+          tempFieldName = temp.fieldName;
+        }
         if (temp.isShow) {
           let tempObj = {};
-          if (temp.isChildren) {
-            tempObj[temp.tableName + "_" + temp.fieldName] =
-              temp.fieldDescription;
-          } else {
-            tempObj[temp.fieldName] = temp.fieldDescription;
-          }
-          console.log(tempObj);
+          // if (temp.isChildren) {
+          //   tempObj[temp.tableName + "_" + temp.fieldName] =
+          //     temp.fieldDescription;
+          // } else {
+          //   tempObj[temp.fieldName] = temp.fieldDescription;
+          // }
+          tempObj[tempFieldName] = temp.fieldDescription;
           columns.push(tempObj);
         }
         if (temp.isSearch) {
-          searchFieldList.push(temp.fieldName);
+          searchFieldList.push(temp.tableName + "." + temp.fieldName);
         }
         if (temp.isExport) {
-          tableExportField[temp.fieldName] = temp.fieldDescription;
+          tableExportField[tempFieldName] = temp.fieldDescription;
         }
         // 递归
         // if (temp.relationFieldList) {
@@ -1127,6 +1127,11 @@ export default {
                 this.$message.warning("创建失败");
               }
             }
+            // 关闭当前页面
+            if (this.tId) {
+              this.$tab.closePage();
+            }
+            this.isShowPreview = false;
           }
         } else {
           this.$message.warning("请完善表单");

ruoyi-ui/src/views/tool/datasheet/index.vue

@@ -1,15 +1,19 @@
 <template>
   <div class="app-container">
-    <el-card style="margin-bottom: 15px;">
+    <el-card style="margin-bottom: 15px">
       <el-form ref="form" :model="form" label-width="100px" :rules="rules">
         <!-- <el-form-item label="数据库名称" prop="dataBaseName">
             <el-input v-model="form.dataBaseName" style="width: 600px;"></el-input>
         </el-form-item> -->
         <el-form-item label="数据表名称" prop="tableName">
-          <el-input v-model="form.tableName" style="width: 600px;"></el-input>
+          <el-input
+            v-model="form.tableName"
+            :disabled="isEdited"
+            style="width: 600px"
+          ></el-input>
         </el-form-item>
         <el-form-item label="表描述">
-          <el-input v-model="form.tableComment" style="width: 600px;"></el-input>
+          <el-input v-model="form.tableComment" style="width: 600px"></el-input>
         </el-form-item>
       </el-form>
     </el-card>
@@ -21,25 +25,46 @@
         <el-table :data="experienceData" stripe style="width: 100%">
           <el-table-column prop="fieldName" label="字段名称" width="200">
             <template slot-scope="scope">
-              <el-form-item :prop="'fieldName' + scope.$index" :name="'fieldName' + scope.$index"
-                            style="margin: 0px;padding: 0px;">
+              <el-form-item
+                :prop="'fieldName' + scope.$index"
+                :name="'fieldName' + scope.$index"
+                style="margin: 0px; padding: 0px"
+              >
                 <el-input v-model="scope.row.fieldName"></el-input>
               </el-form-item>
             </template>
           </el-table-column>
           <el-table-column prop="fieldType" label="字段类型" width="200">
             <template slot-scope="scope">
-              <el-form-item :prop="'fieldType' + scope.$index" :name="'fieldType' + scope.$index"
-                            style="margin: 0px;padding: 0px;">
-                <el-select v-model="scope.row.fieldType" filterable @blur="selectBlur(scope)"
-                           @change="handleSelected(dict.type.mysql_data_type.find(item => item.label === scope.row.fieldType), scope)">
+              <el-form-item
+                :prop="'fieldType' + scope.$index"
+                :name="'fieldType' + scope.$index"
+                style="margin: 0px; padding: 0px"
+              >
+                <el-select
+                  v-model="scope.row.fieldType"
+                  filterable
+                  @blur="selectBlur(scope)"
+                  @change="
+                    handleSelected(
+                      dict.type[databaseType + '_data_type'].find(
+                        (item) => item.label === scope.row.fieldType
+                      ),
+                      scope
+                    )
+                  "
+                >
                   <!-- <el-option v-for="item in list" :key="item" :label="item" :value="item">
                   </el-option> -->
                   <!--
                   <el-option v-for="item in dict.type.mysql_data_type"  :label="item.dictLabel" :value="item.dictValue">
                   </el-option> -->
-                  <el-option v-for="item in dict.type.mysql_data_type" :key="item.value"
-                             :label="item.label" :value="item.value"/>
+                  <el-option
+                    v-for="item in dict.type[databaseType + '_data_type']"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
                 </el-select>
               </el-form-item>
             </template>
@@ -47,12 +72,17 @@
 
           <el-table-column prop="fieldLength" label="长度" width="200">
             <template slot-scope="scope">
-              <el-form-item :prop="'fieldLength' + scope.$index" :name="'fieldLength' + scope.$index"
-                            style="margin: 0px;padding: 0px;">
+              <el-form-item
+                :prop="'fieldLength' + scope.$index"
+                :name="'fieldLength' + scope.$index"
+                style="margin: 0px; padding: 0px"
+              >
                 <!--                <el-input v-model="scope.row.fieldLength"-->
                 <!--                          :disabled="handleSelected(dict.type.mysql_data_type.find(item => item.label === scope.row.fieldType), scope)"></el-input>-->
-                <el-input v-model="scope.row.fieldLength"
-                          :disabled="changduclick(scope.$index)"></el-input>
+                <el-input
+                  v-model="scope.row.fieldLength"
+                  :disabled="changduclick(scope.$index)"
+                ></el-input>
               </el-form-item>
             </template>
           </el-table-column>
@@ -63,10 +93,12 @@
             </template>
           </el-table-column>
 
-
           <el-table-column prop="isPrimary" label="键" width="100">
             <template slot-scope="scope">
-              <el-checkbox v-model="scope.row.isPrimary" @change="hanleCheckbox(scope.$index)"></el-checkbox>
+              <el-checkbox
+                v-model="scope.row.isPrimary"
+                @change="hanleCheckbox(scope.$index)"
+              ></el-checkbox>
             </template>
           </el-table-column>
 
@@ -86,39 +118,56 @@
               <!-- <el-button size="mini" type="success" icon="el-icon-save"
                   @click="handlesaveExperience(scope.$index, scope.row)">保存
               </el-button> -->
-              <el-button size="mini" type="danger" icon="el-icon-delete"
-                         @click="handleDeleteExperience(scope.$index, scope.row)">删除
+              <el-button
+                size="mini"
+                type="danger"
+                icon="el-icon-delete"
+                @click="handleDeleteExperience(scope.$index, scope.row)"
+                >删除
               </el-button>
-
             </template>
           </el-table-column>
         </el-table>
       </el-form>
       <div>
-        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAddExperienceline">新增字段
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAddExperienceline"
+          >新增字段
         </el-button>
       </div>
     </el-card>
 
-    <div style="margin-top: 15px;">
-      <el-button @click="add" type="primary">添加</el-button>
+    <div style="margin-top: 15px">
+      <el-button v-if="!isEdited" @click="add" type="primary">添加</el-button>
+      <el-button v-else @click="edit" type="primary">修改</el-button>
     </div>
   </div>
 </template>
 
 <script>
-import {createDatabase} from "@/api/datasheet/index"
-
+import { createDatabase } from "@/api/datasheet/index";
+import { tableInfo, editTable } from "@/api/dataEngine/index";
+import { mapState } from "vuex";
 export default {
   name: "Datasheet",
-  dicts: ['mysql_data_type'],
+  dicts: [
+    "mysql_data_type",
+    "sqlserver_data_type",
+    "dm_data_type",
+    "oracle_data_type",
+    "datasource_type",
+  ],
   data() {
     return {
+      isEdited: false,
       testzidian: null,
       form: {
-        dataBaseName: '',
-        tableName: '',
-        tableComment: '',
+        dataBaseName: "",
+        tableName: "",
+        tableComment: "",
       },
       experienceDataForm: {},
       experienceData: [
@@ -133,43 +182,97 @@ export default {
         // },
       ],
       rules: {
-        dataBaseName: {required: true, message: '请输入数据库名称', trigger: 'blur'},
-        tableName: {required: true, message: '请输入数据库名称', trigger: 'blur'}
-      },
-      tableform:
-        {
-          // fieldName0: { required: true, message: '请输入字段名称', trigger: 'blur' },
-          // fieldType0: { required: true, message: '请选择', trigger: 'change' },
-          // fieldLength0: { required: true, message: '请输入', trigger: 'blur' },
+        dataBaseName: {
+          required: true,
+          message: "请输入数据库名称",
+          trigger: "blur",
         },
-      list: [
-        'int', 'varchar'
-      ],
-      // 长度输入框禁用列数组
-      Inoputdisabled: []
+        tableName: {
+          required: true,
+          message: "请输入数据库名称",
+          trigger: "blur",
+        },
+      },
+      tableform: {
+        // fieldName0: { required: true, message: '请输入字段名称', trigger: 'blur' },
+        // fieldType0: { required: true, message: '请选择', trigger: 'change' },
+        // fieldLength0: { required: true, message: '请输入', trigger: 'blur' },
+      },
+      list: ["int", "varchar"],
+
+      Inoputdisabled: [],
+      // 需要指定长度
+      mysqlAllowLength: ["char", "varchar", "numeric", "decimal"],
+    };
+  },
+  created() {
+    if (this.$route.query.tableName && this.$route.query.tableComment) {
+      this.isEdited = true;
+      this.info();
+    } else {
+      Object.keys(this.dataBaseName).forEach((item) => {
+        this.dataBaseName[item] = "";
+      });
+      this.experienceData = [];
     }
   },
+  computed: {
+    ...mapState({
+      databaseName: (state) => state.user.dataSource.databaseName,
+      databaseType: (state) => state.user.dataSource.databaseType,
+    }),
+  },
   watch: {
     experienceData: {
       handler(n, o) {
         // do something
-        this.experienceDataForm = {}
-        let rulesAdd = {}
+        this.experienceDataForm = {};
+        let rulesAdd = {};
         this.experienceData.forEach((item, index) => {
-          this.$set(this.experienceDataForm, "fieldName" + index, item.fieldName);
-          this.$set(this.experienceDataForm, "fieldType" + index, item.fieldType);
-          this.$set(this.experienceDataForm, "fieldLength" + index, item.fieldLength);
+          this.$set(
+            this.experienceDataForm,
+            "fieldName" + index,
+            item.fieldName
+          );
+          this.$set(
+            this.experienceDataForm,
+            "fieldType" + index,
+            item.fieldType
+          );
+          this.$set(
+            this.experienceDataForm,
+            "fieldLength" + index,
+            item.fieldLength
+          );
           // rulesAdd['' + index] = item.fieldName
           // rulesAdd['fieldType' + index] = item.fieldType
           // rulesAdd['fieldLength' + index] = item.fieldLength
           // this.experienceDataForm = {...rulesAdd}
-        })
+        });
         console.log(this.experienceDataForm);
       },
-      deep: true// 深度监听父组件传过来对象变化
-    }
+      deep: true, // 深度监听父组件传过来对象变化
+    },
   },
   methods: {
+    // 初始化表格数据
+    info() {
+      const tableName = this.$route.query.tableName;
+      const tableComment = this.$route.query.tableComment;
+
+      let data = {
+        tableName: this.$route.query.tableName,
+        databaseType: this.databaseType,
+        databaseName: this.databaseName,
+      };
+
+      tableInfo(data).then((response) => {
+        console.log(response);
+        this.experienceData = response.data;
+        this.form.tableName = tableName;
+        this.form.tableComment = tableComment;
+      });
+    },
     // 处理长度框是否可输入
     changduclick(inputIndex) {
       return this.Inoputdisabled[inputIndex];
@@ -179,43 +282,62 @@ export default {
       if (tem == undefined) return;
       // console.log(this.experienceDataForm)
       // console.log(this.tableform)
-      if (tem.raw.listClass === 'success') {
-        this.Inoputdisabled[scope.$index] = true;// 禁用长度输入框
-        this.tableform['fieldLength' + scope.$index].required = false; // 禁用长度输入框的校验
-        return this.$set(this.experienceDataForm, "fieldType" + scope.$index, scope.row.fieldType);
+      if (tem.raw.listClass === "success") {
+        this.Inoputdisabled[scope.$index] = true; // 禁用长度输入框
+        this.tableform["fieldLength" + scope.$index].required = false; // 禁用长度输入框的校验
+        return this.$set(
+          this.experienceDataForm,
+          "fieldType" + scope.$index,
+          scope.row.fieldType
+        );
       }
-      this.Inoputdisabled[scope.$index] = false;// 解除禁用
-      this.tableform['fieldLength' + scope.$index].required = true; // 启用长度输入框的校验
-      return this.$set(this.experienceDataForm, "fieldType" + scope.$index, scope.row.fieldType);
+      this.Inoputdisabled[scope.$index] = false; // 解除禁用
+      this.tableform["fieldLength" + scope.$index].required = true; // 启用长度输入框的校验
+      return this.$set(
+        this.experienceDataForm,
+        "fieldType" + scope.$index,
+        scope.row.fieldType
+      );
     },
 
     // 下拉选中事件
     selectBlur(aa) {
       if (aa.row.fieldType == "") {
-        aa.row.fieldType = undefined
+        aa.row.fieldType = undefined;
       }
     },
 
-
     // 处理非空校验问题
     handleRules(type, delindex) {
-      if (type == 'add') {
+      if (type == "add") {
         let rulesAdd = {};
         // 得到添加一行的下标
         let index = this.experienceData.length - 1;
-        rulesAdd['fieldName' + index] = {required: true, message: '请输入字段名称', trigger: 'blur'}
-        rulesAdd['fieldType' + index] = {required: true, message: '请选择', trigger: 'change'}
-        rulesAdd['fieldLength' + index] = {required: true, message: '请输入', trigger: 'blur'}
+        rulesAdd["fieldName" + index] = {
+          required: true,
+          message: "请输入字段名称",
+          trigger: "blur",
+        };
+        rulesAdd["fieldType" + index] = {
+          required: true,
+          message: "请选择",
+          trigger: "change",
+        };
+        rulesAdd["fieldLength" + index] = {
+          required: true,
+          message: "请输入",
+          trigger: "blur",
+        };
         // 序列化当前校验规则对象
         this.tableform = {
           ...this.tableform,
-          ...rulesAdd
-        }
-      } else if (type == 'del') {
+          ...rulesAdd,
+        };
+      } else if (type == "del") {
         // 删除校验规则对象中的元素
-        this.$delete(this.tableform, 'fieldName' + delindex);
-        this.$delete(this.tableform, 'fieldType' + delindex);
-        this.$delete(this.tableform, 'fieldLength' + delindex);
+        this.$delete(this.tableform, "fieldName" + delindex);
+        this.$delete(this.tableform, "fieldType" + delindex);
+        this.$delete(this.tableform, "fieldLength" + delindex);
       }
     },
 
@@ -226,9 +348,9 @@ export default {
           item.isPrimary = false;
         }
         if (index == ind && item.isPrimary == true) {
-          item.isNull = true
+          item.isNull = true;
         }
-      })
+      });
     },
     //增加经验行
     handleAddExperienceline() {
@@ -236,17 +358,18 @@ export default {
         this.experienceData = new Array();
       }
       let obj = {
-        fieldName: '',
-        fieldType: '',
+        fieldName: "",
+        fieldType: "",
         fieldLength: undefined,
+        isDisableFieldLength: true,
         isNull: false,
         isPrimary: false,
-        fieldDescription: '',
-        isAuto: false
+        fieldDescription: "",
+        isAuto: false,
       };
       this.experienceData.push(obj);
-      this.handleRules('add');
-      this.Inoputdisabled.push(false)
+      this.handleRules("add");
+      this.Inoputdisabled.push(false);
     },
     //保存经验行
     handlesaveExperience(a, b) {
@@ -255,61 +378,92 @@ export default {
     },
     //删除经验行
     handleDeleteExperience(index) {
-      this.experienceData.splice(index, 1)
-      this.handleRules('del', index);
+      this.experienceData.splice(index, 1);
+      this.handleRules("del", index);
     },
     add() {
       const rule1 = new Promise((resolve, reject) => {
-        this.$refs['form'].validate(valid => {
+        this.$refs["form"].validate((valid) => {
           if (valid) {
-            resolve()
+            resolve();
           } else {
             return false;
           }
-        })
-      })
+        });
+      });
       const rule2 = new Promise((resolve, reject) => {
-        this.$refs['tableform'].validate(valid => {
+        this.$refs["tableform"].validate((valid) => {
           if (valid) {
-            resolve()
+            resolve();
           } else {
             return false;
           }
-        })
-      })
+        });
+      });
       Promise.all([rule1, rule2]).then(() => {
         if (this.experienceData.length == 0) {
-          this.$modal.msgWarning("字段不可为空！")
+          this.$modal.msgWarning("字段不可为空！");
           return;
         }
         this.experienceData.forEach((field) => {
           if (field.fieldLength) {
-            field.fieldType = `${field.fieldType}(${field.fieldLength})`
+            field.fieldType = `${field.fieldType}(${field.fieldLength})`;
           }
-        })
+        });
         let query = {
           databaseType: this.$store.state.user.dataSource.databaseType,
           databaseName: this.$store.state.user.dataSource.databaseName,
           tableName: this.form.tableName,
           tableComment: this.form.tableComment,
-          field: this.experienceData
+          field: this.experienceData,
+        };
+        createDatabase(query)
+          .then((res) => {
+            this.$modal.msgSuccess(res.msg);
+            if (res.code === 200) {
+              this.visible = false;
+              this.$emit("ok");
+              Object.keys(this.form).forEach((key) => (this.form[key] = ""));
+              this.experienceData = [];
+              // 新增成功之后关闭当前页面
+              this.$tab.closePage();
+            }
+          })
+          .catch((err) => {
+            console.log(err);
+          });
+      });
+    },
+    edit() {
+      this.experienceData.forEach((field) => {
+        if (field.fieldLength) {
+          field.fieldType = `${field.fieldType}(${field.fieldLength})`;
         }
-        createDatabase(query).then(res => {
+      });
+      let query = {
+        databaseType: this.$store.state.user.dataSource.databaseType,
+        databaseName: this.$store.state.user.dataSource.databaseName,
+        tableName: this.form.tableName,
+        tableComment: this.form.tableComment,
+        field: this.experienceData,
+      };
+      editTable(query)
+        .then((res) => {
           this.$modal.msgSuccess(res.msg);
           if (res.code === 200) {
             this.visible = false;
             this.$emit("ok");
-            Object.keys(this.form).forEach(key => (this.form[key] = ''));
-            this.experienceData = []
-            // 新增成功之后关闭当前页面
-            this.$tab.closePage();
+            Object.keys(this.form).forEach((key) => (this.form[key] = ""));
+            this.experienceData = [];
           }
-        }).catch(err => {
-          console.log(err);
         })
-      })
-    }
-  }
-}
+        .catch((err) => {
+          console.log(err);
+        });
+      // 关闭当前页面
+      this.$tab.closePage();
+    },
+  },
+};
 </script>
 <style scoped></style>