refactor: codegen
parent
b1a2dfb09b
commit
7ff6db9ac7
|
@ -1,13 +1,34 @@
|
||||||
|
<template>
|
||||||
|
<ContentDetailWrap title="代码生成" @back="push('/infra/codegen')">
|
||||||
|
<el-tabs v-model="activeName">
|
||||||
|
<el-tab-pane label="基本信息" name="basicInfo">
|
||||||
|
<BasicInfoForm ref="basicInfoRef" :basicInfo="tableCurrentRow" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="字段信息" name="cloum">
|
||||||
|
<CloumInfoForm ref="cloumInfoRef" :info="cloumCurrentRow" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="生成信息" name="genInfo">
|
||||||
|
<GenInfoForm ref="genInfoRef" :genInfo="tableCurrentRow" />
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
<template #right>
|
||||||
|
<XButton type="primary" :title="t('action.save')" :loading="loading" @click="submitForm()" />
|
||||||
|
</template>
|
||||||
|
</ContentDetailWrap>
|
||||||
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, unref, onMounted } from 'vue'
|
import { ref, unref, onMounted } from 'vue'
|
||||||
|
import { useRouter, useRoute } from 'vue-router'
|
||||||
|
import { ElTabs, ElTabPane } from 'element-plus'
|
||||||
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
|
import { useMessage } from '@/hooks/web/useMessage'
|
||||||
import { ContentDetailWrap } from '@/components/ContentDetailWrap'
|
import { ContentDetailWrap } from '@/components/ContentDetailWrap'
|
||||||
import { BasicInfoForm, CloumInfoForm, GenInfoForm } from './components'
|
import { BasicInfoForm, CloumInfoForm, GenInfoForm } from './components'
|
||||||
import { ElTabs, ElTabPane, ElMessage } from 'element-plus'
|
|
||||||
import { getCodegenTableApi, updateCodegenTableApi } from '@/api/infra/codegen'
|
import { getCodegenTableApi, updateCodegenTableApi } from '@/api/infra/codegen'
|
||||||
import { useRouter, useRoute } from 'vue-router'
|
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
|
||||||
import { CodegenTableVO, CodegenColumnVO, CodegenUpdateReqVO } from '@/api/infra/codegen/types'
|
import { CodegenTableVO, CodegenColumnVO, CodegenUpdateReqVO } from '@/api/infra/codegen/types'
|
||||||
const { t } = useI18n()
|
|
||||||
|
const { t } = useI18n() // 国际化
|
||||||
|
const message = useMessage() // 消息弹窗
|
||||||
const { push } = useRouter()
|
const { push } = useRouter()
|
||||||
const { query } = useRoute()
|
const { query } = useRoute()
|
||||||
const tableCurrentRow = ref<CodegenTableVO>()
|
const tableCurrentRow = ref<CodegenTableVO>()
|
||||||
|
@ -26,10 +47,6 @@ const activeName = ref('cloum')
|
||||||
const basicInfoRef = ref<ComponentRef<typeof BasicInfoForm>>()
|
const basicInfoRef = ref<ComponentRef<typeof BasicInfoForm>>()
|
||||||
const genInfoRef = ref<ComponentRef<typeof GenInfoForm>>()
|
const genInfoRef = ref<ComponentRef<typeof GenInfoForm>>()
|
||||||
const cloumInfoRef = ref(null)
|
const cloumInfoRef = ref(null)
|
||||||
const parentMenuId = ref<number>()
|
|
||||||
const menu = (id: number) => {
|
|
||||||
parentMenuId.value = id
|
|
||||||
}
|
|
||||||
const submitForm = async () => {
|
const submitForm = async () => {
|
||||||
const basicInfo = unref(basicInfoRef)
|
const basicInfo = unref(basicInfoRef)
|
||||||
const genInfo = unref(genInfoRef)
|
const genInfo = unref(genInfoRef)
|
||||||
|
@ -38,17 +55,12 @@ const submitForm = async () => {
|
||||||
if (basicForm && genForm) {
|
if (basicForm && genForm) {
|
||||||
const basicInfoData = (await basicInfo?.getFormData()) as CodegenTableVO
|
const basicInfoData = (await basicInfo?.getFormData()) as CodegenTableVO
|
||||||
const genInfoData = (await genInfo?.getFormData()) as CodegenTableVO
|
const genInfoData = (await genInfo?.getFormData()) as CodegenTableVO
|
||||||
if (parentMenuId.value) {
|
|
||||||
genInfoData.parentMenuId = parentMenuId.value
|
|
||||||
} else {
|
|
||||||
genInfoData.parentMenuId = 0
|
|
||||||
}
|
|
||||||
const genTable: CodegenUpdateReqVO = {
|
const genTable: CodegenUpdateReqVO = {
|
||||||
table: Object.assign({}, basicInfoData, genInfoData),
|
table: Object.assign({}, basicInfoData, genInfoData),
|
||||||
columns: cloumCurrentRow.value
|
columns: cloumCurrentRow.value
|
||||||
}
|
}
|
||||||
await updateCodegenTableApi(genTable)
|
await updateCodegenTableApi(genTable)
|
||||||
ElMessage.success(t('common.updateSuccess'))
|
message.success(t('common.updateSuccess'))
|
||||||
push('/infra/codegen')
|
push('/infra/codegen')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -56,21 +68,3 @@ onMounted(() => {
|
||||||
getList()
|
getList()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
|
||||||
<ContentDetailWrap title="代码生成" @back="push('/infra/codegen')">
|
|
||||||
<el-tabs v-model="activeName">
|
|
||||||
<el-tab-pane label="基本信息" name="basicInfo">
|
|
||||||
<BasicInfoForm ref="basicInfoRef" :basicInfo="tableCurrentRow" />
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane label="字段信息" name="cloum">
|
|
||||||
<CloumInfoForm ref="cloumInfoRef" :info="cloumCurrentRow" />
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane label="生成信息" name="genInfo">
|
|
||||||
<GenInfoForm ref="genInfoRef" :genInfo="tableCurrentRow" @menu="menu" />
|
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
<template #right>
|
|
||||||
<XButton type="primary" :title="t('action.save')" :loading="loading" @click="submitForm()" />
|
|
||||||
</template>
|
|
||||||
</ContentDetailWrap>
|
|
||||||
</template>
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { reactive } from 'vue'
|
import { reactive } from 'vue'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
import { required } from '@/utils/formRules'
|
import { required } from '@/utils/formRules'
|
||||||
import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
|
import { VxeCrudSchema, useVxeCrudSchemas } from '@/hooks/web/useVxeCrudSchemas'
|
||||||
const { t } = useI18n() // 国际化
|
const { t } = useI18n() // 国际化
|
||||||
|
|
||||||
// 表单校验
|
// 表单校验
|
||||||
|
@ -12,54 +12,45 @@ export const rules = reactive({
|
||||||
})
|
})
|
||||||
|
|
||||||
// CrudSchema
|
// CrudSchema
|
||||||
const crudSchemas = reactive<CrudSchema[]>([
|
const crudSchemas = reactive<VxeCrudSchema>({
|
||||||
{
|
primaryKey: 'id',
|
||||||
label: t('common.index'),
|
primaryType: 'seq',
|
||||||
field: 'id',
|
action: true,
|
||||||
type: 'index',
|
actionWidth: '400px',
|
||||||
isForm: false,
|
columns: [
|
||||||
isDetail: false
|
{
|
||||||
},
|
title: '表名称',
|
||||||
{
|
field: 'tableName',
|
||||||
label: '表名称',
|
isSearch: true
|
||||||
field: 'tableName',
|
},
|
||||||
isSearch: true
|
{
|
||||||
},
|
title: '表描述',
|
||||||
{
|
field: 'tableComment',
|
||||||
label: '表描述',
|
isSearch: true
|
||||||
field: 'tableComment',
|
},
|
||||||
isSearch: true
|
{
|
||||||
},
|
title: '实体',
|
||||||
{
|
field: 'className',
|
||||||
label: '实体',
|
isSearch: true
|
||||||
field: 'className',
|
},
|
||||||
isSearch: true
|
{
|
||||||
},
|
title: t('common.createTime'),
|
||||||
{
|
field: 'createTime',
|
||||||
label: t('common.createTime'),
|
formatter: 'formatDate',
|
||||||
field: 'createTime',
|
isForm: false,
|
||||||
isForm: false,
|
search: {
|
||||||
search: {
|
show: true,
|
||||||
show: true,
|
itemRender: {
|
||||||
component: 'DatePicker',
|
name: 'XDataTimePicker'
|
||||||
componentProps: {
|
}
|
||||||
type: 'datetimerange',
|
|
||||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
||||||
defaultTime: [new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)]
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t('common.updateTime'),
|
||||||
|
field: 'updateTime',
|
||||||
|
formatter: 'formatDate',
|
||||||
|
isForm: false
|
||||||
}
|
}
|
||||||
},
|
]
|
||||||
{
|
})
|
||||||
label: t('common.updateTime'),
|
export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
|
||||||
field: 'updateTime',
|
|
||||||
isForm: false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: t('table.action'),
|
|
||||||
field: 'action',
|
|
||||||
width: '350px',
|
|
||||||
isForm: false,
|
|
||||||
isDetail: false
|
|
||||||
}
|
|
||||||
])
|
|
||||||
export const { allSchemas } = useCrudSchemas(crudSchemas)
|
|
||||||
|
|
|
@ -1,11 +1,13 @@
|
||||||
|
<template>
|
||||||
|
<Form :rules="rules" @register="register" />
|
||||||
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { PropType, reactive, watch } from 'vue'
|
import { PropType, reactive, watch } from 'vue'
|
||||||
import { required } from '@/utils/formRules'
|
import { required } from '@/utils/formRules'
|
||||||
import { CodegenTableVO } from '@/api/infra/codegen/types'
|
|
||||||
import { Form } from '@/components/Form'
|
|
||||||
import { useForm } from '@/hooks/web/useForm'
|
import { useForm } from '@/hooks/web/useForm'
|
||||||
|
import { Form } from '@/components/Form'
|
||||||
import { FormSchema } from '@/types/form'
|
import { FormSchema } from '@/types/form'
|
||||||
|
import { CodegenTableVO } from '@/api/infra/codegen/types'
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
basicInfo: {
|
basicInfo: {
|
||||||
type: Object as PropType<Nullable<CodegenTableVO>>,
|
type: Object as PropType<Nullable<CodegenTableVO>>,
|
||||||
|
@ -85,6 +87,3 @@ defineExpose({
|
||||||
getFormData: methods.getFormData
|
getFormData: methods.getFormData
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
|
||||||
<Form :rules="rules" @register="register" />
|
|
||||||
</template>
|
|
||||||
|
|
|
@ -1,28 +1,3 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, PropType, ref } from 'vue'
|
|
||||||
import { ElInput, ElSelect, ElOption } from 'element-plus'
|
|
||||||
import { CodegenColumnVO } from '@/api/infra/codegen/types'
|
|
||||||
import { listSimpleDictTypeApi } from '@/api/system/dict/dict.type'
|
|
||||||
import { DictTypeVO } from '@/api/system/dict/types'
|
|
||||||
const props = defineProps({
|
|
||||||
info: {
|
|
||||||
type: Array as unknown as PropType<CodegenColumnVO[]>,
|
|
||||||
default: () => null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
/** 查询字典下拉列表 */
|
|
||||||
const dictOptions = ref<DictTypeVO[]>()
|
|
||||||
const getDictOptions = async () => {
|
|
||||||
const res = await listSimpleDictTypeApi()
|
|
||||||
dictOptions.value = res
|
|
||||||
}
|
|
||||||
onMounted(async () => {
|
|
||||||
await getDictOptions()
|
|
||||||
})
|
|
||||||
defineExpose({
|
|
||||||
info: props.info
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
<template>
|
<template>
|
||||||
<vxe-table ref="dragTable" :data="info" stripe :column-config="{ resizable: true }">
|
<vxe-table ref="dragTable" :data="info" stripe :column-config="{ resizable: true }">
|
||||||
<vxe-column title="字段列名" field="columnName" fixed="left" width="80" />
|
<vxe-column title="字段列名" field="columnName" fixed="left" width="80" />
|
||||||
|
@ -123,3 +98,29 @@ defineExpose({
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
</template>
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { onMounted, PropType, ref } from 'vue'
|
||||||
|
import { ElInput, ElSelect, ElOption } from 'element-plus'
|
||||||
|
import { DictTypeVO } from '@/api/system/dict/types'
|
||||||
|
import { CodegenColumnVO } from '@/api/infra/codegen/types'
|
||||||
|
import { listSimpleDictTypeApi } from '@/api/system/dict/dict.type'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
info: {
|
||||||
|
type: Array as unknown as PropType<CodegenColumnVO[]>,
|
||||||
|
default: () => null
|
||||||
|
}
|
||||||
|
})
|
||||||
|
/** 查询字典下拉列表 */
|
||||||
|
const dictOptions = ref<DictTypeVO[]>()
|
||||||
|
const getDictOptions = async () => {
|
||||||
|
const res = await listSimpleDictTypeApi()
|
||||||
|
dictOptions.value = res
|
||||||
|
}
|
||||||
|
onMounted(async () => {
|
||||||
|
await getDictOptions()
|
||||||
|
})
|
||||||
|
defineExpose({
|
||||||
|
info: props.info
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
|
@ -1,10 +1,12 @@
|
||||||
|
<template>
|
||||||
|
<Form :rules="rules" @register="register" />
|
||||||
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, PropType, reactive, ref, watch } from 'vue'
|
import { onMounted, PropType, reactive, ref, watch } from 'vue'
|
||||||
import { required } from '@/utils/formRules'
|
|
||||||
import { Form } from '@/components/Form'
|
import { Form } from '@/components/Form'
|
||||||
import { handleTree } from '@/utils/tree'
|
|
||||||
import { ElTreeSelect } from 'element-plus'
|
|
||||||
import { useForm } from '@/hooks/web/useForm'
|
import { useForm } from '@/hooks/web/useForm'
|
||||||
|
import { required } from '@/utils/formRules'
|
||||||
|
import { handleTree } from '@/utils/tree'
|
||||||
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
||||||
import { listSimpleMenusApi } from '@/api/system/menu'
|
import { listSimpleMenusApi } from '@/api/system/menu'
|
||||||
import { CodegenTableVO } from '@/api/infra/codegen/types'
|
import { CodegenTableVO } from '@/api/infra/codegen/types'
|
||||||
|
@ -32,7 +34,6 @@ const rules = reactive({
|
||||||
})
|
})
|
||||||
const templateTypeOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_TEMPLATE_TYPE)
|
const templateTypeOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_TEMPLATE_TYPE)
|
||||||
const sceneOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_SCENE)
|
const sceneOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_SCENE)
|
||||||
const treeRef = ref<InstanceType<typeof ElTreeSelect>>()
|
|
||||||
const menuOptions = ref<any>([]) // 树形结构
|
const menuOptions = ref<any>([]) // 树形结构
|
||||||
const getTree = async () => {
|
const getTree = async () => {
|
||||||
const res = await listSimpleMenusApi()
|
const res = await listSimpleMenusApi()
|
||||||
|
@ -100,8 +101,12 @@ const schema = reactive<FormSchema[]>([
|
||||||
{
|
{
|
||||||
label: '上级菜单',
|
label: '上级菜单',
|
||||||
field: 'parentMenuId',
|
field: 'parentMenuId',
|
||||||
|
component: 'TreeSelect',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
optionsSlot: true
|
data: menuOptions,
|
||||||
|
props: menuProps,
|
||||||
|
checkStrictly: true,
|
||||||
|
nodeKey: 'id'
|
||||||
},
|
},
|
||||||
labelMessage: '分配到指定菜单下,例如 系统管理',
|
labelMessage: '分配到指定菜单下,例如 系统管理',
|
||||||
colProps: {
|
colProps: {
|
||||||
|
@ -112,12 +117,6 @@ const schema = reactive<FormSchema[]>([
|
||||||
const { register, methods, elFormRef } = useForm({
|
const { register, methods, elFormRef } = useForm({
|
||||||
schema
|
schema
|
||||||
})
|
})
|
||||||
const parentMenuId = ref<number>()
|
|
||||||
//子组件像父组件传值
|
|
||||||
const emit = defineEmits(['menu'])
|
|
||||||
const handleNodeClick = () => {
|
|
||||||
emit('menu', parentMenuId.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
// ========== 初始化 ==========
|
// ========== 初始化 ==========
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
@ -140,18 +139,3 @@ defineExpose({
|
||||||
getFormData: methods.getFormData
|
getFormData: methods.getFormData
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
|
||||||
<Form :rules="rules" @register="register">
|
|
||||||
<template #parentMenuId>
|
|
||||||
<el-tree-select
|
|
||||||
v-model="parentMenuId"
|
|
||||||
ref="treeRef"
|
|
||||||
node-key="id"
|
|
||||||
:props="menuProps"
|
|
||||||
:data="menuOptions"
|
|
||||||
check-strictly
|
|
||||||
@change="handleNodeClick"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</Form>
|
|
||||||
</template>
|
|
||||||
|
|
|
@ -48,16 +48,16 @@
|
||||||
</template>
|
</template>
|
||||||
</XModal>
|
</XModal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive } from 'vue'
|
import { ref, reactive } from 'vue'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
import { useMessage } from '@/hooks/web/useMessage'
|
import { useMessage } from '@/hooks/web/useMessage'
|
||||||
import { getSchemaTableListApi, createCodegenListApi } from '@/api/infra/codegen'
|
|
||||||
import { ElForm, ElFormItem, ElInput, ElSelect, ElOption } from 'element-plus'
|
|
||||||
import { getDataSourceConfigListApi, DataSourceConfigVO } from '@/api/infra/dataSourceConfig'
|
|
||||||
import type { DatabaseTableVO } from '@/api/infra/codegen/types'
|
|
||||||
import { VxeTableInstance } from 'vxe-table'
|
import { VxeTableInstance } from 'vxe-table'
|
||||||
|
import { ElForm, ElFormItem, ElInput, ElSelect, ElOption } from 'element-plus'
|
||||||
|
import type { DatabaseTableVO } from '@/api/infra/codegen/types'
|
||||||
|
import { getSchemaTableListApi, createCodegenListApi } from '@/api/infra/codegen'
|
||||||
|
import { getDataSourceConfigListApi, DataSourceConfigVO } from '@/api/infra/dataSourceConfig'
|
||||||
|
|
||||||
const { t } = useI18n() // 国际化
|
const { t } = useI18n() // 国际化
|
||||||
const message = useMessage() // 消息弹窗
|
const message = useMessage() // 消息弹窗
|
||||||
const emit = defineEmits(['ok'])
|
const emit = defineEmits(['ok'])
|
||||||
|
|
|
@ -1,12 +1,47 @@
|
||||||
|
<template>
|
||||||
|
<XModal title="预览" v-model="preview.open">
|
||||||
|
<div class="flex">
|
||||||
|
<el-card class="w-1/4" :gutter="12" shadow="hover">
|
||||||
|
<el-scrollbar height="calc(100vh - 88px - 40px - 50px)">
|
||||||
|
<el-tree
|
||||||
|
ref="treeRef"
|
||||||
|
node-key="id"
|
||||||
|
:data="preview.fileTree"
|
||||||
|
:expand-on-click-node="false"
|
||||||
|
default-expanded-keys="[0]"
|
||||||
|
highlight-current
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
/>
|
||||||
|
</el-scrollbar>
|
||||||
|
</el-card>
|
||||||
|
<el-card class="w-3/4" style="margin-left: 10px" :gutter="12" shadow="hover">
|
||||||
|
<el-tabs v-model="preview.activeName">
|
||||||
|
<el-tab-pane
|
||||||
|
v-for="item in previewCodegen"
|
||||||
|
:label="item.filePath.substring(item.filePath.lastIndexOf('/') + 1)"
|
||||||
|
:name="item.filePath"
|
||||||
|
:key="item.filePath"
|
||||||
|
>
|
||||||
|
<XTextButton style="float: right" :title="t('common.copy')" @click="copy(item.code)" />
|
||||||
|
<pre>{{ item.code }}</pre>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
</XModal>
|
||||||
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { reactive, ref, unref } from 'vue'
|
import { reactive, ref, unref } from 'vue'
|
||||||
|
import { useClipboard } from '@vueuse/core'
|
||||||
|
import { ElCard, ElTree, ElTabs, ElTabPane } from 'element-plus'
|
||||||
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
|
import { useMessage } from '@/hooks/web/useMessage'
|
||||||
import { handleTree2 } from '@/utils/tree'
|
import { handleTree2 } from '@/utils/tree'
|
||||||
import { ElCard, ElTree, ElTabs, ElTabPane, ElMessage } from 'element-plus'
|
|
||||||
import { previewCodegenApi } from '@/api/infra/codegen'
|
import { previewCodegenApi } from '@/api/infra/codegen'
|
||||||
import { CodegenTableVO, CodegenPreviewVO } from '@/api/infra/codegen/types'
|
import { CodegenTableVO, CodegenPreviewVO } from '@/api/infra/codegen/types'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
|
||||||
import { useClipboard } from '@vueuse/core'
|
const { t } = useI18n() // 国际化
|
||||||
const { t } = useI18n()
|
const message = useMessage() // 消息弹窗
|
||||||
// ======== 显示页面 ========
|
// ======== 显示页面 ========
|
||||||
const preview = reactive({
|
const preview = reactive({
|
||||||
open: false,
|
open: false,
|
||||||
|
@ -101,11 +136,11 @@ const handleFiles = (datas: CodegenPreviewVO[]) => {
|
||||||
const copy = async (text: string) => {
|
const copy = async (text: string) => {
|
||||||
const { copy, copied, isSupported } = useClipboard({ source: text })
|
const { copy, copied, isSupported } = useClipboard({ source: text })
|
||||||
if (!isSupported) {
|
if (!isSupported) {
|
||||||
ElMessage.error(t('common.copyError'))
|
message.error(t('common.copyError'))
|
||||||
} else {
|
} else {
|
||||||
await copy()
|
await copy()
|
||||||
if (unref(copied)) {
|
if (unref(copied)) {
|
||||||
ElMessage.success(t('common.copySuccess'))
|
message.success(t('common.copySuccess'))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -113,38 +148,3 @@ defineExpose({
|
||||||
show
|
show
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
|
||||||
<XModal title="预览" v-model="preview.open">
|
|
||||||
<div class="flex">
|
|
||||||
<el-card class="w-1/4" :gutter="12" shadow="hover">
|
|
||||||
<el-scrollbar height="calc(100vh - 88px - 40px - 50px)">
|
|
||||||
<el-tree
|
|
||||||
ref="treeRef"
|
|
||||||
node-key="id"
|
|
||||||
:data="preview.fileTree"
|
|
||||||
:expand-on-click-node="false"
|
|
||||||
default-expand-all
|
|
||||||
highlight-current
|
|
||||||
@node-click="handleNodeClick"
|
|
||||||
/>
|
|
||||||
</el-scrollbar>
|
|
||||||
</el-card>
|
|
||||||
<el-card class="w-3/4" style="margin-left: 10px" :gutter="12" shadow="hover">
|
|
||||||
<el-tabs v-model="preview.activeName">
|
|
||||||
<el-tab-pane
|
|
||||||
v-for="item in previewCodegen"
|
|
||||||
:label="item.filePath.substring(item.filePath.lastIndexOf('/') + 1)"
|
|
||||||
:name="item.filePath"
|
|
||||||
:key="item.filePath"
|
|
||||||
>
|
|
||||||
<el-button link style="float: right" @click="copy(item.code)">
|
|
||||||
{{ t('common.copy') }}
|
|
||||||
</el-button>
|
|
||||||
<pre>{{ item.code }}</pre>
|
|
||||||
<!-- <pre><code class="language-html" v-html="highlightedCode(item)"></code></pre> -->
|
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
</el-card>
|
|
||||||
</div>
|
|
||||||
</XModal>
|
|
||||||
</template>
|
|
||||||
|
|
|
@ -1,24 +1,77 @@
|
||||||
|
<template>
|
||||||
|
<ContentWrap>
|
||||||
|
<!-- 列表 -->
|
||||||
|
<vxe-grid ref="xGrid" v-bind="gridOptions" class="xtable-scrollbar">
|
||||||
|
<template #toolbar_buttons>
|
||||||
|
<XButton
|
||||||
|
type="primary"
|
||||||
|
preIcon="ep:zoom-in"
|
||||||
|
:title="t('action.import')"
|
||||||
|
v-hasPermi="['infra:codegen:create']"
|
||||||
|
@click="openImportTable()"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #actionbtns_default="{ row }">
|
||||||
|
<XTextButton
|
||||||
|
preIcon="ep:view"
|
||||||
|
:title="t('action.preview')"
|
||||||
|
v-hasPermi="['infra:codegen:query']"
|
||||||
|
@click="handlePreview(row.id)"
|
||||||
|
/>
|
||||||
|
<XTextButton
|
||||||
|
preIcon="ep:edit"
|
||||||
|
:title="t('action.edit')"
|
||||||
|
v-hasPermi="['infra:codegen:update']"
|
||||||
|
@click="handleUpdate(row.id)"
|
||||||
|
/>
|
||||||
|
<XTextButton
|
||||||
|
preIcon="ep:delete"
|
||||||
|
:title="t('action.del')"
|
||||||
|
v-hasPermi="['infra:codegen:delete']"
|
||||||
|
@click="handleDelete(row.id)"
|
||||||
|
/>
|
||||||
|
<XTextButton
|
||||||
|
preIcon="ep:refresh"
|
||||||
|
:title="t('action.sync')"
|
||||||
|
v-hasPermi="['infra:codegen:update']"
|
||||||
|
@click="handleSynchDb(row.id)"
|
||||||
|
/>
|
||||||
|
<XTextButton
|
||||||
|
preIcon="ep:download"
|
||||||
|
:title="t('action.generate')"
|
||||||
|
v-hasPermi="['infra:codegen:download']"
|
||||||
|
@click="handleGenTable(row.id)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</vxe-grid>
|
||||||
|
</ContentWrap>
|
||||||
|
<ImportTable ref="importRef" @ok="handleQuery()" />
|
||||||
|
<Preview ref="previewRef" />
|
||||||
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import dayjs from 'dayjs'
|
import { useRouter } from 'vue-router'
|
||||||
|
import { VxeGridInstance } from 'vxe-table'
|
||||||
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
|
import { useMessage } from '@/hooks/web/useMessage'
|
||||||
|
import { useVxeGrid } from '@/hooks/web/useVxeGrid'
|
||||||
|
import download from '@/utils/download'
|
||||||
import * as CodegenApi from '@/api/infra/codegen'
|
import * as CodegenApi from '@/api/infra/codegen'
|
||||||
import { useTable } from '@/hooks/web/useTable'
|
|
||||||
import { CodegenTableVO } from '@/api/infra/codegen/types'
|
import { CodegenTableVO } from '@/api/infra/codegen/types'
|
||||||
import { allSchemas } from './codegen.data'
|
import { allSchemas } from './codegen.data'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
|
||||||
import { ImportTable, Preview } from './components'
|
import { ImportTable, Preview } from './components'
|
||||||
import download from '@/utils/download'
|
|
||||||
import { useRouter } from 'vue-router'
|
|
||||||
import { useMessage } from '@/hooks/web/useMessage'
|
|
||||||
const message = useMessage()
|
|
||||||
const { t } = useI18n() // 国际化
|
const { t } = useI18n() // 国际化
|
||||||
|
const message = useMessage() // 消息弹窗
|
||||||
const { push } = useRouter()
|
const { push } = useRouter()
|
||||||
// ========== 列表相关 ==========
|
// 列表相关的变量
|
||||||
const { register, tableObject, methods } = useTable<CodegenTableVO>({
|
const xGrid = ref<VxeGridInstance>() // 列表 Grid Ref
|
||||||
|
const { gridOptions, getList, deleteData } = useVxeGrid<CodegenTableVO>({
|
||||||
|
allSchemas: allSchemas,
|
||||||
getListApi: CodegenApi.getCodegenTablePageApi,
|
getListApi: CodegenApi.getCodegenTablePageApi,
|
||||||
delListApi: CodegenApi.deleteCodegenTableApi
|
deleteApi: CodegenApi.deleteCodegenTableApi
|
||||||
})
|
})
|
||||||
const { getList, setSearchParams, delList } = methods
|
|
||||||
// 导入操作
|
// 导入操作
|
||||||
const importRef = ref()
|
const importRef = ref()
|
||||||
const openImportTable = () => {
|
const openImportTable = () => {
|
||||||
|
@ -30,8 +83,8 @@ const handlePreview = (row: CodegenTableVO) => {
|
||||||
previewRef.value.show(row)
|
previewRef.value.show(row)
|
||||||
}
|
}
|
||||||
// 编辑操作
|
// 编辑操作
|
||||||
const handleEditTable = (row: CodegenTableVO) => {
|
const handleUpdate = (rowId: number) => {
|
||||||
push('/codegen/edit?id=' + row.id)
|
push('/codegen/edit?id=' + rowId)
|
||||||
}
|
}
|
||||||
// 同步操作
|
// 同步操作
|
||||||
const handleSynchDb = (row: CodegenTableVO) => {
|
const handleSynchDb = (row: CodegenTableVO) => {
|
||||||
|
@ -49,88 +102,12 @@ const handleGenTable = async (row: CodegenTableVO) => {
|
||||||
const res = await CodegenApi.downloadCodegenApi(row.id)
|
const res = await CodegenApi.downloadCodegenApi(row.id)
|
||||||
download.zip(res, 'codegen-' + row.className + '.zip')
|
download.zip(res, 'codegen-' + row.className + '.zip')
|
||||||
}
|
}
|
||||||
// 查询操作
|
// 删除操作
|
||||||
const handleQuery = () => {
|
const handleDelete = async (rowId: number) => {
|
||||||
getList()
|
await deleteData(xGrid, rowId)
|
||||||
|
}
|
||||||
|
// 查询操作
|
||||||
|
const handleQuery = async () => {
|
||||||
|
await getList(xGrid)
|
||||||
}
|
}
|
||||||
// ========== 初始化 ==========
|
|
||||||
getList()
|
|
||||||
</script>
|
</script>
|
||||||
<template>
|
|
||||||
<!-- 搜索工作区 -->
|
|
||||||
<ContentWrap>
|
|
||||||
<Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
|
|
||||||
</ContentWrap>
|
|
||||||
<ContentWrap>
|
|
||||||
<!-- 操作工具栏 -->
|
|
||||||
<div class="mb-10px">
|
|
||||||
<el-button type="primary" v-hasPermi="['infra:codegen:create']" @click="openImportTable">
|
|
||||||
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.import') }}
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
<!-- 列表 -->
|
|
||||||
<Table
|
|
||||||
:columns="allSchemas.tableColumns"
|
|
||||||
:selection="false"
|
|
||||||
:data="tableObject.tableList"
|
|
||||||
:loading="tableObject.loading"
|
|
||||||
:pagination="{
|
|
||||||
total: tableObject.total
|
|
||||||
}"
|
|
||||||
v-model:pageSize="tableObject.pageSize"
|
|
||||||
v-model:currentPage="tableObject.currentPage"
|
|
||||||
@register="register"
|
|
||||||
>
|
|
||||||
<template #createTime="{ row }">
|
|
||||||
<span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
|
|
||||||
</template>
|
|
||||||
<template #updateTime="{ row }">
|
|
||||||
<span>{{ dayjs(row.updateTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
|
|
||||||
</template>
|
|
||||||
<template #action="{ row }">
|
|
||||||
<el-button
|
|
||||||
link
|
|
||||||
type="primary"
|
|
||||||
v-hasPermi="['infra:codegen:preview']"
|
|
||||||
@click="handlePreview(row)"
|
|
||||||
>
|
|
||||||
<Icon icon="ep:view" class="mr-1px" /> {{ t('action.preview') }}
|
|
||||||
</el-button>
|
|
||||||
<el-button
|
|
||||||
link
|
|
||||||
type="primary"
|
|
||||||
v-hasPermi="['infra:codegen:update']"
|
|
||||||
@click="handleEditTable(row)"
|
|
||||||
>
|
|
||||||
<Icon icon="ep:edit" class="mr-1px" /> {{ t('action.edit') }}
|
|
||||||
</el-button>
|
|
||||||
<el-button
|
|
||||||
link
|
|
||||||
type="primary"
|
|
||||||
v-hasPermi="['infra:codegen:delete']"
|
|
||||||
@click="delList(row.id, false)"
|
|
||||||
>
|
|
||||||
<Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
|
|
||||||
</el-button>
|
|
||||||
<el-button
|
|
||||||
link
|
|
||||||
type="primary"
|
|
||||||
v-hasPermi="['infra:codegen:update']"
|
|
||||||
@click="handleSynchDb(row)"
|
|
||||||
>
|
|
||||||
<Icon icon="ep:refresh" class="mr-1px" /> {{ t('action.sync') }}
|
|
||||||
</el-button>
|
|
||||||
<el-button
|
|
||||||
link
|
|
||||||
type="primary"
|
|
||||||
v-hasPermi="['infra:codegen:download']"
|
|
||||||
@click="handleGenTable(row)"
|
|
||||||
>
|
|
||||||
<Icon icon="ep:download" class="mr-1px" /> {{ t('action.generate') }}
|
|
||||||
</el-button>
|
|
||||||
</template>
|
|
||||||
</Table>
|
|
||||||
</ContentWrap>
|
|
||||||
<ImportTable ref="importRef" @ok="handleQuery" />
|
|
||||||
<Preview ref="previewRef" />
|
|
||||||
</template>
|
|
||||||
|
|
Loading…
Reference in New Issue