blog的后端代码
view | history | commit | commitdiff
inleft
2022-03-02 34223b096cf6ad9d92c3702bb9529e764f523b11
commit | author | age
9bcb19 1 <template>
I 2   <div>
3     <a-card :bordered="false" :bodyStyle="tstyle">
4 #if($queryWhetherList.size() > 0)
5       <div class="table-page-search-wrapper" v-if="hasPerm('${className}:page')">
6         <a-form layout="inline">
7           <a-row :gutter="48">
8 #foreach ($column in $queryWhetherList)
9 #if($foreach.count == 3)
10             <template v-if="advanced">
11 #end
12 #if(${column.effectType} == 'input' || ${column.effectType} == 'textarea')
13 #if($foreach.count >= 3)
14               <a-col :md="8" :sm="24">
15                 <a-form-item label="${column.columnComment}">
16                   <a-input v-model="queryParam.${column.javaName}" allow-clear placeholder="请输入${column.columnComment}"/>
17                 </a-form-item>
18               </a-col>
19 #else
20             <a-col :md="8" :sm="24">
21               <a-form-item label="${column.columnComment}">
22                 <a-input v-model="queryParam.${column.javaName}" allow-clear placeholder="请输入${column.columnComment}"/>
23               </a-form-item>
24             </a-col>
25 #end
26 #elseif(${column.effectType} == 'inputnumber')
27 #if($foreach.count >= 3)
28               <a-col :md="8" :sm="24">
29                 <a-form-item label="${column.columnComment}">
30                   <a-input-number v-model="queryParam.${column.javaName}" style="width: 100%" allow-clear placeholder="请输入${column.columnComment}"/>
31                 </a-form-item>
32               </a-col>
33 #else
34             <a-col :md="8" :sm="24">
35               <a-form-item label="${column.columnComment}">
36                 <a-input-number v-model="queryParam.${column.javaName}" style="width: 100%" allow-clear placeholder="请输入${column.columnComment}"/>
37               </a-form-item>
38             </a-col>
39 #end
40 #elseif(${column.effectType} == 'select' || ${column.effectType} == 'radio')
41 #if($foreach.count >= 3)
42               <a-col :md="8" :sm="24">
43                 <a-form-item label="${column.columnComment}">
44                   <a-select style="width: 100%" v-model="queryParam.${column.javaName}" placeholder="请选择${column.columnComment}">
45                     <a-select-option v-for="(item,index) in ${column.javaName}Data" :key="index" :value="item.code">{{ item.name }}</a-select-option>
46                   </a-select>
47                 </a-form-item>
48               </a-col>
49 #else
50             <a-col :md="8" :sm="24">
51               <a-form-item label="${column.columnComment}">
52                 <a-select style="width: 100%" v-model="queryParam.${column.javaName}" placeholder="请选择${column.columnComment}">
53                   <a-select-option v-for="(item,index) in ${column.javaName}Data" :key="index" :value="item.code">{{ item.name }}</a-select-option>
54                 </a-select>
55               </a-form-item>
56             </a-col>
57 #end
58 #elseif(${column.effectType} == 'datepicker')
59 #if($foreach.count >= 3)
60               <a-col :md="8" :sm="24">
61                 <a-form-item label="${column.columnComment}">
62                   <a-date-picker style="width: 100%" placeholder="请选择${column.columnComment}" v-model="queryParam.${column.javaName}Date" @change="onChange${column.javaName}"/>
63                 </a-form-item>
64               </a-col>
65 #else
66             <a-col :md="8" :sm="24">
67               <a-form-item label="${column.columnComment}">
68                 <a-date-picker style="width: 100%" placeholder="请选择${column.columnComment}" v-model="queryParam.${column.javaName}Date" @change="onChange${column.javaName}"/>
69               </a-form-item>
70             </a-col>
71 #end
72 #else
73 #end
74 #end
75 #if($queryWhetherList.size() > 2)
76             </template>
77 #end
78 #if($queryWhetherList.size() > 2)
79             <a-col :md="8" :sm="24" >
80               <span class="table-page-search-submitButtons">
81                 <a-button type="primary" @click="$refs.table.refresh(true)" >查询</a-button>
82                 <a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
83                 <a @click="toggleAdvanced" style="margin-left: 8px">
84                   {{ advanced ? '收起' : '展开' }}
85                   <a-icon :type="advanced ? 'up' : 'down'"/>
86                 </a>
87               </span>
88             </a-col>
89 #else
90             <a-col :md="8" :sm="24">
91               <span class="table-page-search-submitButtons">
92                 <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
93                 <a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
94               </span>
95             </a-col>
96 #end
97           </a-row>
98         </a-form>
99       </div>
100 #end
101     </a-card>
102     <a-card :bordered="false">
103       <s-table
104         ref="table"
105         :columns="columns"
106         :data="loadData"
107         :alert="options.alert"
108 #foreach ($column in $tableField)
109 #if (${column.columnKey} == "PRI")
110         :rowKey="(record) => record.${column.javaName}"
111 #end
112 #end
113         :rowSelection="options.rowSelection"
114       >
115         <template class="table-operator" slot="operator" v-if="hasPerm('${className}:add')" >
116           <a-button type="primary" v-if="hasPerm('${className}:add')" icon="plus" @click="$refs.addForm.add()">新增${functionName}</a-button>
117           <a-button type="danger" :disabled="selectedRowKeys.length < 1" v-if="hasPerm('${className}:delete')" @click="batchDelete"><a-icon type="delete"/>批量删除</a-button>
118           <x-down
119             v-if="hasPerm('${className}:export')"
120             ref="batchExport"
121             @batchExport="batchExport"
122           />
123         </template>
124 #foreach ($column in $tableField)
125 #if(${column.whetherTable} == "Y")
126 #if(${column.whetherRetract} == "Y" || ${column.effectType} == 'select' || ${column.effectType} == 'radio' || ${column.effectType} == 'checkbox')
127         <span slot="${column.javaName}ScopedSlots" slot-scope="text">
128 #if(${column.whetherRetract} == "Y" && (${column.effectType} == 'select' || ${column.effectType} == 'radio' || ${column.effectType} == 'checkbox'))
129           <ellipsis :length="10" tooltip>{{ '${column.dictTypeCode}' | dictType(text) }}</ellipsis>
130 #else
131 #if(${column.whetherRetract} == "Y")
132           <ellipsis :length="10" tooltip>{{ text }}</ellipsis>
133 #else
134 #if(${column.effectType} == 'checkbox')
135           <a-tag v-for="textData in JSON.parse(text)" :key="textData.code" color="green">{{ 'sex' | dictType(textData) }}</a-tag>
136 #else
137           {{ '${column.dictTypeCode}' | dictType(text) }}
138 #end
139 #end
140 #end
141         </span>
142 #end
143 #end
144 #end
145         <span slot="action" slot-scope="text, record">
146           <a v-if="hasPerm('${className}:edit')" @click="$refs.editForm.edit(record)">编辑</a>
147           <a-divider type="vertical" v-if="hasPerm('${className}:edit') & hasPerm('${className}:delete')"/>
148           <a-popconfirm v-if="hasPerm('${className}:delete')" placement="topRight" title="确认删除？" @confirm="() => singleDelete(record)">
149             <a>删除</a>
150           </a-popconfirm>
151         </span>
152       </s-table>
153       <add-form ref="addForm" @ok="handleOk" />
154       <edit-form ref="editForm" @ok="handleOk" />
155     </a-card>
156   </div>
157 </template>
158 <script>
159 #set ($columnData = 0)
160 #foreach ($column in $tableField)
161 #if(${column.whetherTable} == "Y")
162 #if(${column.whetherRetract} == "Y")
163 #set ($Ellipsis="Y")
164 #end
165 #set ($columnData = $columnData+1)
166 #end
167 #if(${column.queryWhether} == 'Y')
168 #if(${column.effectType} == 'datepicker')
169 #set ($DateQuery="Y")
170 #end
171 #end
172 #end
173 #if($Ellipsis == "Y")
174   import { STable, XDown, Ellipsis } from '@/components'
175 #else
176   import { STable, XDown } from '@/components'
177 #end
178 #if($DateQuery == "Y")
179   import moment from 'moment'
180 #end
181   import { ${className}Page, ${className}Delete, ${className}Export } from '@/api/modular/main/${busName}/${className}Manage'
182   import addForm from './addForm.vue'
183   import editForm from './editForm.vue'
184   export default {
185     components: {
186 #if($Ellipsis == "Y")
187       Ellipsis,
188 #end
189       STable,
190       addForm,
191       editForm,
192       XDown
193     },
194     data () {
195       return {
196 #if($queryWhetherList.size() > 2)
197         // 高级搜索 展开/关闭
198         advanced: false,
199 #end
200         // 查询参数
201         queryParam: {},
202         // 表头
203         columns: [
204 #set ($columnDataColumns = 0)
205 #foreach ($column in $tableField)
206 #if (${column.whetherTable} == "Y")
207 #set ($columnDataColumns = $columnDataColumns+1)
208           {
209             title: '${column.columnComment}',
210             align: 'center',
211 #if(${column.whetherRetract} == "Y" || ${column.effectType} == 'select' || ${column.effectType} == 'radio' || ${column.effectType} == 'checkbox')
212             dataIndex: '${column.javaName}',
213             scopedSlots: { customRender: '${column.javaName}ScopedSlots' }
214 #else
215             dataIndex: '${column.javaName}'
216 #end
217           }#if($foreach.hasNext && ($columnDataColumns != $columnData)),
218 #else
219
220 #end
221 #end
222 #end
223         ],
224         tstyle: { 'padding-bottom': '0px', 'margin-bottom': '10px' },
225         // 加载数据方法 必须为 Promise 对象
226         loadData: parameter => {
227 #if($DateQuery == "Y")
228           return ${className}Page(Object.assign(parameter, this.switchingDate())).then((res) => {
229 #else
230           return ${className}Page(Object.assign(parameter, this.queryParam)).then((res) => {
231 #end
232             return res.data
233           })
234         },
235 #foreach ($column in $tableField)
236 #if(${column.queryWhether} == 'Y')
237 #if(${column.effectType} == 'select' || ${column.effectType} == 'radio')
238 #if (${column.dictTypeCode})
239         ${column.javaName}Data: [],
240 #end
241 #end
242 #end
243 #end
244         selectedRowKeys: [],
245         selectedRows: [],
246         options: {
247           alert: { show: true, clear: () => { this.selectedRowKeys = [] } },
248           rowSelection: {
249             selectedRowKeys: this.selectedRowKeys,
250             onChange: this.onSelectChange
251           }
252         }
253       }
254     },
255     created () {
256       if (this.hasPerm('${className}:edit') || this.hasPerm('${className}:delete')) {
257         this.columns.push({
258           title: '操作',
259           width: '150px',
260           dataIndex: 'action',
261           scopedSlots: { customRender: 'action' }
262         })
263       }
264 #foreach ($column in $tableField)
265 #if(${column.queryWhether} == 'Y')
266 #if(${column.effectType} == 'select' || ${column.effectType} == 'radio')
267 #if (${column.dictTypeCode})
268       const ${column.javaName}Option = this.$options
269       this.${column.javaName}Data = ${column.javaName}Option.filters['dictData']('${column.dictTypeCode}')
270 #end
271 #end
272 #end
273 #end
274     },
275     methods: {
276 #if($DateQuery == "Y")
277       moment,
278       /**
279        * 查询参数组装
280        */
281       switchingDate () {
282 #foreach ($column in $tableField)
283 #if(${column.queryWhether} == 'Y')
284 #if(${column.effectType} == 'datepicker')
285         const queryParam${column.javaName} = this.queryParam.${column.javaName}Date
286         if (queryParam${column.javaName} != null) {
287             this.queryParam.${column.javaName} = moment(queryParam${column.javaName}).format('YYYY-MM-DD')
288             if (queryParam${column.javaName}.length < 1) {
289                 delete this.queryParam.${column.javaName}
290             }
291         }
292 #end
293 #end
294 #end
295         const obj = JSON.parse(JSON.stringify(this.queryParam))
296         return obj
297       },
298 #end
299       /**
300        * 单个删除
301        */
302       singleDelete (record) {
303 #foreach ($column in $tableField)
304 #if (${column.columnKey} == "PRI")
305         const param = [{ '${column.javaName}': record.${column.javaName} }]
306 #end
307 #end
308         this.${className}Delete(param)
309       },
310       /**
311        * 批量删除
312        */
313       batchDelete () {
314         const paramIds = this.selectedRowKeys.map((d) => {
315 #foreach ($column in $tableField)
316 #if (${column.columnKey} == "PRI")
317             return { '${column.javaName}': d }
318 #end
319 #end
320         })
321         this.${className}Delete(paramIds)
322       },
323       ${className}Delete (record) {
324         ${className}Delete(record).then((res) => {
325           if (res.success) {
326             this.$message.success('删除成功')
327             this.$refs.table.clearRefreshSelected()
328           } else {
329             this.$message.error('删除失败') // + res.message
330           }
331         })
332       },
333 #if($queryWhetherList.size() > 2)
334       toggleAdvanced () {
335         this.advanced = !this.advanced
336       },
337 #end
338 #foreach ($column in $queryWhetherList)
339 #if(${column.queryWhether} == 'Y')
340 #if(${column.effectType} == 'datepicker')
341       onChange${column.javaName}(date, dateString) {
342         this.${column.javaName}DateString = dateString
343       },
344 #end
345 #end
346 #end
347       /**
348        * 批量导出
349        */
350       batchExport () {
351         const paramIds = this.selectedRowKeys.map((d) => {
352 #foreach ($column in $tableField)
353 #if (${column.columnKey} == "PRI")
354             return { '${column.javaName}': d }
355 #end
356 #end
357         })
358         ${className}Export(paramIds).then((res) => {
359             this.$refs.batchExport.downloadfile(res)
360         })
361       },
362       handleOk () {
363         this.$refs.table.refresh()
364       },
365       onSelectChange (selectedRowKeys, selectedRows) {
366         this.selectedRowKeys = selectedRowKeys
367         this.selectedRows = selectedRows
368       }
369     }
370   }
371 </script>
372 <style lang="less">
373   .table-operator {
374     margin-bottom: 18px;
375   }
376   button {
377     margin-right: 8px;
378   }
379 </style>