BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 802e80f655f6ee12c14093fd88f729cbe5698edf

Authored by YunaiV
1 parent 77bb57a2

完成 vue 搜索、列表部分

Inline Side-by-side
Showing 1 changed file with 69 additions and 143 deletions
src/main/resources/codegen/vue/views/index.vue.vm
  View file @802e80f
1 1 <template>
2 2 <div class="app-container">
3   -## ========== 搜索区 ==========
  3 +
  4 + <!-- 搜索工作栏 -->
4 5 <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
5 6 #foreach($column in $columns)
6 7 #if ($column.listOperation)
7 8 #set ($dictType=$column.dictType)
  9 + #set ($javaField = $column.javaField)
8 10 #set ($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
9 11 #set ($comment=$column.columnComment)
10 12 #set ($parentheseIndex=$column.columnComment.indexOf("（"))
11 13 #if ($parentheseIndex >= 0) #set($comment=$column.columnComment.substring(0, $parentheseIndex)) #end
12 14 #if ($column.htmlType == "input")
13   - <el-form-item label="${comment}" prop="${column.javaField}">
14   - <el-input v-model="queryParams.${column.javaField}" placeholder="请输入${comment}" clearable size="small" @keyup.enter.native="handleQuery"/>
  15 + <el-form-item label="${comment}" prop="${javaField}">
  16 + <el-input v-model="queryParams.${javaField}" placeholder="请输入${comment}" clearable size="small" @keyup.enter.native="handleQuery"/>
15 17 </el-form-item>
16 18 #elseif ($column.htmlType == "select" || $column.htmlType == "radio")
17   - <el-form-item label="${comment}" prop="${column.javaField}">
18   - <el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable size="small">
19   - #if ("" != $dictType) ## 设置了 dictType 数据字典的情况
  19 + <el-form-item label="${comment}" prop="${javaField}">
  20 + <el-select v-model="queryParams.${javaField}" placeholder="请选择${comment}" clearable size="small">
  21 + #if ("" != $dictType)## 设置了 dictType 数据字典的情况
20 22 <el-option v-for="dict in this.getDictDatas(DICT_TYPE.$dictType.toUpperCase())"
21 23 :key="parseInt(dict.dictValue)" :label="dict.dictLabel" :value="parseInt(dict.dictValue)"/>
22   - #else ## 未设置 dictType 数据字典的情况
  24 + #else## 未设置 dictType 数据字典的情况
23 25 <el-option label="请选择字典生成" value="" />
24 26 #end
25 27 </el-select>
26 28 </el-form-item>
27 29 #elseif($column.htmlType == "datetime")
28   - #if ($column.queryType != "BETWEEN") ## 非范围
29   - <el-form-item label="${comment}" prop="${column.javaField}">
30   - <el-date-picker clearable size="small" v-model="queryParams.${column.javaField}" type="date" value-format="yyyy-MM-dd" placeholder="选择${comment}" />
  30 + #if ($column.queryType != "BETWEEN")## 非范围
  31 + <el-form-item label="${comment}" prop="${javaField}">
  32 + <el-date-picker clearable size="small" v-model="queryParams.${javaField}" type="date" value-format="yyyy-MM-dd" placeholder="选择${comment}" />
31 33 </el-form-item>
32   - #else ## 范围
  34 + #else## 范围
33 35 <el-form-item label="${comment}">
34 36 <el-date-picker v-model="dateRange${AttrName}" size="small" style="width: 240px" value-format="yyyy-MM-dd"
35 37 type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
... ... @@ -44,7 +46,7 @@
44 46 </el-form-item>
45 47 </el-form>
46 48  
47   -## ========== 操作区 ==========
  49 + <!-- 操作工具栏 -->
48 50 <el-row :gutter="10" class="mb8">
49 51 <el-col :span="1.5">
50 52 <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
... ... @@ -57,92 +59,80 @@
57 59 <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
58 60 </el-row>
59 61  
60   -## ========== 列表区 ==========
61   - <el-table v-loading="loading" :data="${businessName}List" @selection-change="handleSelectionChange">
62   - <el-table-column type="selection" width="55" align="center" />
  62 + <!-- 列表 -->
  63 + <el-table v-loading="loading" :data="${businessName}List">
63 64 #foreach($column in $columns)
  65 +#if ($column.listOperationResult)
64 66 #set ($dictType=$column.dictType)
  67 + #set ($javaField = $column.javaField)
65 68 #set ($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
66 69 #set ($comment=$column.columnComment)
67 70 #set ($parentheseIndex=$column.columnComment.indexOf("（"))
68 71 #if ($parentheseIndex >= 0) #set($comment=$column.columnComment.substring(0, $parentheseIndex)) #end
69   -#if ($column.pk) ## 主键
70   - <el-table-column label="${comment}" align="center" prop="${javaField}" />
71   -#elseif($column.list && $column.htmlType == "datetime")
  72 +#if ($column.javaType == "Date")## 时间类型
