<!DOCTYPE html>
<script>
    var isenquiry = false;
    var paymentdetails;
</script>
<html>
<head>
  <meta charset="utf-8">
  <title>Payment Detail</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <script type="text/javascript" src="js/lib/aes.js"></script>
  <script type="text/javascript" src="js/lib/pbkdf2.js"></script>
  <script type="text/javascript" charset="UTF-8" src="Commondata.js"></script>
  <script type="text/javascript" charset="UTF-8" src="VehicleDetCommonData.js"></script>
  <script type="text/javascript" charset="UTF-8" src="Apiservice.js"></script>
  <link rel="stylesheet" type="text/css" href="fonts/stylesheet.css">
  <link rel="stylesheet" type="text/css" href="css/normalize.css">
  <link rel="stylesheet" type="text/css" href="css/framework.css">
  <link rel="stylesheet" type="text/css" href="css/axa.min.css">
  <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
  <script type="text/javascript" src="js/index.js"></script>
  <script type="text/javascript" charset="UTF-8" src="js/axa-popup.js"></script>
  <script src="js/webfont.js"></script>
  <script>
    WebFont.load({
      google: {
        families: ["Montserrat:400,700"]
      }
    });
  </script>
  <script type ="text/javascript">
  //window onload
    window.onload = function what()
    {
      paiddetails();
      var userAgentResponse =  getItem("userlist");
      var userAgentResponseList=JSON.parse(userAgentResponse);
      if(userAgentResponseList.length<=1){
        document.getElementById('switchuserclass').style.display = 'none';
      }
      /* Motor and Non Motor Diff */
      motorhealthdiff();
      /* Motor and Non Motor Diff */
        var statusid = getItem("policytype");
        if (statusid > 10) {
            statusid = statusid % 10;
            isenquiry = true;
        }
        else {
            isenquiry = false;
        }
      };
      //online payment success redirect to payment-details
      function paiddetails() {
        var renewaldetails = JSON.parse(getItem("renewaldetails"));
        var policy_no = renewaldetails.policyno;
        var request = {
          policyno : policy_no,
          agentid : getItem("agentcode") ,
          renwalpolicyid:getItem("renwalpolicyid")
        };
        Apiservicecall(function(result) {
          if (result.status == 1) {
            paymentdetails = result.response.data;
                        console.log("======****=======" + JSON.stringify(paymentdetails));
                        document.getElementById('receiptNo').innerHTML =paymentdetails.receiptNo;
                        document.getElementById('paymentRefNo').innerHTML =paymentdetails.paymentRefNo;
                        document.getElementById('policyno').innerHTML = paymentdetails.contracttype + "/" +paymentdetails.policyno;
                        if(paymentdetails.amount!=null&&paymentdetails.amount!=0)
                        {
                          if(paymentdetails.paymenttype == "N"){
                           document.getElementById('amountTxt').innerHTML ="Amount (Nett)";
                           document.getElementById('amount').innerHTML ="RM" +currencyformat(paymentdetails.amount,"");
                           }
                           else
                           document.getElementById('amount').innerHTML ="RM" +currencyformat(paymentdetails.amount,"");
                        }
                        document.getElementById('dateTime').innerHTML =paymentdetails.dateTime;
                        document.getElementById('policyholdername').innerHTML =paymentdetails.policyholdername;
                        document.getElementById('agentid').innerHTML =paymentdetails.agentid;
                        document.getElementById('branchcode').innerHTML = paymentdetails.branchcode;
                        document.getElementById('productname').innerHTML = paymentdetails.productname;
                        document.getElementById('paymentmode').innerHTML = paymentdetails.paymentmode;
            } else {
              showAlert(response.message, false);
            }

        }, paid_details, request);
      }
      function socialShare()
      {
        // var paymentdetails=JSON.parse(getItem("paymentref"));
	      var datetime = paymentdetails.dateTime.split(' ');
        var createddate=paymentdetails.receiptNo+"_"+paymentdetails.contracttype+"_"+paymentdetails.policyno+"_"+datetime[0].replace(/\//g,"")
        var receiptstream=paymentdetails.receiptstream;
        var DefaultString = "data:application/pdf;base64,";
        receiptstream = DefaultString.concat(receiptstream);
        if(checkOnline())
        {
            var message = "";
            var subject = "";
            var options = {
              message: message ,
              subject: createddate,
              files: [receiptstream],
              url: "",
            };
            var onSuccess = function(result) {
              console.log("Share completed? " + result.completed);
              console.log("Shared to app: " + result.app);
            };
            var onError = function(msg) {
              console.log("Sharing failed with message: " + msg);
            };
            window.plugins.socialsharing.shareWithOptions(options, onSuccess, onError);
        }
      }
      //redirect to back page
      function clickok()
      {
        if(checkOnline()){
          if (isenquiry) {
              window.location.href = 'Enquiry-detail.html';
          }
          else {
              window.location.href = 'Renewal-info.html';
          }
        }
      }

      function exitAlert() {
        if(checkOnline()){
          $('#showpop').empty();
          $('#showpop').append("<h5>Message</h5><p>Are you sure want to logout?</p><button class='popup-btn' onclick='logout()'>OK</button><button class='popup-btn' onclick=hide('showpop')>CANCEL</button>");
          show('showpop');
        }
      }
      //backbutton function
      document.addEventListener("backbutton", onBackKeyDown, false);
      function onBackKeyDown() {
        clickok();
      }
      //common popup
      function showAlert(message) {
        $('#showpop').empty();
        $('#showpop').append("<h5>Message</h5><p id='para_messageid'>"+message+"</p><button class='popup-btn' id='comm-dismiss' onclick=hide('showpop')>OK</button>");
        show('showpop');
      }
  </script>
  <script type="text/javascript" src="js/modernizr.js"></script>
  <link rel="shortcut icon" type="image/x-icon" href="images/logoStandford32.ico">
  <link rel="apple-touch-icon" href="images/logoStandford32.ico">
  <link href="css/ionicons.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
  <section class="axa-section mobile-wrapper">
    <div class="page-content" id="main-stack">
      <div class="axa-nav navbar" data-collapse="all" data-animation="over-left" data-duration="400" data-contain="1" data-easing="ease-out-quint" data-no-scroll="1">
        <div class="axa-container Pay-detail">
          <nav class="axa-nav-menu nav-menu" role="navigation">
              <a class="nav-menu-header" id="navi_welcomepage" onclick = "redirectionpage('dashboard.html');">
                  <div class="logo"><img alt="navLogo_icon_img" src="images/nav-logo.svg"></div>
              </a>
              <div id="health_div_header">
                <a class="axa-clearfix axa-inline-block nav-menu-link">
                  <div class="icon-list-menu">
                    <div class="icon ion-ios-pulse"></div>
                  </div>
                  <div class="nav-menu-titles">Health</div>
                </a>
                <a class="axa-clearfix axa-inline-block nav-menu-link1" id="navi_renewalinfo" onclick = "redirectionpage('welcome.html');">
                  <div class="sub-icon-list-menu">
                    <div class="icon ion-clipboard"></div>
                  </div>
                  <div class="nav-menu-titles">Renewal Info</div>
                </a>
                <a class="axa-clearfix axa-inline-block nav-menu-link1" onclick = "redirectionpage('Enquiry.html');">
                  <div class="sub-icon-list-menu">
                      <div class="icon ion-ios-help-outline"></div>
                  </div>
                  <div class="nav-menu-titles">Enquiry</div>
                </a>
              </div>
              <div id="motor_div_header">
                <a class="axa-clearfix axa-inline-block nav-menu-link">
                  <div class="icon-list-menu">
                    <div class="icon ion-android-car"></div>
                  </div>
                  <div class="nav-menu-titles">Motor</div>
                </a>
                <a class="axa-clearfix axa-inline-block nav-menu-link1" id="navi_vehicledet" onclick = "redirectionpage('vehicle-details.html');">
                  <div class="sub-icon-list-menu">
                    <div class="icon ion-ios-calculator-outline"></div>
                  </div>
                  <div class="nav-menu-titles">New Quote</div>
                </a>
                <a class="axa-clearfix axa-inline-block nav-menu-link1" id="navi_retrivequote" onclick = "redirectionpage('retrieve-quote.html');">
                  <div class="sub-icon-list-menu">
                    <div class="icon ion-document"></div>
                  </div>
                  <div class="nav-menu-titles">Retrieve Quote</div>
                </a>
                </div>
                <a class="axa-clearfix axa-inline-block nav-menu-link" id="navi_agenttools" onclick = "redirectionpage('Contact-us.html');">
                  <div class="icon-list-menu">
                    <div class="icon ion-ios-telephone-outline"></div>
                  </div>
                  <div class="nav-menu-titles">Agent Tools</div>
                </a>
                <a class="axa-clearfix axa-inline-block nav-menu-link" id="switchuserclass" onclick="switchuser()">
                  <div class="icon-list-menu">
                    <div class="icon ion-ios-personadd-outline"></div>
                  </div>
                  <div class="nav-menu-titles">Switch Agent</div>
                </a>
                <a class="axa-clearfix axa-inline-block nav-menu-link" id="nav_logoutid" onclick="exitAlert()">
                  <div class="icon-list-menu">
                    <div class="icon ion-log-out"></div>
                  </div>
                  <div class="nav-menu-titles">Logout</div>
                </a>
              <div class="separator-bottom"></div>
              <div class="separator-bottom"></div>
              <div class="separator-bottom"></div>
          </nav>
          <div class="wrapper-mask" data-ix="menu-mask"></div>
          <div class="left-back" id="menu-button" data-ix="hide-navbar-icons" onclick="clickok();">
						<a id = "btn_paymentdetails" onclick="clickok();" class=" back-icon">
							<div class="left-arrow"><img alt="left_icon_img" class="left-icon" src="images/left-arrow.svg"></div>
						</a>
					</div>
          <div class="navbar-title-Pay" id="navbartitle">Payment Details</div>
          <div class="home-menuicon">
           <a id="icon_home" onclick = "redirectionpage('dashboard.html');"><img alt="navhome_icon_img" class="hmeicon" src="images/home1.svg" /></a>
           <div class="axa-nav-button navbar-button left" id="menu-button" data-ix="hide-navbar-icons">
               <div class="navbar-button-icon home-icon">
                   <div class="bar-home-icon"></div>
                   <div class="bar-home-icon"></div>
                   <div class="bar-home-icon"></div>
               </div>
           </div>
          </div>
        </div>
      </div>
        <div class="axa-wrapper">
        <div class="axa-col-12 axa-pay-det">
        <div class="row">
         <div class="axa-col-12 text-centered logo-pd">
          <div><img alt="navLogo_icon_img" src="images/nav-logo.svg" class="img-head"></div>
         </div>
         <div class="axa-col-12">
         <div class="tp-brd"></div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Receipt No.</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="receiptNo">-</label>
         </div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Payment Reference No.</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="paymentRefNo">-</label>
         </div>
         <br>
         <div class="btm-brd"></div>
            <div class="axa-col-12 payment-title no-padding"><h5 id="productname">Smartcare</h5></div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Policy No.</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="policyno">-</label>
         </div>
         <div class="pay-det-sec1">
          <label class="axa-col-6 no-padding axa-wb" id="amountTxt">Amount</label>
           <label class="axa-col-1 no-padding">:</label>
            <label class="axa-col-5 no-padding axa-wb" id="amount">0</label>
          </div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Payment Date</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="dateTime">-</label>
         </div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Policyholder</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="policyholdername">-</label>
         </div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Agent Code</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="agentid">-</label>
         </div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Branch Code</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="branchcode">-</label>
         </div>
         <div class="pay-det-sec1">
         <label class="axa-col-6 no-padding axa-wb">Payment Mode</label>
          <label class="axa-col-1 no-padding">:</label>
           <label class="axa-col-5 no-padding axa-wb" id="paymentmode">-</label>
         </div>
         <div class="btm-brd"></div>
         </div>
         <div class="axa-col-12 mg-tp text-centered">
        <div class="cus-pay-sec" onclick="socialShare();">
           <span class="cus-pay-img cus-pay-link-tp"><a href="#"><img alt="shareLogo_icon_img" src="images/share.svg" class="pay-img"></a></span>
           <span id="span_shareqr" class="cus-pay-link-btm">Share</span>
        </div>
        </div>
       </div>
        </div>
        </div>
      </div>
    </div>
    <div class="page-content loading-mask" id="new-stack">
      <div class="loading-icon">
        <div class="navbar-button-icon icon ion-load-d"></div>
      </div>
    </div>
    <div class="shadow-layer"></div>
    <div id="showpop" class="popup"></div>
    <div id="showpop1" class="popup"></div>
  </section>
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script type="text/javascript" src="js/framework.js"></script>
</body>
</html>
