| Server IP : 210.245.233.93 / Your IP : 216.73.216.226 Web Server : Apache/2.2.15 (CentOS) System : Linux webserver2.onesolution.com.hk 2.6.32-754.35.1.el6.x86_64 #1 SMP Sat Nov 7 12:42:14 UTC 2020 x86_64 User : apache ( 48) PHP Version : 5.3.3 Disable Function : exec, shell_exec, system, passthru, popen, proc_open, pcntl_exec MySQL : ON | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /var/www/hkosl.com/excland/view/ |
Upload File : |
<!DOCTYPE html>
<html lang="en-HK" prefix="og: http://ogp.me/ns#">
<head>
<title>EXCLAND - Payment</title>
<meta name="keywords" content="EXCLAND">
<meta property="og:description" content="EXCLAND" />
<!-- css -->
<?php include 'inc/headlinks.php'; ?>
<!-- js -->
<?php include 'inc/link-js.php'; ?>
</head>
<body class="blueTheme">
<!-- header -->
<div class="subPageNav">
<?php include 'inc/navbar_nologin.php'; ?>
</div>
<!-- end of header-->
<!-- breadcrumb -->
<div class="breadcrumbWrapper_nonscroll grayDeepBgColor">
<div class="container">
<a href="index.php" class="link"> 首頁</a> > <span>
購物車</span>
</div>
</div>
<div class="grayBgColor">
<div class="container">
<div class="progressbarWrap">
<ul id="progressbar">
<li class="active" id="account"><strong>我的購物車</strong></li>
<li class="active" id="personal"><strong>確認訂單資訊</strong></li>
<li id="confirm"><strong>成功提交訂單</strong></li>
</ul>
</div>
</div>
</div>
<section class="productBoxWrapper">
<div class="container">
<h4 class="mb-4">確認訂單資訊</h4>
<div class="row tabs">
<div class="col-lg-6 mb-2">
<p class="bold">送貨類型</p>
<ul class="shippingType d-flex mb-2 justify-content-center">
<li>
<label class="fullWidth">
<input class='hidden' type="radio" name="shippingType" value="shippingHome">
<div class="btn btn-borederIcon fullWidth shippingTypeBtn" title="送貨上門">
<i class="fas fa-shipping-fast bigger"></i>
<span class="big bold">送貨上門</span>
</div>
</label>
</li>
<li>
<label class="fullWidth">
<input class='hidden' type="radio" name="shippingType" value="shippingPoint">
<div class="btn btn-borederIcon fullWidth shippingTypeBtn" title="自取點">
<i class="fas fa-box-open bigger"></i>
<span class="big bold">自取點</span>
</div>
</label>
</li>
<li>
<label class="fullWidth">
<input class='hidden' type="radio" name="shippingType" value="shippingShop">
<div class="btn btn-borederIcon fullWidth shippingTypeBtn" title="門市自取">
<i class="fas fa-store-alt bigger"></i>
<span class="big bold">門市自取</span>
</div>
</label>
</li>
</ul> <!-- END tabs-nav -->
<div class="pay-contentShipWrap">
<div id="pay01" class="pay-content">
<div class="payWarp">
<div class="boxBorderWrap addressWrap">
<p class="bold">收貨地址</p>
<div class="addressList">
<div class="d-flex address">
<div class="form-check addressName">
<input class="form-check-input" type="radio" name="addressName"
id="addressName" value="option1">
<label class="form-check-label" for="addressName">Sky Cheng</label>
</div>
<p class="addressDetail">香港九龍觀塘成業街11號華成工商中心 11樓 16室</p>
<div class="d-flex">
<a href="javascript:void(0);" class="editAddressBtn" title="edit"
data-toggle="modal" data-target="#editAddress">
<i class="fas fa-pen"></i>
</a>
<a href="javascript:void(0);" class="deleteAddressBtn" title="delete">
<i class="fas fa-trash-alt"></i>
</a>
</div>
</div>
</div>
<hr>
<div class="addNewAddress">
<a href="javascript:void(0);" data-toggle="modal"
data-target="#newAddressModal"><i class="far fa-plus-square"></i> 使用新地址</a>
</div>
</div>
<div class="boxBorderWrap addressShippng">
<p class="bold">送貨方式</p>
<p>工商區使用順豐速遞。住宅區使用斑馬到家。</p>
</div>
</div>
</div>
<div id="pay02" class="pay-content">
<div class="payWarp">
<div class="boxBorderWrap comePack">
<p class="bold">送貨方式</p>
<a href="javascript:void(0)" class="btn btn-borederIcon comePackBtn" title="智能櫃">
<svg id="Group_684" class="mb-2" data-name="Group 684"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" width="53" height="35"
viewBox="0 0 53 34.269">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_1172" data-name="Rectangle 1172" width="53"
height="34.269" fill="none" />
</clipPath>
</defs>
<g id="Group_683" data-name="Group 683" clip-path="url(#clip-path)">
<path id="Path_790" data-name="Path 790"
d="M314.665.007c-10.7.029-13.556-.033-14.53.006a.69.69,0,0,0-.66.69V33.577a.69.69,0,0,0,.69.69h15.879a.69.69,0,0,0,.69-.69V2.076A2.072,2.072,0,0,0,314.665.007M302.927,23.135a.69.69,0,0,1-.69-.69V20.028a.69.69,0,1,1,1.381,0v.518h.863a.69.69,0,0,1,0,1.381h-.863v.518a.69.69,0,0,1-.69.69m8.8,8.716H304.48a.69.69,0,1,1,0-1.381h7.249a.69.69,0,1,1,0,1.381m.863-17.346h-9.061a.69.69,0,0,1,0-1.381h9.061a.69.69,0,0,1,0,1.381M303.7,9.5a.69.69,0,0,1,.69-.69h7.249a.69.69,0,1,1,0,1.381h-7.249a.69.69,0,0,1-.69-.69m8.975-3.624h-9.148a.69.69,0,0,1,0-1.381h9.148a.69.69,0,0,1,0,1.381"
transform="translate(-263.735 0.001)" />
<path id="Path_791" data-name="Path 791"
d="M164.928.007c-10.7.029-13.556-.033-14.53.006a.69.69,0,0,0-.66.69V33.577a.69.69,0,0,0,.69.69h15.879a.69.69,0,0,0,.69-.69V1.125c0-1.141-.929-1.118-2.069-1.118M153.19,23.135a.69.69,0,0,1-.69-.69V20.028a.69.69,0,1,1,1.381,0v.518h.863a.69.69,0,0,1,0,1.381h-.863v.518a.69.69,0,0,1-.69.69m8.8,8.716h-7.249a.69.69,0,1,1,0-1.381h7.249a.69.69,0,1,1,0,1.381m.863-17.346h-9.061a.69.69,0,0,1,0-1.381h9.061a.69.69,0,1,1,0,1.381M153.967,9.5a.69.69,0,0,1,.69-.69h7.249a.69.69,0,1,1,0,1.381h-7.249a.69.69,0,0,1-.69-.69m8.975-3.624h-9.148a.69.69,0,0,1,0-1.381h9.148a.69.69,0,0,1,0,1.381"
transform="translate(-131.868 0.001)" />
<path id="Path_792" data-name="Path 792"
d="M16.6.012c-.974-.04-3.815.025-14.53,0A2.072,2.072,0,0,0,0,2.077v31.5a.69.69,0,0,0,.69.69H16.569a.69.69,0,0,0,.69-.69V.7A.69.69,0,0,0,16.6.012ZM3.711,23.136a.69.69,0,0,1-.69-.69V20.029a.69.69,0,1,1,1.381,0v.518h.863a.69.69,0,1,1,0,1.381H4.4v.518a.69.69,0,0,1-.69.69m8.8,8.716H5.264a.69.69,0,1,1,0-1.381h7.249a.69.69,0,1,1,0,1.381m.863-17.346H4.315a.69.69,0,0,1,0-1.381h9.061a.69.69,0,0,1,0,1.381M4.488,9.5a.69.69,0,0,1,.69-.69h7.249a.69.69,0,1,1,0,1.381H5.178a.69.69,0,0,1-.69-.69m8.975-3.624H4.315a.69.69,0,0,1,0-1.381h9.148a.69.69,0,0,1,0,1.381"
transform="translate(0 0.001)" />
</g>
</svg>
<span>智能櫃<br>
(免運費)</span>
</a>
<a href="javascript:void(0)" class="btn btn-borederIcon comePackBtn" title="便利店自取">
<svg xmlns="http://www.w3.org/2000/svg" class="mb-2"
xmlns:xlink="http://www.w3.org/1999/xlink" width="35" height="35"
viewBox="0 0 35 35">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_1173" data-name="Rectangle 1173" width="35"
height="35" transform="translate(0 0)" fill="none" />
</clipPath>
</defs>
<g id="Group_684" data-name="Group 684" transform="translate(0 -0.088)">
<g id="Group_683" data-name="Group 683" transform="translate(0 0.088)"
clip-path="url(#clip-path)">
<path id="Path_790" data-name="Path 790"
d="M295.745,324.159h1.411a1.151,1.151,0,1,1,0,2.244h-1.411v6.432h7.523V319.671h-7.523Z"
transform="translate(-275.503 -297.835)" />
<path id="Path_791" data-name="Path 791"
d="M3.593,83.841a3.593,3.593,0,0,0,3.593-3.593v-.856l1.522-8.274H3.728L0,79.392v.856a3.593,3.593,0,0,0,3.593,3.593"
transform="translate(0 -66.294)" />
<path id="Path_792" data-name="Path 792"
d="M267.225,79.534a3.593,3.593,0,1,0,7.187,0l-1.755-9.182h-5.636Z"
transform="translate(-248.745 -65.581)" />
<path id="Path_793" data-name="Path 793"
d="M135,80.247a3.593,3.593,0,1,0,7.187,0v-.856l-.09-8.274-6.134.026L135,79.392Z"
transform="translate(-125.76 -66.294)" />
<path id="Path_794" data-name="Path 794"
d="M45.325,251.847a5.639,5.639,0,0,1-9.24,0,5.639,5.639,0,0,1-9.24,0A5.638,5.638,0,0,1,20,253.8v14.831a1.027,1.027,0,0,0,1.027,1.027H37.8V256.58a1.027,1.027,0,0,1,1.027-1.027h7.529a1.027,1.027,0,0,1,1.027,1.027v13.073h3.764a1.027,1.027,0,0,0,1.027-1.027V253.8a5.638,5.638,0,0,1-6.844-1.949ZM35.058,262.74a1.027,1.027,0,0,1-1.027,1.027H25.818a1.027,1.027,0,0,1-1.027-1.027v-6.16a1.027,1.027,0,0,1,1.027-1.027h8.213a1.027,1.027,0,0,1,1.027,1.027Z"
transform="translate(-18.631 -234.653)" />
<path id="Path_795" data-name="Path 795"
d="M382.781,78.678v.856a3.593,3.593,0,1,0,7.187,0v-.856l-3.562-8.326h-5.258Z"
transform="translate(-355.06 -65.581)" />
<path id="Path_796" data-name="Path 796"
d="M82.378,1.027A1.027,1.027,0,0,0,81.351,0H56.027A1.027,1.027,0,0,0,55,1.027V3.9H82.378Z"
transform="translate(-51.236 -0.044)" />
</g>
</g>
</svg>
<span>便利店自取<br>
(免運費)</span>
</a>
<a href="javascript:void(0)" class="btn btn-borederIcon comePackBtn" title="順豐服務中心">
<svg id="Group_686" data-name="Group 686" class="mb-2"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" width="31" height="34"
viewBox="0 0 31 31">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_1174" data-name="Rectangle 1174" width="31"
height="31" fill="none" />
</clipPath>
</defs>
<g id="Group_685" data-name="Group 685" clip-path="url(#clip-path)">
<path id="Path_797" data-name="Path 797"
d="M73.5,5.692a16.426,16.426,0,0,1,16.449,0l2.9-2.288A19.89,19.89,0,0,0,70.6,3.4Z"
transform="translate(-66.223 0)" fill="#231815" />
<path id="Path_798" data-name="Path 798"
d="M73.6,408.3a16.438,16.438,0,0,0,16.455,0l2.9,2.288a19.905,19.905,0,0,1-22.246,0Z"
transform="translate(-66.317 -382.985)" fill="#231815" />
<path id="Path_799" data-name="Path 799"
d="M408.3,73.7a16.438,16.438,0,0,1,0,16.455l2.288,2.9a19.916,19.916,0,0,0,0-22.252Z"
transform="translate(-382.985 -66.41)" fill="#231815" />
<path id="Path_800" data-name="Path 800"
d="M5.692,73.7a16.438,16.438,0,0,0,0,16.455L3.4,93.052A19.9,19.9,0,0,1,3.4,70.8Z"
transform="translate(0 -66.41)" fill="#231815" />
<path id="Path_801" data-name="Path 801"
d="M110.217,141.061v2.629a4.682,4.682,0,0,0-3.261-1.209c-2.12,0-2.04,1.209-2.04,1.327,0,.347-.161.806,2.207,1.934,2.424,1.159,3.658,2.672,3.658,4.532a3.93,3.93,0,0,1-4.259,4.067,6.342,6.342,0,0,1-4.216-1.364v-3.038a5.014,5.014,0,0,0,3.956,1.99c1.978,0,1.885-1.569,1.885-1.773a1.977,1.977,0,0,0-1.19-1.649c-1.06-.521-3.249-1.5-3.906-2.412a3.5,3.5,0,0,1-.75-2.269c0-1.327,1.035-3.726,4.538-3.726a5.083,5.083,0,0,1,3.379.961"
transform="translate(-95.957 -131.414)" fill="#231815" />
<path id="Path_802" data-name="Path 802"
d="M267.481,139.5a15.067,15.067,0,0,0-4.681.961v13.373h2.66V142.352a5,5,0,0,1,2.189-.378,5.78,5.78,0,0,1,3.652,1.1v-2.616a7.116,7.116,0,0,0-3.819-.961"
transform="translate(-246.506 -130.851)" fill="#231815" />
<path id="Path_803" data-name="Path 803"
d="M330.423,229.662A1.662,1.662,0,1,1,328.762,228a1.662,1.662,0,0,1,1.662,1.662"
transform="translate(-306.82 -213.864)" fill="#e60012" />
</g>
</svg>
<span>順豐服務中心<br>
(免運費)</span>
</a>
</div>
<div class="boxBorderWrap comePackAddress">
<p class="bold">收貨地址</p>
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="name">收貨人姓名</label>
<input type="text" class="form-control" id="name" placeholder="">
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label for="phone">聯絡電話</label>
<input type="text" class="form-control" id="phone" placeholder="">
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label for="title">城市</label>
<select name="Size" class="custom-select form-control fullWidth">
<option selected value="1">請選擇</option>
<option value="2">HONG KONG</option>
<option value="3">KOWLOON</option>
</select>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label for="title">地區</label>
<select name="Size" class="custom-select form-control fullWidth">
<option selected value="1">請選擇</option>
<option value="2">HONG KONG</option>
<option value="3">KOWLOON</option>
</select>
</div>
</div>
<div class="col-lg-12 shippingContent">
<div class="form-check mb-2">
<input class="form-check-input" type="radio" name="shippingAddress"
id="address01" value="option1">
<label class="form-check-label" for="address01">
灣仔軒尼詩道298號298電腦特區二樓351號舖順便智能櫃(順便智能櫃)
<span class="grayFont tooltipBtn" data-toggle="tooltip"
data-placement="top" title="10：00 - 20：00"><i
class="fas fa-info-circle"></i></span>
</label>
</div>
<div class="form-check mb-2">
<input class="form-check-input" type="radio" name="shippingAddress"
id="address02" value="option1">
<label class="form-check-label" for="address02">
灣仔灣仔道125號國泰88一樓F18舖順便智能櫃(順便智能櫃)
<span class="grayFont tooltipBtn" data-toggle="tooltip"
data-placement="top" title="10：00 - 20：00"><i
class="fas fa-info-circle"></i></span>
</label>
</div>
<div class="form-check mb-2">
<input class="form-check-input" type="radio" name="shippingAddress"
id="address03" value="option1">
<label class="form-check-label" for="address03">
灣仔交加里7號永成大廈地下7B舖(自洗王國)順便智能櫃 順便智能櫃
<span class="grayFont tooltipBtn" data-toggle="tooltip"
data-placement="top" title="10：00 - 20：00"><i
class="fas fa-info-circle"></i></span>
</label>
</div>
<div class="form-check mb-2">
<input class="form-check-input" type="radio" name="shippingAddress"
id="address04" value="option1">
<label class="form-check-label" for="address04">
灣仔謝斐道151號金聲大廈地下(LaundrYup洗衣店)順便智能櫃
<span class="grayFont tooltipBtn" data-toggle="tooltip"
data-placement="top" title="10：00 - 20：00"><i
class="fas fa-info-circle"></i></span>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="shippingAddress"
id="address05" value="option1">
<label class="form-check-label" for="address05">
銅鑼灣百德新街2-20號恒隆中心地庫順便智能櫃(停車場出入口)
<span class="grayFont tooltipBtn" data-toggle="tooltip"
data-placement="top" title="10：00 - 20：00"><i
class="fas fa-info-circle"></i></span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="pay03" class="pay-content">
<div class="payWarp">
<div class="boxBorderWrap packShop">
<p class="bold">送貨方式</p>
<a href="#"
class="btn btn-borederIcon active d-flex text-left d-block align-items-center"
title="價錢高至低">
<div class="minWith">
<i class="fas fa-store-alt bigger"></i>
</div>
<span>香港總店<br>
<b> 旺角西洋菜南街1N號兆萬中心4樓407號舖</b></span>
</a>
</div>
</div>
</div>
<div class="boxBorderWrap paymentWay">
<p class="bold"></p>
<div class="form-check">
<input class="form-check-input" type="radio" name="payment" id="paypal" value="paypal"
checked>
<label class="form-check-label p-2" for="paypal">
<img src="../assets/images/paypal.png" class="img-fluid" alt="paypal"
title="paypal">
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="payment" id="payme" value="payme">
<label class="form-check-label p-2" for="payme">
<img src="../assets/images/payme.png" class="img-fluid" alt="payme" title="payme">
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="payment" id="fps" value="fps">
<label class="form-check-label p-2" for="fps">
<img src="../assets/images/payment01.jpg" class="img-fluid" alt="fps" title="fps"
style="width:100px">
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="payment" id="atm" value="atm">
<label class="form-check-label p-2" for="atm">
<img src="../assets/images/atm.svg" class="img-fluid" alt="atm" title="atm">
</label>
</div>
<div class="atmDes mt-2">
<p>銀行名稱: 香港上海滙豐銀行 (香港)<br>
銀行帳號: 170-5-039889 (PANG CHUN WAI)</p>
<p>銀行名稱: 恒生銀行 (香港)<br>
銀行帳號: 357-566546-882 (LAW YU HO)</p>
<p>銀行名稱: 香港上海滙豐銀行 (香港)<br>
銀行帳號: 170-5-039889 (PANG CHUN WAI)</p>
<p>銀行名稱: 中國銀行 (香港）<br>
銀行帳號: 012-872-1-086406-0 (PANG CHUN WAI)</p>
<p>銀行名稱: 中國銀行 (香港）<br>
銀行帳號: 012-872-1-086406-0 (PANG CHUN WAI)</p>
<p>付款後請電郵/Whatsapp <span class="redFont">“訂單編號 “</span>及<span
class="redFont">”入數紙”</span>給我們
(入數紙需清楚顯示金額,過數日期及時間等資料)
如未能提供足夠資料，本店<span class="redFont">不會</span>受理有關訂單，我們確認收款後，會盡快安排出貨。</p>
</div>
</div>
</div>
<!-- <div class="shippingType d-flex mb-4">
<a href="#" class="btn btn-borederIcon" title="價錢高至低">
<i>
<img src="../assets/images/caricon.svg" class="img-fluid">
</i>
<span class="big bold">送貨上門</span>
</a>
<a href="#" class="btn btn-borederIcon" title="價錢高至低">
<i>
<img src="../assets/images/packicon.svg" class="img-fluid">
</i>
<span class="big bold">自取點</span>
</a>
<a href="#" class="btn btn-borederIcon" title="價錢高至低">
<i>
<img src="../assets/images/shopicon.svg" class="img-fluid">
</i>
<span class="big bold">門市自取</span>
</a>
</div> -->
</div>
<div class="col-lg-6 mb-2">
<div class="boxBorderWrap">
<p class="mb-4 bold">產品清單</p>
<div class="d-flex listItem">
<div class="listImg p-2">
<img src="../assets/images/product/pic01.jpg" class="img-fluid" alt="" title="">
</div>
<div class="d-flex flex-md-row flex-column p-2">
<div class="listDetail">
<p class="mb-0"> Häagen-Dazs™ - 九星‧華月-雪糕月餅券(最後換領日期: 21/09/2021)</p>
<small>優惠:+$35換購維他命C粉</small>
</div>
<p class="listPrice">HK$488.00</p>
</div>
</div>
<div class="d-flex listItem">
<div class="listImg p-2">
<img src="../assets/images/product/pic01.jpg" class="img-fluid" alt="" title="">
</div>
<div class="d-flex flex-md-row flex-column p-2">
<div class="listDetail">
<p class="mb-0"> Häagen-Dazs™ - 九星‧華月-雪糕月餅券(最後換領日期: 21/09/2021)</p>
<small>優惠:+$35換購維他命C粉</small>
</div>
<p class="listPrice">HK$488.00</p>
</div>
</div>
<div class="d-flex listItem">
<div class="listImg p-2">
<img src="../assets/images/product/pic01.jpg" class="img-fluid" alt="" title="">
</div>
<div class="d-flex flex-md-row flex-column p-2">
<div class="listDetail">
<p class="mb-0"> Häagen-Dazs™ - 九星‧華月-雪糕月餅券(最後換領日期: 21/09/2021)</p>
<small>(此產品不包免運費或折扣優惠)</small>
</div>
<p class="listPrice">HK$488.00</p>
</div>
</div>
<div class="discountInputWrap grayBgColor">
<div class="d-flex">
<input type="text" class="form-control mr-2" placeholder="">
<button type="button" class="btnSmall btn-outline-primary white-space">使用積分</button>
</div>
<small class="mb-4 d-block">您有 310 積分，最多可以使用 23800 積分</small>
<div class="d-flex">
<input type="text" class="form-control mr-2" placeholder="">
<button type="button" class="btnSmall btn-outline-primary white-space">使用優惠碼</button>
</div>
</div>
<hr>
<p class="d-flex smallTotal mb-0 justify-content-between"><span>總價：</span><span>HK$
1109.00</span> </p>
<p class="d-flex smallTotal mb-0 justify-content-between"><span> 運費：</span><span>HK$
30.00</span></p>
<p class="d-flex smallTotal mb-0 justify-content-between"> <span>積分優惠：</span><span>-HK$
0.00</span></p>
<p class="d-flex smallTotal mb-0 justify-content-between"> <span>折扣優惠：</span><span>-HK$
0.00</span></p>
<div class="d-flex totalPrice justify-content-between mb-4">
<div>
<h4>總計:</h4>
</div>
<div class="text-right">
<h4 class="redFont">HK$1488.00</h4>
<small>(已包含運費)<br>
購物滿 20元獲得1分, 之後每1分可當1蚊使用</small>
</div>
</div>
<div class="messageWrap">
<div class="form-group">
<label for="message">客戶備註</label>
<textarea class="form-control" id="message" rows="3"></textarea>
</div>
</div>
<button type="button" class="btnBig btn-primary fullWidth"
onclick="location.href='success_pay.php';"> 前往付款 ></button>
</div>
</div>
</div>
</div>
</section>
<!-- end #section -->
<!-- footer -->
<?php include 'inc/footer.php'; ?>
<div class="modal fade" id="editAddress" tabindex="-1" role="dialog" aria-labelledby="editAddress"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">更改收貨地址</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<input type="hidden" class="form-control" id="editID" value="" placeholder="">
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="editName">名稱</label>
<input type="text" class="form-control" id="editName" value="Sky Cheng" placeholder="">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="oldAddress">收貨地址</label>
<textarea class="form-control" id="oldAddress" rows="3"></textarea>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary saveEditBtn">儲存</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="newAddressModal" tabindex="-1" role="dialog" aria-labelledby="newAddress"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">地址</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="newName">收貨人名稱</label>
<input type="text" class="form-control" id="newName" value="" placeholder="">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="newAddress">收貨地址</label>
<textarea class="form-control" id="newAddress" rows="3" autocomplete="nope"></textarea>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary saveAddressBtn">儲存</button>
</div>
</div>
</div>
</div>
<link href="../assets/css/bootstrap-table.min.css" rel="stylesheet">
<!-- <script src="../assets/js/tableExport.min.js"></script> -->
<script src="../assets/js/bootstrap-table.min.js"></script>
<script src="../assets/js/bootstrap-table-locale-all.min.js"></script>
<script src="../assets/js/bootstrap-table-export.min.js"> </script>
<!-- custom JS-->
<script>
var $table = $("#table"),
$remove = $("#remove"),
selections = [];
let addressCount = 1;
$(document).on("click", ".editAddressBtn", function() {
let rowAddressName = $(this).parent().parent().find(".addressName label").text();
let rowAddress = $(this).parent().parent().find(".addressDetail").text();
$("#editName").val(rowAddressName);
$("#oldAddress").val(rowAddress);
let dataId = $(this).data("id");
$("#editID").val(dataId);
});
$(document).on("click", ".deleteAddressBtn", function() {
let editAddressName = $("#editName").val();
let editAddress = $("#oldAddress").val();
$(this).parent().parent().remove();
addressCount--;
});
$(document).on("click", ".saveEditBtn", function() {
const edit_id = $("#editID").val();
const editName = $("#editNAme").val();
const editAdress = $("#oldAddress").val();
$(`#address_${edit_id} .addressName label`).text(editName);
$(`#address_${edit_id} .addressDetail `).text(editAdress);
$('#editAddress').modal('hide');
});
$(document).on("click", ".saveAddressBtn", function() {
let newAddressName = $("#newName").val();
let newAddress = $("#newAddress").val();
addressCount++;
$(".addressList").append(`<div class="d-flex address" id="address_${addressCount}">
<div class="form-check addressName">
<input class="form-check-input" type="radio" name="addressName"
id="addressName" value="option1">
<label class="form-check-label" for="addressName">${newAddressName}</label>
</div>
<p class="addressDetail">${newAddress}</p>
<div class="d-flex">
<a href="javascript:void(0);" class="editAddressBtn" title="edit"
data-toggle="modal" data-target="#editAddress" data-id="${addressCount}">
<i class="fas fa-pen"></i>
</a>
<a href="javascript:void(0);" class="deleteAddressBtn" title="delete">
<i class="fas fa-trash-alt"></i>
</a>
</div>
</div>`);
$("#newName").val("");
$("#newAddress").val("");
$('#newAddressModal').modal('hide');
});
$(function() {
$table.bootstrapTable("destroy");
$table.bootstrapTable({
columns: [
[{
field: "state",
align: "center",
valign: "middle"
},
{
title: "圖片",
field: "圖片",
align: "center",
sortable: true,
valign: "middle"
},
{
title: "品名",
field: "品名",
valign: "top",
width: "400px",
valign: "middle"
},
{
title: "型號",
field: "型號",
align: "center",
sortable: true,
valign: "middle"
},
{
title: "數量",
field: "數量",
sortable: true,
align: "center",
valign: "middle",
width: "100px"
},
{
title: "單價",
field: "單價",
sortable: true,
align: "center",
valign: "middle"
},
{
title: "總計 ",
field: "總計 ",
sortable: true,
valign: "middle"
}
// {
// title: "Action",
// field: "action",
// align: "center",
// sortable: true,
// valign: "top",
// events: actionEvents,
// formatter: actionFormatter
// }
]
],
classes: "table table-hover table-no-bordered",
sortClass: undefined, //被排序的TD元素的類名
undefinedText: "-", //當數據為undefined時顯示的字符
striped: false, //設置為true會有隔行變色效果
sortName: "number", //定義排序列，通過URL方式獲取數據填寫字段名，否則填寫下標
sortOrder: "desc", //定義排序方式，'asc'或者'desc'
sortStable: false, //設置為true將獲得穩定的排序，並添加position屬性到行數據中
sortable: false, //設置為false將禁止所有列的排序
pagination: true, //設置為true會在表格底部顯示分頁條
paginationLoop: false, //設置為true啟用分頁條無限循環的功能
onlyInfoPagination: false, //設置為true只顯示總數據，而不顯示分頁按鈕。需要設置pagination ='true'
pageNumber: 1, //設置分頁首頁頁碼
pageSize: 5, //設置分頁頁面數據條數
pageList: [1, 3, 5, 10, "ALL"], //設置分頁可供選擇的頁面數據條數。設置為All或者Unlimited，則顯示所有記錄
});
$table.on(
"check.bs.table uncheck.bs.table " +
"check-all.bs.table uncheck-all.bs.table",
function() {
$remove.prop("disabled", !$table.bootstrapTable("getSelections").length);
selections = getIdSelections();
}
);
$remove.click(function() {
var ids = getIdSelections();
$table.bootstrapTable("remove", {
field: "id",
values: ids
});
$remove.prop("disabled", true);
});
$('[data-toggle="dropdown"] >i')
.removeClass("glyphicon-export")
.addClass("fa-download");
});
function getIdSelections() {
return $.map($table.bootstrapTable("getSelections"), function(row) {
return row.id;
});
}
function actionFormatter(value, row, index) {
return ['<button class="remove btn btn-danger btn-sm">Delete</button>'].join(
""
);
}
window.actionEvents = {
"click .remove": function(e, value, row, index) {
$table.bootstrapTable("remove", {
field: "id",
values: [row.id]
});
}
};
var trBoldBlue = $("table");
$(trBoldBlue).on("click", "tr", function() {
$(this).toggleClass("bold-blue");
});
</script>
</body>
</html>