forked from ruoyi/RuoYi-Vue
		
	
		
			
	
	
		
			410 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
		
		
			
		
	
	
			410 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
|   | <template> | |||
|  |   <div class="app-container"> | |||
|  |     <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px"> | |||
|  | #foreach($column in $columns) | |||
|  | #if($column.query) | |||
|  | #set($dictType=$column.dictType) | |||
|  | #set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)}) | |||
|  | #set($parentheseIndex=$column.columnComment.indexOf("(")) | |||
|  | #if($parentheseIndex != -1) | |||
|  | #set($comment=$column.columnComment.substring(0, $parentheseIndex)) | |||
|  | #else | |||
|  | #set($comment=$column.columnComment) | |||
|  | #end | |||
|  | #if($column.htmlType == "input") | |||
|  |       <el-form-item label="${comment}" prop="${column.javaField}"> | |||
|  |         <el-input | |||
|  |           v-model="queryParams.${column.javaField}" | |||
|  |           placeholder="请输入${comment}" | |||
|  |           clearable | |||
|  |           size="small" | |||
|  |           @keyup.enter.native="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 size="small"> | |||
|  |           <el-option | |||
|  |             v-for="dict in ${column.javaField}Options" | |||
|  |             :key="dict.dictValue" | |||
|  |             :label="dict.dictLabel" | |||
|  |             :value="dict.dictValue" | |||
|  |           /> | |||
|  |         </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 size="small"> | |||
|  |           <el-option label="请选择字典生成" value="" /> | |||
|  |         </el-select> | |||
|  |       </el-form-item> | |||
|  | #elseif($column.htmlType == "datetime") | |||
|  |       <el-form-item label="${comment}" prop="${column.javaField}"> | |||
|  |         <el-date-picker clearable size="small" style="width: 200px" | |||
|  |           v-model="queryParams.${column.javaField}" | |||
|  |           type="date" | |||
|  |           value-format="yyyy-MM-dd" | |||
|  |           placeholder="选择${comment}"> | |||
|  |         </el-date-picker> | |||
|  |       </el-form-item> | |||
|  | #end | |||
|  | #end | |||
|  | #end | |||
|  |       <el-form-item> | |||
|  |         <el-button | |||
|  |           class="filter-item" | |||
|  |           type="primary" | |||
|  |           icon="el-icon-search" | |||
|  |           size="mini" | |||
|  |           @click="handleQuery" | |||
|  |         >搜索</el-button> | |||
|  |         <el-button | |||
|  |           class="filter-item" | |||
|  |           type="primary" | |||
|  |           icon="el-icon-plus" | |||
|  |           size="mini" | |||
|  |           @click="handleAdd" | |||
|  |           v-hasPermi="['${moduleName}:${businessName}:add']" | |||
|  |         >新增</el-button> | |||
|  |       </el-form-item> | |||
|  |     </el-form> | |||
|  | 
 | |||
|  |     <el-table | |||
|  |       v-loading="loading" | |||
|  |       :data="${businessName}List" | |||
|  |       row-key="${treeCode}" | |||
|  |       default-expand-all | |||
|  |       :tree-props="{children: 'children', hasChildren: 'hasChildren'}" | |||
|  |     > | |||
|  | #foreach($column in $columns) | |||
|  | #set($javaField=$column.javaField) | |||
|  | #set($parentheseIndex=$column.columnComment.indexOf("(")) | |||
|  | #if($parentheseIndex != -1) | |||
|  | #set($comment=$column.columnComment.substring(0, $parentheseIndex)) | |||
|  | #else | |||
|  | #set($comment=$column.columnComment) | |||
|  | #end | |||
|  | #if($column.pk) | |||
|  | #elseif($column.list && $column.htmlType == "datetime") | |||
|  |       <el-table-column label="${comment}" align="center" prop="${javaField}" width="180"> | |||
|  |         <template slot-scope="scope"> | |||
|  |           <span>{{ parseTime(scope.row.${javaField}) }}</span> | |||
|  |         </template> | |||
|  |       </el-table-column> | |||
|  | #elseif($column.list && "" != $column.dictType) | |||
|  |       <el-table-column label="${comment}" align="center" prop="${javaField}" :formatter="${javaField}Format" /> | |||
|  | #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 slot-scope="scope"> | |||
|  |           <el-button | |||
|  |             size="mini" | |||
|  |             type="text" | |||
|  |             icon="el-icon-edit" | |||
|  |             @click="handleUpdate(scope.row)" | |||
|  |             v-hasPermi="['${moduleName}:${businessName}:edit']" | |||
|  |           >修改</el-button> | |||
|  |           <el-button | |||
|  |             size="mini" | |||
|  |             type="text" | |||
|  |             icon="el-icon-delete" | |||
|  |             @click="handleDelete(scope.row)" | |||
|  |             v-hasPermi="['${moduleName}:${businessName}:remove']" | |||
|  |           >删除</el-button> | |||
|  |         </template> | |||
|  |       </el-table-column> | |||
|  |     </el-table> | |||
|  | 
 | |||
