Commit 25203cbb34ce222f76742e27f3c288f9468ae7e4
1 parent
7a016595
15分钟免费时长
Showing
2 changed files
with
127 additions
and
77 deletions
src/api/parkRecord/parkRecord.js
@@ -25,3 +25,16 @@ export function parkingQuery(params) { | @@ -25,3 +25,16 @@ export function parkingQuery(params) { | ||
25 | } | 25 | } |
26 | 26 | ||
27 | 27 | ||
28 | +export function appApplyParkOut(params) { // 0元出场 | ||
29 | + return request({ | ||
30 | + url: 'appAccountPay/appApplyParkOut', | ||
31 | + method: 'post', | ||
32 | + data: params | ||
33 | + }) | ||
34 | +} | ||
35 | + | ||
36 | + | ||
37 | + | ||
38 | + | ||
39 | + | ||
40 | + |
src/components/parkRecord.vue
@@ -15,7 +15,7 @@ | @@ -15,7 +15,7 @@ | ||
15 | <div v-show="currentTabActive==0"> | 15 | <div v-show="currentTabActive==0"> |
16 | 16 | ||
17 | <div v-if="parkingData.length>0"> | 17 | <div v-if="parkingData.length>0"> |
18 | - <p class="free-tip" v-if="parkingData[0].parkDuration<=900">停车30分钟内无需缴费,请直接离场。</p> | 18 | + <p class="free-tip" v-if="parkingData[0].parkDuration<=900">停车15分钟内无需缴费,请直接离场。</p> |
19 | 19 | ||
20 | <div class="cost-main" v-for="i in parkingData"> | 20 | <div class="cost-main" v-for="i in parkingData"> |
21 | <ul class="cost-header"> | 21 | <ul class="cost-header"> |
@@ -34,7 +34,7 @@ | @@ -34,7 +34,7 @@ | ||
34 | <p>停车时长:{{ $utils.dateFormat(i.parkDuration)}}</p> | 34 | <p>停车时长:{{ $utils.dateFormat(i.parkDuration)}}</p> |
35 | <div class="out-wrap"> | 35 | <div class="out-wrap"> |
36 | <p class="mon-wrap">¥{{(i.unPayFee/100).toFixed(2)}}</p> | 36 | <p class="mon-wrap">¥{{(i.unPayFee/100).toFixed(2)}}</p> |
37 | - <p class="out-btn" @click="toPayCurrent(i)" v-if="parkingData[0].parkDuration>900">出场缴费</p> | 37 | + <p class="out-btn" @click="toPayCurrent(i,parkingData[0].parkDuration)">出场缴费</p> |
38 | </div> | 38 | </div> |
39 | </div> | 39 | </div> |
40 | </div> | 40 | </div> |
@@ -47,9 +47,9 @@ | @@ -47,9 +47,9 @@ | ||
47 | 47 | ||
48 | 48 | ||
49 | <!--历史缴费--> | 49 | <!--历史缴费--> |
50 | - <div v-show="currentTabActive==1" class="history-con" > | 50 | + <div v-show="currentTabActive==1" class="history-con"> |
51 | <div v-if="historyList.length>0" style="height: 100%;"> | 51 | <div v-if="historyList.length>0" style="height: 100%;"> |
52 | - <div class="history-body" > | 52 | + <div class="history-body"> |
53 | <p class="money-all">总欠费金额: | 53 | <p class="money-all">总欠费金额: |
54 | <span>¥{{(allMoney/100).toFixed(2)}}</span> | 54 | <span>¥{{(allMoney/100).toFixed(2)}}</span> |
55 | </p> | 55 | </p> |
@@ -120,11 +120,23 @@ | @@ -120,11 +120,23 @@ | ||
120 | </div> | 120 | </div> |
121 | <span slot="button">知道了</span> | 121 | <span slot="button">知道了</span> |
122 | </modal-alert> | 122 | </modal-alert> |
123 | + | ||
124 | + | ||
125 | + <modal-alert ref="zeroAlert"> | ||
126 | + <div class="trave-tip-content txt-l" slot="content"> | ||
127 | + <div class="confirm-text"> | ||
128 | + <p>停车15分钟内无需缴费,请申请离场。</p> | ||
129 | + </div> | ||
130 | + </div> | ||
131 | + <span slot="button">知道了</span> | ||
132 | + </modal-alert> | ||
133 | + | ||
134 | + | ||
123 | </div> | 135 | </div> |
124 | </template> | 136 | </template> |
125 | 137 | ||
126 | <script> | 138 | <script> |
127 | -import { parkRecordList, historyQuery, parkingQuery } from '@/api/parkRecord/parkRecord.js' | 139 | +import {parkRecordList, historyQuery, parkingQuery, appApplyParkOut} from '@/api/parkRecord/parkRecord.js' |
128 | import axios from 'axios' | 140 | import axios from 'axios' |
129 | 141 | ||
130 | export default { | 142 | export default { |
@@ -138,19 +150,19 @@ export default { | @@ -138,19 +150,19 @@ export default { | ||
138 | carColor: 1,// 车牌颜色 | 150 | carColor: 1,// 车牌颜色 |
139 | currentTabActive: 1, // 显示当前哪个 | 151 | currentTabActive: 1, // 显示当前哪个 |
140 | carNumber: '', // 车牌号码 | 152 | carNumber: '', // 车牌号码 |
141 | - parkingData:[], // 在停数据 | 153 | + parkingData: [], // 在停数据 |
142 | parkList: [], // 停车记录数据 | 154 | parkList: [], // 停车记录数据 |
143 | - historyList:[ // 历史欠费数据 | ||
144 | - {money:100,checked:false, id: 1}, | ||
145 | - ] , | ||
146 | - allChecked:false, // 全部选择事件 | ||
147 | - allMoney:0, // 欠费所有的费用 | ||
148 | - historyCheckedLen:0, //选中了几笔交易 | 155 | + historyList: [ // 历史欠费数据 |
156 | + { money: 100, checked: false, id: 1 }, | ||
157 | + ], | ||
158 | + allChecked: false, // 全部选择事件 | ||
159 | + allMoney: 0, // 欠费所有的费用 | ||
160 | + historyCheckedLen: 0, //选中了几笔交易 | ||
149 | historyCheckedMon: 0, //选中了待缴纳的金额 | 161 | historyCheckedMon: 0, //选中了待缴纳的金额 |
150 | orderIds: [] // 选中数据的订单 数组 | 162 | orderIds: [] // 选中数据的订单 数组 |
151 | } | 163 | } |
152 | }, | 164 | }, |
153 | - mounted(){ | 165 | + mounted() { |
154 | }, | 166 | }, |
155 | created() { | 167 | created() { |
156 | this.carNumber = this.$route.query.carNumber // 获取车牌号 | 168 | this.carNumber = this.$route.query.carNumber // 获取车牌号 |
@@ -159,7 +171,7 @@ export default { | @@ -159,7 +171,7 @@ export default { | ||
159 | this.parkRecordList(this.carNumber) | 171 | this.parkRecordList(this.carNumber) |
160 | }, | 172 | }, |
161 | methods: { | 173 | methods: { |
162 | - parkRecordList(){ // 获取停车记录数据 | 174 | + parkRecordList() { // 获取停车记录数据 |
163 | var salt = this.$utils.myCommonSalt(32); | 175 | var salt = this.$utils.myCommonSalt(32); |
164 | var jsondata = { | 176 | var jsondata = { |
165 | app_id: this.$utils.myVarAppid, | 177 | app_id: this.$utils.myVarAppid, |
@@ -185,14 +197,14 @@ export default { | @@ -185,14 +197,14 @@ export default { | ||
185 | this.parkingData = this.parkList.filter(item => { | 197 | this.parkingData = this.parkList.filter(item => { |
186 | return item.parkState == '10' | 198 | return item.parkState == '10' |
187 | }) | 199 | }) |
188 | - if(this.parkingData.length>0){ | 200 | + if (this.parkingData.length > 0) { |
189 | this.currentTabActive = 0 | 201 | this.currentTabActive = 0 |
190 | } | 202 | } |
191 | console.log(this.parkingData) | 203 | console.log(this.parkingData) |
192 | this.historyList = this.parkList.filter(item => { | 204 | this.historyList = this.parkList.filter(item => { |
193 | return item.parkState == '20' | 205 | return item.parkState == '20' |
194 | }) | 206 | }) |
195 | - this.historyList.forEach( i => { | 207 | + this.historyList.forEach(i => { |
196 | this.allMoney += Number(i.unPayFee) | 208 | this.allMoney += Number(i.unPayFee) |
197 | }) | 209 | }) |
198 | 210 | ||
@@ -206,37 +218,36 @@ export default { | @@ -206,37 +218,36 @@ export default { | ||
206 | chooseHandle(i, index) { // 历史欠费单个选择事件 | 218 | chooseHandle(i, index) { // 历史欠费单个选择事件 |
207 | i.checked = !i.checked | 219 | i.checked = !i.checked |
208 | let me = this | 220 | let me = this |
209 | - if(i.checked ){ //单个选中 | ||
210 | - me.historyCheckedLen ++ | ||
211 | - if(me.historyCheckedLen == this.historyList.length){ | 221 | + if (i.checked) { //单个选中 |
222 | + me.historyCheckedLen++ | ||
223 | + if (me.historyCheckedLen == this.historyList.length) { | ||
212 | this.allChecked = true | 224 | this.allChecked = true |
213 | 225 | ||
214 | } | 226 | } |
215 | me.orderIds.push(i.orderId) | 227 | me.orderIds.push(i.orderId) |
216 | me.historyCheckedMon += Number(i.unPayFee) | 228 | me.historyCheckedMon += Number(i.unPayFee) |
217 | - }else{ //单个不选中 | 229 | + } else { //单个不选中 |
218 | let _i = me.orderIds.indexOf(i.orderId) | 230 | let _i = me.orderIds.indexOf(i.orderId) |
219 | - me.orderIds.splice(_i,1) | 231 | + me.orderIds.splice(_i, 1) |
220 | this.allChecked = false | 232 | this.allChecked = false |
221 | - me.historyCheckedLen -- | 233 | + me.historyCheckedLen-- |
222 | me.historyCheckedMon -= Number(i.unPayFee) | 234 | me.historyCheckedMon -= Number(i.unPayFee) |
223 | } | 235 | } |
224 | 236 | ||
225 | - | ||
226 | }, | 237 | }, |
227 | checkedAll() { // 全选选择事件 | 238 | checkedAll() { // 全选选择事件 |
228 | this.allChecked = !this.allChecked | 239 | this.allChecked = !this.allChecked |
229 | - if(this.allChecked){ //全选 | ||
230 | - let me = this | ||
231 | - this.historyList.forEach(function(item){ | 240 | + if (this.allChecked) { //全选 |
241 | + let me = this | ||
242 | + this.historyList.forEach(function (item) { | ||
232 | item.checked = true; | 243 | item.checked = true; |
233 | me.orderIds.push(item.orderId) | 244 | me.orderIds.push(item.orderId) |
234 | }); | 245 | }); |
235 | this.historyCheckedMon = this.allMoney | 246 | this.historyCheckedMon = this.allMoney |
236 | this.historyCheckedLen = this.historyList.length | 247 | this.historyCheckedLen = this.historyList.length |
237 | 248 | ||
238 | - }else{ //反选 | ||
239 | - this.historyList.forEach(function(item){ | 249 | + } else { //反选 |
250 | + this.historyList.forEach(function (item) { | ||
240 | item.checked = false; | 251 | item.checked = false; |
241 | 252 | ||
242 | }); | 253 | }); |
@@ -245,46 +256,72 @@ export default { | @@ -245,46 +256,72 @@ export default { | ||
245 | this.orderIds = [] | 256 | this.orderIds = [] |
246 | } | 257 | } |
247 | }, | 258 | }, |
248 | - toPayCurrent(i){ // 缴纳本次在停费用 | 259 | + toPayCurrent(i, num) { // 缴纳本次在停费用 |
260 | + | ||
249 | var salt = this.$utils.myCommonSalt(32); | 261 | var salt = this.$utils.myCommonSalt(32); |
250 | - var jsondata = { | 262 | + |
263 | + var params = { | ||
251 | app_id: this.$utils.myVarAppid, | 264 | app_id: this.$utils.myVarAppid, |
252 | deviceInfo: this.$utils.myDeviceInfo, | 265 | deviceInfo: this.$utils.myDeviceInfo, |
253 | salt: salt, | 266 | salt: salt, |
254 | sign_type: "md5", | 267 | sign_type: "md5", |
255 | - payType: 4, | ||
256 | - appId: this.$utils.myVxAppId, | ||
257 | orderId: i.orderId, | 268 | orderId: i.orderId, |
258 | - terminalSource: '7', | ||
259 | - parkCode: i.parkCode, | ||
260 | - carNumber: this.carNumber, | 269 | + payOrderType: '101', |
270 | + terminalSource: '3', | ||
271 | + | ||
261 | } | 272 | } |
262 | - jsondata.sign = this.$utils.signObject(jsondata) | ||
263 | - parkingQuery(jsondata).then(result => { | ||
264 | - console.log(result) | ||
265 | - let res = result.data | ||
266 | - let _dis = res.discountFee | ||
267 | - let discountFee = _dis.slice(1,_dis.length-1) | 273 | + params.sign = this.$utils.signObject(params) |
274 | + appApplyParkOut(params).then(response => { | ||
275 | + console.log(response) | ||
268 | 276 | ||
269 | - this.$router.push( | ||
270 | - { | ||
271 | - path:'orderPay', | ||
272 | - query:{ | ||
273 | - carColor: this.carColor,// 车牌颜色 | ||
274 | - arrearageTotalFee: res.orderTotalFee,// 应收 | ||
275 | - arrearageDiscFee: discountFee*100,// 优惠 | ||
276 | - arrearageActFee: res.orderFee,// 实收 | ||
277 | - carNumber: this.carNumber, // 车牌 | ||
278 | - paySrcType: 101, //支付的类型 101 是本次 103是历史欠费 | ||
279 | - ordeID: i.orderId, //支付的订单号 | ||
280 | - appOrderTimeout: res.appOrderTimeout, // 超时描述 | ||
281 | - } | 277 | + if (response.code == '5005') { |
278 | + var salt = this.$utils.myCommonSalt(32); | ||
279 | + var jsondata = { | ||
280 | + app_id: this.$utils.myVarAppid, | ||
281 | + deviceInfo: this.$utils.myDeviceInfo, | ||
282 | + salt: salt, | ||
283 | + sign_type: "md5", | ||
284 | + payType: 4, | ||
285 | + appId: this.$utils.myVxAppId, | ||
286 | + orderId: i.orderId, | ||
287 | + terminalSource: '7', | ||
288 | + parkCode: i.parkCode, | ||
289 | + carNumber: this.carNumber, | ||
282 | } | 290 | } |
283 | - ) | 291 | + jsondata.sign = this.$utils.signObject(jsondata) |
292 | + parkingQuery(jsondata).then(result => { | ||
293 | + console.log(result) | ||
294 | + let res = result.data | ||
295 | + let _dis = res.discountFee | ||
296 | + let discountFee = _dis.slice(1, _dis.length - 1) | ||
297 | + | ||
298 | + this.$router.push( | ||
299 | + { | ||
300 | + path: 'orderPay', | ||
301 | + query: { | ||
302 | + carColor: this.carColor,// 车牌颜色 | ||
303 | + arrearageTotalFee: res.orderTotalFee,// 应收 | ||
304 | + arrearageDiscFee: discountFee * 100,// 优惠 | ||
305 | + arrearageActFee: res.orderFee,// 实收 | ||
306 | + carNumber: this.carNumber, // 车牌 | ||
307 | + paySrcType: 101, //支付的类型 101 是本次 103是历史欠费 | ||
308 | + ordeID: i.orderId, //支付的订单号 | ||
309 | + appOrderTimeout: res.appOrderTimeout, // 超时描述 | ||
310 | + } | ||
311 | + } | ||
312 | + ) | ||
313 | + }) | ||
314 | + | ||
315 | + } else { | ||
316 | + //$('.dialog-out').show() | ||
317 | + this.$refs.zeroAlert.open() | ||
318 | + } | ||
319 | + | ||
284 | }) | 320 | }) |
321 | + | ||
285 | }, | 322 | }, |
286 | toPayHisroryPage() { // 缴纳历史费用 | 323 | toPayHisroryPage() { // 缴纳历史费用 |
287 | - if(this.historyCheckedLen==0){ | 324 | + if (this.historyCheckedLen == 0) { |
288 | this.$refs.alert.open() | 325 | this.$refs.alert.open() |
289 | return | 326 | return |
290 | } | 327 | } |
@@ -315,8 +352,8 @@ export default { | @@ -315,8 +352,8 @@ export default { | ||
315 | console.log(this.orderIds) | 352 | console.log(this.orderIds) |
316 | this.$router.push( | 353 | this.$router.push( |
317 | { | 354 | { |
318 | - path:'orderPay', | ||
319 | - query:{ | 355 | + path: 'orderPay', |
356 | + query: { | ||
320 | carColor: this.carColor,// 车牌颜色 | 357 | carColor: this.carColor,// 车牌颜色 |
321 | arrearageTotalFee: res.arrearageTotalFee,// 应收 | 358 | arrearageTotalFee: res.arrearageTotalFee,// 应收 |
322 | arrearageDiscFee: res.arrearageDiscFee,// 优惠 | 359 | arrearageDiscFee: res.arrearageDiscFee,// 优惠 |
@@ -331,9 +368,7 @@ export default { | @@ -331,9 +368,7 @@ export default { | ||
331 | }) | 368 | }) |
332 | } | 369 | } |
333 | }, | 370 | }, |
334 | - filters: { | ||
335 | - | ||
336 | - } | 371 | + filters: {} |
337 | } | 372 | } |
338 | </script> | 373 | </script> |
339 | 374 | ||
@@ -435,70 +470,72 @@ export default { | @@ -435,70 +470,72 @@ export default { | ||
435 | } | 470 | } |
436 | } | 471 | } |
437 | 472 | ||
438 | - .history-con{ | 473 | + .history-con { |
439 | height: calc(100% - 38px); | 474 | height: calc(100% - 38px); |
440 | overflow: hidden; | 475 | overflow: hidden; |
441 | } | 476 | } |
442 | - .history-body{ | 477 | + |
478 | + .history-body { | ||
443 | height: calc(100% - 81px); | 479 | height: calc(100% - 81px); |
444 | overflow-y: scroll; | 480 | overflow-y: scroll; |
445 | } | 481 | } |
446 | - .history-footer{ | 482 | + |
483 | + .history-footer { | ||
447 | height: 81px; | 484 | height: 81px; |
448 | background: #F8F8F8; | 485 | background: #F8F8F8; |
449 | } | 486 | } |
450 | 487 | ||
451 | - .cost-main-history{ | 488 | + .cost-main-history { |
452 | margin-bottom: 10px; | 489 | margin-bottom: 10px; |
453 | - background:#fff url("../assets/images/choose.png") no-repeat 10px center; | 490 | + background: #fff url("../assets/images/choose.png") no-repeat 10px center; |
454 | background-size: 20px 20px; | 491 | background-size: 20px 20px; |
455 | cursor: pointer; | 492 | cursor: pointer; |
456 | } | 493 | } |
457 | 494 | ||
458 | - | ||
459 | - .isChecked{ | ||
460 | - background:#fff url("../assets/images/choosed.png") no-repeat 10px center; | 495 | + .isChecked { |
496 | + background: #fff url("../assets/images/choosed.png") no-repeat 10px center; | ||
461 | background-size: 20px 20px; | 497 | background-size: 20px 20px; |
462 | } | 498 | } |
463 | 499 | ||
464 | - .money-all{ | 500 | + .money-all { |
465 | padding-left: 18px; | 501 | padding-left: 18px; |
466 | height: 25px; | 502 | height: 25px; |
467 | line-height: 25px; | 503 | line-height: 25px; |
468 | font-weight: 500; | 504 | font-weight: 500; |
469 | background: #FEF8DB; | 505 | background: #FEF8DB; |
470 | - span{ | 506 | + span { |
471 | color: #BC0202; | 507 | color: #BC0202; |
472 | } | 508 | } |
473 | } | 509 | } |
474 | 510 | ||
475 | - .statistical-data{ | 511 | + .statistical-data { |
476 | padding-left: 18px; | 512 | padding-left: 18px; |
477 | height: 32px; | 513 | height: 32px; |
478 | line-height: 32px; | 514 | line-height: 32px; |
479 | background: #E6FAFA; | 515 | background: #E6FAFA; |
480 | - span{ | 516 | + span { |
481 | color: #D20000; | 517 | color: #D20000; |
482 | } | 518 | } |
483 | } | 519 | } |
484 | - .opration-wrap{ | 520 | + |
521 | + .opration-wrap { | ||
485 | padding-left: 18px; | 522 | padding-left: 18px; |
486 | height: 49px; | 523 | height: 49px; |
487 | line-height: 49px; | 524 | line-height: 49px; |
488 | background: #f8f8f8; | 525 | background: #f8f8f8; |
489 | display: flex; | 526 | display: flex; |
490 | justify-content: space-between; | 527 | justify-content: space-between; |
491 | - .check-btn{ | 528 | + .check-btn { |
492 | padding-left: 30px; | 529 | padding-left: 30px; |
493 | background: url("../assets/images/choose.png") no-repeat 0 center; | 530 | background: url("../assets/images/choose.png") no-repeat 0 center; |
494 | background-size: 20px 20px; | 531 | background-size: 20px 20px; |
495 | cursor: pointer; | 532 | cursor: pointer; |
496 | } | 533 | } |
497 | - .isAllChecked{ | 534 | + .isAllChecked { |
498 | background: url("../assets/images/choosed.png") no-repeat 0 center; | 535 | background: url("../assets/images/choosed.png") no-repeat 0 center; |
499 | background-size: 20px 20px; | 536 | background-size: 20px 20px; |
500 | } | 537 | } |
501 | - .settle-btn{ | 538 | + .settle-btn { |
502 | width: 106px; | 539 | width: 106px; |
503 | height: 49px; | 540 | height: 49px; |
504 | background: linear-gradient(145deg, #2783E9 0%, #227ADC 100%); | 541 | background: linear-gradient(145deg, #2783E9 0%, #227ADC 100%); |