@extends('layouts.master')
@section('content')
<div class="h">
@include('inc.header-nav')

<div class="mx-auto container-fluid align-items-center pt-150">
    @include('inc.header-profile')

    <div class="card px-0 pt-3 border-radius-xl p-5 mb-5 mb-xl-8 pb-5">
        <div class="card-header px-0 border-0">
            <h3 class="card-title align-items-start flex-column">
                <span class="card-label px-6 fw-bolder fs-3 mb-1">Tickets</span>
                <span class="text-muted mt-1 fw-bold fs-7 px-6">List of tickets</span>
            </h3>

            <div class="p-d-flex p-jc-between px-6 pt-5">
                <button class="btn btn-sm btn-success group-text2 me-5" @click="createTicketModal()">
                    Create New Ticket
                </button>
            </div>
        </div>
        <div class="card-body">
            <div class="table-responsive">
            <table class="table align-middle table-row-dashed table-row-bordered gs-0 gy-4 mb-10">
                <thead>
                    <tr class="fw-bold text-muted bg-light">
                        <th class="ps-4 rounded-start">#</th>
                        <th scope="col">Category</th>
                        <th scope="col">Subject</th>
                        <th scope="col">Description</th>
                        <th scope="col">Status</th>
                        <th class="ps-4 rounded-end"></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($tickets as $ticket)
                    <tr>
                        <th scope="row" class="ps-4"> <a href="/me/tickets/{{$ticket->id }}" class="">{{ $ticket->id }}</a></th>
                        <td>
                            <a href="/me/tickets/{{$ticket->id }}" class="">
                            @if (!is_null($ticket->parent_category))
                                <span class="badge badge-primary me-3">{{  $ticket->parent_category  }} -> </span>
                            @endif
                            <span class="badge badge-success">{{  $ticket->category }} </span>
                            </a>
                        </td>
                        <td> <a href="/me/tickets/{{$ticket->id }}" class="">{{ $ticket->subject }}</a></td>
                        <td>{{ $ticket->description }}</td>
                        <td>
                            @if($ticket->status == 'closed')
                                <span class="badge badge-danger">{{ $ticket->status}}</span>
                            @elseif($ticket->status == 'to do')
                                <span class="badge badge-success" >{{ $ticket->status }}</span>
                            @else
                                <span class="badge badge-primary">{{ $ticket->status }}</span>
                            @endif
                        </td>
                        <td>
                            <a href="/me/tickets/{{$ticket->id }}" class="">
                                <i class="ki-duotone ki-arrow-right text-success fs-2"><span class="path1"></span><span class="path2"></span></i>
                            </a>
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
@endpush