@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-glasses-alt mr-1"></i>
            Suivi des comptes
        </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>
        <form method="post" action="{{route('cp.suivi.index')}}" class="w-full">
            @csrf
            <div class="flex justify-end space-x-3 w-full mb-3">
                <div class="flex items-center w-44">
                    <select name="lettrage" class="form-control">
                        @php $lettrage = !empty($search->lettrage) ? $search->lettrage : '' @endphp
                        <option value="">-- TOUS --</option>
                        <option value="1" @if($lettrage == '1') selected @endif>LETTRE</option>
                        <option value="2" @if($lettrage == '2') selected @endif>NON LETTRE</option>
                    </select>
                </div>
                <div class="flex items-center w-44">
                    <select name="caisse" class="form-control">
                        @php $id_caisse = !empty($search->caisse) ? $search->caisse : '' @endphp
                        <option value="">-- CAISSE --</option>
                        @foreach ($caisses as $caisse)
                            <option value="{{ $caisse->id_caisse }}" {{ $caisse->id_caisse == $id_caisse ? 'selected' : '' }} >
                                {{ $caisse->id_caisse }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="flex items-center space-x-2 w-1/3">
                    <select name="compte" class="form-control">
                        @php $id_compte = !empty($search->compte) ? $search->compte : '' @endphp
                        <option value="">-- N° COMPTE --</option>
                        @foreach ($comptes as $compte)
                            <option value="{{ $compte->id_compte }}" {{ $compte->id_compte == $id_compte ? 'selected' : '' }} >
                                {{ $compte->id_compte }} - {{ substr(mb_strtoupper($compte->libelle_compte,'UTF-8'),0,40) }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <button type="submit" class="btn btn-warning">
                        <i class="fal fa-search"></i>
                    </button>
                </div>
            </div>
        </form>
        <div class="card-content">
            <table class="table table-hove">
                <thead>
                    <tr class="uppercase">
                        <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>
                    <tr>
                        <td colspan="6"></td>
                    </tr>
                </tbody>
            </table>
            <div class="overflow-auto" style="max-height: 30rem;">
                <table class="table table-hover table-striped">
                    <tbody style="vertical-align: top;">
                        @php
                            $i = 0;
                        @endphp
                        @foreach ($operations as $operation)
                            @php
                                $i++;
                            @endphp
                            <tr>
                                <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%">
                                    <a href="{{route('cp.lettre.cartEdit', [
                                        'id_oper' =>$operation->id_oper,
                                        'lettrage'  =>$operation->lettrage
                                    ])}}" class="hover:text-cyan-500 hover:font-semibold">
                                        {{$operation->lettrage}}
                                    </a>
                                </td>
                                <td class="text-right" style="width: 5%">
                                    <a href="{{route('cp.ecriture.show', $operation->journal_id)}}" class="text-gray-500 hover:text-orange-500 mr-2">
                                        <i class="fal fa-book-open fa-lg"></i>
                                    </a>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            {{-- <table class="table">
                <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 style="width: 5%"></td>
                </tr>
            </table> --}}
        </div>
    </div>
</div>
@endsection

@section('script')

    <script>

        document.getElementById('btnRegul').addEventListener('click', function(e){

            let checkOper = document.querySelectorAll('.checkbox');

            let checkBoxList = [];
            let checkBoxNotNUll = [];

            for (let i = 0; i < checkOper.length; i++) {

                let element = checkOper[i];

                if(element.checked == true){
                    checkBoxList[i] = element.getAttribute('value');
                }
            }
            let i = 0;
            checkBoxList.forEach(elt => {
                if(elt !== undefined){
                    checkBoxNotNUll[i] = elt;
                }
                i++;
            });

            document.getElementById('inputOper').setAttribute('value', checkBoxNotNUll.join(';'));

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

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

    </script>
@endsection