<div class="breadcrumbs">
            <div class="breadcrumbs-inner">
                <div class="row m-0">
                    <div class="col-sm-4">
                        <div class="page-header float-left">
                            <div class="page-title">
                                <h1>Complete Job Card</h1>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <?php $cid = $id ?>
        
                <style>
.content{position: relative;}
.overlay{position: absolute;left: 0; top: 0; right: 0; bottom: 0;z-index: 2;background-color: rgba(255,255,255,0.8);position: fixed;   overflow-y: scroll;}
.overlay-content {
    position: absolute;
    transform: translateY(-50%);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
    top: 50%;
    left: 15%;
    right: 0;
    text-align: center;
    color: #555; 
    position: fixed; 
   overflow-y: scroll;
}

.tableFixHead          { overflow: auto; }
.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }
</style>  
                                                                
    <div class="overlay" style="display:none" id="load"><div class="overlay-content"><img src="<?php echo base_url(); ?>assets/images/loader.gif" alt="Loading..." style="width: 60px;"/></div></div>
                    
      <link rel="stylesheet" href="//code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css">
          <link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/lib/chosen/chosen.min.css">
        
        <div class="content">
            <div class="animated fadeIn">
                
                
                
                 <div class="space" style="padding-bottom: 10px;"></div>
                
               <div id="po" style="display:block">
                   <form id="myForm">
                       <input type="hidden" id="job_id"  name="job_id" placeholder="Total" value="<?php echo $cid ?>" class="col-xs-12 col-sm-12 form-control" style="text-align: right;"/>
                                 
                               <input type="hidden" id="coid"  name="coid" placeholder="Total" value="0" class="col-xs-12 col-sm-12 form-control" style="text-align: right;"/>
                       
                    <div class="row">
                                                    <div class="col-sm-4">  
                                                       Completed Date
                                                          <input type="text" id="codate"  name="codate" placeholder="" value="" class="col-xs-12 col-sm-12 form-control input-sm form-control-sm datepicker" style="text-align: right;"/>
                                                                         
                                                                                  
                                                    </div>
                     </div>
                                               <div class="space" style="padding-bottom: 10px;"></div>
                                               <h4>Return Items</h4>
                                                 <div class="row">
                                    									<div class="col-lg-12" style="padding-bottom: 10px;overflow:scroll;height:280px;width:100%;overflow:auto">
                                    										<table id="po_tbl" class="table table-bordered tableFixHead">
                                    											<thead class="thead-dark">
                                    												<tr>
                                    													
                                    													<th scope="col">No.</th>
                                    													<th>Item Code</th>
                                    													<th>Item Description</th>
                                    													<th style="text-align:right">Unit</th>
                                    													<th style="text-align:right">Unit Price</th>
                                    													<th style="text-align:right"><span id="cr_chng">Reserved Quantity</span> </th>
                                    													<th style="text-align:right"><span id="cr_chng">Return Quantity</span> </th>  
                                    													<th style="text-align:right"><span id="cr_chng"></span> </th>
                                    												
                                    												</tr>
                                    											</thead>
                                            
                                    											<tbody id="show_data" >
                                    									
                                    								
                                    											</tbody>
                                    										</table>
                                    									</div><!-- /.span -->
                                                                          
                                                                                                        
                                                                                                            
                                    								</div><!-- /.row -->
                                  
                                    								 
               
                    <div class="row">
                                    									<div class="col-lg-12" style="padding-bottom: 10px;">      
                                    
                                                                <div class="row" style="float: right; text-align: right;">
                                                                        
                                        <div class="col-md-12 center-block">
                                            <button class="btn btn-secondary btn-sm" id="btn_posave">
                                                    <i class="ace-icon fa fa-floppy-o bigger-120 blue"></i>
                                                   Job Complete
                                            </button>
                                           
                                            <button class="btn btn-secondary btn-sm" id="btn_cancel">
                                                    <i class="ace-icon fa fa-times red2"></i>
                                                    Cancel
                                            </button>
                                        </div>
                                        
                                    </div>
                                     </div>
                                    </div>
                   
               
               </form>
               
                                   								
                                    
              
            </div>
        </div>
        
        <div class="clearfix"></div>
<script src="<?php echo base_url(); ?>assets/js/jquery.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/popper.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/bootstrap.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> 
  <script src="<?php echo base_url(); ?>assets/js/jquery-ui.js"></script>
  <script src="<?php echo base_url(); ?>assets/js/lib/chosen/chosen.jquery.min.js"></script>
