huangge1199/vue-pro
1
0
Fork 0
mirror of https://gitee.com/huangge1199_admin/vue-pro.git synced 2025-02-17 01:30:33 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf: vben 2.0 codegen

Browse Source
This commit is contained in:
xingyu 2023-08-12 17:31:33 +08:00
parent ebf4ac1d5a
commit b55c1b942d
3 changed files with 83 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben/views/data.ts.vm
View File

@ -15,7 +15,7 @@ export const columns: BasicColumn[] = [
width: 180, width: 180,
customRender: ({ text }) => { customRender: ({ text }) => {
return useRender.renderDate(text) return useRender.renderDate(text)
} },
}, },
#elseif("" != $column.dictType)## 数据字典 #elseif("" != $column.dictType)## 数据字典
{ {
@ -24,7 +24,7 @@ export const columns: BasicColumn[] = [
width: 180, width: 180,
customRender: ({ text }) => { customRender: ({ text }) => {
return useRender.renderDict(text, DICT_TYPE.$dictType.toUpperCase()) return useRender.renderDict(text, DICT_TYPE.$dictType.toUpperCase())
} },
}, },
#else #else
{ {
@ -53,9 +53,9 @@ export const searchFormSchema: FormSchema[] = [
component: 'Select', component: 'Select',
componentProps: { componentProps: {
#if ("" != $dictType)## 设置了 dictType 数据字典的情况 #if ("" != $dictType)## 设置了 dictType 数据字典的情况
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase()) options: getDictOptions(DICT_TYPE.$dictType.toUpperCase()),
#else## 未设置 dictType 数据字典的情况 #else## 未设置 dictType 数据字典的情况
options: [] options: [],
#end #end
}, },
#elseif($column.htmlType == "datetime") #elseif($column.htmlType == "datetime")
@ -88,52 +88,52 @@ export const createFormSchema: FormSchema[] = [
required: true, required: true,
#end #end
#if ($column.htmlType == "input") #if ($column.htmlType == "input")
component: 'Input' component: 'Input',
#elseif($column.htmlType == "imageUpload")## 图片上传 #elseif($column.htmlType == "imageUpload")## 图片上传
component: 'FileUpload', component: 'FileUpload',
componentProps: { componentProps: {
fileType: 'file', fileType: 'file',
maxCount: 1 maxCount: 1,
} },
#elseif($column.htmlType == "fileUpload")## 文件上传 #elseif($column.htmlType == "fileUpload")## 文件上传
component: 'FileUpload', component: 'FileUpload',
componentProps: { componentProps: {
fileType: 'image', fileType: 'image',
maxCount: 1 maxCount: 1,
} },
#elseif($column.htmlType == "editor")## 文本编辑器 #elseif($column.htmlType == "editor")## 文本编辑器
component: 'Editor' component: 'Editor',
#elseif($column.htmlType == "select")## 下拉框 #elseif($column.htmlType == "select")## 下拉框
component: 'Select', component: 'Select',
componentProps: { componentProps: {
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number') options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number'),
#else##没数据字典 #else##没数据字典
options:[] options:[],
#end #end
} },
#elseif($column.htmlType == "checkbox")## 多选框 #elseif($column.htmlType == "checkbox")## 多选框
component: 'Checkbox', component: 'Checkbox',
componentProps: { componentProps: {
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number') options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number'),
#else##没数据字典 #else##没数据字典
options:[] options:[],
#end #end
} },
#elseif($column.htmlType == "radio")## 单选框 #elseif($column.htmlType == "radio")## 单选框
component: 'RadioButtonGroup', component: 'RadioButtonGroup',
componentProps: { componentProps: {
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number') options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number'),
#else##没数据字典 #else##没数据字典
options:[] options:[],
#end #end
} },
#elseif($column.htmlType == "datetime")## 时间框 #elseif($column.htmlType == "datetime")## 时间框
component: 'DatePicker' component: 'DatePicker',
#elseif($column.htmlType == "textarea")## 文本域 #elseif($column.htmlType == "textarea")## 文本域
component: 'InputTextArea' component: 'InputTextArea',
#end #end
}, },
#end #end
@ -162,44 +162,44 @@ export const updateFormSchema: FormSchema[] = [
required: true, required: true,
#end #end
#if ($column.htmlType == "input") #if ($column.htmlType == "input")
component: 'Input' component: 'Input',
#elseif($column.htmlType == "imageUpload")## 图片上传 #elseif($column.htmlType == "imageUpload")## 图片上传
component: 'Upload' component: 'Upload',
#elseif($column.htmlType == "fileUpload")## 文件上传 #elseif($column.htmlType == "fileUpload")## 文件上传
component: 'Upload' component: 'Upload',
#elseif($column.htmlType == "editor")## 文本编辑器 #elseif($column.htmlType == "editor")## 文本编辑器
component: 'Editor' component: 'Editor',
#elseif($column.htmlType == "select")## 下拉框 #elseif($column.htmlType == "select")## 下拉框
component: 'Select', component: 'Select',
componentProps: { componentProps: {
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number') options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number'),
#else##没数据字典 #else##没数据字典
options:[] options:[],
#end #end
} },
#elseif($column.htmlType == "checkbox")## 多选框 #elseif($column.htmlType == "checkbox")## 多选框
component: 'Checkbox', component: 'Checkbox',
componentProps: { componentProps: {
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number') options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number'),
#else##没数据字典 #else##没数据字典
options:[] options:[],
#end #end
} },
#elseif($column.htmlType == "radio")## 单选框 #elseif($column.htmlType == "radio")## 单选框
component: 'RadioButtonGroup', component: 'RadioButtonGroup',
componentProps: { componentProps: {
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number') options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), 'number'),
#else##没数据字典 #else##没数据字典
options:[] options:[],
#end #end
} },
#elseif($column.htmlType == "datetime")## 时间框 #elseif($column.htmlType == "datetime")## 时间框
component: 'DatePicker' component: 'DatePicker',
#elseif($column.htmlType == "textarea")## 文本域 #elseif($column.htmlType == "textarea")## 文本域
component: 'InputTextArea' component: 'InputTextArea',
#end #end
}, },
#end #end

