feat: codegen table
xingyu
parent
0d58b2bf8d
commit
fa92a1c2da
|
|
@ -1,9 +1,11 @@
|
|||
<template>
|
||||
<div class="step2">
|
||||
<div class="step2-form">
|
||||
<BasicForm @register="register" />
|
||||
<BasicTable :dataSource="columnsInfo" @register="registerTable" @row-click="handleEdit" />
|
||||
</div>
|
||||
<Divider />
|
||||
<a-button @click="customResetFunc">上一步</a-button>
|
||||
<a-button @click="customSubmitFunc">下一步</a-button>
|
||||
<h3>说明</h3>
|
||||
<h4>转账到支付宝账户</h4>
|
||||
<p>
|
||||
|
|
@ -17,26 +19,26 @@
|
|||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { BasicForm, useForm } from '@/components/Form'
|
||||
import { basicInfoSchemas } from './data'
|
||||
import { BasicTable, EditRecordRow, useTable } from '@/components/Table'
|
||||
import { columns } from './data'
|
||||
import { Divider } from 'ant-design-vue'
|
||||
import { CodegenColumnVO } from '@/api/infra/codegen/types'
|
||||
|
||||
const emit = defineEmits(['next', 'prev'])
|
||||
|
||||
const [register, { validate }] = useForm({
|
||||
labelWidth: 120,
|
||||
schemas: basicInfoSchemas,
|
||||
actionColOptions: {
|
||||
span: 14
|
||||
},
|
||||
resetButtonOptions: {
|
||||
text: '上一步'
|
||||
},
|
||||
submitButtonOptions: {
|
||||
text: '下一步'
|
||||
},
|
||||
resetFunc: customResetFunc,
|
||||
submitFunc: customSubmitFunc
|
||||
defineProps({
|
||||
columnsInfo: {
|
||||
type: Array as PropType<CodegenColumnVO[]>,
|
||||
default: () => null
|
||||
}
|
||||
})
|
||||
|
||||
const [registerTable] = useTable({
|
||||
columns,
|
||||
pagination: false,
|
||||
useSearchForm: false,
|
||||
showTableSetting: false,
|
||||
showIndexColumn: false
|
||||
})
|
||||
|
||||
async function customResetFunc() {
|
||||
|
|
@ -45,15 +47,18 @@ async function customResetFunc() {
|
|||
|
||||
async function customSubmitFunc() {
|
||||
try {
|
||||
const values = await validate()
|
||||
emit('next', values)
|
||||
emit('next', null)
|
||||
} catch (error) {}
|
||||
}
|
||||
|
||||
function handleEdit(record: EditRecordRow) {
|
||||
record.onEdit?.(true)
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.step2 {
|
||||
&-form {
|
||||
width: 450px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
import { listSimpleDictType } from '@/api/system/dict/type'
|
||||
import { listSimpleMenus } from '@/api/system/menu'
|
||||
import { FormSchema } from '@/components/Form'
|
||||
import { BasicColumn } from '@/components/Table'
|
||||
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export const basicInfoSchemas: FormSchema[] = [
|
||||
|
|
@ -128,3 +130,188 @@ export const basicInfoSchemas: FormSchema[] = [
|
|||
colProps: { span: 24 }
|
||||
}
|
||||
]
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '字段列名',
|
||||
dataIndex: 'columnName',
|
||||
width: 60
|
||||
},
|
||||
{
|
||||
title: '基础属性',
|
||||
children: [
|
||||
{
|
||||
title: '物理类型',
|
||||
dataIndex: 'dataType',
|
||||
editComponent: 'Select',
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
title: '字段描述',
|
||||
dataIndex: 'columnComment',
|
||||
editRow: true,
|
||||
editComponent: 'Input',
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
title: 'Java类型',
|
||||
dataIndex: 'javaType',
|
||||
editRow: true,
|
||||
editComponent: 'Select',
|
||||
editComponentProps: {
|
||||
options: [
|
||||
{
|
||||
label: 'Long',
|
||||
value: 'Long'
|
||||
},
|
||||
{
|
||||
label: 'String',
|
||||
value: 'String'
|
||||
},
|
||||
{
|
||||
label: 'Integer',
|
||||
value: 'Integer'
|
||||
},
|
||||
{
|
||||
label: 'Double',
|
||||
value: 'Double'
|
||||
},
|
||||
{
|
||||
label: 'BigDecimal',
|
||||
value: 'BigDecimal'
|
||||
},
|
||||
{
|
||||
label: 'LocalDateTime',
|
||||
value: 'LocalDateTime'
|
||||
},
|
||||
{
|
||||
label: 'Boolean',
|
||||
value: 'Boolean'
|
||||
}
|
||||
]
|
||||
},
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
title: 'java属性',
|
||||
dataIndex: 'javaField',
|
||||
editRow: true,
|
||||
editComponent: 'Input',
|
||||
width: 50
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '增删改查',
|
||||
children: [
|
||||
{
|
||||
title: '插入',
|
||||
dataIndex: 'createOperation',
|
||||
editRow: true,
|
||||
editComponent: 'Checkbox',
|
||||
editValueMap: (value) => {
|
||||
return value ? '是' : '否'
|
||||
},
|
||||
width: 40
|
||||
},
|
||||
{
|
||||
title: '编辑',
|
||||
dataIndex: 'updateOperation',
|
||||
editRow: true,
|
||||
editComponent: 'Checkbox',
|
||||
editValueMap: (value) => {
|
||||
return value ? '是' : '否'
|
||||
},
|
||||
width: 40
|
||||
},
|
||||
{
|
||||
title: '列表',
|
||||
dataIndex: 'listOperationResult',
|
||||
editRow: true,
|
||||
editComponent: 'Checkbox',
|
||||
editValueMap: (value) => {
|
||||
return value ? '是' : '否'
|
||||
},
|
||||
width: 40
|
||||
},
|
||||
{
|
||||
title: '查询',
|
||||
dataIndex: 'listOperation',
|
||||
editRow: true,
|
||||
editComponent: 'Checkbox',
|
||||
editValueMap: (value) => {
|
||||
return value ? '是' : '否'
|
||||
},
|
||||
width: 40
|
||||
},
|
||||
{
|
||||
title: '查询方式',
|
||||
dataIndex: 'listOperationCondition',
|
||||
editRow: true,
|
||||
editComponent: 'Checkbox',
|
||||
editComponentProps: {
|
||||
options: [
|
||||
{ label: '=', value: '=' },
|
||||
{ label: '!=', value: '!=' },
|
||||
{ label: '>', value: '>' },
|
||||
{ label: '>=', value: '>=' },
|
||||
{ label: '<', value: '<' },
|
||||
{ label: '<=', value: '<=' },
|
||||
{ label: 'LIKE', value: 'LIKE' },
|
||||
{ label: 'BETWEEN', value: 'BETWEEN' }
|
||||
]
|
||||
},
|
||||
width: 60
|
||||
},
|
||||
{
|
||||
title: '允许空',
|
||||
dataIndex: 'nullable',
|
||||
editRow: true,
|
||||
editComponent: 'Checkbox',
|
||||
editValueMap: (value) => {
|
||||
return value ? '是' : '否'
|
||||
},
|
||||
width: 40
|
||||
},
|
||||
{
|
||||
title: '显示类型',
|
||||
dataIndex: 'htmlType',
|
||||
editRow: true,
|
||||
editComponent: 'Select',
|
||||
editComponentProps: {
|
||||
options: [
|
||||
{ label: '文本框', value: 'input' },
|
||||
{ label: '文本域', value: 'textarea' },
|
||||
{ label: '下拉框', value: 'select' },
|
||||
{ label: '单选框', value: 'radio' },
|
||||
{ label: '复选框', value: 'checkbox' },
|
||||
{ label: '日期控件', value: 'datetime' },
|
||||
{ label: '图片上传', value: 'imageUpload' },
|
||||
{ label: '文件上传', value: 'fileUpload' },
|
||||
{ label: '富文本控件', value: 'editor' }
|
||||
]
|
||||
},
|
||||
width: 60
|
||||
},
|
||||
{
|
||||
title: '字典类型',
|
||||
dataIndex: 'dictType',
|
||||
editRow: true,
|
||||
editComponent: 'ApiSelect',
|
||||
editComponentProps: {
|
||||
api: () => listSimpleDictType(),
|
||||
labelField: 'name',
|
||||
valueField: 'type'
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '示例',
|
||||
dataIndex: 'example',
|
||||
editRow: true,
|
||||
editComponent: 'Input',
|
||||
width: 60
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
|
|
|||
Loading…
Reference in New Issue