@extends('inventory.layout') 
@section('title', 'Routing Form')
@section('content')
 @push('head')
    <!-- plugins:css -->
    <link rel="stylesheet" href="assets/vendors/mdi/css/materialdesignicons.min.css">
    <link rel="stylesheet" href="assets/vendors/css/vendor.bundle.base.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" integrity="sha512-5A8nwdMOWrSz20fDsjczgUidUBR8liPYU+WymTZP1lmY9G6Oc7HlZv156XqnsgNUzTyMefFTcsFH/tnJE/+xBg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet">
    <!-- endinject -->
    
    <style>

/ Style the tab /
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/ Style the buttons inside the tab /
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
}

/ Change background color of buttons on hover /
.tab button:hover {
  background-color: #ddd;
}

/ Create an active/current tablink class /
.tab button.active {
  background-color: #ccc;
}

/ Style the tab content /
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}
.tradeadd{
        background-color: #2dce89!important;
        border-color: #2dce89!important;
        color:#fff !important;
        padding: 6px 14px !important;
    }

table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

/*tr:nth-child(even) {
  background-color: #dddddd;
}*/
#content1::after{
    content: "\a";
    white-space: pre;
    }
    #title:after{
        content: "\a";
        white-space: pre;
    }
    #desc{
        color: #D3D3D3 !important;
    }
    #wisestep_count select, #wisestep_count input{
      border: 1px solid #8c8c8c;
    height: 45px !important;
    border-radius: 5px;
    color: #8c8c8c;
    }
    #wisestep_count .submitbtn, #wisestep_count .submitstage{
      height: 45px;
    padding: 0 20px;
    background: #333;
    border: 1px solid #333;
    color: #fff;
    border-radius: 5px;
    font-weight: 600;
    }

     #wisestep_count tr td:first-child{
      width:30%;
     }
     #bottomstage tr td{
      width: 30%;
     }
     .wisestep_sr{
      font-size: 17px !important;
      padding-left: 15px;
      background:#f0f0f0;
     }
     /*.totlsteps{

    margin-bottom: 0px;
    text-align: left;
    padding-top: 15px;*/
    
    .totlsteps {
    margin-bottom: 0px;
    text-align: left;
  
    /*color: #4249A3;*/
}

     #wisestep_count{
     padding: 20px;
    margin-bottom: 30px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border: 1px solid #a4a4a4;

    overflow: hidden;
    z-index: 1;
    position: relative;

  }
  .wisetable_steps{
    margin-top: 20px;
  }
  #bottomstage:before{
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: #a4a4a4;
    left: 0;
    margin-top: -20px;
  }
  #bottomstage{
    margin-top: 40px;
  }
    

</style>
    <!-- Layout styles -->
    <link rel="stylesheet" href="{{ url('assets/css/style.css')}}">
    <link rel="stylesheet" href="{{ url('assets/css/custom.css')}}">
    <!-- End layout styles -->
    <link rel="shortcut icon" href="{{ url('assets/images/favicon.ico')}}" />