|  |     <!-- 添加或修改${functionName}对话框 --> | |||
|  |     <el-dialog :title="title" :visible.sync="open" width="500px"> | |||
|  |       <el-form ref="form" :model="form" :rules="rules" label-width="80px"> | |||
|  | #foreach($column in $columns) | |||
|  | #set($field=$column.javaField) | |||
|  | #if($column.insert && !$column.pk) | |||
|  | #if(($column.usableColumn) || (!$column.superColumn)) | |||
|  | #set($parentheseIndex=$column.columnComment.indexOf("(")) | |||
|  | #if($parentheseIndex != -1) | |||
|  | #set($comment=$column.columnComment.substring(0, $parentheseIndex)) | |||
|  | #else | |||
|  | #set($comment=$column.columnComment) | |||
|  | #end | |||
|  | #set($dictType=$column.dictType) | |||
|  | #if("" != $treeParentCode && $column.javaField == $treeParentCode) | |||
|  |         <el-form-item label="${comment}" prop="${treeParentCode}"> | |||
|  |           <treeselect v-model="form.${treeParentCode}" :options="${businessName}Options" :normalizer="normalizer" placeholder="请选择${comment}" /> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "input") | |||
|  |         <el-form-item label="${comment}" prop="${field}"> | |||
|  |           <el-input v-model="form.${field}" placeholder="请输入${comment}" /> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "select" && "" != $dictType) | |||
|  |         <el-form-item label="${comment}"> | |||
|  |           <el-select v-model="form.${field}" placeholder="请选择${comment}"> | |||
|  |             <el-option | |||
|  |               v-for="dict in ${field}Options" | |||
|  |               :key="dict.dictValue" | |||
|  |               :label="dict.dictLabel" | |||
|  |               :value="dict.dictValue" | |||
|  |             ></el-option> | |||
|  |           </el-select> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "select" && $dictType) | |||
|  |         <el-form-item label="${comment}"> | |||
|  |           <el-select v-model="form.${field}" placeholder="请选择${comment}"> | |||
|  |             <el-option label="请选择字典生成" value="" /> | |||
|  |           </el-select> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "radio" && "" != $dictType) | |||
|  |         <el-form-item label="${comment}"> | |||
|  |           <el-radio-group v-model="form.${field}"> | |||
|  |             <el-radio | |||
|  |               v-for="dict in ${field}Options" | |||
|  |               :key="dict.dictValue" | |||
|  |               :label="dict.dictValue" | |||
|  |             >{{dict.dictLabel}}</el-radio> | |||
|  |           </el-radio-group> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "radio" && $dictType) | |||
|  |         <el-form-item label="${comment}"> | |||
|  |           <el-radio-group v-model="form.${field}"> | |||
|  |             <el-radio label="1">请选择字典生成</el-radio> | |||
|  |           </el-radio-group> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "datetime") | |||
|  |         <el-form-item label="${comment}" prop="${field}"> | |||
|  |           <el-date-picker clearable size="small" style="width: 200px" | |||
|  |             v-model="form.${field}" | |||
|  |             type="date" | |||
|  |             value-format="yyyy-MM-dd" | |||
|  |             placeholder="选择${comment}"> | |||
|  |           </el-date-picker> | |||
|  |         </el-form-item> | |||
|  | #elseif($column.htmlType == "textarea") | |||
|  |         <el-form-item label="${comment}" prop="${field}"> | |||
|  |           <el-input v-model="form.${field}" type="textarea" placeholder="请输入内容" /> | |||
|  |         </el-form-item> | |||
|  | #end | |||
|  | #end | |||
|  | #end | |||
|  | #end | |||
|  |       </el-form> | |||
|  |       <div slot="footer" class="dialog-footer"> | |||
|  |         <el-button type="primary" @click="submitForm">确 定</el-button> | |||
|  |         <el-button @click="cancel">取 消</el-button> | |||
|  |       </div> | |||
|  |     </el-dialog> | |||
|  |   </div> | |||
|  | </template> | |||
|  | 
 | |||
