|
|
@@ -2,13 +2,7 @@
|
|
|
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
|
|
|
|
|
import { useVbenModal } from '@vben/common-ui';
|
|
|
-import { message, Tabs } from 'ant-design-vue';
|
|
|
-## 特殊:主子表专属逻辑
|
|
|
-#if ( $table.templateType == 10 || $table.templateType == 12 )
|
|
|
- #foreach ($subSimpleClassName in $subSimpleClassNames)
|
|
|
- import ${subSimpleClassName}Form from './${subSimpleClassName}Form.vue'
|
|
|
- #end
|
|
|
-#end
|
|
|
+import { message, Tabs, Checkbox, Input, Textarea, Select,RadioGroup,CheckboxGroup, DatePicker } from 'ant-design-vue';
|
|
|
|
|
|
import { computed, ref } from 'vue';
|
|
|
import { $t } from '#/locales';
|
|
|
@@ -16,6 +10,20 @@ import { useVbenForm } from '#/adapter/form';
|
|
|
import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
|
|
|
|
|
|
import { useFormSchema } from '../data';
|
|
|
+#if ( $table.templateType == 10 || $table.templateType == 12 )
|
|
|
+#if ( $subTables && $subTables.size() > 0 )
|
|
|
+#foreach ($subTable in $subTables)
|
|
|
+ #set ($index = $foreach.count - 1)
|
|
|
+ #set ($subSimpleClassName = $subSimpleClassNames.get($index))
|
|
|
+ #if ($subTable.subJoinMany) ## 一对多
|
|
|
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
|
|
+import { use${subSimpleClassName}GridColumns } from '../data';
|
|
|
+ #else
|
|
|
+import { use${subSimpleClassName}FormSchema } from '../data';
|
|
|
+ #end
|
|
|
+#end
|
|
|
+#end
|
|
|
+#end
|
|
|
|
|
|
const emit = defineEmits(['success']);
|
|
|
const formData = ref<${simpleClassName}Api.${simpleClassName}>();
|
|
|
@@ -40,15 +48,44 @@ const getTitle = computed(() => {
|
|
|
|
|
|
## 特殊:主子表专属逻辑
|
|
|
#if ( $table.templateType == 10 || $table.templateType == 12 )
|
|
|
- #if ( $subTables && $subTables.size() > 0 )
|
|
|
-
|
|
|
- /** 子表的表单 */
|
|
|
- const subTabsName = ref('$subClassNameVars.get(0)')
|
|
|
- #foreach ($subClassNameVar in $subClassNameVars)
|
|
|
- const ${subClassNameVar}FormRef = ref()
|
|
|
- #end
|
|
|
+#if ( $subTables && $subTables.size() > 0 )
|
|
|
+/** 子表的表单 */
|
|
|
+const subTabsName = ref('$subClassNameVars.get(0)')
|
|
|
+## 特殊:主子表专属逻辑
|
|
|
+#foreach ($subTable in $subTables)
|
|
|
+ #set ($index = $foreach.count - 1)
|
|
|
+ #set ($subSimpleClassName = $subSimpleClassNames.get($index))
|
|
|
+ #set ($subClassNameVar = $subClassNameVars.get($index))
|
|
|
+ #if ($subTable.subJoinMany) ## 一对多
|
|
|
+/** {$subTable.classComment}表格配置 */
|
|
|
+const [${subSimpleClassName}Grid, {$subClassNameVar}GridApi] = useVbenVxeGrid({
|
|
|
+ gridOptions: {
|
|
|
+ columns: use${subSimpleClassName}GridColumns(),
|
|
|
+ border: true,
|
|
|
+ showOverflow: true,
|
|
|
+ autoResize: true,
|
|
|
+ keepSource: true,
|
|
|
+ rowConfig: {
|
|
|
+ keyField: 'id',
|
|
|
+ },
|
|
|
+ pagerConfig: {
|
|
|
+ enabled: false,
|
|
|
+ },
|
|
|
+ toolbarConfig: {
|
|
|
+ enabled: false,
|
|
|
+ },
|
|
|
+ },
|
|
|
+});
|
|
|
+ #else
|
|
|
+const [${subSimpleClassName}Form, {$subClassNameVar}FormApi] = useVbenForm({
|
|
|
+ layout: 'horizontal',
|
|
|
+ schema: useFormSchema(),
|
|
|
+ showDefaultActions: false
|
|
|
+});
|
|
|
#end
|
|
|
#end
|
|
|
+#end
|
|
|
+#end
|
|
|
|
|
|
const [Form, formApi] = useVbenForm({
|
|
|
layout: 'horizontal',
|
|
|
@@ -56,6 +93,7 @@ const [Form, formApi] = useVbenForm({
|
|
|
showDefaultActions: false
|
|
|
});
|
|
|
|
|
|
+// TODO @puhui999: 处理完成主子表标准模式和内嵌模式下的表单提交
|
|
|
const [Modal, modalApi] = useVbenModal({
|
|
|
async onConfirm() {
|
|
|
const { valid } = await formApi.validate();
|
|
|
@@ -143,9 +181,67 @@ const [Modal, modalApi] = useVbenModal({
|
|
|
#set ($index = $foreach.count - 1)
|
|
|
#set ($subClassNameVar = $subClassNameVars.get($index))
|
|
|
#set ($subSimpleClassName = $subSimpleClassNames.get($index))
|
|
|
- #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
|
|
|
+ #set ($subColumns = $subColumnsList.get($index))##当前字段数组
|
|
|
+ #set ($subJoinColumn = $subJoinColumns.get($index))##当前 join 字段
|
|
|
<Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}">
|
|
|
- <${subSimpleClassName}Form ref="${subClassNameVar}FormRef" :${subJoinColumn_strikeCase}="formData.id" />
|
|
|
+ #if ($subTable.subJoinMany) ## 一对多
|
|
|
+ <${subSimpleClassName}Grid class="mx-4">
|
|
|
+ #foreach($column in $subColumns)
|
|
|
+ #if ($column.createOperation || $column.updateOperation)
|
|
|
+ #set ($javaField = $column.javaField)
|
|
|
+ #if ( $column.id == $subJoinColumn.id) ## 特殊:忽略主子表的 join 字段,不用填写
|
|
|
+ #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
|
|
|
+ <template #${javaField}="{ row }">
|
|
|
+ <Input v-model:value="row.${javaField}" />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "imageUpload")## 图片上传
|
|
|
+ <template #${javaField}="{ row }">
|
|
|
+ <UploadImg v-model:value="row.${javaField}" />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "fileUpload")## 文件上传
|
|
|
+ <template #${javaField}="{ row }">
|
|
|
+ <UploadFile v-model:value="row.${javaField}" />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "editor")## 文本编辑器
|
|
|
+ <template #${javaField}="{ row }">
|
|
|
+ <Textarea v-model:value="row.${javaField}" />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "select")## 下拉框
|
|
|
+ <template #${javaField}="{ row, column }">
|
|
|
+ <Select v-model:value="row.${javaField}" class="w-full">
|
|
|
+ <Select.Option v-for="option in column.params.options" :key="option.value" :value="option.value">
|
|
|
+ {{ option.label }}
|
|
|
+ </Select.Option>
|
|
|
+ </Select>
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "checkbox")## 多选框
|
|
|
+ <template #${javaField}="{ row, column }">
|
|
|
+ <CheckboxGroup v-model:value="row.${javaField}" :options="column.params.options" />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "radio")## 单选框
|
|
|
+ <template #${javaField}="{ row, column }">
|
|
|
+ <RadioGroup v-model:value="row.${javaField}" :options="column.params.options" />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "datetime")## 时间框
|
|
|
+ <template #${javaField}="{ row }">
|
|
|
+ <DatePicker
|
|
|
+ v-model:value="row.${javaField}"
|
|
|
+ :showTime="true"
|
|
|
+ format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ valueFormat='x'
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ #elseif($column.htmlType == "textarea")## 文本框
|
|
|
+ <template #${javaField}="{ row }">
|
|
|
+ <Textarea v-model:value="row.${javaField}" />
|
|
|
+ </template>
|
|
|
+ #end
|
|
|
+ #end
|
|
|
+ #end
|
|
|
+ </Grid>
|
|
|
+ #else
|
|
|
+ <${subSimpleClassName}Form class="mx-4" />
|
|
|
+ #end
|
|
|
</Tabs.TabPane>
|
|
|
#end
|
|
|
</Tabs>
|