feat: 升级

src/components/ProForm/components/Item.vue

@@ -24,7 +24,7 @@
       </component>
     </template>
     <template v-if="item.compOptions.elTagName === 'radio-button'">
-      <component :is="`el-radio-button`" v-for="(col, index) in itemEnum" :key="index" :label="col[item.compOptions.valueKey || 'value']">
+      <component :is="`el-radio-button`" v-for="(col, index) in itemEnum" :key="index" :value="col[item.compOptions.valueKey || 'value']">
         {{ col[item.compOptions.labelKey || 'label'] }}
       </component>
     </template>

src/components/ProForm/index.vue

@@ -2,8 +2,8 @@
   <component :is="'el-form'" v-bind="_formOptions" ref="proFormRef" :model="formModel">
     <el-row :gutter="5">
       <template v-for="item in itemsOptions" :key="item.prop">
-        <el-col :span="item.span || 24" g>
-          <component :is="'el-form-item'" v-bind="item" v-if="show(item.show)">
+        <el-col :span="item.span || 24" g v-if="show(item.show)">
+          <component :is="'el-form-item'" v-bind="item">
             <template #label>
               <el-space :size="4">
                 <span class="label-span">{{ `${item.label}` }}</span>

src/components/SelectIcon/index.vue

@@ -10,7 +10,7 @@
       @click="openDialog"
     >
       <template #append>
-        <el-button icon="customIcons[iconValue]" />
+        <el-button :icon="customIcons[iconValue] || ''" />
       </template>
     </el-input>
     <el-dialog v-model="dialogVisible" :title="placeholder" top="10%" width="40%">

src/styles/common.scss

@@ -6,6 +6,14 @@
   width: 120px;
   height: 120px;
 }
