Commit 21bb7bf62d04c0fb1bac5cdce15090da4518f745

Authored by liuqimichale
1 parent 65d81c4b

历史欠费缴纳

src/api/parkRecord/parkRecord.js
@@ -7,3 +7,11 @@ export function parkRecordList(params) { @@ -7,3 +7,11 @@ export function parkRecordList(params) {
7 data: params 7 data: params
8 }) 8 })
9 } 9 }
  10 +
  11 +export function historyQuery(params) {
  12 + return request({
  13 + url: '/api/queryParkOrder/queryArrearageStaForWXPublc',
  14 + method: 'post',
  15 + data: params
  16 + })
  17 +}
src/components/parkRecord.vue
@@ -14,33 +14,33 @@ @@ -14,33 +14,33 @@
14 <!--本次缴费--> 14 <!--本次缴费-->
15 <div v-show="currentTabActive==0"> 15 <div v-show="currentTabActive==0">
16 16
17 - <div> 17 + <div v-if="parkingData.length>0">
18 <p class="free-tip">您为会员卡车辆无需缴费,请直接离场。</p> 18 <p class="free-tip">您为会员卡车辆无需缴费,请直接离场。</p>
19 19
20 <div class="cost-main" > 20 <div class="cost-main" >
21 <ul class="cost-header"> 21 <ul class="cost-header">
22 - <li :class="carColor | formateColor">蒙DMW169</li> 22 + <li :class="carColor | formateColor">{{i.carNumber}}</li>
23 <li>本次费用</li> 23 <li>本次费用</li>
24 </ul> 24 </ul>
25 25
26 <div class="cost-body"> 26 <div class="cost-body">
27 <p>车辆类型:临停车</p> 27 <p>车辆类型:临停车</p>
28 - <p>车场名称:赤峰金店南 28 + <p>车场名称:{{i.parkName}}
29 </p> 29 </p>
30 - <p> 进场时间:2020-12-19 12:59:18 30 + <p> 进场时间:{{i.parkInTime}}
31 </p> 31 </p>
32 - <p>出场时间:2020-12-19 12:17:52 32 + <p>出场时间:{{i.parkOutTime}}
33 </p> 33 </p>
34 - <p>停车时长:18分钟33秒</p> 34 + <p>停车时长:{{ $utils.dateFormat(i.parkDuration)}}</p>
35 <div class="out-wrap"> 35 <div class="out-wrap">
36 - <p class="mon-wrap">¥1.50</p> 36 + <p class="mon-wrap">¥{{(i.totalFee/100).toFixed(2)}}</p>
37 <p class="out-btn">出场缴费</p> 37 <p class="out-btn">出场缴费</p>
38 </div> 38 </div>
39 </div> 39 </div>
40 </div> 40 </div>
41 </div> 41 </div>
42 <!--没有在停费用--> 42 <!--没有在停费用-->
43 - <div class="noRecord">暂无记录</div> 43 + <div class="noRecord" v-else>暂无记录</div>
44 44
45 45
46 </div> 46 </div>
@@ -51,7 +51,7 @@ @@ -51,7 +51,7 @@
51 51
52 <div class="history-body"> 52 <div class="history-body">
53 <p class="money-all">总欠费金额: 53 <p class="money-all">总欠费金额:
54 - <span>¥15.50</span> 54 + <span>¥{{(allMoney/100).toFixed(2)}}</span>
55 </p> 55 </p>
56 56
57 <div class="cost-main cost-main-history" style="padding-left: 50px;" 57 <div class="cost-main cost-main-history" style="padding-left: 50px;"
@@ -61,22 +61,22 @@ @@ -61,22 +61,22 @@
61 :class="{isChecked: i.checked}" 61 :class="{isChecked: i.checked}"
62 > 62 >
63 <ul class="cost-header"> 63 <ul class="cost-header">
64 - <li :class="carColor | formateColor">蒙DMW169</li> 64 + <li :class="carColor | formateColor">{{i.carNumber}}</li>
65 <li>欠费</li> 65 <li>欠费</li>
66 </ul> 66 </ul>
67 67
68 <div class="cost-body"> 68 <div class="cost-body">
69 <p>车辆类型:临停车</p> 69 <p>车辆类型:临停车</p>
70 70
71 - <p>车场名称:赤峰金店南 71 + <p>车场名称:{{i.parkName}}
72 </p> 72 </p>
73 - <p> 进场时间:2020-12-19 12:59:18 73 + <p> 进场时间:{{i.parkInTime}}
74 </p> 74 </p>
75 - <p>出场时间:2020-12-19 12:17:52 75 + <p>出场时间:{{i.parkOutTime}}
76 </p> 76 </p>
77 - <p>停车时长:18分钟33秒</p> 77 + <p>停车时长:{{ $utils.dateFormat(i.parkDuration)}}</p>
78 <div class="out-wrap"> 78 <div class="out-wrap">
79 - <p class="mon-wrap">¥1.50</p> 79 + <p class="mon-wrap">¥{{(i.totalFee/100).toFixed(2)}}</p>
80 </div> 80 </div>
81 81
82 </div> 82 </div>
@@ -88,7 +88,7 @@ @@ -88,7 +88,7 @@
88 <div class="history-footer"> 88 <div class="history-footer">
89 <p class="statistical-data">您已选中 89 <p class="statistical-data">您已选中
90 <span>{{historyCheckedLen}}</span>笔交易 90 <span>{{historyCheckedLen}}</span>笔交易
91 - &nbsp;&nbsp;&nbsp;&nbsp;合计:¥ <span>{{historyCheckedMon/100}}.00</span> 91 + &nbsp;&nbsp;&nbsp;&nbsp;合计:¥ <span>{{(historyCheckedMon/100).toFixed(2)}}</span>
92 </p> 92 </p>
93 <div class="opration-wrap"> 93 <div class="opration-wrap">
94 <p class="check-btn" :class="{isAllChecked:allChecked}" 94 <p class="check-btn" :class="{isAllChecked:allChecked}"
@@ -123,7 +123,7 @@ @@ -123,7 +123,7 @@
123 </template> 123 </template>
124 124
125 <script> 125 <script>
126 -import { parkRecordList } from '@/api/parkRecord/parkRecord.js' 126 +import { parkRecordList, historyQuery } from '@/api/parkRecord/parkRecord.js'
127 import axios from 'axios' 127 import axios from 'axios'
128 128
129 export default { 129 export default {
@@ -137,16 +137,17 @@ export default { @@ -137,16 +137,17 @@ export default {
137 carColor: 1,// 车牌颜色 137 carColor: 1,// 车牌颜色
138 currentTabActive: 1, // 显示当前哪个 138 currentTabActive: 1, // 显示当前哪个
139 carNumber: '', // 车牌号码 139 carNumber: '', // 车牌号码
  140 + parkingData:[], // 在停数据
140 parkList: [], // 停车记录数据 141 parkList: [], // 停车记录数据
141 historyList:[ // 历史欠费数据 142 historyList:[ // 历史欠费数据
142 {money:100,checked:false, id: 1}, 143 {money:100,checked:false, id: 1},
143 - {money:200,checked:false, id: 2},  
144 - {money:300,checked:false, id: 3},  
145 - {money:400,checked:false, id: 4}, 144 +
146 ] , 145 ] ,
147 allChecked:false, // 全部选择事件 146 allChecked:false, // 全部选择事件
  147 + allMoney:0, // 欠费所有的费用
148 historyCheckedLen:0, //选中了几笔交易 148 historyCheckedLen:0, //选中了几笔交易
149 historyCheckedMon: 0, //选中了待缴纳的金额 149 historyCheckedMon: 0, //选中了待缴纳的金额
  150 + orderIds: [] // 选中数据的订单 数组
150 } 151 }
151 }, 152 },
152 mounted(){ 153 mounted(){
@@ -168,7 +169,9 @@ export default { @@ -168,7 +169,9 @@ export default {
168 { keyname: 'pageSize', value: 1000 }, 169 { keyname: 'pageSize', value: 1000 },
169 { keyname: 'parkState', value: 10 }, 170 { keyname: 'parkState', value: 10 },
170 { keyname: 'terminalSource', value: 7 }, 171 { keyname: 'terminalSource', value: 7 },
171 - { keyname: 'carNumber', value: this.carNumber } 172 + { keyname: 'carNumber', value: this.carNumber },
  173 + { keyname: 'orgId', value: this.$utils.myOrgId },
  174 +
172 ]; 175 ];
173 var md5sign = this.$utils.myGetSign(sortd); 176 var md5sign = this.$utils.myGetSign(sortd);
174 var jsondata = { 177 var jsondata = {
@@ -181,15 +184,30 @@ export default { @@ -181,15 +184,30 @@ export default {
181 parkState: 10, 184 parkState: 10,
182 terminalSource: 7, 185 terminalSource: 7,
183 carNumber: this.carNumber, 186 carNumber: this.carNumber,
184 - sign: md5sign 187 + sign: md5sign,
  188 + orgId: this.$utils.myOrgId
185 } 189 }
  190 +
  191 +
  192 + // jsondata.sign = md5sign
186 console.log('停车记录传参 ' + JSON.stringify(jsondata)); 193 console.log('停车记录传参 ' + JSON.stringify(jsondata));
187 parkRecordList(jsondata).then(response => { 194 parkRecordList(jsondata).then(response => {
188 console.log(response) 195 console.log(response)
189 this.parkList = response.data.dataList 196 this.parkList = response.data.dataList
190 - this.historyList = this.parkList.filter((item) => {  
191 - return item.parkState = '20' 197 +
  198 +
  199 + this.parkingData = this.parkList.filter(item => {
  200 + return item.parkState == '10'
192 }) 201 })
  202 + console.log(this.parkingData)
  203 + this.historyList = this.parkList.filter(item => {
  204 + return item.parkState == '20'
  205 + })
  206 + this.historyList.forEach( i => {
  207 + this.allMoney += Number(i.totalFee)
  208 + })
  209 +
  210 + console.log(this.historyList)
193 }) 211 })
194 }, 212 },
195 213
@@ -201,12 +219,17 @@ export default { @@ -201,12 +219,17 @@ export default {
201 chooseHandle(i, index) { // 历史欠费单个选择事件 219 chooseHandle(i, index) { // 历史欠费单个选择事件
202 i.checked = !i.checked 220 i.checked = !i.checked
203 let me = this 221 let me = this
  222 +
204 if(i.checked ){ //单个选中 223 if(i.checked ){ //单个选中
205 me.historyCheckedLen ++ 224 me.historyCheckedLen ++
206 - me.historyCheckedMon += i.money 225 + if(me.historyCheckedLen == this.historyList.length){
  226 + this.allChecked = true
  227 + }
  228 + me.historyCheckedMon += Number(i.totalFee)
207 }else{ //单个不选中 229 }else{ //单个不选中
  230 + this.allChecked = false
208 me.historyCheckedLen -- 231 me.historyCheckedLen --
209 - me.historyCheckedMon -= i.money 232 + me.historyCheckedMon -= Number(i.totalFee)
210 } 233 }
211 234
212 235
@@ -214,21 +237,22 @@ export default { @@ -214,21 +237,22 @@ export default {
214 checkedAll() { // 全选选择事件 237 checkedAll() { // 全选选择事件
215 this.allChecked = !this.allChecked 238 this.allChecked = !this.allChecked
216 if(this.allChecked){ //全选 239 if(this.allChecked){ //全选
217 - let me = this  
218 - me.historyCheckedMon = 0 240 + let me = this
219 this.historyList.forEach(function(item){ 241 this.historyList.forEach(function(item){
220 item.checked = true; 242 item.checked = true;
221 - me.historyCheckedMon += item.money 243 + me.orderIds.push(item.orderId)
222 }); 244 });
  245 + this.historyCheckedMon = this.allMoney
223 this.historyCheckedLen = this.historyList.length 246 this.historyCheckedLen = this.historyList.length
224 - }else{ //反选  
225 247
  248 + }else{ //反选
226 this.historyList.forEach(function(item){ 249 this.historyList.forEach(function(item){
227 item.checked = false; 250 item.checked = false;
228 251
229 }); 252 });
230 this.historyCheckedLen = 0 253 this.historyCheckedLen = 0
231 this.historyCheckedMon = 0 254 this.historyCheckedMon = 0
  255 + this.orderIds = []
232 } 256 }
233 }, 257 },
234 toPayPage() { //缴纳费用 258 toPayPage() { //缴纳费用
@@ -236,14 +260,55 @@ export default { @@ -236,14 +260,55 @@ export default {
236 this.$refs.alert.open() 260 this.$refs.alert.open()
237 return 261 return
238 } 262 }
239 - this.$router.push(  
240 - {  
241 - path:'orderPay',  
242 - query:{  
243 - carColor:0  
244 - }  
245 - }  
246 - ) 263 + var salt = this.$utils.myCommonSalt(32);
  264 +
  265 + var list = "[" + this.orderIds + "]"
  266 + // var orderlist = this.orderIds
  267 + // var codes = "[" + fun.parkCodes + "]"
  268 +
  269 + var sortd = [
  270 +
  271 + { keyname: 'app_id', value: this.$utils.myVarAppid },
  272 + { keyname: 'deviceInfo', value: this.$utils.myDeviceInfo },
  273 + { keyname: 'salt', value: salt },
  274 + { keyname: 'sign_type', value: 'md5' },
  275 + { keyname: 'orderIds', value: list },
  276 + { keyname: 'terminalSource', value: 7 },
  277 + { keyname: 'orgId', value: this.$utils.myOrgId },
  278 + { keyname: 'payType', value:4 },
  279 + { keyname: 'appId', value: this.$utils.myVxAppId }
  280 +
  281 + ];
  282 + var md5sign = this.$utils.myGetSign(sortd);
  283 +
  284 + var jsondata = {
  285 + app_id: this.$utils.myVarAppid,
  286 + deviceInfo: this.$utils.myDeviceInfo,
  287 + salt: salt,
  288 + sign: md5sign,
  289 + sign_type: "md5",
  290 + appId: this.$utils.myVxAppId,
  291 + orderIds: list,
  292 + terminalSource: '7',
  293 + payType: 4,
  294 + orgId: this.$utils.myOrgId,
  295 + }
  296 +
  297 + historyQuery(jsondata).then(response => {
  298 + console.log(response)
  299 +
  300 + })
  301 +
  302 +
  303 +
  304 + // this.$router.push(
  305 + // {
  306 + // path:'orderPay',
  307 + // query:{
  308 + // carColor:0
  309 + // }
  310 + // }
  311 + // )
247 } 312 }
248 }, 313 },
249 filters: { 314 filters: {
src/utils/utils.js
@@ -38,8 +38,60 @@ export default { @@ -38,8 +38,60 @@ export default {
38 return strmd5; 38 return strmd5;
39 }, 39 },
40 40
  41 + dateFormat: function (msd) { // 时间转换
  42 + var time = msd
  43 +
  44 + if (null != time && "" != time) {
  45 +
  46 + if (time > 60 && time < 60 * 60) {
  47 +
  48 + time = parseInt(time / 60.0) + "分钟" + parseInt((parseFloat(time / 60.0) -
  49 +
  50 + parseInt(time / 60.0)) * 60) + "秒";
  51 +
  52 + }
  53 +
  54 + else if (time >= 60 * 60 && time < 60 * 60 * 24) {
  55 +
  56 + time = parseInt(time / 3600.0) + "小时" + parseInt((parseFloat(time / 3600.0) -
  57 +
  58 + parseInt(time / 3600.0)) * 60) + "分钟" +
  59 +
  60 + parseInt((parseFloat((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60) -
  61 +
  62 + parseInt((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60)) * 60) + "秒";
  63 +
  64 + } else if (time >= 60 * 60 * 24) {
  65 +
  66 + time = parseInt(time / 3600.0 / 24) + "天" + parseInt((parseFloat(time / 3600.0 / 24) -
  67 +
  68 + parseInt(time / 3600.0 / 24)) * 24) + "小时" + parseInt((parseFloat(time / 3600.0) -
  69 +
  70 + parseInt(time / 3600.0)) * 60) + "分钟" +
  71 +
  72 + parseInt((parseFloat((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60) -
  73 +
  74 + parseInt((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60)) * 60) + "秒";
  75 +
  76 + }
  77 +
  78 + else {
  79 +
  80 + time = parseInt(time) + "秒";
  81 +
  82 + }
  83 +
  84 + }
  85 +
  86 + return time;
  87 + },
  88 +
41 myVarAppid:'ud8yq5tv0inxupc05xfeau39jywlqoj2',// 公共请求Appid 89 myVarAppid:'ud8yq5tv0inxupc05xfeau39jywlqoj2',// 公共请求Appid
42 90
43 - myDeviceInfo: 'BC0703A4-AFB0-4B51-9089-9B7487C0CC6E' // 公共请求设备信息 91 + myDeviceInfo: 'BC0703A4-AFB0-4B51-9089-9B7487C0CC6E', // 公共请求设备信息
  92 +
  93 + myVxAppId: 'wx2af2bab90d433c86' , // 微信赤峰 appid
  94 +
  95 + myOrgId: '10003' // 归属地 赤峰id
44 96
45 } 97 }