72 73 <el-table-column label="${comment}" align="center" prop="${javaField}" width="180">
73 74 <template slot-scope="scope">
74 75 <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span>
75 76 </template>
76 77 </el-table-column>
77   -#elseif($column.list && "" != $column.dictType)
78   - <el-table-column label="${comment}" align="center" prop="${javaField}" :formatter="${javaField}Format" />
79   -#elseif($column.list && "" != $javaField)
  78 +#elseif("" != $column.dictType)## 数据字典
  79 + <el-table-column label="${comment}" align="center" prop="${javaField}">
  80 + <template slot-scope="scope">
  81 + <span>{{ getDictDataLabel(DICT_TYPE.$dictType.toUpperCase(), scope.row.javaField) }}</span>
  82 + </template>
  83 + </el-table-column>>
  84 +#else
80 85 <el-table-column label="${comment}" align="center" prop="${javaField}" />
81 86 #end
82 87 #end
  88 +#end
83 89 <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
84 90 <template slot-scope="scope">
85   - <el-button
86   - size="mini"
87   - type="text"
88   - icon="el-icon-edit"
89   - @click="handleUpdate(scope.row)"
90   - v-hasPermi="['${moduleName}:${businessName}:edit']"
91   - >修改</el-button>
92   - <el-button
93   - size="mini"
94   - type="text"
95   - icon="el-icon-delete"
96   - @click="handleDelete(scope.row)"
97   - v-hasPermi="['${moduleName}:${businessName}:remove']"
98   - >删除</el-button>
  91 + <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
  92 + v-hasPermi="['${moduleName}:${businessName}:edit']">修改</el-button>
  93 + <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
  94 + v-hasPermi="['${moduleName}:${businessName}:remove']">删除</el-button>
99 95 </template>
100 96 </el-table-column>
101 97 </el-table>
  98 + <!-- 分页组件 -->
  99 + <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
  100 + @pagination="getList"/>
102 101  
103   - <pagination
104   - v-show="total>0"
105   - :total="total"
106   - :page.sync="queryParams.pageNum"
107   - :limit.sync="queryParams.pageSize"
108   - @pagination="getList"
109   - />
110   -
111   - <!-- 添加或修改${functionName}对话框 -->
  102 + <!-- 对话框(添加 / 修改) -->
112 103 <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
113 104 <el-form ref="form" :model="form" :rules="rules" label-width="80px">
114 105 #foreach($column in $columns)
115   -#set($field=$column.javaField)
116   -#if($column.insert && !$column.pk)
117   -#if(($column.usableColumn) || (!$column.superColumn))
118   -#set($parentheseIndex=$column.columnComment.indexOf("（"))
119   -#if($parentheseIndex != -1)
120   -#set($comment=$column.columnComment.substring(0, $parentheseIndex))
121   -#else
122   -#set($comment=$column.columnComment)
123   -#end
124   -#set($dictType=$column.dictType)
125   -#if($column.htmlType == "input")
126   - <el-form-item label="${comment}" prop="${field}">
127   - <el-input v-model="form.${field}" placeholder="请输入${comment}" />
  106 +#if ($column.createOperation || $column.updateOperation)
  107 + #set ($dictType = $column.dictType)
  108 + #set ($javaField = $column.javaField)
  109 + #set ($AttrName = $column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
  110 + #set ($comment = $column.columnComment)
  111 + #set ($parentheseIndex = $column.columnComment.indexOf("（"))
  112 + #if ($parentheseIndex >= 0) #set($comment = $column.columnComment.substring(0, $parentheseIndex)) #end
  113 +#if ($column.htmlType == "input")
  114 + #if (!$column.primaryKey)## 忽略主键，不用在表单里
  115 + <el-form-item label="${comment}" prop="${javaField}">
  116 + <el-input v-model="form.${javaField}" placeholder="请输入${comment}" />
128 117 </el-form-item>
  118 + #end
129 119 #elseif($column.htmlType == "imageUpload")
130 120 <el-form-item label="${comment}">
131   - <imageUpload v-model="form.${field}"/>
  121 + <imageUpload v-model="form.${javaField}"/>
132 122 </el-form-item>
133 123 #elseif($column.htmlType == "fileUpload")
134 124 <el-form-item label="${comment}">
135   - <fileUpload v-model="form.${field}"/>
  125 + <fileUpload v-model="form.${javaField}"/>
136 126 </el-form-item>
137 127 #elseif($column.htmlType == "editor")
138 128 <el-form-item label="${comment}">
139   - <editor v-model="form.${field}" :min-height="192"/>
  129 + <editor v-model="form.${javaField}" :min-height="192"/>
