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'); //设置显示时间 | ... | ... |