14
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben/views/form.vue.vm
View File

@ -1,15 +1,10 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="isUpdate ? t('action.edit') : t('action.create')" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, unref } from 'vue' import { ref, unref } from 'vue'
import { createFormSchema, updateFormSchema } from './${classNameVar}.data'
import { useI18n } from '@/hooks/web/useI18n' import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage' import { useMessage } from '@/hooks/web/useMessage'
import { BasicForm, useForm } from '@/components/Form' import { BasicForm, useForm } from '@/components/Form'
import { BasicModal, useModalInner } from '@/components/Modal' import { BasicModal, useModalInner } from '@/components/Modal'
import { createFormSchema, updateFormSchema } from './${classNameVar}.data'
import { create${simpleClassName}, get${simpleClassName}, update${simpleClassName} } from '@/api/${table.moduleName}/${classNameVar}' import { create${simpleClassName}, get${simpleClassName}, update${simpleClassName} } from '@/api/${table.moduleName}/${classNameVar}'
defineOptions({ name: '${table.className}Modal' }) defineOptions({ name: '${table.className}Modal' })
@ -24,7 +19,7 @@ const [registerForm, { setFieldsValue, resetFields, resetSchema, validate }] = u
baseColProps: { span: 24 }, baseColProps: { span: 24 },
schemas: createFormSchema, schemas: createFormSchema,
showActionButtonGroup: false, showActionButtonGroup: false,
actionColOptions: { span: 23 } actionColOptions: { span: 23 },
}) })
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
@ -55,3 +50,8 @@ async function handleSubmit() {
} }
} }
</script> </script>
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="isUpdate ? t('action.edit') : t('action.create')" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>