+
+/** 表单布局 **/
+.form-header {
+  padding-bottom: 5px;
+  margin: 8px 10px 25px;
+  font-size: 15px;
+  border-bottom: 1px solid #dddddd;
+}
 .avatar-upload-preview {
   position: absolute;
   top: 50%;

src/styles/element.scss

@@ -125,11 +125,6 @@ label {
 .content-box-c {
   height: 100%;
   padding: 24px;
-  .el-tabs__content {
-    max-height: 500px;
-
-    // padding: 24px;
-  }
   .el-collapse {
     // border: none;
     border-top: none;

src/views/system/menu/index.vue

@@ -16,7 +16,7 @@
       </template>
       <!-- 菜单图标 -->
       <template #icon="scope">
-        <el-icon :size="18">
+        <el-icon :size="18" v-if="scope.row.icon">
           <component :is="scope.row.icon"></component>
         </el-icon>
       </template>
@@ -271,7 +271,7 @@ const setItemsOptions = () => {
       show: val => {
         return val?.menuType !== 'F'
       },
-      tooltip: '访问路由的默认传递参数，如：`{"id": 1, "name": "taais"}`',
+      tooltip: '访问路由的默认传递参数，如：`{"id": 1, "name": "km"}`',
       compOptions: {
         elTagName: 'input',
         placeholder: '请输入路由地址'

src/views/tool/gen/components/columnInfo.vue

@@ -75,7 +75,7 @@ const columns = reactive<ColumnProps<any>[]>([
     render: scope => {
       return (
         <div>
-          <el-checkbox vModel_trim={scope.row.isInsert} true-label="1" />
+          <el-checkbox vModel_trim={scope.row.isInsert} true-value="1" />
         </div>
       )
     }
@@ -87,7 +87,7 @@ const columns = reactive<ColumnProps<any>[]>([
     render: scope => {
       return (
         <div>
-          <el-checkbox vModel_trim={scope.row.isEdit} true-label="1" />
+          <el-checkbox vModel_trim={scope.row.isEdit} true-value="1" />
         </div>
       )
     }
@@ -99,7 +99,7 @@ const columns = reactive<ColumnProps<any>[]>([
     render: scope => {
       return (
         <div>
-          <el-checkbox vModel_trim={scope.row.isList} true-label="1" />
+          <el-checkbox vModel_trim={scope.row.isList} true-value="1" />
         </div>
       )
     }
@@ -111,7 +111,7 @@ const columns = reactive<ColumnProps<any>[]>([
     render: scope => {
       return (
         <div>
-          <el-checkbox vModel_trim={scope.row.isQuery} true-label="1" />
+          <el-checkbox vModel_trim={scope.row.isQuery} true-value="1" />
         </div>
       )
     }

src/views/tool/gen/components/genInfoForm.vue

@@ -1,21 +1,43 @@
 <template>
   <ProForm ref="formRef" :items-options="items" :model="model" :form-options="_formOptions"> </ProForm>
+  <template v-if="model.tplCategory !== 'crud'">
+    <h4 class="form-header">其他信息</h4>
+  </template>
+  <ProForm ref="formRef2" :items-options="treeItemsOptions" :model="infoForm" :form-options="_formOptions"> </ProForm>
 </template>
 <script lang="ts" name="GenBasicInfo" setup>
-import { defineProps, ref } from 'vue'
+import { defineProps, ref, computed, watch } from 'vue'
 import ProForm from '@/components/ProForm/index.vue'
 const formRef = ref<InstanceType<typeof ProForm> | null>(null)
+const formRef2 = ref<InstanceType<typeof ProForm> | null>(null)
 export interface InfoProps {
   tables: any[] // 表格数据
   menus: any[] // 菜单
   model: any // 详情数据
 }
 
-const prop = withDefaults(defineProps<InfoProps>(), {
+const props = withDefaults(defineProps<InfoProps>(), {
   tables: () => [],
   menus: () => [],
   model: () => null
 })
+const subColumns = ref<any>([])
+const setSubTableColumns = (value: string) => {
+  props.tables.forEach((item: any) => {
+    const name = item.tableName
+    if (value === name) {
+      subColumns.value = item.columns
+      return
+    }
+  })
+}
+const infoForm = computed(() => props.model)
+watch(
+  () => infoForm.value.subTableName,
+  val => {
+    setSubTableColumns(val)
+  }
+)
 const tplData = [
   {
     label: '单表（增删改查）',
@@ -41,8 +63,125 @@ const genTypeData = [
   }
 ]
 const _formOptions = {
-  hasFooter: false
+  hasFooter: false,
+  labelWidth: 160
+}
+let treeItemsOptions: ProForm.ItemsOptions[] = []
+const setItemsOptions = () => {
+  treeItemsOptions = [
+    {
+      label: '树编码字段',
+      prop: 'treeCode',
+      span: 12,
+      tooltip: '树显示的编码字段名， 如：dept_id',
+      rules: [{ required: true, message: '树编码字段为空', trigger: 'change' }],
+      show: () => {
+        return props.model.tplCategory === 'tree'
+      },
+      compOptions: {
+        elTagName: 'select',
+        clearable: true,
+        style: 'width: 80%',
+        enum: props.model.columns.map((item: any) => {
+          return {
+            label: `${item.columnName}：${item.columnComment}`,
+            value: item.columnName
+          }
+        }),
+        placeholder: '请选择'
+      }
+    },
+    {
+      label: '树父编码字段',
+      prop: 'treeParentCode',
+      span: 12,
+      tooltip: '树显示的父编码字段名， 如：parent_Id',
+      show: () => {
+        return props.model.tplCategory === 'tree'
+      },
+      compOptions: {
+        elTagName: 'select',
+        clearable: true,
+        style: 'width: 80%',
+        enum: infoForm.value.columns.map((item: any) => {
+          return {
+            label: `${item.columnName}：${item.columnComment}`,
+            value: item.columnName
+          }
+        }),
+        placeholder: '请选择'
+      }
+    },
+    {
+      label: '树名称字段',
+      prop: 'treeName',
+      span: 12,
+      tooltip: '树节点的显示名称字段名， 如：dept_name',
+      show: () => {
+        return props.model.tplCategory === 'tree'
+      },
+      compOptions: {
+        elTagName: 'select',
+        clearable: true,
+        style: 'width: 80%',
+        enum: props.model.columns.map((item: any) => {
+          return {
+            label: `${item.columnName}：${item.columnComment}`,
+            value: item.columnName
+          }
+        }),
+        placeholder: '请选择'
+      }
+    },
+    {
+      label: '关联子表的表名',
+      prop: 'subTableName',
+      span: 12,
+      tooltip: '关联子表的表名， 如：sys_user',
+      show: () => {
+        return props.model.tplCategory === 'sub'
+      },
+      compOptions: {
+        elTagName: 'select',
+        clearable: true,
+        style: 'width: 80%',
+        enum: props.tables.map((item: any) => {
+          return {
+            label: `${item.tableName}：${item.tableComment}`,
+            value: item.tableName
+          }
+        }),
+        placeholder: '请选择',
+        onChange: () => {
+          setItemsOptions()
+          infoForm.value.subTableFkName = ''
+        }
+      }
+    },
+    {
+      label: '子表关联的外键名',
+      prop: 'subTableFkName',
+      span: 12,
+      tooltip: '子表关联的外键名， 如：user_id',
+      show: () => {
+        return props.model.tplCategory === 'sub'
+      },
+      compOptions: {
+        elTagName: 'select',
+        clearable: true,
+        style: 'width: 80%',
+        enum: subColumns.value.map((item: any) => {
+          return {
+            label: `${item.columnName}：${item.columnComment}`,
+            value: item.columnName
+          }
+        }),
+        placeholder: '请选择'
+      }
+    }
+  ]
 }
+
 let items: ProForm.ItemsOptions[] = []
 const setItem = () => {
   items = [
@@ -56,13 +195,19 @@ const setItem = () => {
         clearable: true,
         style: 'width: 80%',
         enum: tplData,
-        placeholder: '请输入生成模板'
+        placeholder: '请输入生成模板',
+        onChange: (val: string) => {
+          if (val !== 'sub') {
+            infoForm.value.subTableName = ''
+            infoForm.value.subTableFkName = ''
+          }
+        }
       }
     },
     {
       label: '生成包路径',
       prop: 'packageName',
-      tooltip: '生成在哪个java包下，例如 com.taais.system',
+      tooltip: '生成在哪个java包下，例如 com.km.system',
       span: 12,
       rules: [{ required: true, message: '生成包路径不能为空', trigger: 'blur' }],
       compOptions: {
@@ -119,7 +264,7 @@ const setItem = () => {
         placeholder: '请选择上级菜单',
         appendToBody: true,
         checkStrictly: true,
-        enum: prop.menus,
+        enum: props.menus,
         filterable: true,
         props: {
           value: 'menuId',
@@ -135,6 +280,7 @@ const setItem = () => {
       span: 12,
       compOptions: {
         elTagName: 'radio-group',
+        value: '0',
         enum: genTypeData,
         clearable: true,
         placeholder: '请输入作者'
@@ -143,7 +289,9 @@ const setItem = () => {
   ]
 }
 setItem()
+setItemsOptions()
 defineExpose({
-  formRef
+  formRef,
+  formRef2
 })
 </script>

src/views/tool/gen/editGenTable.vue

@@ -86,23 +86,31 @@ const emit = defineEmits<{
 }>()
 const formAllValidate = (form: any) => {
   return new Promise(resolve => {
-    form.validate((res: any) => {
-      resolve(res)
-    })
+    if (form) {
+      form.validate((res: any) => {
+        resolve(res)
+      })
+    } else {
+      resolve(true)
+    }
   })
 }
 const submitForm = () => {
   const basicEl = basicInfoRef.value?.formRef?.proFormRef
   const refsEl = genInfoRef.value?.formRef?.proFormRef
-  Promise.all([basicEl, refsEl].map(formAllValidate)).then((res: any) => {
+  const refsEl2 = genInfoRef.value?.formRef2?.proFormRef
+  const genTable2 = Object.assign({}, genInfoRef.value?.formRef2?.formModel)
+  Promise.all([basicEl, refsEl, refsEl2].map(formAllValidate)).then((res: any) => {
     const validate = res.every((item: any) => !!item)
     if (validate) {
       const genTable = Object.assign({}, info.value)
+      genTable.subTableFkName = genTable2.subTableFkName
+      genTable.subTableName = genTable2.subTableName
       genTable.columns = columns.value
       genTable.params = {
-        treeCode: genTable.treeCode,
-        treeName: genTable.treeName,
-        treeParentCode: genTable.treeParentCode,
+        treeCode: genTable2.treeCode,
+        treeName: genTable2.treeName,
+        treeParentCode: genTable2.treeParentCode,
         parentMenuId: genTable.parentMenuId
       }
       updateGenTableApi(genTable).then((response: any) => {