调整页面

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

@@ -40,7 +40,7 @@
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="isNull" label="不是null" width="200">
+                <!-- <el-table-column prop="isNull" label="不是null" width="200">
                     <template slot-scope="scope">
                         <el-radio-group v-model="scope.row.isNull">
                             <el-radio :label="true">是</el-radio>
@@ -67,6 +67,39 @@
                             <el-radio :label="false">否</el-radio>
                         </el-radio-group>
                     </template>
+                </el-table-column> -->
+
+                <el-table-column prop="isNull" label="不是null" width="100">
+                    <template slot-scope="scope">
+                        <!-- <el-radio-group v-model="scope.row.isNull">
+                            <el-radio :label="true">是</el-radio>
+                            <el-radio :label="false">否</el-radio>
+                        </el-radio-group> -->
+                        <el-checkbox v-model="scope.row.isNull"></el-checkbox>
+                    </template>
+                </el-table-column>
+
+
+                <el-table-column prop="isPrimary" label="键" width="100">
+                    <template slot-scope="scope">
+                        <!-- <el-radio-group v-model="scope.row.isPrimary">
+                            <el-radio :label="true">是</el-radio>
+                            <el-radio :label="false">否</el-radio>
+                        </el-radio-group> -->
+
+                        <!-- <span v-if="scope.$index == 0"></span> -->
+                        <el-checkbox v-model="scope.row.isPrimary" @change="hanleCheckbox(scope.$index)"></el-checkbox>
+                    </template>
+                </el-table-column>
+
+                <el-table-column prop="isAuto" label="自增" width="100">
+                    <template slot-scope="scope">
+                        <!-- <el-radio-group v-show="scope.row.isPrimary" v-model="scope.row.isAuto">
+                            <el-radio :label="true">是</el-radio>
+                            <el-radio :label="false">否</el-radio>
+                        </el-radio-group> -->
+                        <el-checkbox v-model="scope.row.isAuto"></el-checkbox>
+                    </template>
                 </el-table-column>
 
                 <el-table-column prop="fieldDescription" label="字段描述" width="200">
@@ -118,6 +151,17 @@ export default {
         this.info()
     },
     methods: {
+        hanleCheckbox(ind) {
+            this.experienceData.forEach((item, index) => {
+                if (index != ind) {
+                    item.isPrimary = false;
+                }
+                if(index==ind){
+                    item.isNull=true
+                }
+
+            })
+        },
         //增加经验行
         handleAddExperienceline() {
             if (this.experienceData == undefined) {

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

@@ -2,10 +2,10 @@
     <div class="app-container">
         <el-card style="margin-bottom: 15px;">
             <el-form ref="form" :model="form" label-width="100px">
-                <el-form-item label="数据库名称">
+                <el-form-item label="数据库名称" required>
                     <el-input v-model="form.dataBaseName" style="width: 600px;"></el-input>
                 </el-form-item>
-                <el-form-item label="数据表名称">
+                <el-form-item label="数据表名称" required>
                     <el-input v-model="form.tableName" style="width: 600px;"></el-input>
                 </el-form-item>
                 <el-form-item label="表描述">
@@ -40,32 +40,22 @@
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="isNull" label="不是null" width="200">
+                <el-table-column prop="isNull" label="不是null" width="100">
                     <template slot-scope="scope">
-                        <el-radio-group v-model="scope.row.isNull">
-                            <el-radio :label="true">是</el-radio>
-                            <el-radio :label="false">否</el-radio>
-                        </el-radio-group>
+                        <el-checkbox v-model="scope.row.isNull"></el-checkbox>
                     </template>
                 </el-table-column>
 
 
-
-                <el-table-column prop="isPrimary" label="键" width="200">
+                <el-table-column prop="isPrimary" label="键" width="100">
                     <template slot-scope="scope">
-                        <el-radio-group v-model="scope.row.isPrimary">
-                            <el-radio :label="true">是</el-radio>
-                            <el-radio :label="false">否</el-radio>
-                        </el-radio-group>
+                        <el-checkbox v-model="scope.row.isPrimary" @change="hanleCheckbox(scope.$index)"></el-checkbox>
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="isAuto" label="自增" width="200">
+                <el-table-column prop="isAuto" label="自增" width="100">
                     <template slot-scope="scope">
-                        <el-radio-group v-show="scope.row.isPrimary" v-model="scope.row.isAuto">
-                            <el-radio :label="true">是</el-radio>
-                            <el-radio :label="false">否</el-radio>
-                        </el-radio-group>
+                        <el-checkbox v-model="scope.row.isAuto"></el-checkbox>
                     </template>
                 </el-table-column>
 
@@ -107,9 +97,10 @@ export default {
             form: {
                 dataBaseName: '',
                 tableName: '',
-                tableComment:'',
+                tableComment: '',
             },
-            experienceData: [{
+            experienceData: [
+                {
                 fieldName: '',
                 fieldType: '',
                 fieldLength: undefined,
@@ -117,12 +108,23 @@ export default {
                 isPrimary: false,
                 fieldDescription: '',
                 isAuto: false
-            },],
-            dataBase: {}
-
+            },
+        ],
         }
     },
     methods: {
+        // 处理主键选框问题
+        hanleCheckbox(ind) {
+            this.experienceData.forEach((item, index) => {
+                if (index != ind) {
+                    item.isPrimary = false;
+                }
+                if (index == ind) {
+                    item.isNull = true
+                }
+
+            })
+        },
         //增加经验行
         handleAddExperienceline() {
             if (this.experienceData == undefined) {
@@ -151,6 +153,10 @@ export default {
             this.experienceData.splice(index, 1)
         },
         add() {
+            if(this.experienceData.length==0){
+                this.$modal.msgWarning("字段不可为空！")
+                return;
+            }
             this.experienceData.forEach((field) => {
                 if (field.fieldLength) {
                     field.fieldType = `${field.fieldType}(${field.fieldLength})`
@@ -160,7 +166,7 @@ export default {
             let query = {
                 dataBaseName: this.form.dataBaseName,
                 tableName: this.form.tableName,
-                tableComment:this.form.tableComment,
+                tableComment: this.form.tableComment,
                 field: this.experienceData
             }
             createDatabase(query).then(res => {
@@ -180,7 +186,7 @@ export default {
                         isAuto: false
                     }]
                 }
-            }).catch(err=>{
+            }).catch(err => {
                 console.log(err);
             })