@extends('lay.dnekcab.retsam')

@section('title')
  {{ $page_title }}
@endsection

@section('css')
    <style>
        .table>:not(caption)>*>*{
            padding:0.3rem !important;
        }
    </style>
@endsection

@section('page-content')
@php
    $i = 1;
@endphp
    <div class="page-content">
        <div class="container-fluid">

            <!-- start page title -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-body list-heading">
                            <!-- card-header -->
                            <!--cenario 1: only header, 2:header and add button, 3:header and print, other:header , add button and prin. type:both[pdf,excel], type:[pdf], type:[excel] -->
                            <x-card-header
                                :scenario="'1'"
                                :pageTitle="$page_title"
                            />

                            @php
                                $attachmentPath = public_path('assets/ticket/attachment/' . $ticketDetails->attachment);
                            @endphp

                            <div class="card">
                                <div class="card-body">
                                    <div class="col-md-12">
                                        @if($ticketDetails->assigned_by != auth()->user()->id)
                                            <label class="mt-4 mb-2 me-4 ms-4">
                                                <strong><span>{{ __('ticket.ticket_number') }}</span></strong>
                                                <span><strong>[</strong> {{ $ticketDetails->ticket_number}}<strong> ]</strong> </span>
                                            </label>
                                        @else
                                        <div class="mt-4 mb-2 me-4 ms-4">
                                            @if($ticketDetails->status != 'complete')
                                                <form action="{{ route('completeAssignedTicket', ['id' => encryption($ticketDetails->id)]) }}" method="post" id="completeTicket">
                                                    <div class="row">
                                                        @csrf <!-- Don't forget to include CSRF token for security -->
                                                        <div class="col-md-6">
                                                            <input type="text" class="form-control" name="r_ticket_number" id="ticket_number" required placeholder="{{ __('ticket.enter_ticket_number') }}" />
                                                        </div>
                                                        <div class="col-md-6">
                                                            <button type="submit" class="btn btn-primary">{{ __('ticket.ticket_solved') }}</button>
                                                        </div>
                                                    </div>
                                                </form>
                                                @if (session('status') && session('message'))
                                                    <span class="alert">
                                                        <div class="alert alert-{{ session('status') }}">
                                                            {{ session('message') }}
                                                        </div>
                                                    </span>
                                                @endif
                                            @endif
                                        </div>
                                        @endif
                                        <div class="holder m-4" style="box-shadow:0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);">
                                            <div class="row m-3 pt-4">
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.title') }}</label>
                                                    <p class="text-secondary m-0">{{ $ticketDetails->title}}</p>
                                                </div>
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.type.header') }}</label>
                                                    <p class="text-secondary m-0">
                                                        @switch($ticketDetails->type)
                                                            @case('internet')
                                                                {{ __('ticket.type.internet') }}
                                                                @break
                                                            @case('monitor')
                                                                {{ __('ticket.type.monitor') }}
                                                                @break
                                                            @case('windows')
                                                                {{ __('ticket.type.windows') }}
                                                                @break
                                                            @case('other')
                                                                {{ __('ticket.type.other') }}
                                                                @break
                                                            @default
                                                        @endswitch
                                                    </p>
                                                </div>
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.date') }}</label>
                                                    <p class="text-secondary m-0">{{ getHijriDate($ticketDetails->date) }}</p>
                                                </div>
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.time') }}</label>
                                                    <p class="text-secondary m-0">{{ $ticketDetails->time}}</p>
                                                </div>
                                            </div>
                                            <hr>
                                            <div class="row m-3 pb-4">
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.status.header') }}</label>
                                                    <p class="text-secondary m-0">
                                                        @switch($ticketDetails->status)
                                                            @case('pending')
                                                                {{ __('ticket.status.pending') }}
                                                                @break
                                                            @case('inprogress')
                                                                {{ __('ticket.status.inprogress') }}
                                                                @break
                                                            @case('complete')
                                                                {{ __('ticket.status.complete') }}
                                                                @break
                                                            @case('archive')
                                                                {{ __('ticket.status.archive') }}
                                                                @break
                                                            @default
                                                        @endswitch
                                                    </p>
                                                </div>
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.request_user') }}</label>
                                                    <p class="text-secondary m-0">{{ $ticketDetails->requestUser->name }}</p>
                                                </div>
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.assigned_user') }}</label>
                                                    <p class="text-secondary m-0">{{ $ticketDetails->assigner->name ?? '' }}</p>
                                                </div>
                                                <div class="col-md-3">
                                                    <label> {{ __('ticket.created_date') }}</label>
                                                    <p class="text-secondary m-0">{{ getHijriDate($ticketDetails->created_at) }}</p>
                                                </div>
                                            </div>
                                            <hr>
                                            <div class="row m-3 pb-4">
                                                <div class="col-md-9">
                                                    <label> {{ __('ticket.description') }}</label>
                                                    <p class="text-secondary m-0">{{ $ticketDetails->description }}</p>
                                                </div>
                                                @if($ticketDetails->attachment != null && file_exists($attachmentPath))
                                                    <div class="col-md-3">
                                                        <label style="display: block;"> {{ __('ticket.attachment') }}</label>
                                                        <a href="{{ asset(('assets/ticket/attachment/' . $ticketDetails->attachment))}}" target="_blank">
                                                            <i class="fas fa-eye"></i>
                                                        </a>
                                                    </div>
                                                @endif
                                            </div>
                                        </div>
                                        <hr>
                                        <div class="col-12 mb-3 mt-3">
                                            <div class="row m-4">
                                                <div class="row p-0 m-0">
                                                    <x-ticket-approval
                                                        :ticket="$ticketDetails"
                                                        :availableUsers="$availableUsers"/>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            @if($ticketsQueue->isNotEmpty())
                            <div class="card">
                                <div class="card-body">
                                    <div class="col-md-12">
                                        <div class="row m-3 pt-4">
                                            <div class="col-md-12">
                                                <h4>{{__('ticket.ticket_queue')}}</h4>
                                                <hr>
                                                <div class="table-responsive">
                                                    <table class="table table-hover table-bordered fs-10">
                                                        <thead class="sticky-top shadow-sm">
                                                            <tr>
                                                                <th>{{ __('global.no')}}</th>
                                                                <th>{{ __('ticket.ticket_number')}}</th>
                                                                <th>{{ __('ticket.title')}}</th>
                                                                <th>{{ __('ticket.description')}}</th>
                                                                <th>{{ __('ticket.date')}}</th>
                                                                <th>{{ __('ticket.time')}}</th>
                                                                <th>{{ __('ticket.request_user')}}</th>
                                                                <th>{{ __('ticket.type.header')}}</th>
                                                                <th>{{ __('ticket.status.header')}}</th>
                                                                <th>{{ __('ticket.created_date')}}</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            @foreach($ticketsQueue as $ticket)
                                                                <tr id="tr-{{ $i }}"
                                                                        class="v-align-middle alert @if($ticket->user_id == auth()->user()->id) alert-warning @endif @if($ticket->status == 'inprogress') alert-info @endif"
                                                                    >
                                                                    <td>
                                                                        <button type="button" class="btn btn-sm text-center btn-primary lh-10">{{$i++}}</button>
                                                                    </td>
                                                                    <td>
                                                                        @if($ticket->assigned_by != auth()->user()->id)
                                                                            {{$ticket->ticket_number}}
                                                                        @endif
                                                                    </td>
                                                                    <td>{{$ticket->title}}</td>
                                                                    <td>{{$ticket->description}}</td>
                                                                    <td>{{ getHijriDate($ticket->date) }}</td>
                                                                    <td>{{$ticket->time}}</td>
                                                                    <td>{{$ticket->requestUser->name}}</td>
                                                                    <td>
                                                                        @if($ticket->type == 'internet') {{ __('ticket.type.internet') }}
                                                                        @elseif($ticket->type == 'monitor') {{ __('ticket.type.monitor') }}
                                                                        @elseif($ticket->type == 'windows') {{ __('ticket.type.windows') }}
                                                                        @else {{ __('ticket.type.other') }}
                                                                        @endif
                                                                    </td>
                                                                    <td>
                                                                        @if($ticket->status == 'pending') {{ __('ticket.status.pending') }}
                                                                        @elseif($ticket->status == 'inprogress') {{ __('ticket.status.inprogress') }}
                                                                        @elseif($ticket->status == 'complete') {{ __('ticket.status.complete') }}
                                                                        @else {{ __('ticket.status.archive') }}
                                                                        @endif
                                                                    </td>
                                                                    <td>{{ getHijriDate($ticket->created_at) }}</td>
                                                                </tr>
                                                            @endforeach
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
            <!-- end page title -->

        </div> <!-- container-fluid -->
    </div>



