@extends('layouts.app')

@section('content')
<div class="card w-full">
    <div class="card-head">
        <div class="font-semibold text-cyan-900 uppercase">
            [<i class="fal fa-font-case mr-1"></i>]
            Lettrage
        </div>
        <div class="text-gray-500">
            {{-- <a href="" class=" hover:text-orange-500 mr-2">
                <i class="fal fa-print fa-lg"></i>
            </a>
            <a href="" class=" text-green-600 hover:text-orange-500">
                <i class="fal fa-file-excel fa-lg"></i>
            </a> --}}
        </div>
    </div>
    <div class="card-body">
        <x-alert></x-alert>
        <div class="card-content">
            <table class="table table-hover table-striped">
                <thead>
                    <tr class="uppercase">
                        <th style="width: 5%"></th>
                        <th class="text-left" style="width: 10%">Date</th>
                        <th class="text-left">Libellé</th>
                        <th class="text-right" style="width: 15%">Débit</th>
                        <th class="text-right" style="width: 15%">Crédit</th>
                        <th class="text-right" style="width: 15%">Lettrage</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody style="vertical-align: top;">
                    @php
                        $i = 0;
                        $sum_debit = 0;
                        $sum_credit = 0;
                    @endphp
                    @foreach ($operations as $operation)
                        @php
                            $i++;
                            $sum_debit += $operation->debit;
                            $sum_credit += $operation->credit;
                        @endphp
                        <tr>
                            <td style="width: 5%">
                                {{$i}}
                            </td>
                            <td class="text-left" style="width: 10%">{{(new DateTime($operation->date_oper))->format(config('myahs')['date_format'])}}</td>
                            <td class="text-left">{{mb_strtoupper($operation->libelle,'UTF-8')}}</td>
                            <td class="text-right" style="width: 15%">{{App\Lib\Format::number($operation->debit)}}</td>
                            <td class="text-right" style="width: 15%">{{App\Lib\Format::number($operation->credit)}}</td>
                            <td class="text-right" style="width: 15%">
                                {{!empty($operation->lettrage)?$operation->lettrage:$lettrage}}
                            </td>
                            <td class="text-right" style="width: 5%">
                                <a href="#" data-action="delete" data-id="{{$operation->id_oper}}" class="text-red-500 hover:text-red-600 mr-2 btn-lettrage">
                                    <i class="fal fa-times fa-lg"></i>
                                </a>
                                {{-- <a href="{{route('cp.lettre.destroy', [
                                    'id_compte' =>$operation->compte_id,
                                    'id_oper'   =>$operation->id_oper,
                                ])}}" class="text-red-500 hover:text-red-600 mr-2">
                                    <i class="fal fa-times fa-lg"></i>
                                </a> --}}
                            </td>
                        </tr>
                    @endforeach
                    <tr>
                        <td colspan="3" class="text-right font-bold">TOTAL</td>
                        <td class="text-right font-bold" style="width: 15%">{{App\Lib\Format::number($sum_debit)}}</td>
                        <td class="text-right font-bold" style="width: 15%">{{App\Lib\Format::number($sum_credit)}}</td>
                        <td class="text-right" style="width: 15%"></td>
                        <td style="width: 5%"></td>
                    </tr>
                    @if($sum_debit != $sum_credit)
                        <tr>
                            <td colspan="3" class="text-right font-bold"><span class="text-red-500">ECART</span></td>
                            <td class="text-right font-bold" style="width: 15%">
                                @if($sum_debit < $sum_credit)
                                    <span class="text-red-500">{{App\Lib\Format::number(abs($sum_debit-$sum_credit))}}</span>
                                @endif
                            </td>
                            <td class="text-right font-bold" style="width: 15%">
                                @if($sum_debit > $sum_credit)
                                    <span class="text-red-500">{{App\Lib\Format::number(abs($sum_debit-$sum_credit))}}</span>
                                @endif
                            </td>
                            <td class="text-right" style="width: 15%"></td>
                            <td style="width: 5%"></td>
                        </tr>
                    @endif
                </tbody>
            </table>
        </div>
        <div class="flex justify-between mt-3">
            <div id="ecartLettrage"></div>
            <div class="flex space-x-3">
                @if($action == 'edit')
                    <a href="{{route('cp.suivi.index', ['list'=>'on'])}}" class="btn btn-dark block">
                        <i class="fal fa-angle-double-left mr-1"></i>
                        Précédent
                    </a>
                    @if($sum_debit == $sum_credit)
                        <button class="btn btn-warning btn-lettrage" data-action="edit">
                            <i class="fal fa-save mr-1"></i>
                            Enregistrer le lettrage
                        </button>
                    @endif
                        <button class="btn btn-warning-alt btn-lettrage" data-action="forget">
                            <i class="fal fa-trash-alt mr-1"></i>
                            Annuler le lettrage
                        </button>
                @else
                    <button class="btn btn-warning btn-lettrage" data-action="create" data-ecart="{{abs($sum_debit-$sum_credit)}}">
                        <i class="fal fa-save mr-1"></i>
                        Enregistrer
                    </button>
                    <a href="{{route('cp.lettre.index', ['list'=>'on'])}}" class="btn btn-dark block">
                        <i class="fal fa-times mr-1"></i>
                        Annuler
                    </a>
                @endif
            </div>
        </div>
    </div>
