Commit 1b8be02a840999ed87b6be5c25e635ea83831138
1 parent
6fc5291d
修改购买卡时的费用
Showing
2 changed files
with
418 additions
and
334 deletions
src/main/webapp/WEB-INF/pages/monthpay.html
1 | 1 | <!DOCTYPE html> |
2 | 2 | <html lang="en"> |
3 | 3 | <head> |
4 | - <meta charset="UTF-8"> | |
5 | - <title>月卡支付</title> | |
6 | - <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/> | |
7 | - <meta name="format-detection" content="telephone=no"/> | |
8 | - <meta name="format-detection" content="email=no"/> | |
9 | - <meta name="apple-mobile-web-app-status-bar-style" content="black"/> | |
10 | - <meta name="apple-mobile-web-app-capable" content="yes"/> | |
11 | - <meta name="apple-mobile-web-app-title" content=""> | |
12 | - <meta name="google" value="notranslate"><!-- 禁止Chrome 浏览器中自动提示翻译 --> | |
13 | - <link rel="apple-touch-icon-precomposed" href="favicon.ico"> | |
14 | - <link rel="shortcut icon" href="favicon.ico"> | |
15 | - <link rel="Bookmark" href="favicon.ico"> | |
16 | - <link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css"> | |
17 | - <link rel="stylesheet" href="//cdn.bootcss.com/jquery-weui/1.0.1/css/jquery-weui.min.css"> | |
18 | - <link rel="stylesheet" href="${staticHost}/css/reset.css"> | |
19 | - <link rel="stylesheet" href="${staticHost}/css/monthpay.min.css"> | |
4 | + <meta charset="UTF-8"> | |
5 | + <title>月卡支付</title> | |
6 | + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/> | |
7 | + <meta name="format-detection" content="telephone=no"/> | |
8 | + <meta name="format-detection" content="email=no"/> | |
9 | + <meta name="apple-mobile-web-app-status-bar-style" content="black"/> | |
10 | + <meta name="apple-mobile-web-app-capable" content="yes"/> | |
11 | + <meta name="apple-mobile-web-app-title" content=""> | |
12 | + <meta name="google" value="notranslate"><!-- 禁止Chrome 浏览器中自动提示翻译 --> | |
13 | + <link rel="apple-touch-icon-precomposed" href="favicon.ico"> | |
14 | + <link rel="shortcut icon" href="favicon.ico"> | |
15 | + <link rel="Bookmark" href="favicon.ico"> | |
16 | + <link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css"> | |
17 | + <link rel="stylesheet" href="//cdn.bootcss.com/jquery-weui/1.0.1/css/jquery-weui.min.css"> | |
18 | + <link rel="stylesheet" href="${staticHost}/css/reset.css"> | |
19 | + <link rel="stylesheet" href="${staticHost}/css/monthpay.min.css"> | |
20 | 20 | </head> |
21 | 21 | <body ontouchstart> |
22 | 22 | <div class="weui-cells weui-cells_form"> |
23 | - <input type="hidden" id="parkLotCardId" value="${parkLotCardId!''}"/> | |
24 | - <div class="weui-cell"> | |
25 | - <div class="weui-cell__hd"><label class="weui-label">车牌号</label></div> | |
26 | - <div class="weui-cell__bd"> | |
27 | - <input class="weui-input" type="text" value="" maxlength="7" placeholder="请输入车牌号,必填" id="license_number"> | |
23 | + <input type="hidden" id="parkLotCardId" value="${parkLotCardId!''}"/> | |
24 | + <div class="weui-cell"> | |
25 | + <div class="weui-cell__hd"><label class="weui-label">车牌号</label></div> | |
26 | + <div class="weui-cell__bd"> | |
27 | + <input class="weui-input" type="text" value="" maxlength="7" placeholder="请输入车牌号,必填" id="license_number"> | |
28 | + </div> | |
28 | 29 | </div> |
29 | - </div> | |
30 | - <div class="weui-cell"> | |
31 | - <div class="weui-cell__hd"><label class="weui-label">卡类别</label></div> | |
32 | - <div class="weui-cell__bd" id="cardTypeRemark"> | |
33 | - <!-- 蓝牌小车包月卡--> | |
30 | + <div class="weui-cell"> | |
31 | + <div class="weui-cell__hd"><label class="weui-label">卡类别</label></div> | |
32 | + <div class="weui-cell__bd" id="cardTypeRemark"> | |
33 | + <!-- 蓝牌小车包月卡--> | |
34 | + </div> | |
34 | 35 | </div> |
35 | - </div> | |
36 | 36 | </div> |
37 | 37 | |
38 | 38 | <div class="weui-cells weui-cells_form"> |
39 | - <div class="weui-cell"> | |
40 | - <div class="weui-cell__hd"><label class="weui-label">停车场</label></div> | |
41 | - <input type="hidden" id="parkLotCode"/> | |
42 | - <div class="weui-cell__bd" id="parkLotName"></div> | |
43 | - </div> | |
44 | - <div class="weui-cell"> | |
45 | - <div class="weui-cell__hd"><label class="weui-label">购买数量</label></div> | |
46 | - <div class="weui-cell__bd"> | |
47 | - <span id="reduce_btn" class="reduce_btn">-</span><input class="weui-input inpt-num" id="numder" type="text" | |
48 | - readonly="" value="1"><span id="add_btn" | |
49 | - class="add_btn">+</span> | |
39 | + <div class="weui-cell"> | |
40 | + <div class="weui-cell__hd"><label class="weui-label">停车场</label></div> | |
41 | + <input type="hidden" id="parkLotCode"/> | |
42 | + <div class="weui-cell__bd" id="parkLotName"></div> | |
50 | 43 | </div> |
51 | - </div> | |
52 | - <div class="weui-cell"> | |
53 | - <div class="weui-cell__hd"><label for="date" class="weui-label">开始时间</label></div> | |
54 | - <div class="weui-cell__bd"> | |
55 | - <input class="weui-input" id="date" type="text" placeholder="请选择开始时间"> | |
44 | + <div class="weui-cell"> | |
45 | + <div class="weui-cell__hd"><label class="weui-label">购买数量</label></div> | |
46 | + <div class="weui-cell__bd"> | |
47 | + <span id="reduce_btn" class="reduce_btn">-</span><input class="weui-input inpt-num" id="numder" type="text" | |
48 | + readonly="" value="1"><span id="add_btn" | |
49 | + class="add_btn">+</span> | |
50 | + </div> | |
56 | 51 | </div> |
57 | - <div class="weui-cell__ft"> | |
52 | + <div class="weui-cell"> | |
53 | + <div class="weui-cell__hd"><label for="date" class="weui-label">开始时间</label></div> | |
54 | + <div class="weui-cell__bd"> | |
55 | + <input class="weui-input" id="date" type="text" placeholder="请选择开始时间"> | |
56 | + </div> | |
57 | + <div class="weui-cell__ft"> | |
58 | + </div> | |
58 | 59 | </div> |
59 | - </div> | |
60 | - <div class="weui-cell"> | |
61 | - <div class="weui-cell__hd"><label for="date1" class="weui-label">有效期至</label></div> | |
62 | - <div class="weui-cell__bd"> | |
63 | - <input class="weui-input" id="date1" type="text" readonly placeholder="请先选择开始时间"> | |
60 | + <div class="weui-cell"> | |
61 | + <div class="weui-cell__hd"><label for="date1" class="weui-label">有效期至</label></div> | |
62 | + <div class="weui-cell__bd"> | |
63 | + <input class="weui-input" id="date1" type="text" readonly placeholder="请先选择开始时间"> | |
64 | + </div> | |
64 | 65 | </div> |
65 | - </div> | |
66 | - <div class="weui-cell"> | |
67 | - <div class="weui-cell__hd"><label class="weui-label">合计</label></div> | |
68 | - <input type="hidden" id="cardAmount"/> | |
69 | - <div class="weui-cell__bd pay-total"> | |
70 | - ¥<span id="totle_money">90</span> | |
66 | + <div class="weui-cell"> | |
67 | + <div class="weui-cell__hd"><label class="weui-label">合计</label></div> | |
68 | + <input type="hidden" id="cardAmount"/> | |
69 | + <div class="weui-cell__bd pay-total"> | |
70 | + ¥<span id="totle_money">90</span> | |
71 | + </div> | |
71 | 72 | </div> |
72 | - </div> | |
73 | 73 | </div> |
74 | 74 | <div class="pay-content-padded"> |
75 | - <a href="javascript:;" class="weui-btn weui-btn_primary" id="pay_btn">提交订单</a> | |
75 | + <a href="javascript:;" class="weui-btn weui-btn_primary" id="pay_btn">提交订单</a> | |
76 | 76 | </div> |
77 | 77 | <script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script> |
78 | 78 | <script src="//cdn.bootcss.com/jquery-weui/1.0.1/js/jquery-weui.min.js"></script> |
79 | 79 | <script src="${staticHost}/js/jsutil.js"></script> |
80 | 80 | <script src="${staticHost}/js/url.js"></script> |
81 | 81 | <script type="text/javascript"> |
82 | - var func = { | |
83 | - //1.初始化页面信息.<br/> | |
84 | - initMonthCardInfo: function () { | |
85 | - var parkLotCardId = $('#parkLotCardId').val(); | |
86 | - if (parkLotCardId == null || parkLotCardId == "") { | |
87 | - $.alert("系统繁忙,请重新操作!"); | |
88 | - return false; | |
89 | - } | |
90 | - var jsonInfo = {}; | |
91 | - jsonInfo.parkLotCardId = parkLotCardId; | |
92 | - jsutil.defaultReq( | |
93 | - mUrl.queryParkLotCardForChoose, | |
94 | - jsonInfo, | |
95 | - function (data) { | |
96 | - if ("8888" == data.code) { | |
97 | - var parkLot = data.data; | |
98 | - $('#parkLotName').empty(); | |
99 | - $('#cardTypeRemark').empty(); | |
100 | - $('#totle_money').empty(); | |
101 | - $('#parkLotName').text(parkLot.parkName); | |
102 | - $('#parkLotCode').val(parkLot.parkNo); | |
103 | - $('#cardTypeRemark').text(parkLot.parkCardCouponsList[0].goods_type_remark); | |
104 | - $('#totle_money').text(parkLot.parkCardCouponsList[0].goods_amount); | |
105 | - $('#parkLotCardId').val(parkLot.parkCardCouponsList[0].id); | |
106 | - $('#cardAmount').val(parkLot.parkCardCouponsList[0].goods_amount); | |
107 | - } else { | |
108 | - $.alert("系统繁忙,请重新操作!"); | |
109 | - } | |
110 | - }); | |
111 | - } | |
112 | - }; | |
113 | - $(function () { | |
114 | - func.initMonthCardInfo(); | |
115 | - function shownowtime() { | |
116 | - var mydate = new Date(); | |
117 | - var month = mydate.getMonth() + 1; | |
118 | - var data = mydate.getDate(); | |
119 | - if (data < 10) { | |
120 | - data = '0' + data; | |
121 | - } | |
122 | - ; | |
123 | - if (month < 10) { | |
124 | - month = '0' + month; | |
125 | - } | |
126 | - ; | |
127 | - | |
128 | - var str = "" + mydate.getFullYear() + "-"; | |
129 | - str += month + "-"; | |
130 | - str += data; | |
131 | - return str; | |
132 | - } | |
133 | - | |
134 | - function showprevtime() { | |
135 | - var mydate = new Date(); | |
136 | - var month = mydate.getMonth() + 1; | |
137 | - var data = mydate.getDate() - 1; | |
138 | - if (data < 10) { | |
139 | - data = '0' + data; | |
140 | - } | |
141 | - ; | |
142 | - if (month < 10) { | |
143 | - month = '0' + month; | |
144 | - } | |
145 | - ; | |
146 | - | |
147 | - var str = "" + mydate.getFullYear() + "-"; | |
148 | - str += month + "-"; | |
149 | - str += data; | |
150 | - return str; | |
151 | - } | |
152 | - | |
153 | - $("#date").calendar({ | |
154 | - //最小时间为当前时间 | |
155 | - minDate: showprevtime(), | |
156 | - value: [shownowtime()], | |
157 | - onChange: function (p, values, displayValues) { | |
158 | - var num = $('#numder').val(); | |
159 | - console.log(values[0]) | |
160 | - var endD = addMoth(values[0], Number(num)); | |
161 | - $('#date1').val(endD); | |
162 | - | |
163 | - }, | |
164 | - | |
165 | - }); | |
166 | - //添加数量 | |
167 | - $("#add_btn").click(function () { | |
168 | - var cardAmount = $('#cardAmount').val();//月卡单价 | |
169 | - var _numb = $("#numder").val(); | |
170 | - _numb++; | |
171 | - if (_numb >= 6) { | |
172 | - return false; | |
173 | - } | |
174 | - $("#numder").val(_numb); | |
175 | - $("#totle_money").text(_numb * cardAmount); | |
176 | - var dataVal = $('#date').val(); | |
177 | - if (dataVal) { | |
178 | - var endD = addMoth(dataVal, Number(_numb)); | |
179 | - $('#date1').val(endD); | |
180 | - } | |
181 | - | |
182 | - }); | |
183 | - //减去数量 | |
184 | - $("#reduce_btn").click(function () { | |
185 | - var cardAmount = $('#cardAmount').val();//月卡单价 | |
186 | - var _numb = $("#numder").val(); | |
187 | - if (_numb <= 1) { | |
188 | - return false; | |
189 | - } | |
190 | - _numb--; | |
191 | - $("#numder").val(_numb) | |
192 | - $("#totle_money").text(_numb * cardAmount); | |
193 | - var dataVal = $('#date').val(); | |
194 | - if (dataVal) { | |
195 | - var endD = addMoth(dataVal, Number(_numb)); | |
196 | - $('#date1').val(endD); | |
197 | - } | |
198 | - }); | |
199 | - function addMoth(d, m) { | |
200 | - var ds = d.split('-'), _d = ds[2] - 0; | |
201 | - var nextM = new Date(ds[0], ds[1] - 1 + m + 1, 0); | |
202 | - var max = nextM.getDate(); | |
203 | - var dsM = ds[1] - 1 + m; | |
204 | -// if(dsM<10){ | |
205 | -// dsM = '0'+dsM; | |
206 | -// } | |
207 | -// if(_d<10){ | |
208 | -// _d = '0'+_d; | |
209 | -// } | |
210 | - d = new Date(ds[0], ds[1] - 1 + m, _d > max ? max : _d); | |
211 | - var M = (d.getMonth() + 1); | |
212 | - if (M < 10) { | |
213 | - M = '0' + M | |
214 | - } | |
215 | - ; | |
216 | - var D = d.getDate(); | |
217 | - if (D < 10) { | |
218 | - D = '0' + D | |
219 | - } | |
220 | - ; | |
221 | - | |
222 | - return d.getFullYear() + '-' + M + '-' + D; | |
82 | + var func = { | |
83 | + //1.初始化页面信息.<br/> | |
84 | + initMonthCardInfo: function () { | |
85 | + var parkLotCardId = $('#parkLotCardId').val(); | |
86 | + if (parkLotCardId == null || parkLotCardId == "") { | |
87 | + $.alert("系统繁忙,请重新操作!"); | |
88 | + return false; | |
89 | + } | |
90 | + var jsonInfo = {}; | |
91 | + jsonInfo.parkLotCardId = parkLotCardId; | |
92 | + jsutil.defaultReq( | |
93 | + mUrl.queryParkLotCardForChoose, | |
94 | + jsonInfo, | |
95 | + function (data) { | |
96 | + if ("8888" == data.code) { | |
97 | + var parkLot = data.data; | |
98 | + $('#parkLotName').empty(); | |
99 | + $('#cardTypeRemark').empty(); | |
100 | + $('#totle_money').empty(); | |
101 | + $('#parkLotName').text(parkLot.parkName); | |
102 | + $('#parkLotCode').val(parkLot.parkNo); | |
103 | + $('#cardTypeRemark').text(parkLot.parkCardCouponsList[0].goods_type_remark); | |
104 | + $('#totle_money').text(parkLot.parkCardCouponsList[0].goods_amount); | |
105 | + $('#parkLotCardId').val(parkLot.parkCardCouponsList[0].id); | |
106 | + $('#cardAmount').val(parkLot.parkCardCouponsList[0].goods_amount); | |
107 | + } else { | |
108 | + $.alert("系统繁忙,请重新操作!"); | |
109 | + } | |
110 | + }); | |
111 | + } | |
223 | 112 | }; |
224 | - //立即支付 | |
225 | - $('#pay_btn').on('click', function () { | |
226 | - var carNum = $('#license_number').val(); | |
227 | - var parkLotCardId = $('#parkLotCardId').val(); | |
228 | - var buyNum = $('#numder').val(); | |
229 | - var startDate = $('#date').val(); | |
230 | - var endDate = $('#date1').val(); | |
231 | - var totleMoney = $('#totle_money').text(); | |
232 | - if (carNum == '' || carNum == null || carNum == undefined) { | |
233 | - $.toptip('亲!请输入车牌号', 3000, 'warning'); //设置显示时间 | |
234 | - return false | |
235 | - } | |
236 | - //车牌校验 | |
237 | - var checkResult = jsutil.isVehicleNumber(jsutil.trim(carNum)); | |
238 | - if (!checkResult) { | |
239 | - $.alert("亲!输入车牌号不正确,<br/> 正确格式如:陕K88888"); | |
240 | - return false; | |
241 | - } | |
242 | - /** | |
243 | - *校验车牌号是否已经在对应的停车场已经订购? 是:跳转续费页面,否:继续订购 | |
244 | - * parkLotCardId | |
245 | - */ | |
246 | - | |
247 | - jsutil.defaultReq( | |
248 | - mUrl.checkIsbuyCard, | |
249 | - {"carNum": carNum, "parkCardId": parkLotCardId}, | |
250 | - function (data) { | |
251 | - if ("8888" != data.code) { | |
252 | - //$.alert(""); | |
253 | - return false; | |
254 | - } else { | |
255 | - if (data.data != null && data.data != '') { | |
256 | - $.confirm("亲!您已经办理该停车场卡,是否继续续费?", function () { | |
257 | - //点击确认后的回调函数 | |
258 | - window.location.href = mUrl.renewView + "&custCardId=" + data.data; | |
259 | - }, function () { | |
260 | - window.location.href = mUrl.toParkInfoListView; | |
261 | - }); | |
113 | + $(function () { | |
114 | + func.initMonthCardInfo(); | |
115 | + | |
116 | + //当pick的值发生变化的时候 | |
117 | + function pickerOnClose() { | |
118 | + var inputDateStr = formatDateStr($('#date').val()); | |
119 | + var inputDate = new Date(inputDateStr); | |
120 | + var inputYear = inputDate.getFullYear(); | |
121 | + var inputMonth = inputDate.getMonth(); | |
122 | + var date = new Date(); | |
123 | + var thisYear = date.getFullYear(); | |
124 | + var thisMonth = date.getMonth(); | |
125 | + | |
126 | + //当前时间大于选择的时间 | |
127 | + if (thisYear >= inputYear && thisMonth >= inputMonth) { | |
128 | + $.toptip('开始时间不能小于下月 1号 ', 'warning'); | |
129 | + setPickerDefaultValue(); | |
130 | + } | |
131 | + | |
132 | + var num = $("#numder").val(); | |
133 | + var startDateStr = $("#date").val(); | |
134 | + var dateStr= formatDateStr(startDateStr); | |
135 | + handelEndDateAndPrice(num, new Date(dateStr)); | |
136 | + | |
137 | + } | |
138 | + | |
139 | + //设置当前时间默认值 | |
140 | + function setPickerDefaultValue() { | |
141 | + var date = new Date(); | |
142 | + var year = date.getFullYear() + '年'; | |
143 | + var month = date.getMonth() + 2 + '月'; | |
144 | + if (month.length < 3) { | |
145 | + month = '0' + month; | |
146 | + } | |
147 | + | |
148 | + var defaultDate = [year, month, '01日']; | |
149 | + $("#date").picker("setValue", defaultDate); | |
150 | + | |
151 | + } | |
152 | + | |
153 | + //初始化时间picker选择器的参数 | |
154 | + function initPickerParam() { | |
155 | + var onClose = pickerOnClose; | |
156 | + var years = []; | |
157 | + var months = ['01月', '02月', '03月', '04月', '05月', '06月', '07月', '08月', '09月', '10月', '11月', '12月']; | |
158 | + | |
159 | + var date = new Date(); | |
160 | + var thisYear = date.getFullYear(); | |
161 | + for (var i = 0; i < 10; i++) { | |
162 | + years[i] = thisYear + i + '年'; | |
163 | + } | |
164 | + var param = {}; | |
165 | + param.onClose = onClose; | |
166 | + param.title = '请选择开始时间'; | |
167 | + var cols = [{"textAlign": 'center', values: years}, { | |
168 | + "textAlign": 'center', | |
169 | + values: months | |
170 | + }, {"textAlign": 'center', values: ['01日']}] | |
171 | + param.cols = cols; | |
172 | + | |
173 | + return param; | |
174 | + } | |
175 | + | |
176 | + //选择日期 | |
177 | + $("#date").picker( | |
178 | + initPickerParam() | |
179 | + ); | |
180 | + | |
181 | + | |
182 | + //根据数量,开始时间计算 结束时间,总价 | |
183 | + function handelEndDateAndPrice(num, startDate) { | |
184 | + if(typeof num== 'string'){ | |
185 | + num = parseInt(num); | |
186 | + } | |
187 | + //设置数量 | |
188 | + $("#numder").val(num); | |
189 | + startDate.setMonth(startDate.getMonth() + num); | |
190 | + startDate.setDate(0)//设置为0,意思为取当前月最后一天 | |
191 | + var year = startDate.getFullYear(); | |
192 | + var month = startDate.getMonth() + 1 + ''; | |
193 | + var day = startDate.getDate() + ''; | |
194 | + if (month.length == 1) { | |
195 | + //只有一位,需要补0 | |
196 | + month = '0' + month; | |
197 | + } | |
198 | + | |
199 | + if (day.length == 1) { | |
200 | + //只有一位,需要补0 | |
201 | + day = '0' + day; | |
202 | + } | |
203 | + var endDateStr = year + '年 ' + month + '月 ' + day + '日'; | |
204 | + //设置失效日期 | |
205 | + $('#date1').val(endDateStr); | |
206 | + //设置总价 | |
207 | + var price = $("#cardAmount").val(); | |
208 | + $("#totle_money").html(num * price); | |
209 | + } | |
262 | 210 | |
211 | + | |
212 | + //将年月日的日期 格式化成 用 - 间隔的 | |
213 | + function formatDateStr(dateStr) { | |
214 | + return dateStr.replace('年', '-').replace('月', '-').replace('日', '').replace(' ', '').replace(' ', ''); | |
215 | + } | |
216 | + | |
217 | + | |
218 | + //添加数量 | |
219 | + $("#add_btn").click(function () { | |
220 | + | |
221 | + var startDateStr = $("#date").val(); | |
222 | + if (null == startDateStr || startDateStr.length < 1) { | |
223 | + $.toptip('请先选择开始时间', 2000, 'warning'); | |
224 | + return; | |
225 | + } | |
226 | + var num = $("#numder").val(); | |
227 | + num++; | |
228 | + if (num > 1 && num < 6) { | |
229 | + var startDate = new Date(formatDateStr(startDateStr)); | |
230 | + handelEndDateAndPrice(num, startDate); | |
231 | + } else { | |
232 | + $.toptip('最多购买5个月', 2000, 'warning'); | |
233 | + } | |
234 | + | |
235 | + }); | |
236 | + //减去数量 | |
237 | + $("#reduce_btn").click(function () { | |
238 | + | |
239 | + var startDateStr = $("#date").val(); | |
240 | + if (null == startDateStr || startDateStr.length < 1) { | |
241 | + $.toptip('请先选择开始时间', 2000, 'warning'); | |
242 | + return; | |
243 | + } | |
244 | + | |
245 | + var num = $("#numder").val(); | |
246 | + num--; | |
247 | + if (num > 0) { | |
248 | + var startDate = new Date(formatDateStr($("#date").val())); | |
249 | + handelEndDateAndPrice(num, startDate); | |
263 | 250 | } else { |
264 | - if (startDate == '' || startDate == null || startDate == undefined) { | |
265 | - $.toptip('亲!请选择开始时间', 3000, 'warning'); //设置显示时间 | |
251 | + $.toptip('最少购买一个月', 2000, 'warning'); | |
252 | + } | |
253 | + | |
254 | + }); | |
255 | + | |
256 | + | |
257 | + //立即支付 | |
258 | + $('#pay_btn').on('click', function () { | |
259 | + var carNum = $('#license_number').val(); | |
260 | + var parkLotCardId = $('#parkLotCardId').val(); | |
261 | + var buyNum = $('#numder').val(); | |
262 | + var startDate = formatDateStr($('#date').val()); | |
263 | + var endDate = formatDateStr($('#date1').val()); | |
264 | + var totleMoney = $('#totle_money').text(); | |
265 | + if (carNum == '' || carNum == null || carNum == undefined) { | |
266 | + $.toptip('亲!请输入车牌号', 3000, 'warning'); //设置显示时间 | |
266 | 267 | return false |
267 | - } else { | |
268 | - var jsonInfo = {}; | |
269 | - jsonInfo.carNum = carNum; | |
270 | - jsonInfo.parkLotCardId = parkLotCardId; | |
271 | - jsonInfo.buyNum = buyNum; | |
272 | - jsonInfo.startDate = startDate; | |
273 | - jsonInfo.endDate = endDate; | |
274 | - jsonInfo.totleMoney = totleMoney; | |
275 | - jsonInfo.orderType = 3;// | |
276 | - jsutil.defaultReq( | |
277 | - mUrl.createOrderInfo, | |
278 | - jsonInfo, | |
279 | - function (data) { | |
268 | + } | |
269 | + //车牌校验 | |
270 | + var checkResult = jsutil.isVehicleNumber(jsutil.trim(carNum)); | |
271 | + if (!checkResult) { | |
272 | + $.alert("亲!输入车牌号不正确,<br/> 正确格式如:陕K88888"); | |
273 | + return false; | |
274 | + } | |
275 | + /** | |
276 | + *校验车牌号是否已经在对应的停车场已经订购? 是:跳转续费页面,否:继续订购 | |
277 | + * parkLotCardId | |
278 | + */ | |
279 | + | |
280 | + jsutil.defaultReq( | |
281 | + mUrl.checkIsbuyCard, | |
282 | + {"carNum": carNum, "parkCardId": parkLotCardId}, | |
283 | + function (data) { | |
280 | 284 | if ("8888" != data.code) { |
281 | - $.alert("亲!创建订单失败,请重新尝试!"); | |
282 | - return false; | |
285 | + //$.alert(""); | |
286 | + return false; | |
283 | 287 | } else { |
284 | - window.location.href = mUrl.orderPayView + "&parkOrderId=" + data.data; | |
288 | + if (data.data != null && data.data != '') { | |
289 | + $.confirm("亲!您已经办理该停车场卡,是否继续续费?", function () { | |
290 | + //点击确认后的回调函数 | |
291 | + window.location.href = mUrl.renewView + "&custCardId=" + data.data; | |
292 | + }, function () { | |
293 | + window.location.href = mUrl.toParkInfoListView; | |
294 | + }); | |
295 | + | |
296 | + } else { | |
297 | + if (startDate == '' || startDate == null || startDate == undefined) { | |
298 | + $.toptip('亲!请选择开始时间', 3000, 'warning'); //设置显示时间 | |
299 | + return false | |
300 | + } else { | |
301 | + var jsonInfo = {}; | |
302 | + jsonInfo.carNum = carNum; | |
303 | + jsonInfo.parkLotCardId = parkLotCardId; | |
304 | + jsonInfo.buyNum = buyNum; | |
305 | + jsonInfo.startDate = startDate; | |
306 | + jsonInfo.endDate = endDate; | |
307 | + jsonInfo.totleMoney = totleMoney; | |
308 | + jsonInfo.orderType = 3;// | |
309 | + jsutil.defaultReq( | |
310 | + mUrl.createOrderInfo, | |
311 | + jsonInfo, | |
312 | + function (data) { | |
313 | + if ("8888" != data.code) { | |
314 | + $.alert("亲!创建订单失败,请重新尝试!"); | |
315 | + return false; | |
316 | + } else { | |
317 | + window.location.href = mUrl.orderPayView + "&parkOrderId=" + data.data; | |
318 | + } | |
319 | + }); | |
320 | + } | |
321 | + }//else | |
285 | 322 | } |
286 | - }); | |
287 | - } | |
288 | - }//else | |
289 | - } | |
290 | - }); | |
323 | + }); | |
291 | 324 | |
292 | 325 | |
293 | - }); | |
326 | + }); | |
294 | 327 | |
295 | 328 | |
296 | - }) | |
329 | + }) | |
297 | 330 | </script> |
298 | 331 | </body> |
299 | 332 | </html> | ... | ... |
src/main/webapp/WEB-INF/pages/yearpay.html
... | ... | @@ -110,101 +110,152 @@ var func = { |
110 | 110 | }; |
111 | 111 | $(function () { |
112 | 112 | func.initYearCardInfo(); |
113 | - //获取最小S时间 | |
114 | - function shownowtime(){ | |
115 | - var mydate = new Date(); | |
116 | - var month = mydate.getMonth()+1; | |
117 | - var data = mydate.getDate(); | |
118 | - if(data<10){ | |
119 | - data='0'+data; | |
120 | - }; | |
121 | - if(month<10){ | |
122 | - month = '0'+month; | |
123 | - }; | |
113 | + //当pick的值发生变化的时候 | |
114 | + function pickerOnClose() { | |
115 | + var inputDateStr = formatDateStr($('#date').val()); | |
116 | + var inputDate = new Date(inputDateStr); | |
117 | + var inputYear = inputDate.getFullYear(); | |
118 | + var inputMonth = inputDate.getMonth(); | |
119 | + var date = new Date(); | |
120 | + var thisYear = date.getFullYear(); | |
121 | + var thisMonth = date.getMonth(); | |
122 | + | |
123 | + //当前时间大于选择的时间 | |
124 | + if (thisYear >= inputYear && thisMonth >= inputMonth) { | |
125 | + $.toptip('开始时间不能小于下月 1号 ', 'warning'); | |
126 | + setPickerDefaultValue(); | |
127 | + } | |
128 | + | |
129 | + var num = $("#numder").val(); | |
130 | + var startDateStr = $("#date").val(); | |
131 | + var dateStr= formatDateStr(startDateStr); | |
132 | + handelEndDateAndPrice(num, new Date(dateStr)); | |
124 | 133 | |
125 | - var str = "" + mydate.getFullYear() + "-"; | |
126 | - str += month + "-"; | |
127 | - str += data ; | |
128 | - return str; | |
129 | 134 | } |
130 | - function showprevtime(){ | |
131 | - var mydate = new Date(); | |
132 | - var month = mydate.getMonth()+1; | |
133 | - var data = mydate.getDate()-1; | |
134 | - if(data<10){ | |
135 | - data='0'+data; | |
136 | - }; | |
137 | - if(month<10){ | |
138 | - month = '0'+month; | |
139 | - }; | |
140 | 135 | |
141 | - var str = "" + mydate.getFullYear() + "-"; | |
142 | - str += month + "-"; | |
143 | - str += data ; | |
144 | - return str; | |
136 | + //设置当前时间默认值 | |
137 | + function setPickerDefaultValue() { | |
138 | + var date = new Date(); | |
139 | + var year = date.getFullYear() + '年'; | |
140 | + var month = date.getMonth() + 2 + '月'; | |
141 | + if (month.length < 3) { | |
142 | + month = '0' + month; | |
143 | + } | |
144 | + | |
145 | + var defaultDate = [year, month, '01日']; | |
146 | + $("#date").picker("setValue", defaultDate); | |
147 | + | |
145 | 148 | } |
146 | - $("#date").calendar({ | |
147 | - //最小时间为当前时间 | |
148 | - minDate:showprevtime(), | |
149 | - value:[shownowtime()], | |
150 | 149 | |
151 | - onChange: function (p, values, displayValues) { | |
152 | - var num = $('#numder').val(); | |
153 | - var val1 = values[0].slice(0,4); | |
154 | - var val2 = values[0].slice(4); | |
155 | - console.log(Number(val1) +Number(num)); | |
156 | - var endDate = Number(val1) +Number(num); | |
157 | - $('#date1').val(endDate+val2); | |
150 | + //初始化时间picker选择器的参数 | |
151 | + function initPickerParam() { | |
152 | + var onClose = pickerOnClose; | |
153 | + var years = []; | |
154 | + var months = ['01月', '02月', '03月', '04月', '05月', '06月', '07月', '08月', '09月', '10月', '11月', '12月']; | |
158 | 155 | |
156 | + var date = new Date(); | |
157 | + var thisYear = date.getFullYear(); | |
158 | + for (var i = 0; i < 10; i++) { | |
159 | + years[i] = thisYear + i + '年'; | |
159 | 160 | } |
160 | - }); | |
161 | + var param = {}; | |
162 | + param.onClose = onClose; | |
163 | + param.title = '请选择开始时间'; | |
164 | + var cols = [{"textAlign": 'center', values: years}, { | |
165 | + "textAlign": 'center', | |
166 | + values: months | |
167 | + }, {"textAlign": 'center', values: ['01日']}] | |
168 | + param.cols = cols; | |
169 | + | |
170 | + return param; | |
171 | + } | |
172 | + | |
173 | + //选择日期 | |
174 | + $("#date").picker( | |
175 | + initPickerParam() | |
176 | + ); | |
177 | + | |
178 | + | |
179 | + //根据数量,开始时间计算 结束时间,总价 | |
180 | + function handelEndDateAndPrice(num, startDate) { | |
181 | + if(typeof num== 'string'){ | |
182 | + num = parseInt(num); | |
183 | + } | |
184 | + //设置数量 | |
185 | + $("#numder").val(num); | |
186 | + startDate.setDate(0)//设置为0,意思为取当前月最后一天 | |
187 | + var year = startDate.getFullYear()+num; | |
188 | + var month = startDate.getMonth()+1+''; | |
189 | + var day = startDate.getDate() + ''; | |
190 | + if (month.length == 1) { | |
191 | + //只有一位,需要补0 | |
192 | + month = '0' + month; | |
193 | + } | |
194 | + | |
195 | + if (day.length == 1) { | |
196 | + //只有一位,需要补0 | |
197 | + day = '0' + day; | |
198 | + } | |
199 | + var endDateStr = year + '年 ' + month + '月 ' + day + '日'; | |
200 | + //设置失效日期 | |
201 | + $('#date1').val(endDateStr); | |
202 | + //设置总价 | |
203 | + var price = $("#cardAmount").val(); | |
204 | + $("#totle_money").html(num * price); | |
205 | + } | |
206 | + | |
207 | + | |
208 | + //将年月日的日期 格式化成 用 - 间隔的 | |
209 | + function formatDateStr(dateStr) { | |
210 | + return dateStr.replace('年', '-').replace('月', '-').replace('日', '').replace(' ', '').replace(' ', ''); | |
211 | + } | |
212 | + | |
161 | 213 | |
162 | 214 | //添加数量 |
163 | - $("#add_btn").click(function(){ | |
164 | - var cardAmount = $('#cardAmount').val();//年卡单价 | |
165 | - var _numb = $("#numder").val(); | |
166 | - _numb++; | |
167 | - if(_numb>=6){ | |
168 | - return false; | |
215 | + $("#add_btn").click(function () { | |
216 | + | |
217 | + var startDateStr = $("#date").val(); | |
218 | + if (null == startDateStr || startDateStr.length < 1) { | |
219 | + $.toptip('请先选择开始时间', 2000, 'warning'); | |
220 | + return; | |
169 | 221 | } |
170 | - $("#numder").val(_numb); | |
171 | - $("#totle_money").text(_numb*cardAmount); | |
172 | - var dataVal = $('#date').val(); | |
173 | - if(dataVal){ | |
174 | - var val1 = dataVal.slice(0,4); | |
175 | - var val2 = dataVal.slice(4); | |
176 | - console.log(Number(val1) +Number(_numb)); | |
177 | - var endDate = Number(val1) +Number(_numb); | |
178 | - $('#date1').val(endDate+val2); | |
222 | + var num = $("#numder").val(); | |
223 | + num++; | |
224 | + if (num > 1 && num < 6) { | |
225 | + var startDate = new Date(formatDateStr(startDateStr)); | |
226 | + handelEndDateAndPrice(num, startDate); | |
227 | + } else { | |
228 | + $.toptip('最多购买5年', 2000, 'warning'); | |
179 | 229 | } |
180 | 230 | |
181 | 231 | }); |
182 | 232 | //减去数量 |
183 | - $("#reduce_btn").click(function(){ | |
184 | - var cardAmount = $('#cardAmount').val();//年卡单价 | |
185 | - var _numb = $("#numder").val(); | |
186 | - if(_numb<=1){ | |
187 | - return false; | |
233 | + $("#reduce_btn").click(function () { | |
234 | + | |
235 | + var startDateStr = $("#date").val(); | |
236 | + if (null == startDateStr || startDateStr.length < 1) { | |
237 | + $.toptip('请先选择开始时间', 2000, 'warning'); | |
238 | + return; | |
188 | 239 | } |
189 | - _numb--; | |
190 | - $("#numder").val(_numb) | |
191 | - $("#totle_money").text(_numb*cardAmount); | |
192 | - var dataVal = $('#date').val(); | |
193 | - if(dataVal){ | |
194 | - var val1 = dataVal.slice(0,4); | |
195 | - var val2 = dataVal.slice(4); | |
196 | - console.log(Number(val1) +Number(_numb)); | |
197 | - var endDate = Number(val1) +Number(_numb); | |
198 | - $('#date1').val(endDate+val2); | |
240 | + | |
241 | + var num = $("#numder").val(); | |
242 | + num--; | |
243 | + if (num > 0) { | |
244 | + var startDate = new Date(formatDateStr($("#date").val())); | |
245 | + handelEndDateAndPrice(num, startDate); | |
246 | + } else { | |
247 | + $.toptip('最少购买一年', 2000, 'warning'); | |
199 | 248 | } |
249 | + | |
200 | 250 | }); |
251 | + | |
201 | 252 | //立即支付 |
202 | 253 | $('#pay_btn').on('click',function () { |
203 | 254 | var carNum = $('#license_number').val(); |
204 | 255 | var parkLotCardId = $('#parkLotCardId').val(); |
205 | 256 | var buyNum = $('#numder').val(); |
206 | - var startDate = $('#date').val(); | |
207 | - var endDate = $('#date1').val(); | |
257 | + var startDate = formatDateStr($('#date').val()); | |
258 | + var endDate = formatDateStr($('#date1').val()); | |
208 | 259 | var totleMoney =$('#totle_money').text(); |
209 | 260 | if(carNum == '' || carNum ==null || carNum == undefined){ |
210 | 261 | $.toptip('亲!请输入车牌号', 3000, 'warning'); //设置显示时间 | ... | ... |