mirrors/pig-ui
1
0
Fork 0
mirror of https://gitee.com/log4j/pig-ui.git synced 2024-12-23 13:43:51 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

✨ Introducing new features. 修改代码生成器为多步骤步骤条

Browse Source
This commit is contained in:
aeizzz 2023-02-20 13:55:43 +08:00
parent 4c3df8a7f3
commit c9bef30cb9
7 changed files with 310 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/router/backEnd.ts
View File

@ -124,9 +124,7 @@ export async function setBackEndControlRefreshRoutes() {
*/
export function backEndComponent(routes: any) {
if (!routes) return;
return routes.filter((item: any) => {
return !item.visible
}).map((item: any) => {
return routes.map((item: any) => {
if (item.path && item.path.startsWith('http')) {
if (item.meta.isIframe) {
item.component = () => import('/@/layout/routerView/iframes.vue')

5
src/views/admin/menu/form.vue
View File

@ -106,7 +106,7 @@ const state = reactive({
menuType: '0',
keepAlive: '0',
visible: '0',
embedded: '1',
embedded: '0',
},
parentData: [] as any[], // 上级菜单数据
});
@ -125,7 +125,7 @@ const getMenuData = () => {
menuType: "",
parentId: "",
path: "",
embedded: 1,
embedded: '0',
sortOrder: 0,
updateBy: "",
updateTime: "",
@ -147,6 +147,7 @@ watch(() => state.ruleForm.path, (val) => {
showembedded.value = true
} else {
showembedded.value = false
state.ruleForm.embedded = '0'
}
})

130
src/views/gen/gener/index.vue Normal file
View File

@ -0,0 +1,130 @@
<template>
<div class="layout-padding">
<el-card class="layout-padding-auto" shadow="hover">
<el-steps :active="active" finish-status="success" simple style="margin-top: 20px">
<el-step title="基础信息" />
<el-step title="数据修改" />
<el-step title="生成预览" />
</el-steps>
</el-card>
<el-card class="layout-padding-auto" style="margin-top: 20px" shadow="hover" v-if="active === 0">
<generator ref="generatorRef" :tableName="tableName" :dsName="dsName"></generator>
</el-card>
<el-card class="layout-padding-auto" style="margin-top: 20px" shadow="hover" v-if="active === 1">
<edit-table ref="editTableRef" :tableName="tableName" :dsName="dsName"></edit-table>
</el-card>
<el-card class="layout-padding-auto" style="margin-top: 20px" shadow="hover" v-if="active === 2">
<el-form ref="dataFormRef" label-width="120px" :model="dataForm">
<el-form-item label="生成方式" prop="generatorType">
<el-radio-group v-model="dataForm.generatorType">
<el-radio-button :label="1">自定义路径</el-radio-button>
<el-radio-button :label="0">ZIP 压缩包</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-if="dataForm.generatorType === 1" label="后端生成路径" prop="backendPath">
<el-input v-model="dataForm.backendPath" placeholder="后端生成路径"></el-input>
</el-form-item>
<el-form-item v-if="dataForm.generatorType === 1" label="前端生成路径" prop="frontendPath">
<el-input v-model="dataForm.frontendPath" placeholder="前端生成路径"></el-input>
</el-form-item>
<el-form-item>
<el-space wrap>
<el-button style="margin-top: 12px" @click="previewDialogRef.openDialog(tableId)">预览</el-button>
<el-button style="margin-top: 12px" @click="generatorHandle">生成</el-button>
</el-space>
</el-form-item>
</el-form>
</el-card>
<el-space wrap>
<el-button style="margin-top: 12px" @click="pre" v-if="active > 0">上一步</el-button>
<el-button style="margin-top: 12px" @click="next" v-if="active < 2">下一步</el-button>
</el-space>
<preview-dialog ref="previewDialogRef"></preview-dialog>
</div>
</template>
<script lang="ts" setup>
import {useGeneratorCodeApi} from "/@/api/gen/table";
const Generator = defineAsyncComponent(() => import('../table/generator.vue'))
const EditTable = defineAsyncComponent(() => import('../table/edit.vue'))
const PreviewDialog = defineAsyncComponent(() => import('../table/preview.vue'));
const previewDialogRef = ref()
const generatorRef = ref()
import { useRoute } from "vue-router";
import {downBlobFile} from "/@/utils/other";
import {useMessage} from "/@/hooks/message";
import {useI18n} from "vue-i18n";
const route = useRoute()
const { t } = useI18n()
const active = ref(0)
const tableId = ref()
const dataForm = reactive({
generatorType: 0,
frontendPath: ''
})
const next = async () => {
if(active.value === 0){
try {
await generatorRef.value.submitHandle()
}catch (e) {
return
}
}
if(active.value === 1){
try {
const table = await editTableRef.value.submitHandle()
tableId.value = table
}catch (e) {
return
}
}
if (active.value++ >= 2){
active.value = 2
return
}
}
const pre = () => {
if (active.value-- <=0){
active.value = 0
return
}
}
const tableName = ref()
const dsName = ref()
const editTableRef = ref()
// 生成
const generatorHandle = () => {
// 生成代码，zip压缩包
if (dataForm.generatorType === 0) {
downBlobFile('/gen/generator/download?tableIds=' + [tableId.value].join(','), {}, `${tableName.value}.zip`)
}
// 写入到指定目录
if (dataForm.generatorType === 1) {
useGeneratorCodeApi([tableId.value].join(',')).then(() => {
useMessage().success(t('common.optSuccessText'))
})
}
}
onMounted(() => {
tableName.value = route.query.tableName
dsName.value = route.query.dsName
})
</script>

72
src/views/gen/table/edit.vue
View File

@ -1,5 +1,5 @@
<template>
<el-drawer v-model="visible" title="编辑" :size="1200" :with-header="false" :close-on-click-modal="false">
<!-- <el-drawer v-model="visible" title="编辑" :size="1200" :with-header="false" :close-on-click-modal="false">-->
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="属性设置" name="field">
<vxe-table ref="fieldTable" align="center" border row-key class="sortable-row-gen" :data="fieldList"
@ -116,17 +116,16 @@
<vxe-column field="formValidator" title="表单效验" :edit-render="{ name: 'input' }"></vxe-column>
</vxe-table>
</el-tab-pane>
</el-tabs>
<template #footer>
<el-button @click="visible = false">取消</el-button>
<el-button @click="previewHandle()">{{
$t('gen.prewBtn')
}}</el-button> <el-button type="primary" @click="submitHandle()">确定</el-button>
</template>
<!-- <template #footer>-->
<!-- <el-button @click="visible = false">取消</el-button>-->
<!-- <el-button @click="previewHandle()">{{-->
<!-- $t('gen.prewBtn')-->
<!-- }}</el-button> <el-button type="primary" @click="submitHandle()">确定</el-button>-->
<!-- </template>-->
<!-- 预览 -->
<preview-dialog ref="previewRef" />
</el-drawer>
<!-- <preview-dialog ref="previewRef" />-->
<!-- </el-drawer>-->
</template>
<script setup lang="ts">
@ -138,17 +137,29 @@ import { VxeTableInstance } from 'vxe-table'
import { useMessage } from '/@/hooks/message'
import { useI18n } from 'vue-i18n'
const previewDialog = defineAsyncComponent(() => import('./preview.vue'));
// const previewDialog = defineAsyncComponent(() => import('./preview.vue'));
const { t } = useI18n();
const previewRef = ref()
// const previewRef = ref()
const activeName = ref()
const tableId = ref('')
const fieldTable = ref<VxeTableInstance>()
const formTable = ref<VxeTableInstance>()
const gridTable = ref<VxeTableInstance>()
const props = defineProps({
tableName: {
type: String
},
dsName: {
type: String
}
})
const handleClick = (tab: TabsPaneContext) => {
if (tab.paneName !== 'field') {
formTable.value?.loadData(fieldList.value)
@ -211,6 +222,16 @@ const openDialog = (dName: string, tName: string) => {
getDictList()
}
onMounted(() => {
tableName.value = String(props.tableName)
dsName.value = String(props.dsName)
activeName.value = 'field'
rowDrop()
getTable(dsName.value, tableName.value)
getFieldTypeList()
getDictList()
})
const rowDrop = () => {
nextTick(() => {
const el: any = window.document.querySelector('.body--wrapper>.vxe-table--body tbody')
@ -255,22 +276,27 @@ const getDictList = () => {
// 表单提交
const submitHandle = () => {
return useTableFieldSubmitApi(dsName.value, tableName.value, fieldList.value).then(() => {
useMessage().success(t('common.addSuccessText'))
visible.value = false // 关闭弹窗
emit('refreshDataList')
})
return new Promise((resolve) => {
useTableFieldSubmitApi(dsName.value, tableName.value, fieldList.value).then(() => {
useMessage().success(t('common.addSuccessText'))
resolve(tableId.value)
// visible.value = false // 关闭弹窗
// emit('refreshDataList')
})
})
}
// 预览设计
const previewHandle = () => {
submitHandle().then(() => {
previewRef.value.openDialog(tableId.value)
})
}
// const previewHandle = () => {
// submitHandle().then(() => {
// previewRef.value.openDialog(tableId.value)
// })
// }
defineExpose({
openDialog
openDialog,
submitHandle
})
</script>

182
src/views/gen/table/generator.vue
View File

@ -1,5 +1,4 @@
<template>
<el-dialog v-model="visible" title="生成代码" :close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="dataForm" :rules="dataRules" label-width="120px">
<el-row>
<el-col :span="12" class="mb20">
@ -61,42 +60,33 @@
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="生成方式" prop="generatorType">
<el-radio-group v-model="dataForm.generatorType">
<el-radio-button :label="1">自定义路径</el-radio-button>
<el-radio-button :label="0">ZIP 压缩包</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="i18n文件" prop="i18n" v-if="dataForm.style === 0">
<el-radio-group v-model="dataForm.i18n">
<el-radio-button :label="0">不生成</el-radio-button>
<el-radio-button :label="1">生成</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
<!-- <el-col :span="12" class="mb20">-->
<!-- <el-form-item label="生成方式" prop="generatorType">-->
<!-- <el-radio-group v-model="dataForm.generatorType">-->
<!-- <el-radio-button :label="1">自定义路径</el-radio-button>-->
<!-- <el-radio-button :label="0">ZIP 压缩包</el-radio-button>-->
<!-- </el-radio-group>-->
<!-- </el-form-item>-->
<!-- </el-col>-->
</el-row>
<el-row>
<el-col :span="12" class="mb20">
<el-form-item label="i18n文件" prop="i18n" v-if="dataForm.style === 0">
<el-radio-group v-model="dataForm.i18n">
<el-radio-button :label="0">不生成</el-radio-button>
<el-radio-button :label="1">生成</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-form-item v-if="dataForm.generatorType === 1" label="后端生成路径" prop="backendPath">
<el-input v-model="dataForm.backendPath" placeholder="后端生成路径"></el-input>
</el-form-item>
<el-form-item v-if="dataForm.generatorType === 1" label="前端生成路径" prop="frontendPath">
<el-input v-model="dataForm.frontendPath" placeholder="前端生成路径"></el-input>
</el-form-item>
<!-- <el-row>-->
<!-- </el-row>-->
<!-- <el-form-item v-if="dataForm.generatorType === 1" label="后端生成路径" prop="backendPath">-->
<!-- <el-input v-model="dataForm.backendPath" placeholder="后端生成路径"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item v-if="dataForm.generatorType === 1" label="前端生成路径" prop="frontendPath">-->
<!-- <el-input v-model="dataForm.frontendPath" placeholder="前端生成路径"></el-input>-->
<!-- </el-form-item>-->
</el-form>
<template #footer>
<el-button @click="previewHandle()">{{
$t('gen.prewBtn')
}}</el-button>
<el-button type="primary" @click="submitHandle()">保存</el-button>
<el-button type="danger" @click="generatorHandle()">生成代码</el-button>
</template>
</el-dialog>
<!-- 预览 -->
<preview-dialog ref="previewRef" />
</template>
<script setup lang="ts">
@ -105,7 +95,16 @@ import { putObj, useTableApi, useGeneratorCodeApi } from '/@/api/gen/table'
import { useMessage } from '/@/hooks/message';
import { downBlobFile } from '/@/utils/other';
const previewDialog = defineAsyncComponent(() => import('./preview.vue'));
// const previewDialog = defineAsyncComponent(() => import('./preview.vue'));
const props = defineProps({
tableName: {
type: String
},
dsName: {
type: String
}
})
const emit = defineEmits(['refreshDataList'])
@ -128,8 +127,8 @@ const dataForm = reactive({
functionName: '',
className: '',
tableComment: '',
tableName: '',
dsName: '',
tableName: '' as string,
dsName: '' as string,
i18n: 1, // 默认生成 I18N 国际化文件
style: 0, // 默认风格 element-plus
})
@ -169,61 +168,80 @@ const dataRules = ref({
})
// 预览
const previewHandle = () => {
dataFormRef.value.validate(async (valid: boolean) => {
if (!valid) {
return false
}
// 先保存
await putObj(dataForm)
// 打开预览窗口
previewRef.value.openDialog(dataForm.id)
})
}
// const previewHandle = () => {
// dataFormRef.value.validate(async (valid: boolean) => {
// if (!valid) {
// return false
// }
// // 先保存
// await putObj(dataForm)
// // 打开预览窗口
// previewRef.value.openDialog(dataForm.id)
// })
// }
// 保存
const submitHandle = () => {
dataFormRef.value.validate((valid: boolean) => {
if (!valid) {
return false
}
return new Promise((resolve, reject) => {
dataFormRef.value.validate((valid: boolean) => {
if (!valid) {
reject()
return false
}
putObj(dataForm).then(() => {
visible.value = false
emit('refreshDataList')
useMessage().success(t('common.optSuccessText'))
resolve("")
})
})
})
putObj(dataForm).then(() => {
visible.value = false
emit('refreshDataList')
useMessage().success(t('common.optSuccessText'))
})
})
}
// 生成
const generatorHandle = () => {
dataFormRef.value.validate(async (valid: boolean) => {
if (!valid) {
return false
}
// const generatorHandle = () => {
// dataFormRef.value.validate(async (valid: boolean) => {
// if (!valid) {
// return false
// }
//
// // 先保存
// await putObj(dataForm)
//
// // 生成代码，zip压缩包
// if (dataForm.generatorType === 0) {
// downBlobFile('/gen/generator/download?tableIds=' + [dataForm.id].join(','), {}, `${dataForm.tableName}.zip`)
// visible.value = false
// }
//
// // 写入到指定目录
// if (dataForm.generatorType === 1) {
// useGeneratorCodeApi([dataForm.id].join(',')).then(() => {
// useMessage().success(t('common.optSuccessText'))
// visible.value = false
// })
// }
// })
// }
// 先保存
await putObj(dataForm)
onMounted(() => {
// 重置表单数据
if (dataFormRef.value) {
dataFormRef.value.resetFields()
}
dataForm.id = ''
dataForm.tableName = String(props.tableName)
dataForm.dsName = String(props.dsName)
// 生成代码，zip压缩包
if (dataForm.generatorType === 0) {
downBlobFile('/gen/generator/download?tableIds=' + [dataForm.id].join(','), {}, `${dataForm.tableName}.zip`)
visible.value = false
}
// 写入到指定目录
if (dataForm.generatorType === 1) {
useGeneratorCodeApi([dataForm.id].join(',')).then(() => {
useMessage().success(t('common.optSuccessText'))
visible.value = false
})
}
})
}
getTable(dataForm.dsName, dataForm.tableName)
})
defineExpose({
openDialog
openDialog,
submitHandle
})
</script>

41
src/views/gen/table/index.vue
View File

@ -46,15 +46,19 @@
<el-button text type="primary" @click="syncTable(state.queryForm.dsName, scope.row.tableName)">{{
$t('gen.syncBtn')
}}</el-button>
<!-- <el-button text type="primary"-->
<!-- @click="formDialogRef.openDialog(state.queryForm.dsName, scope.row.tableName)">{{-->
<!-- $t('gen.designBtn')-->
<!-- }}</el-button>-->
<el-button text type="primary"
@click="formDialogRef.openDialog(state.queryForm.dsName, scope.row.tableName)">{{
$t('gen.designBtn')
}}</el-button>
@click="openGen(scope.row)">{{
$t('gen.genBtn')
}}</el-button>
<el-button text type="primary"
@click="generatorRef.openDialog(state.queryForm.dsName, scope.row.tableName)">{{
$t('gen.genBtn')
}}</el-button>
<!-- <el-button text type="primary"-->
<!-- @click="generatorRef.openDialog(state.queryForm.dsName, scope.row.tableName)">{{-->
<!-- $t('gen.genBtn')-->
<!-- }}</el-button>-->
<el-button text type="primary" @click="handleDelete(scope.row)">{{
$t('common.delBtn')
@ -65,12 +69,6 @@
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
</el-card>
<!-- 编辑 -->
<edit-dialog ref="formDialogRef" @refresh="getDataList()" />
<!-- 生成-->
<generator-dialog ref="generatorRef" @refreshDataList="getDataList" />
</div>
</template>
@ -80,15 +78,16 @@ import { fetchList, delObj, useSyncTableApi } from "/@/api/gen/table";
import { list } from '/@/api/gen/datasource'
import { useMessage, useMessageBox } from "/@/hooks/message";
import { useI18n } from "vue-i18n";
import { useRouter } from 'vue-router';
// 定义变量内容
const router = useRouter();
// 引入组件
const EditDialog = defineAsyncComponent(() => import('./edit.vue'));
const GeneratorDialog = defineAsyncComponent(() => import('./generator.vue'));
const { t } = useI18n()
// 定义变量内容
const formDialogRef = ref()
const generatorRef = ref()
// 搜索变量
const queryRef = ref()
@ -125,6 +124,16 @@ onMounted(() => {
})
})
const openGen = (row) => {
router.push({
path: '/gen/gener/index',
query: {
tableName: row.tableName,
dsName: state.queryForm.dsName
}
})
}
// 同步表数据
const syncTable = (dsName: string, tableName: string) => {
useSyncTableApi(dsName, tableName).then(() => {

4
src/views/gen/table/preview.vue
View File

@ -35,7 +35,7 @@ const preview = reactive({
})
const previewCodegen = ref([])
const fileTreeOriginal = ref([])
const fileTreeOriginal = ref([] as any[])
const openDialog = async (id: string) => {
await getGenCodeFile(id)
@ -70,7 +70,7 @@ const handleNodeClick = async (data: any, node: any) => {
*/
const handleFiles = (fileTreeOriginal: any) => {
const exists = {}
const files = []
const files = [] as any[]
// 遍历每个元素
for (const data of fileTreeOriginal.value) {