<script>

$( function() {
    $( ".datepicker" ).datepicker();
    $( ".datepicker" ).datepicker( "option", "dateFormat", "yy-mm-dd");
  } );
        
               function cal_dis_amt(){
      $('#dis_pc').val("0.00");
      cal_total(); 
      cal_ttot();
    }

    function cal_dis_pc(){
        var pc = $('#dis_pc').val();
        var dis = ($('#inv_total').val() * pc)/100;
      $('#dis_total').val(dis.toFixed(2));
      var nett = parseFloat($('#inv_total').val()) - dis;
      $('#net').val(nett.toFixed(2));
      //cal_ttot();
      //cal_total();
    }
    
    
    function cal_tax_pc(){
        var pc = $('#tax_pc').val();
        var dis = ($('#net').val() * pc)/100;
        //alert(dis);
      $('#tax_total').val(dis.toFixed(2));
      cal_ttot();
      cal_total();
    }
    
    function cal_tax_amt(){
        var tax_total = $('#tax_total').val();
      var pc = (tax_total/$('#net').val())*100;
      $('#tax_pc').val(pc);
      cal_total();
      cal_ttot();
    }

    function cal_ttot(){
        
        var ttot = parseFloat($('#tax_total').val())+parseFloat($('#net').val());
        $('#ttot').val(ttot.toFixed(2));
        
        var txtot = parseFloat($('#net').val())+parseFloat($('#vat').val())+parseFloat($('#nbt').val());
        $('#txtot').val(txtot.toFixed(2));
    }

    function myvat(){
      var checkBox = document.getElementById("chk_vat");
            
      cal_total();
    }

    function mynbt(){
      var checkBox = document.getElementById("chk_nbt");
           
      $('[name="nbt"]').val(nbt.toFixed(2));
      cal_total();
    }

    function cal_total(){
    cal_dis_pc();
      if($('#dis_total').val()!=""){
        var dis =  $('#dis_total').val();
      }else{ var dis = 0;}
      
      var nett =  parseInt($('#inv_total').val())-parseInt(dis);
      $('#net').val(nett);
      
        var other = $('#other_amnt').val();
        var vat = $('#vat').val();
        var nbt = $('#nbt').val();
        var ship = $('#ship').val();
        var bank = $('#bank_fee').val();
        var tax_total = $('#tax_total').val();
        var trfee = $('#trfee').val();

        var total = parseInt($('#inv_total').val()) - parseInt(dis) + parseInt(other)+ parseInt(vat)+ parseInt(nbt)+ parseInt(tax_total)+parseInt(ship)+ parseInt(bank)+ parseInt(trfee);
        $('[name="final1"]').val(total.toFixed(2));
        cal_ttot();
    }

         
    $(document).ready(function(){
       var coid =  "<?php echo $cid ;?>";
        $.ajax({
                 
                type  : 'ajax',
                method:'POST',
                url   : '<?php echo site_url('get_cojob_com')?>',
                dataType : 'json',
                data : {jo_id:coid},
                success : function(data){
                    $("#show_data").after(data['item']);
                       
                    
                            document.getElementById("load").style.display = "none";
                           
                }
                
            }); 
            
            cal_total();
      
      
        
    });
    
      jQuery(document).ready(function() {
          get_sup();
        jQuery(".standardSelect").chosen({
            disable_search_threshold: 5,
            no_results_text: "Oops, nothing found!",
            width: "100%"
        });
    });
    
      
    $("#btn_posave").on('click',function() {
        
         var com_date = document.getElementById("codate");
            //var inv = res.options[res.selectedIndex].value;
        //var inv = $('#posup_invoice').val();
        var jbid = $('#posup_do').val();
                //var g = document.getElementById("supselect");
                //var id = g.options[g.selectedIndex].value;
        
       
        
            var values = $('input[name="po_val[]"]').map(function(){
                   return this.value
            }).get()
            var ids = $('input[name="po_val[]"]').map(function(){
                   return this.id
            }).get()
        
    
                    $.ajax({
                            type : "POST",
                            url  : "<?php echo site_url('co_comp_job')?>",
                            dataType : "JSON",
                            data : $('#myForm').serialize(),
                            success: function(data){
                                
                                swal('Data Saved');
                               window.history.go(-1);
                            }
                        });



           event.preventDefault();
                            return false;
            
            
    });
    
 
    
   $("#po_tbl").on('onkeyup','.txt_val',function(){
       var currentRow=$(this).closest("tr");  
         var col1=currentRow.find("td:eq(0)").html();
         alert(crw);
   })

    function get_cal(){
        var table = document.getElementById("po_tbl"), jqty =newqty= mul=0;
            
            for(var i = 1; i < table.rows.length; i++)
            {
                
                newqty = parseFloat(table.rows[i].cells[6].children[0].value); 
                jqty = parseFloat(table.rows[i].cells[5].innerHTML);
               
               if(newqty > jqty){
                   swal("Please enter a valied quantity.");
               }
            }
            
            
            
    }
    
    function get_sup(){
        $('#supselect option').remove();
        $("#supselect").trigger("chosen:updated");
        $.ajax({
                        type  : 'ajax',
                        method : "POST",
                        url   : "<?php echo site_url('customer_list')?>",
                        async : true,
                        dataType : 'json',
                        success : function(data){
                            
                              $('#supselect').append($('<option>', {
                                                            value: "",
                                                            text: "select"
                                                        }));
                                                        
                           var i;
                    for(i=0; i<data.length; i++){
                            $('#supselect').append($('<option>', {
                                                            value: data[i][0],
                                                            text: data[i][1]
                                                        }));
                        
                                                
                    }                              
               
                        
                                                
                    
                       $("#supselect").trigger("chosen:updated");
                        }
         
                    });
                    
                    
    }
    
    $('#supselect').change(function(){ 
          document.getElementById("load").style.display = "block";
                    $('[name="price"]').val("");
                    $('[name="pricelkr"]').val("");
					$('[name="qty"]').val("");
					$('[name="total"]').val("");
					//document.getElementById("curid").selectedIndex = "0";
					 
          var id = $(this).val();
          if(id!=""){
               $.ajax({
                type  : 'ajax',
                method:'POST',
                url   : '<?php echo site_url('customer_data')?>',
                dataType : 'json',
                data : {sup_id:id},
                success : function(data){
                    $('#poselect option').remove();
                    $('#poselect').append($('<option>', {
                                                            value: "",
                                                            text: "select"
                                                        }));
                    var i;
                    for(i=0; i<data['qtn'].length; i++){
                            $('#poselect').append($('<option>', {
                                                            value: data['qtn'][i].id,
                                                            text: data['qtn'][i].code +data['qtn'][i].id
                                                        }));
                        
                                                
                    }$("#poselect").trigger("chosen:updated");
                    
                    $('[name="cur"]').val(data['sup'][0].cu_symbol);
                   $("#curid").val(data['sup'][0].cur_id);
                    $('[name="sup_type"]').val(data['sup'][0].custo_type);
                    //document.getElementById("cr_chng").innerHTML = "Rate("+data['sup'][0].cu_symbol+")"; 
                    //document.getElementById("cr2_chng").innerHTML = "Total("+data['sup'][0].cu_symbol+")"; 
                    
                    
                    if(data['sup'][0].custo_type=="Foreign"){
                     // var txt1 = document.getElementById("for_foreign1");                      
                      //txt1.style.display = "none";
                      var txt2 = document.getElementById("trafee");                      
                      txt2.style.display = "none";
                      
                      document.getElementById("for_foreign2").style.display = "block";
                      $('#supselect_chosen').css('border', '3px solid rgb(247, 166, 126)');
                      
                      
                    }else{
                      //var txt1 = document.getElementById("for_foreign1");                      
                      //txt1.style.display = "none";
                      document.getElementById("for_foreign2").style.display = "none";
                      document.getElementById("trafee").style.display = "block";
                      $('#supselect_chosen').css('border', '0px solid #ced4da');
                    }
                    
                    if(data['sup'][0].custo_tax == 1){
                        if(data['sup'][0].custo_type=="Foreign"){
                            var txt = document.getElementById("tx");
                            txt.style.display = "block";
                        }else{
                      var txt = document.getElementById("for_tax");
                      txt.style.display = "block";
                        }
                    }else{
                      var txt = document.getElementById("for_tax");
                      txt.style.display = "none";
                    }
                    document.getElementById("load").style.display = "none";
                    
                }
 
            }); 
          }else{
             document.getElementById("load").style.display = "none"; 
          }
            
      });
    
</script>