refactor: codegen

This commit is contained in:
xingyu 2022-07-28 21:40:15 +08:00
parent 607f6e4bb5
commit 291f31be98
9 changed files with 127 additions and 126 deletions

View File

@ -1,5 +1,5 @@
import { useAxios } from '@/hooks/web/useAxios'
import type { CodegenTableVO } from './types'
import type { CodegenUpdateReqVO, CodegenCreateListReqVO } from './types'
const request = useAxios()
@ -14,12 +14,12 @@ export const getCodegenTableApi = (id: number) => {
}
// 新增代码生成表定义
export const createCodegenTableApi = (data: CodegenTableVO) => {
export const createCodegenTableApi = (data: CodegenCreateListReqVO) => {
return request.post({ url: '/infra/codegen/create', data })
}
// 修改代码生成表定义
export const updateCodegenTableApi = (data: CodegenTableVO) => {
export const updateCodegenTableApi = (data: CodegenUpdateReqVO) => {
return request.put({ url: '/infra/codegen/update', data })
}

View File

@ -1,5 +1,6 @@
export type CodegenTableVO = {
id: number
tableId: number
isParentMenuIdValid: boolean
dataSourceConfigId: number
scene: number
tableName: string
@ -49,3 +50,11 @@ export type CodegenPreviewVO = {
filePath: string
code: string
}
export type CodegenUpdateReqVO = {
table: CodegenTableVO
columns: CodegenColumnVO[]
}
export type CodegenCreateListReqVO = {
dataSourceConfigId: number
tableNames: string[]
}

View File

@ -1,47 +1,34 @@
<script lang="ts">
import { defineComponent, onMounted, onUpdated, PropType, ref } from 'vue'
<script setup lang="ts">
import { onMounted, onUpdated, PropType, ref } from 'vue'
import { getDictOptions, DictDataType } from '@/utils/dict'
import { ElTag } from 'element-plus'
export default defineComponent({
name: 'DictTag',
components: {
ElTag
const props = defineProps({
type: {
type: String as PropType<string>,
required: true
},
props: {
type: {
type: String as PropType<string>,
required: true
},
value: {
type: [String, Number] as PropType<string | number>,
required: true
}
},
setup(props) {
const dictData = ref<DictDataType>()
function getDictObj(dictType: string, value: string) {
const dictOptions = getDictOptions(dictType)
dictOptions.forEach((dict: DictDataType) => {
if (dict.value === value) {
dictData.value = dict
}
})
}
onMounted(() => {
return getDictObj(props.type, props.value?.toString())
})
onUpdated(() => {
getDictObj(props.type, props.value?.toString())
})
return {
props,
dictData
}
value: {
type: [String, Number] as PropType<string | number>,
required: true
}
})
const dictData = ref<DictDataType>()
const getDictObj = (dictType: string, value: string) => {
const dictOptions = getDictOptions(dictType)
dictOptions.forEach((dict: DictDataType) => {
if (dict.value === value) {
dictData.value = dict
}
})
}
onMounted(() => {
return getDictObj(props.type, props.value?.toString())
})
onUpdated(() => {
getDictObj(props.type, props.value?.toString())
})
</script>
<template>
<!-- 默认样式 -->

View File

@ -1,18 +1,16 @@
<script setup lang="ts">
import { ref, unref, onMounted } from 'vue'
import { ContentDetailWrap } from '@/components/ContentDetailWrap'
import BasicInfoForm from './BasicInfoForm.vue'
import CloumInfoFormVue from './CloumInfoForm.vue'
import GenInfoFormVue from './GenInfoForm.vue'
import { ElTabs, ElTabPane, ElButton } from 'element-plus'
import { getCodegenTableApi } from '@/api/infra/codegen'
import { BasicInfoForm, CloumInfoForm, GenInfoForm } from './components'
import { ElTabs, ElTabPane, ElButton, ElMessage } from 'element-plus'
import { getCodegenTableApi, updateCodegenTableApi } from '@/api/infra/codegen'
import { useRouter, useRoute } from 'vue-router'
import { useI18n } from '@/hooks/web/useI18n'
import { CodegenColumnVO, CodegenTableVO } from '@/api/infra/codegen/types'
import { CodegenTableVO, CodegenColumnVO, CodegenUpdateReqVO } from '@/api/infra/codegen/types'
const { t } = useI18n()
const { push } = useRouter()
const { query } = useRoute()
const tableCurrentRow = ref<Nullable<CodegenTableVO>>(null)
const tableCurrentRow = ref<CodegenTableVO>()
const cloumCurrentRow = ref<CodegenColumnVO[]>()
const getList = async () => {
const id = query.id as unknown as number
@ -26,17 +24,23 @@ const getList = async () => {
const loading = ref(false)
const activeName = ref('cloum')
const basicInfoRef = ref<ComponentRef<typeof BasicInfoForm>>()
const genInfoRef = ref<ComponentRef<typeof GenInfoFormVue>>()
const genInfoRef = ref<ComponentRef<typeof GenInfoForm>>()
const cloumInfoRef = ref(null)
const submitForm = async () => {
const basicInfo = unref(basicInfoRef)
const genInfo = unref(genInfoRef)
const basicValidate = await basicInfo?.elFormRef?.validate()?.catch(() => {})
const genValidate = await genInfo?.elFormRef?.validate()?.catch(() => {})
if (basicValidate && genValidate) {
const basicForm = await basicInfo?.elFormRef?.validate()?.catch(() => {})
const genForm = await genInfo?.elFormRef?.validate()?.catch(() => {})
if (basicForm && genForm) {
const basicInfoData = (await basicInfo?.getFormData()) as CodegenTableVO
const genInfoData = (await genInfo?.getFormData()) as CodegenTableVO
console.info(basicInfoData)
console.info(genInfoData)
const genTable: CodegenUpdateReqVO = {
table: Object.assign({}, basicInfoData, genInfoData),
columns: cloumCurrentRow.value
}
await updateCodegenTableApi(genTable)
ElMessage.success(t('common.updateSuccess'))
push('/infra/codegen')
}
}
onMounted(() => {
@ -46,14 +50,14 @@ onMounted(() => {
<template>
<ContentDetailWrap title="代码生成" @back="push('/infra/codegen')">
<el-tabs v-model="activeName">
<el-tab-pane label="基本信息" name="basic">
<BasicInfoForm ref="basicInfoRef" :current-row="tableCurrentRow" />
<el-tab-pane label="基本信息" name="basicInfo">
<BasicInfoForm ref="basicInfoRef" :basicInfo="tableCurrentRow" />
</el-tab-pane>
<el-tab-pane label="字段信息" name="cloum">
<CloumInfoFormVue ref="cloumInfoRef" :current-row="cloumCurrentRow" />
<CloumInfoForm ref="cloumInfoRef" :info="cloumCurrentRow" />
</el-tab-pane>
<el-tab-pane label="生成信息" name="genInfo">
<GenInfoFormVue ref="basicInfoRef" :current-row="tableCurrentRow" />
<GenInfoForm ref="genInfoRef" :genInfo="tableCurrentRow" />
</el-tab-pane>
</el-tabs>
<template #right>

View File

@ -5,7 +5,7 @@ import { CodegenTableVO } from '@/api/infra/codegen/types'
import { Form } from '@/components/Form'
import { useForm } from '@/hooks/web/useForm'
const props = defineProps({
currentRow: {
basicInfo: {
type: Object as PropType<Nullable<CodegenTableVO>>,
default: () => null
}
@ -66,11 +66,11 @@ const { register, methods, elFormRef } = useForm({
schema
})
watch(
() => props.currentRow,
(currentRow) => {
if (!currentRow) return
() => props.basicInfo,
(basicInfo) => {
if (!basicInfo) return
const { setValues } = methods
setValues(currentRow)
setValues(basicInfo)
},
{
deep: true,

View File

@ -4,8 +4,8 @@ import { onMounted, PropType, ref } from 'vue'
import { CodegenColumnVO } from '@/api/infra/codegen/types'
import { listSimpleDictTypeApi } from '@/api/system/dict/dict.type'
import { DictTypeVO } from '@/api/system/dict/types'
defineProps({
currentRow: {
const props = defineProps({
info: {
type: Array as unknown as PropType<CodegenColumnVO[]>,
default: () => null
}
@ -20,18 +20,21 @@ const tableHeight = document.documentElement.scrollHeight - 245 + 'px'
onMounted(async () => {
await getDictOptions()
})
defineExpose({
info: props.info
})
</script>
<template>
<el-table ref="dragTable" :data="currentRow" row-key="columnId" :max-height="tableHeight">
<el-table ref="dragTable" :data="info" row-key="columnId" :max-height="tableHeight">
<el-table-column
label="字段列名"
prop="columnName"
min-width="10%"
:show-overflow-tooltip="true"
/>
<el-table-column label="字段描述" min-width="10%">
<template #default="scope">
<el-input v-model="scope.row.columnComment" />
<el-table-column label="字段描述" min-width="10%" prop="columnComment">
<template #default="{ row }">
<el-input v-model="row.columnComment" />
</template>
</el-table-column>
<el-table-column
@ -40,9 +43,9 @@ onMounted(async () => {
min-width="10%"
:show-overflow-tooltip="true"
/>
<el-table-column label="Java类型" min-width="11%">
<template #default="scope">
<el-select v-model="scope.row.javaType">
<el-table-column label="Java类型" min-width="11%" prop="javaType">
<template #default="{ row }">
<el-select v-model="row.javaType">
<el-option label="Long" value="Long" />
<el-option label="String" value="String" />
<el-option label="Integer" value="Integer" />
@ -53,38 +56,34 @@ onMounted(async () => {
</el-select>
</template>
</el-table-column>
<el-table-column label="java属性" min-width="10%">
<template #default="scope">
<el-input v-model="scope.row.javaField" />
<el-table-column label="java属性" min-width="10%" prop="javaField">
<template #default="{ row }">
<el-input v-model="row.javaField" />
</template>
</el-table-column>
<el-table-column label="插入" min-width="4%">
<template #default="scope">
<el-checkbox true-label="true" false-label="false" v-model="scope.row.createOperation" />
<el-table-column label="插入" min-width="4%" prop="createOperation">
<template #default="{ row }">
<el-checkbox true-label="true" false-label="false" v-model="row.createOperation" />
</template>
</el-table-column>
<el-table-column label="编辑" min-width="4%">
<template #default="scope">
<el-checkbox true-label="true" false-label="false" v-model="scope.row.updateOperation" />
<el-table-column label="编辑" min-width="4%" prop="updateOperation">
<template #default="{ row }">
<el-checkbox true-label="true" false-label="false" v-model="row.updateOperation" />
</template>
</el-table-column>
<el-table-column label="列表" min-width="4%">
<template #default="scope">
<el-checkbox
true-label="true"
false-label="false"
v-model="scope.row.listOperationResult"
/>
<el-table-column label="列表" min-width="4%" prop="listOperationResult">
<template #default="{ row }">
<el-checkbox true-label="true" false-label="false" v-model="row.listOperationResult" />
</template>
</el-table-column>
<el-table-column label="查询" min-width="4%">
<template #default="scope">
<el-checkbox true-label="true" false-label="false" v-model="scope.row.listOperation" />
<el-table-column label="查询" min-width="4%" prop="listOperation">
<template #default="{ row }">
<el-checkbox true-label="true" false-label="false" v-model="row.listOperation" />
</template>
</el-table-column>
<el-table-column label="查询方式" min-width="10%">
<template #default="scope">
<el-select v-model="scope.row.listOperationCondition">
<el-table-column label="查询方式" min-width="10%" prop="listOperationCondition">
<template #default="{ row }">
<el-select v-model="row.listOperationCondition">
<el-option label="=" value="=" />
<el-option label="!=" value="!=" />
<el-option label=">" value=">" />
@ -96,14 +95,14 @@ onMounted(async () => {
</el-select>
</template>
</el-table-column>
<el-table-column label="允许空" min-width="5%">
<template #default="scope">
<el-checkbox true-label="true" false-label="false" v-model="scope.row.nullable" />
<el-table-column label="允许空" min-width="5%" prop="nullable">
<template #default="{ row }">
<el-checkbox true-label="true" false-label="false" v-model="row.nullable" />
</template>
</el-table-column>
<el-table-column label="显示类型" min-width="12%">
<template #default="scope">
<el-select v-model="scope.row.htmlType">
<el-table-column label="显示类型" min-width="12%" prop="htmlType">
<template #default="{ row }">
<el-select v-model="row.htmlType">
<el-option label="文本框" value="input" />
<el-option label="文本域" value="textarea" />
<el-option label="下拉框" value="select" />
@ -116,9 +115,9 @@ onMounted(async () => {
</el-select>
</template>
</el-table-column>
<el-table-column label="字典类型" min-width="12%">
<template #default="scope">
<el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择">
<el-table-column label="字典类型" min-width="12%" prop="dictType">
<template #default="{ row }">
<el-select v-model="row.dictType" clearable filterable placeholder="请选择">
<el-option
v-for="dict in dictOptions"
:key="dict.id"
@ -128,9 +127,9 @@ onMounted(async () => {
</el-select>
</template>
</el-table-column>
<el-table-column label="示例" min-width="10%">
<template #default="scope">
<el-input v-model="scope.row.example" />
<el-table-column label="示例" min-width="10%" prop="example">
<template #default="{ row }">
<el-input v-model="row.example" />
</template>
</el-table-column>
</el-table>

View File

@ -4,9 +4,9 @@ import { required } from '@/utils/formRules'
import { CodegenTableVO } from '@/api/infra/codegen/types'
import { Form } from '@/components/Form'
import { useForm } from '@/hooks/web/useForm'
import { DICT_TYPE, getDictOptions } from '@/utils/dict'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
const props = defineProps({
currentRow: {
genInfo: {
type: Object as PropType<Nullable<CodegenTableVO>>,
default: () => null
}
@ -20,13 +20,15 @@ const rules = reactive({
className: [required],
classComment: [required]
})
const templateTypeOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_TEMPLATE_TYPE)
const sceneOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_SCENE)
const schema = reactive<FormSchema[]>([
{
label: '生成模板',
field: 'templateType',
component: 'Select',
componentProps: {
options: getDictOptions(DICT_TYPE.INFRA_CODEGEN_TEMPLATE_TYPE)
options: templateTypeOptions
},
colProps: {
span: 12
@ -37,7 +39,7 @@ const schema = reactive<FormSchema[]>([
field: 'scene',
component: 'Select',
componentProps: {
options: getDictOptions(DICT_TYPE.INFRA_CODEGEN_SCENE)
options: sceneOptions
},
colProps: {
span: 12
@ -93,11 +95,11 @@ const { register, methods, elFormRef } = useForm({
schema
})
watch(
() => props.currentRow,
(currentRow) => {
if (!currentRow) return
() => props.genInfo,
(genInfo) => {
if (!genInfo) return
const { setValues } = methods
setValues(currentRow)
setValues(genInfo)
},
{
deep: true,

View File

@ -21,8 +21,8 @@ const emit = defineEmits(['ok'])
const visible = ref(false)
const dbLoading = ref(true)
const queryParams = reactive({
tableName: undefined,
tableComment: undefined,
name: undefined,
comment: undefined,
dataSourceConfigId: 0
})
const dataSourceConfigs = ref<DataSourceConfigVO[]>([])
@ -49,8 +49,9 @@ const handleQuery = async () => {
}
//
const resetQuery = async () => {
queryParams.tableName = undefined
queryParams.tableComment = undefined
queryParams.name = undefined
queryParams.comment = undefined
queryParams.dataSourceConfigId = 0
await getList()
}
/** 多选框选中数据 */
@ -90,11 +91,11 @@ defineExpose({
/>
</el-select>
</el-form-item>
<el-form-item label="表名称" prop="tableName">
<el-input v-model="queryParams.tableName" placeholder="请输入表名称" clearable />
<el-form-item label="表名称" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入表名称" clearable />
</el-form-item>
<el-form-item label="表描述" prop="tableComment">
<el-input v-model="queryParams.tableComment" placeholder="请输入表描述" clearable />
<el-form-item label="表描述" prop="comment">
<el-input v-model="queryParams.comment" placeholder="请输入表描述" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery">

View File

@ -1,7 +1,6 @@
import BasicInfoForm from './BasicInfoForm.vue'
import CloumInfoForm from './CloumInfoForm.vue'
import EditTable from './EditTable.vue'
import GenInfoForm from './GenInfoForm.vue'
import ImportTable from './ImportTable.vue'
import Preview from './Preview.vue'
export { BasicInfoForm, CloumInfoForm, EditTable, GenInfoForm, ImportTable, Preview }
export { BasicInfoForm, CloumInfoForm, GenInfoForm, ImportTable, Preview }