@endpush

    <div class="container-scroller">

      <!-- partial:partials/_navbar.html -->
     
      <!-- partial -->
    <div class="container-fluid">
       
        <div class="main-panel" style="width: 100%;">
           <div class="content-wrapper">
            <div class="page-header">
              <h3 class="page-title">
                 {{isset($dataorder[0]->name) ? $dataorder[0]->name:''}} / Order No. {{ isset($dataorder[0]->orderno) ? $dataorder[0]->orderno:'' }} / Routing Form {{isset($dataorder[0]->routingName) ? $dataorder[0]->routingName:''}} / Stages
              </h3>
              
            </div>



            <div class="row enq-tab">
              <div class="accordion" id="myAccordion">
                
                @foreach($dataorder as $j=>$order)
                {{--json_encode($order)--}}
                <div class="accordion-item">
                    <h2 class="accordion-header" id="headingOne{{$j+1}}">
                        <button type="button" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne{{$j+1}}">{{isset($order->stageName) ? $order->stageName:''}}&nbsp;&nbsp;@foreach($totalcount as $tcount)
                          @if($order->stageid==$tcount->stageid)
                          <h5 class="totlsteps">(Total {{isset($tcount->count) ? $tcount->count:'' }} steps)</h5>
                          @endif
                        @endforeach</button>
                        <input type="hidden" name="stgid" value="{{isset($order->stageid) ? $order->stageid:''}}">
                    </h2>
                    
                    <div id="collapseOne{{$j+1}}" class="accordion-collapse collapse show" data-bs-parent="#myAccordion">
                        <div class="card-body" id="wisestep_count">

                        <!-- Accept and reject checkbox start -->
                       
                        <table id="product_table_{{$j+1}}" class="table">
                            <thead>
                                <tr>
                            
                                </tr>
                            </thead>
                            <tbody>
                              @foreach($steps as $i=>$step)
                                
                                <tr>
                                  @if($step->stageid == $order->stageid)
                                    
                                      <table class="mb-3 wisetable_steps">
                                          
                                
                                        <tr>
                                          <input type="hidden" class="stepid" name="step_id" value="{{$step->id}}">
                                          <input type="hidden" id="formid" name="formid" class="formid" value="{{$step->formid}}" >
                                          <td class="wisestep_sr">Step {{($i+1) }}. {{ ($step->stepName) }}</td>
                                        </tr>
                                      </table>
                                       <table>
                                        

                                        <tr>
                                          
                                              @if($step->formid!='')
                                                  <td> 
                                                    <a href="{{url('assignforms'.'/'.$step->formId.'/'.$step->id) }}" style="background: #0f7ea4;
                                                    color: #fff;text-decoration: none;padding: 14px 20px;border-radius: 5px;display: inline-block;"> 
                                                     {{ ($step->formname) }}</a>                                                  
                                              @elseif($step->stepName== 'Assign and schedule measurement/ inspection to:')
                                                  <td> 
                                                    <select  class="form-control client" name="client_id" id="client">
                                                    <option value="">Inspection To</option>
                                                    @foreach($clients as $client)
                                                    @if(in_array($client->id,$clientid))
                                                    <option value="{{$client->id}}" selected="true">{{$client->name}}</option>
                                                    @else
                                                    <option value="{{$client->id}}">{{$client->name}}</option>
                                                    @endif
                                                    @endforeach
                                                    
                                                    </select>
                                                  </td>
                                                 @elseif($step->stepName== 'Do the M/I using the appropriate form (Physical/CAD).')
                                                 <td> 
                                                    <select  class="form-control cad" name="cad" id="cad">
                                                    <option value="">Physical/CAD</option>
                                                    
                                                    <option value="Physical">Physical</option>
                                                    
                                                    <option value="CAD">CAD</option>
                                                    
                                                    </select>
                                                  </td>

                                              @endif
                                             <td> 
                                             

                                            @if(in_array($step->id,$st) &&   $orders->id==$step->orderId)
                                              
                                              <select  class="form-control stepstatus" name="status" id="status1">
                                               
                                               
                                                        <option value="{{$step->status}}" >{{$step->status}}</option>
                                                        

                                                   
                                              </select>
                                              
                                              @else
                                              <select  class="form-control stepstatus" name="status" id="status1">
                                               
                                               
                                                         <option value="">Please Select</option>
                                                         <option value="InProcess">In Process</option>
                                                        <option value="completed">Completed</option>
                                                        

                                                   
                                              </select>
                                             @endif 
                                             
                                        
                                            </td>
                                            <td>
                                             
                                              @if(isset($step->username) && ($step->username)!='' && isset($step->status) && $step->status!='' && $orders->id==$step->orderId)
                                                
                                              Submitted By {{isset($step->username) ? $step->username:''}}
                                              
                                              @else
                                                    <button class="submitbtn" data-id="{{$step->id}}" data-stageid="{{$order->stageid}}" data-formid="{{$step->formid}}" data-routingid="{{$order->orderId}}" data-url="{{url('stepsubmit')}}"  data-clientid="{{$order->clientid}}" data-orderid="{{$order->orderno}}">Submit</button> 
                                              @endif
                                            
                                            </td>
                                          
                                         </tr>
                                       
                                         
                                        
                                       </table>
                                   @endif
                                </tr>
                               
                                @endforeach
                                 
                                <table id="bottomstage">
                                                          
                                  @if(in_array($order->stageid,$ststageid) && ($order->dateofcompletion!='')  && $order->orders_id==$order->orderno)

                                    <tr>
                                       <input type="hidden"  class="orderform" name="form_id" value="{{$order->form_id}}">   
                                    <td>
                                      <input type="date" name="dateofcompletion" class="form-control datacompl" value="{{isset($order->dateofcompletion) ? $order->dateofcompletion:''}}">
                                    </td>
                                    <td>
                                      <input type="text" name="timeofcompletion" class="form-control timecompl" value="{{isset($order->timeofcompletion) ? $order->timeofcompletion:''}}" placeholder="Time">
                                    </td>
                                    <td>
                                      
                                          <select  class="form-control status" name="stagestatus" id="status">
                                            <option value="">Please Select</option>
                                            @if($order->stagestatus=="InProcess" || $order->stagestatus=="completed")
                                              <option value="InProcess" @if ($order->stagestatus == 'InProcess') {{ 'selected' }} @endif>In Process</option>
                                              <option value="completed" @if ($order->stagestatus == 'completed') {{ 'selected' }} @endif>Completed</option>
                                            @else

                                              <option value="InProcess">In Process</option>
                                              <option value="completed">Completed</option>
                                            @endif
                                            
                                        </select>
                                      </td>
                                      <td>
                                        <button class="submitstage">Submit</button>
                                      </td>
                                    </tr>
                                    @endif

                                </table>
                                 
                                 
                                
                            </tbody>
                        </table>
                        

                        </div>
                    </div>
                </div>
                @endforeach
            </div>
            </div>

            </div>

        </div>
          <!-- content-wrapper ends -->
          <!-- partial:partials/_footer.html -->
          
          <!-- partial -->
       
        <!-- main-panel ends -->
    </div>
      <!-- page-body-wrapper ends -->
    </div>
    <!-- container-scroller -->
    <!-- plugins:js -->
    @push('script')
    <script>
