LeeWeiCheng
/
altob.st123
1
0
Forka 0
Codice Problemi 0 Pull Requests 0 Rilasci 0 Wiki Attività
VM暫存
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
268 Commit
5 Rami (Branch)
790KB
Ramo (Branch): master
Rami (Branch) Tag
${ item.name }
Crea branch ${ searchTerm }
da 'master'
${ noResults }
altob.st123/views/payment_ats/main_page.php

847 lines
37KB
Originale Permalink Blame Cronologia 

  1. <!DOCTYPE html>

  2. <html lang="zh-TW">

  3. <head>

  4.     <meta charset="utf-8">

  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">

  6.     <meta name="viewport" content="width=device-width, initial-scale=1">

  7.     <meta name="description" content="">

  8.     <meta name="author" content="">

  9.     <title><?=STATION_NAME?> - 歐特儀自動化服務機</title>

  10.     <!-- Bootstrap Core CSS -->

  11.     <link href="<?=BOOTSTRAPS?>bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

  12.     <!-- MetisMenu CSS -->

  13.     <link href="<?=BOOTSTRAPS?>bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">

  14.     <!-- Timeline CSS -->

  15.     <link href="<?=BOOTSTRAPS?>dist/css/timeline.css" rel="stylesheet">

  16.     <!-- Custom CSS -->

  17.     <link href="<?=BOOTSTRAPS?>dist/css/sb-admin-2.css" rel="stylesheet">

  18.     <!-- Morris Charts CSS -->

  19.     <link href="<?=BOOTSTRAPS?>bower_components/morrisjs/morris.css" rel="stylesheet">

  20.     <!-- Custom Fonts -->

  21.     <link href="<?=BOOTSTRAPS?>bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

  22. 

  23. </head>

  24. <body style="font-family:Microsoft JhengHei;">

  25.     <div id="wrapper">

  26.         <!-- Navigation -->

  27.         <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">

  28.             <div class="navbar-header">

  29.                 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

  30.                     <span class="sr-only">Toggle navigation</span>

  31.                     <span class="icon-bar"></span>

  32.                     <span class="icon-bar"></span>

  33.                     <span class="icon-bar"></span>

  34.                 </button>

  35.                 <a class="navbar-brand" href=""><?=STATION_NAME?>停車場</a>

  36.             </div>

  37. 

  38.             <!-- /.navbar-top-links(左側選單) -->

  39.             <div class="navbar-default sidebar" role="navigation">

  40.                 <div class="sidebar-nav navbar-collapse">

  41.                     <ul class="nav" id="side-menu">

  42.                         <li>

  43.                             <a href="#"><i class="fa fa-user fa-fw"></i>服務項目<span class="fa arrow"></span></a>

  44.                             <ul class="nav nav-second-level">

  45. 								<li>

  46.                                     <a href="#" onclick="show_item('payment');">繳月租</a>

  47.                                 </li>

  48. 								<li>

  49.                                     <a href="#" onclick="show_item('car_lock');">會員鎖車</a>

  50.                                 </li>

  51.                             </ul>

  52.                             <!-- /.nav-second-level -->

  53.                         </li>

  54.                     </ul>

  55.                 </div>

  56.                 <!-- /.sidebar-collapse -->

  57.             </div>

  58.             <!-- /.navbar-static-side -->

  59.         </nav>

  60.         <div id="page-wrapper"><?php /* 主要資料顯示區 */ ?>

  61.             <div class="row">

  62.                 <div class="col-lg-12">

  63.                     <h1 class="page-header"><?=STATION_NAME?> - 歐特儀自動化服務機</h1><?php /* 右側小表頭 */ ?>

  64.                 </div>

  65.                 <!-- /.col-lg-12 -->

  66.             </div>

  67.             <!-- /.row -->

  68. 

  69. 			<?php /* ----- 付款 ----- */ ?>

  70.             <div data-items="payment" class="row">

  71.                 <div class="col-lg-12">

  72.                     <div class="panel panel-default">

  73.                         <div class="panel-heading"><?php /* 資料顯示區灰色小表頭 */ ?>

  74.                             繳月租

  75.                         </div>

  76.                         <div class="panel-body">

  77.                             <div data-rows class="row">

  78.                                 <div class="col-lg-6">

  79. 									<form id="payment_form" role="form" method="post">

  80.                                         <div class="form-group">

  81.                                             <label>車牌號碼</label>

  82. 											<input type="text" id="payment_lpr" class="form-control" style="text-transform:uppercase" placeholder="限英數字" autofocus required pattern="[A-Za-z0-9]*" />

  83.                                         </div>

  84.                                         <button type="submit" class="btn btn-default"onclick="do_payment(event);">確定</button>

  85.                                         <button type="reset" class="btn btn-default">重填</button>

  86.                                     </form>

  87.                                 </div>

  88.                                 <!-- /.col-lg-6 (nested) -->

  89.                             </div>

  90.                         </div>

  91.                         <!-- /.panel-body -->

  92.                     </div>

  93.                     <!-- /.panel -->

  94.                 </div>

  95.                 <!-- /.col-lg-12 -->

  96.             </div>

  97.             <?php /* ----- 付款(結束) ----- */ ?>

  98. 			

  99. 			<?php /* ----- 帳單明細顯示 ----- */ ?> 

  100.             <div data-items="price_data" class="row" style="display:none;">

  101.                 <div class="col-lg-12">

  102.                     <div class="panel panel-default">

  103.                         <div class="panel-heading"><?php /* 資料顯示區灰色小表頭 */ ?>

  104.                             帳單明細

  105.                         </div>

  106.                         <div class="panel-body">

  107.                             <div data-rows class="row">

  108.                                 <div class="col-lg-12">

  109.                             	<div class="dataTable_wrapper">

  110.                                 <table class="table table-striped table-bordered table-hover">

  111.                                     <thead>

  112.                                         <tr>

  113. 											<th style="text-align:center;"></th>

  114. 											<th style="text-align:center;">說明</th>

  115. 											<th style="text-align:center;">結算</th>

  116.                                         </tr>   

  117.                                         <tr id="price_data_list" style="display:none;">

  118. 											<td data-tag="p_no" style="text-align:center;vertical-align: middle;"></td>

  119. 											<td data-tag="p_meta" style="text-align:left;vertical-align: middle;"></td>

  120. 											<td data-tag="p_result" style="text-align:left;vertical-align: middle;"></td>

  121.                                         </tr>

  122.                                     </thead>

  123.                                     <tbody id="price_data_tbody" style="font-size:10px;"></tbody>

  124. 									<tr>

  125. 										<td style="text-align:left;vertical-align: middle;">

  126. 										</td>

  127. 										<td style="text-align:left;vertical-align: middle;">

  128. 										</td>

  129. 										<td style="text-align:left;vertical-align: middle;">

  130. 										</td>

  131. 									</tr>

  132. 									<tr>

  133. 										<td style="text-align:left;vertical-align: middle;">

  134. 										</td>

  135. 										<td style="text-align:center;vertical-align: middle;">

  136. 										</td>

  137. 										<td style="text-align:center;vertical-align: middle;">

  138. 										</td>

  139. 									</tr>

  140. 									<tr>

  141. 										<td style="text-align:left;vertical-align: middle;">

  142. 										</td>

  143. 										<td style="text-align:center;vertical-align: middle;">

  144. 											時間加總

  145.                                         </td>

  146. 										<td style="text-align:center;vertical-align: middle;">

  147. 											費用加總

  148. 										</td>

  149. 									</tr>

  150. 									<tr>

  151. 										<td style="text-align:left;vertical-align: middle;">

  152. 										</td>

  153. 										<td style="text-align:center;vertical-align: middle;">

  154. 											<span id="show_amt_detail_time"></span>

  155. 										</td>

  156. 										<td style="text-align:center;vertical-align: middle;">

  157. 											<span id="show_amt_detail_price"></span>

  158. 										</td>

  159. 									</tr>

  160. 									<tr>

  161. 										<td style="text-align:left;vertical-align: middle;">

  162. 										</td>

  163. 										<td style="text-align:center;vertical-align: middle;">

  164. 										</td>

  165. 										<td style="text-align:center;vertical-align: middle;">

  166. 											<button type="button" class="btn btn-default" onclick="show_item_without_change('payment_data');">返回結帳畫面</button>

  167. 										</td>

  168. 									</tr>

  169.                                 </table>

  170.                                 </div>

  171.                                 </div>

  172.                                 <!-- /.col-lg-6 (nested) -->

  173.                             </div>

  174.                             <?php /* ----- 報表清單(結束) ----- */ ?> 

  175.                         </div>

  176.                         <!-- /.panel-body -->

  177.                     </div>

  178.                     <!-- /.panel -->

  179.                 </div>

  180.                 <!-- /.col-lg-12 -->

  181.             </div>   

  182.             <?php /* ----- 帳單明細顯示(結束) ----- */ ?> 

  183. 

  184. 			<?php /* ----- 帳單查詢結果 ----- */ ?>

  185.             <!-- div data-items="rent_sync" class="row" style="display:none;"-->

  186.             <div data-items="payment_data" class="row" style="display:none;">

  187.                 <div class="col-lg-12">

  188.                     <div class="panel panel-default">

  189.                         <div class="panel-heading"><?php /* 資料顯示區灰色小表頭 */ ?>

  190.                             帳單查詢結果

  191.                         </div>

  192.                         <div class="panel-body" style="margin: 0px auto;">

  193.                             <div data-rows class="row">

  194.                                 <div class="col-lg-6" style="margin: 0px auto;">

  195. 								<form id="payment_data" role="form" method="post">

  196.                                 <table class="table table-striped table-bordered table-hover"">

  197.                                     <tbody id="available_curr_tbody" style="font-size:14px;">

  198. 										<tr>

  199.                                             <td style="text-align:right;vertical-align: middle;" width="20%">會員姓名</td>

  200.                                             <td id="show_member_name" style="text-align:left;vertical-align:middle;text-transform:uppercase;"></td>

  201.                                         </tr>

  202.                                         <tr>

  203.                                             <td style="text-align:right;vertical-align: middle;" width="20%">車號</td>

  204.                                             <td id="show_payment_lpr" style="text-align:left;vertical-align:middle;text-transform:uppercase;"></td>

  205.                                         </tr>

  206.                                         <tr>

  207.                                             <td style="text-align:right;vertical-align: middle;">到期日</td>

  208.                                             <td id="show_end_date" style="text-align:left;vertical-align: middle;"></td>

  209.                                         </tr>

  210.                                         <tr>

  211.                                             <td style="text-align:right;vertical-align: middle;">次期起始日</td>

  212.                                             <td id="show_next_start" style="text-align:left;vertical-align: middle;"></td>

  213.                                         </tr>

  214. 										<tr>

  215.                                             <td style="text-align:right;vertical-align: middle;">次期到期日</td>

  216.                                             <td id="show_next_end" style="text-align:left;vertical-align: middle;"></td>

  217.                                         </tr>

  218.                                         <tr>

  219.                                             <td style="text-align:right;vertical-align: middle;">金額 (NTD)</td>

  220.                                             <td id="show_amt" style="text-align:left;vertical-align: middle;"></td>

  221.                                         </tr>

  222.                                         <tr class="form-group"style="display:none;">

  223.                                             <td style="text-align:right;vertical-align: middle;">發票載具 <br/>(手機條碼)</td>

  224. 											<td style="text-align:left;vertical-align: middle;">

  225. 											<input type="text" id="invoice_receiver" class="form-control" placeholder="如不要發票請留空白"

  226. 												data-validation="custom"

  227. 												data-validation-regexp="^$|^(?=.{7}$)([A-Za-z0-9]+)$|^(?=.{8}$)\u002F([A-Za-z0-9]+)$"

  228. 												data-validation-error-msg="請輸入正確載具<br/>格式： / + 7碼 <br/>(共8碼)"

  229. 												/>

  230.                                             </td>

  231.                                         </tr>

  232. 										<tr class="form-group" style="display:none;">

  233. 											<td style="text-align:right;vertical-align: middle;"></td>

  234. 											<td style="text-align:left;vertical-align: middle; color: red;">

  235. 												若發票載具留空白，發票將自動送個社福團體

  236. 											</td>

  237. 										</tr>

  238. 										<tr class="form-group">

  239.                                             <td style="text-align:right;vertical-align: middle;">公司統編</td>

  240. 											<td style="text-align:left;vertical-align: middle;">

  241. 											<input type="tel" id="company_no" class="form-control" placeholder="如不打統編請留空白"

  242. 												data-validation="custom"

  243. 												data-validation-optional="true"

  244. 												data-validation-regexp="^(?=.{8}$)([0-9]+)$"

  245. 												data-validation-error-msg="請輸入正確統編<br/>例如：80682490"

  246. 												data-validation-error-msg-container="#company_no_error_msg"

  247. 												/>

  248. 												<span id="company_no_error_msg"></span>

  249.                                             </td>

  250.                                         </tr>

  251. 										<tr class="form-group">

  252.                                             <td style="text-align:right;vertical-align: middle;">電子信箱</td>

  253. 											<td style="text-align:left;vertical-align: middle;">

  254. 											<input type="email" id="email" class="form-control" placeholder="發票將寄信通知"

  255. 												data-validation="email"

  256. 												data-validation-optional="true"

  257. 												data-validation-error-msg="請輸入正確信箱<br/>例如：altob@gmail.com"

  258. 												data-validation-error-msg-container="#email_error_msg"

  259. 												/>

  260. 												<span id="email_error_msg"></span>

  261.                                             </td>

  262.                                         </tr>

  263. 										<tr class="form-group">

  264.                                             <td style="text-align:right;vertical-align: middle;">手機號碼</td>

  265. 											<td style="text-align:left;vertical-align: middle;">

  266. 											<input type="tel" id="mobile" class="form-control" placeholder="發票將寄簡訊通知"

  267. 												data-validation="custom"

  268. 												data-validation-optional="true"

  269. 												data-validation-regexp="^(?=.{10}$)09([0-9]+)$"

  270. 												data-validation-error-msg="請輸入正確手機號碼<br/>例如：0912345678"

  271. 												data-validation-error-msg-container="#mobile_error_msg"

  272. 												/>

  273. 												<span id="mobile_error_msg"></span>

  274.                                             </td>

  275.                                         </tr>

  276. 										<tr>

  277.                                             <td style="text-align:right;vertical-align: middle;">訂單编號</td>

  278.                                             <td id="show_order_no" style="text-align:left;vertical-align: middle;"></td>

  279.                                         </tr>

  280. 										<tr>

  281.                                             <td style="text-align:right;vertical-align: middle;">有效期限</td>

  282.                                             <td id="show_balance_time_limit_countdown" style="text-align:left;vertical-align: middle; color: red;"></td>

  283.                                         </tr>

  284.                                         <tr>

  285.                                             <td style="text-align:right;vertical-align: middle;">

  286. 												<button type="button" class="btn btn-default" onclick="transfer_money(event);">開始付款</button>

  287.                                             </td>

  288.                                             <td style="text-align:left;vertical-align: middle;">

  289. 												<!--button type="button" class="btn btn-default" onclick="show_item('price_data');">查看明細</button-->

  290. 												<button type="button" class="btn btn-default" onclick="show_item('payment');">取消</button>

  291.                                             </td>

  292.                                         </tr>

  293.                                     </tbody>

  294.                                 </table>

  295. 								</form>

  296.                                 </div>

  297.                                 <!-- /.col-lg-6 (nested) -->

  298.                             </div>

  299.                             <!-- /.row (nested) -->

  300.                         </div>

  301.                         <!-- /.panel-body -->

  302.                     </div>

  303.                     <!-- /.panel -->

  304.                 </div>

  305.                 <!-- /.col-lg-12 -->

  306.             </div>

  307.             <?php /* ----- 帳單查詢結果(結束) ----- */ ?>

  308. 			

  309. 			

  310. 			

  311. 			

  312.             <?php /* ----- 鎖車作業 ----- */ ?>

  313.             <div data-items="car_lock" class="row" style="display:none;">

  314.                 <div class="col-lg-12">

  315.                     <div class="panel panel-default">

  316.                         <div class="panel-heading"><?php /* 資料顯示區灰色小表頭 */ ?>

  317.                             會員鎖車

  318.                         </div>

  319.                         <div class="panel-body">

  320.                             <div data-rows class="row">

  321.                                 <div class="col-lg-6">

  322.                                         <div class="form-group">  

  323.                                         	<form id="form_lock" method="post">

  324.                                             <label>請鍵入車牌號碼</label>

  325.                                             <input type="text" id="lpr_lock" class="form-control" style="text-transform:uppercase;" placeholder="限英數字" autofocus required pattern="[A-Za-z0-9]*" /><br />

  326.                                             <label>密碼(第一次與車號相同)</label>

  327.                                             <input type="password" id="pswd_lock" class="form-control" style="text-transform:uppercase;" autofocus required pattern="[A-Za-z0-9]*" /><br />

  328.                                         	<button type="submit" id="qcar_lock" class="btn btn-default">查詢</button>

  329.                                         	<button type="submit" id="change_pswd_lock" class="btn btn-default">更改密碼</button>

  330.                                         	<button type="reset" class="btn btn-default">清除資料</button>

  331.                                             </form>

  332.                                         </div>

  333.                                 </div>

  334.                                 <!-- /.col-lg-6 (nested) -->

  335.                             </div>

  336.                         </div>

  337.                         <!-- /.panel-body -->

  338.                     </div>

  339.                     <!-- /.panel -->

  340.                 </div>

  341.                 <!-- /.col-lg-12 -->

  342.             </div>

  343.             <?php /* ----- 鎖車(結束) ----- */ ?>  

  344.                                                                 

  345.             <?php /* ----- 更改鎖車密碼 ----- */ ?>

  346.             <div data-items="pswd_lock" class="row" style="display:none;">

  347.                 <div class="col-lg-12">

  348.                     <div class="panel panel-default">

  349.                         <div class="panel-heading"><?php /* 資料顯示區灰色小表頭 */ ?>

  350.                             更改鎖車密碼

  351.                         </div>

  352.                         <div class="panel-body">

  353.                             <div data-rows class="row">

  354.                                 <div class="col-lg-6">

  355.                                         <div class="form-group">  

  356.                                         	<form id="form_new_pswd" method="post">

  357.                                             <label>新密碼</label>

  358.                                             <input type="text" id="new_pswd1" class="form-control" style="text-transform:uppercase;" placeholder="限英數字" autofocus required pattern="[A-Za-z0-9]*" /><br />

  359.                                             <label>再鍵一次密碼</label>

  360.                                             <input type="password" id="new_pswd2" class="form-control" style="text-transform:uppercase;" placeholder="限英數字" autofocus required pattern="[A-Za-z0-9]*" /><br />

  361.                                         	<button type="submit" class="btn btn-default">儲存</button>

  362.                                         	<button type="button" class="btn btn-default">取消</button>

  363.                                             </form>

  364.                                         </div>

  365.                                 </div>

  366.                                 <!-- /.col-lg-6 (nested) -->

  367.                             </div>

  368.                         </div>

  369.                         <!-- /.panel-body -->

  370.                     </div>

  371.                     <!-- /.panel -->

  372.                 </div>

  373.                 <!-- /.col-lg-12 -->

  374.             </div>

  375.             <?php /* ----- 更改密碼(結束) ----- */ ?>   

  376.             

  377.             <?php /* ----- 鎖車與解鎖 ----- */ ?>

  378.             <div data-items="status_lock" class="row" style="display:none;">

  379.                 <div class="col-lg-12">

  380.                     <div class="panel panel-default">

  381.                         <div class="panel-heading"><?php /* 資料顯示區灰色小表頭 */ ?>

  382.                             鎖車/解鎖

  383.                         </div>

  384.                         <div class="panel-body">

  385.                             <div data-rows class="row">

  386.                                 <div class="col-lg-6">

  387.                                         <div class="form-group">  

  388.                                         	<form id="form_active_lock" method="post">

  389.                                             <label><span id="lpr_on_off"></span>: [<span id="lock_on_off">無</span>鎖車]</label><br />

  390.                                         	<input type="button" id="lock_unlock" class="btn btn-default" value="鎖車" />

  391.                                         	<input type="button" id="lock_back" class="btn btn-default" value="結束" />

  392.                                             </form>

  393.                                         </div>

  394.                                 </div>

  395.                                 <!-- /.col-lg-6 (nested) -->

  396.                             </div>

  397.                         </div>

  398.                         <!-- /.panel-body -->

  399.                     </div>

  400.                     <!-- /.panel -->

  401.                 </div>

  402.                 <!-- /.col-lg-12 -->

  403.             </div>

  404.             <?php /* ----- 鎖車與解鎖(結束) ----- */ ?>   

  405. 			

  406. 			

  407. 

  408.         <!-- /#page-wrapper -->

  409.     </div>

  410.     <!-- /#wrapper -->

  411.     <!-- jQuery -->

  412.     <script src="<?=BOOTSTRAPS?>bower_components/jquery/dist/jquery.min.js"></script>

  413.     <!-- Bootstrap Core JavaScript -->

  414.     <script src="<?=BOOTSTRAPS?>bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

  415.     <!-- Metis Menu Plugin JavaScript -->

  416.     <script src="<?=BOOTSTRAPS?>bower_components/metisMenu/dist/metisMenu.min.js"></script>

  417.     <!-- Morris Charts JavaScript -->

  418.     <script src="<?=BOOTSTRAPS?>bower_components/raphael/raphael-min.js"></script>

  419.     <!--script src="<?=BOOTSTRAPS?>bower_components/morrisjs/morris.min.js"></script-->

  420.     <!--script src="<?=BOOTSTRAPS?>js/morris-data.js"></script-->

  421. 

  422. 

  423. 

  424. 

  425.     <!-- virtual keyboard -->

  426.   	<!--link href="<?=WEB_LIB?>virtual-keyboard/css/jquery-ui.min.css" rel="stylesheet">

  427. 	<link href="<?=WEB_LIB?>virtual-keyboard/css/keyboard.css" rel="stylesheet">

  428.   	<script src="<?=WEB_LIB?>virtual-keyboard/js/jquery-ui.min.js"></script>

  429.   	<script src="<?=WEB_LIB?>virtual-keyboard/js/jquery.keyboard.js"></script>

  430.   	<script src="<?=WEB_LIB?>virtual-keyboard/js/jquery.keyboard.extension-caret.js"></script-->

  431. 

  432. 	<!-- jQuery validate -->

  433. 	<script src="<?=WEB_LIB?>form-validator/jquery.form-validator.min.js"></script>

  434. 	<!-- alertify -->

  435. 	<link href="<?=WEB_LIB?>css/alertify.core.css" rel="stylesheet">

  436. 	<link href="<?=WEB_LIB?>css/alertify.bootstrap.css" rel="stylesheet">

  437. 	<script src="<?=WEB_LIB?>js/alertify.min.js"></script> 

  438. 	<!-- alertify -->

  439. 	<script src="<?=WEB_LIB?>js/moment.min.js"></script> 

  440. 	

  441. 	

  442. 	<!-- md5 -->

  443. 	<script src="<?=WEB_LIB?>js/md5.min.js"></script> 

  444. 	

  445. 

  446.     <!-- Custom Theme JavaScript -->

  447.     <script src="<?=BOOTSTRAPS?>dist/js/sb-admin-2.js"></script>

  448.     <div id="works" style="display:none;"></div><?php /* 作為浮動顯示區之用 */ ?>

  449. </body>

  450. </html>

  451. 

  452. <script>

  453. 

  454. <?php /* alertify function */ ?>

  455. function alertify_log($msg)

  456. {

  457. 	alertify.set({delay : 2000});

  458. 	alertify.log($msg);

  459. }

  460. function alertify_error($msg)

  461. {

  462. 	alertify.set({delay : 2000});

  463. 	alertify.error($msg);

  464. }

  465. function alertify_success($msg)

  466. {

  467. 	alertify.set({delay : 2000});

  468. 	alertify.success($msg);

  469. }

  470. 

  471. var refreshIntervalId = 0; // timer id

  472. 

  473. <?php /* 顯示指定項目 */ ?>

  474. function show_item(tags)

  475. {

  476. 	$("#payment_lpr").val("");<?php /* 清除車號欄位 */ ?>

  477. 	

  478. 	$("#show_member_name").val("");

  479. 	$("#show_payment_lpr").val("");

  480. 	$("#show_end_date").val("");

  481. 	$("#show_next_start").val("");

  482. 	$("#show_next_end").val("");

  483. 	$("#show_amt").val("");

  484. 	$("#invoice_receiver").val("");

  485. 	$("#company_no").val("");

  486. 	$("#email").val("");

  487. 	$("#mobile").val("");

  488. 	$("#show_order_no").val("");

  489. 	

  490. 	

  491. 	$("#show_amt_detail").val("");

  492. 	$("#show_balance_time_limit_countdown").val("");

  493. 	

  494. 	if(tags.indexOf('payment_data') < 0 && tags.indexOf('price_data') < 0){

  495. 		clearInterval(refreshIntervalId); // 消除倒數計時timer

  496. 	}

  497. 	

  498. 	$("[data-items]").hide();

  499. 	$("[data-items="+tags+"]").show();

  500.     return false;

  501. }

  502. 

  503. <?php /* 顯示指定項目, 不修改資料 */ ?>

  504. function show_item_without_change(tags)

  505. {

  506. 	$("[data-items]").hide();

  507. 	$("[data-items="+tags+"]").show();

  508.     return false;

  509. }

  510. 

  511. // 付款

  512. function do_payment(event)

  513. {

  514. 	event.preventDefault();

  515. 

  516. 	if ($("#payment_lpr").val() == "")

  517.     {

  518. 		alertify_error("請填寫車號");

  519.        	return false;

  520.     }

  521. 

  522. 	$.ajax

  523. 	({

  524. 		url: "<?=APP_URL?>payment_lpr",

  525. 		type: "post",

  526. 		dataType:"text",

  527. 		data:{

  528. 			"payment_lpr": $("#payment_lpr").val()

  529. 		},

  530. 		success: function(result)

  531. 		{

  532. 			if (/^[\],:{}\s]*$/.test(result.replace(/\\["\\\/bfnrtu]/g, '@').

  533. 			replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').

  534. 			replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {

  535. 				//the json is ok

  536. 			}else{

  537. 				//the json is not ok

  538. 				alertify_error("查無資料，請鍵入正確資料 (回傳資料有誤)");

  539. 				return false;

  540. 			}

  541. 			

  542. 			var jdata = JSON.parse(result);

  543. 			//console.log(jdata);

  544. 			if(!jdata)

  545. 			{

  546.             	alertify_error("查無資料，請鍵入正確資料");

  547.                 return false;

  548.             }

  549. 			

  550. 			if(jdata.member_no <= 0)

  551. 			{

  552. 				alertify_log("查無會員資料");

  553.                 return false;

  554. 			}

  555. 			

  556. 			if(jdata.amt <= 0)

  557. 			{

  558.             	alertify_log("目前無須繳款，謝謝");

  559.                 return false;

  560.             }

  561. 			

  562. 			if(jdata.amt > 15000)

  563. 			{

  564.             	alertify_log("[ 代碼:001 ]<br/>請到管理室繳費, 謝謝");

  565.                 return false;

  566.             }

  567. 

  568. 			// variables for time units

  569. 			var days, hours, minutes, seconds;

  570. 			 

  571. 			// get tag element

  572. 			var countdown = $("#show_balance_time_limit_countdown");

  573. 			

  574. 			//var countdown_offset_ms = 60*5*1000; // 比資料庫早5分鐘timeout

  575. 			var duration = moment.duration({minutes: 5}); // 比資料庫早5分鐘timeout

  576. 			

  577. 			// set the date we're counting down to

  578. 			var target_date = moment(jdata.balance_time_limit).subtract(duration);

  579. 			//var target_date = new Date(jdata.balance_time_limit).getTime();

  580. 			

  581. 			//console.log(target_date.diff(moment(), 'seconds'));

  582. 			

  583. 			// update the tag with id "countdown" every 1 second

  584. 			refreshIntervalId = setInterval(function () {

  585. 			    // find the amount of "seconds" between now and target

  586. 				var seconds_left = target_date.diff(moment(), 'seconds');

  587. 				

  588. 				//console.log(seconds_left);

  589. 				

  590. 				//var current_date = new Date().getTime();

  591. 			    //var seconds_left = (target_date - current_date - countdown_offset_ms) / 1000;

  592. 			

  593. 				if(seconds_left <= 0){

  594. 					clearInterval(refreshIntervalId);

  595. 					// reload page

  596. 					location.reload();

  597. 				}

  598. 			 

  599. 			    // do some time calculations

  600. 			    days = parseInt(seconds_left / 86400);

  601. 			    seconds_left = seconds_left % 86400;

  602. 			     

  603. 			    hours = parseInt(seconds_left / 3600);

  604. 			    seconds_left = seconds_left % 3600;

  605. 			     

  606. 			    minutes = parseInt(seconds_left / 60);

  607. 			    seconds = parseInt(seconds_left % 60);

  608. 

  609. 				if(minutes < 10){

  610. 					minutes = '0' + minutes;

  611. 				}

  612. 				if(seconds < 10){

  613. 					seconds = '0' + seconds;

  614. 				}

  615. 			    // format countdown string + set tag value

  616. 				countdown.text(['還剩 ', minutes, ' : ', seconds, ' 有效'].join(''));

  617. 			}, 1000);

  618. 			

  619. 			$("#show_payment_lpr").text(jdata.lpr);

  620.             

  621. 			$("#show_member_name").text(jdata.member_name);

  622. 			$("#show_end_date").text(jdata.end_time);

  623. 			$("#show_next_start").text(jdata.next_start_time);

  624. 			$("#show_next_end").text(jdata.next_end_time);

  625. 			$("#show_amt").text(jdata.amt);

  626. 			$("#show_in_time").text(jdata.in_time);

  627.             $("#show_amt").text([jdata.amt, ' 元'].join(''));

  628. 			$("#show_order_no").text(jdata.order_no);

  629. 

  630. 			show_item("payment_data");

  631. 			

  632. 			// parse price detail

  633. 			$("#price_data_tbody").html("");	

  634. 		}

  635. 		

  636. 	});

  637. }

  638. 

  639. // 開啟轉帳畫面

  640. function transfer_money(event)

  641. {

  642. 	event.preventDefault();

  643. 	

  644. 	if(! $("#payment_data").isValid()) return false;

  645. 	

  646. 	if($("#email").val() == '' && $("#mobile").val() == '')

  647. 	{

  648. 		alertify_error("請至少提供一項發票通知方式<br/>1. 電子信箱 <br/>2. 或 手機號碼<br/><br/>謝謝!!");

  649. 		return false;

  650. 	}

  651. 

  652. 	if (! confirm("開始結帳嗎 ?"))	return false;

  653. 	

  654. 	// Create Base64 Object

  655. 	var Base64 = {_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=Base64._utf8_encode(e);while(f<e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n>>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9\+\/\=]/g,"");while(f<e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s<<2|o>>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=Base64._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/\r\n/g,"\n");var t="";for(var n=0;n<e.length;n++){var r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r)}else if(r>127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n<e.length){r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r);n++}else if(r>191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}}

  656. 

  657. 	var order_no = $("#show_order_no").text() == '' ? '0' : $("#show_order_no").text();

  658.     var invoice_receiver = $("#invoice_receiver").val() == '' ? '0' : $("#invoice_receiver").val();

  659. 	var company_no = $("#company_no").val() == '' ? '0' : $("#company_no").val();

  660. 	var email = $("#email").val() == '' ? '0' : Base64.encode($("#email").val()).slice(0, -1); // remove base64 '=' for URI rule

  661. 	var mobile = $("#mobile").val() == '' ? '0' : $("#mobile").val();

  662. 		

  663.     webatm = window.open(

  664. 		["<?=APP_URL?>transfer_money/", 

  665. 			order_no, "/", 

  666. 			encodeURI(invoice_receiver), "/", 

  667. 			encodeURI(company_no), "/", 

  668. 			email, "/",

  669. 			mobile, "/"

  670. 			].join('')

  671. 		, "_self");

  672. 

  673. 	// window.top.close(); // 關視窗

  674.     // setTimeout(function(){ webatm.close(); }, 3000);

  675. }

  676. 

  677. $(document).ready(function()

  678. {

  679. 	<?php /* validate  設定start */ ?>

  680. 	$.validate(

  681. 		{

  682. 			modules : 'security',

  683. 		}

  684. 	);

  685. 	<?php /* validate  設定end */ ?>

  686. 	

  687. 	// 定時自動更新頁面

  688. 	(function autoReloadPage(){

  689. 		var pageReloadTimeMillis = 600000;			// 頁面, 自動重新載入週期 ( 10 min )

  690. 		var pageCheckReloadTimeMillis = 10000;		// 頁面, 判斷重新載入週期 ( 10 sec )

  691. 		var aliveTime = moment();

  692. 		$(document.body).bind("mousemove keypress", function(e) {

  693. 			aliveTime = moment();

  694. 		});

  695. 		function refresh() {

  696. 			if(moment() - aliveTime >= pageReloadTimeMillis) // 如果頁面沒動作, 才更新

  697. 				window.location.reload(true);

  698. 			else 

  699. 				setTimeout(refresh, pageCheckReloadTimeMillis);

  700. 		}

  701. 		setTimeout(refresh, pageCheckReloadTimeMillis);

  702. 	})();

  703. 	

  704. 	

  705. 	

  706. 	

  707. 	

  708. 	// ----- 鎖車密碼更新 -----

  709. 	$("#form_new_pswd").submit(function(event)

  710. 	{                  

  711.     	event.preventDefault(); 

  712.         

  713.         $("#new_pswd1").val($("#new_pswd1").val().toUpperCase());

  714.         $("#new_pswd2").val($("#new_pswd2").val().toUpperCase());

  715. 		if ($("#new_pswd1").val() != $("#new_pswd2").val() || $("#new_pswd1").val() == "" || $("#new_pswd2").val() == "")

  716.     	{

  717.      		alert("密碼不符規定, 請重新輸入 !");

  718.         	return false;

  719.     	}                 

  720.                         

  721.         // 查詢目前有無鎖車狀況

  722. 		$.ajax

  723.     	({                         

  724.         	url:"<?=APP_URL?>change_pswd",

  725.         	dataType:"text",

  726.         	type:"post",

  727.         	data:

  728.             	{	"lpr":$("#lpr_lock").val(),

  729.             		"new_pswd":$("#new_pswd1").val()

  730.             	},

  731.         	success:function(jdata)

  732.         	{                           

  733.         		alert("密碼更新完成 !");

  734.             	$("#pswd_lock").val("");

  735.             	show_item("car_lock");     

  736.     		}                                                                          

  737.     	}); 

  738.     });

  739.     

  740.     

  741.     // ----- 鎖車 -----

  742. 	$("#form_lock").submit(function(event)

  743. 	{                  

  744.     	event.preventDefault(); 

  745.         submit_id = $(document.activeElement).prop('id');

  746.         

  747. 		if ($("#lpr_lock").val() == "" || $("#pswd_lock").val() == "")

  748.     	{

  749.      		alert("請填寫車號及密碼");

  750.         	return false;

  751.     	}                 

  752.         

  753.         $("#lpr_lock").val($("#lpr_lock").val().toUpperCase());

  754.         $("#pswd_lock").val($("#pswd_lock").val().toUpperCase()); 

  755.         

  756.         // 查詢目前有無鎖車狀況

  757. 		$.ajax

  758.     	({                         

  759.         	url: "<?=APP_URL?>security_action/"+$("#lpr_lock").val()+"/"+md5($("#pswd_lock").val().toUpperCase())+"/2", 

  760.         	dataType:"json",

  761.         	type:"post",

  762.         	data:{},

  763.         	success:function(jdata)

  764.         	{

  765.         		if (jdata["result_code"] == "FAIL")

  766.             	{

  767.             		alert("車號或密碼錯誤");

  768.                 	return false;

  769.             	}

  770.                   

  771.                 // 更改密碼, 進入下一個畫面

  772.         		if (submit_id == "change_pswd_lock")

  773.         		{                       

  774.                 	$("#new_pswd1").val("");

  775.                 	$("#new_pswd2").val("");

  776.            			show_item("pswd_lock");

  777.             		return true;

  778.         		} 

  779.                                                            

  780.                 $("#lpr_on_off").text($("#lpr_lock").val());

  781.                 lock_on_off = jdata["result"][0]["result"];

  782.                 if (lock_on_off == "ON")

  783.                 {

  784.                 	$("#lock_on_off").text("已");  

  785.                 	$("#lock_unlock").val("解鎖");  

  786.                 }                           

  787.                 else

  788.                 {

  789.                 	$("#lock_on_off").text("無"); 

  790.                 	$("#lock_unlock").val("鎖車");    

  791.                 }

  792.             	show_item("status_lock");     

  793.     		}                                                                          

  794.     	}); 

  795.     	return false;

  796.     });

  797.             

  798.            

  799.     // ----- 鎖車或解鎖 -----

  800. 	$("#lock_unlock").click(function()

  801. 	{                   

  802.     	lock_str = $("#lock_unlock").val();

  803.                           

  804.     	if (!confirm("確定"+lock_str+"嗎 ?")) return false;

  805.             

  806.     	lock_val = lock_str == "解鎖" ? "0" : "1";

  807.         

  808.         // 查詢目前有無鎖車狀況

  809. 		$.ajax

  810.     	({                         

  811.         	url: "<?=APP_URL?>security_action/"+$("#lpr_lock").val()+"/"+md5($("#pswd_lock").val())+"/"+lock_val, 

  812.         	dataType:"json",

  813.         	type:"post",

  814.         	data:{},

  815.         	success:function(jdata)

  816.         	{           

  817.                 if (lock_val == "1")

  818.                 {

  819.                 	$("#lock_on_off").text("已");  

  820.                 	$("#lock_unlock").val("解鎖");  

  821.                 }                           

  822.                 else

  823.                 {

  824.                 	$("#lock_on_off").text("無"); 

  825.                 	$("#lock_unlock").val("鎖車");    

  826.                 }

  827.             	show_item("status_lock");     

  828.     		}                                                                          

  829.     	}); 

  830.     });     

  831.     

  832.     

  833.     // ----- 鎖車結東 -----

  834. 	$("#lock_back,#end_qcar").click(function()

  835. 	{                                  

  836.     	window.location.reload(true);        

  837.     });	

  838. 

  839. 	

  840. 	

  841. 	

  842. 	

  843. 	

  844. 	

  845. });

  846. </script>