@extends('layouts.app')


@section('content')
    <div class="card w-3/5">
        <div class="card-head">
            <div class="font-semibold text-cyan-900 uppercase">
                <i class="fal fa-hand-holding-usd mr-2"></i>
                déblocages : <span class="text-orange-500">{{$tiers->id_tiers}}</span>
            </div>
            <div>                
                <a href="{{route('gt.credit.guichet', 'octroi')}}" class="text-gray-500 hover:text-orange-500">
                    <i class="fal fa-list mr-1 fa-lg"></i>
                </a>
            </div>
        </div>
        <div class="card-body">
            <x-alert/>
            <x-tiers-bannier :tiers="$tiers"></x-tiers-bannier>
            <div class="card-content mb-3">
                <table class="table table-simple">
                    <tr>
                        <td>Réf prêt</td>
                        <td class="text-right">Mtt. capital</td>
                    </tr>
                    <tr class="font-bold">
                        <td>{{$contrat->id_pret}}</td>
                        <td class="text-right">{{App\Lib\Format::number($contrat->mtt_capital)}}</td>
                    </tr>
                </table>
            </div>

            <div class="card-content">
                <form id="frmCaisse" method="post" action="{{$url}}">
                    @csrf
                    <input type="hidden" name="refPret" value="{{$contrat->id_pret}}">
                    @if(!empty($operation->id_oper))
                        <input type="hidden" name="idOper" value="{{App\Lib\CryptId::crypt($operation->id_oper)}}">
                    @endif
                    <table class="table">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Désignation</th>
                                <th class="text-right" style="width: 30%">Montant</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($octrois as $octroi)
                            <tr>
                                <td><span  class="font-bold text-orange-500 text-lg">{{$octroi->operation}}</span></td>
                                <td>{{$octroi->label}}</td>
                                <td>
                                    <input type="text" name="{{$octroi->name}}"    value="{{$octroi->value}}" class="form-control" readonly/>
                                </td>
                            </tr>
                            @endforeach
                            <tr>
                                <td></td>
                                <td>Montant à décaisser</td>
                                <td><span  class="font-bold text-orange-500 text-lg">{{App\Lib\Format::number($contrat->mtt_capital - App\Lib\ModuleCredit::frais($contrat->mtt_capital, App\Lib\ModuleCredit::tauxFrais(), 0))}} AR</span></td>
                            </tr>
                        </tbody>
                    </table>
                </form>
            </div>

            @if($method == 'create')
                <div class="py-2">
                    <button class="msg-box-show btn btn-warning">
                        <i class="fal fa-save mr-1"></i>
                        Enregistrer
                    </button>
                </div>
            @endif

            @if($method == 'edit')
                <div class="py-2 space-x-3">
                    <button id="btnDelete" data-url="{{route('gt.deblocage.destroy', App\Lib\CryptId::crypt($operation->id_oper))}}" class="msg-box-show btn btn-dark">
                        <i class="fal fa-edit mr-1"></i>
                        Annuler l'octroi
                    </button>
                </div>
            @endif

        </div>
    </div>
    <x-tiers-modal :tiers="$tiers"></x-tiers-modal>
    <x-msg-box>
        <x-slot name="title">
            Déblocage
        </x-slot>
        Voulez vous réellement valider ce déblocage de prêt ?
    </x-msg-box>
@endsection

@section('script')
<script>
    document.getElementById("frmCaisse").addEventListener("submit", function(e){
        e.preventDefault();
    });

    document.querySelector(".msg-box-show").addEventListener("click", function(e){
        e.preventDefault();
        Modal("#MsgBox", "show");
    })

    document.getElementById("btnYes").addEventListener("click", function(e){
        e.preventDefault();
        document.getElementById("frmCaisse").submit();
    });

    let btnDelete = document.getElementById('btnDelete');
    if(btnDelete !==undefined){
        btnDelete.addEventListener('click', function(e){
            e.preventDefault()
            let getUrl = btnDelete.getAttribute('data-url');
            document.getElementById('frmCaisse').setAttribute('action', getUrl);
        })
    }
    
</script>
@endsection