|  | <script> | |||
|  | import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName}, export${BusinessName} } from "@/api/${moduleName}/${businessName}"; | |||
|  | import Treeselect from "@riophae/vue-treeselect"; | |||
|  | import "@riophae/vue-treeselect/dist/vue-treeselect.css"; | |||
|  | 
 | |||
|  | export default { | |||
|  |   name: "${BusinessName}", | |||
|  |   components: { Treeselect }, | |||
|  |   data() { | |||
|  |     return { | |||
|  |       // 遮罩层 | |||
|  |       loading: true, | |||
|  |       // ${functionName}表格数据 | |||
|  |       ${businessName}List: [], | |||
|  |       // ${functionName}树选项 | |||
|  |       ${businessName}Options: [], | |||
|  |       // 弹出层标题 | |||
|  |       title: "", | |||
|  |       // 是否显示弹出层 | |||
|  |       open: false, | |||
|  | #foreach ($column in $columns) | |||
|  | #set($parentheseIndex=$column.columnComment.indexOf("(")) | |||
|  | #if($parentheseIndex != -1) | |||
|  | #set($comment=$column.columnComment.substring(0, $parentheseIndex)) | |||
|  | #else | |||
|  | #set($comment=$column.columnComment) | |||
|  | #end | |||
|  | #if(${column.dictType} != '') | |||
|  |       // $comment字典 | |||
|  |       ${column.javaField}Options: []#if($velocityCount != $columns.size()),#end | |||
|  | 
 | |||
|  | #end | |||
|  | #end | |||
|  |       // 查询参数 | |||
|  |       queryParams: { | |||
|  | #foreach ($column in $columns) | |||
|  | #if($column.query) | |||
|  |         $column.javaField: undefined#if($velocityCount != $columns.size()),#end | |||
|  | 
 | |||
|  | #end | |||
|  | #end | |||
|  |       }, | |||
|  |       // 表单参数 | |||
|  |       form: {}, | |||
|  |       // 表单校验 | |||
|  |       rules: { | |||
|  | #foreach ($column in $columns) | |||
|  | #if($column.required) | |||
|  | #set($parentheseIndex=$column.columnComment.indexOf("(")) | |||
|  | #if($parentheseIndex != -1) | |||
|  | #set($comment=$column.columnComment.substring(0, $parentheseIndex)) | |||
|  | #else | |||
|  | #set($comment=$column.columnComment) | |||
|  | #end | |||
|  | #set($comment=$column.columnComment) | |||
|  |         $column.javaField: [ | |||
|  |           { required: true, message: "$comment不能为空", trigger: "blur" } | |||
|  |         ]#if($velocityCount != $columns.size()),#end | |||
|  | 
 | |||
|  | #end | |||
|  | #end | |||
|  |       } | |||
|  |     }; | |||
|  |   }, | |||
|  |   created() { | |||
|  |     this.getList(); | |||
|  | #foreach ($column in $columns) | |||
|  | #if(${column.dictType} != '') | |||
|  |     this.getDicts("${column.dictType}").then(response => { | |||
|  |       this.${column.javaField}Options = response.data; | |||
|  |     }); | |||
|  | #end | |||
|  | #end | |||
|  |   }, | |||
|  |   methods: { | |||
|  |     /** 查询${functionName}列表 */ | |||
|  |     getList() { | |||
|  |       this.loading = true; | |||
|  |       list${BusinessName}(this.queryParams).then(response => { | |||
|  |         this.${businessName}List = this.handleTree(response.data, "${treeCode}", "${treeParentCode}"); | |||
|  |         this.loading = false; | |||
|  |       }); | |||
|  |     }, | |||
|  |     /** 转换${functionName}数据结构 */ | |||
|  |     normalizer(node) { | |||
|  |       if (node.children && !node.children.length) { | |||
|  |         delete node.children; | |||
|  |       } | |||
|  |       return { | |||
|  |         id: node.${treeCode}, | |||
|  |         label: node.${treeName}, | |||
|  |         children: node.children | |||
|  |       }; | |||
|  |     }, | |||
|  | 	/** 查询部门下拉树结构 */ | |||
|  |     getTreeselect() { | |||
|  |       list${BusinessName}().then(response => { | |||
|  |         this.${businessName}Options = []; | |||
|  |         const data = { ${treeCode}: 0, ${treeName}: '顶级节点', children: [] }; | |||
|  |         data.children = this.handleTree(response.data, "${treeCode}", "${treeParentCode}"); | |||
|  |         this.${businessName}Options.push(data); | |||
|  |       }); | |||
|  |     }, | |||
|  | #foreach ($column in $columns) | |||
|  | #if(${column.dictType} != '') | |||
|  | #set($parentheseIndex=$column.columnComment.indexOf("(")) | |||
|  | #if($parentheseIndex != -1) | |||
|  | #set($comment=$column.columnComment.substring(0, $parentheseIndex)) | |||
|  | #else | |||
|  | #set($comment=$column.columnComment) | |||
|  | #end | |||
|  |     // $comment字典翻译 | |||
|  |     ${column.javaField}Format(row, column) { | |||
|  |       return this.selectDictLabel(this.${column.javaField}Options, row.${column.javaField}); | |||
|  |     }, | |||
|  | #end | |||
|  | #end | |||
|  |     // 取消按钮 | |||
|  |     cancel() { | |||
|  |       this.open = false; | |||
|  |       this.reset(); | |||
|  |     }, | |||
|  |     // 表单重置 | |||
|  |     reset() { | |||
|  |       this.form = { | |||
|  | #foreach ($column in $columns) | |||
|  | #if($column.htmlType == "radio") | |||
|  |         $column.javaField: "0"#if($velocityCount != $columns.size()),#end | |||
|  | 
 | |||
|  | #else | |||
|  |         $column.javaField: undefined#if($velocityCount != $columns.size()),#end | |||
|  | 
 | |||
|  | #end | |||
|  | #end | |||
|  |       }; | |||
|  |       this.resetForm("form"); | |||
|  |     }, | |||
|  |     /** 搜索按钮操作 */ | |||
|  |     handleQuery() { | |||
|  |       this.getList(); | |||
|  |     }, | |||
|  |     /** 重置按钮操作 */ | |||
|  |     resetQuery() { | |||
|  |       this.resetForm("queryForm"); | |||
|  |       this.handleQuery(); | |||
|  |     }, | |||
|  |     /** 新增按钮操作 */ | |||
|  |     handleAdd() { | |||
|  |       this.reset(); | |||
|  | 	  this.getTreeselect(); | |||
|  |       this.open = true; | |||
|  |       this.title = "添加${functionName}"; | |||
|  |     }, | |||
|  |     /** 修改按钮操作 */ | |||
|  |     handleUpdate(row) { | |||
|  |       this.reset(); | |||
|  | 	  this.getTreeselect(); | |||
|  |       if (row != undefined) { | |||
|  |         this.form.${treeParentCode} = row.${treeCode}; | |||
|  |       } | |||
|  |       get${BusinessName}(row.${pkColumn.javaField}).then(response => { | |||
|  |         this.form = response.data; | |||
|  |         this.open = true; | |||
|  |         this.title = "修改${functionName}"; | |||
|  |       }); | |||
|  |     }, | |||
|  |     /** 提交按钮 */ | |||
|  |     submitForm: function() { | |||
|  |       this.#[[$]]#refs["form"].validate(valid => { | |||
|  |         if (valid) { | |||
|  |           if (this.form.${pkColumn.javaField} != undefined) { | |||
|  |             update${BusinessName}(this.form).then(response => { | |||
|  |               if (response.code === 200) { | |||
|  |                 this.msgSuccess("修改成功"); | |||
|  |                 this.open = false; | |||
|  |                 this.getList(); | |||
|  |               } else { | |||
|  |                 this.msgError(response.msg); | |||
|  |               } | |||
|  |             }); | |||
|  |           } else { | |||
|  |             add${BusinessName}(this.form).then(response => { | |||
|  |               if (response.code === 200) { | |||
|  |                 this.msgSuccess("新增成功"); | |||
|  |                 this.open = false; | |||
|  |                 this.getList(); | |||
|  |               } else { | |||
|  |                 this.msgError(response.msg); | |||
|  |               } | |||
|  |             }); | |||
|  |           } | |||
|  |         } | |||
|  |       }); | |||
|  |     }, | |||
|  |     /** 删除按钮操作 */ | |||
|  |     handleDelete(row) { | |||
|  |       this.$confirm('是否确认删除${functionName}编号为"' + row.${pkColumn.javaField} + '"的数据项?', "警告", { | |||
|  |           confirmButtonText: "确定", | |||
|  |           cancelButtonText: "取消", | |||
|  |           type: "warning" | |||
|  |         }).then(function() { | |||
|  |           return del${BusinessName}(row.${pkColumn.javaField}); | |||
|  |         }).then(() => { | |||
|  |           this.getList(); | |||
|  |           this.msgSuccess("删除成功"); | |||
|  |         }).catch(function() {}); | |||
|  |     } | |||
|  |   } | |||
|  | }; | |||
|  | </script> |