<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>AdminKW | Mobile</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.5 -->
  <link rel="stylesheet" href="adminlte/bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="adminlte/dist/css/AdminLTE.min.css">
  <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
  <link rel="stylesheet" href="adminlte/dist/css/skins/_all-skins.min.css">

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body class="hold-transition skin-blue sidebar-mini">
  <!-- Modal Stock In -->
  <div id="mdlRenewCustomerCard" class="modal fade" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title">Karat Card Transactions</h4>
        </div>
        <!-- form start -->
        <form id="frmRenewCustomerCard">
          <div class="modal-body">
            <div class="row">
              <div class="col-lg-12">
                <h3>Customer Information</h3>
                <p>For new customer, go to Transaction Menu and select Karat Card Transaction</p>
              </div>
            </div>
            <div class="form-group">
              <div class="col-lg-2 col-xs-12">
                <label>ID</label>
                <input type="text" class="form-control" id="txtCustomerID" name="txtCustomerID" disabled>
                <input type="hidden" id="txtTransID" name="txtTransID">
              </div>
              <div class="col-lg-5 col-xs-12">
                <label>Name</i></label>
                <input type="text" class="form-control" id="txtLastName" name="txtLastName" disabled>
              </div>
              <div class="col-lg-5 col-xs-12">
                <label>&nbsp;</label>
                <input type="text" class="form-control" id="txtFirstName" name="txtFirstName" disabled>
              </div>
            </div>
            <div class="row">
              <div class="col-lg-12">
                <h3>Karat Card Information for Branch <?php echo $this->session->user["branch"]; ?></h3>
              </div>
            </div>
            <div class="form-group">
              <div class="col-lg-6 col-xs-12">
                <label>Karat Card Number</label>
                <input type="text" class="form-control" id="txtCardNo" name="txtCardNo" disabled>
                <input type="hidden" id="hdBranch" name="hdBranch" value="<?php echo $this->session->user["branch"]; ?>">
              </div>
              <div class="col-lg-6 col-xs-12">
                <label>Invoice Number</label>
                <input type="text" class="form-control" id="txtInvoiceNo" name="txtInvoiceNo">
              </div>
            </div>
            <div class="form-group">
              <div class="col-lg-6 col-xs-12">
                <label>Purchase Date</label>
                <input id="dtPurchaseDate" name="dtPurchaseDate" type="text" class="form-control datepicker" data-inputmask="'alias': 'mm/dd/yyyy'" data-mask>
              </div>
              <div class="col-lg-6 col-xs-12">
                <label>Expiry Date</label>
                <input id="dtExpiry" name="dtExpiry" type="text" class="form-control datepicker" data-inputmask="'alias': 'mm/dd/yyyy'" data-mask>
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-primary">Save changes</button>
          </div>
        </form>
      </div>
      <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
  </div>
  <!-- /.modal -->
  <!-- Site wrapper -->
  <div class="wrapper">

    <header class="main-header">
      <!-- Logo -->
      <a href="<?php site_url(); ?>" class="logo">
        <!-- mini logo for sidebar mini 50x50 pixels -->
        <span class="logo-mini"><b>A</b>KW</span>
        <!-- logo for regular state and mobile devices -->
        <span class="logo-lg"><b><?php echo $this->session->user["branch"]; ?></b>&nbsp;Branch</span>
      </a>

      <?php $this->load->view('pages/topnav'); ?>

    </header>

    <!-- Left navigation -->
    <?php $this->load->view('pages/leftnav'); ?>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
      <!-- Content Header (Page header) -->
      <section class="content-header">
        <h1>
          Dashboard
          <small>it all starts here</small>
        </h1>
      </section>

      <!-- Main content -->
      <section class="content">

        <!-- Default box for Recent Update -->
        <div class="box">
          <div class="box-header with-border">
            <h3 class="box-title">Recent Update</h3>
            <div class="box-tools pull-right">
              <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
              <button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
            </div>
          </div>
          <div class="box-body">
            <ul>
              <li>[2022-10-03] Added Item Movement menu so transaction of specific item can be traced.</li>
              <li>[2022-08-22] Fixed Sales Maintenance wherein qty changed to zero when updating.</li>
              <li>[2022-08-20] Disabled on-wheel change of value on Qty to avoid having 0 quantity.</li>
              <li>[2022-08-10] Removed SYSTEM DEVELOPMENT STAGE and transfer to MAIN NAVIGATION menu above.</li>
            </ul>
          </div><!-- /.box-body -->
        </div><!-- /.box -->

        <!-- Default box for Item Store Inquiry -->
        <div class="box">
          <div class="box-header with-border">
            <h3 class="box-title">Store Item Inquiry</h3>
            <div class="box-tools pull-right">
              <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
            </div>
          </div>
          <div class="box-body">
            <form class="form-horizontal" id="frmModelNoInquiry" name="frmModelNoInquiry">
              <div class="form-group">
                <label for="txtModelNoInquiry" class="col-lg-2 control-label">Model No:</label>
                <div class="col-lg-9">
                  <input type="text" id="txtModelNoInquiry" name="txtModelNoInquiry" class="form-control" placeholder="Enter Model Number">
                </div>
                <div class="col-lg-1">
                  <button type="submit" class="btn btn-primary">Search</button>
                </div>
              </div>
            </form>
          </div><!-- /.box-body -->
          <div class="box-footer">

          </div><!-- /.box-footer-->
        </div><!-- /.box -->

        <!-- Container of Item Store Inquiry -->
        <div id="resultContainerStoreInquiry" name="resultContainerStoreInquiry">
        
        </div>

        <!-- Default box for Karat Card Verification -->
        <div class="box">
          <div class="box-header with-border">
            <h3 class="box-title">Karat Card Verification</h3>
            <div class="box-tools pull-right">
              <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
            </div>
          </div>
          <div class="box-body">
            <form class="form-horizontal" id="frmKCardVerification" name="frmKCardVerification">
              <div class="form-group">
                <label for="txtKCardNo" class="col-lg-2 control-label">Karat Card Number:</label>
                <div class="col-lg-9">
                  <input type="text" id="txtKCardNo" name="txtKCardNo" class="form-control" placeholder="Enter Karat Card Number">
                </div>
                <div class="col-lg-1">
                  <button type="submit" class="btn btn-primary">Search</button>
                </div>
              </div>
            </form>
          </div><!-- /.box-body -->
          <div class="box-footer">

          </div><!-- /.box-footer-->
        </div><!-- /.box -->

        <!-- Container of the Karat Card Verification Result -->
        <div id="resultContainer" name="resultContainer">

        </div>

        <!-- Default box for previous updates -->
        <div class="box">
          <div class="box-header with-border">
            <h3 class="box-title">Previous Updates</h3>
            <div class="box-tools pull-right">
              <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
              <button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
            </div>
          </div>
          <div class="box-body">
            <ul>
              <li>[2020-06-26] Store transaction is now editable under Maintenance Menu. You can change declared cash, dollar, check, credit cards, remarks and name of encoder.</li>
              <li>[2019-12-09] Integration of Karat Card.</li>
              <li>[2019-11-16] Added beginning inventory basing on yesterday's ending quantity.</li>
              <li>[2019-09-07] Update on encoding begin inventory. Prevent from being sumbitted when you press enter.</li>
              <li>[2019-08-03] Added Reset Inventory inside Beginning Inventory.</li>
              <li>[2019-07-28] Update on Date picker which drops down a date calendar selection.</li>
            </ul>
          </div><!-- /.box-body -->
        </div><!-- /.box -->

      </section><!-- /.content -->
    </div><!-- /.content-wrapper -->

    <footer class="main-footer">
      <div class="pull-right hidden-xs">
        <b>Version</b> 2.3.0
      </div>
      <strong>Copyright &copy; 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
    </footer>
  </div><!-- ./wrapper -->

  <!-- jQuery 2.1.4 -->
  <script src="adminlte/plugins/jQuery/jQuery-2.1.4.min.js"></script>
  <!-- Bootstrap 3.3.5 -->
  <script src="adminlte/bootstrap/js/bootstrap.min.js"></script>
  <!-- SlimScroll -->
  <script src="adminlte/plugins/slimScroll/jquery.slimscroll.min.js"></script>
  <!-- FastClick -->
  <script src="adminlte/plugins/fastclick/fastclick.min.js"></script>
  <!-- AdminLTE App -->
  <script src="adminlte/dist/js/app.min.js"></script>

  <script>
    function showKCardInformation(data) {
      var active = (data["isactive"] == 1) ? "success" : "danger";
      var activeMsg = (data["isactive"] == 1) ? "Card is Active" : "Card is Deactivated";

      return '<div class="box">                                                                                                                                ' +
        '      <div class="box-header with-border">' +
        '        <h3 class="box-title">Karat Card Result</h3>' +
        '        <div class="box-tools pull-right">' +
        '          <button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>' +
        '        </div>' +
        '      </div>' +
        '      <form role="form" id="frmKCardStatusResult" name="frmKCardStatusResult">' +
        '        <div class="box-body">' +
        '          <div class="form-group">' +
        '            <div class="col-lg-1">' +
        '              <label class="ontrol-label" >ID</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["customerid"] + '">' +
        '            </div>' +
        '            <div class="col-lg-5">' +
        '              <label class="ontrol-label" >First Name</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["firstname"] + '">' +
        '            </div>' +
        '            <div class="col-lg-6">' +
        '              <label class="ontrol-label" >Last Name</label>' +
        '              <input type="text"class="form-control" readonly value="' + data["lastname"] + '">' +
        '            </div>' +
        '          </div>' +
        '          <div class="form-group">' +
        '            <div class="col-lg-4">' +
        '              <label class="ontrol-label" >Karat Card No.</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["kcardno"] + '">' +
        '            </div>' +
        '            <div class="col-lg-4">' +
        '              <label class="ontrol-label" >Invoice No</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["invoiceno"] + '">' +
        '            </div>' +
        '            <div class="col-lg-4">' +
        '              <label class="ontrol-label" >Branch</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["brcode"] + '">' +
        '            </div>' +
        '          </div>' +
        '          <div class="form-group">' +
        '            <div class="col-lg-4">' +
        '              <label class="ontrol-label" >Purchase Date</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["purchasedate"] + '">' +
        '            </div>' +
        '            <div class="col-lg-4">' +
        '              <label class="ontrol-label" >Expiry Date</label>' +
        '              <input type="text" class="form-control" readonly value="' + data["expirydate"] + '">' +
        '            </div>' +
        '            <div class="col-lg-4">' +
        '              <label class="ontrol-label" >Karat Card Status</label>' +
        '              <button type="button" class="btn btn-block btn-' + active + ' disabled" >' + activeMsg + '</button>' +
        '            </div>' +
        '          </div>' +
        '        </div><!-- /.box-body -->' +
        '        <div class="box-footer">' +
        '          <div class="form-group">' +
        '            <div class="col-lg-12">' +
        '             <button type="button" id="btnRenewCard" name="btnRenewCard" class="btn btn-primary" data-transid="' + data["transid"] + '" data-customerid="' + data["customerid"] + '" data-kcardno="' + data["kcardno"] + '" data-firstname="' + data["firstname"] + '" data-lastname="' + data["lastname"] + '" >Renew Card</button>' +
        '             <button type="button" id="btnDeactivateCard" name="btnDeactivateCard" class="btn btn-primary" data-transid="' + data["transid"] + '">Deactivate Card</button>' +
        '            </div>' +
        '          </div>' +
        '        </div><!-- /.box-footer-->' +
        '      </form>' +
        '    </div><!-- /.box -->';
    }

    function showIteminquiredInformation(data, htmlTable, KWHData)
    {
      return '<div class="box">' +
        '    <div class="box-header with-border">' +
        '      <h3 class="box-title">Item Information</h3>' +
        '      <div class="box-tools pull-right">' +
        '        <button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>' +
        '      </div>' +
        '    </div>' +
        '    <div class="box-body">' +
        '      <div class="row">' +
        '        <div class="col-lg-2">Itemcode: <strong>' + data["itemcode"] + '</strong></div>' +
        '        <div class="col-lg-2">Model No: <strong>' + data["modelno"] + '</strong></div>' +
        '        <div class="col-lg-2">SRP: <strong>' + data["srp"] + '</strong></div>' +
        '        <div class="col-lg-6">Description: <strong>' + data["item_desc"] + '</strong></div>' +
        '      </div>' +
        '      <div class="row">' +
        '        <div class="col-lg-2">Karat: <strong>' + data["karat"] + '</strong></div>' +
        '        <div class="col-lg-2">Size: <strong>' + data["size"] + '</strong></div>' +
        '        <div class="col-lg-2">Grams: <strong>' + data["grams"] + '</strong></div>' +
        '        <div class="col-lg-2">cts: <strong>' + data["cts"] + '</strong></div>' +
        '        <div class="col-lg-2">Series: <strong>' + data["seriescode"] + '</strong></div>' +
        '        <div class="col-lg-2">Gold: <strong>' + data["goldID"] + '</strong></div>' +
        '      </div>' +
        '      <div class="row">' +
        '        <div class="col-lg-2">Category: <strong>' + data["catCode"] + '</strong></div>' +
        '        <div class="col-lg-2">Supplier: <strong>' + data["supCode"] + '</strong></div>' +
        '        <div class="col-lg-8">Source Date: <strong>' + data["sourceDate"] + '</strong></div>' +
        '      </div><hr/>' +
        '      <h3>List of branches where this item may be available</h3>' +
        '      <div class="row">' +
        '        <div class="col-lg-12">' +
        '            <table id="dtAvailabilityInBranches" class="table table-bordered table-striped">' +
        '              <thead><th>Itemcode</th><th>Branch</th><th>Qty</th></thead>' +
        '              <tbody>' + htmlTable + '</tbody>' +
        '            </table>' +
        '        </div>' +
        '      </div>' +
        '      <h3>Quantity Remaining in Warehouse: ' + KWHData + '</h3>' +
        '      <p></p>' +
        '    </div>' +
        '  </div>';
    }

    function errorMessage(msg) {
      return '<div class="alert alert-danger alert-dismissable">' +
        '<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' +
        '<h4><i class="icon fa fa-ban"></i> Opppppps!</h4>' +
        '<div>' + msg + '</div>' +
        '</div>'
    }

    $(function() {

      $("#frmKCardVerification").on("submit", function(e) {
        e.preventDefault();

        $.post("kcardStatus", {
          kcardno: $("#txtKCardNo").val()
        }, function(data) {
          if (data["success"] == true) {
            $("#resultContainer").prepend(showKCardInformation(data["data"]));
          } else {
            $("#resultContainer").prepend(errorMessage(data["data"]));
          }
        }, "json");
      });

      $("#frmModelNoInquiry").on("submit", function(e) {
        e.preventDefault();

        $.post("getItemInfo", {
          modelno: $("#txtModelNoInquiry").val()
        }, function(data) {
          if (data["success"] == true) {
            $("#resultContainerStoreInquiry").prepend(showIteminquiredInformation(data["data"], data["htmlTable"], data["KWHData"]));
          } else {
            $("#resultContainerStoreInquiry").prepend(errorMessage(data["data"]));
          }
        }, "json");
      });

      $(document).on("click", "#btnRenewCard", function() {
        $("#mdlRenewCustomerCard").modal("show");

        $("#txtTransID").val($(this).data("transid"));
        $("#txtCustomerID").val($(this).data("customerid"));
        $("#txtFirstName").val($(this).data("firstname"));
        $("#txtLastName").val($(this).data("lastname"));
        $("#txtCardNo").val($(this).data("kcardno"));
      });

      $(document).on("click", "#btnDeactivateCard", function() {
        $.post("deactivateCustomerCard", {
          transid: $(this).data("transid")
        }, function(data) {
          if (data["success"] == true) {
            $("#resultContainer").html(showKCardInformation(data["data"]));
          } else {
            $("#resultContainer").html(errorMessage(data["data"]));
          }
        }, "json");
      });

      // Renew customer
      $("#frmRenewCustomerCard").on("submit", function(e) {
        e.preventDefault();

        $("#frmRenewCustomerCard :button").prop("disabled", true);

        var inputdata = {
          transid: $("#txtTransID").val(),
          customerid: $("#txtCustomerID").val(),
          kcardno: $("#txtCardNo").val(),
          invoiceno: $("#txtInvoiceNo").val(),
          purchasedate: $("#dtPurchaseDate").val(),
          expirydate: $("#dtExpiry").val(),
          brcode: $("#hdBranch").val()
        };

        $.post("renewCustomerCard", inputdata, function(data) {
          $("#frmRenewCustomerCard :button").prop("disabled", false);

          if (data["success"] == true) {
            $.post("kcardStatus", {
              kcardno: $("#txtKCardNo").val()
            }, function(data) {
              if (data["success"] == true) {
                $("#resultContainer").html(showKCardInformation(data["data"]));
              } else {
                $("#resultContainer").html(errorMessage(data["data"]));
              }
            }, "json");
          } else {
            $("#resultContainer").prepend(errorMessage("Error saving data. " + data["data"]));
          }
        }, "json");

      });

    });


  </script>
</body>

</html>