@extends('layouts.master')
@section('content')
<h3>Form add new order service</h3>
@if(Session::has('message'))       
<p class="alert alert-success" align="center"> {{Session::get('message')}}</p>
@endif
<div class="row clearfix">
    <div class="col-lg-12">
        <div class="card">
            <div class="body">
                <h5><strong>Reference: </strong> <mark>{{$current_reparation->reference_rp}}</mark></h5>
                <div class="row">                                
                    <div class="col-md-6 col-sm-6">
                        <address>
                            <strong>Fait par (Charroi) : {{$current_reparation->name}}</strong><br>
                            <abbr title="Phone">Email : </abbr> {{$current_reparation->email}}
                        </address>
                    </div>
                    <div class="col-md-6 col-sm-6 text-right">
                        <p class="mb-0"><strong>Date : </strong> {{$current_reparation->date_repara}}</p>
                    </div>
                </div>
            </div> 
            <hr>
            <div class="">
            <a href="/reparation_details/{{$current_reparation->id_repara}}" class="btn btn-secondary"> Retour</a>
        </div>
            <div class="container">    
     <br />
     <h3 align="center">Ajouter des services</h3>
     <br />
            <div class="table-responsive">
                <form method="post" id="dynamic_form" action="/save_reparation_details">
                 <span id="result"></span>
                <table class="table table-bordered table-striped" id="user_table">
               <thead>
                <tr>
                    <th>Service</th>
                    <th>Fournisseur</th>
                    <th>Quantite</th>
                    <th>Prix unitaire</th>

                </tr>
               </thead>
               <tbody>
                
               </tbody>
               <tfoot>
                <tr>
                    <td colspan="4" align="right">&nbsp;</td>
                    <td>
                  @csrf
                  <input type="submit" name="save" id="save" class="btn btn-primary" value="Save" />
                 </td>
                </tr>
               </tfoot>
                </table>
                </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('page-script')
<script>
$(document).ready(function(){
 var count = 1;
 dynamic_field(count);
 function dynamic_field(number)
 {
  html = '<tr>';
        html += '<td><select name="service_id[]" class="form-control show-tick ms select2" data-placeholder="Selectionner service" required><option value="">Selectionner service</option>@foreach($services as $ss)<option value="{{$ss->id_service}}">{{ $ss -> name_service }}</option>@endforeach</select></td>';
        html += '<td><select name="fournisseur_id[]" class="form-control show-tick ms select2" data-placeholder="Selectionner le fournisseur" required><option value="">Selectionner le fournisseur</option>@foreach($fournisseurs as $ff)<option value="{{$ff->id_fourni}}">{{ $ff -> name }}</option>@endforeach</select></td>';
        html += '<td><input type="number" min="0" name="qte[]" class="form-control" placeholder="Taper la quantite ici..."></td>';
        html += '<td><input type="number" min="0" name="pu[]" class="form-control" placeholder="Taper le prix unitaire ici..."></td>';
        html += '<td><input type="hidden" name="id_repara" class="form-control" value="{{$current_reparation->id_repara}}"></td>';

        if(number > 1)
        {
            html += '<td><button type="button" name="remove" id="" class="btn btn-danger remove">Remove</button></td></tr>';
            $('tbody').append(html);
        }
        else
        {   
            html += '<td><button type="button" name="add" id="add" class="btn btn-success">Add</button></td></tr>';
            $('tbody').html(html);
        }
 }
 $(document).on('click', '#add', function(){
  count++;
  dynamic_field(count);
 });
 $(document).on('click', '.remove', function(){
  count--;
  $(this).closest("tr").remove();
 });
});
</script>
@stop