<!-- Ajouter transaction =============================================================  -->
<div class="modal animate__animated animate__fadeInLeft" id="modalAjouterOperation">
    <div onclick="closeForm('modalAjouterOperation')" class="modal-background"></div>
    <div class="modal-card">
        <header class="modal-card-head">
            <p class="modal-card-title">Ajouter opération</p>
            <button type="button" onclick="closeForm('modalAjouterOperation')" class="delete" aria-label="close"></button>
        </header>
        <section class="modal-card-body">
            <div class="content">
                <form id="form_ajouter_operation">
                    @csrf
                    <div class="field">
                        <label class="label title is-6" for="libelle_operation_id">Libelle</label>
                        <p class="control">
                            <input id="libelle_operation_id"
                                class="input is-info is-rounded
                                @error('libelle_matiere') is-invalid @enderror"
                                type="text" placeholder="Libellé opération" name="libelle_operation" required />
                        </p>
                        @error('libelle_operation')
                            <div class="help is-danger error">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="field mb-5">
                        <label class="label title is-6" for="type_operation_id">Type</label>
                        <div class="control">
                            <div class="select is-info is-rounded">
                                <select id="type_operation_id" name="type_operation"
                                    class="@error('type_operation') is-invalid @enderror" required>
                                    <option value="" disabled selected>Sélectionner</option>
                                    <option value="depense">Dépense</option>
                                    <option value="encaissement">Encaissement</option>
                                </select>
                            </div>
                        </div>
                        @error('niveau_matiere')
                            <div class="help is-danger error">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="field">
                        <label class="label title is-6" for="montant_operation_id">Montant</label>
                        <p class="control">
                            <input id="montant_operation_id"
                                class="input-numeral input is-info is-rounded
                                @error('montant_operation') is-invalid @enderror"
                                type="text" placeholder="25 000" name="montant_operation" required />
                        </p>
                        @error('montant_operation')
                            <div class="help is-danger error">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="field" id="field_coef">
                        <label class="label title is-6" for="description_operation_id">Description</label>
                        <p class="control">
                            <textarea id="description_operation_id"
                                class="textarea is-info is-rounded
                                @error('description_operation') is-invalid @enderror"
                                placeholder="Description de l'opération" name="description_operation" required></textarea>
                        </p>
                        @error('description_operation')
                            <div class="help is-danger error">{{ $message }}</div>
                        @enderror
                    </div>
                    <button id="btn_submit_form_ajouter_operation" hidden></button>
                    <button type="reset" class="btn_reset" hidden></button>
                </form>
            </div>
        </section>
        <footer class="modal-card-foot">
            <button type="button" onclick="closeForm('modalAjouterOperation')"
                class="button is-light is-danger is-rounded">Annuler</button>
            <button onclick="$('#btn_submit_form_ajouter_operation').click()" class="button is-info is-rounded">Ajouter
                la transaction</button>
        </footer>
    </div>
</div>
