添加表格模板页面.

This commit is contained in:
lijiahang
2023-08-11 14:11:41 +08:00
parent 4d32bbc10f
commit 9eb47370a6
8 changed files with 206 additions and 18 deletions

View File

@@ -13,6 +13,7 @@ import com.orion.lang.utils.ext.yml.YmlExt;
import com.orion.ops.framework.mybatis.core.domain.BaseDO;
import com.orion.ops.framework.mybatis.core.mapper.IMapper;
import com.orion.ops.module.infra.enums.RoleStatusEnum;
import com.orion.ops.module.infra.enums.TestTableStatusEnum;
import com.orion.ops.module.infra.enums.UserStatusEnum;
import org.apache.ibatis.annotations.Mapper;
@@ -40,13 +41,16 @@ public class CodeGenerator {
String module = "infra";
// 生成的表
GenTable[] tables = {
new GenTable("system_user", "用户", "user")
.vue("user", "user")
.enums(UserStatusEnum.class),
new GenTable("system_role", "角色", "role")
.vue("user", "role")
.enums(RoleStatusEnum.class),
new GenTable("system_menu", "菜单", "menu"),
new GenTable("test_table", "", "test")
.vue("test", "table")
.enums(TestTableStatusEnum.class),
// new GenTable("system_user", "用户", "user")
// .vue("user", "user")
// .enums(UserStatusEnum.class),
// new GenTable("system_role", "角色", "role")
// .vue("user", "role")
// .enums(RoleStatusEnum.class),
// new GenTable("system_menu", "菜单", "menu"),
};
// jdbc 配置 - 使用配置文件
File yamlFile = new File("orion-ops-launch/src/main/resources/application-dev.yaml");
@@ -129,7 +133,6 @@ public class CodeGenerator {
private static GlobalConfig getGlobalConfig(String outputDir, String author) {
// 全局配置
GlobalConfig gbConfig = new GlobalConfig.Builder()
.disableOpenDir()
// 设置作者
.author(author)
// 生成路径

View File

@@ -256,6 +256,8 @@ public class VelocityTemplateEngine extends AbstractTemplateEngine {
String outPath = getConfigBuilder().getGlobalConfig().getOutputDir();
GenTable table = tables.get(tableInfo.getName());
BeanMap beanMap = BeanMap.create(table, "enums");
// 模块名称首字母大写
beanMap.put("moduleFirstUpper", Strings.firstUpper(table.getModule()));
// 功能名称首字母大写
beanMap.put("featureFirstUpper", Strings.firstUpper(table.getFeature()));
// 功能名称全大写

View File

@@ -8,7 +8,7 @@ const $vue.featureAllUpper: AppRouteRecordRaw = {
children: [
{
name: '$vue.module$vue.featureFirstUpper',
path: '/$vue.module/$vue.featureFirstUpper',
path: '/$vue.module/$vue.feature',
component: () => import('@/views/$vue.module/$vue.feature/index.vue'),
},
],

View File

@@ -1 +1,141 @@
form
<template>
<a-modal v-model:visible="visible"
body-class="modal-form"
title-align="start"
:title="title"
:top="120"
:align-center="false"
:draggable="true"
:mask-closable="false"
:unmount-on-close="true"
:ok-button-props="{ disabled: loading }"
:cancel-button-props="{ disabled: loading }"
:on-before-ok="handlerOk"
@close="handleClose">
<a-spin :loading="loading">
<a-form :model="formModel"
ref="formRef"
label-align="right"
:style="{ width: '460px' }"
:label-col-props="{ span: 6 }"
:wrapper-col-props="{ span: 18 }"
:rules="formRules">
#foreach($field in ${table.fields})
#if("$field.propertyName" != "id")
<!-- $field.comment -->
<a-form-item field="${field.propertyName}" label="${field.comment}">
#if("$field.propertyType" == "Integer" || "$field.propertyType" == "Long")
<a-input-number v-model="formModel.${field.propertyName}" placeholder="请输入${field.comment}" />
#elseif("$field.propertyType" == "Date")
<a-date-picker v-model="formModel.${field.propertyName}" placeholder="请选择${field.comment}" show-time />
#else
<a-input v-model="formModel.${field.propertyName}" placeholder="请输入${field.comment}" />
#end
</a-form-item>
#end
#end
</a-form>
</a-spin>
</a-modal>
</template>
<script lang="ts">
export default {
name: '${vue.module}-${vue.feature}-form-modal'
};
</script>
<script lang="ts" setup>
import { reactive, ref } from 'vue';
import useLoading from '@/hooks/loading';
import useVisible from '@/hooks/visible';
import formRules from '../types/form.rules';
import { create${vue.featureFirstUpper}, update${vue.featureFirstUpper} } from '@/api/${vue.module}/${vue.feature}';
const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading();
const title = ref<string>();
const isAddHandle = ref<boolean>(true);
const defaultForm = () => {
return {
#foreach($field in ${table.fields})
${field.propertyName}: underfined,
#end
};
};
const formRef = ref<any>();
const formModel = reactive<Record<string, any>>(defaultForm());
const emits = defineEmits(['added', 'updated']);
// 打开新增
const openAdd = () => {
title.value = '添加${table.comment}';
isAddHandle.value = true;
renderForm({ ...defaultForm() });
setVisible(true);
};
// 打开修改
const openUpdate = (record: any) => {
title.value = '修改${table.comment}';
isAddHandle.value = false;
renderForm({ ...defaultForm(), ...record });
setVisible(true);
};
// 渲染表单
const renderForm = (record: any) => {
Object.keys(formModel).forEach(k => {
formModel[k] = record[k];
});
};
defineExpose({ openAdd, openUpdate });
// 确定
const handlerOk = async () => {
setLoading(true);
try {
// 验证参数
const error = await formRef.value.validate();
if (error) {
return false;
}
if (isAddHandle.value) {
// 新增
await create${vue.featureFirstUpper}(formModel as any);
emits('added');
} else {
// 修改
await update${vue.featureFirstUpper}(formModel as any);
emits('updated');
}
// 清空
handlerClear();
} catch (e) {
return false;
} finally {
setLoading(false);
}
};
// 关闭
const handleClose = () => {
handlerClear();
};
// 清空
const handlerClear = () => {
setLoading(false);
setVisible(false);
};
</script>
<style lang="less" scoped>
</style>

View File

@@ -1 +1,32 @@
index
<template>
<div class="layout-container">
<!-- 表格 -->
<${vue.feature}-table ref="table"
@openAdd="() => modal.openAdd()"
@openUpdate="(e) => modal.openUpdate(e)" />
<!-- 添加修改框 -->
<${vue.feature}-form-modal ref="modal"
@added="() => table.addedCallback()"
@updated="() => table.updatedCallback()" />
</div>
</template>
<script lang="ts">
export default {
name: '${vue.module}${vue.featureAllUpper}'
};
</script>
<script lang="ts" setup>
import ${vue.featureFirstUpper}Table from './components/${vue.feature}-table.vue';
import ${vue.featureFirstUpper}Modal from './components/${vue.feature}-form-modal.vue';
import { ref } from 'vue';
const table = ref();
const modal = ref();
</script>
<style lang="less" scoped>
</style>

View File

@@ -11,7 +11,7 @@ export const $enumEntity.key = {
#foreach($enumEntityItemFields in $enumEntityItem.value.entrySet())
$enumEntityItemFields.key: '$enumEntityItemFields.value',
#end
}
},
#end
}

View File

@@ -1,6 +1,6 @@
import { FieldRule } from '@arco-design/web-vue';
#foreach($field in ${table.fields})
#if("$!field.propertyName" != "id")
#if(${field.propertyType} == 'String')
export const ${field.propertyName} = [{
required: true,
@@ -15,10 +15,13 @@ export const ${field.propertyName} = [{
message: '请输入${field.comment}'
}] as FieldRule[];
#end
#end
#end
export default {
#foreach($field in ${table.fields})
#if("$!field.propertyName" != "id")
${field.propertyName},
#end
#end
} as Record<string, FieldRule | FieldRule[]>;

View File

@@ -1,4 +1,5 @@
import { TableColumnData } from '@arco-design/web-vue/es/table/interface';
import { formatMilliSecond, YMD_HMS } from '@/utils';
const columns = [
{
@@ -6,8 +7,9 @@ const columns = [
dataIndex: 'id',
slotName: 'id',
width: 70,
align: 'left',
fixed: 'left',
}, #foreach($field in ${table.fields}){
}, #foreach($field in ${table.fields})#if("$!field.propertyName" != "id"){
title: '${field.comment}',
dataIndex: '${field.propertyName}',
slotName: '${field.propertyName}',
@@ -17,14 +19,20 @@ const columns = [
ellipsis: true,
tooltip: true,
#end
}, #end{
}, #end#end{
title: '创建时间',
dataIndex: 'createTime',
slotName: 'createTime',
render: ({ record }) => {
return formatMilliSecond(record.createTime, YMD_HMS);
},
}, {
title: '修改时间',
dataIndex: 'updateTime',
slotName: 'updateTime',
render: ({ record }) => {
return formatMilliSecond(record.createTime, YMD_HMS);
},
}, {
title: '创建人',
dataIndex: 'creator',
@@ -35,10 +43,11 @@ const columns = [
slotName: 'updater',
}, {
title: '操作',
slotName: 'option',
width: 158,
slotName: 'handle',
width: 130,
align: 'center',
fixed: 'right',
}
},
] as TableColumnData[];
export default columns;