@extends('layouts.backend')
@section('extraCss')  
 <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
 <style>
table.TableAddDelete{
    width: 100%;
    border-collapse: collapse;
    margin-top:20px;
}
table.TableAddDelete th, table.TableAddDelete td{
    border: 1px solid #cdcdcd;
    padding: 7px;
}
</style>
@endsection
@php $challenType = ['1'=>'Return','2'=>'Non Return']; @endphp
@section('mainContentArea')

<div class="card card-default">
    <div class="card-header">
        <h4>
            Edit Challan
            <a href="{{ route('challan.issued') }}" class="btn btn-info float-right btn-sm"> Back</a>
        </h4>
    </div>

    @if (count($errors) > 0)
   <div class = "alert alert-danger">
      <ul>
         @foreach ($errors->all() as $error)
            <li>{{ $error }}</li>
         @endforeach
      </ul>
   </div>
   @endif
    <div class="card-body">
       
        <form   method="POST" enctype="multipart/form-data" action="{{ route('challan.issued.update') }}" >
        @csrf
        
        <div class="row"> 

            <div class="col-md-4 form-group">
                <label for="challenType">Challen Type</label>
                <select name="challenType" id="challenType" class="form-control select2" required>
                    <option value="">Select Option</option>
                    @foreach($challenType as $key => $statusv)
                    <option value="{{ $key }}" {{ $challan->type == $key ? 'selected' : '' }}>{{ $statusv }}</option>
                    @endforeach
                </select>
            </div>

            <div class="col-md-4 form-group">
                <label for="order_number">Order Number</label>
                <input name="id" type="hidden" id="id" class="form-control" value="{{!empty($challan) ? $challan->id : ''}}">
                <input name="order_number" id="order_number" class="form-control"  value="{{ $challan->order_id}}">
            </div>
            

            <div class="col-md-4 form-group">
                <label for="reason">Reason </label>
                <textarea name="reason" id="reason" class="form-control" >
                    {{$challan->purpose}}
                </textarea>
            </div>     
          
          
          </div>

           <div class="row">

                <div class="col-md-4 form-group">
                    <label for="Style">Style </label>
                    <input type="text" class="form-control txtTeamAddDelete"  >
                </div> 

                <div class="col-md-4 form-group">
                    <label for="Quantity">Quantity</label>
                    <input type="number" class="form-control txtCricketerAddDelete" min='0' >
                </div> 

                <div class="col-md-4 form-group">
                    <label for="user_name">Issued To Name</label>
                    <input type="text" class="form-control txtScoreAddDelete"  >
                </div> 

                <button type="button" class="btnrowAddDelete">Add New Row</button>   

            </div>

            <div class="row">

            <table class="TableAddDelete">
                <thead>
                    <tr>                                  
                        <th>Style</th>
                        <th>Quantitye</th>
                        <th>Issued To Name</th> 
                        <th>Delete</th>                                                                       
                    </tr>                                   
                </thead>    
                <tbody>  

                @php $count = 0;@endphp
                      @if(count($challan->challenProducts) > 0)
                       @foreach($challan->challenProducts as $key => $value)

                        @php $count = $key +1 ; @endphp
                        <tr id="{{$count}}">
                              <td class="row-index text-center">               
                                    <input type="text" name="style[{{$count}}]"  id="vt{{$count}}" value="{{!empty($value->style_no) ? $value->style_no : 0}}" class="form-control" placeholder="Enter Style" required />
                              </td>
                              <td class="row-index text-center">               
                                    <input type="number" name="quantity[{{$count}}]"  value="{{!empty($value->quantity) ? $value->quantity : 0}}" class="form-control" placeholder="Enter quantity" required />
                              </td>
                              <td class="row-index text-center">               
                                    <input type="text" name="user_name[{{$count}}]"   value="{{!empty($value->issued_to) ? $value->issued_to : 0}}" class="form-control" placeholder="Enter name " required />
                              </td>
                             
                               <td class="text-center">
                                <button class="btn btn-danger remove btndeleterowadded " 
                                    type="button">Remove</button>
                                </td>
                        </tr>
                       @endforeach 
                      @endif                                 
                </tbody>
            </table>

            </div>
           
            <div class="col-md-12 text-Center" style="margin:20px;">
                <button type="submit" class="btn btn-success" ><i class="fa fas fa-save"></i> Submit</button>
                
            </div>
        
    </form>

    </div>
</div>
@endsection

@section('extraJs')
<script>
$(document).ready(function(){
    $('.btnrowAddDelete').click(function(){
        var txtTeamAddDelete = $('.txtTeamAddDelete').val();
        var txtCricketerAddDelete = $('.txtCricketerAddDelete').val();
        var txtScoreAddDelete = $('.txtScoreAddDelete').val();
        $('.TableAddDelete tbody').append("<tr><td><input name='style[]' id='article' class='form-control' value="+txtTeamAddDelete+"  ></td><td><input name='quantity[]' id='qty' class='form-control' value="+txtCricketerAddDelete+" ></td><td><input name='user_name[]' id='user' class='form-control' value="+txtScoreAddDelete+" ></td><td><button type='button' class='btndeleterowadded btn'>x</button></td></tr>");
       
    });
    $(document).on('click', 'button.btndeleterowadded', function(){
        $(this).closest('tr').remove();
        return false;
    });
});
</script>
@endsection