@extends('layouts.master')

@push('css')
    <style>
        .badge-large {
            font-size: 1.5rem; /* Ajustez la taille du texte selon vos besoins */
            padding: 0.5rem 1rem; /* Ajustez le padding si nécessaire */
        }
    </style>
@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">Detail {{ @$title }}</h5>
                        </div>
                        <div class="dash-payment-body">
                            <form class="row" action="{{ route("ticketsclients.store") }}" method="post">
                                @csrf


                                @if(\Illuminate\Support\Facades\Auth::user()->pays_id ==null)
                                    <div class="col-sm-6">
                                        <label for="pays_id" class="form-label">@lang("pays_id")</label>
                                        <select id="pays_id" name="pays_id" class="form-control select2">

                                            <option
                                                value="{{$ticketsclients->user->pays_id}}}}">{{$ticketsclients->user->pays->libelle??""}}</option>

                                        </select>
                                    </div>
                                @endif

                                <div class="col-sm-6" style="padding-bottom: 10px">

                                    <label for="title" class="form-label">@lang("title")</label>
                                    <input disabled type="text" id="title" name="title"
                                           class="form-control @error("title") is-invalid @enderror"
                                           value="{{ $ticketsclients->title }}">
                                    @error("title")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror
                                </div>
                                <div class="col-sm-6">
                                    <label for="typetickets_id" class="form-label">@lang("typetickets_id")</label>
                                    <select disabled id="typetickets_id" name="typetickets_id"
                                            class="form-control select2">

                                        <option
                                            value="{{$ticketsclients->typeticket_id}}}}">{{$ticketsclients->typeticket->libelle??""}}</option>

                                    </select>
                                </div>
                                <div class="col-sm-6" style="padding-bottom: 10px">
                                    <label for="client_id" class="form-label">@lang("client_id")</label>
                                    <input disabled type="tel" id="client_id" name="client_id"
                                           class="form-control @error("client_id") is-invalid @enderror"
                                           value="{{ $ticketsclients->user->nom ??""}} {{ $ticketsclients->user->prenoms??"" }}">
                                    @error("client_id")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror

                                </div>

                                <div class="col-sm-6" style="padding-bottom: 10px">
                                    <label for="users_ouverture_id"
                                           class="form-label">@lang("users_ouverture_id")</label>
                                    <input disabled type="text" id="users_ouverture_id" name="users_ouverture_id"
                                           class="form-control @error("users_ouverture_id") is-invalid @enderror"
                                           value="{{ $ticketsclients->userouverture->nom ??""}} {{ $ticketsclients->userouverture->prenoms??"" }}">
                                    @error("users_ouverture_id")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror

                                </div>
                                <div class="col-sm-6" style="padding-bottom: 10px">
                                    <label for="date_ouverture" class="form-label">@lang("date_ouverture")</label>
                                    <input disabled type="timmestamp" id="date_ouverture" name="date_ouverture"
                                           class="form-control @error("date_ouverture") is-invalid @enderror"
                                           value="{{ $ticketsclients->date_ouverture ??""}}">
                                    @error("date_ouverture")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror

                                </div>
                                <div class="col-sm-6" style="padding-bottom: 10px">
                                    <label for="users_cloture_id" class="form-label">@lang("users_cloture_id")</label>
                                    <input disabled type="text" id="users_cloture_id" name="users_cloture_id"
                                           class="form-control @error("users_cloture_id") is-invalid @enderror"
                                           value="{{ $ticketsclients->usercloture->nom ??""}} {{ $ticketsclients->usercloture->prenoms??"" }}">
                                    @error("users_cloture_id")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror

                                </div>
                                <div class="col-sm-6" style="padding-bottom: 10px">
                                    <label for="date_cloture" class="form-label">@lang("date_cloture")</label>
                                    <input disabled type="text" id="date_cloture" name="date_cloture"
                                           class="form-control @error("date_cloture") is-invalid @enderror"
                                           value="{{ $ticketsclients->date_cloture ??""}}">
                                    @error("date_cloture")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror

                                </div>
                                <div class="col-sm-6" style="padding-bottom: 10px">
                                    <label for="users_cloture_id" class="form-label">&nbsp;</label>
                                    @if($ticketsclients->statutTicketClient->id== config('appconstants.statut_ticket.ouvert'))
                                        <span
                                            class="badge-large badge badge--primary">{{ $ticketsclients->statutTicketClient->libelle??"" }}</span>
                                    @else
                                        <span
                                            class="badge-large badge badge--success">{{ $ticketsclients->statutTicketClient->libelle??"" }}</span>
                                    @endif
                                </div>
                                <div class="col-sm-12" style="padding-bottom: 10px">
                                    <label for="observation" required class="form-label">@lang("observation")</label>
                                    <textarea disabled type="text" rows="10" id="observation" name="observation"
                                              class="form-control @error("observation") is-invalid @enderror">{{$ticketsclients->observation??""}}</textarea>
                                    @error("observation")
                                    <div class="invalid-feedback">{{$message}}</div> @enderror
                                </div>
                                <div class="col-12 mt-3">
                                    <a href="{{ route("ticketsclients.index") }}"
                                       class="btn btn-danger">@lang("Annuler")</a>
                                    @if($ticketsclients->statut_ticket_client_id == config('appconstants.statut_ticket.ouvert'))
                                        @can('ticketsclients-statut')
                                            <button type="button" data-toggle="modal" data-target="#exampleModal"
                                                    class="btn btn-warning ms-1"
                                                    onclick="confirmActionstatut(this, 'cloturer' ,{{ $ticketsclients->id }})"
                                                    data-placement="top" title="Cloturer">
                                                <span>Cloturer</span>
                                            </button>
                                        @endcan
                                    @endif
                                </div>

                            </form>
                        </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("ticketsclients.cloturer", [":id", ":action"]) }}';
                    url = url.replace(':id', id).replace(':action', action);

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

                    if (action === 'cloturer') {
                        $("#motifGroup").show();
                    }
                }

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

                }

            });
        </script>
@endsection