</div>

<div>
    <form id="frmLettrage" method="post" action="{{$url}}" class="w-full">
        @csrf
        <input type="hidden" name="lettrage" value="{{$lettrage}}">
        <input type="hidden" name="caisse" value="{{$journal->caisse_id}}">
        <input type="hidden" name="compte" value="{{$journal->compte_id}}">
        <input type="hidden" name="lettrageAction" id="lettrageAction">
        <input type="hidden" name="operId" id="operId">
    </form>
</div>

<x-form-modal>
    <x-slot name="title">
        Régularisation d'écart
    </x-slot>
    <form id="frmRegul" method="post" action="{{route('cp.lettre.store')}}" class="w-full">
        @csrf
        <input type="hidden" name="caisse" value="{{$journal->caisse_id}}">
        <input type="hidden" name="compte" value="{{$journal->compte_id}}">
        <input type="hidden" name="typeEcriture" value="regul">
        <input type="hidden" name="lettrage" value="{{$lettrage}}">
        <input type="hidden" name="sumDebit" value="{{$sum_debit}}">
        <input type="hidden" name="sumCredit" value="{{$sum_credit}}">
        <div class="space-y-4 mb-3">
                <div>
                    <label for="" class="text-sm text-gray-500">Type de journal</label>
                    <select name="typeJournal" class="form-control text-gray-600">
                        <option value="">-- Sélectionner le type de journal --</option>
                        @foreach (App\Lib\Combobox::natureJournal() as $id_nature=>$libelle)
                            <option value="{{ $id_nature }}" {{ $id_nature == old('typeJournal') ? 'selected' : '' }} >
                                {{ $libelle }}
                            </option>
                        @endforeach
                    </select>

                </div>
                <div>
                    <div class="text-sm text-gray-500">
                        Date
                    </div>
                    <div>
                        <input type="date" name="dateJournal" value="{{ !empty(old('dateJournal')) ? old('dateJournal') : date('Y-m-d') }}" class="form-control" required>
                        @error('dateJournal')
                            <span class="text-red-500 text-sm">{{$message}}</span>
                        @enderror
                    </div>
                </div><div>
                    <label for="" class="text-sm text-gray-500">Compte de régularisation</label>
                    <select name="compteRegul" class="form-control text-gray-600">
                        <option value="">-- Sélectionner un compte --</option>
                        @foreach ($planComptes as $planCompte)
                            <option value="{{ $planCompte->id_compte }}">
                                {{ $planCompte->libelle_compte }}
                            </option>
                        @endforeach
                    </select>

                </div>
                <div>
                    <div class="text-sm text-gray-500">
                        Libellé
                    </div>
                    <div>
                        <input type="text" name="libelle" value="{{old('libelle')}}" class="form-control" required>
                        @error('libelle')
                            <span class="text-red-500 text-sm">{{$message}}</span>
                        @enderror
                    </div>
                </div>
        </div>
    </form>
    <x-slot name="footer">
        <div class="flex justify-end space-x-3">
            <button id="btnRegulEcart" class="btn btn-warning">
                <i class="fal fa-save fa-lg mr-2"></i>
                Enregistrer
            </button>
            <button class="btn btn-dark btn-modal-close">
                <i class="fal fa-times fa-lg mr-1"></i>
                Annuler
            </button>
        </div>
    </x-slot>
</x-form-modal>

@endsection

@section('script')

    <script>

        let btnLettrage = document.querySelectorAll('.btn-lettrage')

        btnLettrage.forEach(btn => {
            btn.addEventListener('click', function(e){

                e.preventDefault();

                let action = btn.getAttribute('data-action');

                if(action == 'delete'){

                    document.getElementById('operId').setAttribute('value', btn.getAttribute('data-id'));

                    document.getElementById('lettrageAction').setAttribute('value', btn.getAttribute('data-action'));
                    document.getElementById('frmLettrage').submit();

                }

                if(action == 'edit' || action == 'forget'){

                    document.getElementById('lettrageAction').setAttribute('value', btn.getAttribute('data-action'));
                    document.getElementById('frmLettrage').submit();

                }

                if(action == 'create'){

                    let ecart = parseFloat(btn.getAttribute('data-ecart'));

                    if(ecart > 0){

                        Modal("#frmModal", "show");

                    }else{

                        document.getElementById('lettrageAction').setAttribute('value', btn.getAttribute('data-action'));
                        document.getElementById('frmLettrage').submit();

                    }

                }

            });
        });

        document.getElementById('btnRegulEcart').addEventListener('click', function(e){
            e.preventDefault()
            document.getElementById('frmRegul').submit();
        })


    </script>
@endsection