编剧数据表前端验证
This commit is contained in:
parent
e65979d0ce
commit
0831d571a9
|
|
@ -13,7 +13,7 @@
|
||||||
>
|
>
|
||||||
<el-tabs v-model="activeName">
|
<el-tabs v-model="activeName">
|
||||||
<el-tab-pane label="基础信息" name="base">
|
<el-tab-pane label="基础信息" name="base">
|
||||||
<el-form-item label="表名称" prop="tableName">
|
<el-form-item label="表名称" prop="base.tableName">
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.base.tableName"
|
v-model="formData.base.tableName"
|
||||||
|
|
@ -21,7 +21,7 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="表描述" prop="tableComment">
|
<el-form-item label="表描述" prop="base.tableComment">
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.base.tableComment"
|
v-model="formData.base.tableComment"
|
||||||
|
|
@ -29,7 +29,7 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="实体类名称" prop="entityName">
|
<el-form-item label="实体类名称" prop="base.entityName">
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.base.entityName"
|
v-model="formData.base.entityName"
|
||||||
|
|
@ -38,9 +38,12 @@
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="作者">
|
<el-form-item label="作者" prop="base.authorName">
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input v-model="formData.base.authorName" />
|
<el-input
|
||||||
|
v-model="formData.base.authorName"
|
||||||
|
placeholder="请输入作者"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="备注">
|
<el-form-item label="备注">
|
||||||
|
|
@ -181,19 +184,13 @@
|
||||||
</el-table>
|
</el-table>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane label="生成配置" name="config">
|
<el-tab-pane label="生成配置" name="config">
|
||||||
<el-form-item label="模板类型" prop="template_type">
|
<el-form-item label="模板类型" prop="gen.genTpl" required>
|
||||||
<el-radio-group v-model="formData.gen.genTpl">
|
<el-radio-group v-model="formData.gen.genTpl">
|
||||||
<el-radio :label="GenTpl.CURD">单表(增删改查)</el-radio>
|
<el-radio :label="GenTpl.CURD">单表(增删改查)</el-radio>
|
||||||
<el-radio :label="GenTpl.TREE">树表(增删改查)</el-radio>
|
<el-radio :label="GenTpl.TREE">树表(增删改查)</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="生成方式" prop="generate_type">
|
<el-form-item label="模块名" prop="gen.moduleName">
|
||||||
<el-radio-group v-model="formData.gen.genType">
|
|
||||||
<el-radio :label="GenType.ZIP">压缩包下载</el-radio>
|
|
||||||
<el-radio :label="GenType.CUSTOM_PATH">自定义路径</el-radio>
|
|
||||||
</el-radio-group>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="模块名" prop="moduleName">
|
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.gen.moduleName"
|
v-model="formData.gen.moduleName"
|
||||||
|
|
@ -202,7 +199,7 @@
|
||||||
<div class="form-tips">生成文件所在模块名</div>
|
<div class="form-tips">生成文件所在模块名</div>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="功能名称" prop="functionName">
|
<el-form-item label="功能名称" prop="gen.functionName">
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.gen.functionName"
|
v-model="formData.gen.functionName"
|
||||||
|
|
@ -210,10 +207,16 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
<el-form-item label="生成方式" prop="gen.genType">
|
||||||
|
<el-radio-group v-model="formData.gen.genType">
|
||||||
|
<el-radio :label="GenType.ZIP">压缩包下载</el-radio>
|
||||||
|
<el-radio :label="GenType.CUSTOM_PATH">自定义路径</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-if="formData.gen.genType == GenType.CUSTOM_PATH"
|
v-if="formData.gen.genType == GenType.CUSTOM_PATH"
|
||||||
label="自定义路径"
|
label="自定义路径"
|
||||||
prop="treePrimary"
|
prop="gen.genPath"
|
||||||
>
|
>
|
||||||
<div class="w-80">
|
<div class="w-80">
|
||||||
<el-input
|
<el-input
|
||||||
|
|
@ -223,7 +226,7 @@
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<template v-if="formData.gen.genTpl == GenTpl.TREE">
|
<template v-if="formData.gen.genTpl == GenTpl.TREE">
|
||||||
<el-form-item label="树主键字段" prop="treePrimary">
|
<el-form-item label="树主键字段" prop="gen.treePrimary">
|
||||||
<el-select
|
<el-select
|
||||||
class="w-80"
|
class="w-80"
|
||||||
v-model="formData.gen.treePrimary"
|
v-model="formData.gen.treePrimary"
|
||||||
|
|
@ -237,7 +240,7 @@
|
||||||
/>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="树父级字段" prop="treeParent">
|
<el-form-item label="树父级字段" prop="gen.treeParent">
|
||||||
<el-select class="w-80" v-model="formData.gen.treeParent" clearable>
|
<el-select class="w-80" v-model="formData.gen.treeParent" clearable>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in formData.column"
|
v-for="item in formData.column"
|
||||||
|
|
@ -304,9 +307,12 @@ const formData = reactive({
|
||||||
|
|
||||||
const formRef = shallowRef<FormInstance>()
|
const formRef = shallowRef<FormInstance>()
|
||||||
const rules = reactive({
|
const rules = reactive({
|
||||||
table_name: [{ required: true, message: '请输入表名称', trigger: 'blur' }],
|
['base.tableName']: [{ required: true, message: '请输入表名称', trigger: 'blur' }],
|
||||||
table_comment: [{ required: true, message: '请输入表描述', trigger: 'blur' }],
|
['base.tableComment']: [{ required: true, message: '请输入表描述', trigger: 'blur' }],
|
||||||
module_name: [{ required: true, message: '请输入模块名', trigger: 'blur' }]
|
['base.entityName']: [{ required: true, message: '请输入实体类名称', trigger: 'blur' }],
|
||||||
|
['base.authorName']: [{ required: true, message: '请输入作者', trigger: 'blur' }],
|
||||||
|
['gen.moduleName']: [{ required: true, message: '请输入模块名', trigger: 'blur' }],
|
||||||
|
['gen.functionName']: [{ required: true, message: '请输入功能名称', trigger: 'blur' }]
|
||||||
})
|
})
|
||||||
|
|
||||||
const getDetails = async () => {
|
const getDetails = async () => {
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,7 @@
|
||||||
<el-button @click="handleExpand"> 展开/折叠 </el-button>
|
<el-button @click="handleExpand"> 展开/折叠 </el-button>
|
||||||
</div>
|
</div>
|
||||||
<el-table
|
<el-table
|
||||||
|
v-loading="loading"
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
class="mt-4"
|
class="mt-4"
|
||||||
size="large"
|
size="large"
|
||||||
|
|
@ -98,12 +99,19 @@ import feedback from '@/utils/feedback'
|
||||||
const tableRef = shallowRef<InstanceType<typeof ElTable>>()
|
const tableRef = shallowRef<InstanceType<typeof ElTable>>()
|
||||||
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
|
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
|
||||||
let isExpand = false
|
let isExpand = false
|
||||||
|
const loading = ref(false)
|
||||||
const showEdit = ref(false)
|
const showEdit = ref(false)
|
||||||
const lists = ref([])
|
const lists = ref([])
|
||||||
|
|
||||||
const getLists = async () => {
|
const getLists = async () => {
|
||||||
const data = await menuLists()
|
loading.value = true
|
||||||
lists.value = data
|
try {
|
||||||
|
const data = await menuLists()
|
||||||
|
lists.value = data
|
||||||
|
loading.value = false
|
||||||
|
} catch (error) {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleAdd = async (id?: number) => {
|
const handleAdd = async (id?: number) => {
|
||||||
|
|
|
||||||
|
|
@ -9,9 +9,9 @@
|
||||||
新增
|
新增
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-4" v-loading="pager.loading">
|
<div class="mt-4">
|
||||||
<div>
|
<div>
|
||||||
<el-table :data="pager.lists" size="large">
|
<el-table :data="pager.lists" size="large" v-loading="pager.loading">
|
||||||
<el-table-column prop="id" label="ID" min-width="100" />
|
<el-table-column prop="id" label="ID" min-width="100" />
|
||||||
<el-table-column prop="name" label="名称" min-width="150" />
|
<el-table-column prop="name" label="名称" min-width="150" />
|
||||||
<el-table-column
|
<el-table-column
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue