@extends('layouts.default')
@section('content')
   
<div class="container-fluid">
   <div class="nk-content-inner">
         <div class="nk-content-body">
            <div class="nk-block">
               <div class="card card-bordered">
                     <div class="card-aside-wrap">
                        <div class="card-inner card-inner-lg">
                           <div class="nk-block-head nk-block-head-lg">
                                 <div class="nk-block-between">
                                    <div class="nk-block-head-content">
                                       <h4 class="nk-block-title">Liste des paiements</h4>
                                       <!--<p>Vous avez au tolal {{count($AdApArtists)}} artistes.</p>-->
                                    </div>
                                    <div class="nk-block-head-content align-self-start">
                                       <a class="btn btn-dim btn-sm btn-success changeStatut" id_user="{{$user->id}}">Payer</a>
                                    </div>
                                 </div>
                           </div><!-- .nk-block-head -->
                           <div class="nk-block">
                          
                           <div class="nk-block nk-block-lg">
                           <div class="card card-preview">
                        <div class="card-inner">



                <table class="datatable-init-order1-export nk-tb-list nk-tb-ulist" data-auto-responsive="false" data-export-title="Export">
                           
                           <thead>
                               <tr class="nk-tb-item nk-tb-head">
                                    <th class="nk-tb-col tb-col-md"><span class="sub-text">#</span></th>
                                   <th class="nk-tb-col"><span class="sub-text">Détail</span></th>
                                  
                                   <th class="nk-tb-col tb-col-md"><span class="sub-text">Montant payé</span></th>
                                   <th class="nk-tb-col tb-col-md"><span class="sub-text">Montant du</span></th>
                                   <th class="nk-tb-col"><span class="sub-text">Solde</span></th>
                               </tr>
                           </thead>
                           <tbody> 
                           @foreach ($paiements as $key => $paiement)
                               <tr class="nk-tb-item">
                                   <td class="nk-tb-col tb-col-md"><span>{{$key+1}}</span></td>
                                   <td class="nk-tb-col">
                                      @if($paiement->typeLine == 1)
                                       <div class="nk-tnx-type">
                                          <div class="nk-tnx-type-icon bg-info-dim text-info">
                                          <em class="icon ni ni-arrow-up-right"></em>
                                          </div>
                                          <div class="nk-tnx-type-text">
                                             <span class="tb-lead">{{$paiement->description}}</span>
                                             <span class="tb-date">{{$paiement->Date}} </span>
                                          </div>
                                       </div>
                                       @elseif($paiement->typeLine == 2)
                                       <div class="nk-tnx-type">
                                          <div class="nk-tnx-type-icon bg-success-dim text-success">
                                          <em class="icon ni ni-arrow-up-right"></em>
                                          </div>
                                          <div class="nk-tnx-type-text">
                                             <span class="tb-lead">{{$paiement->description}}</span>
                                            
                                             <span class="tb-date">{{$paiement->nameArtist}}</span><br>
                                            
                                             <span class="tb-date">{{$paiement->Date}} </span>
                                          </div>
                                       </div>
                                       @else
                                       <div class="nk-tnx-type">
                                          <div class="nk-tnx-type-icon bg-warning-dim text-warning"> 
                                          <em class="icon ni ni-arrow-up-right"></em>
                                          </div>
                                          <div class="nk-tnx-type-text">
                                             <span class="tb-lead">{{$paiement->description}}</span>
                                             @if($user->profil == 'AD')
                                             <span class="tb-date">{{$paiement->nameArtist}}</span><br>
                                             @endif
                                             <span class="tb-date">{{$paiement->Date}} </span>
                                          </div>
                                       </div>
                                       @endif
                                   </td>

                                   
                                   <td class="nk-tb-col tb-col-md">
                                       <span>€{{$paiement->montant_p}}</span>
                                   </td>
                                   <td class="nk-tb-col tb-col-md">
                                       <span>€{{$paiement->montant_d}}</span>
                                   </td>
                                   <td class="nk-tb-col">
                                       <span>€{{$paiement->solde}}</span>
                                   </td>
                              
                                   
                               </tr>

                               @endforeach 
                               
                               
                           </tbody>
                       </table>

                </div>
                </div>
            </div><!-- .nk-block -->
                           </div><!-- .nk-block -->
                        </div>
                        <div class="card-aside card-aside-left user-aside toggle-slide toggle-slide-left toggle-break-lg" data-content="userAside" data-toggle-screen="lg" data-toggle-overlay="true">
                           <div class="card-inner-group" data-simplebar>
                                 <div class="card-inner">
                                    <div class="user-card">
                                       <div class="user-avatar bg-primary">
                                             <span>{{substr($user->firstname, 0, 1)}} {{substr($user->lastname, 0, 1)}}</span>
                                       </div>
                                       <div class="user-info">
                                             <span class="lead-text">{{$user->firstname}} {{$user->lastname}}</span>
                                             <span class="sub-text">{{$user->email}}</span>
                                       </div>
                                       <div class="user-action">
                                             <div class="dropdown">
                                                <a class="btn btn-icon btn-trigger mr-n2" data-toggle="dropdown" href="#"><em class="icon ni ni-more-v"></em></a>
                                                <div class="dropdown-menu dropdown-menu-right">
                                                   <ul class="link-list-opt no-bdr">
                                                      <li><a href="{{ route('updateayantaffaire', ['id' => $user->id]) }}"><em class="icon ni ni-edit-fill"></em><span>Modifier Profil</span></a></li>
                                                   </ul>
                                                </div>
                                             </div>
                                       </div>
                                    </div><!-- .user-card -->
                                 </div><!-- .card-inner -->
                                 <div class="card-inner">
                                    <div class="user-account-info py-0">
                                       <h6 class="overline-title-alt">Gain total</h6>
                                       <div class="user-balance">{{ number_format($user->g_total, 2) }} <small class="currency currency-btc">€</small></div>
                                       <div class="user-balance-sub">Montant facturé <span>{{ number_format($user->m_du, 2) }} <span class="currency currency-btc">€</span></span></div>
                                    </div>
                                 </div><!-- .card-inner -->
                                 <div class="card-inner p-0">
                                    <ul class="link-list-menu">
                                       <li><a href="{{ route('showayantaffaire', ['id' => $user->id]) }}"><em class="icon ni ni-user-fill-c"></em><span>Informations Personnelles</span></a></li>
                                       <li><a href="{{ route('AdApArtistList', ['id' => $user->id]) }}"><em class="icon ni ni-activity-round-fill"></em><span>Artistes affectés</span></a></li>
                                       <li><a href="{{route('ArtistAddToAdDp',['id' => $user->id])}}"><em class="icon ni ni-grid-add-fill-c"></em><span>Ajouter un artiste</span></a></li>
                                       <li><a class="active" href="{{route('PaiementList',['id' => $user->id])}}"><em class="icon ni ni-grid-add-fill-c"></em><span>Paiements</span></a></li>
                                    </ul>
                                 </div><!-- .card-inner -->
                           </div><!-- .card-inner-group -->
                        </div><!-- card-aside -->
                     </div><!-- .card-aside-wrap -->
               </div><!-- .card -->
            </div><!-- .nk-block -->
         </div>



         <div class="modal fade" id="modalForm">
            <div class="modal-dialog" role="document">
               <div class="modal-content">
                  <div class="modal-header">
                     @if($user->profil == 'AD')
                        <h5 class="modal-title">Ajouter un paiement</h5>
                     @else
                        <h5 class="modal-title">Paiement Apporteur d’affaires</h5>
                     @endif
                        <a href="#" class="close" data-dismiss="modal" aria-label="Close">
                           <em class="icon ni ni-cross"></em>
                        </a>
                  </div>
                  <div class="modal-body">
                        <form class="form-validate is-alter" id="SubmitForm">
                           <div class="form-group">
                           <div class="succes-alert" style="display:none; margin-bottom:20px">
                              <div class="alert alert-fill alert-success alert-icon">
                                    <em class="icon ni ni-check-circle"></em> 
                                    <strong>Succès</strong>. 
                                    <span id="successMsg"></span>
                              </div>
                           </div>
                           <div class="error-alert" style="display:none; margin-bottom:20px">
                              <div class="alert alert-fill alert-danger alert-icon">
                                    <em class="icon ni ni-cross-circle"></em> 
                                    <strong>Erreur</strong>. 
                                    <span id="errorMsg"></span>
                              </div>
                           </div>
                              <label class="form-label" for="pay-amount">Montant Payé (€)</label>
                              <div class="form-control-wrap">
                                    <input type="hidden" id="token" name="_token" value="{{ csrf_token() }}">
                                    <input type="hidden" class="form-control" id="id_user">
                                    <input type="hidden" class="form-control" id="montant_du">
                                    <input type="number" class="form-control" id="pay-amount" min="0">
                                    <div class="errorAmount" style="color:red"></div>
                              </div>
                              @if($user->profil == 'AD')  
                              <label class="form-label" for="pay-amount">Artiste</label>
                              <div class="form-control-wrap">
                                    <select class="form-select" data-placeholder="Selectionnez l'artiste" name="artist" id="artist" required>
                                       <option value="">Sélectionnez un artiste</option>
                                                                           </select>
                              </div>
                              @endif
                  
                                 <div class="form-group">
                                    <label class="form-label">Date de paiement</label>
                                    <div class="form-control-wrap">
                                       <div class="input-daterange date-picker-range input-group">
                                          <input type="text" class="form-control" id="datePaiement" name="datePaiement">
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              
                           <div class="form-group">
                              <button type="submit" class="btn btn-lg btn-primary">Enregistrer</button>
                           </div>
                        </form>
                  </div>
               </div>
            </div>
      </div>


   </div>
</div>

@stop

@section('addedJs')

<script type="text/javascript">
    $(".changeStatut").click(function(){
        var id_user = $(this).attr( "id_user" );
        //var montant_du = $(this).attr( "montant_du" );
        //$('#montant_du').val(montant_du);
        $('#id_user').val(id_user);

        //document.getElementById("pay-amount").setAttribute("max",montant_statement); // set a new value;

        $( "#modalForm" ).modal('show');
    });

 

    $('#SubmitForm').on('submit',function(e){
        e.preventDefault();
        let idArtist = $('#artist').val();
        let datePaiement = $('#datePaiement').val();
        let id_user = $('#id_user').val();
        let pay_amount = $('#pay-amount').val();
        let _token = $('#token').val();
        
        $.ajax({
        url: "/public/AdAp/changeAmountStatement",
        type:"POST",
        data:{
            //montant_du:montant_du,
            id_user:id_user,
            idArtist:idArtist,
            datePaiement:datePaiement,
            pay_amount:pay_amount,
            _token: _token,
        },
        success:function(response){
            console.log(response);
            $('#successMsg').text(response.message);
            $(".succes-alert").css("display", "block");
            setTimeout(function(){
                $('#modalForm').modal('hide');
                window.location.replace("{{ route('PaiementList',['id' => $user->id]) }}"); 
            }, 3000);
            
            
        },
        error: function(response) {
            console.log(response);
            $('#errorMsg').text(response.message);
            $(".error-alert").css("display", "block");
        },
        });
    });
</script>
@stop