Commit 25203cbb34ce222f76742e27f3c288f9468ae7e4
1 parent
7a016595
15分钟免费时长
Showing
2 changed files
with
127 additions
and
77 deletions
src/api/parkRecord/parkRecord.js
src/components/parkRecord.vue
| ... | ... | @@ -15,7 +15,7 @@ |
| 15 | 15 | <div v-show="currentTabActive==0"> |
| 16 | 16 | |
| 17 | 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 | 20 | <div class="cost-main" v-for="i in parkingData"> |
| 21 | 21 | <ul class="cost-header"> |
| ... | ... | @@ -34,7 +34,7 @@ |
| 34 | 34 | <p>停车时长:{{ $utils.dateFormat(i.parkDuration)}}</p> |
| 35 | 35 | <div class="out-wrap"> |
| 36 | 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 | 38 | </div> |
| 39 | 39 | </div> |
| 40 | 40 | </div> |
| ... | ... | @@ -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 | 51 | <div v-if="historyList.length>0" style="height: 100%;"> |
| 52 | - <div class="history-body" > | |
| 52 | + <div class="history-body"> | |
| 53 | 53 | <p class="money-all">总欠费金额: |
| 54 | 54 | <span>¥{{(allMoney/100).toFixed(2)}}</span> |
| 55 | 55 | </p> |
| ... | ... | @@ -120,11 +120,23 @@ |
| 120 | 120 | </div> |
| 121 | 121 | <span slot="button">知道了</span> |
| 122 | 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 | 135 | </div> |
| 124 | 136 | </template> |
| 125 | 137 | |
| 126 | 138 | <script> |
| 127 | -import { parkRecordList, historyQuery, parkingQuery } from '@/api/parkRecord/parkRecord.js' | |
| 139 | +import {parkRecordList, historyQuery, parkingQuery, appApplyParkOut} from '@/api/parkRecord/parkRecord.js' | |
| 128 | 140 | import axios from 'axios' |
| 129 | 141 | |
| 130 | 142 | export default { |
| ... | ... | @@ -138,19 +150,19 @@ export default { |
| 138 | 150 | carColor: 1,// 车牌颜色 |
| 139 | 151 | currentTabActive: 1, // 显示当前哪个 |
| 140 | 152 | carNumber: '', // 车牌号码 |
| 141 | - parkingData:[], // 在停数据 | |
| 153 | + parkingData: [], // 在停数据 | |
| 142 | 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 | 161 | historyCheckedMon: 0, //选中了待缴纳的金额 |
| 150 | 162 | orderIds: [] // 选中数据的订单 数组 |
| 151 | 163 | } |
| 152 | 164 | }, |
| 153 | - mounted(){ | |
| 165 | + mounted() { | |
| 154 | 166 | }, |
| 155 | 167 | created() { |
| 156 | 168 | this.carNumber = this.$route.query.carNumber // 获取车牌号 |
| ... | ... | @@ -159,7 +171,7 @@ export default { |
| 159 | 171 | this.parkRecordList(this.carNumber) |
| 160 | 172 | }, |
| 161 | 173 | methods: { |
| 162 | - parkRecordList(){ // 获取停车记录数据 | |
| 174 | + parkRecordList() { // 获取停车记录数据 | |
| 163 | 175 | var salt = this.$utils.myCommonSalt(32); |
| 164 | 176 | var jsondata = { |
| 165 | 177 | app_id: this.$utils.myVarAppid, |
| ... | ... | @@ -185,14 +197,14 @@ export default { |
| 185 | 197 | this.parkingData = this.parkList.filter(item => { |
| 186 | 198 | return item.parkState == '10' |
| 187 | 199 | }) |
| 188 | - if(this.parkingData.length>0){ | |
| 200 | + if (this.parkingData.length > 0) { | |
| 189 | 201 | this.currentTabActive = 0 |
| 190 | 202 | } |
| 191 | 203 | console.log(this.parkingData) |
| 192 | 204 | this.historyList = this.parkList.filter(item => { |
| 193 | 205 | return item.parkState == '20' |
| 194 | 206 | }) |
| 195 | - this.historyList.forEach( i => { | |
| 207 | + this.historyList.forEach(i => { | |
| 196 | 208 | this.allMoney += Number(i.unPayFee) |
| 197 | 209 | }) |
| 198 | 210 | |
| ... | ... | @@ -206,37 +218,36 @@ export default { |
| 206 | 218 | chooseHandle(i, index) { // 历史欠费单个选择事件 |
| 207 | 219 | i.checked = !i.checked |
| 208 | 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 | 224 | this.allChecked = true |
| 213 | 225 | |
| 214 | 226 | } |
| 215 | 227 | me.orderIds.push(i.orderId) |
| 216 | 228 | me.historyCheckedMon += Number(i.unPayFee) |
| 217 | - }else{ //单个不选中 | |
| 229 | + } else { //单个不选中 | |
| 218 | 230 | let _i = me.orderIds.indexOf(i.orderId) |
| 219 | - me.orderIds.splice(_i,1) | |
| 231 | + me.orderIds.splice(_i, 1) | |
| 220 | 232 | this.allChecked = false |
| 221 | - me.historyCheckedLen -- | |
| 233 | + me.historyCheckedLen-- | |
| 222 | 234 | me.historyCheckedMon -= Number(i.unPayFee) |
| 223 | 235 | } |
| 224 | 236 | |
| 225 | - | |
| 226 | 237 | }, |
| 227 | 238 | checkedAll() { // 全选选择事件 |
| 228 | 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 | 243 | item.checked = true; |
| 233 | 244 | me.orderIds.push(item.orderId) |
| 234 | 245 | }); |
| 235 | 246 | this.historyCheckedMon = this.allMoney |
| 236 | 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 | 251 | item.checked = false; |
| 241 | 252 | |
| 242 | 253 | }); |
| ... | ... | @@ -245,46 +256,72 @@ export default { |
| 245 | 256 | this.orderIds = [] |
| 246 | 257 | } |
| 247 | 258 | }, |
| 248 | - toPayCurrent(i){ // 缴纳本次在停费用 | |
| 259 | + toPayCurrent(i, num) { // 缴纳本次在停费用 | |
| 260 | + | |
| 249 | 261 | var salt = this.$utils.myCommonSalt(32); |
| 250 | - var jsondata = { | |
| 262 | + | |
| 263 | + var params = { | |
| 251 | 264 | app_id: this.$utils.myVarAppid, |
| 252 | 265 | deviceInfo: this.$utils.myDeviceInfo, |
| 253 | 266 | salt: salt, |
| 254 | 267 | sign_type: "md5", |
| 255 | - payType: 4, | |
| 256 | - appId: this.$utils.myVxAppId, | |
| 257 | 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 | 323 | toPayHisroryPage() { // 缴纳历史费用 |
| 287 | - if(this.historyCheckedLen==0){ | |
| 324 | + if (this.historyCheckedLen == 0) { | |
| 288 | 325 | this.$refs.alert.open() |
| 289 | 326 | return |
| 290 | 327 | } |
| ... | ... | @@ -315,8 +352,8 @@ export default { |
| 315 | 352 | console.log(this.orderIds) |
| 316 | 353 | this.$router.push( |
| 317 | 354 | { |
| 318 | - path:'orderPay', | |
| 319 | - query:{ | |
| 355 | + path: 'orderPay', | |
| 356 | + query: { | |
| 320 | 357 | carColor: this.carColor,// 车牌颜色 |
| 321 | 358 | arrearageTotalFee: res.arrearageTotalFee,// 应收 |
| 322 | 359 | arrearageDiscFee: res.arrearageDiscFee,// 优惠 |
| ... | ... | @@ -331,9 +368,7 @@ export default { |
| 331 | 368 | }) |
| 332 | 369 | } |
| 333 | 370 | }, |
| 334 | - filters: { | |
| 335 | - | |
| 336 | - } | |
| 371 | + filters: {} | |
| 337 | 372 | } |
| 338 | 373 | </script> |
| 339 | 374 | |
| ... | ... | @@ -435,70 +470,72 @@ export default { |
| 435 | 470 | } |
| 436 | 471 | } |
| 437 | 472 | |
| 438 | - .history-con{ | |
| 473 | + .history-con { | |
| 439 | 474 | height: calc(100% - 38px); |
| 440 | 475 | overflow: hidden; |
| 441 | 476 | } |
| 442 | - .history-body{ | |
| 477 | + | |
| 478 | + .history-body { | |
| 443 | 479 | height: calc(100% - 81px); |
| 444 | 480 | overflow-y: scroll; |
| 445 | 481 | } |
| 446 | - .history-footer{ | |
| 482 | + | |
| 483 | + .history-footer { | |
| 447 | 484 | height: 81px; |
| 448 | 485 | background: #F8F8F8; |
| 449 | 486 | } |
| 450 | 487 | |
| 451 | - .cost-main-history{ | |
| 488 | + .cost-main-history { | |
| 452 | 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 | 491 | background-size: 20px 20px; |
| 455 | 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 | 497 | background-size: 20px 20px; |
| 462 | 498 | } |
| 463 | 499 | |
| 464 | - .money-all{ | |
| 500 | + .money-all { | |
| 465 | 501 | padding-left: 18px; |
| 466 | 502 | height: 25px; |
| 467 | 503 | line-height: 25px; |
| 468 | 504 | font-weight: 500; |
| 469 | 505 | background: #FEF8DB; |
| 470 | - span{ | |
| 506 | + span { | |
| 471 | 507 | color: #BC0202; |
| 472 | 508 | } |
| 473 | 509 | } |
| 474 | 510 | |
| 475 | - .statistical-data{ | |
| 511 | + .statistical-data { | |
| 476 | 512 | padding-left: 18px; |
| 477 | 513 | height: 32px; |
| 478 | 514 | line-height: 32px; |
| 479 | 515 | background: #E6FAFA; |
| 480 | - span{ | |
| 516 | + span { | |
| 481 | 517 | color: #D20000; |
| 482 | 518 | } |
| 483 | 519 | } |
| 484 | - .opration-wrap{ | |
| 520 | + | |
| 521 | + .opration-wrap { | |
| 485 | 522 | padding-left: 18px; |
| 486 | 523 | height: 49px; |
| 487 | 524 | line-height: 49px; |
| 488 | 525 | background: #f8f8f8; |
| 489 | 526 | display: flex; |
| 490 | 527 | justify-content: space-between; |
| 491 | - .check-btn{ | |
| 528 | + .check-btn { | |
| 492 | 529 | padding-left: 30px; |
| 493 | 530 | background: url("../assets/images/choose.png") no-repeat 0 center; |
| 494 | 531 | background-size: 20px 20px; |
| 495 | 532 | cursor: pointer; |
| 496 | 533 | } |
| 497 | - .isAllChecked{ | |
| 534 | + .isAllChecked { | |
| 498 | 535 | background: url("../assets/images/choosed.png") no-repeat 0 center; |
| 499 | 536 | background-size: 20px 20px; |
| 500 | 537 | } |
| 501 | - .settle-btn{ | |
| 538 | + .settle-btn { | |
| 502 | 539 | width: 106px; |
| 503 | 540 | height: 49px; |
| 504 | 541 | background: linear-gradient(145deg, #2783E9 0%, #227ADC 100%); | ... | ... |