function openCity(evt, cityName) {
  var i, tabcontent, tablinks;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(" active", "");
  }
  document.getElementById(cityName).style.display = "block";
  evt.currentTarget.className += " active";
}
</script>
   
    <script src="{{ url('assets/vendors/js/vendor.bundle.base.js')}}"></script>
    <!-- endinject -->
    <!-- Plugin js for this page -->
    <script src="{{ url('assets/vendors/chart.js/Chart.min.js')}}"></script>
    <script src="{{ url('assets/js/jquery.cookie.js')}}" type="text/javascript"></script>
    <!-- End plugin js for this page -->
    <!-- inject:js -->
    <script src="{{ url('assets/js/off-canvas.js')}}"></script>
    <script src="{{ url('assets/js/hoverable-collapse.js')}}"></script>
    <script src="{{ url('assets/js/misc.js')}}"></script>
    <!-- endinject -->
    <!-- Custom js for this page -->
    <script src="{{ url('assets/js/dashboard.js')}}"></script>
    <script src="{{ url('assets/js/todolist.js')}}"></script>
    <!-- End custom js for this page -->

<script>
  $('.submitbtn').click(function(){

    var scope = $(this).closest('tr'); 
    var url=$(this).data('url');
    var id=$(this).data('id');
    var stageid=$(this).data('stageid');
    var formid=$(this).data('formid');
    var routingid=$(this).data('routingid');
    var status=scope.find('.stepstatus option:selected').val();
    console.log(status);
    var client=$('.client option:selected').val();
    var cad=$('.cad option:selected').val();
     var orderid=$(this).data('orderid');
        //alert('test');
        console.log(routingid);
        console.log(id);
        console.log(orderid);
        console.log(url);

        //console.log(formid);

        $.ajax({
          url:url,
          type:'GET',
          data:{'id':id,'stageid':stageid,'formid':formid,'orderid':orderid,'status':status,'client':client,'cad':cad,'routingid':routingid},
          success:function(res){
              console.log(res);   

              $('#status1 option[value="'+res.stage.status+'"]').attr("selected", "selected");

          }    
      });
  });

</script>

<script type="text/javascript">


  $('.submitstage').click(function(){

    //var count = $("#producttable>tbody tr").length;
    //console.log(count);
    //var counter=count+1;

     var scope = $(this).closest('tr'); 
    //console.log(scope);
    var url=$(this).data('url');
    var id=$('.wisetable_steps').find('.stepid').val();
    //console.log(id);
    var stageid=$(this).data('stageid');
    var formid=scope.find('.orderform').val();
    var routingid=$(this).data('routingid');
    var orderid=$(this).data('orderid');
        //alert('test');
        console.log(formid);
        console.log(stageid);
         console.log(routingid);
        console.log(url);
    
        console.log(orderid);
        var datacompl=scope.find('.datacompl').val();
        var timecompl=scope.find('.timecompl').val();
        var status=scope.find('.status option:selected').val();
           console.log(datacompl);
           console.log(timecompl);
           console.log(status);

        $.ajax({
          url:url,
          type:'GET',
          data:{'id':id,'stageid':stageid,'formid':formid,'orderid':orderid,'datacompl':datacompl,'timecompl':timecompl,'status':status,'routingid':routingid},
          success:function(res){
              console.log(res);  
              scope.find('.datacompl').val(res.stage.dateofcompletion);
              scope.find('.timecompl').val(res.stage.timeofcompletion);

              scope.find('#status option[value="'+res.stage.status+'"]').attr("selected", "selected");
              //var pcat='';
              //pcat+='<option value='+res.stage.status+'  selected="true">'+res.stage.status+'</option>';
              //$('.status').append(pcat);

          }    
      });
  });
</script>
  @endpush
 @endsection