@extends('layouts.app')

@section('content')
<div class="card w-4/5">
    <div class="card-head">
        <div class="font-semibold text-cyan-900 uppercase">
            <i class="fal fa-books mr-1"></i>
            Compte
        </div>
        <div class="text-gray-500">
            <a href="{{route('cp.plancompte.index', $classe)}}" class=" hover:text-orange-500 mr-2">
                <i class="fal fa-list fa-lg"></i>
            </a>
        </div>
    </div>
    <div class="card-body">
        <x-alert></x-alert>
        <div class="flex justify-center bg-cyan-700 w-full py-2 text-center uppercase font-bold text-white text-opacity-50 shadow-md mb-5">
            {{$etatFi->libelle_rubrique}}
        </div>
        <div class="card-content">

            <form id="frmCompte" method="post" action="{{$url}}">
                <div class="space-y-4 mb-3">
                        @csrf
                        @if(!empty($rubrique))
                            <input type="hidden" name="rubrique" value="{{$rubrique}}">
                        @endif
                        @if(!empty($parent))
                            <input type="hidden" name="parent" value="{{$parent}}">
                        @endif
                        <div>
                            <div class="text-sm text-gray-500">
                                Compte
                            </div>
                            <div>
                                <input type="text" name="numCompte" value="{{ !empty($compte->id_compte) ? $compte->id_compte : old('numCompte')  }}"
                                @if(!empty($compte->id_compte)) readonly @endif
                                class="form-control" required>
                                @error('numCompte')
                                    <span class="text-red-500 text-sm">{{$message}}</span>
                                @enderror
                            </div>
                        </div>
                        <div>
                            <div class="text-sm text-gray-500">
                                Libellé
                            </div>
                            <div>
                                <input type="text" name="libelle" value="{{!empty($compte->libelle_compte)?$compte->libelle_compte:old('libelle')}}" class="form-control" required>
                                @error('libelle')
                                    <span class="text-red-500 text-sm">{{$message}}</span>
                                @enderror
                            </div>
                        </div>
                        <div class="flex space-x-3 border-b border-t py-2">
                            <div class="flex items-center">
                                <div class="mr-2">
                                    <input type="checkbox" class="checkbox" name="frontOffice" @if(!empty($compte->front_office)) checked @endif>
                                </div>
                                <div class="text-sm text-gray-500">Front-office</div>
                            </div>
                            <div class="flex items-center">
                                <div class="mr-2">
                                    <input type="checkbox" class="checkbox" name="lettrage"  @if(!empty($compte->lettrage)) checked @endif>
                                </div>
                                <div class="text-sm text-gray-500">Lettrage</div>
                            </div>
                            <div class="flex items-center">
                                <div class="mr-2">
                                    <input type="checkbox" class="checkbox" name="regulariser"  @if(!empty($compte->regulariser)) checked @endif>
                                </div>
                                <div class="text-sm text-gray-500">Suivi de compte</div>
                            </div>
                        </div>
                        <div>
                            <div class="text-sm text-gray-500">
                                Description
                            </div>
                            <div>
                                <textarea name="description" class="form-control" placeholder="La description de compte">{{!empty($compte->description)?$compte->description:old('description')}}</textarea>
                            </div>
                        </div>
                </div>
            </form>
        </div>
        <div class="mt-3 space-x-3">
            <button class="msg-box-show btn btn-warning">
                <i class="fal fa-save mr-1"></i>
                Enregistrer
            </button>

            <a href="{{route('cp.plancompte.index', $classe)}}" class="inline-block btn btn-dark">
                <i class="fal fa-times mr-1"></i>
                Annuler
            </a>
        </div>
    </div>
</div>
<x-msg-box>
    <x-slot name="title">
        Plan comptable
    </x-slot>
    Voulez vous réellement enregister ce compte ?
</x-msg-box>
@endsection

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

        document.querySelector(".msg-box-show").addEventListener("click", function(e){
            e.preventDefault();
            Modal("#MsgBox", "show");
            document.getElementById("btnYes").focus();
        })
        document.getElementById("btnYes").addEventListener("click", function(e){
            e.preventDefault();
            document.getElementById("frmCompte").submit();
        });
    </script>
@endsection