feat: vben5 codegen
This commit is contained in:
xingyu4j
@@ -1,12 +1,15 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils';
|
||||
#if($table.templateType == 2)## 树表需要导入这些
|
||||
import { get${simpleClassName}List } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import { handleTree } from '@vben/utils'
|
||||
@@ -20,7 +23,6 @@ import { handleTree } from '@vben/utils'
|
||||
#end
|
||||
#end
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
@@ -70,7 +72,7 @@ const getTitle = computed(() => {
|
||||
#end
|
||||
|
||||
/** 重置表单 */
|
||||
const resetForm = () => {
|
||||
function resetForm() {
|
||||
formData.value = {
|
||||
#foreach ($column in $columns)
|
||||
#if ($column.createOperation || $column.updateOperation)
|
||||
@@ -88,7 +90,7 @@ const resetForm = () => {
|
||||
## 特殊：树表专属逻辑
|
||||
#if ( $table.templateType == 2 )
|
||||
/** 获得${table.classComment}树 */
|
||||
const get${simpleClassName}Tree = async () => {
|
||||
async function get${simpleClassName}Tree() {
|
||||
${classNameVar}Tree.value = []
|
||||
const data = await get${simpleClassName}List({});
|
||||
data.unshift({
|
||||
@@ -147,7 +149,6 @@ const [Modal, modalApi] = useVbenModal({
|
||||
emit('success');
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.operationSuccess'),
|
||||
key: 'action_process_msg',
|
||||
});
|
||||
} finally {
|
||||
modalApi.unlock();
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
|
||||
import { ref, h, reactive, onMounted, nextTick } from 'vue';
|
||||
|
||||
import { Page, useVbenModal } from '@vben/common-ui';
|
||||
import { cloneDeep, formatDateTime } from '@vben/utils';
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table';
|
||||
import { cloneDeep, downloadFileFromBlobPart, formatDateTime } from '@vben/utils';
|
||||
import { Button, message,Tabs,Pagination,Form,RangePicker,DatePicker,Select,Input } from 'ant-design-vue';
|
||||
import { DictTag } from '#/components/dict-tag';
|
||||
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
|
||||
import ${simpleClassName}Form from './modules/form.vue';
|
||||
import { Download, Plus, RefreshCw, Search, Trash2 } from '@vben/icons';
|
||||
import { ContentWrap } from '#/components/content-wrap';
|
||||
import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
|
||||
import { TableToolbar } from '#/components/table-toolbar';
|
||||
import { useTableToolbar } from '#/hooks';
|
||||
|
||||
## 特殊：主子表专属逻辑
|
||||
#if ( $table.templateType == 11 || $table.templateType == 12 )
|
||||
@@ -23,7 +23,6 @@ import { useTableToolbar } from '#/hooks';
|
||||
#end
|
||||
#end
|
||||
|
||||
import { ref, h, reactive,onMounted,nextTick } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
#if (${table.templateType} == 2)## 树表接口
|
||||
import { handleTree,isEmpty } from '@vben/utils'
|
||||
@@ -77,7 +76,7 @@ const queryFormRef = ref() // 搜索的表单
|
||||
const exportLoading = ref(false) // 导出的加载中
|
||||
|
||||
/** 查询列表 */
|
||||
const getList = async () => {
|
||||
async function getList() {
|
||||
loading.value = true
|
||||
try {
|
||||
const params = cloneDeep(queryParams) as any;
|
||||
@@ -104,7 +103,7 @@ const getList = async () => {
|
||||
}
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
function handleQuery() {
|
||||
#if ( $table.templateType != 2 )
|
||||
queryParams.pageNo = 1
|
||||
#end
|
||||
@@ -112,7 +111,7 @@ const handleQuery = () => {
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
function resetQuery() {
|
||||
queryFormRef.value.resetFields()
|
||||
handleQuery()
|
||||
}
|
||||
@@ -182,7 +181,7 @@ function handleRowCheckboxChange({
|
||||
#end
|
||||
|
||||
/** 导出表格 */
|
||||
async function onExport() {
|
||||
async function handleExport() {
|
||||
try {
|
||||
exportLoading.value = true;
|
||||
const data = await export${simpleClassName}(queryParams);
|
||||
@@ -298,7 +297,7 @@ onMounted(() => {
|
||||
<!-- 列表 -->
|
||||
<ContentWrap title="${table.classComment}">
|
||||
<template #extra>
|
||||
<TableToolbar
|
||||
<VbenVxeTableToolbar
|
||||
ref="tableToolbarRef"
|
||||
v-model:hidden-search="hiddenSearchBar"
|
||||
>
|
||||
@@ -321,7 +320,7 @@ onMounted(() => {
|
||||
type="primary"
|
||||
class="ml-2"
|
||||
:loading="exportLoading"
|
||||
@click="onExport"
|
||||
@click="handleExport"
|
||||
v-access:code="['${permissionPrefix}:export']"
|
||||
>
|
||||
{{ $t('ui.actionTitle.export') }}
|
||||
|
||||
@@ -3,29 +3,97 @@
|
||||
#set ($subJoinColumn = $subJoinColumns.get($subIndex))##当前 join 字段
|
||||
#set ($subSimpleClassName = $subSimpleClassNames.get($subIndex))
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils';
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
import { cloneDeep, formatDateTime } from '@vben/utils';
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
|
||||
|
||||
import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
const getTitle = computed(() => {
|
||||
return formData.value?.id
|
||||
? $t('ui.actionTitle.edit', ['${subTable.classComment}'])
|
||||
: $t('ui.actionTitle.create', ['${subTable.classComment}']);
|
||||
});
|
||||
import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
const formRef = ref();
|
||||
const formData = ref<Partial<${simpleClassName}Api.${subSimpleClassName}>>({
|
||||
const emit = defineEmits(['success']);
|
||||
const getTitle = computed(() => {
|
||||
return formData.value?.id
|
||||
? $t('ui.actionTitle.edit', ['${subTable.classComment}'])
|
||||
: $t('ui.actionTitle.create', ['${subTable.classComment}']);
|
||||
});
|
||||
|
||||
const formRef = ref();
|
||||
const formData = ref<Partial<${simpleClassName}Api.${subSimpleClassName}>>({
|
||||
#foreach ($column in $subColumns)
|
||||
#if ($column.createOperation || $column.updateOperation)
|
||||
#if ($column.htmlType == "checkbox")
|
||||
$column.javaField: [],
|
||||
#else
|
||||
$column.javaField: undefined,
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
});
|
||||
const rules: Record<string, Rule[]> = {
|
||||
#foreach ($column in $subColumns)
|
||||
#if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
|
||||
#set($comment=$column.columnComment)
|
||||
$column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
|
||||
#end
|
||||
#end
|
||||
};
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
async onConfirm() {
|
||||
await formRef.value?.validate();
|
||||
|
||||
modalApi.lock();
|
||||
// 提交表单
|
||||
const data = formData.value as ${simpleClassName}Api.${subSimpleClassName};
|
||||
try {
|
||||
await (formData.value?.id ? update${subSimpleClassName}(data) : create${subSimpleClassName}(data));
|
||||
// 关闭并提示
|
||||
await modalApi.close();
|
||||
emit('success');
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.operationSuccess'),
|
||||
});
|
||||
} finally {
|
||||
modalApi.unlock();
|
||||
}
|
||||
},
|
||||
async onOpenChange(isOpen: boolean) {
|
||||
if (!isOpen) {
|
||||
resetForm()
|
||||
return;
|
||||
}
|
||||
|
||||
// 加载数据
|
||||
let data = modalApi.getData<${simpleClassName}Api.${subSimpleClassName}>();
|
||||
if (!data) {
|
||||
return;
|
||||
}
|
||||
if (data.id) {
|
||||
modalApi.lock();
|
||||
try {
|
||||
data = await get${subSimpleClassName}(data.id);
|
||||
} finally {
|
||||
modalApi.unlock();
|
||||
}
|
||||
}
|
||||
// 设置到 values
|
||||
formData.value = data;
|
||||
},
|
||||
});
|
||||
|
||||
/** 重置表单 */
|
||||
function resetForm(){
|
||||
formData.value = {
|
||||
#foreach ($column in $subColumns)
|
||||
#if ($column.createOperation || $column.updateOperation)
|
||||
#if ($column.htmlType == "checkbox")
|
||||
@@ -35,75 +103,9 @@
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
});
|
||||
const rules: Record<string, Rule[]> = {
|
||||
#foreach ($column in $subColumns)
|
||||
#if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
|
||||
#set($comment=$column.columnComment)
|
||||
$column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
|
||||
#end
|
||||
#end
|
||||
};
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
async onConfirm() {
|
||||
await formRef.value?.validate();
|
||||
|
||||
modalApi.lock();
|
||||
// 提交表单
|
||||
const data = formData.value as ${simpleClassName}Api.${subSimpleClassName};
|
||||
try {
|
||||
await (formData.value?.id ? update${subSimpleClassName}(data) : create${subSimpleClassName}(data));
|
||||
// 关闭并提示
|
||||
await modalApi.close();
|
||||
emit('success');
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.operationSuccess'),
|
||||
key: 'action_process_msg',
|
||||
});
|
||||
} finally {
|
||||
modalApi.unlock();
|
||||
}
|
||||
},
|
||||
async onOpenChange(isOpen: boolean) {
|
||||
if (!isOpen) {
|
||||
resetForm()
|
||||
return;
|
||||
}
|
||||
|
||||
// 加载数据
|
||||
let data = modalApi.getData<${simpleClassName}Api.${subSimpleClassName}>();
|
||||
if (!data) {
|
||||
return;
|
||||
}
|
||||
if (data.id) {
|
||||
modalApi.lock();
|
||||
try {
|
||||
data = await get${subSimpleClassName}(data.id);
|
||||
} finally {
|
||||
modalApi.unlock();
|
||||
}
|
||||
}
|
||||
// 设置到 values
|
||||
formData.value = data;
|
||||
},
|
||||
});
|
||||
|
||||
/** 重置表单 */
|
||||
const resetForm = () => {
|
||||
formData.value = {
|
||||
#foreach ($column in $subColumns)
|
||||
#if ($column.createOperation || $column.updateOperation)
|
||||
#if ($column.htmlType == "checkbox")
|
||||
$column.javaField: [],
|
||||
#else
|
||||
$column.javaField: undefined,
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
};
|
||||
formRef.value?.resetFields();
|
||||
}
|
||||
formRef.value?.resetFields();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -5,12 +5,15 @@
|
||||
#set ($subClassNameVar = $subClassNameVars.get($subIndex))
|
||||
#set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
import { message, Tabs, Form, Input, Textarea,Button, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue';
|
||||
import { computed, ref, h, onMounted,watch,nextTick } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils';
|
||||
import { computed, ref, h, onMounted,watch,nextTick } from 'vue';
|
||||
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
|
||||
import { message, Tabs, Form, Input, Textarea,Button, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
@@ -30,13 +33,14 @@ const props = defineProps<{
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
const list = ref<${simpleClassName}Api.${subSimpleClassName}[]>([]) // 列表的数据
|
||||
const tableRef = ref<VxeTableInstance>();
|
||||
|
||||
/** 添加${subTable.classComment} */
|
||||
const onAdd = async () => {
|
||||
async function handleAdd() {
|
||||
await tableRef.value?.insertAt({} as ${simpleClassName}Api.${subSimpleClassName}, -1);
|
||||
}
|
||||
|
||||
/** 删除${subTable.classComment} */
|
||||
const onDelete = async (row: ${simpleClassName}Api.${subSimpleClassName}) => {
|
||||
async function handleDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
|
||||
await tableRef.value?.remove(row);
|
||||
}
|
||||
|
||||
@@ -46,9 +50,11 @@ defineExpose({
|
||||
const data = list.value as ${simpleClassName}Api.${subSimpleClassName}[];
|
||||
const removeRecords = tableRef.value?.getRemoveRecords() as ${simpleClassName}Api.${subSimpleClassName}[];
|
||||
const insertRecords = tableRef.value?.getInsertRecords() as ${simpleClassName}Api.${subSimpleClassName}[];
|
||||
return data
|
||||
.filter((row) => !removeRecords.some((removed) => removed.id === row.id))
|
||||
?.concat(insertRecords.map((row: any) => ({ ...row, id: undefined })));
|
||||
return [
|
||||
...data.filter(
|
||||
(row) => !removeRecords.some((removed) => removed.id === row.id),
|
||||
),
|
||||
...insertRecords.map((row: any) => ({ ...row, id: undefined })),
|
||||
},
|
||||
});
|
||||
|
||||
@@ -123,25 +129,25 @@ watch(
|
||||
#if ( $column.id == $subJoinColumn.id) ## 特殊：忽略主子表的 join 字段，不用填写
|
||||
#elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<Input v-model:value="row.${javaField}" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "imageUpload")## 图片上传
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<ImageUpload v-model:value="row.${javaField}" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "fileUpload")## 文件上传
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<FileUpload v-model:value="row.${javaField}" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "select")## 下拉框
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<Select v-model:value="row.${javaField}" placeholder="请选择${comment}">
|
||||
#if ("" != $dictType)## 有数据字典
|
||||
<Select.Option
|
||||
@@ -159,7 +165,7 @@ watch(
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "checkbox")## 多选框
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<CheckboxGroup v-model:value="row.${javaField}">
|
||||
#if ("" != $dictType)## 有数据字典
|
||||
<Checkbox
|
||||
@@ -177,7 +183,7 @@ watch(
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "radio")## 单选框
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<RadioGroup v-model:value="row.${javaField}">
|
||||
#if ("" != $dictType)## 有数据字典
|
||||
<Radio
|
||||
@@ -195,7 +201,7 @@ watch(
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "datetime")## 时间框
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<DatePicker
|
||||
v-model:value="row.${javaField}"
|
||||
:showTime="true"
|
||||
@@ -206,7 +212,7 @@ watch(
|
||||
</vxe-column>
|
||||
#elseif($column.htmlType == "textarea" || $column.htmlType == "editor")## 文本框
|
||||
<vxe-column field="${javaField}" title="${comment}" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<Textarea v-model:value="row.${javaField}" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
@@ -214,12 +220,12 @@ watch(
|
||||
#end
|
||||
#end
|
||||
<vxe-column field="operation" title="操作" align="center">
|
||||
<template #default="{row}">
|
||||
<template #default="{ row }">
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
danger
|
||||
@click="onDelete(row as any)"
|
||||
@click="handleDelect(row)"
|
||||
v-access:code="['${permissionPrefix}:delete']"
|
||||
>
|
||||
{{ $t('ui.actionTitle.delete') }}
|
||||
@@ -228,7 +234,7 @@ watch(
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<div class="flex justify-center mt-4">
|
||||
<Button :icon="h(Plus)" type="primary" ghost @click="onAdd" v-access:code="['${permissionPrefix}:create']">
|
||||
<Button :icon="h(Plus)" type="primary" ghost @click="handleAdd" v-access:code="['${permissionPrefix}:create']">
|
||||
{{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
@@ -6,48 +6,50 @@
|
||||
#set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($subIndex))
|
||||
#set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
|
||||
import { DictTag } from '#/components/dict-tag';
|
||||
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
|
||||
import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
|
||||
import { reactive,ref, h, nextTick,watch,onMounted } from 'vue';
|
||||
import { cloneDeep, formatDateTime } from '@vben/utils';
|
||||
import { ContentWrap } from '#/components/content-wrap';
|
||||
import { reactive,ref, h, nextTick,watch,onMounted } from 'vue';
|
||||
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
|
||||
import { DictTag } from '#/components/dict-tag';
|
||||
import { getRangePickerDefaultProps } from '#/utils';
|
||||
import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
|
||||
import { ContentWrap } from '#/components/content-wrap';
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { message,Button, Tabs,Pagination, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox,RangePicker, DatePicker, TreeSelect } from 'ant-design-vue';
|
||||
import { Plus, Trash2 } from '@vben/icons';
|
||||
import { $t } from '#/locales';
|
||||
import { TableToolbar } from '#/components/table-toolbar';
|
||||
import { useTableToolbar } from '#/hooks';
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table';
|
||||
import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { message,Button, Tabs,Pagination, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox,RangePicker, DatePicker, TreeSelect } from 'ant-design-vue';
|
||||
import { Plus, Trash2 } from '@vben/icons';
|
||||
import { $t } from '#/locales';
|
||||
#end
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import { isEmpty } from '@vben/utils';
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
#else
|
||||
import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
#end
|
||||
import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import { isEmpty } from '@vben/utils';
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
#else
|
||||
import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
#end
|
||||
#end
|
||||
|
||||
const props = defineProps<{
|
||||
${subJoinColumn.javaField}?: number // ${subJoinColumn.columnComment}（主表的关联字段）
|
||||
${subJoinColumn.javaField}?: number // ${subJoinColumn.columnComment}（主表的关联字段）
|
||||
}>()
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const [FormModal, formModalApi] = useVbenModal({
|
||||
connectedComponent: ${subSimpleClassName}Form,
|
||||
destroyOnClose: true,
|
||||
});
|
||||
const [FormModal, formModalApi] = useVbenModal({
|
||||
connectedComponent: ${subSimpleClassName}Form,
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
/** 创建${subTable.classComment} */
|
||||
function handleCreate() {
|
||||
@@ -106,87 +108,87 @@ function handleRowCheckboxChange({
|
||||
#end
|
||||
#end
|
||||
|
||||
const loading = ref(true) // 列表的加载中
|
||||
const list = ref<${simpleClassName}Api.${subSimpleClassName}[]>([]) // 列表的数据
|
||||
const loading = ref(true) // 列表的加载中
|
||||
const list = ref<${simpleClassName}Api.${subSimpleClassName}[]>([]) // 列表的数据
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const total = ref(0) // 列表的总页数
|
||||
const total = ref(0) // 列表的总页数
|
||||
#end
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const queryFormRef = ref() // 搜索的表单
|
||||
const queryParams = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
#foreach ($column in $subColumns)
|
||||
#if ($column.listOperation)
|
||||
#if ($column.listOperationCondition != 'BETWEEN')
|
||||
$column.javaField: undefined,
|
||||
#end
|
||||
#if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
|
||||
$column.javaField: undefined,
|
||||
#end
|
||||
#end
|
||||
const queryFormRef = ref() // 搜索的表单
|
||||
const queryParams = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
#foreach ($column in $subColumns)
|
||||
#if ($column.listOperation)
|
||||
#if ($column.listOperationCondition != 'BETWEEN')
|
||||
$column.javaField: undefined,
|
||||
#end
|
||||
})
|
||||
#if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
|
||||
$column.javaField: undefined,
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
})
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
function handleQuery() {
|
||||
queryParams.pageNo = 1
|
||||
getList()
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
function resetQuery() {
|
||||
queryFormRef.value.resetFields()
|
||||
handleQuery()
|
||||
}
|
||||
#end
|
||||
/** 查询列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
if (!props.${subJoinColumn.javaField}){
|
||||
return []
|
||||
}
|
||||
## 特殊：树表专属逻辑（树不需要分页接口）
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const params = cloneDeep(queryParams) as any;
|
||||
#foreach ($column in $columns)
|
||||
#if ($column.listOperation)
|
||||
#if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
|
||||
if (params.${column.javaField} && Array.isArray(params.${column.javaField})) {
|
||||
params.${column.javaField} = (params.${column.javaField} as string[]).join(',');
|
||||
}
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
params.${subJoinColumn.javaField} = props.${subJoinColumn.javaField};
|
||||
const data = await get${subSimpleClassName}Page(params)
|
||||
list.value = data.list
|
||||
total.value = data.total
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
list.value = await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!);
|
||||
#else
|
||||
list.value = [await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)];
|
||||
#end
|
||||
#end
|
||||
} finally {
|
||||
loading.value = false
|
||||
async function getList() {
|
||||
loading.value = true
|
||||
try {
|
||||
if (!props.${subJoinColumn.javaField}){
|
||||
return []
|
||||
}
|
||||
## 特殊：树表专属逻辑（树不需要分页接口）
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const params = cloneDeep(queryParams) as any;
|
||||
#foreach ($column in $columns)
|
||||
#if ($column.listOperation)
|
||||
#if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
|
||||
if (params.${column.javaField} && Array.isArray(params.${column.javaField})) {
|
||||
params.${column.javaField} = (params.${column.javaField} as string[]).join(',');
|
||||
}
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
params.${subJoinColumn.javaField} = props.${subJoinColumn.javaField};
|
||||
const data = await get${subSimpleClassName}Page(params)
|
||||
list.value = data.list
|
||||
total.value = data.total
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
list.value = await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!);
|
||||
#else
|
||||
list.value = [await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)];
|
||||
#end
|
||||
#end
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.${subJoinColumn.javaField},
|
||||
async (val) => {
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
await nextTick();
|
||||
await getList()
|
||||
},
|
||||
{ immediate: true },
|
||||
);
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.${subJoinColumn.javaField},
|
||||
async (val) => {
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
await nextTick();
|
||||
await getList()
|
||||
},
|
||||
{ immediate: true },
|
||||
);
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
/** 初始化 */
|
||||
@@ -287,7 +289,7 @@ onMounted(() => {
|
||||
<!-- 列表 -->
|
||||
<ContentWrap title="${table.classComment}">
|
||||
<template #extra>
|
||||
<TableToolbar
|
||||
<VbenVxeTableToolbar
|
||||
ref="tableToolbarRef"
|
||||
v-model:hidden-search="hiddenSearchBar"
|
||||
>
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
import type { ${apiName} } from '#/api/${table.moduleName}/${table.businessName}';
|
||||
|
||||
import { computed, ref, h, onMounted,watch,nextTick } from 'vue';
|
||||
|
||||
import { $t } from '#/locales';
|
||||
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
|
||||
@@ -3,10 +3,11 @@ import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleCl
|
||||
import type { FormRules } from 'element-plus';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker, ElTreeSelect } from 'element-plus';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils';
|
||||
#if($table.templateType == 2)## 树表需要导入这些
|
||||
import { get${simpleClassName}List } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import { handleTree } from '@vben/utils'
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
|
||||
import { ref, h, reactive, onMounted, nextTick } from 'vue';
|
||||
|
||||
import { Page, useVbenModal } from '@vben/common-ui';
|
||||
import { cloneDeep, formatDateTime } from '@vben/utils';
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table';
|
||||
import { cloneDeep, downloadFileFromBlobPart, formatDateTime } from '@vben/utils';
|
||||
import { ElButton, ElMessage, ElLoading, ElTabs, ElTabPane, ElPagination, ElForm, ElFormItem, ElDatePicker, ElSelect, ElOption, ElInput } from 'element-plus';
|
||||
import { DictTag } from '#/components/dict-tag';
|
||||
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
|
||||
import ${simpleClassName}Form from './modules/form.vue';
|
||||
import { Download, Plus, RefreshCw, Search, Trash2 } from '@vben/icons';
|
||||
import { ContentWrap } from '#/components/content-wrap';
|
||||
import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
|
||||
import { TableToolbar } from '#/components/table-toolbar';
|
||||
import { useTableToolbar } from '#/hooks';
|
||||
|
||||
## 特殊：主子表专属逻辑
|
||||
#if ( $table.templateType == 11 || $table.templateType == 12 )
|
||||
@@ -23,7 +23,6 @@ import { useTableToolbar } from '#/hooks';
|
||||
#end
|
||||
#end
|
||||
|
||||
import { ref, h, reactive,onMounted,nextTick } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
#if (${table.templateType} == 2)## 树表接口
|
||||
import { handleTree,isEmpty } from '@vben/utils'
|
||||
@@ -104,7 +103,7 @@ const getList = async () => {
|
||||
}
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
function handleQuery() {
|
||||
#if ( $table.templateType != 2 )
|
||||
queryParams.pageNo = 1
|
||||
#end
|
||||
@@ -112,7 +111,7 @@ const handleQuery = () => {
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
function resetQuery() {
|
||||
queryFormRef.value.resetFields()
|
||||
handleQuery()
|
||||
}
|
||||
@@ -182,7 +181,7 @@ function handleRowCheckboxChange({
|
||||
#end
|
||||
|
||||
/** 导出表格 */
|
||||
async function onExport() {
|
||||
async function handleExport() {
|
||||
try {
|
||||
exportLoading.value = true;
|
||||
const data = await export${simpleClassName}(queryParams);
|
||||
@@ -324,7 +323,7 @@ onMounted(() => {
|
||||
type="primary"
|
||||
class="ml-2"
|
||||
:loading="exportLoading"
|
||||
@click="onExport"
|
||||
@click="handleExport"
|
||||
v-access:code="['${permissionPrefix}:export']"
|
||||
>
|
||||
{{ $t('ui.actionTitle.export') }}
|
||||
|
||||
@@ -6,13 +6,15 @@
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { FormRules } from 'element-plus';
|
||||
|
||||
import { computed, ref, reactive } from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker, ElTreeSelect } from 'element-plus';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils';
|
||||
|
||||
import { computed, ref, reactive } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
@@ -5,12 +5,15 @@
|
||||
#set ($subClassNameVar = $subClassNameVars.get($subIndex))
|
||||
#set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
|
||||
<script lang="ts" setup>
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
|
||||
import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElButton, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker } from 'element-plus';
|
||||
import { computed, ref, reactive, h, onMounted,watch,nextTick } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils';
|
||||
import { computed, ref, reactive, h, onMounted,watch,nextTick } from 'vue';
|
||||
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
|
||||
import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElButton, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker } from 'element-plus';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
@@ -31,12 +34,12 @@ const props = defineProps<{
|
||||
const list = ref<${simpleClassName}Api.${subSimpleClassName}[]>([]) // 列表的数据
|
||||
const tableRef = ref<VxeTableInstance>();
|
||||
/** 添加${subTable.classComment} */
|
||||
const onAdd = async () => {
|
||||
async function handleAdd() {
|
||||
await tableRef.value?.insertAt({} as ${simpleClassName}Api.${subSimpleClassName}, -1);
|
||||
}
|
||||
|
||||
/** 删除${subTable.classComment} */
|
||||
const onDelete = async (row: ${simpleClassName}Api.${subSimpleClassName}) => {
|
||||
async function onDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
|
||||
await tableRef.value?.remove(row);
|
||||
}
|
||||
|
||||
@@ -46,9 +49,11 @@ defineExpose({
|
||||
const data = list.value as ${simpleClassName}Api.${subSimpleClassName}[];
|
||||
const removeRecords = tableRef.value?.getRemoveRecords() as ${simpleClassName}Api.${subSimpleClassName}[];
|
||||
const insertRecords = tableRef.value?.getInsertRecords() as ${simpleClassName}Api.${subSimpleClassName}[];
|
||||
return data
|
||||
.filter((row) => !removeRecords.some((removed) => removed.id === row.id))
|
||||
?.concat(insertRecords.map((row: any) => ({ ...row, id: undefined })));
|
||||
return [
|
||||
...data.filter(
|
||||
(row) => !removeRecords.some((removed) => removed.id === row.id),
|
||||
),
|
||||
...insertRecords.map((row: any) => ({ ...row, id: undefined })),
|
||||
},
|
||||
});
|
||||
|
||||
@@ -227,7 +232,7 @@ watch(
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<div class="flex justify-center mt-4">
|
||||
<el-button :icon="h(Plus)" type="primary" plain @click="onAdd" v-access:code="['${permissionPrefix}:create']">
|
||||
<el-button :icon="h(Plus)" type="primary" plain @click="handleAdd" v-access:code="['${permissionPrefix}:create']">
|
||||
{{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
@@ -9,23 +9,25 @@
|
||||
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
||||
import type { VxeTableInstance } from '#/adapter/vxe-table';
|
||||
|
||||
import { DictTag } from '#/components/dict-tag';
|
||||
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
|
||||
import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
|
||||
import { reactive,ref, h, nextTick,watch,onMounted } from 'vue';
|
||||
import { cloneDeep, formatDateTime } from '@vben/utils';
|
||||
|
||||
import { DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
|
||||
import { DictTag } from '#/components/dict-tag';
|
||||
import { getRangePickerDefaultProps } from '#/utils';
|
||||
import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
|
||||
import { ContentWrap } from '#/components/content-wrap';
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table';
|
||||
import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
|
||||
import { Tinymce as RichTextarea } from '#/components/tinymce';
|
||||
import { ImageUpload, FileUpload } from "#/components/upload";
|
||||
import { ElMessage, ElLoading, ElButton, ElTabs, ElTabPane, ElPagination, ElForm, ElFormItem, ElDatePicker, ElSelect, ElOption, ElInput } from 'element-plus';
|
||||
import { Plus, Trash2 } from '@vben/icons';
|
||||
import { $t } from '#/locales';
|
||||
import { TableToolbar } from '#/components/table-toolbar';
|
||||
import { useTableToolbar } from '#/hooks';
|
||||
#end
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
@@ -129,64 +131,64 @@ function handleRowCheckboxChange({
|
||||
})
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
function handleQuery() {
|
||||
queryParams.pageNo = 1
|
||||
getList()
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
function resetQuery() {
|
||||
queryFormRef.value.resetFields()
|
||||
handleQuery()
|
||||
}
|
||||
#end
|
||||
/** 查询列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
if (!props.${subJoinColumn.javaField}){
|
||||
return []
|
||||
}
|
||||
## 特殊：树表专属逻辑（树不需要分页接口）
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const params = cloneDeep(queryParams) as any;
|
||||
#foreach ($column in $columns)
|
||||
#if ($column.listOperation)
|
||||
#if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
|
||||
if (params.${column.javaField} && Array.isArray(params.${column.javaField})) {
|
||||
params.${column.javaField} = (params.${column.javaField} as string[]).join(',');
|
||||
}
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
params.${subJoinColumn.javaField} = props.${subJoinColumn.javaField};
|
||||
const data = await get${subSimpleClassName}Page(params)
|
||||
list.value = data.list
|
||||
total.value = data.total
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
list.value = await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!);
|
||||
#else
|
||||
list.value = [await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)];
|
||||
#end
|
||||
#end
|
||||
} finally {
|
||||
loading.value = false
|
||||
/** 查询列表 */
|
||||
async function getList() {
|
||||
loading.value = true
|
||||
try {
|
||||
if (!props.${subJoinColumn.javaField}){
|
||||
return []
|
||||
}
|
||||
## 特殊：树表专属逻辑（树不需要分页接口）
|
||||
#if ($table.templateType == 11) ## erp
|
||||
const params = cloneDeep(queryParams) as any;
|
||||
#foreach ($column in $columns)
|
||||
#if ($column.listOperation)
|
||||
#if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
|
||||
if (params.${column.javaField} && Array.isArray(params.${column.javaField})) {
|
||||
params.${column.javaField} = (params.${column.javaField} as string[]).join(',');
|
||||
}
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
params.${subJoinColumn.javaField} = props.${subJoinColumn.javaField};
|
||||
const data = await get${subSimpleClassName}Page(params)
|
||||
list.value = data.list
|
||||
total.value = data.total
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
list.value = await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!);
|
||||
#else
|
||||
list.value = [await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)];
|
||||
#end
|
||||
#end
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.${subJoinColumn.javaField},
|
||||
async (val) => {
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
await nextTick();
|
||||
await getList()
|
||||
},
|
||||
{ immediate: true },
|
||||
);
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.${subJoinColumn.javaField},
|
||||
async (val) => {
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
await nextTick();
|
||||
await getList()
|
||||
},
|
||||
{ immediate: true },
|
||||
);
|
||||
|
||||
#if ($table.templateType == 11) ## erp
|
||||
/** 初始化 */
|
||||
@@ -290,7 +292,7 @@ onMounted(() => {
|
||||
<!-- 列表 -->
|
||||
<ContentWrap title="${table.classComment}">
|
||||
<template #extra>
|
||||
<TableToolbar
|
||||
<VbenVxeTableToolbar
|
||||
ref="tableToolbarRef"
|
||||
v-model:hidden-search="hiddenSearchBar"
|
||||
>
|
||||
|
||||
@@ -6,13 +6,15 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ${apiName} } from '#/api/${table.moduleName}/${table.businessName}';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { ElMessage } from 'element-plus';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
import { $t } from '#/locales';
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
import { use${subSimpleClassName}FormSchema } from '../data';
|
||||
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
import type { ${apiName} } from '#/api/${table.moduleName}/${table.businessName}';
|
||||
|
||||
import { computed, ref, h, onMounted,watch,nextTick } from 'vue';
|
||||
|
||||
import { $t } from '#/locales';
|
||||
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
|
||||
@@ -42,6 +42,19 @@ const [FormModal, formModalApi] = useVbenModal({
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
/** 刷新表格 */
|
||||
async function handleRefresh() {
|
||||
#if ($table.templateType == 11) ## erp
|
||||
await gridApi.query();
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
await gridApi.grid.loadData(await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!));
|
||||
#else
|
||||
await gridApi.grid.loadData([await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)]);
|
||||
#end
|
||||
#end
|
||||
}
|
||||
|
||||
/** 创建${subTable.classComment} */
|
||||
function handleCreate() {
|
||||
if (!props.${subJoinColumn.javaField}){
|
||||
@@ -151,19 +164,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||
#end
|
||||
});
|
||||
|
||||
/** 刷新表格 */
|
||||
async function handleRefresh() {
|
||||
#if ($table.templateType == 11) ## erp
|
||||
await gridApi.query();
|
||||
#else
|
||||
#if ($subTable.subJoinMany) ## 一对多
|
||||
await gridApi.grid.loadData(await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!));
|
||||
#else
|
||||
await gridApi.grid.loadData([await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)]);
|
||||
#end
|
||||
#end
|
||||
}
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.${subJoinColumn.javaField},
|
||||
|
||||
Reference in New Issue
Block a user