添加Vue子表生成模板
This commit is contained in:
@@ -3,7 +3,7 @@
|
|||||||
No deletion without permission, or be held responsible to law. -->
|
No deletion without permission, or be held responsible to law. -->
|
||||||
<template>
|
<template>
|
||||||
<name>vueApi</name>
|
<name>vueApi</name>
|
||||||
<filePath>vue/src/api/${moduleName}/${subModuleName}</filePath>
|
<filePath>src/api/${moduleName}/${subModuleName}</filePath>
|
||||||
<fileName>${className}.ts</fileName>
|
<fileName>${className}.ts</fileName>
|
||||||
<content><![CDATA[
|
<content><![CDATA[
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
No deletion without permission, or be held responsible to law. -->
|
No deletion without permission, or be held responsible to law. -->
|
||||||
<template>
|
<template>
|
||||||
<name>vueForm</name>
|
<name>vueForm</name>
|
||||||
<filePath>vue/src/views/${urlPrefix}</filePath>
|
<filePath>src/views/${urlPrefix}</filePath>
|
||||||
<fileName>form.vue</fileName>
|
<fileName>form.vue</fileName>
|
||||||
<content><![CDATA[
|
<content><![CDATA[
|
||||||
<!--
|
<!--
|
||||||
@@ -24,7 +24,25 @@
|
|||||||
<Icon :icon="getTitle.icon" class="pr-1 m-1" />
|
<Icon :icon="getTitle.icon" class="pr-1 m-1" />
|
||||||
<span> {{ getTitle.value }} </span>
|
<span> {{ getTitle.value }} </span>
|
||||||
</template>
|
</template>
|
||||||
|
<% if (table.childList.~size > 0){ %>
|
||||||
|
<BasicForm @register="registerForm">
|
||||||
|
<% for (child in table.childList){ %>
|
||||||
|
<template #${@StringUtils.uncap(child.className)}List>
|
||||||
|
<BasicTable
|
||||||
|
@register="register${child.className}Table"
|
||||||
|
@row-click="handle${child.className}RowClick"
|
||||||
|
/>
|
||||||
|
<% if(table.tplCategory != 'query'){ %>
|
||||||
|
<a-button class="mt-2" @click="handle${child.className}Add" v-auth="'${permissionPrefix}:edit'">
|
||||||
|
<Icon icon="ant-design:plus-circle-outlined" /> {{ t('新增') }}
|
||||||
|
</a-button>
|
||||||
|
<% } %>
|
||||||
|
</template>
|
||||||
|
<% } %>
|
||||||
|
</BasicForm>
|
||||||
|
<% }else{ %>
|
||||||
<BasicForm @register="registerForm" />
|
<BasicForm @register="registerForm" />
|
||||||
|
<% } %>
|
||||||
</BasicDrawer>
|
</BasicDrawer>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
@@ -39,6 +57,9 @@
|
|||||||
import { router } from '/@/router';
|
import { router } from '/@/router';
|
||||||
import { Icon } from '/@/components/Icon';
|
import { Icon } from '/@/components/Icon';
|
||||||
import { BasicForm, FormSchema, useForm } from '/@/components/Form';
|
import { BasicForm, FormSchema, useForm } from '/@/components/Form';
|
||||||
|
<% if (table.childList.~size > 0){ %>
|
||||||
|
import { BasicTable, useTable } from '/@/components/Table';
|
||||||
|
<% } %>
|
||||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||||
import { ${className}Save, ${className}Form<% if(table.isTreeEntity){ %>, ${className}TreeData<% } %> } from '/@/api/${moduleName}${isNotEmpty(subModuleName)?'/'+subModuleName:''}/${className}';
|
import { ${className}Save, ${className}Form<% if(table.isTreeEntity){ %>, ${className}TreeData<% } %> } from '/@/api/${moduleName}${isNotEmpty(subModuleName)?'/'+subModuleName:''}/${className}';
|
||||||
<%
|
<%
|
||||||
@@ -75,7 +96,7 @@ for(c in table.columnList){
|
|||||||
};
|
};
|
||||||
|
|
||||||
const inputFormSchemas: FormSchema[] = [
|
const inputFormSchemas: FormSchema[] = [
|
||||||
<% if(table.isTreeEntity){ %>
|
<% if(table.isTreeEntity){ %>
|
||||||
{
|
{
|
||||||
label: t('上级${functionNameSimple}'),
|
label: t('上级${functionNameSimple}'),
|
||||||
field: 'parentCode',
|
field: 'parentCode',
|
||||||
@@ -87,7 +108,7 @@ for(c in table.columnList){
|
|||||||
},
|
},
|
||||||
colProps: { lg: 24, md: 24 },
|
colProps: { lg: 24, md: 24 },
|
||||||
},
|
},
|
||||||
<% }
|
<% }
|
||||||
for (c in table.columnList){
|
for (c in table.columnList){
|
||||||
if (c.isEdit == '1' && c.showType != 'hidden'){
|
if (c.isEdit == '1' && c.showType != 'hidden'){
|
||||||
// 如果是树结构的字段,则自动忽略
|
// 如果是树结构的字段,则自动忽略
|
||||||
@@ -161,6 +182,7 @@ for (c in table.columnList){
|
|||||||
component: 'TreeSelect',
|
component: 'TreeSelect',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
api: officeTreeData,
|
api: officeTreeData,
|
||||||
|
canSelectParent: false,
|
||||||
allowClear: true,
|
allowClear: true,
|
||||||
},
|
},
|
||||||
<% }else if(c.showType == 'areaselect'){
|
<% }else if(c.showType == 'areaselect'){
|
||||||
@@ -170,6 +192,7 @@ for (c in table.columnList){
|
|||||||
component: 'TreeSelect',
|
component: 'TreeSelect',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
api: areaTreeData,
|
api: areaTreeData,
|
||||||
|
canSelectParent: false,
|
||||||
allowClear: true,
|
allowClear: true,
|
||||||
},
|
},
|
||||||
<% }else{ %>
|
<% }else{ %>
|
||||||
@@ -254,16 +277,26 @@ for (c in table.columnList){
|
|||||||
}
|
}
|
||||||
%>
|
%>
|
||||||
},
|
},
|
||||||
<%
|
<%
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
for (child in table.childList){ %>
|
||||||
|
{
|
||||||
|
label: t('${child.comments}'),
|
||||||
|
field: '${@StringUtils.uncap(child.className)}List',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { lg: 24, md: 24 },
|
||||||
|
slot: '${@StringUtils.uncap(child.className)}List',
|
||||||
|
},
|
||||||
|
<%
|
||||||
|
}
|
||||||
%>
|
%>
|
||||||
];
|
];
|
||||||
<%
|
<%
|
||||||
var updateSchemas = [];
|
var updateSchemas = [];
|
||||||
if(table.isTreeEntity){
|
if(table.isTreeEntity){
|
||||||
var s = {
|
var s = {
|
||||||
%> {
|
%> {
|
||||||
field: 'parentCode',
|
field: 'parentCode',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
api: ${className}TreeData,
|
api: ${className}TreeData,
|
||||||
@@ -275,11 +308,11 @@ for (c in table.columnList){
|
|||||||
},<%
|
},<%
|
||||||
};
|
};
|
||||||
@updateSchemas.add(s);
|
@updateSchemas.add(s);
|
||||||
}
|
}
|
||||||
for (c in table.columnList){
|
for (c in table.columnList){
|
||||||
if (c.isPk == '1' && c.showType == 'input'){
|
if (c.isPk == '1' && c.showType == 'input'){
|
||||||
var s = {
|
var s = {
|
||||||
%> {
|
%> {
|
||||||
field: '${c.attrName}',
|
field: '${c.attrName}',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
disabled: !record.value.isNewRecord,
|
disabled: !record.value.isNewRecord,
|
||||||
@@ -288,14 +321,181 @@ for (c in table.columnList){
|
|||||||
};
|
};
|
||||||
@updateSchemas.add(s);
|
@updateSchemas.add(s);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
%>
|
%>
|
||||||
const [registerForm, { resetFields, setFieldsValue<% if(updateSchemas.~size > 0){ %>, updateSchema<% } %>, validate }] = useForm({
|
const [registerForm, { resetFields, setFieldsValue<% if(updateSchemas.~size > 0){ %>, updateSchema<% } %>, validate }] = useForm({
|
||||||
labelWidth: 120,
|
labelWidth: 120,
|
||||||
schemas: inputFormSchemas,
|
schemas: inputFormSchemas,
|
||||||
<% var formColNum = table.optionMap['formColNum']; %>
|
<% var formColNum = table.optionMap['formColNum']; %>
|
||||||
baseColProps: { lg: ${formColNum=="1"?24:formColNum=="3"?8:12}, md: 24 },
|
baseColProps: { lg: ${formColNum=="1"?24:formColNum=="3"?8:12}, md: 24 },
|
||||||
});
|
});
|
||||||
|
<% for (child in table.childList){ %>
|
||||||
|
|
||||||
|
const [register${child.className}Table, ${@StringUtils.uncap(child.className)}Table] = useTable({
|
||||||
|
actionColumn: {
|
||||||
|
width: 60,
|
||||||
|
actions: (record: Recordable) => [
|
||||||
|
{
|
||||||
|
icon: 'ant-design:delete-outlined',
|
||||||
|
color: 'error',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handle${child.className}Delete.bind(this, record),
|
||||||
|
},
|
||||||
|
auth: '${permissionPrefix}:edit',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
rowKey: 'id',
|
||||||
|
pagination: false,
|
||||||
|
bordered: true,
|
||||||
|
size: 'small',
|
||||||
|
inset: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
async function set${child.className}TableData(_res: Recordable) {
|
||||||
|
${@StringUtils.uncap(child.className)}Table.setColumns([
|
||||||
|
<%
|
||||||
|
for (c in child.columnList){
|
||||||
|
if (c.isEdit != '1' || c.isPk == '1'){
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
if(child.parentExists && child.parentTableFkName == c.columnName){
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
%>
|
||||||
|
{
|
||||||
|
title: t('${c.columnLabel}'),
|
||||||
|
dataIndex: '${c.attrName}',
|
||||||
|
<% if(c.showType == 'datetime'){ %>
|
||||||
|
width: 215,
|
||||||
|
<% }else{ %>
|
||||||
|
width: 130,
|
||||||
|
<% } %>
|
||||||
|
<% if ((isNotBlank(c.optionMap['dictType']) || @StringUtils.inString(c.attrType, 'java.util.Date', 'Integer', 'Long'))){ %>
|
||||||
|
align: 'center',
|
||||||
|
<% }else if (@StringUtils.inString(c.attrType, 'Float', 'Double')){ %>
|
||||||
|
align: 'right',
|
||||||
|
<% }else{ %>
|
||||||
|
align: 'left',
|
||||||
|
<% } %>
|
||||||
|
<% if(c.showType == 'select' || c.showType == 'select_multiple' || c.showType == 'checkbox' || c.showType == 'radio'){ %>
|
||||||
|
dictType: '${c.optionMap['dictType']}',
|
||||||
|
<% } %>
|
||||||
|
editRow: true,
|
||||||
|
<% if(c.showType == 'input' || c.showType == 'textarea'){ %>
|
||||||
|
<% if (c.simpleAttrType == 'Integer' && c.attrName == 'treeSort'){ %>
|
||||||
|
editComponent: 'InputNumber',
|
||||||
|
editDefaultValue: '30',
|
||||||
|
<% }else{ %>
|
||||||
|
editComponent: 'Input',
|
||||||
|
<% } %>
|
||||||
|
<% if (c.dataLength != '0'){ %>
|
||||||
|
editComponentProps: {
|
||||||
|
maxlength: ${c.dataLength},
|
||||||
|
},
|
||||||
|
<% } %>
|
||||||
|
<% }else if(c.showType == 'select' || c.showType == 'select_multiple' || c.showType == 'radio' || c.showType == 'checkbox'){
|
||||||
|
var isMultiple = (c.showType == 'select_multiple'); %>
|
||||||
|
editComponent: 'Select',
|
||||||
|
editComponentProps: {
|
||||||
|
dictType: '${c.optionMap['dictType']}',
|
||||||
|
allowClear: true,
|
||||||
|
<% if(isMultiple){ %>
|
||||||
|
mode: 'multiple',
|
||||||
|
<% } %>
|
||||||
|
},
|
||||||
|
<% }else if(c.showType == 'date' || c.showType == 'datetime'){
|
||||||
|
var isTime = (c.showType == 'datetime'); %>
|
||||||
|
editComponent: 'DatePicker',
|
||||||
|
editComponentProps: {
|
||||||
|
format: 'YYYY-MM-DD${isTime?' HH:mm':''}',
|
||||||
|
showTime: ${isTime?'{ format: \'HH:mm\' \}':'false'},
|
||||||
|
},
|
||||||
|
<% }else if(c.showType == 'userselect'){
|
||||||
|
if (isNotBlank(c.attrName2)){ %>
|
||||||
|
dataLabel: '${c.attrName2}',
|
||||||
|
<% } %>
|
||||||
|
editComponent: 'TreeSelect',
|
||||||
|
editComponentProps: {
|
||||||
|
api: officeTreeData,
|
||||||
|
params: { isLoadUser: true, userIdPrefix: '' },
|
||||||
|
canSelectParent: false,
|
||||||
|
allowClear: true,
|
||||||
|
},
|
||||||
|
<% }else if(c.showType == 'officeselect'){
|
||||||
|
if (isNotBlank(c.attrName2)){ %>
|
||||||
|
dataLabel: '${c.attrName2}',
|
||||||
|
<% } %>
|
||||||
|
editComponent: 'TreeSelect',
|
||||||
|
editComponentProps: {
|
||||||
|
api: officeTreeData,
|
||||||
|
canSelectParent: false,
|
||||||
|
allowClear: true,
|
||||||
|
},
|
||||||
|
<% }else if(c.showType == 'areaselect'){
|
||||||
|
if (isNotBlank(c.attrName2)){ %>
|
||||||
|
dataLabel: '${c.attrName2}',
|
||||||
|
<% } %>
|
||||||
|
editComponent: 'TreeSelect',
|
||||||
|
editComponentProps: {
|
||||||
|
api: areaTreeData,
|
||||||
|
canSelectParent: false,
|
||||||
|
allowClear: true,
|
||||||
|
},
|
||||||
|
<% }else{ %>
|
||||||
|
editComponent: 'Input',
|
||||||
|
<% } %>
|
||||||
|
editRule: ${c.isRequired == '1'},
|
||||||
|
},
|
||||||
|
<%
|
||||||
|
}
|
||||||
|
%>
|
||||||
|
]);
|
||||||
|
${@StringUtils.uncap(child.className)}Table.setTableData(record.value.${@StringUtils.uncap(child.className)}List || []);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handle${child.className}RowClick(record: Recordable) {
|
||||||
|
record.onEdit?.(true, false);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handle${child.className}Add() {
|
||||||
|
${@StringUtils.uncap(child.className)}Table.insertTableDataRecord({
|
||||||
|
id: new Date().getTime(),
|
||||||
|
isNewRecord: true,
|
||||||
|
editable: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handle${child.className}Delete(record: Recordable) {
|
||||||
|
${@StringUtils.uncap(child.className)}Table.deleteTableDataRecord(record);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function get${child.className}List() {
|
||||||
|
let ${@StringUtils.uncap(child.className)}ListValid = true;
|
||||||
|
let ${@StringUtils.uncap(child.className)}List: Recordable[] = [];
|
||||||
|
for (const record of ${@StringUtils.uncap(child.className)}Table.getDataSource()) {
|
||||||
|
if (!(await record.onEdit?.(false, true))) {
|
||||||
|
${@StringUtils.uncap(child.className)}ListValid = false;
|
||||||
|
}
|
||||||
|
${@StringUtils.uncap(child.className)}List.push({
|
||||||
|
...record,
|
||||||
|
id: !!record.isNewRecord ? '' : record.id,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
for (const record of ${@StringUtils.uncap(child.className)}Table.getDelDataSource()) {
|
||||||
|
if (!!record.isNewRecord) continue;
|
||||||
|
${@StringUtils.uncap(child.className)}List.push({
|
||||||
|
...record,
|
||||||
|
status: '1',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (!${@StringUtils.uncap(child.className)}ListValid) {
|
||||||
|
throw new Error('${@StringUtils.uncap(child.className)}List valid.');
|
||||||
|
}
|
||||||
|
return ${@StringUtils.uncap(child.className)}List;
|
||||||
|
}
|
||||||
|
<% } %>
|
||||||
|
|
||||||
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
resetFields();
|
resetFields();
|
||||||
@@ -309,6 +509,9 @@ for (c in table.columnList){
|
|||||||
}
|
}
|
||||||
<% } %>
|
<% } %>
|
||||||
setFieldsValue(record.value);
|
setFieldsValue(record.value);
|
||||||
|
<% for (child in table.childList){ %>
|
||||||
|
set${child.className}TableData(res);
|
||||||
|
<% } %>
|
||||||
<% if(updateSchemas.~size > 0){ %>
|
<% if(updateSchemas.~size > 0){ %>
|
||||||
updateSchema([
|
updateSchema([
|
||||||
<% for(updateSchema in updateSchemas){
|
<% for(updateSchema in updateSchemas){
|
||||||
@@ -334,6 +537,9 @@ for (c in table.columnList){
|
|||||||
}
|
}
|
||||||
%>
|
%>
|
||||||
};
|
};
|
||||||
|
<% for (child in table.childList){ %>
|
||||||
|
data.${@StringUtils.uncap(child.className)}List = await get${child.className}List();
|
||||||
|
<% } %>
|
||||||
// console.log('submit', params, data, record);
|
// console.log('submit', params, data, record);
|
||||||
const res = await ${className}Save(params, data);
|
const res = await ${className}Save(params, data);
|
||||||
showMessage(res.message);
|
showMessage(res.message);
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
No deletion without permission, or be held responsible to law. -->
|
No deletion without permission, or be held responsible to law. -->
|
||||||
<template>
|
<template>
|
||||||
<name>vueIndex</name>
|
<name>vueIndex</name>
|
||||||
<filePath>vue/src/views/${urlPrefix}</filePath>
|
<filePath>src/views/${urlPrefix}</filePath>
|
||||||
<fileName>index.vue</fileName>
|
<fileName>index.vue</fileName>
|
||||||
<content><![CDATA[
|
<content><![CDATA[
|
||||||
<% if(table.isTreeEntity){ %>
|
<% if(table.isTreeEntity){ %>
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
No deletion without permission, or be held responsible to law. -->
|
No deletion without permission, or be held responsible to law. -->
|
||||||
<template>
|
<template>
|
||||||
<name>vueList</name>
|
<name>vueList</name>
|
||||||
<filePath>vue/src/views/${urlPrefix}</filePath>
|
<filePath>src/views/${urlPrefix}</filePath>
|
||||||
<fileName>list.vue</fileName>
|
<fileName>list.vue</fileName>
|
||||||
<content><![CDATA[
|
<content><![CDATA[
|
||||||
<!--
|
<!--
|
||||||
@@ -33,14 +33,14 @@
|
|||||||
</template>
|
</template>
|
||||||
<template #firstColumn="{ record }">
|
<template #firstColumn="{ record }">
|
||||||
<%
|
<%
|
||||||
var idParam = '';
|
var idParam = '';
|
||||||
for(pk in table.pkList){
|
for(pk in table.pkList){
|
||||||
idParam = idParam + pk.attrName + ': record.' + pk.attrName;
|
idParam = idParam + pk.attrName + ': record.' + pk.attrName;
|
||||||
if (pkLP.index == table.pkList.~size - 1) {
|
if (pkLP.index == table.pkList.~size - 1) {
|
||||||
idParam = idParam + ', ';
|
idParam = idParam + ', ';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if(table.isTreeEntity){
|
if(table.isTreeEntity){
|
||||||
%>
|
%>
|
||||||
<span class="cursor-pointer" @click="expandCollapse(record)">
|
<span class="cursor-pointer" @click="expandCollapse(record)">
|
||||||
( {{ record.${table.treeViewCodeAttrName} }} )
|
( {{ record.${table.treeViewCodeAttrName} }} )
|
||||||
@@ -49,7 +49,7 @@
|
|||||||
{{ record.${table.treeViewNameAttrName} }}
|
{{ record.${table.treeViewNameAttrName} }}
|
||||||
</a>
|
</a>
|
||||||
<%
|
<%
|
||||||
}else{
|
}else{
|
||||||
for(c in table.columnList){
|
for(c in table.columnList){
|
||||||
if(c.isList == "1"){
|
if(c.isList == "1"){
|
||||||
// 如果是树结构的字段,则自动忽略
|
// 如果是树结构的字段,则自动忽略
|
||||||
@@ -67,7 +67,7 @@
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
%>
|
%>
|
||||||
</template>
|
</template>
|
||||||
</BasicTable>
|
</BasicTable>
|
||||||
|
|||||||
Reference in New Issue
Block a user