@extends('layouts.master')

@push('css')

@endpush

@section('breadcrumb')
    @include('components.breadcrumb',['breadcrumbs' => [
        [
            'name'  => __("Dashboard"),
            'url'   => route("home"),
        ]
    ], 'active' => __(@$title)])
@endsection

@section('content')
    <div class="body-wrapper">
        <div class="row justify-content-center mb-30-none">
            <div class="col-xl-12 mb-30">
                <div class="dash-payment-item-wrapper">
                    <div class="dash-payment-item active" >
                        <div class="dash-payment-title-area">
                            <span class="dash-payment-badge" onclick="toggleActive(event)">!</span>
                            <h5 class="title">Voir {{ @$title }}</h5>
                        </div>
                        <div class="dash-payment-body">
                            <div class="col-xl-12 col-lg-6 mb-20">
                                <div class=" mt-10">

                                    <div class="card-body profile-body-wrapper">
                                        {!! Form::model($validationmonnaievirtuelle, ['method' => 'PATCH','route' => ['validationmonnaievirtuelle.update', $validationmonnaievirtuelle->id],"enctype"=>"multipart/form-data"]) !!}
                                        {{--                        <form class="row" action="{{ route("users.update",$user) }}" method="post" enctype="multipart/form-data">--}}
                                        @csrf

                                        <div class="row">


                                            <div class="col-sm-6" >
                                                <label for="userdemande_id" class="form-label">@lang("userdemande_id")</label>
                                                <select  id="userdemande_id" disabled name="userdemande_id" class="form-control select2 @error("userdemande_id") is-invalid @enderror">
                                                    <option value=""> ---- @lang("userdemande_id") ----</option>
                                                    @foreach ( $users as $user)
                                                        <option value="{{$user->id}}" @if($validationmonnaievirtuelle->userDemande->id == $user->id) selected @endif>{{$user->nom??""}} {{$user->prenoms??""}}</option>
                                                    @endforeach
                                                </select>
                                                @error("pointrelais_id") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>
                                            <div class="col-sm-6" >
                                                <label for="devise_id" class="form-label">@lang("devise_id")</label>
                                                <select  id="devise_id" disabled name="devise_id" class="form-control select2 @error("devise_id") is-invalid @enderror">
                                                    <option value=""> ---- @lang("devise_id") ----</option>
                                                    @foreach ( $devises as $devise)
                                                        <option value="{{$devise->id}}" @if($validationmonnaievirtuelle->devise->id == $devise->id) selected @endif>{{$devise->libelle}}</option>
                                                    @endforeach
                                                </select>
                                                @error("devise_id") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>
                                            <div class="col-sm-6">
                                                <label for="montantdepose"  class="form-label">@lang('montantdepose')</label>
                                                <input  type="number" disabled id="montantdepose" name="montantdepose" class="form-control @error("montantdepose") is-invalid @enderror" required value="{{ $validationmonnaievirtuelle->montantdepose }}">
                                                @error("montantdepose") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>
                                            <div class="col-sm-6">
                                                <label for="montantacreer"  class="form-label">@lang('montantacreer')</label>
                                                <input  type="number" disabled id="montantacreer" name="montantacreer" class="form-control @error("montantacreer") is-invalid @enderror" required value="{{ $validationmonnaievirtuelle->montantacreer }}">
                                                @error("montantacreer") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>
                                            <div class="col-sm-6">
                                                <label for="datedemande" class="form-label">@lang('datedemande')</label>
                                                <input  type="datetime" disabled id="datedemande" name="datedemande" class="form-control @error("datedemande") is-invalid @enderror" required value="{{ $validationmonnaievirtuelle->datedemande }}">
                                                @error("datedemande") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>
                                            <div class="col-sm-6">
                                                <label for="nom_deposant" class="form-label">@lang('nom_deposant')</label>
                                                <input  type="text" disabled id="nom_deposant" name="nom_deposant" class="form-control @error("datedemande") is-invalid @enderror" required value="{{ $validationmonnaievirtuelle->nom_deposant }}">
                                                @error("nom_deposant") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>


                                            <div class="col-6" style="padding-top: 8px">
                                                <label class="form-label">@lang("fichier_id")</label>
                                                <div class="z-depth-1-half mb-3">
                                                    <a href="{{ $fichiers ? url('/images/'.$fichiers['nom']) : '#' }}" class="popup-image" download oncontextmenu="return false;">
                                                        <img class="images-preview-fichier_id" id="preview-image-before-upload" src="{{ $fichiers ? url('/images/'.$fichiers['nom']) : 'https://caer.univ-amu.fr/wp-content/uploads/default-placeholder.png' }}"
                                                             alt="preview image" style="max-height: 150px;">
                                                    </a>
{{--                                                    <input id="fichier_id" type="file" name="fichier_id" class="form-control  @error("fichier_id") is-invalid @enderror" placeholder="photo">--}}
                                                </div>
                                            </div>
                                            <div class="col-sm-12">
                                                <label for="commentaire" class="form-label">@lang('commentaire')</label>
                                                <textarea   disabled id="commentaire" name="commentaire" class="form-control @error("commentaire") is-invalid @enderror" rows="5" required >{{ $validationmonnaievirtuelle->commentaire??"" }}</textarea>
                                                @error("commentaire") <div class="invalid-feedback">{{$message}}</div> @enderror
                                            </div>


                                        </div>
                                        <input type="number" hidden  id="version" name="version" class="form-control" value="{{ $validationmonnaievirtuelle->version }}">
                                        <input type="hidden" id="idModel" name="id" class="form-control" value="{{ $validationmonnaievirtuelle->id }}">
                                        <div class="col-12 mt-3 d-flex justify-content-between">
                                            <a href="{{ route("validationmonnaievirtuelle.index") }}" class="btn btn-danger">@lang("Annuler")</a>
                                            <div>
                                                @can('validationmonnaievirtuelle-statut')
                                                    @if($validationmonnaievirtuelle->statutMonnaievirtuelle->id == config("appconstants.statut_monnaievirtuelle.en_attente"))
                                                        <button type="button" data-toggle="modal" data-target="#exampleModal" class="btn btn-warning ms-1"
                                                                onclick="confirmActionstatut(this, 'rejeter' ,{{ $validationmonnaievirtuelle->id }})"  data-placement="top" title="Rejeter">
                                                            <span>Rejeter</span>
                                                        </button>
                                                        <button type="button" data-toggle="modal" data-target="#exampleModal" class="btn btn-success ms-1"
                                                                onclick="confirmActionstatut(this, 'valider' ,{{ $validationmonnaievirtuelle->id }})"  data-placement="top" title="Valider">
                                                            <span>Valider</span>
                                                        </button>

                                                    @endif
                                                @endcan
                                            </div>
                                        </div>

                                    </div>
                                    {!! Form::close() !!}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"style="position:fixed;top:20%; ;transform:translate(-50%;-50%)" aria-labelledby="exampleModalLabel" aria-hidden="true">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="exampleModalLabel">@lang("Confirmation")</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                            <form method="post" id="statutForm1">
                                @csrf
                                @method("put")
                                <div class="modal-body">
                                    <p>
                                        @lang("QuestionConfirmation")
                                    </p>
                                    <div class="form-group" id="motifGroup" style="display: none;">
                                        <textarea id="motif" placeholder="Veuillez saisire le motif" required name="motif" class="form-control"></textarea>
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-danger" data-dismiss="modal"> @lang("Non")</button>
                                    <button class="btn btn-primary" onclick="submitForm()">@lang("Oui")</button>
                                </div>
                            </form>
                        </div>

                    </div>
                </div>
            </div>

            <script>

                $(document).ready(function () {
                    window.confirmActionstatut = function (input, action, id) {
                        var url = '{{ route("validationmonnaievirtuelle.validation", [":id", ":action"]) }}';
                        url = url.replace(':id', id).replace(':action', action);

                        $("#statutForm1").prop("action", url);

                        if (action === 'rejeter') {
                            $("#motifGroup").show();
                        } else {
                            $("#motifGroup").hide();
                        }
                    }

                    window.submitForm = function() {
                        var action = $('#statutForm1').prop("action");
                        var motif = $('#motif').val();
                        if (action.includes('rejeter') && motif) {
                            action += '/' + encodeURIComponent(motif);
                        }
                        $('#statutForm1').prop("action", action);
                        $('#statutForm1').submit();

                    }

                });
                $(function() {
// Multiple images preview with JavaScript
                    var previewImages = function(input, imgPreviewPlaceholder) {
                        if (input.files) {
                            var filesAmount = input.files.length;
                            for (i = 0; i < filesAmount; i++) {
                                var reader = new FileReader();
                                reader.onload = function(event) {
                                    // $($.parseHTML('<img style="max-height: 200px;">')).attr('src', event.target.result).appendTo(imgPreviewPlaceholder);
                                    $(imgPreviewPlaceholder).attr("src", event.target.result);
                                }
                                reader.readAsDataURL(input.files[i]);
                            }
                        }
                    };
                    $('#fichier_id').on('change', function() {
                        previewImages(this, 'img.images-preview-fichier_id');
                    });
                });
            </script>
@endsection