140 130 </el-form-item>
141 131 #elseif($column.htmlType == "select" && "" != $dictType)
142   - <el-form-item label="${comment}" prop="${field}">
143   - <el-select v-model="form.${field}" placeholder="请选择${comment}">
  132 + <el-form-item label="${comment}" prop="${javaField}">
  133 + <el-select v-model="form.${javaField}" placeholder="请选择${comment}">
144 134 <el-option
145   - v-for="dict in ${field}Options"
  135 + v-for="dict in ${javaField}Options"
146 136 :key="dict.dictValue"
147 137 :label="dict.dictLabel"
148 138 #if($column.javaType == "Integer" || $column.javaType == "Long"):value="parseInt(dict.dictValue)"#else:value="dict.dictValue"#end
... ... @@ -151,16 +141,16 @@
151 141 </el-select>
152 142 </el-form-item>
153 143 #elseif($column.htmlType == "select" && $dictType)
154   - <el-form-item label="${comment}" prop="${field}">
155   - <el-select v-model="form.${field}" placeholder="请选择${comment}">
  144 + <el-form-item label="${comment}" prop="${javaField}">
  145 + <el-select v-model="form.${javaField}" placeholder="请选择${comment}">
156 146 <el-option label="请选择字典生成" value="" />
157 147 </el-select>
158 148 </el-form-item>
159 149 #elseif($column.htmlType == "checkbox" && "" != $dictType)
160 150 <el-form-item label="${comment}">
161   - <el-checkbox-group v-model="form.${field}">
  151 + <el-checkbox-group v-model="form.${javaField}">
162 152 <el-checkbox
163   - v-for="dict in ${field}Options"
  153 + v-for="dict in ${javaField}Options"
164 154 :key="dict.dictValue"
165 155 :label="dict.dictValue">
166 156 {{dict.dictLabel}}
... ... @@ -169,15 +159,15 @@
169 159 </el-form-item>
170 160 #elseif($column.htmlType == "checkbox" && $dictType)
171 161 <el-form-item label="${comment}">
172   - <el-checkbox-group v-model="form.${field}">
  162 + <el-checkbox-group v-model="form.${javaField}">
173 163 <el-checkbox>请选择字典生成</el-checkbox>
174 164 </el-checkbox-group>
175 165 </el-form-item>
176 166 #elseif($column.htmlType == "radio" && "" != $dictType)
177 167 <el-form-item label="${comment}">
178   - <el-radio-group v-model="form.${field}">
  168 + <el-radio-group v-model="form.${javaField}">
179 169 <el-radio
180   - v-for="dict in ${field}Options"
  170 + v-for="dict in ${javaField}Options"
181 171 :key="dict.dictValue"
182 172 #if($column.javaType == "Integer" || $column.javaType == "Long"):label="parseInt(dict.dictValue)"#else:label="dict.dictValue"#end
183 173  
... ... @@ -186,27 +176,26 @@
186 176 </el-form-item>
187 177 #elseif($column.htmlType == "radio" && $dictType)
188 178 <el-form-item label="${comment}">
189   - <el-radio-group v-model="form.${field}">
  179 + <el-radio-group v-model="form.${javaField}">
190 180 <el-radio label="1">请选择字典生成</el-radio>
191 181 </el-radio-group>
192 182 </el-form-item>
193 183 #elseif($column.htmlType == "datetime")
194   - <el-form-item label="${comment}" prop="${field}">
  184 + <el-form-item label="${comment}" prop="${javaField}">
195 185 <el-date-picker clearable size="small"
196   - v-model="form.${field}"
  186 + v-model="form.${javaField}"
197 187 type="date"
198 188 value-format="yyyy-MM-dd"
199 189 placeholder="选择${comment}">
200 190 </el-date-picker>
201 191 </el-form-item>
202 192 #elseif($column.htmlType == "textarea")
203   - <el-form-item label="${comment}" prop="${field}">
204   - <el-input v-model="form.${field}" type="textarea" placeholder="请输入内容" />
  193 + <el-form-item label="${comment}" prop="${javaField}">
  194 + <el-input v-model="form.${javaField}" type="textarea" placeholder="请输入内容" />
