fix bugs
This commit is contained in:
@@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<BasicModal
|
||||
v-bind="$attrs"
|
||||
@register="registerModal"
|
||||
:title="getTitle"
|
||||
@ok="handleSubmit"
|
||||
:showOkBtn="!isDetail"
|
||||
:width="900"
|
||||
>
|
||||
<div v-show="isDetail">
|
||||
<Description size="middle" @register="registerDetail" :column="2"/>
|
||||
</div>
|
||||
<div v-show="!isDetail">
|
||||
<BasicForm @register="registerForm" />
|
||||
</div>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '@/components/Modal';
|
||||
import { BasicForm, useForm } from '@/components/Form/index';
|
||||
import { formSchema, detailSchema } from './${modelCode!}.data';
|
||||
import { getDetail, submitObj } from '@/api/${serviceCode!}/${modelCode!}';
|
||||
import { Description, useDescription } from '@/components/Description/index';
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
const isDetail = ref(true);
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
//详情
|
||||
const [registerDetail, { setDescProps }] = useDescription({
|
||||
schema: detailSchema,
|
||||
});
|
||||
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: formSchema,
|
||||
showActionButtonGroup: false,
|
||||
baseColProps: {
|
||||
span: 12,
|
||||
},
|
||||
actionColOptions: {
|
||||
span: 23,
|
||||
},
|
||||
});
|
||||
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false });
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
isDetail.value = !!data?.isDetail;
|
||||
if (unref(isDetail)) {
|
||||
const detail = await getDetail({ id: data.record.id });
|
||||
setDescProps({
|
||||
data: detail,
|
||||
});
|
||||
} else {
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.record.id;
|
||||
const detailData = await getDetail({ id: data.record.id });
|
||||
setFieldsValue({
|
||||
...detailData,
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => {
|
||||
if (unref(isDetail)) {
|
||||
return '查看';
|
||||
} else {
|
||||
return !unref(isUpdate) ? '新增' : '编辑';
|
||||
}
|
||||
});
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
if (unref(isUpdate)) {
|
||||
values.id = rowId.value;
|
||||
}
|
||||
await submitObj(values);
|
||||
closeModal();
|
||||
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
|
||||
} finally {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,102 @@
|
||||
import { BasicColumn } from '@/components/Table';
|
||||
import { FormSchema } from '@/components/Table';
|
||||
import { DescItem } from '@/components/Description/index';
|
||||
import { getDictList } from '@/api/system/system';
|
||||
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
#for(x in prototypes) {
|
||||
#if(x.isList==1){
|
||||
{
|
||||
title: "${x.jdbcComment!}",
|
||||
dataIndex: "${x.propertyName!}",
|
||||
},
|
||||
#}
|
||||
#}
|
||||
];
|
||||
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
#for(x in prototypes) {
|
||||
#if(x.isQuery==1){
|
||||
{
|
||||
field: "${x.propertyName!}",
|
||||
label: "${x.jdbcComment!}",
|
||||
#if(x.componentType=="input"){
|
||||
component: 'Input',
|
||||
#}else if(x.componentType=="textarea"){
|
||||
component: 'InputTextArea',
|
||||
#}else if(x.componentType=="select"){
|
||||
component: 'ApiSelect',
|
||||
#}else if(x.componentType=="tree"){
|
||||
component: 'ApiTreeSelect',
|
||||
#}else if(x.componentType=="radio"){
|
||||
component: 'RadioGroup',
|
||||
#}else if(x.componentType=="checkbox"){
|
||||
component: 'Checkbox',
|
||||
#}else if(x.componentType=="switch"){
|
||||
component: 'Switch',
|
||||
#}else if(x.componentType=="date"){
|
||||
component: 'DatePicker',
|
||||
#}
|
||||
#if(x.componentType=="select"&&x.dictCode!=null){
|
||||
componentProps: {
|
||||
api: getDictList,
|
||||
params: { code: '${x.dictCode!}' },
|
||||
labelField: 'dictValue',
|
||||
valueField: 'dictKey',
|
||||
},
|
||||
#}
|
||||
},
|
||||
#}
|
||||
#}
|
||||
];
|
||||
|
||||
export const formSchema: FormSchema[] = [
|
||||
#for(x in prototypes) {
|
||||
#if(x.isForm!=0){
|
||||
{
|
||||
field: "${x.propertyName!}",
|
||||
label: "${x.jdbcComment!}",
|
||||
#if(x.componentType=="input"){
|
||||
component: 'Input',
|
||||
#}else if(x.componentType=="textarea"){
|
||||
component: 'InputTextArea',
|
||||
#}else if(x.componentType=="select"){
|
||||
component: 'ApiSelect',
|
||||
#}else if(x.componentType=="tree"){
|
||||
component: 'ApiTreeSelect',
|
||||
#}else if(x.componentType=="radio"){
|
||||
component: 'RadioGroup',
|
||||
#}else if(x.componentType=="checkbox"){
|
||||
component: 'Checkbox',
|
||||
#}else if(x.componentType=="switch"){
|
||||
component: 'Switch',
|
||||
#}else if(x.componentType=="date"){
|
||||
component: 'DatePicker',
|
||||
#}
|
||||
#if(x.componentType=="select"&&x.dictCode!=null){
|
||||
componentProps: {
|
||||
api: getDictList,
|
||||
params: { code: '${x.dictCode!}' },
|
||||
labelField: 'dictValue',
|
||||
valueField: 'dictKey',
|
||||
},
|
||||
#}
|
||||
#if(x.isRequired==1){
|
||||
required: true,
|
||||
#}
|
||||
},
|
||||
#}
|
||||
#}
|
||||
];
|
||||
|
||||
export const detailSchema: DescItem[] = [
|
||||
#for(x in prototypes) {
|
||||
#if(x.isForm!=0){
|
||||
{
|
||||
field: "${x.propertyName!}",
|
||||
label: "${x.jdbcComment!}",
|
||||
},
|
||||
#}
|
||||
#}
|
||||
];
|
||||
@@ -0,0 +1,30 @@
|
||||
import { defHttp } from '@/utils/http/axios';
|
||||
|
||||
enum Api {
|
||||
List = '/${serviceName!}/${modelCode!}/list',
|
||||
Submit = '/${serviceName!}/${modelCode!}/submit',
|
||||
Detail = '/${serviceName!}/${modelCode!}/detail',
|
||||
Remove = '/${serviceName!}/${modelCode!}/remove',
|
||||
}
|
||||
|
||||
//列表
|
||||
export function getList(params?: object) {
|
||||
return defHttp.get({ url: Api.List, params: params },
|
||||
{ joinParamsToUrl: true, joinTime: false });
|
||||
}
|
||||
|
||||
//提交
|
||||
export function submitObj(params?: object) {
|
||||
return defHttp.post({ url: Api.Submit, params: params });
|
||||
}
|
||||
|
||||
//详情
|
||||
export function getDetail(params?: object) {
|
||||
return defHttp.get({ url: Api.Detail, params });
|
||||
}
|
||||
|
||||
//删除
|
||||
export function remove(params?: object) {
|
||||
return defHttp.post({ url: Api.Remove, params }, { joinParamsToUrl: true });
|
||||
}
|
||||
|
||||
@@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div>
|
||||
<BasicTable @register="registerTable">
|
||||
<template \#toolbar>
|
||||
<a-button type="primary" v-auth="'${modelCode!}_add'" @click="handleCreate">
|
||||
新增
|
||||
</a-button>
|
||||
</template>
|
||||
<template \#bodyCell="{ column, record }">
|
||||
#for(x in prototypes) {
|
||||
#if(isNotEmpty(x.dictCode)){
|
||||
<template v-if="column.dataIndex === '${x.propertyName!}'">
|
||||
{{ formatDictValue(options['${x.propertyName!}Data'], record.category) }}
|
||||
</template>
|
||||
#}
|
||||
#}
|
||||
<template v-if="column.dataIndex === 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
auth: '${modelCode!}_view',
|
||||
label: '查看',
|
||||
color: 'success',
|
||||
icon: 'clarity:info-standard-line',
|
||||
onClick: handleView.bind(null, record),
|
||||
},
|
||||
{
|
||||
auth: '${modelCode!}_edit',
|
||||
label: '编辑',
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record),
|
||||
},
|
||||
{
|
||||
auth: '${modelCode!}_delete',
|
||||
label: '删除',
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
popConfirm: {
|
||||
title: '是否确认删除',
|
||||
confirm: handleDelete.bind(null, record),
|
||||
},
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<${modelClass!}Modal @register="registerModal" @success="handleSuccess" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup name="${modelClass!}">
|
||||
import { ref } from 'vue';
|
||||
import ${modelClass!}Modal from './${modelCode!}Modal.vue';
|
||||
import { BasicTable, useTable, TableAction } from '@/components/Table';
|
||||
import { getList, remove } from '@/api/${serviceCode!}/${modelCode!}';
|
||||
import { useModal } from '@/components/Modal';
|
||||
import { columns, searchFormSchema } from './${modelCode!}.data';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import { formatDictValue } from '@/utils';
|
||||
import { getDictList } from '@/api/system/system';
|
||||
//初始化字典
|
||||
let options = ref({});
|
||||
async function fetch() {
|
||||
#for(x in prototypes) {
|
||||
#if(isNotEmpty(x.dictCode)){
|
||||
options.value['${x.propertyName!}Data'] = await getDictList({ code: '${x.dictCode!}' });
|
||||
#}
|
||||
#}
|
||||
}
|
||||
fetch();
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerTable, { reload }] = useTable({
|
||||
api: getList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
labelWidth: 120,
|
||||
schemas: searchFormSchema,
|
||||
baseColProps: { xl: 12, xxl: 8 },
|
||||
},
|
||||
useSearchForm: true,
|
||||
actionColumn: {
|
||||
width: 250,
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
},
|
||||
});
|
||||
|
||||
function handleCreate() {
|
||||
openModal(true, {
|
||||
isDetail: false,
|
||||
isUpdate: false,
|
||||
});
|
||||
}
|
||||
|
||||
function handleView(record: Recordable) {
|
||||
openModal(true, {
|
||||
record,
|
||||
isUpdate: false,
|
||||
isDetail: true,
|
||||
});
|
||||
}
|
||||
|
||||
function handleEdit(record: Recordable) {
|
||||
openModal(true, {
|
||||
record,
|
||||
isDetail: false,
|
||||
isUpdate: true,
|
||||
});
|
||||
}
|
||||
async function handleDelete(record: Recordable) {
|
||||
await remove({ ids: record.id });
|
||||
createMessage.success('操作成功');
|
||||
reload();
|
||||
}
|
||||
|
||||
function handleSuccess() {
|
||||
//操作成功提示
|
||||
createMessage.success('操作成功');
|
||||
reload();
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user