ruoyi-modules/ruoyi-generator/src/main/java/org/dromara/generator/service/GenTableServiceImpl.java | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
ruoyi-modules/ruoyi-generator/src/main/java/org/dromara/generator/util/VelocityUtils.java | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
ruoyi-modules/ruoyi-generator/src/main/resources/vm/ts/api.ts.vm | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
ruoyi-modules/ruoyi-generator/src/main/resources/vm/ts/types.ts.vm | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
ruoyi-modules/ruoyi-generator/src/main/resources/vm/vue/index-tree.vue.vm | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
ruoyi-modules/ruoyi-generator/src/main/resources/vm/vue/index.vue.vm | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
ruoyi-modules/ruoyi-generator/src/main/java/org/dromara/generator/service/GenTableServiceImpl.java
@@ -262,7 +262,7 @@ // è·å模æ¿å表 List<String> templates = VelocityUtils.getTemplateList(table.getTplCategory()); for (String template : templates) { if (!StringUtils.containsAny(template, "sql.vm", "api.js.vm", "index.vue.vm", "index-tree.vue.vm")) { if (!StringUtils.containsAny(template, "sql.vm", "api.ts.vm", "types.ts.vm", "index.vue.vm", "index-tree.vue.vm")) { // æ¸²ææ¨¡æ¿ StringWriter sw = new StringWriter(); Template tpl = Velocity.getTemplate(template, Constants.UTF8); ruoyi-modules/ruoyi-generator/src/main/java/org/dromara/generator/util/VelocityUtils.java
@@ -127,7 +127,8 @@ } else { templates.add("vm/sql/sql.vm"); } templates.add("vm/js/api.js.vm"); templates.add("vm/ts/api.ts.vm"); templates.add("vm/ts/types.ts.vm"); if (GenConstants.TPL_CRUD.equals(tplCategory)) { templates.add("vm/vue/index.vue.vm"); } else if (GenConstants.TPL_TREE.equals(tplCategory)) { @@ -176,8 +177,10 @@ fileName = StringUtils.format("{}/{}Mapper.xml", mybatisPath, className); } else if (template.contains("sql.vm")) { fileName = businessName + "Menu.sql"; } else if (template.contains("api.js.vm")) { fileName = StringUtils.format("{}/api/{}/{}.js", vuePath, moduleName, businessName); } else if (template.contains("api.ts.vm")) { fileName = StringUtils.format("{}/api/{}/{}/index.ts", vuePath, moduleName, businessName); } else if (template.contains("types.ts.vm")) { fileName = StringUtils.format("{}/api/{}/{}/types.ts", vuePath, moduleName, businessName); } else if (template.contains("index.vue.vm")) { fileName = StringUtils.format("{}/views/{}/{}/index.vue", vuePath, moduleName, businessName); } else if (template.contains("index-tree.vue.vm")) { ruoyi-modules/ruoyi-generator/src/main/resources/vm/ts/api.ts.vm
¶Ô±ÈÐÂÎļþ @@ -0,0 +1,62 @@ import request from '@/utils/request'; import { AxiosPromise } from 'axios'; import { ${BusinessName}VO, ${BusinessName}Form, ${BusinessName}Query } from './types'; /** * æ¥è¯¢${functionName}å表 * @param query * @returns {*} */ export const list${BusinessName} = (#if(${treeCode})query?: ${BusinessName}Query#else query: ${BusinessName}Query#end): AxiosPromise<${BusinessName}VO[]> => { return request({ url: '/${moduleName}/${businessName}/list', method: 'get', params: query }); }; /** * æ¥è¯¢${functionName}è¯¦ç» * @param ${pkColumn.javaField} */ export const get${BusinessName} = (${pkColumn.javaField}: string | number): AxiosPromise<${BusinessName}VO> => { return request({ url: '/${moduleName}/${businessName}/' + ${pkColumn.javaField}, method: 'get' }); }; /** * æ°å¢${functionName} * @param data */ export const add${BusinessName} = (data: ${BusinessName}Form) => { return request({ url: '/${moduleName}/${businessName}', method: 'post', data: data }); }; /** * ä¿®æ¹${functionName} * @param data */ export const update${BusinessName} = (data: ${BusinessName}Form) => { return request({ url: '/${moduleName}/${businessName}', method: 'put', data: data }); }; /** * å é¤${functionName} * @param ${pkColumn.javaField} */ export const del${BusinessName} = (${pkColumn.javaField}: string | number | Array<string | number>) => { return request({ url: '/${moduleName}/${businessName}/' + ${pkColumn.javaField}, method: 'delete' }); }; ruoyi-modules/ruoyi-generator/src/main/resources/vm/ts/types.ts.vm
¶Ô±ÈÐÂÎļþ @@ -0,0 +1,44 @@ export interface ${BusinessName}VO { #foreach ($column in $columns) #if($column.insert || $column.edit) /** * $column.columnComment */ $column.javaField:#if($column.javaField.indexOf("id") != -1 || $column.javaField.indexOf("Id") != -1) string | number; #elseif($column.javaType == 'Long' || $column.javaType == 'Integer' || $column.javaType == 'Double' || $column.javaType == 'Float' || $column.javaType == 'BigDecimal') number; #elseif($column.javaType == 'Boolean') boolean; #else string; #end #end #end } export interface ${BusinessName}Form extends BaseEntity{ #foreach ($column in $columns) #if($column.insert || $column.edit) /** * $column.columnComment */ $column.javaField?:#if($column.javaField.indexOf("id") != -1 || $column.javaField.indexOf("Id") != -1) string | number; #elseif($column.javaType == 'Long' || $column.javaType == 'Integer' || $column.javaType == 'Double' || $column.javaType == 'Float' || $column.javaType == 'BigDecimal') number; #elseif($column.javaType == 'Boolean') boolean; #else string; #end #end #end } export interface ${BusinessName}Query #if(!${treeCode})extends PageQuery #end{ #foreach ($column in $columns) #if($column.query) /** * $column.columnComment */ $column.javaField?:#if($column.javaField.indexOf("id") != -1 || $column.javaField.indexOf("Id") != -1) string | number; #elseif($column.javaType == 'Long' || $column.javaType == 'Integer' || $column.javaType == 'Double' || $column.javaType == 'Float' || $column.javaType == 'BigDecimal') number; #elseif($column.javaType == 'Boolean') boolean; #else string; #end #end #end } ruoyi-modules/ruoyi-generator/src/main/resources/vm/vue/index-tree.vue.vm
@@ -1,6 +1,8 @@ <template> <div class="app-container"> <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px"> <div class="p-2"> <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> <div class="search" v-show="showSearch"> <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px"> #foreach($column in $columns) #if($column.query) #set($dictType=$column.dictType) @@ -12,90 +14,95 @@ #set($comment=$column.columnComment) #end #if($column.htmlType == "input" || $column.htmlType == "textarea") <el-form-item label="${comment}" prop="${column.javaField}"> <el-input v-model="queryParams.${column.javaField}" placeholder="请è¾å ¥${comment}" clearable @keyup.enter="handleQuery" /> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-input v-model="queryParams.${column.javaField}" placeholder="请è¾å ¥${comment}" clearable @keyup.enter="handleQuery" /> </el-form-item> #elseif(($column.htmlType == "select" || $column.htmlType == "radio") && "" != $dictType) <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> #elseif(($column.htmlType == "select" || $column.htmlType == "radio") && $dictType) <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option label="è¯·éæ©åå ¸çæ" value="" /> </el-select> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option label="è¯·éæ©åå ¸çæ" value="" /> </el-select> </el-form-item> #elseif($column.htmlType == "datetime" && $column.queryType != "BETWEEN") <el-form-item label="${comment}" prop="${column.javaField}"> <el-date-picker clearable v-model="queryParams.${column.javaField}" type="date" value-format="YYYY-MM-DD" placeholder="éæ©${comment}"> </el-date-picker> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-date-picker clearable v-model="queryParams.${column.javaField}" type="date" value-format="YYYY-MM-DD" placeholder="éæ©${comment}" /> </el-form-item> #elseif($column.htmlType == "datetime" && $column.queryType == "BETWEEN") <el-form-item label="${comment}" style="width: 308px"> <el-date-picker v-model="daterange${AttrName}" value-format="YYYY-MM-DD HH:mm:ss" type="daterange" range-separator="-" start-placeholder="å¼å§æ¥æ" end-placeholder="ç»ææ¥æ" :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" ></el-date-picker> </el-form-item> <el-form-item label="${comment}" style="width: 308px"> <el-date-picker v-model="daterange${AttrName}" value-format="YYYY-MM-DD HH:mm:ss" type="daterange" range-separator="-" start-placeholder="å¼å§æ¥æ" end-placeholder="ç»ææ¥æ" :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" /> </el-form-item> #end #end #end <el-form-item> <el-button type="primary" icon="Search" @click="handleQuery">æç´¢</el-button> <el-button icon="Refresh" @click="resetQuery">éç½®</el-button> </el-form-item> </el-form> <el-form-item> <el-button type="primary" icon="Search" @click="handleQuery">æç´¢</el-button> <el-button icon="Refresh" @click="resetQuery">éç½®</el-button> </el-form-item> </el-form> </div> </transition> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['${moduleName}:${businessName}:add']" >æ°å¢</el-button> </el-col> <el-col :span="1.5"> <el-button type="info" plain icon="Sort" @click="toggleExpandAll" >å±å¼/æå </el-button> </el-col> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> </el-row> <el-table v-if="refreshTable" v-loading="loading" :data="${businessName}List" row-key="${treeCode}" :default-expand-all="isExpandAll" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" > <el-card shadow="never"> <template #header> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> <el-button type="primary" plain icon="Plus" @click="handleAdd()" v-hasPermi="['${moduleName}:${businessName}:add'] >æ°å¢</el-button> </el-col> <el-col :span="1.5"> <el-button type="info" plain icon="Sort" @click="handleToggleExpandAll" >å±å¼/æå </el-button> </el-col> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> </el-row> </template> <el-table v-loading="loading" :data="${businessName}List" row-key="${treeCode}" :default-expand-all="isExpandAll" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" ref="${businessName}TableRef" > #foreach($column in $columns) #set($javaField=$column.javaField) #set($parentheseIndex=$column.columnComment.indexOf("ï¼")) @@ -106,47 +113,53 @@ #end #if($column.pk) #elseif($column.list && $column.htmlType == "datetime") <el-table-column label="${comment}" align="center" prop="${javaField}" width="180"> <template #default="scope"> <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span> </template> </el-table-column> #elseif($column.list && $column.htmlType == "imageUpload") <el-table-column label="${comment}" align="center" prop="${javaField}" width="100"> <el-table-column label="${comment}" align="center" prop="${javaField}" width="180"> <template #default="scope"> <image-preview :src="scope.row.${javaField}" :width="50" :height="50"/> <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span> </template> </el-table-column> </el-table-column> #elseif($column.list && $column.htmlType == "imageUpload") <el-table-column label="${comment}" align="center" prop="${javaField}" width="100"> <template #default="scope"> <image-preview :src="scope.row.${javaField}" :width="50" :height="50"/> </template> </el-table-column> #elseif($column.list && $column.dictType && "" != $column.dictType) <el-table-column label="${comment}" align="center" prop="${javaField}"> <template #default="scope"> <el-table-column label="${comment}" align="center" prop="${javaField}"> <template #default="scope"> #if($column.htmlType == "checkbox") <dict-tag :options="${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/> <dict-tag :options="${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/> #else <dict-tag :options="${column.dictType}" :value="scope.row.${javaField}"/> <dict-tag :options="${column.dictType}" :value="scope.row.${javaField}"/> #end </template> </el-table-column> </template> </el-table-column> #elseif($column.list && "" != $javaField) #if(${foreach.index} == 1) <el-table-column label="${comment}" prop="${javaField}" /> <el-table-column label="${comment}" prop="${javaField}" /> #else <el-table-column label="${comment}" align="center" prop="${javaField}" /> <el-table-column label="${comment}" align="center" prop="${javaField}" /> #end #end #end <el-table-column label="æä½" align="center" class-name="small-padding fixed-width"> <el-table-column label="æä½" align="center" class-name="small-padding fixed-width"> <template #default="scope"> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['${moduleName}:${businessName}:edit']">ä¿®æ¹</el-button> <el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['${moduleName}:${businessName}:add']">æ°å¢</el-button> <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['${moduleName}:${businessName}:remove']">å é¤</el-button> <el-tooltip content="ä¿®æ¹" placement="top"> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['${moduleName}:${businessName}:edit']" /> </el-tooltip> <el-tooltip content="æ°å¢" placement="top"> <el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['${moduleName}:${businessName}:add']" /> </el-tooltip> <el-tooltip content="å é¤" placement="top"> <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['${moduleName}:${businessName}:remove']" /> </el-tooltip> </template> </el-table-column> </el-table> </el-table-column> </el-table> </el-card> <!-- æ·»å æä¿®æ¹${functionName}å¯¹è¯æ¡ --> <el-dialog :title="title" v-model="open" width="500px" append-to-body> <el-form ref="${businessName}Ref" :model="form" :rules="rules" label-width="80px"> <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body> <el-form ref="${businessName}FormRef" :model="form" :rules="rules" label-width="80px"> #foreach($column in $columns) #set($field=$column.javaField) #if($column.insert && !$column.pk) @@ -248,8 +261,8 @@ v-model="form.${field}" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="éæ©${comment}"> </el-date-picker> placeholder="éæ©${comment}" /> </el-form-item> #elseif($column.htmlType == "textarea") <el-form-item label="${comment}" prop="${field}"> @@ -269,24 +282,43 @@ </div> </template> <script setup name="${BusinessName}"> <script setup name="${BusinessName}" lang="ts"> import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}"; import { ${BusinessName}VO, ${BusinessName}Query, ${BusinessName}Form } from '@/api/${moduleName}/${businessName}/types'; import { ComponentInternalInstance } from 'vue'; import { ElForm, ElTable } from 'element-plus'; const { proxy } = getCurrentInstance(); type ${BusinessName}Option = { ${treeCode}: number; ${treeName}: string; children?: ${BusinessName}Option[]; } const { proxy } = getCurrentInstance() as ComponentInternalInstance;; #if(${dicts} != '') #set($dictsNoSymbol=$dicts.replace("'", "")) const { ${dictsNoSymbol} } = proxy.useDict(${dicts}); const { ${dictsNoSymbol} } = toRefs<any>(proxy?.useDict(${dicts})); #end const ${businessName}List = ref([]); const ${businessName}Options = ref([]); const open = ref(false); const ${businessName}List = ref<${BusinessName}VO[]>([]); const ${businessName}Options = ref<${BusinessName}Option[]>([]); const buttonLoading = ref(false); const loading = ref(true); const showSearch = ref(true); const title = ref(""); const isExpandAll = ref(true); const refreshTable = ref(true); const loading = ref(false); const queryFormRef = ref(ElForm); const ${businessName}FormRef = ref(ElForm); const ${businessName}TableRef = ref(ElTable) const dialog = reactive<DialogOption>({ visible: false, title: '' }); #foreach ($column in $columns) #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN") #set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)}) @@ -294,8 +326,20 @@ #end #end const data = reactive({ form: {}, const initFormData: ${BusinessName}Form = { #foreach ($column in $columns) #if($column.insert || $column.edit) #if($column.htmlType == "checkbox") $column.javaField: []#if($foreach.count != $columns.size()),#end #else $column.javaField: undefined#if($foreach.count != $columns.size()),#end #end #end #end } const data = reactive<PageData<${BusinessName}Form, ${BusinessName}Query>>({ form: {...initFormData}, queryParams: { #foreach ($column in $columns) #if($column.query) @@ -325,7 +369,7 @@ const { queryParams, form, rules } = toRefs(data); /** æ¥è¯¢${functionName}å表 */ function getList() { const getList = async () => { loading.value = true; #foreach ($column in $columns) #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN") @@ -342,107 +386,107 @@ } #end #end list${BusinessName}(queryParams.value).then(response => { ${businessName}List.value = proxy.handleTree(response.data, "${treeCode}", "${treeParentCode}"); const res = await list${BusinessName}(queryParams.value); const data = proxy?.handleTree<${BusinessName}VO>(res.data, "${treeCode}", "${treeParentCode}"); if (data) { ${businessName}List.value = data; loading.value = false; }); } } /** æ¥è¯¢${functionName}䏿æ ç»æ */ function getTreeselect() { list${BusinessName}().then(response => { ${businessName}Options.value = []; const data = { ${treeCode}: 0, ${treeName}: '顶级èç¹', children: [] }; data.children = proxy.handleTree(response.data, "${treeCode}", "${treeParentCode}"); ${businessName}Options.value.push(data); }); const getTreeselect = async () => { const res = await list${BusinessName}(); ${businessName}Options.value = []; const data: ${BusinessName}Option = { ${treeCode}: 0, ${treeName}: '顶级èç¹', children: [] }; data.children = proxy?.handleTree<${BusinessName}Option>(res.data, "${treeCode}", "${treeParentCode}"); ${businessName}Options.value.push(data); } // åæ¶æé® function cancel() { open.value = false; const cancel = () => { reset(); dialog.visible = false; } // 表åéç½® function reset() { form.value = { #foreach ($column in $columns) #if($column.insert || $column.edit) #if($column.htmlType == "checkbox") $column.javaField: []#if($foreach.count != $columns.size()),#end #else $column.javaField: null#if($foreach.count != $columns.size()),#end #end #end #end }; proxy.resetForm("${businessName}Ref"); const reset = () => { form.value = {...initFormData} ${businessName}FormRef.value.resetFields(); } /** æç´¢æé®æä½ */ function handleQuery() { const handleQuery = () => { getList(); } /** éç½®æé®æä½ */ function resetQuery() { const resetQuery = () => { #foreach ($column in $columns) #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN") #set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)}) daterange${AttrName}.value = []; #end #end proxy.resetForm("queryRef"); queryFormRef.value.resetFields(); handleQuery(); } /** æ°å¢æé®æä½ */ function handleAdd(row) { reset(); getTreeselect(); if (row != null && row.${treeCode}) { form.value.${treeParentCode} = row.${treeCode}; } else { form.value.${treeParentCode} = 0; } open.value = true; title.value = "æ·»å ${functionName}"; } /** å±å¼/æå æä½ */ function toggleExpandAll() { refreshTable.value = false; isExpandAll.value = !isExpandAll.value; const handleAdd = (row?: ${BusinessName}VO) => { dialog.visible = true; dialog.title = "æ·»å ${functionName}"; nextTick(() => { refreshTable.value = true; reset(); getTreeselect(); if (row != null && row.${treeCode}) { form.value.${treeParentCode} = row.${treeCode}; } else { form.value.${treeParentCode} = 0; } }); } /** å±å¼/æå æä½ */ const handleToggleExpandAll = () => { isExpandAll.value = !isExpandAll.value; toggleExpandAll(${businessName}List.value, isExpandAll.value) } /** å±å¼/æå æä½ */ const toggleExpandAll = (data: ${BusinessName}VO[], status: boolean) => { data.forEach((item) => { ${businessName}TableRef.value.toggleRowExpansion(item, status) if (item.children && item.children.length > 0) toggleExpandAll(item.children, status) }) } /** ä¿®æ¹æé®æä½ */ async function handleUpdate(row) { const handleUpdate = (row: ${BusinessName}VO) => { loading.value = true; reset(); await getTreeselect(); if (row != null) { form.value.${treeParentCode} = row.${treeCode}; } get${BusinessName}(row.${pkColumn.javaField}).then(response => { loading.value = false; form.value = response.data; dialog.visible = true; dialog.title = "ä¿®æ¹${functionName}"; nextTick(async () => { reset(); await getTreeselect(); if (row != null) { form.value.${treeParentCode} = row.${treeCode}; } get${BusinessName}(row.${pkColumn.javaField}).then(response => { loading.value = false; form.value = response.data; #foreach ($column in $columns) #if($column.htmlType == "checkbox") form.value.$column.javaField = form.value.${column.javaField}.split(","); form.value.$column.javaField = form.value.${column.javaField}.split(","); #end #end open.value = true; title.value = "ä¿®æ¹${functionName}"; }); }); } /** æäº¤æé® */ function submitForm() { proxy.#[[$]]#refs["${businessName}Ref"].validate(valid => { const submitForm = () => { ${businessName}FormRef.value.validate((valid: boolean) => { if (valid) { buttonLoading.value = true; #foreach ($column in $columns) @@ -450,41 +494,28 @@ form.value.$column.javaField = form.value.${column.javaField}.join(","); #end #end if (form.value.${pkColumn.javaField} != null) { update${BusinessName}(form.value).then(response => { proxy.#[[$modal]]#.msgSuccess("ä¿®æ¹æå"); open.value = false; getList(); }).finally(() => { buttonLoading.value = false; }); if (form.value.${pkColumn.javaField}) { update${BusinessName}(form.value).finally(() => buttonLoading.value = false); } else { add${BusinessName}(form.value).then(response => { proxy.#[[$modal]]#.msgSuccess("æ°å¢æå"); open.value = false; getList(); }).finally(() => { buttonLoading.value = false; }); add${BusinessName}(form.value).finally(() => buttonLoading.value = false); } proxy?.#[[$modal]]#.msgSuccess("æä½æå"); dialog.visible = false; getList(); } }); } /** å é¤æé®æä½ */ function handleDelete(row) { proxy.#[[$modal]]#.confirm('æ¯å¦ç¡®è®¤å é¤${functionName}ç¼å·ä¸º"' + row.${pkColumn.javaField} + '"çæ°æ®é¡¹ï¼').then(function() { loading.value = true; return del${BusinessName}(row.${pkColumn.javaField}); }).then(() => { loading.value = false; getList(); proxy.#[[$modal]]#.msgSuccess("å 餿å"); }).catch(() => { }).finally(() => { loading.value = false; }); const handleDelete = async (row: ${BusinessName}VO) => { await proxy?.#[[$modal]]#.confirm('æ¯å¦ç¡®è®¤å é¤${functionName}ç¼å·ä¸º"' + row.${pkColumn.javaField} + '"çæ°æ®é¡¹ï¼'); loading.value = true; await del${BusinessName}(row.${pkColumn.javaField}).finally(() => loading.value = false); await getList(); proxy?.#[[$modal]]#.msgSuccess("å 餿å"); } getList(); onMounted(() => { getList(); }); </script> ruoyi-modules/ruoyi-generator/src/main/resources/vm/vue/index.vue.vm
@@ -1,6 +1,8 @@ <template> <div class="app-container"> <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px"> <div class="p-2"> <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> <div class="search" v-show="showSearch"> <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px"> #foreach($column in $columns) #if($column.query) #set($dictType=$column.dictType) @@ -12,105 +14,110 @@ #set($comment=$column.columnComment) #end #if($column.htmlType == "input" || $column.htmlType == "textarea") <el-form-item label="${comment}" prop="${column.javaField}"> <el-input v-model="queryParams.${column.javaField}" placeholder="请è¾å ¥${comment}" clearable @keyup.enter="handleQuery" /> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-input v-model="queryParams.${column.javaField}" placeholder="请è¾å ¥${comment}" clearable @keyup.enter="handleQuery" /> </el-form-item> #elseif(($column.htmlType == "select" || $column.htmlType == "radio") && "" != $dictType) <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> #elseif(($column.htmlType == "select" || $column.htmlType == "radio") && $dictType) <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option label="è¯·éæ©åå ¸çæ" value="" /> </el-select> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-select v-model="queryParams.${column.javaField}" placeholder="è¯·éæ©${comment}" clearable> <el-option label="è¯·éæ©åå ¸çæ" value="" /> </el-select> </el-form-item> #elseif($column.htmlType == "datetime" && $column.queryType != "BETWEEN") <el-form-item label="${comment}" prop="${column.javaField}"> <el-date-picker clearable v-model="queryParams.${column.javaField}" type="date" value-format="YYYY-MM-DD" placeholder="è¯·éæ©${comment}"> </el-date-picker> </el-form-item> <el-form-item label="${comment}" prop="${column.javaField}"> <el-date-picker clearable v-model="queryParams.${column.javaField}" type="date" value-format="YYYY-MM-DD" placeholder="è¯·éæ©${comment}" /> </el-form-item> #elseif($column.htmlType == "datetime" && $column.queryType == "BETWEEN") <el-form-item label="${comment}" style="width: 308px"> <el-date-picker v-model="daterange${AttrName}" value-format="YYYY-MM-DD HH:mm:ss" type="daterange" range-separator="-" start-placeholder="å¼å§æ¥æ" end-placeholder="ç»ææ¥æ" :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" ></el-date-picker> </el-form-item> <el-form-item label="${comment}" style="width: 308px"> <el-date-picker v-model="daterange${AttrName}" value-format="YYYY-MM-DD HH:mm:ss" type="daterange" range-separator="-" start-placeholder="å¼å§æ¥æ" end-placeholder="ç»ææ¥æ" :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" /> </el-form-item> #end #end #end <el-form-item> <el-button type="primary" icon="Search" @click="handleQuery">æç´¢</el-button> <el-button icon="Refresh" @click="resetQuery">éç½®</el-button> </el-form-item> </el-form> <el-form-item> <el-button type="primary" icon="Search" @click="handleQuery">æç´¢</el-button> <el-button icon="Refresh" @click="resetQuery">éç½®</el-button> </el-form-item> </el-form> </div> </transition> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['${moduleName}:${businessName}:add']" >æ°å¢</el-button> </el-col> <el-col :span="1.5"> <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate" v-hasPermi="['${moduleName}:${businessName}:edit']" >ä¿®æ¹</el-button> </el-col> <el-col :span="1.5"> <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete" v-hasPermi="['${moduleName}:${businessName}:remove']" >å é¤</el-button> </el-col> <el-col :span="1.5"> <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['${moduleName}:${businessName}:export']" >导åº</el-button> </el-col> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> </el-row> <el-card shadow="never"> <template #header> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['${moduleName}:${businessName}:add']" >æ°å¢</el-button> </el-col> <el-col :span="1.5"> <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['${moduleName}:${businessName}:edit']" >ä¿®æ¹</el-button> </el-col> <el-col :span="1.5"> <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['${moduleName}:${businessName}:remove']" >å é¤</el-button> </el-col> <el-col :span="1.5"> <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['${moduleName}:${businessName}:export']" >导åº</el-button> </el-col> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> </el-row> </template> <el-table v-loading="loading" :data="${businessName}List" @selection-change="handleSelectionChange"> <el-table-column type="selection" width="55" align="center" /> <el-table v-loading="loading" :data="${businessName}List" @selection-change="handleSelectionChange"> <el-table-column type="selection" width="55" align="center" /> #foreach($column in $columns) #set($javaField=$column.javaField) #set($parentheseIndex=$column.columnComment.indexOf("ï¼")) @@ -120,52 +127,56 @@ #set($comment=$column.columnComment) #end #if($column.pk) <el-table-column label="${comment}" align="center" prop="${javaField}" v-if="${column.list}"/> <el-table-column label="${comment}" align="center" prop="${javaField}" v-if="${column.list}"/> #elseif($column.list && $column.htmlType == "datetime") <el-table-column label="${comment}" align="center" prop="${javaField}" width="180"> <template #default="scope"> <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span> </template> </el-table-column> <el-table-column label="${comment}" align="center" prop="${javaField}" width="180"> <template #default="scope"> <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span> </template> </el-table-column> #elseif($column.list && $column.htmlType == "imageUpload") <el-table-column label="${comment}" align="center" prop="${javaField}" width="100"> <el-table-column label="${comment}" align="center" prop="${javaField}" width="100"> <template #default="scope"> <image-preview :src="scope.row.${javaField}" :width="50" :height="50"/> <image-preview :src="scope.row.${javaField}" :width="50" :height="50"/> </template> </el-table-column> </el-table-column> #elseif($column.list && $column.dictType && "" != $column.dictType) <el-table-column label="${comment}" align="center" prop="${javaField}"> <template #default="scope"> #if($column.htmlType == "checkbox") <dict-tag :options="${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/> #else <dict-tag :options="${column.dictType}" :value="scope.row.${javaField}"/> #end </template> </el-table-column> #elseif($column.list && "" != $javaField) <el-table-column label="${comment}" align="center" prop="${javaField}" /> #end #end <el-table-column label="æä½" align="center" class-name="small-padding fixed-width"> <el-table-column label="${comment}" align="center" prop="${javaField}"> <template #default="scope"> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['${moduleName}:${businessName}:edit']">ä¿®æ¹</el-button> <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['${moduleName}:${businessName}:remove']">å é¤</el-button> #if($column.htmlType == "checkbox") <dict-tag :options="${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/> #else <dict-tag :options="${column.dictType}" :value="scope.row.${javaField}"/> #end </template> </el-table-column> </el-table> </el-table-column> #elseif($column.list && "" != $javaField) <el-table-column label="${comment}" align="center" prop="${javaField}" /> #end #end <el-table-column label="æä½" align="center" class-name="small-padding fixed-width"> <template #default="scope"> <el-tooltip content="ä¿®æ¹" placement="top"> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['${moduleName}:${businessName}:edit']"></el-button> </el-tooltip> <el-tooltip content="å é¤" placement="top"> <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['${moduleName}:${businessName}:remove']"></el-button> </el-tooltip> </template> </el-table-column> </el-table> <pagination v-show="total>0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> <pagination v-show="total>0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> </el-card> <!-- æ·»å æä¿®æ¹${functionName}å¯¹è¯æ¡ --> <el-dialog :title="title" v-model="open" width="500px" append-to-body> <el-form ref="${businessName}Ref" :model="form" :rules="rules" label-width="80px"> <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body> <el-form ref="${businessName}FormRef" :model="form" :rules="rules" label-width="80px"> #foreach($column in $columns) #set($field=$column.javaField) #if($column.insert && !$column.pk) @@ -196,13 +207,13 @@ <el-form-item label="${comment}" prop="${field}"> <el-select v-model="form.${field}" placeholder="è¯·éæ©${comment}"> <el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" #if($column.javaType == "Integer" || $column.javaType == "Long") :value="parseInt(dict.value)" :value="parseInt(dict.value)" #else :value="dict.value" :value="dict.value" #end ></el-option> </el-select> @@ -217,10 +228,10 @@ <el-form-item label="${comment}" prop="${field}"> <el-checkbox-group v-model="form.${field}"> <el-checkbox v-for="dict in ${dictType}" :key="dict.value" :label="dict.value"> {{dict.label}} v-for="dict in ${dictType}" :key="dict.value" :label="dict.value"> {{dict.label}} </el-checkbox> </el-checkbox-group> </el-form-item> @@ -234,12 +245,12 @@ <el-form-item label="${comment}" prop="${field}"> <el-radio-group v-model="form.${field}"> <el-radio v-for="dict in ${dictType}" :key="dict.value" v-for="dict in ${dictType}" :key="dict.value" #if($column.javaType == "Integer" || $column.javaType == "Long") :label="parseInt(dict.value)" :label="parseInt(dict.value)" #else :label="dict.value" :label="dict.value" #end >{{dict.label}}</el-radio> </el-radio-group> @@ -247,7 +258,7 @@ #elseif($column.htmlType == "radio" && $dictType) <el-form-item label="${comment}" prop="${field}"> <el-radio-group v-model="form.${field}"> <el-radio label="1">è¯·éæ©åå ¸çæ</el-radio> <el-radio label="1">è¯·éæ©åå ¸çæ</el-radio> </el-radio-group> </el-form-item> #elseif($column.htmlType == "datetime") @@ -261,7 +272,7 @@ </el-form-item> #elseif($column.htmlType == "textarea") <el-form-item label="${comment}" prop="${field}"> <el-input v-model="form.${field}" type="textarea" placeholder="请è¾å ¥å 容" /> <el-input v-model="form.${field}" type="textarea" placeholder="请è¾å ¥å 容" /> </el-form-item> #end #end @@ -277,25 +288,26 @@ </div> </template> <script setup name="${BusinessName}"> import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}"; <script setup name="${BusinessName}" lang="ts"> import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from '@/api/${moduleName}/${businessName}'; import { ${BusinessName}VO, ${BusinessName}Query, ${BusinessName}Form } from '@/api/${moduleName}/${businessName}/types'; import { ComponentInternalInstance } from 'vue'; import { ElForm } from 'element-plus'; const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance() as ComponentInternalInstance; #if(${dicts} != '') #set($dictsNoSymbol=$dicts.replace("'", "")) const { ${dictsNoSymbol} } = proxy.useDict(${dicts}); const { ${dictsNoSymbol} } = toRefs<any>(proxy?.useDict(${dicts})); #end const ${businessName}List = ref([]); const open = ref(false); const ${businessName}List = ref<${BusinessName}VO[]>([]); const buttonLoading = ref(false); const loading = ref(true); const showSearch = ref(true); const ids = ref([]); const ids = ref<Array<string | number>>([]); const single = ref(true); const multiple = ref(true); const total = ref(0); const title = ref(""); #foreach ($column in $columns) #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN") #set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)}) @@ -303,8 +315,27 @@ #end #end const data = reactive({ form: {}, const queryFormRef = ref(ElForm); const ${businessName}FormRef = ref(ElForm); const dialog = reactive<DialogOption>({ visible: false, title: '' }); const initFormData: ${BusinessName}Form = { #foreach ($column in $columns) #if($column.insert || $column.edit) #if($column.htmlType == "checkbox") $column.javaField: []#if($foreach.count != $columns.size()),#end #else $column.javaField: undefined#if($foreach.count != $columns.size()),#end #end #end #end } const data = reactive<PageData<${BusinessName}Form, ${BusinessName}Query>>({ form: {...initFormData}, queryParams: { pageNum: 1, pageSize: 10, @@ -336,7 +367,7 @@ const { queryParams, form, rules } = toRefs(data); /** æ¥è¯¢${functionName}å表 */ function getList() { const getList = async () => { loading.value = true; #foreach ($column in $columns) #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN") @@ -353,138 +384,116 @@ } #end #end list${BusinessName}(queryParams.value).then(response => { ${businessName}List.value = response.rows; total.value = response.total; loading.value = false; }); const res = await list${BusinessName}(queryParams.value); ${businessName}List.value = res.rows; total.value = res.total; loading.value = false; } // åæ¶æé® function cancel() { open.value = false; /** åæ¶æé® */ const cancel = () => { reset(); dialog.visible = false; } // 表åéç½® function reset() { form.value = { #foreach ($column in $columns) #if($column.insert || $column.edit) #if($column.htmlType == "checkbox") $column.javaField: []#if($foreach.count != $columns.size()),#end #else $column.javaField: null#if($foreach.count != $columns.size()),#end #end #end #end }; proxy.resetForm("${businessName}Ref"); /** 表åéç½® */ const reset = () => { form.value = {...initFormData}; ${businessName}FormRef.value.resetFields(); } /** æç´¢æé®æä½ */ function handleQuery() { const handleQuery = () => { queryParams.value.pageNum = 1; getList(); } /** éç½®æé®æä½ */ function resetQuery() { const resetQuery = () => { #foreach ($column in $columns) #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN") #set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)}) daterange${AttrName}.value = []; #end #end proxy.resetForm("queryRef"); queryFormRef.value.resetFields(); handleQuery(); } // å¤éæ¡é䏿°æ® function handleSelectionChange(selection) { /** å¤éæ¡é䏿°æ® */ const handleSelectionChange = (selection: ${BusinessName}VO[]) => { ids.value = selection.map(item => item.${pkColumn.javaField}); single.value = selection.length != 1; multiple.value = !selection.length; } /** æ°å¢æé®æä½ */ function handleAdd() { reset(); open.value = true; title.value = "æ·»å ${functionName}"; const handleAdd = () => { dialog.visible = true; dialog.title = "æ·»å ${functionName}"; nextTick(() => { reset(); }); } /** ä¿®æ¹æé®æä½ */ function handleUpdate(row) { const handleUpdate = (row?: ${BusinessName}VO) => { loading.value = true reset(); const _${pkColumn.javaField} = row.${pkColumn.javaField} || ids.value get${BusinessName}(_${pkColumn.javaField}).then(response => { dialog.visible = true; dialog.title = "ä¿®æ¹${functionName}"; nextTick(async () => { reset(); const _${pkColumn.javaField} = row?.${pkColumn.javaField} || ids.value[0] const res = await get${BusinessName}(_${pkColumn.javaField}); loading.value = false; form.value = response.data; Object.assign(form.value, res.data); #foreach ($column in $columns) #if($column.htmlType == "checkbox") form.value.$column.javaField = form.value.${column.javaField}.split(","); #end #end open.value = true; title.value = "ä¿®æ¹${functionName}"; }); } /** æäº¤æé® */ function submitForm() { proxy.#[[$]]#refs["${businessName}Ref"].validate(valid => { const submitForm = () => { ${businessName}FormRef.value.validate(async (valid: boolean) => { if (valid) { buttonLoading.value = true; #foreach ($column in $columns) #if($column.htmlType == "checkbox") form.value.$column.javaField = form.value.${column.javaField}.join(","); #end #end if (form.value.${pkColumn.javaField} != null) { update${BusinessName}(form.value).then(response => { proxy.#[[$modal]]#.msgSuccess("ä¿®æ¹æå"); open.value = false; getList(); }).finally(() => { buttonLoading.value = false; }); #foreach ($column in $columns) #if($column.htmlType == "checkbox") form.value.$column.javaField = form.value.${column.javaField}.join(","); #end #end if (form.value.${pkColumn.javaField}) { await update${BusinessName}(form.value).finally(() => buttonLoading.value = false); } else { add${BusinessName}(form.value).then(response => { proxy.#[[$modal]]#.msgSuccess("æ°å¢æå"); open.value = false; getList(); }).finally(() => { buttonLoading.value = false; }); await add${BusinessName}(form.value).finally(() => buttonLoading.value = false); } proxy?.#[[$modal]]#.msgSuccess("ä¿®æ¹æå"); dialog.visible = false; await getList(); } }); } /** å é¤æé®æä½ */ function handleDelete(row) { const _${pkColumn.javaField}s = row.${pkColumn.javaField} || ids.value; proxy.#[[$modal]]#.confirm('æ¯å¦ç¡®è®¤å é¤${functionName}ç¼å·ä¸º"' + _${pkColumn.javaField}s + '"çæ°æ®é¡¹ï¼').then(function() { loading.value = true; return del${BusinessName}(_${pkColumn.javaField}s); }).then(() => { loading.value = true; getList(); proxy.#[[$modal]]#.msgSuccess("å 餿å"); }).catch(() => { }).finally(() => { loading.value = false; }); const handleDelete = async (row?: ${BusinessName}VO) => { const _${pkColumn.javaField}s = row?.${pkColumn.javaField} || ids.value; await proxy?.#[[$modal]]#.confirm('æ¯å¦ç¡®è®¤å é¤${functionName}ç¼å·ä¸º"' + _${pkColumn.javaField}s + '"çæ°æ®é¡¹ï¼').finally(() => loading.value = false); await del${BusinessName}(_${pkColumn.javaField}s); proxy?.#[[$modal]]#.msgSuccess("å 餿å"); await getList(); } /** å¯¼åºæé®æä½ */ function handleExport() { proxy.download('${moduleName}/${businessName}/export', { const handleExport = () => { proxy?.download('${moduleName}/${businessName}/export', { ...queryParams.value }, `${businessName}_#[[${new Date().getTime()}]]#.xlsx`) } getList(); onMounted(() => { getList(); }); </script>