@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-cash-register mr-2"></i>
                DEMISSION
            </div>
        </div>
        <div class="card-body">
            <x-alert/>
            <x-tiers-bannier :tiers="$tiers"></x-tiers-bannier>
            <div class="card-content">
                <div class="flex flex-col space-y-4">
                    <div>
                        <div class="font-bold border-b-2 border-gray-300 text-gray-500">
                            Montant à payer
                        </div>
                        <div>
                            @php
                                $solde_part = !empty($part_social->solde)?$part_social->solde:0;
                                $solde_compte = !empty($compte->solde)?$compte->solde:0;
                            @endphp
                            <table class="w-full">
                                <tr>
                                    <td class="text-gray-500">Epargne</td>
                                    <td class="text-right pr-4 text-gray-700">{{App\Lib\Format::number($solde_compte)}}</td>
                                </tr>
                                <tr>
                                    <td class="text-gray-500">Part social</td>
                                    <td class="text-right pr-4 text-gray-700">{{App\Lib\Format::number($solde_part)}}</td>
                                </tr>
                                <tr class="font-bold">
                                    <td class="border-t-2 border-b-2 border-gray-300 text-gray-500">Total</td>
                                    <td class="border-t-2 border-b-2 text-right font-bold border-gray-300  pr-4 text-gray-700">{{App\Lib\Format::number($solde_compte+$solde_part)}}</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="pt-5">
                        <form id="frmCaisse" method="post" action="{{route('gt.dems.store', $tiers->id_tiers)}}">
                            @csrf
                            <input type="hidden" name="demandeId" value="{{$demission->id_demande}}">
                            <input type="hidden" name="folio" value="{{$tiers->id_tiers}}">
                            <div class="space-y-3">
                                <div>
                                    <div class="text-sm text-gray-500">
                                        N° Pièce
                                    </div>
                                    <div>
                                        <input type="text" name="piece" value="{{!empty(old('piece')) ? old('piece') :''}}" class="form-control" required>
                                    </div>
                                </div>
                                <div>
                                    <div class="text-sm text-gray-500">
                                        Description
                                    </div>
                                    <div>
                                        <input type="text" name="description" value="{{!empty(old('description')) ? old('description') :''}}" class="form-control" required>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <div class="py-2">
                <button class="msg-box-show btn btn-warning">
                    <i class="fal fa-save mr-1"></i>
                    Enregistrer
                </button>

                <a href="{{route('gt.credit.guichet', 'remb')}}" class="inline-block btn btn-dark">
                    <i class="fal fa-times mr-1"></i>
                    Annuler
                </a>
            </div>
        </div>
    </div>
    <x-tiers-modal :tiers="$tiers"></x-tiers-modal>
    <x-msg-box>
        <x-slot name="title">
            Opération
        </x-slot>
        Voulez vous réellement enregistrer cette opération ?
    </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();
    });
</script>
@endsection