@endsection

@section('js')
    <!-- jquery step -->
    <script src="{{asset('assets/libs/jquery-steps/build/jquery.steps.min.js')}}"></script>
    <!-- form wizard init -->
    <script src="{{asset('assets/dnekcab/js/pages/form-wizard.init.js')}}"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            let ticket = "{{ $ticketDetails->id }}";

            $(document).on("submit", '#assignPersonTicket', function(e){// add new leave in the system
                e.preventDefault();

                if(!validateForm('assignPersonTicket')){
                    return false;
                }

                var formData = new FormData();
                formData.append('_token', "{{ csrf_token() }}");

                $.ajax({
                    url: $(this).attr('action'),
                    type: "POST",
                    data: new FormData(this),
                    contentType: false,
                    cache: false,
                    processData: false,
                    headers: {
                        "X-CSRF-TOKEN": "{{ csrf_token() }}"  // Set the CSRF token in the request headers
                    },
                    success:function(result){
                        if(result.status == 'success'){
                            toastr.options =
                            {
                                "closeButton" : true,
                                "progressBar" : true
                            }
                            toastr.success(result.message);
                            setTimeout(function() {
                                    window.location.href = '{{ route("activeTicket") }}';
                            }, 2000); // 2 seconds in milliseconds (1000 milliseconds = 1 second
                        } else {
                            toastr.options =
                            {
                                "closeButton" : true,
                                "progressBar" : true
                            }
                            toastr.error(result.message);
                        }
                    },
                    error:function(result){
                        console.log(result, 'error');
                        var errors = result.responseJSON;
                        toastr.options =
                        {
                        "closeButton" : true,
                        "progressBar" : true
                        }
                        toastr.error(result.message);
                    }
                });

            });

        });
    </script>
@endsection