80
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben/views/index.vue.vm
View File

@ -1,47 +1,12 @@
<template>
<div>
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="primary" v-auth="['${permissionPrefix}:create']" :preIcon="IconEnum.ADD" @click="handleCreate">
{{ t('action.create') }}
</a-button>
<a-button type="warning" v-auth="['${permissionPrefix}:export']" :preIcon="IconEnum.EXPORT" @click="handleExport">
{{ t('action.export') }}
</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{ icon: IconEnum.EDIT, label: t('action.edit'), auth: '${permissionPrefix}:update', onClick: handleEdit.bind(null, record) },
{
icon: IconEnum.DELETE,
color: 'error',
label: t('action.delete'),
auth: '${permissionPrefix}:delete',
popConfirm: {
title: t('common.delMessage'),
placement: 'left',
confirm: handleDelete.bind(null, record)
}
}
]"
/>
</template>
</template>
</BasicTable>
<${simpleClassName}Modal @register="registerModal" @success="reload()" />
</div>
</template>
<script lang="ts" setup> <script lang="ts" setup>
import ${simpleClassName}Modal from './${simpleClassName}Modal.vue'
import { columns, searchFormSchema } from './${classNameVar}.data'
import { useI18n } from '@/hooks/web/useI18n' import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage' import { useMessage } from '@/hooks/web/useMessage'
import { useModal } from '@/components/Modal' import { useModal } from '@/components/Modal'
import ${simpleClassName}Modal from './${simpleClassName}Modal.vue'
import { IconEnum } from '@/enums/appEnum' import { IconEnum } from '@/enums/appEnum'
import { BasicTable, useTable, TableAction } from '@/components/Table' import { BasicTable, useTable, TableAction } from '@/components/Table'
import { delete${simpleClassName}, export${simpleClassName}, get${simpleClassName}Page } from '@/api/${table.moduleName}/${classNameVar}' import { delete${simpleClassName}, export${simpleClassName}, get${simpleClassName}Page } from '@/api/${table.moduleName}/${classNameVar}'
import { columns, searchFormSchema } from './${classNameVar}.data'
defineOptions({ name: '${table.className}' }) defineOptions({ name: '${table.className}' })
@ -60,8 +25,8 @@ const [registerTable, { getForm, reload }] = useTable({
width: 140, width: 140,
title: t('common.action'), title: t('common.action'),
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right',
} },
}) })
function handleCreate() { function handleCreate() {
@ -80,7 +45,7 @@ async function handleExport() {
async onOk() { async onOk() {
await export${simpleClassName}(getForm().getFieldsValue()) await export${simpleClassName}(getForm().getFieldsValue())
createMessage.success(t('common.exportSuccessText')) createMessage.success(t('common.exportSuccessText'))
} },
}) })
} }
@ -90,3 +55,38 @@ async function handleDelete(record: Recordable) {
reload() reload()
} }
</script> </script>
<template>
<div>
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="primary" v-auth="['${permissionPrefix}:create']" :preIcon="IconEnum.ADD" @click="handleCreate">
{{ t('action.create') }}
</a-button>
<a-button type="warning" v-auth="['${permissionPrefix}:export']" :preIcon="IconEnum.EXPORT" @click="handleExport">
{{ t('action.export') }}
</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{ icon: IconEnum.EDIT, label: t('action.edit'), auth: '${permissionPrefix}:update', onClick: handleEdit.bind(null, record) },
{
icon: IconEnum.DELETE,
color: 'error',
label: t('action.delete'),
auth: '${permissionPrefix}:delete',
popConfirm: {
title: t('common.delMessage'),
placement: 'left',
confirm: handleDelete.bind(null, record),
},
},
]"
/>
</template>
</template>
</BasicTable>
<${simpleClassName}Modal @register="registerModal" @success="reload()" />
</div>
</template>