mirror of
https://gitee.com/log4j/pig-ui.git
synced 2024-12-31 09:12:10 +08:00
feat(代码生成): 支持anyline 动态获取表元数据
- 1. 支持代码生成模板 从 github获取 - 2. 重构代码生成的默认值从配置类获取
This commit is contained in:
冷冷
parent
a90f2be1e3
commit
fecc5d8bcb
@ -15,6 +15,21 @@ export function list() {
|
||||
});
|
||||
}
|
||||
|
||||
export function online() {
|
||||
return request({
|
||||
url: '/gen/template/online',
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
export function checkVersion() {
|
||||
return request({
|
||||
url: '/gen/template/checkVersion',
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
export function addObj(obj?: Object) {
|
||||
return request({
|
||||
url: '/gen/template',
|
||||
|
||||
@ -21,6 +21,13 @@ export const validateNull = (val: any) => {
|
||||
};
|
||||
|
||||
export const rule = {
|
||||
overLength(rule: any, value: any, callback: any) {
|
||||
if (value?.length > 255) {
|
||||
callback(new Error('输入内容过长，请重新输入'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 校验 请输入中文、英文、数字包括下划线
|
||||
* 名称校验
|
||||
|
||||
@ -26,6 +26,7 @@ export default {
|
||||
},
|
||||
dictItem: {
|
||||
index: '#',
|
||||
name: 'dict item',
|
||||
importsysDictItemTip: 'import SysDictItem',
|
||||
id: 'id',
|
||||
dictId: 'dictId',
|
||||
|
||||
@ -29,6 +29,7 @@ export default {
|
||||
},
|
||||
dictItem: {
|
||||
index: '#',
|
||||
name: '字典项',
|
||||
importsysDictItemTip: '导入字典项',
|
||||
id: '编号',
|
||||
dictId: ' dictId',
|
||||
|
||||
@ -1,59 +1,62 @@
|
||||
<template>
|
||||
<el-dialog :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible" :close-on-click-modal="false" draggable>
|
||||
<el-dialog :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('datasourceconf.dsType')" prop="dsType">
|
||||
<el-select v-model="form.dsType" :placeholder="t('datasourceconf.inputdsTypeTip')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in ds_type"> </el-option>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in ds_type"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('datasourceconf.name')" prop="name">
|
||||
<el-input v-model="form.name" :placeholder="t('datasourceconf.inputnameTip')" />
|
||||
<el-input v-model="form.name" :placeholder="t('datasourceconf.inputnameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('datasourceconf.username')" prop="username">
|
||||
<el-input v-model="form.username" :placeholder="t('datasourceconf.inputusernameTip')" />
|
||||
<el-input v-model="form.username" :placeholder="t('datasourceconf.inputusernameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('datasourceconf.password')" prop="password">
|
||||
<el-input v-model="form.password" :placeholder="t('datasourceconf.inputpasswordTip')" />
|
||||
<el-input v-model="form.password" :placeholder="t('datasourceconf.inputpasswordTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('datasourceconf.confType')" prop="confType">
|
||||
<el-radio-group v-model="form.confType">
|
||||
<el-radio :label="Number(item.value)" v-for="(item, index) in ds_config_type" border :key="index">{{ item.label }} </el-radio>
|
||||
<el-radio :label="Number(item.value)" v-for="(item, index) in ds_config_type" border :key="index">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.confType === 0 && form.dsType === 'mssql'">
|
||||
<el-form-item :label="t('datasourceconf.instance')" prop="instance">
|
||||
<el-input v-model="form.instance" :placeholder="t('datasourceconf.inputinstanceTip')" />
|
||||
<el-input v-model="form.instance" :placeholder="t('datasourceconf.inputinstanceTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.confType === 0">
|
||||
<el-form-item :label="t('datasourceconf.port')" prop="port">
|
||||
<el-input-number v-model="form.port" :placeholder="t('datasourceconf.inputportTip')" />
|
||||
<el-input-number v-model="form.port" :placeholder="t('datasourceconf.inputportTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.confType === 0">
|
||||
<el-form-item :label="t('datasourceconf.host')" prop="host">
|
||||
<el-input v-model="form.host" :placeholder="t('datasourceconf.inputhostTip')" />
|
||||
<el-input v-model="form.host" :placeholder="t('datasourceconf.inputhostTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.confType === 0">
|
||||
<el-form-item :label="t('datasourceconf.dsName')" prop="dsName">
|
||||
<el-input v-model="form.dsName" :placeholder="t('datasourceconf.inputdsNameTip')" />
|
||||
<el-input v-model="form.dsName" :placeholder="t('datasourceconf.inputdsNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" class="mb20" v-if="form.confType === 1">
|
||||
<el-form-item :label="t('datasourceconf.url')" prop="url">
|
||||
<el-input v-model="form.url" type="textarea" :placeholder="t('datasourceconf.inputurlTip')" />
|
||||
<el-input v-model="form.url" type="textarea" :placeholder="t('datasourceconf.inputurlTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -68,14 +71,15 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemDatasourceConfDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/gen/datasource';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useDict } from '/@/hooks/dict';
|
||||
import {useMessage} from '/@/hooks/message';
|
||||
import {getObj, addObj, putObj} from '/@/api/gen/datasource';
|
||||
import {useI18n} from 'vue-i18n';
|
||||
import {useDict} from '/@/hooks/dict';
|
||||
import {rule} from "/@/utils/validate";
|
||||
|
||||
// 定义子组件向父组件传值/事件
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
const {t} = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
@ -83,7 +87,7 @@ const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
|
||||
// 定义字典处理
|
||||
const { ds_config_type, ds_type } = useDict('ds_config_type', 'ds_type');
|
||||
const {ds_config_type, ds_type} = useDict('ds_config_type', 'ds_type');
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
@ -94,7 +98,7 @@ const form = reactive({
|
||||
password: ('' as string) || undefined,
|
||||
createTime: '',
|
||||
updateTime: '',
|
||||
dsType: '',
|
||||
dsType: 'mysql',
|
||||
confType: 0,
|
||||
dsName: '',
|
||||
instance: '',
|
||||
@ -120,18 +124,23 @@ const validateDsName = (_rule, value, callback) => {
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
name: [
|
||||
{ required: true, message: '别名不能为空', trigger: 'blur' },
|
||||
{ validator: validateDsName, trigger: 'blur' },
|
||||
{required: true, message: '别名不能为空', trigger: 'blur'},
|
||||
{validator: validateDsName, trigger: 'blur'},
|
||||
],
|
||||
url: [{ required: true, message: 'jdbcurl不能为空', trigger: 'blur' }],
|
||||
username: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
|
||||
password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
|
||||
dsType: [{ required: true, message: '数据库类型不能为空', trigger: 'blur' }],
|
||||
confType: [{ required: true, message: '配置类型不能为空', trigger: 'blur' }],
|
||||
dsName: [{ required: true, message: '数据库名称不能为空', trigger: 'blur' }],
|
||||
instance: [{ required: true, message: '实例不能为空', trigger: 'blur' }],
|
||||
port: [{ required: true, message: '端口不能为空', trigger: 'blur' }],
|
||||
host: [{ required: true, message: '主机不能为空', trigger: 'blur' }],
|
||||
url: [{required: true, message: 'jdbcurl不能为空', trigger: 'blur'}, {
|
||||
min: 10,
|
||||
max: 500,
|
||||
message: 'URL长度必须介于 10 和 500 字符之间',
|
||||
trigger: 'blur'
|
||||
},],
|
||||
username: [{ validator: rule.overLength, trigger: 'blur' },{required: true, message: '用户名不能为空', trigger: 'blur'}],
|
||||
password: [{ validator: rule.overLength, trigger: 'blur' },{required: true, message: '密码不能为空', trigger: 'blur'}],
|
||||
dsType: [{required: true, message: '数据库类型不能为空', trigger: 'blur'}],
|
||||
confType: [{required: true, message: '配置类型不能为空', trigger: 'blur'}],
|
||||
dsName: [{ validator: rule.overLength, trigger: 'blur' },{required: true, message: '数据库名称不能为空', trigger: 'blur'}],
|
||||
instance: [{ validator: rule.overLength, trigger: 'blur' },{required: true, message: '实例不能为空', trigger: 'blur'}],
|
||||
port: [{required: true, message: '端口不能为空', trigger: 'blur'}],
|
||||
host: [{ validator: rule.overLength, trigger: 'blur' },{required: true, message: '主机不能为空', trigger: 'blur'}],
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
@ -155,7 +164,8 @@ const openDialog = async (id: string) => {
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
const valid = await dataFormRef.value.validate().catch(() => {
|
||||
});
|
||||
if (!valid) return false;
|
||||
|
||||
form.password = form.password?.includes('******') ? undefined : form.password;
|
||||
|
||||
@ -4,13 +4,13 @@
|
||||
<el-row class="ml10" v-show="showSearch">
|
||||
<el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList" ref="queryRef">
|
||||
<el-form-item :label="$t('datasourceconf.dsName')" prop="dsName">
|
||||
<el-input :placeholder="$t('datasourceconf.inputdsNameTip')" formDialogRef style="max-width: 180px" v-model="state.queryForm.dsName" />
|
||||
<el-input :placeholder="$t('datasourceconf.inputdsNameTip')" v-model="state.queryForm.dsName" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList" icon="search" type="primary">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button @click="resetQuery" formDialogRef icon="Refresh">{{ $t('common.resetBtn') }} </el-button>
|
||||
<el-button @click="resetQuery" icon="Refresh">{{ $t('common.resetBtn') }} </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
|
||||
71
src/views/gen/design/form.vue
Normal file
71
src/views/gen/design/form.vue
Normal file
@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<el-drawer title="设计历史" v-model="visible" draggable>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" label="序号" width="60" />
|
||||
<el-table-column prop="createTime" label="设计时间" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="150">
|
||||
<template #default="scope">
|
||||
<el-button icon="refresh" text type="primary" @click="handleRollback(scope.row.id)">回滚</el-button>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete(scope.row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemFormHistoryDialog">
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { delFormObj, fetchFormList } from '/@/api/gen/table';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
const emit = defineEmits(['refresh']);
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
// 搜索变量
|
||||
const visible = ref(false);
|
||||
// table hook
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchFormList,
|
||||
createdIsNeed: false,
|
||||
descs: ['create_time'],
|
||||
});
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle } = useTable(state);
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (id: string) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delFormObj(id);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
// 回滚
|
||||
const handleRollback = (id: string) => {
|
||||
emit('refresh', id);
|
||||
};
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = () => {
|
||||
const { tableName, dsName } = route.query;
|
||||
visible.value = true;
|
||||
state.queryForm.dsName = dsName;
|
||||
state.queryForm.tableName = tableName;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
132
src/views/gen/design/index.vue
Normal file
132
src/views/gen/design/index.vue
Normal file
@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<v-form-designer ref="vfDesignerRef" :banned-widgets="bannedWidgets" :designer-config="designerConfig">
|
||||
<template #customToolButtons>
|
||||
<el-button link type="primary" @click="saveJsonConfig">保存</el-button>
|
||||
<el-button link type="primary" @click="exportSfcConfig">导出</el-button>
|
||||
<el-button link type="primary" @click="formDialogRef.openDialog()">历史</el-button>
|
||||
</template>
|
||||
</v-form-designer>
|
||||
</div>
|
||||
<form-dialog ref="formDialogRef" @refresh="handleRefresh" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { fetchFormById, useFormConfSaveApi, useGeneratorVFormApi, useGeneratorVFormSfcApi } from '/@/api/gen/table';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { handleBlobFile } from '/@/utils/other';
|
||||
import mittBus from '/@/utils/mitt';
|
||||
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const vfDesignerRef = ref();
|
||||
const formDialogRef = ref();
|
||||
const bannedWidgets = reactive(['tab', 'card', 'table', 'cascader']);
|
||||
|
||||
const designerConfig = reactive({
|
||||
//是否显示语言切换菜单
|
||||
languageMenu: false,
|
||||
|
||||
//是否显示GitHub、文档等外部链接
|
||||
externalLink: false,
|
||||
|
||||
//是否显示表单模板
|
||||
formTemplates: false,
|
||||
|
||||
//是否禁止修改唯一名称
|
||||
widgetNameReadonly: false,
|
||||
|
||||
//是否显示组件事件属性折叠面板
|
||||
eventCollapse: false,
|
||||
|
||||
//是否显示清空设计器按钮
|
||||
clearDesignerButton: true,
|
||||
|
||||
//是否显示预览表单按钮
|
||||
previewFormButton: false,
|
||||
|
||||
//是否显示导入JSON按钮
|
||||
importJsonButton: false,
|
||||
|
||||
//是否显示导出JSON器按钮
|
||||
exportJsonButton: false,
|
||||
|
||||
//是否显示导出代码按钮
|
||||
exportCodeButton: true,
|
||||
|
||||
//是否显示生成SFC按钮
|
||||
generateSFCButton: false,
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
importJsonConfig();
|
||||
});
|
||||
|
||||
|
||||
// 根据当前表，获取json配置信息
|
||||
const importJsonConfig = () => {
|
||||
const { tableName, dsName } = route.query;
|
||||
|
||||
if (tableName && dsName) {
|
||||
useGeneratorVFormApi(dsName, tableName).then((res) => {
|
||||
vfDesignerRef.value.loadJson(res);
|
||||
});
|
||||
} else {
|
||||
useMessageBox()
|
||||
.confirm('表单初始化失败，请重新选择表点击设计打开')
|
||||
.then(() => {
|
||||
// 关闭当前tab
|
||||
mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const handleRefresh = (id: string) => {
|
||||
fetchFormById(id).then((res) => {
|
||||
vfDesignerRef.value.loadJson(JSON.parse(res.data.formInfo));
|
||||
useMessage().success(t('common.optSuccessText'));
|
||||
});
|
||||
};
|
||||
|
||||
const saveJsonConfig = () => {
|
||||
const { tableName, dsName } = route.query;
|
||||
|
||||
if (tableName && dsName) {
|
||||
// 先保存表单
|
||||
const formJson = vfDesignerRef.value.getFormJson();
|
||||
useFormConfSaveApi({
|
||||
dsName,
|
||||
tableName,
|
||||
formInfo: JSON.stringify(formJson),
|
||||
}).then(() => {
|
||||
useMessage().success(t('common.optSuccessText'));
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const exportSfcConfig = async () => {
|
||||
try {
|
||||
const { tableName, dsName } = route.query;
|
||||
if (!tableName || !dsName) throw new Error('表名或数据源名称不能为空');
|
||||
const formJson = vfDesignerRef.value.getFormJson();
|
||||
const { data } = await useFormConfSaveApi({
|
||||
dsName,
|
||||
tableName,
|
||||
formInfo: JSON.stringify(formJson),
|
||||
});
|
||||
const sfcRes = await useGeneratorVFormSfcApi(data.id);
|
||||
handleBlobFile(sfcRes, 'form.vue');
|
||||
} catch (error: any) {
|
||||
useMessage().error(error.message);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
@ -1,15 +1,14 @@
|
||||
<template>
|
||||
<el-dialog :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible" width="600"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-dialog :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible" width="600" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
||||
<el-form-item :label="t('fieldtype.columnType')" prop="columnType">
|
||||
<el-input v-model="form.columnType" :placeholder="t('fieldtype.inputcolumnTypeTip')"/>
|
||||
<el-input v-model="form.columnType" :placeholder="t('fieldtype.inputcolumnTypeTip')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('fieldtype.attrType')" prop="attrType">
|
||||
<el-input v-model="form.attrType" :placeholder="t('fieldtype.inputattrTypeTip')"/>
|
||||
<el-input v-model="form.attrType" :placeholder="t('fieldtype.inputattrTypeTip')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('fieldtype.packageName')" prop="packageName">
|
||||
<el-input v-model="form.packageName" :placeholder="t('fieldtype.inputpackageNameTip')"/>
|
||||
<el-input v-model="form.packageName" :placeholder="t('fieldtype.inputpackageNameTip')" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -22,12 +21,12 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemFieldTypeDialog">
|
||||
import {useMessage} from '/@/hooks/message';
|
||||
import {getObj, addObj, putObj, validateColumnType} from '/@/api/gen/fieldtype';
|
||||
import {useI18n} from 'vue-i18n';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj, validateColumnType } from '/@/api/gen/fieldtype';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
// 定义子组件向父组件传值/事件
|
||||
const emit = defineEmits(['refresh']);
|
||||
const {t} = useI18n();
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
@ -46,14 +45,14 @@ const form = reactive({
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
columnType: [
|
||||
{required: true, message: '字段类型不能为空', trigger: 'blur'},
|
||||
{ required: true, message: '字段类型不能为空', trigger: 'blur' },
|
||||
{
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
validateColumnType(rule, value, callback, form.id !== '');
|
||||
},
|
||||
},
|
||||
],
|
||||
attrType: [{required: true, message: '属性类型不能为空', trigger: 'blur'}],
|
||||
attrType: [{ required: true, message: '属性类型不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
@ -77,8 +76,7 @@ const openDialog = (id: string) => {
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {
|
||||
});
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
|
||||
@ -2,16 +2,16 @@
|
||||
<div class="layout-padding">
|
||||
<el-card class="layout-padding-auto" shadow="hover">
|
||||
<el-steps :active="active" finish-status="success" simple>
|
||||
<el-step title="基础信息" @click="go(0)" />
|
||||
<el-step title="数据修改" @click="go(1)" />
|
||||
<el-step title="基础信息" @click="go(0)"/>
|
||||
<el-step title="数据修改" @click="go(1)"/>
|
||||
</el-steps>
|
||||
</el-card>
|
||||
|
||||
<el-card class="layout-padding-auto mt5" shadow="hover">
|
||||
<!-- 生成基本信息设置 -->
|
||||
<generator ref="generatorRef" :tableName="tableName" :dsName="dsName" v-if="active === 0" />
|
||||
<generator ref="generatorRef" :tableName="tableName" :dsName="dsName" v-if="active === 0"/>
|
||||
<!-- 字段编辑设置 -->
|
||||
<edit-table ref="editTableRef" :tableName="tableName" :dsName="dsName" v-if="active === 1" />
|
||||
<edit-table ref="editTableRef" :tableName="tableName" :dsName="dsName" v-if="active === 1"/>
|
||||
|
||||
<div style="text-align: center">
|
||||
<el-button style="margin-top: 12px" @click="go(1)" v-if="active === 0">下一步</el-button>
|
||||
@ -22,17 +22,17 @@
|
||||
</el-card>
|
||||
|
||||
<!-- 预览基本信息 -->
|
||||
<preview-dialog ref="previewDialogRef" />
|
||||
<preview-dialog ref="previewDialogRef"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useGeneratorCodeApi } from '/@/api/gen/table';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { downBlobFile } from '/@/utils/other';
|
||||
import {useI18n} from 'vue-i18n';
|
||||
import {useGeneratorCodeApi} from '/@/api/gen/table';
|
||||
import {useMessage} from '/@/hooks/message';
|
||||
import {downBlobFile} from '/@/utils/other';
|
||||
|
||||
const { t } = useI18n();
|
||||
const {t} = useI18n();
|
||||
const Generator = defineAsyncComponent(() => import('../table/generator.vue'));
|
||||
const EditTable = defineAsyncComponent(() => import('../table/edit.vue'));
|
||||
const PreviewDialog = defineAsyncComponent(() => import('../table/preview.vue'));
|
||||
@ -47,10 +47,9 @@ const dsName = ref();
|
||||
const editTableRef = ref();
|
||||
const generatorType = ref();
|
||||
|
||||
// tab 跳转
|
||||
const go = async (activeNum: number) => {
|
||||
if (active.value === activeNum) return;
|
||||
active.value = activeNum;
|
||||
|
||||
try {
|
||||
if (activeNum === 0) {
|
||||
await editTableRef.value.submitHandle();
|
||||
} else if (activeNum === 1) {
|
||||
@ -58,8 +57,14 @@ const go = async (activeNum: number) => {
|
||||
tableId.value = dataform.id;
|
||||
generatorType.value = dataform.generatorType;
|
||||
}
|
||||
if (active.value === activeNum) return;
|
||||
active.value = activeNum;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
};
|
||||
|
||||
// 预览
|
||||
const preview = async () => {
|
||||
await editTableRef.value.submitHandle();
|
||||
previewDialogRef.value.openDialog(tableId.value);
|
||||
|
||||
@ -2,15 +2,15 @@
|
||||
<el-dialog v-model="visible" :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" width="600">
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
||||
<el-form-item :label="t('group.groupName')" prop="groupName">
|
||||
<el-input v-model="form.groupName" :placeholder="t('group.inputGroupNameTip')"/>
|
||||
<el-input v-model="form.groupName" :placeholder="t('group.inputGroupNameTip')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('group.templateType')" prop="templateId">
|
||||
<el-select v-model="form.templateId" :placeholder="$t('group.selectType')" class="w100" clearable multiple>
|
||||
<el-option v-for="item in templateData" :key="item.id" :label="item.templateName" :value="item.id"/>
|
||||
<el-select v-model="form.templateId" :placeholder="$t('group.selectType')" clearable multiple>
|
||||
<el-option v-for="item in templateData" :key="item.id" :label="item.templateName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('group.groupDesc')" prop="groupDesc">
|
||||
<el-input type="textarea" maxlength="150" rows="3" v-model="form.groupDesc" :placeholder="t('group.inputGroupDescTip')"/>
|
||||
<el-input type="textarea" maxlength="100" :rows="5" v-model="form.groupDesc" :placeholder="t('group.inputGroupDescTip')" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -23,13 +23,13 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="GenGroupDialog" setup>
|
||||
import {useMessage} from '/@/hooks/message';
|
||||
import {addObj, getObj, putObj} from '/@/api/gen/group';
|
||||
import {useI18n} from 'vue-i18n';
|
||||
import {list as templateList} from '/@/api/gen/template';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { addObj, getObj, putObj } from '/@/api/gen/group';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { list as templateList } from '/@/api/gen/template';
|
||||
// 定义子组件向父组件传值/事件
|
||||
const emit = defineEmits(['refresh']);
|
||||
const {t} = useI18n();
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
@ -49,8 +49,8 @@ const form = reactive({
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
groupName: [{required: true, message: '分组名称不能为空', trigger: 'blur'}],
|
||||
templateId: [{required: true, message: '模板不能为空', trigger: 'blur'}],
|
||||
groupName: [{ required: true, message: '分组名称不能为空', trigger: 'blur' }],
|
||||
templateId: [{ required: true, message: '模板不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
const openDialog = (id: string) => {
|
||||
@ -74,8 +74,7 @@ const openDialog = (id: string) => {
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {
|
||||
});
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
|
||||
151
src/views/gen/table/add-dict.vue
Normal file
151
src/views/gen/table/add-dict.vue
Normal file
@ -0,0 +1,151 @@
|
||||
<template>
|
||||
<el-dialog title="新增字典" v-model="visible" width="600">
|
||||
<el-form :model="dataForm" :rules="dataRules" label-width="100px" ref="dicDialogFormRef" v-loading="loading">
|
||||
<el-form-item :label="$t('sysdict.systemFlag')" prop="systemFlag">
|
||||
<el-radio-group v-model="dataForm.systemFlag">
|
||||
<el-radio border :key="index" :label="item.value" v-for="(item, index) in dict_type">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('sysdict.dictType')" prop="dictType">
|
||||
<el-input :placeholder="$t('sysdict.inputDictTypeTip')" :disabled="dataForm.id !== ''" clearable
|
||||
v-model="dataForm.dictType"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('sysdict.description')" prop="description">
|
||||
<el-input :placeholder="$t('sysdict.inputDescriptionTip')" clearable v-model="dataForm.description"></el-input>
|
||||
</el-form-item>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item :label="t('dictItem.name')" prop="columns">
|
||||
<el-table :data="dataForm.columns" border style="width: 100%" max-height="500">
|
||||
<el-table-column type="index" :label="t('createTable.index')" width="50">
|
||||
<template #header>
|
||||
<el-button icon="Plus" size="small" type="primary" circle @click="onAddItem"></el-button>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button icon="Minus" size="small" type="danger" circle
|
||||
@click="handleDelete(scope.$index, scope.row)"></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="label" :label="$t('dictItem.label')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.label" :placeholder="t('dictItem.inputLabelTip')"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="value" :label="$t('dictItem.itemValue')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.value" :placeholder="t('dictItem.inputItemValueTip')"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button @click="onSubmit" type="primary" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="systemDicDialog" setup>
|
||||
import {useI18n} from 'vue-i18n';
|
||||
import {addItemObj, addObj, getObj, validateDictType} from '/@/api/admin/dict';
|
||||
import {useDict} from '/@/hooks/dict';
|
||||
import {useMessage} from '/@/hooks/message';
|
||||
import {rule} from '/@/utils/validate';
|
||||
|
||||
// 定义子组件向父组件传值/事件
|
||||
const emit = defineEmits(['refresh']);
|
||||
const {dict_type} = useDict('dict_type');
|
||||
const {t} = useI18n();
|
||||
// 定义变量内容
|
||||
const dicDialogFormRef = ref();
|
||||
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const selectRow = ref({});
|
||||
const dataForm = reactive({
|
||||
id: '',
|
||||
dictType: '',
|
||||
description: '',
|
||||
systemFlag: '0',
|
||||
remarks: '',
|
||||
columns: [] as any
|
||||
});
|
||||
|
||||
const dataRules = reactive({
|
||||
dictType: [
|
||||
{validator: rule.overLength, trigger: 'blur'},
|
||||
{required: true, message: '类型不能为空', trigger: 'blur'},
|
||||
{validator: rule.validatorNameCn, trigger: 'blur'},
|
||||
{
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
validateDictType(rule, value, callback, dataForm.id !== '');
|
||||
},
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
systemFlag: [{required: true, message: '字典类型不能为空', trigger: 'blur'}],
|
||||
description: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '描述不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
columns: [{required: true, message: '字典项不能为空', trigger: 'blur'}],
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = () => {
|
||||
visible.value = true;
|
||||
dataForm.id = '';
|
||||
nextTick(() => {
|
||||
dicDialogFormRef.value?.resetFields();
|
||||
});
|
||||
};
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dicDialogFormRef.value.validate().catch(() => {
|
||||
});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
// 添加字典
|
||||
const {data} = await addObj(dataForm);
|
||||
// addItemObj
|
||||
|
||||
dataForm.columns.forEach(async (item: any) => {
|
||||
item.dictId = data.id;
|
||||
item.dictType = dataForm.dictType;
|
||||
await addItemObj(item);
|
||||
});
|
||||
useMessage().success(t('common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh', dataForm.dictType);
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
let index = 1;
|
||||
const onAddItem = () => {
|
||||
dataForm.columns.push({sortOrder: `${index++}`});
|
||||
}
|
||||
|
||||
const handleDelete = (index: number, row: any) => {
|
||||
dataForm.columns.splice(index, 1)
|
||||
}
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
@ -2,10 +2,11 @@
|
||||
<el-tabs v-model="activeName">
|
||||
<!-- 属性设置面板 -->
|
||||
<el-tab-pane label="属性设置" name="field">
|
||||
<sc-form-table ref="fieldTable" v-model="fieldList" :hideAdd="true" :hideDelete="true" drag-sort placeholder="暂无数据">
|
||||
<sc-form-table ref="fieldTable" v-model="fieldList" :hideAdd="true" :hideDelete="true" drag-sort
|
||||
placeholder="暂无数据">
|
||||
<el-table-column label="主键" prop="primaryPk" width="80" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.primaryPk" true-label="1" false-label="0" disabled></el-checkbox>
|
||||
<el-checkbox v-model="row.primaryPk" true-value="1" false-value="0" disabled></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="字段名" prop="fieldName" show-overflow-tooltip></el-table-column>
|
||||
@ -23,21 +24,25 @@
|
||||
<el-table-column label="属性类型" prop="attrType" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.attrType" placeholder="请选择属性类型" @change="handleChangeRow(row)">
|
||||
<el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="自动填充" prop="autoFill" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.autoFill" placeholder="请选择类型">
|
||||
<el-option v-for="item in fillList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-option v-for="item in fillList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="字典类型" prop="fieldDict" show-overflow-tooltip>
|
||||
<el-table-column label="字典名称" prop="fieldDict" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.fieldDict" placeholder="请选择类型" filterable clearable :disabled="row.primaryPk === '1'">
|
||||
<el-option v-for="item in fieldDictList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-select v-model="row.fieldDict" placeholder="请选择类型" filterable clearable
|
||||
:disabled="row.primaryPk === '1'">
|
||||
<template #prefix>
|
||||
<el-button icon="Plus" type="primary" link @click.stop="handleAddDict(row)"></el-button>
|
||||
</template>
|
||||
<el-option v-for="item in fieldDictList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@ -50,30 +55,33 @@
|
||||
<el-table-column label="说明" prop="fieldComment" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="列表显示" prop="gridItem" width="100" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.gridItem" true-label="1" false-label="0" :disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
<el-checkbox v-model="row.gridItem" true-value="1" false-value="0"
|
||||
:disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否排序" prop="gridSort" width="100" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.gridSort" true-label="1" false-label="0" :disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
<el-checkbox v-model="row.gridSort" true-value="1" false-value="0"
|
||||
:disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="查询显示" prop="gridSort" width="100" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.queryItem" true-label="1" false-label="0" :disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
<el-checkbox v-model="row.queryItem" true-value="1" false-value="0"
|
||||
:disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="查询表单类型" prop="queryFormType" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.queryFormType" placeholder="请选择查询表单类型" :disabled="row.primaryPk === '1'">
|
||||
<el-option v-for="item in queryTypeList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-option v-for="item in queryTypeList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="查询方式" prop="queryType" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.queryType" placeholder="请选择查询方式" :disabled="row.primaryPk === '1'">
|
||||
<el-option v-for="item in queryList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-option v-for="item in queryList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@ -86,38 +94,44 @@
|
||||
<el-table-column label="表单类型" prop="formType" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.formType" placeholder="请选择表单类型" :disabled="row.primaryPk === '1'">
|
||||
<el-option v-for="item in formTypeList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-option v-for="item in formTypeList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否显示" prop="formItem" width="100" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.formItem" true-label="1" false-label="0" :disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
<el-checkbox v-model="row.formItem" true-value="1" false-value="0"
|
||||
:disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="表单必填" prop="formRequired" width="100" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.formRequired" true-label="1" false-label="0" :disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
<el-checkbox v-model="row.formRequired" true-value="1" false-value="0"
|
||||
:disabled="row.primaryPk === '1'"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="表单效验" prop="formValidator" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.formValidator" placeholder="请选择表单效验" :disabled="row.primaryPk === '1'">
|
||||
<el-option v-for="item in formValidatorList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-option v-for="item in formValidatorList" :key="item.value" :label="item.label" :value="item.value"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</sc-form-table>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<!-- 新增字典 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="handleDictRefresh"/>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useTableFieldSubmitApi, useTableApi, fetchDictList } from '/@/api/gen/table';
|
||||
import { list } from '/@/api/gen/fieldtype';
|
||||
import {useTableFieldSubmitApi, useTableApi, fetchDictList} from '/@/api/gen/table';
|
||||
import {list} from '/@/api/gen/fieldtype';
|
||||
import Sortable from 'sortablejs';
|
||||
|
||||
const scFormTable = defineAsyncComponent(() => import('/@/components/FormTable/index.vue'));
|
||||
const FormDialog = defineAsyncComponent(() => import('./add-dict.vue'));
|
||||
|
||||
const activeName = ref();
|
||||
const tableId = ref('');
|
||||
@ -135,66 +149,69 @@ const visible = ref(false);
|
||||
|
||||
const sortable = ref() as any;
|
||||
|
||||
const formDialogRef = ref();
|
||||
const typeList = ref([]) as any;
|
||||
const fieldDictList = ref([]) as any;
|
||||
const selectRow = ref();
|
||||
const dsName = ref();
|
||||
const tableName = ref();
|
||||
|
||||
const fieldList = ref([]);
|
||||
const fillList = reactive([
|
||||
{ label: 'DEFAULT', value: 'DEFAULT' },
|
||||
{ label: 'INSERT', value: 'INSERT' },
|
||||
{ label: 'UPDATE', value: 'UPDATE' },
|
||||
{ label: 'INSERT_UPDATE', value: 'INSERT_UPDATE' },
|
||||
{label: 'DEFAULT', value: 'DEFAULT'},
|
||||
{label: 'INSERT', value: 'INSERT'},
|
||||
{label: 'UPDATE', value: 'UPDATE'},
|
||||
{label: 'INSERT_UPDATE', value: 'INSERT_UPDATE'},
|
||||
]);
|
||||
|
||||
const queryList = reactive([
|
||||
{ label: '=', value: '=' },
|
||||
{ label: '!=', value: '!=' },
|
||||
{ label: '>', value: '>' },
|
||||
{ label: '>=', value: '>=' },
|
||||
{ label: '<', value: '<' },
|
||||
{ label: '<=', value: '<=' },
|
||||
{ label: 'like', value: 'like' },
|
||||
{ label: 'left like', value: 'left like' },
|
||||
{ label: 'right like', value: 'right like' },
|
||||
{label: '=', value: '='},
|
||||
{label: '!=', value: '!='},
|
||||
{label: '>', value: '>'},
|
||||
{label: '>=', value: '>='},
|
||||
{label: '<', value: '<'},
|
||||
{label: '<=', value: '<='},
|
||||
{label: 'like', value: 'like'},
|
||||
{label: 'left like', value: 'left like'},
|
||||
{label: 'right like', value: 'right like'},
|
||||
]);
|
||||
|
||||
const formTypeList = reactive([
|
||||
{ label: '单行文本', value: 'text' },
|
||||
{ label: '多行文本', value: 'textarea' },
|
||||
{ label: '数字', value: 'number' },
|
||||
{ label: '富文本编辑器', value: 'editor' },
|
||||
{ label: '下拉框', value: 'select' },
|
||||
{ label: '单选按钮', value: 'radio' },
|
||||
{ label: '复选框', value: 'checkbox' },
|
||||
{ label: '日期', value: 'date' },
|
||||
{ label: '日期时间', value: 'datetime' },
|
||||
{ label: '文件上传', value: 'upload-file' },
|
||||
{ label: '图片上传', value: 'upload-img' },
|
||||
{label: '单行文本', value: 'text'},
|
||||
{label: '多行文本', value: 'textarea'},
|
||||
{label: '数字', value: 'number'},
|
||||
{label: '富文本编辑器', value: 'editor'},
|
||||
{label: '下拉框', value: 'select'},
|
||||
{label: '单选按钮', value: 'radio'},
|
||||
{label: '复选框', value: 'checkbox'},
|
||||
{label: '日期', value: 'date'},
|
||||
{label: '日期时间', value: 'datetime'},
|
||||
{label: '文件上传', value: 'upload-file'},
|
||||
{label: '图片上传', value: 'upload-img'},
|
||||
]);
|
||||
|
||||
const queryTypeList = reactive([
|
||||
{ label: '单行文本', value: 'text' },
|
||||
{ label: '多行文本', value: 'textarea' },
|
||||
{ label: '数字', value: 'number' },
|
||||
{ label: '下拉框', value: 'select' },
|
||||
{ label: '单选按钮', value: 'radio' },
|
||||
{ label: '复选框', value: 'checkbox' },
|
||||
{ label: '日期', value: 'date' },
|
||||
{ label: '日期时间', value: 'datetime' },
|
||||
{label: '单行文本', value: 'text'},
|
||||
{label: '多行文本', value: 'textarea'},
|
||||
{label: '数字', value: 'number'},
|
||||
{label: '下拉框', value: 'select'},
|
||||
{label: '单选按钮', value: 'radio'},
|
||||
{label: '复选框', value: 'checkbox'},
|
||||
{label: '日期', value: 'date'},
|
||||
{label: '日期时间', value: 'datetime'},
|
||||
]);
|
||||
|
||||
const formValidatorList = reactive([
|
||||
{ label: '数字', value: 'number' },
|
||||
{ label: '字母', value: 'letter' },
|
||||
{ label: '字母和数字', value: 'letterAndNumber' },
|
||||
{ label: '手机号码', value: 'mobilePhone' },
|
||||
{ label: '字母开头，仅可包含数字', value: 'letterStartNumberIncluded' },
|
||||
{ label: '禁止中文输入', value: 'noChinese' },
|
||||
{ label: '必须中文输入', value: 'chinese' },
|
||||
{ label: '电子邮箱', value: 'email' },
|
||||
{ label: 'URL网址', value: 'url' },
|
||||
{label: '去重', value: 'duplicate'},
|
||||
{label: '数字', value: 'number'},
|
||||
{label: '字母', value: 'letter'},
|
||||
{label: '字母和数字', value: 'letterAndNumber'},
|
||||
{label: '手机号码', value: 'mobilePhone'},
|
||||
{label: '字母开头，仅可包含数字', value: 'letterStartNumberIncluded'},
|
||||
{label: '禁止中文输入', value: 'noChinese'},
|
||||
{label: '必须中文输入', value: 'chinese'},
|
||||
{label: '电子邮箱', value: 'email'},
|
||||
{label: 'URL网址', value: 'url'},
|
||||
]);
|
||||
|
||||
const propToType = reactive({
|
||||
@ -222,11 +239,33 @@ const propToType = reactive({
|
||||
varchar: 'text',
|
||||
});
|
||||
|
||||
/**
|
||||
* 属性修改触发事件
|
||||
* @param row
|
||||
*/
|
||||
const handleChangeRow = (row: any) => {
|
||||
row.queryFormType = propToType[row.attrType];
|
||||
row.formType = propToType[row.attrType];
|
||||
};
|
||||
|
||||
/**
|
||||
* 添加字典
|
||||
* @param row
|
||||
*/
|
||||
const handleAddDict = (row: object) => {
|
||||
selectRow.value = row;
|
||||
formDialogRef.value.openDialog();
|
||||
};
|
||||
|
||||
/**
|
||||
* 刷新字典
|
||||
* @param dictType
|
||||
*/
|
||||
const handleDictRefresh = async (dictType: string) => {
|
||||
await getDictList();
|
||||
selectRow.value.fieldDict = dictType;
|
||||
};
|
||||
|
||||
const openDialog = (dName: string, tName: string) => {
|
||||
visible.value = true;
|
||||
tableName.value = tName;
|
||||
@ -256,7 +295,7 @@ const rowDrop = () => {
|
||||
sortable.value = Sortable.create(el, {
|
||||
handle: '.drag-btn',
|
||||
onEnd: (e: any) => {
|
||||
const { newIndex, oldIndex } = e;
|
||||
const {newIndex, oldIndex} = e;
|
||||
const currRow = fieldList.value.splice(oldIndex, 1)[0];
|
||||
fieldList.value.splice(newIndex, 0, currRow);
|
||||
},
|
||||
@ -285,24 +324,24 @@ const getTable = (dsName: string, tableName: string) => {
|
||||
const getFieldTypeList = async () => {
|
||||
typeList.value = [];
|
||||
// 获取数据
|
||||
const { data } = await list();
|
||||
const {data} = await list();
|
||||
// 设置属性类型值
|
||||
const typeMap = new Map();
|
||||
data.forEach((item: any) => {
|
||||
const { attrType, columnType } = item;
|
||||
const {attrType, columnType} = item;
|
||||
if (!typeMap.has(attrType)) {
|
||||
typeMap.set(attrType, columnType);
|
||||
typeList.value.push({ label: attrType, value: attrType });
|
||||
typeList.value.push({label: attrType, value: attrType});
|
||||
}
|
||||
});
|
||||
// 增加Object类型
|
||||
typeList.value.push({ label: 'Object', value: 'Object' });
|
||||
typeList.value.push({label: 'Object', value: 'Object'});
|
||||
};
|
||||
|
||||
const getDictList = () => {
|
||||
fetchDictList().then((res) => {
|
||||
for (const item of res.data) {
|
||||
fieldDictList.value.push({ label: item.description, value: item.dictType });
|
||||
fieldDictList.value.push({label: item.description, value: item.dictType});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
@ -7,7 +7,11 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="说明" prop="tableComment">
|
||||
<el-form-item prop="tableComment">
|
||||
<template #label>
|
||||
<span>注释</span>
|
||||
<tip content="注释"/>
|
||||
</template>
|
||||
<el-input placeholder="说明" v-model="dataForm.tableComment"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -31,14 +35,22 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="模块名" prop="moduleName">
|
||||
<el-form-item prop="moduleName">
|
||||
<template #label>
|
||||
<span>模块名</span>
|
||||
<tip content="所属微服务模块名称，对应微服务路由前缀 （单体固定 admin）"/>
|
||||
</template>
|
||||
<el-input placeholder="模块名" v-model="dataForm.moduleName"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="功能名" prop="functionName">
|
||||
<el-form-item prop="functionName">
|
||||
<template #label>
|
||||
<span>功能名</span>
|
||||
<tip content="对应生成的Controller @RequestMapping 请求路径"/>
|
||||
</template>
|
||||
<el-input placeholder="功能名" v-model="dataForm.functionName"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -55,24 +67,32 @@
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="表单布局" prop="formLayout">
|
||||
<el-radio-group v-model="dataForm.formLayout">
|
||||
<el-radio border :label="1">一列</el-radio>
|
||||
<el-radio border :label="2">两列</el-radio>
|
||||
<el-radio border :value="1">一列</el-radio>
|
||||
<el-radio border :value="2">两列</el-radio>
|
||||
</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 border label="1">自定义路径</el-radio>
|
||||
<el-radio border label="0">ZIP 压缩包</el-radio>
|
||||
<el-radio border value="1">自定义路径</el-radio>
|
||||
<el-radio border value="0">ZIP 压缩包</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item label="后端生成路径" prop="backendPath" v-if="dataForm.generatorType === '1'">
|
||||
<el-form-item prop="backendPath" v-if="dataForm.generatorType === '1'">
|
||||
<template #label>
|
||||
<span>后端生成路径</span>
|
||||
<tip content="后端模块biz所在文件全路径比如：D:\data\pigx\pigx-upms\pigx-upms-biz"/>
|
||||
</template>
|
||||
<el-input placeholder="后端生成路径" v-model="dataForm.backendPath"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="前端生成路径" prop="frontendPath" v-if="dataForm.generatorType === '1'">
|
||||
<el-form-item prop="frontendPath" v-if="dataForm.generatorType === '1'">
|
||||
<template #label>
|
||||
<span>前端生成路径</span>
|
||||
<tip content="前端所在文件全路径比如：D:\data\pigx-ui"/>
|
||||
</template>
|
||||
<el-input placeholder="前端生成路径" v-model="dataForm.frontendPath"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -83,7 +103,10 @@
|
||||
<script lang="ts" setup>
|
||||
import {putObj, useTableApi} from '/@/api/gen/table';
|
||||
import {list as groupList} from '/@/api/gen/group';
|
||||
import {checkVersion, online} from '/@/api/gen/template';
|
||||
import {Local} from '/@/utils/storage';
|
||||
import {rule} from "/@/utils/validate";
|
||||
import {useMessage, useMessageBox} from "/@/hooks/message";
|
||||
|
||||
const props = defineProps({
|
||||
tableName: {
|
||||
@ -127,7 +150,7 @@ const getTable = (dsName: string, tableName: string) => {
|
||||
.then((res) => {
|
||||
Object.assign(dataForm, res.data);
|
||||
let list = res.data.groupList;
|
||||
dataForm.style = list[0].id;
|
||||
dataForm.style = list[0]?.id;
|
||||
|
||||
// 如果是保存路径的形式，有限使用本地配置项
|
||||
const frontendPath = Local.get('frontendPath');
|
||||
@ -144,24 +167,66 @@ const getTable = (dsName: string, tableName: string) => {
|
||||
};
|
||||
|
||||
const dataRules = ref({
|
||||
tableName: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
tableComment: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
className: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
packageName: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
author: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
moduleName: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
functionName: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
generatorType: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
formLayout: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
backendPath: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
frontendPath: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
tableName: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
tableComment: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
className: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
packageName: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
author: [{validator: rule.overLength, trigger: 'blur'}, {required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
moduleName: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
functionName: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
generatorType: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
formLayout: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
backendPath: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
frontendPath: [{validator: rule.overLength, trigger: 'blur'}, {
|
||||
required: true,
|
||||
message: '必填项不能为空',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
style: [{required: true, message: '必填项不能为空', trigger: 'blur'}],
|
||||
});
|
||||
|
||||
// 保存
|
||||
const submitHandle = async () => {
|
||||
try {
|
||||
await dataFormRef.value.validate();
|
||||
const valid = await dataFormRef.value.validate(); // 表单校验
|
||||
if (!valid) return false;
|
||||
|
||||
loading.value = true;
|
||||
await putObj(Object.assign(dataForm, childForm.value));
|
||||
visible.value = false;
|
||||
@ -171,7 +236,7 @@ const submitHandle = async () => {
|
||||
return Promise.reject();
|
||||
} finally {
|
||||
//保存路径至Local 中方便下次使用
|
||||
if (dataForm.generatorType === '1') {
|
||||
if (dataForm.generatorType === "1") {
|
||||
Local.set('frontendPath', dataForm.frontendPath);
|
||||
Local.set('backendPath', dataForm.backendPath);
|
||||
}
|
||||
@ -180,11 +245,40 @@ const submitHandle = async () => {
|
||||
};
|
||||
|
||||
const genGroupList = () => {
|
||||
groupList().then((res) => {
|
||||
groupDataList.value = res.data;
|
||||
});
|
||||
groupList().then(({data}) => {
|
||||
if (data && data.length > 0 ){
|
||||
groupDataList.value = data;
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
/**
|
||||
* 检查模板版本
|
||||
*/
|
||||
const checkTemplateVersion = async () => {
|
||||
checkVersion().then(({data}) => {
|
||||
if (!data) {
|
||||
useMessageBox().confirm('模板发现新版本，是否更新？').then(() => {
|
||||
// 更新模板
|
||||
online().then(() => {
|
||||
useMessage().success('更新成功');
|
||||
genGroupList()
|
||||
});
|
||||
}).catch(() => {
|
||||
})
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
watch(
|
||||
() => childForm,
|
||||
() => {
|
||||
const {childTableName} = childForm.value || {};
|
||||
tableNameStr.value = childTableName ? `${props.tableName} + ${childTableName}` : props.tableName;
|
||||
},
|
||||
{deep: true, immediate: true}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
// 重置表单数据
|
||||
if (dataFormRef.value) {
|
||||
@ -196,6 +290,7 @@ onMounted(() => {
|
||||
|
||||
getTable(dataForm.dsName, dataForm.tableName);
|
||||
genGroupList();
|
||||
checkTemplateVersion()
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
|
||||
@ -4,13 +4,13 @@
|
||||
<el-row class="ml10" v-show="showSearch">
|
||||
<el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList" ref="queryRef">
|
||||
<el-form-item label="数据源" prop="name">
|
||||
<el-select @change="getDataList" placeholder="请选择数据源" style="width: 100%" v-model="state.queryForm.dsName">
|
||||
<el-select @change="getDataList" placeholder="请选择数据源" v-model="state.queryForm.dsName">
|
||||
<el-option label="默认数据源" value="master"></el-option>
|
||||
<el-option :key="ds.id" :label="ds.name" :value="ds.name" v-for="ds in datasourceList"> </el-option>
|
||||
<el-option :key="ds.id" :label="ds.name" :value="ds.name" v-for="ds in datasourceList"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('table.tableName')" prop="tableName">
|
||||
<el-input :placeholder="$t('table.inputtableNameTip')" style="max-width: 180px" v-model="state.queryForm.tableName" />
|
||||
<el-input :placeholder="$t('table.inputtableNameTip')" v-model="state.queryForm.tableName"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList" icon="search" type="primary">
|
||||
@ -40,36 +40,39 @@
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
>
|
||||
<el-table-column :label="t('table.index')" type="index" width="60" />
|
||||
<el-table-column :label="t('table.tableName')" prop="tableName" show-overflow-tooltip />
|
||||
<el-table-column :label="t('table.tableDesc')" prop="tableComment" show-overflow-tooltip />
|
||||
<el-table-column :label="t('table.createTime')" prop="createTime" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="200">
|
||||
<el-table-column :label="t('table.index')" type="index" width="60"/>
|
||||
<el-table-column :label="t('table.tableName')" prop="name" show-overflow-tooltip/>
|
||||
<el-table-column :label="t('table.tableDesc')" prop="comment" show-overflow-tooltip/>
|
||||
<el-table-column :label="t('table.createTime')" prop="createTime" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="250">
|
||||
<template #default="scope">
|
||||
<el-button icon="Refresh" @click="syncTable(scope.row)" text type="primary">
|
||||
{{ $t('gen.syncBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="FolderOpened" @click="openGen(scope.row)" text type="primary">{{ $t('gen.genBtn') }} </el-button>
|
||||
<el-button icon="FolderOpened" @click="openGen(scope.row)" text type="primary">{{
|
||||
$t('gen.genBtn')
|
||||
}}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination" />
|
||||
<pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="systemTable" setup>
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, useSyncTableApi, useTableApi } from '/@/api/gen/table';
|
||||
import { list } from '/@/api/gen/datasource';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import {BasicTableProps, useTable} from '/@/hooks/table';
|
||||
import {fetchList, useSyncTableApi, useTableApi} from '/@/api/gen/table';
|
||||
import {list} from '/@/api/gen/datasource';
|
||||
import {useMessage} from '/@/hooks/message';
|
||||
import {useI18n} from 'vue-i18n';
|
||||
import {validateNull} from '/@/utils/validate';
|
||||
|
||||
// 定义变量内容
|
||||
const router = useRouter();
|
||||
// 引入组件
|
||||
const { t } = useI18n();
|
||||
const {t} = useI18n();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
@ -85,7 +88,7 @@ const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
});
|
||||
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, downBlobFile, tableStyle } = useTable(state);
|
||||
const {getDataList, currentChangeHandle, sizeChangeHandle, downBlobFile, tableStyle} = useTable(state);
|
||||
|
||||
// 初始化数据
|
||||
onMounted(() => {
|
||||
@ -100,7 +103,7 @@ onMounted(() => {
|
||||
});
|
||||
|
||||
const openGen = (row) => {
|
||||
useTableApi(state.queryForm.dsName, row.tableName)
|
||||
useTableApi(state.queryForm.dsName, row.name)
|
||||
.then((res) => {
|
||||
if (validateNull(res.data.fieldList)) {
|
||||
syncTable(row);
|
||||
@ -110,7 +113,7 @@ const openGen = (row) => {
|
||||
router.push({
|
||||
path: '/gen/gener/index',
|
||||
query: {
|
||||
tableName: row.tableName,
|
||||
tableName: row.name,
|
||||
dsName: state.queryForm.dsName,
|
||||
},
|
||||
});
|
||||
@ -118,8 +121,8 @@ const openGen = (row) => {
|
||||
};
|
||||
|
||||
// 同步表数据
|
||||
const syncTable = (row) => {
|
||||
useSyncTableApi(state.queryForm.dsName, row.tableName).then(() => {
|
||||
const syncTable = (row: { name: string }) => {
|
||||
useSyncTableApi(state.queryForm.dsName, row.name).then(() => {
|
||||
useMessage().success(t('common.optSuccessText'));
|
||||
});
|
||||
};
|
||||
|
||||
@ -35,6 +35,7 @@
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { addObj, getObj, putObj } from '/@/api/gen/template';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import {rule} from "/@/utils/validate";
|
||||
|
||||
const CodeEditor = defineAsyncComponent(() => import('/@/components/CodeEditor/index.vue'));
|
||||
const emit = defineEmits(['refresh']);
|
||||
@ -59,9 +60,9 @@ const form = reactive({
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
templateName: [{ required: true, message: '模板名称不能为空', trigger: 'blur' }],
|
||||
generatorPath: [{ required: true, message: '模板路径不能为空', trigger: 'blur' }],
|
||||
templateDesc: [{ required: true, message: '模板描述不能为空', trigger: 'blur' }],
|
||||
templateName: [{ validator: rule.overLength, trigger: 'blur' },{ required: true, message: '模板名称不能为空', trigger: 'blur' }],
|
||||
generatorPath: [{ validator: rule.overLength, trigger: 'blur' },{ required: true, message: '模板路径不能为空', trigger: 'blur' }],
|
||||
templateDesc: [{ validator: rule.overLength, trigger: 'blur' },{ required: true, message: '模板描述不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
|
||||
@ -4,19 +4,21 @@
|
||||
<el-row class="ml10" v-show="showSearch">
|
||||
<el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList" ref="queryRef">
|
||||
<el-form-item :label="$t('template.templateName')" prop="templateName">
|
||||
<el-input :placeholder="t('template.inputTemplateNameTip')" style="max-width: 180px" v-model="state.queryForm.templateName" />
|
||||
<el-input :placeholder="t('template.inputTemplateNameTip')" style="max-width: 180px"
|
||||
v-model="state.queryForm.templateName"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList" formDialogRef icon="search" type="primary">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button @click="resetQuery" formDialogRef icon="Refresh">{{ $t('common.resetBtn') }} </el-button>
|
||||
<el-button @click="resetQuery" formDialogRef icon="Refresh">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button @click="formDialogRef.openDialog()" class="ml10" icon="folder-add" type="primary" v-auth="'codegen_template_add'">
|
||||
<el-button @click="formDialogRef.openDialog()" class="ml10" icon="folder-add" type="primary"
|
||||
v-auth="'codegen_template_add'">
|
||||
{{ $t('common.addBtn') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
@ -30,6 +32,10 @@
|
||||
>
|
||||
{{ $t('common.delBtn') }}
|
||||
</el-button>
|
||||
<el-button @click="onlineUpdate" class="ml10" icon="download" plain :disabled="updateDisabled"
|
||||
v-auth="'codegen_template_add'">
|
||||
更新
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
:export="'codegen_template_export'"
|
||||
@exportExcel="exportExcel"
|
||||
@ -49,44 +55,47 @@
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
>
|
||||
<el-table-column align="center" type="selection" width="40" />
|
||||
<el-table-column :label="t('template.index')" type="index" width="60" />
|
||||
<el-table-column :label="t('template.templateName')" prop="templateName" show-overflow-tooltip />
|
||||
<el-table-column :label="t('template.generatorPath')" prop="generatorPath" show-overflow-tooltip />
|
||||
<el-table-column :label="t('template.desc')" prop="templateDesc" show-overflow-tooltip />
|
||||
<el-table-column :label="t('template.createTime')" prop="createTime" show-overflow-tooltip />
|
||||
<el-table-column align="center" type="selection" width="40"/>
|
||||
<el-table-column :label="t('template.index')" type="index" width="60"/>
|
||||
<el-table-column :label="t('template.templateName')" prop="templateName" show-overflow-tooltip/>
|
||||
<el-table-column :label="t('template.generatorPath')" prop="generatorPath" show-overflow-tooltip/>
|
||||
<el-table-column :label="t('template.desc')" prop="templateDesc" show-overflow-tooltip/>
|
||||
<el-table-column :label="t('template.createTime')" prop="createTime" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="150">
|
||||
<template #default="scope">
|
||||
<el-button icon="edit-pen" @click="formDialogRef.openDialog(scope.row.id)" text type="primary" v-auth="'codegen_template_edit'"
|
||||
<el-button icon="edit-pen" @click="formDialogRef.openDialog(scope.row.id)" text type="primary"
|
||||
v-auth="'codegen_template_edit'"
|
||||
>{{ $t('common.editBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="delete" @click="handleDelete([scope.row.id])" text type="primary" v-auth="'codegen_template_del'"
|
||||
<el-button icon="delete" @click="handleDelete([scope.row.id])" text type="primary"
|
||||
v-auth="'codegen_template_del'"
|
||||
>{{ $t('common.delBtn') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination" />
|
||||
<pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination"/>
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog @refresh="getDataList()" ref="formDialogRef" />
|
||||
<form-dialog @refresh="getDataList()" ref="formDialogRef"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="systemGenTemplate" setup>
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { delObjs, fetchList } from '/@/api/gen/template';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import {BasicTableProps, useTable} from '/@/hooks/table';
|
||||
import {delObjs, fetchList, online} from '/@/api/gen/template';
|
||||
import {useMessage, useMessageBox} from '/@/hooks/message';
|
||||
import {useI18n} from 'vue-i18n';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
const {t} = useI18n();
|
||||
// 定义查询字典
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
const updateDisabled = ref(false);
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
@ -101,7 +110,7 @@ const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
});
|
||||
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, downBlobFile, tableStyle } = useTable(state);
|
||||
const {getDataList, currentChangeHandle, sizeChangeHandle, downBlobFile, tableStyle} = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
@ -119,7 +128,7 @@ const exportExcel = () => {
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: { id: string }[]) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
selectObjs.value = objs.map(({id}) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
@ -139,4 +148,17 @@ const handleDelete = async (ids: string[]) => {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
const onlineUpdate = async () => {
|
||||
try {
|
||||
updateDisabled.value = true;
|
||||
const {data} = await online();
|
||||
getDataList();
|
||||
useMessage().success(data);
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
updateDisabled.value = false;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user