205 195 </el-form-item>
206 196 #end
207 197 #end
208 198 #end
209   -#end
210 199 </el-form>
211 200 <div slot="footer" class="dialog-footer">
212 201 <el-button type="primary" @click="submitForm">确 定</el-button>
... ... @@ -263,26 +252,12 @@ export default {
263 252 return {
264 253 // 遮罩层
265 254 loading: true,
266   - // 选中数组
267   - ids: [],
268   -#if($table.sub)
269   - // 子表选中数据
270   - checked${subClassName}: [],
271   -#end
272   - // 非单个禁用
273   - single: true,
274   - // 非多个禁用
275   - multiple: true,
276 255 // 显示搜索条件
277 256 showSearch: true,
278 257 // 总条数
279 258 total: 0,
280 259 // ${functionName}表格数据
281   - ${businessName}List: [],
282   -#if($table.sub)
283   - // ${subTable.functionName}表格数据
284   - ${subclassName}List: [],
285   -#end
  260 + list: [],
286 261 // 弹出层标题
287 262 title: "",
288 263 // 是否显示弹出层
... ... @@ -305,7 +280,7 @@ export default {
305 280 #end
306 281 // 查询参数
307 282 queryParams: {
308   - pageNum: 1,
  283 + pageNo: 1,
309 284 pageSize: 10,
310 285 #foreach ($column in $columns)
311 286 #if($column.query)
... ... @@ -365,7 +340,7 @@ export default {
365 340 #end
366 341 #end
367 342 list${BusinessName}(this.queryParams).then(response => {
368   - this.${businessName}List = response.rows;
  343 + this.list = response.rows;
369 344 this.total = response.total;
370 345 this.loading = false;
371 346 });
... ... @@ -391,14 +366,11 @@ export default {
391 366 #end
392 367 #end
393 368 };
394   -#if($table.sub)
395   - this.${subclassName}List = [];
396   -#end
397 369 this.resetForm("form");
398 370 },
399 371 /** 搜索按钮操作 */
400 372 handleQuery() {
401   - this.queryParams.pageNum = 1;
  373 + this.queryParams.pageNo = 1;
402 374 this.getList();
403 375 },
404 376 /** 重置按钮操作 */
... ... @@ -412,12 +384,6 @@ export default {
412 384 this.resetForm("queryForm");
413 385 this.handleQuery();
414 386 },
415   - // 多选框选中数据
416   - handleSelectionChange(selection) {
417   - this.ids = selection.map(item => item.${pkColumn.javaField})
418   - this.single = selection.length!==1
419   - this.multiple = !selection.length
420   - },
421 387 /** 新增按钮操作 */
422 388 handleAdd() {
423 389 this.reset();
... ... @@ -435,9 +401,6 @@ export default {
435 401 this.form.$column.javaField = this.form.${column.javaField}.split(",");
436 402 #end
437 403 #end
438   -#if($table.sub)
439   - this.${subclassName}List = response.data.${subclassName}List;
440   -#end
441 404 this.open = true;
442 405 this.title = "修改${functionName}";
443 406 });
... ... @@ -451,9 +414,6 @@ export default {
451 414 this.form.$column.javaField = this.form.${column.javaField}.join(",");
452 415 #end
453 416 #end
454   -#if($table.sub)
455   - this.form.${subclassName}List = this.${subclassName}List;
456   -#end
457 417 if (this.form.${pkColumn.javaField} != null) {
458 418 update${BusinessName}(this.form).then(response => {
459 419 this.msgSuccess("修改成功");
... ... @@ -484,40 +444,6 @@ export default {
484 444 this.msgSuccess("删除成功");
485 445 })
486 446 },
487   -#if($table.sub)
488   - /** ${subTable.functionName}序号 */
489   - row${subClassName}Index({ row, rowIndex }) {
490   - row.index = rowIndex + 1;
491   - },
492   - /** ${subTable.functionName}添加按钮操作 */
493   - handleAdd${subClassName}() {
494   - let obj = {};
495   -#foreach($column in $subTable.columns)
496   -#if($column.pk || $column.javaField == ${subTableFkclassName})
497   -#elseif($column.list && "" != $javaField)
498   - obj.$column.javaField = "";
499   -#end
500   -#end
501   - this.${subclassName}List.push(obj);
502   - },
503   - /** ${subTable.functionName}删除按钮操作 */
504   - handleDelete${subClassName}() {
505   - if (this.checked${subClassName}.length == 0) {
506   - this.$alert("请先选择要删除的${subTable.functionName}数据", "提示", { confirmButtonText: "确定", });
507   - } else {
508   - this.${subclassName}List.splice(this.checked${subClassName}[0].index - 1, 1);
509   - }
510   - },
511   - /** 单选框选中数据 */
512   - handle${subClassName}SelectionChange(selection) {
513   - if (selection.length > 1) {
514   - this.$refs.${subclassName}.clearSelection();
515   - this.$refs.${subclassName}.toggleRowSelection(selection.pop());
516   - } else {
517   - this.checked${subClassName} = selection;
518   - }
519   - },
520   -#end
521 447 /** 导出按钮操作 */
522 448 handleExport() {
523 449 const queryParams = this.queryParams;
... ...