<!DOCTYPE html>
<html lang="en">
<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Chandrani Pearls Gold Billing</title>
  <link rel="icon" type="image/jpg" href="dist/img/favicon.png?v=2">
  <!-- Google Font: Source Sans Pro -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">

    <!-- -=---- searchable dropdown link css ------ -->
  <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
   <!-- -=---- searchable dropdown link css ------ -->

  
  <!-- DataTables -->
  <link rel="stylesheet" href="plugins/datatables-bs4/css/dataTables.bootstrap4.min.css">
  <link rel="stylesheet" href="plugins/datatables-responsive/css/responsive.bootstrap4.min.css">
  <link rel="stylesheet" href="plugins/datatables-buttons/css/buttons.bootstrap4.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="dist/css/adminlte.min.css">
	<link rel="stylesheet" href="dist/css/custom.css?v=2">
	<style>
	
/* faqs styling */

section.faq .question__faqs {
   padding: 10px 80px 10px 0px;
   
    font-size: .96rem;
    height: auto;
}

section.faq .wrapper_child {
    border-bottom: 0px solid #0A3F6B;
    
}

section.faq .answercont {
    color: #424242;
}

.answer {
    padding: 18px 11px 20px;
    box-sizing: border-box;
    overflow: hidden;
    transition: max-height 0.3s ease;

}

/* faqs styling end */




section.questionsfaq {
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    margin-top: -75px;
}

section.questionsfaq .wrapper_child {
    border-bottom: 1px solid white;
}

section.questionsfaq .wrapper_child:first-child {
    border-top: 1px solid white;
}

.question__faqs {
    font-size: 1.2rem;
    font-weight: 600;
    padding: 20px 80px 20px 0px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #0A3F6B;
}

.question__faqs::after {
    content: "\002B";
    font-size: 1.5rem;
    position: absolute;
    right: 20px;
    transition: 0.2s;
}

.question__faqs.active::after {
    transform: rotate(45deg);
}

.answercont {
    max-height: 0;
    overflow: hidden;
    transition: 0.3s;
    color: white;
}

section.questionsfaq .answer {
    padding: 0 0 20px;
}


	
	
	
	
	
.table td, .table th {
    padding: .35rem .0rem;
    
}
	
	
	
	    label {
    display: inline-block;
    margin-bottom: 0rem;
}

.text-primary{
    color:#0a6abb !important;
}

button:focus{

outline: none;

}
table{
margin: auto;
margin-bottom: 20px;
font-size:13px
}
th,td{
padding: 10px;
}

	</style>




	
 <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>	


</head>
	


<body class="hold-transition sidebar-mini" >
	
<div class="wrapper">




  <!-- Navbar -->
    <?php include ("topheader.php"); ?>
  <!-- Main Sidebar Container -->
    <?php include ("sidemenu.php"); ?>

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
 
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h3>View Item Details</h3>
                </div>
                <div class="col-sm-6">
                    
                </div>
            </div>
        </div>
    </section>
    <!-- Main content -->
    <section class="content">
      <div class="container-fluid">
        <div class="row">
          <div class="col-12">
            
            <!-- /.card -->
            <div class="card">
            
              
              <!-- /.card-header -->
			  
	
			  
              <div class="card-body">


<div class="row">

<div class="col-sm-4" ><div class="form-group row">
<label class="col-sm-12 col-form-label" >Scan Barcode</label>
<div class="col-sm-12">
<input type="text" class="form-control" name="scan_barcode" id="scan_barcode" placeholder="Scan Barcode" autocomplete="off">
<span id="scan_barcode_err" style="color:crimson;font-size:14px"></span>
</div>
</div></div>


<div class="col-sm-2" ><div class="form-group row">
<label class="col-sm-12 col-form-label">&nbsp;</label>
<div class="col-sm-12">
<input name="scan_btn" id="scan_btn"  type="button" class="btn btn-primary m-b-0" value="Scan" style="width:100px;background-color:#0979d8;border: none;" >
</div>
</div></div>  


</div>


<div id="scan_data"></div>


  </div> 




              <!-- /.card-body -->

            </div>
            <!-- /.card -->
          </div>
          <!-- /.col -->
        </div>
        <!-- /.row -->
      </div>
      <!-- /.container-fluid -->
    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->


    <?php include ("footer.php"); ?>

  <!-- Control Sidebar -->
  <aside class="control-sidebar control-sidebar-dark">
    <!-- Control sidebar content goes here -->


  </aside>
  <!-- /.control-sidebar -->
</div>




<!-- ./wrapper -->
<!-- jQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- DataTables  & Plugins -->
<script src="plugins/datatables/jquery.dataTables.min.js"></script>
<script src="plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
<script src="plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
<script src="plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
<script src="plugins/datatables-buttons/js/dataTables.buttons.min.js"></script>
<script src="plugins/datatables-buttons/js/buttons.bootstrap4.min.js"></script>
<script src="plugins/jszip/jszip.min.js"></script>
<script src="plugins/pdfmake/pdfmake.min.js"></script>
<script src="plugins/pdfmake/vfs_fonts.js"></script>
<script src="plugins/datatables-buttons/js/buttons.html5.min.js"></script>
<script src="plugins/datatables-buttons/js/buttons.print.min.js"></script>
<script src="plugins/datatables-buttons/js/buttons.colVis.min.js"></script>
<!-- AdminLTE App -->
<script src="dist/js/adminlte.min.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="dist/js/demo.js"></script>
<!-- Page specific script -->
<script>
  $(function () {
    $("#example1").DataTable({
      "responsive": true, "lengthChange": false, "autoWidth": false,
     // "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
    $('#example2').DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": false,
      "ordering": true,
      "info": true,
      "autoWidth": false,
      "responsive": true,
    });
  });
</script>

<script>

function item_check(){

var scan_barcode = $('#scan_barcode').val();

if(scan_barcode==""){
 $('#scan_data').html(''); 
$('#scan_barcode_err').html("* Please scan a barcode");
$('#scan_barcode').css("border-color","#e85c5c");

return false;

}

$.ajax({
url:'ajax-check-barcode.php',
type:'POST',
data:{scan_barcode:scan_barcode},
success:function(f){
 

if(f==2){
 $('#scan_data').html(''); 
$('#scan_barcode_err').html("* This product doesn't seem to belong to your stock.");
$('#scan_barcode').css("border-color","#e85c5c");  

}

if(f==1){
 $('#scan_data').html(''); 
$('#scan_barcode_err').html("* Gold rate not available. Please contact the admin to update the gold rate.");
$('#scan_barcode').css("border-color","#e85c5c");  

}

if(f==0){

$.ajax({
url:'ajax-get-scan-data.php',
type:'POST',
data:{scan_barcode:scan_barcode},
success:function(f){
 $('#scan_data').html(f); 
}
});


}

  
}
});



}


$(document).ready(function() {
  $('#scan_barcode').on('keypress', function(e) {
    if (e.which === 13) {
      item_check();
    }
  });

  $("#scan_btn").on('click', function() {
    item_check();
  });
});


function remove_error(){
$('#scan_barcode_err').html("");
$('#scan_barcode').css("border-color","");
}

$(document).ready(function(){
    $("#scan_barcode").on('keyup', function(){
remove_error();
    });
});


</script>



</body>
</html>