mirage
/
edu
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整代码生成器前端模板

This commit is contained in:
Jason 2022-08-15 18:57:45 +08:00
parent faf5d24d4e
commit c15936a19c
4 changed files with 134 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
admin/src/views/dev_tools/code/edit.vue
View File

@ -250,6 +250,16 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="树名称字段" prop="gen.treeName">
<el-select class="w-80" v-model="formData.gen.treeName" clearable>
<el-option
v-for="item in formData.column"
:key="item.id"
:value="item.columnName"
:label="`${item.columnName}：${item.columnComment}`"
/>
</el-select>
</el-form-item>
</template> </template>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -301,7 +311,8 @@ const formData = reactive({
subTableFk: '', subTableFk: '',
subTableName: '', subTableName: '',
treeParent: '', treeParent: '',
treePrimary: '' treePrimary: '',
treeName: ''
} }
}) })
@ -312,7 +323,10 @@ const rules = reactive({
['base.entityName']: [{ required: true, message: '请输入实体类名称', trigger: 'blur' }], ['base.entityName']: [{ required: true, message: '请输入实体类名称', trigger: 'blur' }],
['base.authorName']: [{ required: true, message: '请输入作者', trigger: 'blur' }], ['base.authorName']: [{ required: true, message: '请输入作者', trigger: 'blur' }],
['gen.moduleName']: [{ required: true, message: '请输入模块名', trigger: 'blur' }], ['gen.moduleName']: [{ required: true, message: '请输入模块名', trigger: 'blur' }],
['gen.functionName']: [{ required: true, message: '请输入功能名称', trigger: 'blur' }] ['gen.functionName']: [{ required: true, message: '请输入功能名称', trigger: 'blur' }],
['gen.treePrimary']: [{ required: true, message: '请选择树主键字段', trigger: 'blur' }],
['gen.treeParent']: [{ required: true, message: '请选择树父级字段', trigger: 'blur' }],
['gen.treeName']: [{ required: true, message: '请选择树名称字段', trigger: 'blur' }]
}) })
const getDetails = async () => { const getDetails = async () => {

71
server/like-generator/src/main/resources/vue/edit.vue.vm
View File

@ -1,17 +1,31 @@
<template> <template>
<div class="edit-popup"> <div class="edit-popup">
<popup <popup
ref="popupRef" ref="popupRef"
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true" :clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >
<el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules"> <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
#foreach ($column in $columns) #foreach ($column in $columns)
#if($column.isEdit) #if($column.isEdit)
#if($table.treeParent!="" && $column.javaField==$table.treeParent)
<el-form-item label="${column.columnComment}" prop="${column.javaField}">
<el-tree-select
class="flex-1"
v-model="formData.${column.javaField}"
:data="treeList"
clearable
node-key="${table.treePrimary}"
:props="{label: ${table.treeName}, value: ${table.treePrimary}, children: 'children'}"
:default-expand-all="true"
placeholder="请选择${column.columnComment}"
check-strictly
/>
</el-form-item>
#if($column.htmlType=="input") #if($column.htmlType=="input")
<el-form-item label="${column.columnComment}" prop="${column.javaField}"> <el-form-item label="${column.columnComment}" prop="${column.javaField}">
<el-input v-model="formData.name" placeholder="请输入${column.columnComment}" /> <el-input v-model="formData.name" placeholder="请输入${column.columnComment}" />
@ -22,20 +36,6 @@
<el-input-number v-model="formData.sort" /> <el-input-number v-model="formData.sort" />
</div> </div>
</el-form-item> </el-form-item>
#elseif($column.htmlType=="treeSelect")
<el-form-item label="${column.columnComment}" prop="${column.javaField}">
<el-tree-select
class="flex-1"
v-model="formData.${字段名}"
:data="treeList"
clearable
node-key="${树主键}"
:props="{label: ${显示的字段名如name}}"
:default-expand-all="true"
placeholder="请选择${字段描述}"
check-strictly
/>
</el-form-item>
#elseif($column.htmlType=="textarea") #elseif($column.htmlType=="textarea")
<el-form-item label="备注" prop="remark"> <el-form-item label="备注" prop="remark">
<el-input <el-input
@ -106,7 +106,13 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { FormInstance } from 'element-plus' import type { FormInstance } from 'element-plus'
import { ${moduleName}Edit, ${moduleName}Add, ${moduleName}All } from '@/api/${moduleName}' import {
${moduleName}Edit,
${moduleName}Add,
#if($table.treePrimary && $table.treeParent)
${moduleName}Lists
#end
} from '@/api/${moduleName}'
import Popup from '@/components/popup/index.vue' import Popup from '@/components/popup/index.vue'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
import type { PropType } from 'vue' import type { PropType } from 'vue'
@ -128,8 +134,12 @@
}) })
const formData = reactive({ const formData = reactive({
${primaryKey}: '',
#foreach ($column in $columns) #foreach ($column in $columns)
#if($column.isEdit) #if($column.isEdit)
#if($column.htmlType=="checkbox")
${column.javaField}: [],
#else
${column.javaField}: '', ${column.javaField}: '',
#end #end
#end #end
@ -155,7 +165,13 @@
const handleSubmit = async () => { const handleSubmit = async () => {
await formRef.value?.validate() await formRef.value?.validate()
mode.value == 'edit' ? await ${moduleName}Edit(formData) : await${moduleName}Add(formData) const data = {...formData}
#foreach ($column in $columns)
#if($column.htmlType == "checkbox")
data.${column.javaField} = data.${column.javaField}.join(",");
#end
#end
mode.value == 'edit' ? await ${moduleName}Edit(data) : await ${moduleName}Add(data)
popupRef.value?.close() popupRef.value?.close()
feedback.msgSuccess('操作成功') feedback.msgSuccess('操作成功')
emit('success') emit('success')
@ -171,6 +187,11 @@
if (data[key] != null && data[key] != undefined) { if (data[key] != null && data[key] != undefined) {
//@ts-ignore //@ts-ignore
formData[key] = data[key] formData[key] = data[key]
#foreach ($column in $columns)
#if($column.htmlType == "checkbox")
formData.${column.javaField} = form.${column.javaField}.split(',')
#end
#end
} }
} }
} }
@ -181,9 +202,9 @@
#if($table.treePrimary && $table.treeParent) #if($table.treePrimary && $table.treeParent)
// 树表 // 树表
const getLists = () => { const getLists = async () => {
const data: any = await ${moduleName}List() const data: any = await ${moduleName}List()
const item = { id: 0, menuName: '顶级', children: [] } const item = { ${table.treePrimary}: 0, ${table.treeName}: '顶级', children: [] }
item.children = data item.children = data
treeList.value.push(item) treeList.value.push(item)
} }

95
server/like-generator/src/main/resources/vue/index-tree.vue.vm
View File

@ -14,19 +14,19 @@
#elseif($column.htmlType=="select") #elseif($column.htmlType=="select")
<el-form-item label="${column.columnComment}" prop="${column.javaField}"> <el-form-item label="${column.columnComment}" prop="${column.javaField}">
<el-select <el-select
v-model="queryParams.${column.javaField}" v-model="queryParams.${column.javaField}"
class="w-56" class="w-56"
clearable clearable
> >
#if($column.dictType=="") #if($column.dictType=="")
<el-option label="请选择字典生成" value="" /> <el-option label="请选择字典生成" value="" />
#else #else
<el-option label="全部" value="" /> <el-option label="全部" value="" />
<el-option <el-option
v-for="(item, index) in dictData.${column.dictType}" v-for="(item, index) in dictData.${column.dictType}"
:key="index" :key="index"
:label="item.name" :label="item.name"
:value="item.value" :value="item.value"
/> />
#end #end
</el-select> </el-select>
@ -55,65 +55,58 @@
<el-button @click="handleExpand"> 展开/折叠 </el-button> <el-button @click="handleExpand"> 展开/折叠 </el-button>
</div> </div>
<el-table <el-table
v-loading="loading" v-loading="loading"
ref="tableRef" ref="tableRef"
class="mt-4" class="mt-4"
size="large" size="large"
:data="lists" :data="lists"
row-key="id" row-key="${table.treePrimary}"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
> >
#foreach ($column in $columns) #foreach ($column in $columns)
#if($column.isList) #if($column.isList)
#if($column.htmlType=="imageUpload") #if($column.htmlType=="imageUpload")
<el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="80"> #if($column.htmlType=="select" || $column.htmlType=="radio" $column.htmlType=="checkbox")
<template #default="{ row }"> <el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="100">
<div class="flex"> <template #default="{ row }">
<icon :name="row.${column.javaField}" :size="20" /> <dict-value :options="dictData.${column.dictType}" :value="row.${column.javaField}" />
</div> </template>
</template> </el-table-column>
</el-table-column> #elseif($column.htmlType=="imageUpload")
#elseif($column.htmlType=="number") <el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="60">
<el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="100" /> <template #default="{ row }">
#elseif($column.htmlType=="datetime") <image-contain width="50px" height="50px" :src="row.${column.javaField}" />
<el-table-column </template>
label="${column.columnComment}" </el-table-column>
prop="${column.javaField}" #else
min-width="180" <el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="100" />
></el-table-column> #end
#else
<el-table-column
label="${column.columnComment}"
prop="${column.javaField}"
min-width="150"
show-overflow-tooltip
/>
#end #end
#end #end
#end #end
<el-table-column label="操作" width="160" fixed="right"> <el-table-column label="操作" width="160" fixed="right">
<template #default="{ row }"> <template #default="{ row }">
<el-button <el-button
v-perms="['${moduleName}:add']" v-perms="['${moduleName}:add']"
type="primary" type="primary"
link link
@click="handleAdd(row.id)" @click="handleAdd(row.${table.treePrimary})"
> >
新增 新增
</el-button> </el-button>
<el-button <el-button
v-perms="['${moduleName}:edit']" v-perms="['${moduleName}:edit']"
type="primary" type="primary"
link link
@click="handleEdit(row)" @click="handleEdit(row)"
> >
编辑 编辑
</el-button> </el-button>
<el-button <el-button
v-perms="['${moduleName}:del']" v-perms="['${moduleName}:del']"
type="danger" type="danger"
link link
@click="handleDelete(row.id)" @click="handleDelete(row.${primaryKey})"
> >
删除 删除
</el-button> </el-button>
@ -154,12 +147,12 @@
} }
} }
const handleAdd = async (id?: number) => { const handleAdd = async (${table.treePrimary}?: number) => {
showEdit.value = true showEdit.value = true
await nextTick() await nextTick()
if (id) { if (${table.treePrimary}) {
editRef.value?.setFormData({ editRef.value?.setFormData({
pid: id ${table.treeParent}: ${table.treePrimary}
}) })
} }
editRef.value?.open('add') editRef.value?.open('add')

43
server/like-generator/src/main/resources/vue/index.vue.vm
View File

@ -46,36 +46,44 @@
</el-card> </el-card>
<el-card class="!border-none mt-4" shadow="never"> <el-card class="!border-none mt-4" shadow="never">
<div> <div>
<el-button v-perms="['${moduleName}/add']" type="primary" @click="handleAdd()"> <el-button v-perms="['${moduleName}:add']" type="primary" @click="handleAdd()">
<template #icon> <template #icon>
<icon name="el-icon-Plus" /> <icon name="el-icon-Plus" />
</template> </template>
新增 新增
</el-button> </el-button>
<el-button
v-perms="['${moduleName}:del']"
:disabled="!selectData.length"
type="danger"
@click="handleDelete(selectData)"
>
<template #icon>
<icon name="el-icon-Delete" />
</template>
删除
</el-button>
</div> </div>
<el-table class="mt-4" size="large" v-loading="pager.loading" :data="pager.lists"> <el-table class="mt-4"
size="large"
v-loading="pager.loading"
:data="pager.lists"
@selection-change="handleSelectionChange"
>
#foreach ($column in $columns) #foreach ($column in $columns)
#if($column.isList) #if($column.isList)
#if($column.htmlType=="select") #if($column.htmlType=="select" || $column.htmlType=="radio" $column.htmlType=="checkbox")
<el-table-column label="${column.columnComment}" prop="isStop" min-width="100"> <el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="100">
<template #default="{ row }"> <template #default="{ row }">
<dict-value :options="dictData.${column.dictType}" :value="row.${column.javaField}" /> <dict-value :options="dictData.${column.dictType}" :value="row.${column.javaField}" />
</template> </template>
</el-table-column> </el-table-column>
#elseif($column.htmlType=="datetime")
<el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="180" />
#elseif($column.htmlType=="imageUpload") #elseif($column.htmlType=="imageUpload")
<el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="60"> <el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="60">
<template #default="{ row }"> <template #default="{ row }">
<image-contain width="50px" height="50px" :src="row.${column.javaField}" /> <image-contain width="50px" height="50px" :src="row.${column.javaField}" />
</template> </template>
</el-table-column> </el-table-column>
#elseif($column.htmlType=="select" || $column.htmlType=="radio")
<el-table-column label="${column.columnComment}" prop="${column.javaField}">
<template #default="{ row }">
<dict-value :options="dictData.${column.dictType}" :value="row.${column.javaField}" />
</template>
</el-table-column>
#else #else
<el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="100" /> <el-table-column label="${column.columnComment}" prop="${column.javaField}" min-width="100" />
#end #end
@ -95,7 +103,7 @@
v-perms="['${moduleName}:del']" v-perms="['${moduleName}:del']"
type="danger" type="danger"
link link
@click="handleDelete(row.id)" @click="handleDelete(row.${primaryKey})"
> >
删除 删除
</el-button> </el-button>
@ -144,8 +152,13 @@
#end #end
#end #end
}>([${dictFields}]) }>([${dictFields}])
#end #end
const selectData = ref<any[]>([])
const handleSelectionChange = (selection: any[]) => {
selectData.value = selection.map(item => item.${primaryKey})
}
const handleAdd = async () => { const handleAdd = async () => {
showEdit.value = true showEdit.value = true
await nextTick() await nextTick()
@ -159,7 +172,7 @@
editRef.value?.setFormData(data) editRef.value?.setFormData(data)
} }
const handleDelete = async (${primaryKey}: number) => { const handleDelete = async (${primaryKey}: number || number[]) => {
await ${moduleName}Delete({ ${primaryKey} }) await ${moduleName}Delete({ ${primaryKey} })
feedback.msgSuccess('删除成功') feedback.msgSuccess('删除成功')
getLists() getLists()