Commit 943ff75b68170c13a3a5caf92a1d7db6b481badc
1 parent
668f6c53
Exists in
dev
fix:联调支付管理以及车辆管理的界面以及接口联调
Showing
6 changed files
with
1901 additions
and
15 deletions
Show diff stats
frontend/front/src/api/regionalManage.js
... | ... | @@ -94,3 +94,91 @@ export function addEquipmentPort(data) { |
94 | 94 | data |
95 | 95 | }) |
96 | 96 | } |
97 | + | |
98 | +// ------------------------------------------基础信息配置管理-支付配置接口----------------------------------- | |
99 | + | |
100 | +//支付-支付配置-获取table列表接口 | |
101 | +export function paymentTableDataPort(data) { | |
102 | + return request({ | |
103 | + url: `${context.bpmModel}/bo/def/v1/list/czzfpz?boEntName=czzfpz`, | |
104 | + method: 'post', | |
105 | + data | |
106 | + }) | |
107 | +} | |
108 | +//基础信息配置管理-新增或编辑支付接口 | |
109 | +export function addOrEditPaymentPort(data) { | |
110 | + return request({ | |
111 | + url: `${context.bpmModel}/bo/def/v1/saveBo/czzfpz?boEntName=czzfpz`, | |
112 | + method: 'post', | |
113 | + data | |
114 | + }) | |
115 | +} | |
116 | +//基础信息配置管理-删除支付接口 | |
117 | +export function deletePaymentPort(data) { | |
118 | + return request({ | |
119 | + url: `${context.bpmModel}/bo/def/v1/deleteBo/czzfpz?boEntName=czzfpz&ids=${data.ids}`, | |
120 | + method: 'post', | |
121 | + data | |
122 | + }) | |
123 | +} | |
124 | + | |
125 | +// ------------------------------------------基础信息配置管理-车辆配置接口----------------------------------- | |
126 | + | |
127 | +//车辆-车辆配置-获取table列表接口 | |
128 | +export function carTableDataPort(data) { | |
129 | + return request({ | |
130 | + url: `${context.bpmModel}/bo/def/v1/list/clxx?boEntName=clxx`, | |
131 | + method: 'post', | |
132 | + data | |
133 | + }) | |
134 | +} | |
135 | +//基础信息配置管理-新增或编辑车辆接口 | |
136 | +export function addOrEditCarPort(data) { | |
137 | + return request({ | |
138 | + url: `${context.bpmModel}/bo/def/v1/saveBo/clxx?boEntName=clxx`, | |
139 | + method: 'post', | |
140 | + data | |
141 | + }) | |
142 | +} | |
143 | +//基础信息配置管理-删除车辆接口 | |
144 | +export function deleteCarPort(data) { | |
145 | + return request({ | |
146 | + url: `${context.bpmModel}/bo/def/v1/deleteBo/clxx?boEntName=clxx&ids=${data.ids}`, | |
147 | + method: 'post', | |
148 | + data | |
149 | + }) | |
150 | +} | |
151 | +//基础信息配置管理-获取车辆型号接口 | |
152 | +export function carTypeNumPort(data) { | |
153 | + return request({ | |
154 | + url: `${context.bpmModel}/sys/identity/v1/getNextIdByAlias?alias=clxh`, | |
155 | + method: 'get', | |
156 | + data | |
157 | + }) | |
158 | +} | |
159 | +// ------------------------------------------基础信息配置管理-车辆设备配置接口----------------------------------- | |
160 | + | |
161 | +//车辆-车辆配置-获取table列表接口 | |
162 | +export function carGPSTableDataPort(data) { | |
163 | + return request({ | |
164 | + url: `${context.bpmModel}/bo/def/v1/list/clsb?boEntName=clsb`, | |
165 | + method: 'post', | |
166 | + data | |
167 | + }) | |
168 | +} | |
169 | +// //基础信息配置管理-新增或编辑车辆接口 | |
170 | +export function addCarGpsPort(data) { | |
171 | + return request({ | |
172 | + url: `${context.bpmModel}/bo/def/v1/saveBo/clsb?boEntName=clsb`, | |
173 | + method: 'post', | |
174 | + data | |
175 | + }) | |
176 | +} | |
177 | +//基础信息配置管理-删除车辆接口 | |
178 | +export function deleteCarGPSPort(data) { | |
179 | + return request({ | |
180 | + url: `${context.bpmModel}/bo/def/v1/deleteBo/clsb?boEntName=clsb&ids=${data.ids}`, | |
181 | + method: 'post', | |
182 | + data | |
183 | + }) | |
184 | +} | ... | ... |
frontend/front/src/views/pages/regionalManage/components/carBindGps.vue
0 → 100644
... | ... | @@ -0,0 +1,518 @@ |
1 | +<template> | |
2 | + <div class="dialogSty"> | |
3 | + <el-dialog | |
4 | + :title="dialogParam.title" | |
5 | + :visible.sync="dialogParam.dialogVisible" | |
6 | + width="70%" | |
7 | + @close="handleClose('dialogForm')"> | |
8 | + <el-row style="margin-top: 10px;" v-if="dialogForm.dialogType == 'show'"> | |
9 | + <el-col :span="24"> | |
10 | + <el-form :model="queryForm" ref="queryForm" :inline="true"> | |
11 | + <el-form-item label="设备名称:"> | |
12 | + <el-input v-model="queryForm.sbmc" placeholder="请输入设备名称" clearable></el-input> | |
13 | + </el-form-item> | |
14 | + <el-form-item label="设备编号:"> | |
15 | + <el-input v-model="queryForm.sbbh" placeholder="请输入设备编号" clearable></el-input> | |
16 | + </el-form-item> | |
17 | + <el-form-item> | |
18 | + <el-button type="primary" style="background: #5875eb; border: 1px solid #5875eb; border-radius: 5px;" | |
19 | + icon="el-icon-plus" @click="hanleOpt('add')"> 新增GPS | |
20 | + </el-button> | |
21 | + <el-button type="primary" icon="el-icon-refresh" | |
22 | + style="border: 1px solid #5875eb; background: #ffffff; color: #5875eb; border-radius: 5px;" | |
23 | + @click="handleReset" plain>重置 | |
24 | + </el-button> | |
25 | + <el-button type="primary" style="background: #5875eb; border: 1px solid #5875eb; border-radius: 5px;" | |
26 | + icon="el-icon-search" @click="handleSearch"> 查询 | |
27 | + </el-button> | |
28 | + </el-form-item> | |
29 | + </el-form> | |
30 | + </el-col> | |
31 | + <el-col :span="24"> | |
32 | + <el-table | |
33 | + style="width: 100%" | |
34 | + v-loading="loading" | |
35 | + :data="tableData"> | |
36 | + <el-table-column | |
37 | + type="index" | |
38 | + label="序号"> | |
39 | + </el-table-column> | |
40 | + <el-table-column | |
41 | + prop="F_ssczmc" | |
42 | + min-width="120" | |
43 | + label="厂站名称"> | |
44 | + </el-table-column> | |
45 | + <el-table-column | |
46 | + prop="F_cllx" | |
47 | + min-width="120" | |
48 | + label="车辆类型"> | |
49 | + </el-table-column> | |
50 | + <el-table-column | |
51 | + prop="F_sbbh" | |
52 | + min-width="120" | |
53 | + label="设备编号"> | |
54 | + </el-table-column> | |
55 | + <el-table-column | |
56 | + prop="F_sbmc" | |
57 | + min-width="120" | |
58 | + label="设备名称"> | |
59 | + </el-table-column> | |
60 | + <el-table-column | |
61 | + prop="F_sblx" | |
62 | + label="设备类型"> | |
63 | + </el-table-column> | |
64 | +<!-- <el-table-column--> | |
65 | +<!-- prop="F_sbpp"--> | |
66 | +<!-- label="设备品牌">--> | |
67 | +<!-- </el-table-column>--> | |
68 | +<!-- <el-table-column--> | |
69 | +<!-- prop="F_sbwz"--> | |
70 | +<!-- min-width="120"--> | |
71 | +<!-- label="设备位置">--> | |
72 | +<!-- </el-table-column>--> | |
73 | +<!-- <el-table-column--> | |
74 | +<!-- prop="F_sbzt"--> | |
75 | +<!-- label="设备状态">--> | |
76 | +<!-- </el-table-column>--> | |
77 | + <el-table-column | |
78 | + prop="opt" | |
79 | + width="100" | |
80 | + label="操作"> | |
81 | + <template slot-scope="scope"> | |
82 | + <el-button type="text" style="color: red;" @click="hanleOpt('delete',scope.row)">删除</el-button> | |
83 | + </template> | |
84 | + </el-table-column> | |
85 | + </el-table> | |
86 | + </el-col> | |
87 | + <el-col :span="24"> | |
88 | + <el-pagination | |
89 | + style="float: right;margin-top: 10px;" | |
90 | + @current-change="handleCurrentChange" | |
91 | + @size-change="handleSizeChange" | |
92 | + :current-page="pageParam.page" | |
93 | + :page-sizes="[10,20,,50,100]" | |
94 | + :page-size="pageParam.size" | |
95 | + layout="total, sizes, prev, pager, next, jumper" | |
96 | + :total="pageParam.total" | |
97 | + > | |
98 | + </el-pagination> | |
99 | + </el-col> | |
100 | + </el-row> | |
101 | + <el-row style="margin-top: 10px;" v-if="dialogForm.dialogType == 'select'"> | |
102 | + <el-col :span="24"> | |
103 | + <el-table | |
104 | + ref="multipleTable" | |
105 | + style="width: 100%" | |
106 | + v-loading="loading1" | |
107 | + row-key="node_code" | |
108 | + @selection-change="handleSelectionChange" | |
109 | + :data="tableData1"> | |
110 | + <el-table-column type="selection" width="55" /> | |
111 | + <el-table-column | |
112 | + type="index" | |
113 | + label="序号"> | |
114 | + </el-table-column> | |
115 | + <el-table-column | |
116 | + prop="F_czmc" | |
117 | + min-width="120" | |
118 | + label="厂站名称"> | |
119 | + </el-table-column> | |
120 | + <el-table-column | |
121 | + prop="F_sbbh" | |
122 | + min-width="120" | |
123 | + label="设备编号"> | |
124 | + </el-table-column> | |
125 | + <el-table-column | |
126 | + prop="F_sbmc" | |
127 | + min-width="120" | |
128 | + label="设备名称"> | |
129 | + </el-table-column> | |
130 | + <el-table-column | |
131 | + prop="F_syzt" | |
132 | + label="使用状态"> | |
133 | + </el-table-column> | |
134 | + <el-table-column | |
135 | + prop="F_sbpp" | |
136 | + label="设备品牌"> | |
137 | + </el-table-column> | |
138 | + <el-table-column | |
139 | + prop="F_sbwz" | |
140 | + min-width="120" | |
141 | + label="设备位置"> | |
142 | + </el-table-column> | |
143 | + <el-table-column | |
144 | + prop="F_sbzt" | |
145 | + label="设备状态"> | |
146 | + </el-table-column> | |
147 | + </el-table> | |
148 | + </el-col> | |
149 | + <el-col :span="24"> | |
150 | + <el-pagination | |
151 | + style="float: right;margin-top: 10px;" | |
152 | + @current-change="handleCurrentChange1" | |
153 | + @size-change="handleSizeChange1" | |
154 | + :current-page="pageParam1.page" | |
155 | + :page-sizes="[10,20,,50,100]" | |
156 | + :page-size="pageParam1.size" | |
157 | + layout="total, sizes, prev, pager, next, jumper" | |
158 | + :total="pageParam1.total" | |
159 | + > | |
160 | + </el-pagination> | |
161 | + </el-col> | |
162 | + </el-row> | |
163 | + <span slot="footer" class="dialog-footer"> | |
164 | + <el-button @click="handleClose('dialogForm')">取 消</el-button> | |
165 | + <el-button type="primary" @click="handleSubmit('dialogForm')">确 定</el-button> | |
166 | + </span> | |
167 | + </el-dialog> | |
168 | + </div> | |
169 | +</template> | |
170 | + | |
171 | +<script> | |
172 | +import {carGPSTableDataPort, addCarGpsPort, videoTableDataPort,deleteCarGPSPort} from "@/api/regionalManage"; | |
173 | +import moment from "moment"; | |
174 | +export default { | |
175 | + name: "realNameAuditDialog", | |
176 | + data(){ | |
177 | + return{ | |
178 | + rowData:{}, | |
179 | + loading1:false, | |
180 | + tableData1:[], | |
181 | + tableData:[], | |
182 | + loading:false, | |
183 | + dialogForm:{ | |
184 | + dialogType:'show', | |
185 | + }, | |
186 | + queryForm:{ | |
187 | + F_sbbh:'', | |
188 | + sbbh:'', | |
189 | + orgId:'' | |
190 | + }, | |
191 | + dialogFormRules:{ | |
192 | + fRzzt:[ | |
193 | + { required:true,message:'请勾选审核意见'} | |
194 | + ] | |
195 | + }, | |
196 | + cardImgList:[], | |
197 | + pageParam:{ | |
198 | + page:1, | |
199 | + size:10, | |
200 | + total:0 | |
201 | + }, | |
202 | + pageParam1:{ | |
203 | + page:1, | |
204 | + size:10, | |
205 | + total:0 | |
206 | + }, | |
207 | + enterpriseImgList:[], | |
208 | + dialogParam:{ | |
209 | + dialogVisible:false, | |
210 | + title:'绑定GPS设备', | |
211 | + dialogType:'非居民' | |
212 | + }, | |
213 | + multipleSelection: [], // 多选存储数据 | |
214 | + checkedSelection: {}, // 单选存储数据 | |
215 | + } | |
216 | + }, | |
217 | + methods:{ | |
218 | + open(row) { | |
219 | + console.log('打印详情部分row===>',row) | |
220 | + this.rowData ={ | |
221 | + ...row | |
222 | + } | |
223 | + this.dialogForm.dialogType = 'show'; | |
224 | + this.dialogForm.reason = ''; | |
225 | + this.dialogParam.dialogVisible= true; | |
226 | + this.dialogParam.dialogType = row.whyxxfhylx; | |
227 | + this.getDataList(); | |
228 | + }, | |
229 | + //获取table表格数据 | |
230 | + async getDataList(){ | |
231 | + let params ={ | |
232 | + pageBean:{ | |
233 | + page:this.pageParam.page, | |
234 | + pageSize:this.pageParam.size, | |
235 | + showTotal:true | |
236 | + }, | |
237 | + querys:[] | |
238 | + } | |
239 | + if(this.queryForm.F_cph){ | |
240 | + params.querys.push({ | |
241 | + group:'main', | |
242 | + operation:'LIKE', | |
243 | + property:'F_cph', | |
244 | + relation:'AND', | |
245 | + value:this.queryForm.F_cph | |
246 | + }) | |
247 | + } | |
248 | + if(this.queryForm.F_cllx){ | |
249 | + params.querys.push({ | |
250 | + group:'main', | |
251 | + operation:'LIKE', | |
252 | + property:'F_cllx', | |
253 | + relation:'AND', | |
254 | + value:this.queryForm.F_cllx | |
255 | + }) | |
256 | + } | |
257 | + if(this.queryForm.F_sbbh){ | |
258 | + params.querys.push({ | |
259 | + group:'main', | |
260 | + operation:'LIKE', | |
261 | + property:'F_sbbh', | |
262 | + relation:'AND', | |
263 | + value:this.queryForm.F_sbbh | |
264 | + }) | |
265 | + } | |
266 | + if(this.rowData.ID_){ | |
267 | + params.querys.push({ | |
268 | + group:'main', | |
269 | + operation:'LIKE', | |
270 | + property:'F_clId', | |
271 | + relation:'AND', | |
272 | + value:this.rowData.ID_ | |
273 | + }) | |
274 | + } | |
275 | + if(this.rowData.F_ssqyID){ | |
276 | + params.querys.push({ | |
277 | + group:'main', | |
278 | + operation:'LIKE', | |
279 | + property:'F_ssqyId', | |
280 | + relation:'AND', | |
281 | + value:this.rowData.F_ssqyID | |
282 | + }) | |
283 | + } | |
284 | + if(this.rowData.F_ssczId){ | |
285 | + params.querys.push({ | |
286 | + group:'main', | |
287 | + operation:'LIKE', | |
288 | + property:'F_ssczId', | |
289 | + relation:'AND', | |
290 | + value:this.rowData.F_ssczId | |
291 | + }) | |
292 | + } | |
293 | + this.loading = true; | |
294 | + await carGPSTableDataPort(params).then((res)=>{ | |
295 | + const { rows,total } = res; | |
296 | + this.tableData = rows; | |
297 | + this.pageParam.total = total; | |
298 | + setTimeout(()=>{ | |
299 | + this.loading = false; | |
300 | + },500) | |
301 | + }) | |
302 | + }, | |
303 | + // toggleSelection(rows) { | |
304 | + // if (rows) { | |
305 | + // rows.forEach((row) => { | |
306 | + // this.$refs.multipleTable.toggleRowSelection(row); | |
307 | + // }); | |
308 | + // } else { | |
309 | + // this.$refs.multipleTable.clearSelection(); | |
310 | + // } | |
311 | + // }, | |
312 | + // 多选框选中数据 | |
313 | + handleSelectionChange(val) { | |
314 | + console.log('val--==', val); | |
315 | + // 默认多选 | |
316 | + // this.multipleSelection = val; | |
317 | + | |
318 | + // 单选 | |
319 | + if(val.length == 1){ | |
320 | + let item = val[val.length -1]; | |
321 | + this.checkedSelection = JSON.parse(JSON.stringify(item)); | |
322 | + } | |
323 | + | |
324 | + // 单选选中多条时,需要清空所选数据 | |
325 | + if(val.length > 1){ | |
326 | + this.$refs.multipleTable.clearSelection(); // 清空选项 | |
327 | + this.$refs.multipleTable.toggleRowSelection(val.pop()); // 选中最后点击的数据 | |
328 | + } | |
329 | + // 取消选中 | |
330 | + if(val.length == 0){ | |
331 | + this.checkedSelection = {}; | |
332 | + } | |
333 | + }, | |
334 | + selectChange(selection, row) { | |
335 | + if (selection.length > 1) { | |
336 | + const del_row = selection.shift(); | |
337 | + this.$refs.table1.toggleRowSelection(del_row, false); | |
338 | + } | |
339 | + console.log(selection); | |
340 | + this.selectArr = selection; | |
341 | + }, | |
342 | + //获取table表格数据 | |
343 | + async getGPSDataList(){ | |
344 | + let params ={ | |
345 | + pageBean:{ | |
346 | + page:this.pageParam1.page, | |
347 | + pageSize:this.pageParam1.size, | |
348 | + showTotal:true | |
349 | + }, | |
350 | + querys:[ | |
351 | + { | |
352 | + group:'main', | |
353 | + operation:'LIKE', | |
354 | + property:'F_sblx', | |
355 | + relation:'AND', | |
356 | + value:'GPS' | |
357 | + } | |
358 | + ], | |
359 | + sorter:[ | |
360 | + { | |
361 | + direction:'ASC', | |
362 | + property:'F_pxh' | |
363 | + } | |
364 | + ] | |
365 | + } | |
366 | + if(this.rowData.F_ssczId){ | |
367 | + params.querys.push({ | |
368 | + group:'main', | |
369 | + operation:'LIKE', | |
370 | + property:'F_czid', | |
371 | + relation:'AND', | |
372 | + value:this.rowData.F_ssczId | |
373 | + }) | |
374 | + } | |
375 | + if(this.rowData.F_ssqyID){ | |
376 | + params.querys.push({ | |
377 | + group:'main', | |
378 | + operation:'LIKE', | |
379 | + property:'F_qyid', | |
380 | + relation:'AND', | |
381 | + value:this.rowData.F_ssqyID | |
382 | + }) | |
383 | + } | |
384 | + this.loading1 = true; | |
385 | + await videoTableDataPort(params).then((res)=>{ | |
386 | + const { rows,total } = res; | |
387 | + this.tableData1 = rows; | |
388 | + this.pageParam1.total = total; | |
389 | + setTimeout(()=>{ | |
390 | + this.loading1 = false; | |
391 | + },500) | |
392 | + }) | |
393 | + }, | |
394 | + //重置按钮事件 | |
395 | + handleReset(){ | |
396 | + this.queryForm.F_sbbh =''; | |
397 | + this.queryForm.sbmc =''; | |
398 | + this.queryForm.F_zjbh =''; | |
399 | + this.pageParam.page = 1; | |
400 | + this.handleSearch(); | |
401 | + }, | |
402 | + //查询按钮事件 | |
403 | + handleSearch(){ | |
404 | + this.getDataList(); | |
405 | + }, | |
406 | + //分页中页数跳转事件 | |
407 | + handleCurrentChange1(val){ | |
408 | + this.pageParam1.page = val; | |
409 | + this.getGPSDataList(); | |
410 | + }, | |
411 | + //分页中size改变的界面跳转事件 | |
412 | + handleSizeChange1(val){ | |
413 | + this.pageParam1.size = val; | |
414 | + this.getGPSDataList(); | |
415 | + }, | |
416 | + //分页中页数跳转事件 | |
417 | + handleCurrentChange(val){ | |
418 | + this.pageParam.page = val; | |
419 | + this.handleSearch(); | |
420 | + }, | |
421 | + //分页中size改变的界面跳转事件 | |
422 | + handleSizeChange(val){ | |
423 | + this.pageParam.size = val; | |
424 | + this.handleSearch(); | |
425 | + }, | |
426 | + //操作栏按钮 | |
427 | + async hanleOpt(type,row){ | |
428 | + console.log('打印row=====>',row); | |
429 | + switch (type){ | |
430 | + case 'add': | |
431 | + this.dialogForm.dialogType = 'select'; | |
432 | + await this.getGPSDataList(); | |
433 | + break; | |
434 | + case 'delete': | |
435 | + this.$confirm('确定是否删除该绑定的GPS设备?', '提示', { | |
436 | + confirmButtonText: '确定', | |
437 | + cancelButtonText: '取消', | |
438 | + type: 'warning', | |
439 | + }).then(async() => { | |
440 | + await deleteCarGPSPort({ids:row.ID_}).then((res)=>{ | |
441 | + this.getDataList(); | |
442 | + }) | |
443 | + }) | |
444 | + break; | |
445 | + } | |
446 | + }, | |
447 | + //关闭弹窗的事件 | |
448 | + handleClose(formName){ | |
449 | + switch (this.dialogForm.dialogType){ | |
450 | + case "show": | |
451 | + this.dialogParam.dialogVisible = false; | |
452 | + break; | |
453 | + case 'select': | |
454 | + this.dialogForm.dialogType = 'show'; | |
455 | + this.getDataList(); | |
456 | + break; | |
457 | + } | |
458 | + }, | |
459 | + //确定提交弹窗的事件 | |
460 | + async handleSubmit(formName){ | |
461 | + switch (this.dialogForm.dialogType){ | |
462 | + case "show": | |
463 | + this.dialogParam.dialogVisible = false; | |
464 | + break; | |
465 | + case 'select': | |
466 | + console.log('打印this.select',this.checkedSelection,this.rowData); | |
467 | + let params = { | |
468 | + clId:this.rowData.ID_, | |
469 | + cph:this.rowData.cph, | |
470 | + cllx:this.rowData.F_cllx, | |
471 | + sbId: this.checkedSelection.ID_, | |
472 | + sbbh:this.checkedSelection.F_sbbh, | |
473 | + sblx:this.checkedSelection.F_sblx, | |
474 | + sbmc:this.checkedSelection.F_sbmc, | |
475 | + ssczmc:this.checkedSelection.F_czmc, | |
476 | + ssczId:this.checkedSelection.F_czID, | |
477 | + ssqymc:this.checkedSelection.F_qymc, | |
478 | + ssqyId:this.checkedSelection.F_qyID, | |
479 | + zjbh:this.rowData.F_zjbh, | |
480 | + cjr:this.$store.state.user.username?this.$store.state.user.username:'', | |
481 | + cjsj:moment(new Date()).format('YYYY-MM-DD HH:mm:ss'), | |
482 | + gxr:'', | |
483 | + gxsj:'' | |
484 | + } | |
485 | + await addCarGpsPort(params).then((res)=>{ | |
486 | + if(res.code == 200){ | |
487 | + this.$message.success('绑定GPS设备成功!'); | |
488 | + this.handleSearch(); | |
489 | + } | |
490 | + console.log('打印res',res); | |
491 | + }) | |
492 | + this.dialogForm.dialogType = 'show'; | |
493 | + } | |
494 | + }, | |
495 | + } | |
496 | +} | |
497 | +</script> | |
498 | + | |
499 | +<style lang="scss" scoped> | |
500 | +.dialogSty{ | |
501 | + ::v-deep .el-table .el-table__header .el-checkbox { | |
502 | + display: none; | |
503 | + } | |
504 | + ::v-deep.el-dialog__body{ | |
505 | + padding: 20px!important; | |
506 | + padding-top: 0px!important; | |
507 | + } | |
508 | + .info-div{ | |
509 | + display: flex; | |
510 | + align-items: center; | |
511 | + .item-name-sty{ | |
512 | + color: #333333; | |
513 | + font-size: 16px; | |
514 | + } | |
515 | + } | |
516 | +} | |
517 | + | |
518 | +</style> | ... | ... |
frontend/front/src/views/pages/regionalManage/components/carManage.vue
1 | 1 | <template> |
2 | - <div class="container"> | |
3 | - 车辆组件 | |
2 | + <div class="componentsSty"> | |
3 | + <el-row style="width: 100%; height: 100%;"> | |
4 | + <el-col :span="24"> | |
5 | + <el-form :model="queryForm" ref="queryForm" :inline="true"> | |
6 | + <el-form-item label="车牌号:"> | |
7 | + <el-input v-model="queryForm.F_cph" placeholder="请输入车牌号" clearable></el-input> | |
8 | + </el-form-item> | |
9 | + <el-form-item label="车辆类型:"> | |
10 | + <el-select v-model="queryForm.F_cllx" placeholder="请选择车辆类型" clearable> | |
11 | + <el-option | |
12 | + v-for="item in cllxOptions" | |
13 | + :key="item.value" | |
14 | + :label="item.label" | |
15 | + :value="item.value"> | |
16 | + </el-option> | |
17 | + </el-select> | |
18 | + </el-form-item> | |
19 | + <el-form-item label="证件编号:"> | |
20 | + <el-input v-model="queryForm.F_zjbh" placeholder="请输入证件编号" clearable></el-input> | |
21 | + </el-form-item> | |
22 | + <el-form-item> | |
23 | + <el-button type="primary" v-if="rowData.fSsczid !==''" style="background: #5875eb; border: 1px solid #5875eb; border-radius: 5px;" | |
24 | + icon="el-icon-plus" @click="hanleOpt('add')"> 新增车辆 | |
25 | + </el-button> | |
26 | + <el-button type="primary" icon="el-icon-refresh" | |
27 | + style="border: 1px solid #5875eb; background: #ffffff; color: #5875eb; border-radius: 5px;" | |
28 | + @click="handleReset" plain>重置 | |
29 | + </el-button> | |
30 | + <el-button type="primary" style="background: #5875eb; border: 1px solid #5875eb; border-radius: 5px;" | |
31 | + icon="el-icon-search" @click="handleSearch"> 查询 | |
32 | + </el-button> | |
33 | + </el-form-item> | |
34 | + </el-form> | |
35 | + </el-col> | |
36 | + <el-col :span="24" style="height: calc(100% - 95px);overflow: auto;"> | |
37 | + <el-table :data="tableData" border key="table" ref="multipleTable" style="width: 100%;" v-loading='loading'> | |
38 | + <el-table-column prop="shopId" type="index" label="序号" width="80" align="center"> | |
39 | + </el-table-column> | |
40 | + <el-table-column prop="F_cph" label="车牌号" min-width="100" :show-overflow-tooltip='true' align="center"> | |
41 | + <template slot-scope="scope"> | |
42 | + <span v-if="scope.row.F_cph">{{scope.row.F_cph}}</span> | |
43 | + <span v-else>— —</span> | |
44 | + </template> | |
45 | + </el-table-column> | |
46 | + <el-table-column prop="F_cllx" label="车辆类型" min-width="100" :show-overflow-tooltip='true' align="center"> | |
47 | + <template slot-scope="scope"> | |
48 | + <span v-if="scope.row.F_cllx">{{scope.row.F_cllx}}</span> | |
49 | + <span v-else>— —</span> | |
50 | + </template> | |
51 | + </el-table-column> | |
52 | + <el-table-column prop="F_clxh" label="车辆型号" min-width="120" :show-overflow-tooltip="true" align="center"> | |
53 | + <template slot-scope="scope"> | |
54 | + <span v-if="scope.row.F_clxh">{{scope.row.F_clxh}}</span> | |
55 | + <span v-else>— —</span> | |
56 | + </template> | |
57 | + </el-table-column> | |
58 | + <el-table-column prop="F_trsyrq" label="投入使用日期" min-width="120" align="center"> | |
59 | + <template slot-scope="scope"> | |
60 | + <span v-if="scope.row.F_trsyrq">{{parseTime(scope.row.F_trsyrq,"{y}-{m}-{d}")}}</span> | |
61 | + <span v-else>— —</span> | |
62 | + </template> | |
63 | + </el-table-column> | |
64 | + <el-table-column prop="F_jsy" label="驾驶员" min-width="120" align="center"> | |
65 | + <template slot-scope="scope"> | |
66 | + <span v-if="scope.row.F_jsy">{{scope.row.F_jsy}}</span> | |
67 | + <span v-else>— —</span> | |
68 | + </template> | |
69 | + </el-table-column> | |
70 | + <el-table-column prop="F_lxdh" label="联系电话" min-width="120" :show-overflow-tooltip="true" align="center"> | |
71 | + <template slot-scope="scope"> | |
72 | + <span v-if="scope.row.F_lxdh">{{scope.row.F_lxdh}}</span> | |
73 | + <span v-else>— —</span> | |
74 | + </template> | |
75 | + </el-table-column> | |
76 | + <el-table-column prop="F_zjbh" min-width="120" label="证件编号" align="center"> | |
77 | + <template slot-scope="scope"> | |
78 | + <span v-if="scope.row.F_zjbh">{{scope.row.F_zjbh}}</span> | |
79 | + <span v-else>— —</span> | |
80 | + </template> | |
81 | + </el-table-column> | |
82 | + <el-table-column prop="F_zjyxq" label="证件有效期" min-width="120" :show-overflow-tooltip="true" align="center"> | |
83 | + <template slot-scope="scope"> | |
84 | + <span v-if="scope.row.F_zjyxq">{{parseTime(scope.row.F_zjyxq,"{y}-{m}-{d}")}}</span> | |
85 | + <span v-else>— —</span> | |
86 | + </template> | |
87 | + </el-table-column> | |
88 | + <el-table-column prop="F_sfzh" label="身份证号" min-width="140" align="center"> | |
89 | + <template slot-scope="scope"> | |
90 | + <span v-if="scope.row.F_sfzh">{{scope.row.F_sfzh}}</span> | |
91 | + <span v-else>— —</span> | |
92 | + </template> | |
93 | + </el-table-column> | |
94 | + <el-table-column prop="F_clzp" label="车辆图片" min-width="140" align="center"> | |
95 | + <template slot-scope="scope"> | |
96 | + <span v-if="scope.row.F_clzp"> | |
97 | + {{scope.row.F_clzp.F_clzp}} | |
98 | + <el-image | |
99 | + style="width: 100px; height: 100px" | |
100 | + :src="scope.row.F_clzpUrl" | |
101 | + ></el-image> | |
102 | + </span> | |
103 | + <span v-else>— —</span> | |
104 | + </template> | |
105 | + </el-table-column> | |
106 | + <el-table-column prop="F_wtysgs" label="委托运输公司" min-width="140" align="center"> | |
107 | + <template slot-scope="scope"> | |
108 | + <span v-if="scope.row.F_wtysgs">{{scope.row.F_wtysgs}}</span> | |
109 | + <span v-else>— —</span> | |
110 | + </template> | |
111 | + </el-table-column> | |
112 | + <el-table-column prop="F_dlysxkz" label="道路运输许可证" min-width="140" align="center"> | |
113 | + <template slot-scope="scope"> | |
114 | + <span v-if="scope.row.F_dlysxkz">{{scope.row.F_dlysxkz}}</span> | |
115 | + <span v-else>— —</span> | |
116 | + </template> | |
117 | + </el-table-column> | |
118 | + <el-table-column prop="F_dlysxkzyxq" label="道路运输许可证有效期" min-width="180" align="center"> | |
119 | + <template slot-scope="scope"> | |
120 | + <span v-if="scope.row.F_dlysxkzyxq">{{parseTime(scope.row.F_dlysxkzyxq,"{y}-{m}-{d}")}}</span> | |
121 | + <span v-else>— —</span> | |
122 | + </template> | |
123 | + </el-table-column> | |
124 | + <el-table-column prop="F_whpzh" label="危化品证号" min-width="140" align="center"> | |
125 | + <template slot-scope="scope"> | |
126 | + <span v-if="scope.row.F_whpzh">{{scope.row.F_whpzh}}</span> | |
127 | + <span v-else>— —</span> | |
128 | + </template> | |
129 | + </el-table-column> | |
130 | + <el-table-column prop="F_whpzhyxq" label="危化品证号有效期" min-width="140" align="center"> | |
131 | + <template slot-scope="scope"> | |
132 | + <span v-if="scope.row.F_whpzhyxq">{{parseTime(scope.row.F_whpzhyxq,"{y}-{m}-{d}")}}</span> | |
133 | + <span v-else>— —</span> | |
134 | + </template> | |
135 | + </el-table-column> | |
136 | + <el-table-column prop="F_cjsj" label="创建时间" min-width="160" align="center"> | |
137 | + <template slot-scope="scope"> | |
138 | + <span v-if="scope.row.F_cjsj">{{scope.row.F_cjsj}}</span> | |
139 | + <span v-else>— —</span> | |
140 | + </template> | |
141 | + </el-table-column> | |
142 | + <el-table-column prop="state" label="操作" fixed="right" min-width="160" align="center"> | |
143 | + <template slot-scope="scope"> | |
144 | + <el-button type="text" @click="hanleOpt('edit',scope.row)">编辑</el-button> | |
145 | + <el-button type="text" @click="hanleOpt('delete',scope.row)" style="color:red;">删除</el-button> | |
146 | + <el-button type="text" @click="hanleOpt('GPS',scope.row)">绑定GPS</el-button> | |
147 | + </template> | |
148 | + </el-table-column> | |
149 | + </el-table> | |
150 | + </el-col> | |
151 | + <el-col :span="24"> | |
152 | + <el-pagination | |
153 | + style="float: right;margin-top: 10px;" | |
154 | + @current-change="handleCurrentChange" | |
155 | + @size-change="handleSizeChange" | |
156 | + :current-page="pageParam.page" | |
157 | + :page-sizes="[10,20,,50,100]" | |
158 | + :page-size="pageParam.size" | |
159 | + layout="total, sizes, prev, pager, next, jumper" | |
160 | + :total="pageParam.total" | |
161 | + > | |
162 | + </el-pagination> | |
163 | + </el-col> | |
164 | + </el-row> | |
165 | + <el-dialog | |
166 | + v-if="dialogParams.showDialogVisible" | |
167 | + :title="dialogParams.title" | |
168 | + :visible.sync="dialogParams.dialogVisible" | |
169 | + width="60%" | |
170 | + @close="handleDialogClose"> | |
171 | + <el-row> | |
172 | + <el-form :model="dialogParams" :rules="dialogRules" ref="dialogParams" label-width="160px"> | |
173 | + <el-col :span="24"> | |
174 | + <el-col :span="12"> | |
175 | + <el-form-item label="车牌号:" prop="cph"> | |
176 | + <el-input v-model="dialogParams.cph" placeholder="请输入车牌号" clearable></el-input> | |
177 | + </el-form-item> | |
178 | + </el-col> | |
179 | + <el-col :span="12"> | |
180 | + <el-form-item label="车辆型号:" prop="clxh"> | |
181 | + <el-input v-model="dialogParams.clxh" disabled placeholder="请输入车辆型号" clearable></el-input> | |
182 | + </el-form-item> | |
183 | + </el-col> | |
184 | + </el-col> | |
185 | + <el-col :span="24"> | |
186 | + <el-col :span="12"> | |
187 | + <el-form-item label="车辆类型:" prop="cllx"> | |
188 | + <el-select v-model="dialogParams.cllx" style="width: 100%" placeholder="请选择车辆类型" clearable> | |
189 | + <el-option | |
190 | + v-for="item in cllxOptions" | |
191 | + :key="item.value" | |
192 | + :label="item.label" | |
193 | + :value="item.value"> | |
194 | + </el-option> | |
195 | + </el-select> | |
196 | + </el-form-item> | |
197 | + </el-col> | |
198 | + <el-col :span="12"> | |
199 | + <el-form-item label="投入使用日期:" prop="trsyrq"> | |
200 | + <el-date-picker | |
201 | + v-model="dialogParams.trsyrq" | |
202 | + format="yyyy-MM-dd" | |
203 | + style="width: 100%" | |
204 | + value-format="yyyy-MM-dd" | |
205 | + type="date" | |
206 | + placeholder="请选择投入使用日期"> | |
207 | + </el-date-picker> | |
208 | + </el-form-item> | |
209 | + </el-col> | |
210 | + </el-col> | |
211 | + <el-col :span="24"> | |
212 | + <el-col :span="12"> | |
213 | + <el-form-item label="驾驶员:" prop="jsy"> | |
214 | + <el-input v-model="dialogParams.jsy" placeholder="请输入驾驶员" clearable></el-input> | |
215 | + </el-form-item> | |
216 | + </el-col> | |
217 | + <el-col :span="12"> | |
218 | + <el-form-item label="联系电话:" prop="lxdh"> | |
219 | + <el-input v-model="dialogParams.lxdh" placeholder="请输入联系电话" clearable></el-input> | |
220 | + </el-form-item> | |
221 | + </el-col> | |
222 | + </el-col> | |
223 | + <el-col :span="24"> | |
224 | + <el-col :span="12"> | |
225 | + <el-form-item label="证件编号:" prop="zjbh"> | |
226 | + <el-input v-model="dialogParams.zjbh" placeholder="请输入证件编号" clearable></el-input> | |
227 | + </el-form-item> | |
228 | + </el-col> | |
229 | + <el-col :span="12"> | |
230 | + <el-form-item label="证件有效期:" prop="zjyxq"> | |
231 | + <el-date-picker | |
232 | + v-model="dialogParams.zjyxq" | |
233 | + format="yyyy-MM-dd" | |
234 | + style="width: 100%" | |
235 | + value-format="yyyy-MM-dd" | |
236 | + type="date" | |
237 | + placeholder="请选择投入使用日期"> | |
238 | + </el-date-picker> | |
239 | + </el-form-item> | |
240 | + </el-col> | |
241 | + </el-col> | |
242 | + <el-col :span="24"> | |
243 | + <el-col :span="12"> | |
244 | + <el-form-item label="身份证号:" prop="sfzh"> | |
245 | + <el-input v-model="dialogParams.sfzh" placeholder="请输入身份证号" clearable></el-input> | |
246 | + </el-form-item> | |
247 | + </el-col> | |
248 | + <el-col :span="12"> | |
249 | + <el-form-item label="委托运输公司:" prop="wtysgs"> | |
250 | + <el-input v-model="dialogParams.wtysgs" placeholder="请输入委托运输公司" clearable></el-input> | |
251 | + </el-form-item> | |
252 | + </el-col> | |
253 | + </el-col> | |
254 | + <el-col :span="24"> | |
255 | + <el-col :span="12"> | |
256 | + <el-form-item label="道路运输许可证:" prop="dlysxkz"> | |
257 | + <el-input v-model="dialogParams.dlysxkz" placeholder="请输入道路运输许可证" clearable></el-input> | |
258 | + </el-form-item> | |
259 | + </el-col> | |
260 | + <el-col :span="12"> | |
261 | + <el-form-item label="道路运输许可证有效期:" prop="dlysxkzyxq"> | |
262 | + <el-date-picker | |
263 | + v-model="dialogParams.dlysxkzyxq" | |
264 | + format="yyyy-MM-dd" | |
265 | + style="width: 100%" | |
266 | + value-format="yyyy-MM-dd" | |
267 | + type="date" | |
268 | + placeholder="请选择道路运输许可证有效期"> | |
269 | + </el-date-picker> | |
270 | + </el-form-item> | |
271 | + </el-col> | |
272 | + </el-col> | |
273 | + <el-col :span="24"> | |
274 | + <el-col :span="12"> | |
275 | + <el-form-item label="危化品证号:" prop="whpzh"> | |
276 | + <el-input v-model="dialogParams.whpzh" placeholder="请输入危化品证号" clearable></el-input> | |
277 | + </el-form-item> | |
278 | + </el-col> | |
279 | + <el-col :span="12"> | |
280 | + <el-form-item label="危化品证号有效期:" prop="whpzhyxq"> | |
281 | + <el-date-picker | |
282 | + v-model="dialogParams.whpzhyxq" | |
283 | + format="yyyy-MM-dd" | |
284 | + style="width: 100%" | |
285 | + value-format="yyyy-MM-dd" | |
286 | + type="date" | |
287 | + placeholder="请选择危化品证号有效期"> | |
288 | + </el-date-picker> | |
289 | + </el-form-item> | |
290 | + </el-col> | |
291 | + </el-col> | |
292 | + <el-col :span="24"> | |
293 | + <el-col :span="24"> | |
294 | + <el-form-item label="备注:" prop="bz"> | |
295 | + <el-input v-model="dialogParams.bz" type="textarea" :row="2" placeholder="请输入备注" clearable></el-input> | |
296 | + </el-form-item> | |
297 | + </el-col> | |
298 | + <el-col :span="24" class="fileSty"> | |
299 | + <el-form-item label="车辆照片:"> | |
300 | + <el-upload | |
301 | + :file-list="pictureFileList" | |
302 | + :action="action" | |
303 | + list-type="picture-card" | |
304 | + multiple | |
305 | + :show-file-list="true" | |
306 | + :http-request="httpPictureRequest" | |
307 | + :before-upload="beforeAvatarUpload" | |
308 | + :on-preview="handlePictureCardPreview" | |
309 | + :on-remove="handlePictureCardRemove"> | |
310 | + <i class="el-icon-plus"></i> | |
311 | + <div class="el-upload__text">上传图片</div> | |
312 | + <div class="el-upload__tip" slot="tip">可上传多张</div> | |
313 | + <div class="el-upload__tip" slot="tip">支持:jpg/png/gif/ico/jpeg/gpg/gif/jpeg,不超过6MB,</div> | |
314 | + </el-upload> | |
315 | + </el-form-item> | |
316 | + </el-col> | |
317 | + </el-col> | |
318 | + </el-form> | |
319 | + </el-row> | |
320 | + <span slot="footer" class="dialog-footer"> | |
321 | + <el-button @click="handleDialogClose">取 消</el-button> | |
322 | + <el-button type="primary" @click="handleSubmit('dialogParams')">确 定</el-button> | |
323 | + </span> | |
324 | + </el-dialog> | |
325 | + <car-bind-gps v-if="showCarBindGpsVisible" ref="carBindGps"></car-bind-gps> | |
4 | 326 | </div> |
5 | 327 | </template> |
6 | 328 | |
7 | 329 | <script> |
330 | +import {deleteCarPort, addOrEditCarPort, carTableDataPort, carTypeNumPort, equipmentNumPort} from '@/api/regionalManage' | |
331 | +import moment from "moment"; | |
332 | +import {getDictList} from "@/api/dict"; | |
333 | +import req from "@/utils/request"; | |
334 | +import carBindGps from "@/views/pages/regionalManage/components/carBindGps"; | |
335 | + | |
8 | 336 | export default { |
9 | 337 | name: "carManage", |
338 | + components:{ | |
339 | + carBindGps | |
340 | + }, | |
10 | 341 | props:{ |
11 | - type:Object, | |
12 | - default:{} | |
342 | + rowData:{ | |
343 | + type:Object, | |
344 | + default:()=>{} | |
345 | + } | |
13 | 346 | }, |
14 | - mounted() { | |
347 | + created() { | |
348 | + this.action = `${window.context.portal}/system/file/v1/fileUpload`; | |
349 | + }, | |
350 | + async mounted() { | |
351 | + await this.getDataList(); | |
352 | + await this.getInitOptions(); | |
15 | 353 | }, |
16 | 354 | data(){ |
17 | 355 | return { |
356 | + filterText:'', | |
357 | + pictureFileList:[], | |
358 | + action:'', | |
359 | + showResetDialog:false, | |
360 | + showQrCodeVisible:false, | |
361 | + showDialog:false, | |
362 | + showCarBindGpsVisible:false, | |
363 | + dialogParams:{ | |
364 | + showDialogVisible:false, | |
365 | + cjr:'', | |
366 | + cjsj:'', | |
367 | + gxsj:'', | |
368 | + gxr:'', | |
369 | + title:'新增车辆', | |
370 | + id_:'', | |
371 | + czID:'', | |
372 | + czmc: '', | |
373 | + qyID: '', | |
374 | + qymc: '', | |
375 | + dialogVisible:false, | |
376 | + cph:'', | |
377 | + cllx:'', | |
378 | + clxh:'', | |
379 | + trsyrq:'', | |
380 | + wtysgs:'', | |
381 | + jsy:'', | |
382 | + lxdh:'', | |
383 | + zjbh:'', | |
384 | + zjyxq:'', | |
385 | + sfzh:'', | |
386 | + bz:'', | |
387 | + dlysxkz:'', | |
388 | + dlysxkzyxq:'', | |
389 | + whpzh:'', | |
390 | + whpzhyxq:'', | |
391 | + clzp:'', | |
392 | + dialogType:'', | |
393 | + form_data_rev_:'' | |
394 | + }, | |
395 | + dialogRules:{ | |
396 | + cph:[ | |
397 | + {required:true,message:'请输入车牌号',trigger:'blur'} | |
398 | + ], | |
399 | + cllx:[ | |
400 | + {required:true,message:'请选择车辆类型',trigger:'change'} | |
401 | + ], | |
402 | + clxh:[ | |
403 | + {required:true,message:'请输入车辆型号',trigger:'blur'} | |
404 | + ], | |
405 | + jsy:[ | |
406 | + {required:true,message:'请输入驾驶员',trigger:'blur'} | |
407 | + ], | |
408 | + lxdh:[ | |
409 | + {required:true,message:'请输入联系电话',trigger:'blur'} | |
410 | + ], | |
411 | + zjbh:[ | |
412 | + {required:true,message:'请输入证件编号',trigger:'blur'} | |
413 | + ] | |
414 | + }, | |
415 | + queryForm:{ | |
416 | + F_cph:'', | |
417 | + F_cllx:'', | |
418 | + F_zjbh:'', | |
419 | + orgId:'' | |
420 | + }, | |
421 | + pageParam:{ | |
422 | + page:1, | |
423 | + size:10, | |
424 | + total:0 | |
425 | + }, | |
426 | + loading:false, | |
427 | + tableData:[], | |
428 | + cllxOptions:[],//车辆型号数据 | |
18 | 429 | |
19 | 430 | } |
20 | 431 | }, |
21 | 432 | methods:{ |
22 | - | |
433 | + //查询车辆类型的字典 | |
434 | + async getInitOptions(){ | |
435 | + let params = [{ | |
436 | + key:'NAME_', | |
437 | + value:'车辆类型' | |
438 | + }]; | |
439 | + // let paramsJson = JSON.stringify(params) | |
440 | + await getDictList(params).then((res)=>{ | |
441 | + console.log('打印res====',res); | |
442 | + let { rows } = res; | |
443 | + let optionsArray = rows.length>0?rows.map((item)=>{ | |
444 | + return { | |
445 | + label:item.NAME_, | |
446 | + value:item.NAME_ | |
447 | + } | |
448 | + }):[]; | |
449 | + this.cllxOptions = optionsArray; | |
450 | + }) | |
451 | + }, | |
452 | + //删除图片 | |
453 | + handlePictureCardRemove(file, fileList) { | |
454 | + console.log(file, this.fileList); | |
455 | + const index = this.pictureFileList.findIndex((item) => { | |
456 | + return item.uid === file.uid | |
457 | + }) | |
458 | + this.pictureFileList.splice(index, 1); | |
459 | + }, | |
460 | + //预览车辆图片 | |
461 | + handlePictureCardPreview(file) { | |
462 | + this.dialogImageUrl = file.url; | |
463 | + this.dialogVisible = true; | |
464 | + }, | |
465 | + // 车辆图片自定义上传 | |
466 | + async httpPictureRequest(val){ | |
467 | + console.log('打印val',val); | |
468 | + const formData = new FormData(); | |
469 | + formData.append('files', val.file); | |
470 | + let response = await req.post( | |
471 | + window.context.portal + '/system/file/v1/fileUpload', | |
472 | + formData | |
473 | + ) | |
474 | + if (response.success) { | |
475 | + console.log('打印response',response); | |
476 | + this.$message.success('上传成功'); | |
477 | + let imgUrl = response.fileId; | |
478 | + if (response.fileId) { | |
479 | + imgUrl = await this.$getPhotoUrl(response.fileId); | |
480 | + } | |
481 | + this.pictureFileList.push({ | |
482 | + fileId:response.fileId, | |
483 | + url:imgUrl, | |
484 | + fileObj: JSON.stringify(response) | |
485 | + }); | |
486 | + } | |
487 | + }, | |
488 | + beforeAvatarUpload(file){ | |
489 | + console.log('打印beforeAvatarUpload===>file,file',file) | |
490 | + let imgType = ["jpg", "jpeg", "png"]; | |
491 | + let judge = false; // 后缀 | |
492 | + let type = file.name.split(".")[file.name.split(".").length - 1]; | |
493 | + for (let k = 0; k < imgType.length; k++) { | |
494 | + if (imgType[k].toUpperCase() === type.toUpperCase()) { | |
495 | + judge = true; | |
496 | + break; | |
497 | + } | |
498 | + } | |
499 | + // 验证图片格式 | |
500 | + if (!judge) { | |
501 | + this.$message.error("图片格式只支持:JPG、JPEG、PNG"); | |
502 | + return false; | |
503 | + } | |
504 | + const isLt1M = file.size / 1024 / 1024; | |
505 | + if (isLt1M > 1) { | |
506 | + this.$message.error("上传头像图片大小不能超过1MB"); | |
507 | + return false; | |
508 | + } | |
509 | + return true; | |
510 | + }, | |
511 | + //获取设备编号的数值 | |
512 | + async getCarTypeNum(){ | |
513 | + await carTypeNumPort().then((res)=>{ | |
514 | + const { value } = res; | |
515 | + this.dialogParams.clxh = value; | |
516 | + console.log('打印获取车辆型号res====》',res); | |
517 | + }) | |
518 | + }, | |
519 | + //查询列表事件 | |
520 | + //获取table表格数据 | |
521 | + async getDataList(){ | |
522 | + let params ={ | |
523 | + pageBean:{ | |
524 | + page:this.pageParam.page, | |
525 | + pageSize:this.pageParam.size, | |
526 | + showTotal:true | |
527 | + }, | |
528 | + querys:[] | |
529 | + } | |
530 | + if(this.queryForm.F_cph){ | |
531 | + params.querys.push({ | |
532 | + group:'main', | |
533 | + operation:'LIKE', | |
534 | + property:'F_cph', | |
535 | + relation:'AND', | |
536 | + value:this.queryForm.F_cph | |
537 | + }) | |
538 | + } | |
539 | + if(this.queryForm.F_cllx){ | |
540 | + params.querys.push({ | |
541 | + group:'main', | |
542 | + operation:'LIKE', | |
543 | + property:'F_cllx', | |
544 | + relation:'AND', | |
545 | + value:this.queryForm.F_cllx | |
546 | + }) | |
547 | + } | |
548 | + if(this.queryForm.F_zjbh){ | |
549 | + params.querys.push({ | |
550 | + group:'main', | |
551 | + operation:'LIKE', | |
552 | + property:'F_zjbh', | |
553 | + relation:'AND', | |
554 | + value:this.queryForm.F_zjbh | |
555 | + }) | |
556 | + } | |
557 | + if(this.rowData.fSsczid){ | |
558 | + params.querys.push({ | |
559 | + group:'main', | |
560 | + operation:'LIKE', | |
561 | + property:'F_ssczID', | |
562 | + relation:'AND', | |
563 | + value:this.rowData.fSsczid | |
564 | + }) | |
565 | + } | |
566 | + if(!this.rowData.fSsczid&&this.rowData.qyID){ | |
567 | + params.querys.push({ | |
568 | + group:'main', | |
569 | + operation:'LIKE', | |
570 | + property:'F_ssqyID', | |
571 | + relation:'AND', | |
572 | + value:this.rowData.qyID | |
573 | + }) | |
574 | + } | |
575 | + this.loading = true; | |
576 | + await carTableDataPort(params).then((res)=>{ | |
577 | + const { rows,total } = res; | |
578 | + console.log('打印rows',rows) | |
579 | + rows.map(async (item)=>{ | |
580 | + console.log('待item',item); | |
581 | + let sfzghImg = item.F_clzp.length>1?JSON.parse(item.F_clzp):''; | |
582 | + let sfzghImgUrl = await this.$getPhotoUrl(sfzghImg[0].fileId); | |
583 | + console.log('打印sfzghImgUrl',item,sfzghImg); | |
584 | + item.F_clzpUrl = sfzghImgUrl[0] | |
585 | + }); | |
586 | + this.tableData = rows; | |
587 | + this.pageParam.total = total; | |
588 | + setTimeout(()=>{ | |
589 | + this.loading = false; | |
590 | + },500) | |
591 | + }) | |
592 | + }, | |
593 | + //重置按钮事件 | |
594 | + handleReset(){ | |
595 | + this.queryForm.F_cph =''; | |
596 | + this.queryForm.F_cllx =''; | |
597 | + this.queryForm.F_zjbh =''; | |
598 | + this.pageParam.page = 1; | |
599 | + this.handleSearch(); | |
600 | + }, | |
601 | + //查询按钮事件 | |
602 | + handleSearch(){ | |
603 | + this.getDataList(); | |
604 | + }, | |
605 | + //新增用户事件 | |
606 | + handleAdd(){ | |
607 | + this.showDialog = true; | |
608 | + this.$nextTick(()=>{ | |
609 | + this.$refs.showDialog.open('add'); | |
610 | + }) | |
611 | + }, | |
612 | + //分页中页数跳转事件 | |
613 | + handleCurrentChange(val){ | |
614 | + this.pageParam.page = val; | |
615 | + this.handleSearch(); | |
616 | + }, | |
617 | + //分页中size改变的界面跳转事件 | |
618 | + handleSizeChange(val){ | |
619 | + this.pageParam.size = val; | |
620 | + this.handleSearch(); | |
621 | + }, | |
622 | + //提交事件 | |
623 | + async handleSubmit(formName){ | |
624 | + this.$refs[formName].validate(async (valid) => { | |
625 | + if (valid) { | |
626 | + let filePictureList = this.pictureFileList.map(item => JSON.parse(item.fileObj)); | |
627 | + let cardUrlList = JSON.stringify(filePictureList); | |
628 | + let params = { | |
629 | + ssqymc:this.dialogParams.qymc?this.dialogParams.qymc:'', | |
630 | + ssqyID:this.dialogParams.qyID?this.dialogParams.qyID:'', | |
631 | + ssczID:this.dialogParams.czID?this.dialogParams.czID:'', | |
632 | + ssczmc:this.dialogParams.czmc?this.dialogParams.czmc:'', | |
633 | + cph:this.dialogParams.cph?this.dialogParams.cph:'', | |
634 | + cllx:this.dialogParams.cllx?this.dialogParams.cllx:'', | |
635 | + clxh:this.dialogParams.clxh?this.dialogParams.clxh:'', | |
636 | + trsyrq:this.dialogParams.trsyrq?this.dialogParams.trsyrq:'', | |
637 | + wtysgs:this.dialogParams.wtysgs?this.dialogParams.wtysgs:'', | |
638 | + jsy:this.dialogParams.jsy?this.dialogParams.jsy:'', | |
639 | + lxdh:this.dialogParams.lxdh?this.dialogParams.lxdh:'', | |
640 | + zjbh:this.dialogParams.zjbh?this.dialogParams.zjbh:'', | |
641 | + zjyxq:this.dialogParams.zjyxq?this.dialogParams.zjyxq:'', | |
642 | + sfzh:this.dialogParams.sfzh?this.dialogParams.sfzh:'', | |
643 | + bz:this.dialogParams.bz?this.dialogParams.bz:'', | |
644 | + dlysxkz:this.dialogParams.dlysxkz?this.dialogParams.dlysxkz:'', | |
645 | + whpzh:this.dialogParams.whpzh?this.dialogParams.whpzh:'', | |
646 | + whpzhyxq:this.dialogParams.whpzhyxq?this.dialogParams.whpzhyxq:'', | |
647 | + clzp:cardUrlList, | |
648 | + cjr:this.dialogParams.cjr?this.dialogParams.cjr:'', | |
649 | + cjsj:this.dialogParams.cjsj?this.dialogParams.cjsj:'', | |
650 | + gxr:'', | |
651 | + gxsj:'' | |
652 | + } | |
653 | + if(this.dialogParams.dialogType == 'edit'){ | |
654 | + this.dialogParams.gxsj = moment(new Date()).format('YYYY-MM-DD HH:mm:ss'); | |
655 | + this.dialogParams.gxr = this.$store.state.user.username?this.$store.state.user.username:''; | |
656 | + params = { | |
657 | + ...params, | |
658 | + id_:this.dialogParams.id_?this.dialogParams.id_:'', | |
659 | + form_data_rev_:this.dialogParams.form_data_rev_?this.dialogParams.form_data_rev_:0, | |
660 | + gxr: this.dialogParams.gxr?this.dialogParams.gxr:'', | |
661 | + gxsj: this.dialogParams.gxsj?this.dialogParams.gxsj:'', | |
662 | + } | |
663 | + this.submitAddOrEditEquipment(params); | |
664 | + }else{ | |
665 | + this.dialogParams.cjsj = moment(new Date()).format('YYYY-MM-DD HH:mm:ss'); | |
666 | + this.dialogParams.gxr = this.$store.state.user.username?this.$store.state.user.username:''; | |
667 | + params = { | |
668 | + ...params, | |
669 | + cjsj: this.dialogParams.cjsj?this.dialogParams.cjsj:'', | |
670 | + cjr: this.dialogParams.cjr?this.dialogParams.cjr:'', | |
671 | + } | |
672 | + this.submitAddOrEditEquipment(params); | |
673 | + } | |
674 | + } else { | |
675 | + return false; | |
676 | + } | |
677 | + }); | |
678 | + }, | |
679 | + //提交编辑设备接口事件 | |
680 | + async submitAddOrEditEquipment(params){ | |
681 | + await addOrEditCarPort(params).then((res)=>{ | |
682 | + console.log('打印新增编辑的res====>',res); | |
683 | + const { code } = res; | |
684 | + if(code == 200){ | |
685 | + this.dialogParams.dialogVisible = false; | |
686 | + this.dialogParams.showDialogVisible = false; | |
687 | + this.handleSearch(); | |
688 | + } | |
689 | + }) | |
690 | + }, | |
691 | + //操作栏按钮 | |
692 | + async hanleOpt(type,row){ | |
693 | + console.log('打印row=====>',row); | |
694 | + this.dialogParams.dialogType= type; | |
695 | + switch (type){ | |
696 | + case 'add': | |
697 | + this.dialogParams.czID = this.rowData.fSsczid; | |
698 | + this.dialogParams.czmc = this.rowData.czmc; | |
699 | + this.dialogParams.qyID = this.rowData.qyID; | |
700 | + this.dialogParams.qymc = this.rowData.qymc; | |
701 | + this.dialogParams.id_ = ''; | |
702 | + this.dialogParams.cph = ''; | |
703 | + this.dialogParams.cllx = ''; | |
704 | + this.dialogParams.clxh = ''; | |
705 | + this.dialogParams.trsyrq =''; | |
706 | + this.dialogParams.wtysgs = ''; | |
707 | + this.dialogParams.jsy = ''; | |
708 | + this.dialogParams.lxdh = ''; | |
709 | + this.dialogParams.zjbh = ''; | |
710 | + this.dialogParams.zjyxq = ''; | |
711 | + this.dialogParams.sfzh = ''; | |
712 | + this.dialogParams.bz = ''; | |
713 | + this.dialogParams.dlysxkz = ''; | |
714 | + this.dialogParams.dlysxkzyxq = ''; | |
715 | + this.dialogParams.whpzh = ''; | |
716 | + this.dialogParams.whpzhyxq = ''; | |
717 | + this.pictureFileList = []; | |
718 | + this.dialogParams.cjr = this.$store.state.user.username?this.$store.state.user.username:''; | |
719 | + this.dialogParams.cjsj = ''; | |
720 | + this.dialogParams.title='新增车辆'; | |
721 | + await this.getCarTypeNum(); | |
722 | + break; | |
723 | + case 'edit': | |
724 | + this.dialogParams.id_ = row.ID_; | |
725 | + this.dialogParams.title='编辑支付'; | |
726 | + this.dialogParams.cph = row.F_cph; | |
727 | + this.dialogParams.cllx = row.F_cllx; | |
728 | + this.dialogParams.clxh = row.F_clxh; | |
729 | + this.dialogParams.trsyrq = row.F_trsyrq; | |
730 | + this.dialogParams.wtysgs = row.F_wtysgs; | |
731 | + this.dialogParams.jsy = row.F_jsy; | |
732 | + this.dialogParams.lxdh = row.F_lxdh; | |
733 | + this.dialogParams.zjbh = row.F_zjbh; | |
734 | + this.dialogParams.zjyxq = row.F_zjyxq; | |
735 | + this.dialogParams.sfzh = row.F_sfzh; | |
736 | + this.dialogParams.bz = row.F_bz; | |
737 | + this.dialogParams.dlysxkz = row.F_dlysxkz; | |
738 | + this.dialogParams.dlysxkzyxq = row.F_dlysxkzyxq; | |
739 | + this.dialogParams.whpzh = row.F_whpzh; | |
740 | + this.dialogParams.whpzhyxq = row.F_whpzhyxq; | |
741 | + let cardPictureUrlList = row.F_clzp?JSON.parse(row.F_clzp):[]; | |
742 | + let cardUrlList = []; | |
743 | + cardPictureUrlList.map(async(item)=>{ | |
744 | + let imgUrl = await this.$getPhotoUrl(item.fileId); | |
745 | + cardUrlList.push(({ | |
746 | + url:imgUrl, | |
747 | + fileObj: JSON.stringify(item) | |
748 | + })) | |
749 | + }); | |
750 | + this.pictureFileList = cardUrlList; | |
751 | + this.dialogParams.qymc = row.F_qymc; | |
752 | + this.dialogParams.qyID = row.F_qyID; | |
753 | + this.dialogParams.czmc = row.F_czmc; | |
754 | + this.dialogParams.czID = row.F_czID; | |
755 | + this.dialogParams.cjsj = row.F_cjsj; | |
756 | + this.dialogParams.cjr = row.F_cjr; | |
757 | + this.dialogParams.gxr = row.F_gxr; | |
758 | + this.dialogParams.gxsj = row.F_gxsj; | |
759 | + this.dialogParams.form_data_rev_ = row.F_form_data_rev_; | |
760 | + break; | |
761 | + case 'delete': | |
762 | + this.$confirm('确定是否删除该设备?', '提示', { | |
763 | + confirmButtonText: '确定', | |
764 | + cancelButtonText: '取消', | |
765 | + type: 'warning', | |
766 | + }).then(async() => { | |
767 | + await deleteCarPort({ids:row.ID_}).then((res)=>{ | |
768 | + this.handleSearch(); | |
769 | + }) | |
770 | + }) | |
771 | + break; | |
772 | + case 'GPS': | |
773 | + this.showCarBindGpsVisible = true; | |
774 | + this.$nextTick(()=>{ | |
775 | + this.$refs.carBindGps.open(row); | |
776 | + }) | |
777 | + break; | |
778 | + } | |
779 | + if(!this.rowData.fSsczid && type == 'add'&& type !=='GPS'){ | |
780 | + this.$message.warning('请选择厂站!') | |
781 | + return | |
782 | + } | |
783 | + if(type !== 'delete' && type !=='GPS'){ | |
784 | + this.dialogParams.showDialogVisible = true; | |
785 | + this.$nextTick(()=>{ | |
786 | + this.dialogParams.dialogVisible = true; | |
787 | + }) | |
788 | + } | |
789 | + }, | |
790 | + //弹窗关闭 | |
791 | + handleDialogClose(){ | |
792 | + this.$refs.dialogParams.resetFields(); | |
793 | + this.dialogParams.dialogVisible = false; | |
794 | + this.dialogParams.showDialogVisible = false; | |
795 | + } | |
23 | 796 | } |
24 | 797 | } |
25 | 798 | </script> |
26 | 799 | |
27 | 800 | <style lang="scss" scoped> |
801 | +.componentsSty{ | |
802 | + width: calc(100% - 30px); | |
803 | + height: 100%; | |
804 | + .fileSty{ | |
805 | + ::v-deep.el-upload--picture-card{ | |
806 | + position: relative; | |
807 | + } | |
808 | + .el-upload__text{ | |
809 | + position: absolute; | |
810 | + top: 20px; | |
811 | + left: 45px; | |
812 | + font-family: '苹方 中等', '苹方', sans-serif; | |
813 | + font-weight: 400; | |
814 | + font-style: normal; | |
815 | + font-size: 14px; | |
816 | + color: #98A4B4; | |
817 | + } | |
818 | + } | |
819 | +} | |
28 | 820 | |
29 | 821 | </style> | ... | ... |
frontend/front/src/views/pages/regionalManage/components/paymentManage.vue
1 | 1 | <template> |
2 | - <div class="container"> | |
3 | - 支付组件 | |
2 | + <div class="componentsSty"> | |
3 | + <el-row style="width: 100%; height: 100%;"> | |
4 | + <el-col :span="24"> | |
5 | + <el-form :model="queryForm" ref="queryForm" :inline="true"> | |
6 | + <el-form-item label="支付类型:"> | |
7 | + <el-input v-model="queryForm.F_zflx" placeholder="请输入支付类型" clearable></el-input> | |
8 | + </el-form-item> | |
9 | + <el-form-item label="应用id:"> | |
10 | + <el-input v-model="queryForm.F_appId" placeholder="请输入应用id" clearable></el-input> | |
11 | + </el-form-item> | |
12 | + <el-form-item label="商户id:"> | |
13 | + <el-input v-model="queryForm.F_mchId" placeholder="请输入商户id" clearable></el-input> | |
14 | + </el-form-item> | |
15 | + <el-form-item> | |
16 | + <el-button type="primary" v-if="rowData.fSsczid !==''" style="background: #5875eb; border: 1px solid #5875eb; border-radius: 5px;" | |
17 | + icon="el-icon-plus" @click="hanleOpt('add')"> 新增支付 | |
18 | + </el-button> | |
19 | + <el-button type="primary" icon="el-icon-refresh" | |
20 | + style="border: 1px solid #5875eb; background: #ffffff; color: #5875eb; border-radius: 5px;" | |
21 | + @click="handleReset" plain>重置 | |
22 | + </el-button> | |
23 | + <el-button type="primary" style="background: #5875eb; border: 1px solid #5875eb; border-radius: 5px;" | |
24 | + icon="el-icon-search" @click="handleSearch"> 查询 | |
25 | + </el-button> | |
26 | + </el-form-item> | |
27 | + </el-form> | |
28 | + </el-col> | |
29 | + <el-col :span="24" style="height: calc(100% - 95px);overflow: auto;"> | |
30 | + <el-table :data="tableData" border key="table" ref="multipleTable" style="width: 100%;" v-loading='loading'> | |
31 | + <el-table-column prop="shopId" type="index" label="序号" width="80" align="center"> | |
32 | + </el-table-column> | |
33 | + <el-table-column prop="F_zflx" label="支付类型" min-width="100" :show-overflow-tooltip='true' align="center"> | |
34 | + <template slot-scope="scope"> | |
35 | + <span v-if="scope.row.F_zflx">{{scope.row.F_zflx}}</span> | |
36 | + <span v-else>— —</span> | |
37 | + </template> | |
38 | + </el-table-column> | |
39 | + <el-table-column prop="F_appId" label="应用id" min-width="100" :show-overflow-tooltip='true' align="center"> | |
40 | + <template slot-scope="scope"> | |
41 | + <span v-if="scope.row.F_appId">{{scope.row.F_appId}}</span> | |
42 | + <span v-else>— —</span> | |
43 | + </template> | |
44 | + </el-table-column> | |
45 | + <el-table-column prop="F_mchId" label="商户id" min-width="120" :show-overflow-tooltip="true" align="center"> | |
46 | + <template slot-scope="scope"> | |
47 | + <span v-if="scope.row.F_mchId">{{scope.row.F_mchId}}</span> | |
48 | + <span v-else>— —</span> | |
49 | + </template> | |
50 | + </el-table-column> | |
51 | + <el-table-column prop="F_mchKey" label="商户密钥" min-width="120" align="center"> | |
52 | + <template slot-scope="scope"> | |
53 | + <span v-if="scope.row.F_mchKey">{{scope.row.F_mchKey}}</span> | |
54 | + <span v-else>— —</span> | |
55 | + </template> | |
56 | + </el-table-column> | |
57 | + <el-table-column prop="F_certSerialNo" label="商户证书序列号" min-width="120" align="center"> | |
58 | + <template slot-scope="scope"> | |
59 | + <span v-if="scope.row.F_certSerialNo">{{scope.row.F_certSerialNo}}</span> | |
60 | + <span v-else>— —</span> | |
61 | + </template> | |
62 | + </el-table-column> | |
63 | + <el-table-column prop="F_apiV3Key" label="APIv3密钥" min-width="120" :show-overflow-tooltip="true" align="center"> | |
64 | + <template slot-scope="scope"> | |
65 | + <span v-if="scope.row.F_apiV3Key">{{scope.row.F_apiV3Key}}</span> | |
66 | + <span v-else>— —</span> | |
67 | + </template> | |
68 | + </el-table-column> | |
69 | + <el-table-column prop="F_keyPath" min-width="270" label=" .p12 格式的密钥文件路径,私钥和证书" align="center"> | |
70 | + <template slot-scope="scope"> | |
71 | + <span v-if="scope.row.F_keyPath">{{scope.row.F_keyPath}}</span> | |
72 | + <span v-else>— —</span> | |
73 | + </template> | |
74 | + </el-table-column> | |
75 | + <el-table-column prop="F_privateKeyPath" label="私钥文件路径" min-width="180" :show-overflow-tooltip="true" align="center"> | |
76 | + <template slot-scope="scope"> | |
77 | + <span v-if="scope.row.F_privateKeyPath">{{scope.row.F_privateKeyPath}}</span> | |
78 | + <span v-else>— —</span> | |
79 | + </template> | |
80 | + </el-table-column> | |
81 | + <el-table-column prop="F_privateCertPath" label="私有证书文件路径" min-width="140" align="center"> | |
82 | + <template slot-scope="scope"> | |
83 | + <span v-if="scope.row.F_privateCertPath">{{scope.row.F_privateCertPath}}</span> | |
84 | + <span v-else>— —</span> | |
85 | + </template> | |
86 | + </el-table-column> | |
87 | + <el-table-column prop="state" label="操作" fixed="right" min-width="160" align="center"> | |
88 | + <template slot-scope="scope"> | |
89 | + <el-button type="text" @click="hanleOpt('edit',scope.row)">编辑</el-button> | |
90 | + <el-button type="text" @click="hanleOpt('delete',scope.row)" style="color:red;">删除</el-button> | |
91 | + </template> | |
92 | + </el-table-column> | |
93 | + </el-table> | |
94 | + </el-col> | |
95 | + <el-col :span="24"> | |
96 | + <el-pagination | |
97 | + style="float: right;margin-top: 10px;" | |
98 | + @current-change="handleCurrentChange" | |
99 | + @size-change="handleSizeChange" | |
100 | + :current-page="pageParam.page" | |
101 | + :page-sizes="[10,20,,50,100]" | |
102 | + :page-size="pageParam.size" | |
103 | + layout="total, sizes, prev, pager, next, jumper" | |
104 | + :total="pageParam.total" | |
105 | + > | |
106 | + </el-pagination> | |
107 | + </el-col> | |
108 | + </el-row> | |
109 | + <el-dialog | |
110 | + v-if="dialogParams.showDialogVisible" | |
111 | + :title="dialogParams.title" | |
112 | + :visible.sync="dialogParams.dialogVisible" | |
113 | + width="60%" | |
114 | + @close="handleDialogClose"> | |
115 | + <el-row> | |
116 | + <el-form :model="dialogParams" :rules="dialogRules" ref="dialogParams" label-width="140px"> | |
117 | + <el-col :span="24"> | |
118 | + <el-col :span="12"> | |
119 | + <el-form-item label="支付类型:" prop="zflx"> | |
120 | + <el-input v-model="dialogParams.zflx" placeholder="请输入支付类型" clearable></el-input> | |
121 | + </el-form-item> | |
122 | + </el-col> | |
123 | + <el-col :span="12"> | |
124 | + <el-form-item label="应用id:" prop="appId"> | |
125 | + <el-input v-model="dialogParams.appId" placeholder="请输入应用id" clearable></el-input> | |
126 | + </el-form-item> | |
127 | + </el-col> | |
128 | + </el-col> | |
129 | + <el-col :span="24"> | |
130 | + <el-col :span="12"> | |
131 | + <el-form-item label="商户id:" prop="mchId"> | |
132 | + <el-input v-model="dialogParams.mchId" placeholder="请输入商户id" clearable></el-input> | |
133 | + </el-form-item> | |
134 | + </el-col> | |
135 | + <el-col :span="12"> | |
136 | + <el-form-item label="商户密钥:" prop="mchKey"> | |
137 | + <el-input v-model="dialogParams.mchKey" placeholder="请输入商户密钥" clearable></el-input> | |
138 | + </el-form-item> | |
139 | + </el-col> | |
140 | + </el-col> | |
141 | + <el-col :span="24"> | |
142 | + <el-col :span="12"> | |
143 | + <el-form-item label="商户证书序列号:" prop="certSerialNo"> | |
144 | + <el-input v-model="dialogParams.certSerialNo" placeholder="请输入商户证书序列号" clearable></el-input> | |
145 | + </el-form-item> | |
146 | + </el-col> | |
147 | + <el-col :span="12"> | |
148 | + <el-form-item label="APIv3密钥:" prop="apiV3Key"> | |
149 | + <el-input v-model="dialogParams.apiV3Key" placeholder="请输入APIv3密钥" clearable></el-input> | |
150 | + </el-form-item> | |
151 | + </el-col> | |
152 | + </el-col> | |
153 | + <el-col :span="24"> | |
154 | + <el-col :span="12"> | |
155 | + <el-form-item label="私钥文件路径:" prop="privateKeyPath"> | |
156 | + <el-input v-model="dialogParams.privateKeyPath" placeholder="请输入私钥文件路径" clearable></el-input> | |
157 | + </el-form-item> | |
158 | + </el-col> | |
159 | + <el-col :span="12"> | |
160 | + <el-form-item label="私有证书文件路径:" prop="privateCertPath"> | |
161 | + <el-input v-model="dialogParams.privateCertPath" placeholder="请输入私有证书文件路径" clearable></el-input> | |
162 | + </el-form-item> | |
163 | + </el-col> | |
164 | + </el-col> | |
165 | + <el-col :span="24"> | |
166 | + <el-col :span="12"> | |
167 | + <el-form-item label=".p12格式的密钥:" prop="keyPath"> | |
168 | + <el-input v-model="dialogParams.keyPath" placeholder="请输入.p12 格式的密钥文件路径,私钥和证书" clearable></el-input> | |
169 | + </el-form-item> | |
170 | + </el-col> | |
171 | + </el-col> | |
172 | + </el-form> | |
173 | + </el-row> | |
174 | + <span slot="footer" class="dialog-footer"> | |
175 | + <el-button @click="handleDialogClose">取 消</el-button> | |
176 | + <el-button type="primary" @click="handleSubmit('dialogParams')">确 定</el-button> | |
177 | + </span> | |
178 | + </el-dialog> | |
4 | 179 | </div> |
5 | 180 | </template> |
6 | 181 | |
7 | 182 | <script> |
183 | +import {deletePaymentPort, addOrEditPaymentPort, paymentTableDataPort} from '@/api/regionalManage' | |
184 | +import moment from "moment"; | |
185 | + | |
8 | 186 | export default { |
9 | 187 | name: "paymentManage", |
10 | 188 | props:{ |
11 | - type:Object, | |
12 | - default:{} | |
189 | + rowData:{ | |
190 | + type:Object, | |
191 | + default:()=>{} | |
192 | + } | |
13 | 193 | }, |
14 | - mounted() { | |
194 | + async mounted() { | |
195 | + await this.getDataList(); | |
15 | 196 | }, |
16 | 197 | data(){ |
17 | 198 | return { |
199 | + filterText:'', | |
200 | + showResetDialog:false, | |
201 | + showQrCodeVisible:false, | |
202 | + showDialog:false, | |
203 | + dialogParams:{ | |
204 | + showDialogVisible:false, | |
205 | + cjr:'', | |
206 | + cjsj:'', | |
207 | + gxsj:'', | |
208 | + gxr:'', | |
209 | + title:'新增区域', | |
210 | + id_:'', | |
211 | + czID:'', | |
212 | + czmc: '', | |
213 | + qyID: '', | |
214 | + qymc: '', | |
215 | + dialogVisible:false, | |
216 | + zflx:'', | |
217 | + appId:'', | |
218 | + mchId:'', | |
219 | + mchKey:'', | |
220 | + certSerialNo:'', | |
221 | + apiV3Key:'', | |
222 | + keyPath:'', | |
223 | + privateKeyPath:'', | |
224 | + privateCertPath:'', | |
225 | + dialogType:'', | |
226 | + form_data_rev_:'' | |
227 | + }, | |
228 | + dialogRules:{ | |
229 | + zflx:[ | |
230 | + {required:true,message:'请输入支付类型',trigger:'blur'} | |
231 | + ], | |
232 | + appId:[ | |
233 | + {required:true,message:'请输入应用id',trigger:'blur'} | |
234 | + ], | |
235 | + mchId:[ | |
236 | + {required:true,message:'请输入商户id',trigger:'blur'} | |
237 | + ], | |
238 | + mchKey:[ | |
239 | + {required:true,message:'请输入商户密钥',trigger:'blur'} | |
240 | + ], | |
241 | + certSerialNo:[ | |
242 | + {required:true,message:'请输入商户证书序列号',trigger:'blur'} | |
243 | + ], | |
244 | + apiV3Key:[ | |
245 | + {required:true,message:'请输入APIv3密钥',trigger:'blur'} | |
246 | + ], | |
247 | + keyPath:[ | |
248 | + {required:true,message:'请输入.p12 格式的密钥文件路径,私钥和证书',trigger:'blur'} | |
249 | + ], | |
250 | + privateKeyPath:[ | |
251 | + {required:true,message:'请输入私钥文件路径',trigger:'blur'} | |
252 | + ], | |
253 | + privateCertPath:[ | |
254 | + { required:true,message:'请输入私有证书文件路径',trigger:'blur'} | |
255 | + ] | |
256 | + }, | |
257 | + queryForm:{ | |
258 | + F_zflx:'', | |
259 | + F_appId:'', | |
260 | + F_mchId:'', | |
261 | + orgId:'' | |
262 | + }, | |
263 | + pageParam:{ | |
264 | + page:1, | |
265 | + size:10, | |
266 | + total:0 | |
267 | + }, | |
268 | + loading:false, | |
269 | + tableData:[], | |
18 | 270 | |
19 | 271 | } |
20 | 272 | }, |
21 | 273 | methods:{ |
22 | - | |
274 | + //查询列表事件 | |
275 | + //获取table表格数据 | |
276 | + async getDataList(){ | |
277 | + let params ={ | |
278 | + pageBean:{ | |
279 | + page:this.pageParam.page, | |
280 | + pageSize:this.pageParam.size, | |
281 | + showTotal:true | |
282 | + }, | |
283 | + querys:[] | |
284 | + } | |
285 | + if(this.queryForm.F_zflx){ | |
286 | + params.querys.push({ | |
287 | + group:'main', | |
288 | + operation:'LIKE', | |
289 | + property:'F_zflx', | |
290 | + relation:'AND', | |
291 | + value:this.queryForm.F_zflx | |
292 | + }) | |
293 | + } | |
294 | + if(this.queryForm.F_appId){ | |
295 | + params.querys.push({ | |
296 | + group:'main', | |
297 | + operation:'LIKE', | |
298 | + property:'F_appId', | |
299 | + relation:'AND', | |
300 | + value:this.queryForm.F_appId | |
301 | + }) | |
302 | + } | |
303 | + if(this.queryForm.F_mchId){ | |
304 | + params.querys.push({ | |
305 | + group:'main', | |
306 | + operation:'LIKE', | |
307 | + property:'F_mchId', | |
308 | + relation:'AND', | |
309 | + value:this.queryForm.F_mchId | |
310 | + }) | |
311 | + } | |
312 | + if(this.rowData.fSsczid){ | |
313 | + params.querys.push({ | |
314 | + group:'main', | |
315 | + operation:'LIKE', | |
316 | + property:'F_czID', | |
317 | + relation:'AND', | |
318 | + value:this.rowData.fSsczid | |
319 | + }) | |
320 | + } | |
321 | + if(!this.rowData.fSsczid&&this.rowData.qyID){ | |
322 | + params.querys.push({ | |
323 | + group:'main', | |
324 | + operation:'LIKE', | |
325 | + property:'F_qyid', | |
326 | + relation:'AND', | |
327 | + value:this.rowData.qyID | |
328 | + }) | |
329 | + } | |
330 | + this.loading = true; | |
331 | + await paymentTableDataPort(params).then((res)=>{ | |
332 | + const { rows,total } = res; | |
333 | + this.tableData = rows; | |
334 | + this.pageParam.total = total; | |
335 | + setTimeout(()=>{ | |
336 | + this.loading = false; | |
337 | + },500) | |
338 | + }) | |
339 | + }, | |
340 | + //重置按钮事件 | |
341 | + handleReset(){ | |
342 | + this.queryForm.F_zflx =''; | |
343 | + this.queryForm.appId =''; | |
344 | + this.queryForm.mchId =''; | |
345 | + this.pageParam.page = 1; | |
346 | + this.handleSearch(); | |
347 | + }, | |
348 | + //查询按钮事件 | |
349 | + handleSearch(){ | |
350 | + this.getDataList(); | |
351 | + }, | |
352 | + //新增用户事件 | |
353 | + handleAdd(){ | |
354 | + this.showDialog = true; | |
355 | + this.$nextTick(()=>{ | |
356 | + this.$refs.showDialog.open('add'); | |
357 | + }) | |
358 | + }, | |
359 | + //分页中页数跳转事件 | |
360 | + handleCurrentChange(val){ | |
361 | + this.pageParam.page = val; | |
362 | + this.handleSearch(); | |
363 | + }, | |
364 | + //分页中size改变的界面跳转事件 | |
365 | + handleSizeChange(val){ | |
366 | + this.pageParam.size = val; | |
367 | + this.handleSearch(); | |
368 | + }, | |
369 | + //提交事件 | |
370 | + async handleSubmit(formName){ | |
371 | + this.$refs[formName].validate(async (valid) => { | |
372 | + if (valid) { | |
373 | + let params = { | |
374 | + qymc:this.dialogParams.qymc?this.dialogParams.qymc:'', | |
375 | + qyID:this.dialogParams.qyID?this.dialogParams.qyID:'', | |
376 | + czID:this.dialogParams.czID?this.dialogParams.czID:'', | |
377 | + czmc:this.dialogParams.czmc?this.dialogParams.czmc:'', | |
378 | + zflx:this.dialogParams.zflx?this.dialogParams.zflx:'', | |
379 | + appId:this.dialogParams.appId?this.dialogParams.appId:'', | |
380 | + mchId:this.dialogParams.mchId?this.dialogParams.mchId:'', | |
381 | + mchKey:this.dialogParams.mchKey?this.dialogParams.mchKey:'', | |
382 | + certSerialNo:this.dialogParams.certSerialNo?this.dialogParams.certSerialNo:'', | |
383 | + apiV3Key:this.dialogParams.apiV3Key?this.dialogParams.apiV3Key:'', | |
384 | + keyPath:this.dialogParams.keyPath?this.dialogParams.keyPath:'', | |
385 | + privateKeyPath:this.dialogParams.privateKeyPath?this.dialogParams.privateKeyPath:'', | |
386 | + privateCertPath:this.dialogParams.privateCertPath?this.dialogParams.privateCertPath:'', | |
387 | + cjr:this.dialogParams.cjr?this.dialogParams.cjr:'', | |
388 | + cjsj:this.dialogParams.cjsj?this.dialogParams.cjsj:'', | |
389 | + gxr:'', | |
390 | + gxsj:'' | |
391 | + } | |
392 | + if(this.dialogParams.dialogType == 'edit'){ | |
393 | + this.dialogParams.gxsj = moment(new Date()).format('YYYY-MM-DD HH:mm:ss'); | |
394 | + this.dialogParams.gxr = this.$store.state.user.username?this.$store.state.user.username:''; | |
395 | + params = { | |
396 | + ...params, | |
397 | + id_:this.dialogParams.id_?this.dialogParams.id_:'', | |
398 | + form_data_rev_:this.dialogParams.form_data_rev_?this.dialogParams.form_data_rev_:0, | |
399 | + gxr: this.dialogParams.gxr?this.dialogParams.gxr:'', | |
400 | + gxsj: this.dialogParams.gxsj?this.dialogParams.gxsj:'', | |
401 | + } | |
402 | + this.submitAddOrEditEquipment(params); | |
403 | + }else{ | |
404 | + this.dialogParams.cjsj = moment(new Date()).format('YYYY-MM-DD HH:mm:ss'); | |
405 | + this.dialogParams.gxr = this.$store.state.user.username?this.$store.state.user.username:''; | |
406 | + params = { | |
407 | + ...params, | |
408 | + cjsj: this.dialogParams.cjsj?this.dialogParams.cjsj:'', | |
409 | + cjr: this.dialogParams.cjr?this.dialogParams.cjr:'', | |
410 | + } | |
411 | + this.submitAddOrEditEquipment(params); | |
412 | + } | |
413 | + } else { | |
414 | + return false; | |
415 | + } | |
416 | + }); | |
417 | + }, | |
418 | + //提交编辑设备接口事件 | |
419 | + async submitAddOrEditEquipment(params){ | |
420 | + await addOrEditPaymentPort(params).then((res)=>{ | |
421 | + console.log('打印新增编辑的res====>',res); | |
422 | + const { code } = res; | |
423 | + if(code == 200){ | |
424 | + this.dialogParams.dialogVisible = false; | |
425 | + this.dialogParams.showDialogVisible = false; | |
426 | + this.handleSearch(); | |
427 | + } | |
428 | + }) | |
429 | + }, | |
430 | + //操作栏按钮 | |
431 | + async hanleOpt(type,row){ | |
432 | + console.log('打印row=====>',row); | |
433 | + this.dialogParams.dialogType= type; | |
434 | + switch (type){ | |
435 | + case 'add': | |
436 | + this.dialogParams.czID = this.rowData.fSsczid; | |
437 | + this.dialogParams.czmc = this.rowData.czmc; | |
438 | + this.dialogParams.qyID = this.rowData.qyID; | |
439 | + this.dialogParams.qymc = this.rowData.qymc; | |
440 | + this.dialogParams.spldz = ''; | |
441 | + this.dialogParams.id_ = ''; | |
442 | + this.dialogParams.zflx = ''; | |
443 | + this.dialogParams.appId = ''; | |
444 | + this.dialogParams.mchId =''; | |
445 | + this.dialogParams.mchKey = ''; | |
446 | + this.dialogParams.certSerialNo = ''; | |
447 | + this.dialogParams.apiV3Key = ''; | |
448 | + this.dialogParams.keyPath = ''; | |
449 | + this.dialogParams.privateKeyPath = ''; | |
450 | + this.dialogParams.privateCertPath = ''; | |
451 | + this.dialogParams.cjr = this.$store.state.user.username?this.$store.state.user.username:''; | |
452 | + this.dialogParams.cjsj = ''; | |
453 | + this.dialogParams.title='新增支付'; | |
454 | + // await this.getEquipmentNum(); | |
455 | + break; | |
456 | + case 'edit': | |
457 | + this.dialogParams.id_ = row.ID_; | |
458 | + this.dialogParams.title='编辑支付'; | |
459 | + this.dialogParams.zflx = row.F_zflx; | |
460 | + this.dialogParams.appId = row.F_appId; | |
461 | + this.dialogParams.mchId = row.F_mchId; | |
462 | + this.dialogParams.mchKey = row.F_mchKey; | |
463 | + this.dialogParams.certSerialNo = row.F_certSerialNo; | |
464 | + this.dialogParams.apiV3Key = row.F_apiV3Key; | |
465 | + this.dialogParams.keyPath = row.F_keyPath; | |
466 | + this.dialogParams.privateKeyPath = row.F_privateKeyPath; | |
467 | + this.dialogParams.privateCertPath = row.F_privateCertPath; | |
468 | + this.dialogParams.qymc = row.F_qymc; | |
469 | + this.dialogParams.qyID = row.F_qyID; | |
470 | + this.dialogParams.czmc = row.F_czmc; | |
471 | + this.dialogParams.czID = row.F_czID; | |
472 | + this.dialogParams.cjsj = row.F_cjsj; | |
473 | + this.dialogParams.cjr = row.F_cjr; | |
474 | + this.dialogParams.gxr = row.F_gxr; | |
475 | + this.dialogParams.gxsj = row.F_gxsj; | |
476 | + this.dialogParams.form_data_rev_ = row.F_form_data_rev_; | |
477 | + break; | |
478 | + case 'delete': | |
479 | + this.$confirm('确定是否删除该设备?', '提示', { | |
480 | + confirmButtonText: '确定', | |
481 | + cancelButtonText: '取消', | |
482 | + type: 'warning', | |
483 | + }).then(async() => { | |
484 | + await deletePaymentPort({ids:row.ID_}).then((res)=>{ | |
485 | + this.handleSearch(); | |
486 | + }) | |
487 | + }) | |
488 | + break; | |
489 | + } | |
490 | + if(!this.rowData.fSsczid && type == 'add'){ | |
491 | + this.$message.warning('请选择厂站!') | |
492 | + return | |
493 | + } | |
494 | + if(type !== 'delete'){ | |
495 | + this.dialogParams.showDialogVisible = true; | |
496 | + this.$nextTick(()=>{ | |
497 | + this.dialogParams.dialogVisible = true; | |
498 | + }) | |
499 | + } | |
500 | + }, | |
501 | + //弹窗关闭 | |
502 | + handleDialogClose(){ | |
503 | + this.$refs.dialogParams.resetFields(); | |
504 | + this.dialogParams.dialogVisible = false; | |
505 | + this.dialogParams.showDialogVisible = false; | |
506 | + } | |
23 | 507 | } |
24 | 508 | } |
25 | 509 | </script> |
26 | 510 | |
27 | 511 | <style lang="scss" scoped> |
512 | +.componentsSty{ | |
513 | + width: calc(100% - 30px); | |
514 | + height: 100%; | |
515 | +} | |
28 | 516 | |
29 | 517 | </style> | ... | ... |
frontend/front/src/views/pages/regionalManage/components/personDialogInfo.vue
... | ... | @@ -600,8 +600,8 @@ export default { |
600 | 600 | } |
601 | 601 | }, |
602 | 602 | handlePictureCardRemove(file, fileList) { |
603 | - console.log(file, this.fileList); | |
604 | - const index = this.fileList.findIndex((item) => { | |
603 | + console.log(file, this.pictureFileList); | |
604 | + const index = this.pictureFileList.findIndex((item) => { | |
605 | 605 | return item.uid === file.uid |
606 | 606 | }) |
607 | 607 | this.pictureFileList.splice(index, 1); | ... | ... |