@extends('layouts.admin')

@section('content')
@php
    use App\Support\Crm\TicketOptions;
@endphp
<div class="container-fluid">
    @include('elements.admin-breadcrumb')
    @include('elements.alert')

    <div class="row">
        <div class="col-lg-8">
            <div class="card mb-3">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <strong>{{ $ticket->ticket_no }}</strong>
                    <div class="d-flex gap-2">
                        @can('admin.crm-ticket.edit')
                        <a href="{{ route('admin.crm-ticket.edit', $ticket->id) }}" class="btn btn-sm btn-primary">
                            <i class="fa fa-edit"></i> Edit
                        </a>
                        @endcan
                        @if($ticket->contact_id)
                        <a href="{{ route('admin.crm-contact.show', $ticket->contact_id) }}" class="btn btn-sm btn-light">Contact</a>
                        @endif
                        <a href="{{ route('admin.crm-ticket.index') }}" class="btn btn-sm btn-light">Back</a>
                    </div>
                </div>
                <div class="card-body">
                    <table class="table table-bordered mb-0">
                        <tr><th width="30%">Status</th>
                            <td>
                                @can('admin.crm-ticket.edit')
                                <select id="ticketStatus" class="form-select form-select-sm w-auto d-inline-block"
                                        data-url="{{ route('admin.crm-ticket.update-status') }}" data-id="{{ $ticket->id }}">
                                    @foreach(TicketOptions::statuses() as $status)
                                        <option value="{{ $status }}" {{ $ticket->status === $status ? 'selected' : '' }}>{{ $status }}</option>
                                    @endforeach
                                </select>
                                @else
                                    {{ $ticket->status }}
                                @endcan
                            </td>
                        </tr>
                        <tr><th>Priority</th><td>{{ $ticket->priority }}</td></tr>
                        <tr><th>Channel</th><td>{{ $ticket->channel }}</td></tr>
                        <tr><th>Category</th><td>{{ $ticket->category }}</td></tr>
                        <tr><th>Name</th><td>{{ $ticket->contact_name }}</td></tr>
                        <tr><th>Mobile</th><td>{{ $ticket->mobile }}</td></tr>
                        <tr><th>Email</th><td>{{ $ticket->email ?: '—' }}</td></tr>
                        <tr><th>Reference</th><td>{{ $ticket->reference_no ?: '—' }}</td></tr>
                        <tr><th>Assigned To</th><td>{{ $ticket->assignedUser?->name ?: '—' }}</td></tr>
                        <tr><th>Created By</th><td>{{ $ticket->createdBy?->name ?: '—' }}</td></tr>
                        <tr><th>Created</th><td>{{ optional($ticket->created_at)->format('d-m-Y h:i A') }}</td></tr>
                        <tr><th>Description</th><td>{!! nl2br(e($ticket->description)) ?: '—' !!}</td></tr>
                    </table>

                    @if($ticket->attachments->count())
                        <h6 class="mt-4">Attachments</h6>
                        <ul>
                            @foreach($ticket->attachments as $file)
                                <li><a href="{{ asset('uploads/crmTicketFiles/' . $file->file_name) }}" target="_blank">{{ $file->file_name }}</a></li>
                            @endforeach
                        </ul>
                    @endif
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card">
                <div class="card-header"><strong>Notes</strong></div>
                <div class="card-body">
                    @can('admin.crm-ticket.edit')
                    <form method="POST" action="{{ route('admin.crm-ticket.notes-store', $ticket->id) }}" class="mb-3">
                        @csrf
                        <div class="mb-2">
                            <textarea name="note" class="form-control" rows="3" required placeholder="Add note..."></textarea>
                        </div>
                        <div class="mb-2">
                            <input type="date" name="reminder_date" class="form-control" placeholder="Reminder date">
                        </div>
                        <button type="submit" class="btn btn-sm btn-primary">Add Note</button>
                    </form>
                    @endcan

                    @forelse($ticket->notes as $note)
                        <div class="border rounded p-2 mb-2">
                            <div class="small text-muted mb-1">
                                {{ $note->createdBy?->name ?: '—' }} · {{ optional($note->created_at)->format('d-m-Y h:i A') }}
                                @if($note->reminder_date)
                                    · Reminder: {{ $note->reminder_date->format('d-m-Y') }}
                                @endif
                            </div>
                            <div>{!! nl2br(e($note->note)) !!}</div>
                            @can('admin.crm-ticket.delete')
                            <form method="POST" action="{{ route('admin.crm-ticket.notes-destroy', $note->id) }}" class="mt-1"
                                  onsubmit="return confirm('Delete this note?')">
                                @csrf
                                @method('DELETE')
                                <button class="btn btn-link btn-sm text-danger p-0">Delete</button>
                            </form>
                            @endcan
                        </div>
                    @empty
                        <p class="text-muted mb-0">No notes yet.</p>
                    @endforelse
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
$('#ticketStatus').on('change', function () {
    var $el = $(this);
    $.post($el.data('url'), {
        _token: '{{ csrf_token() }}',
        id: $el.data('id'),
        status: $el.val()
    }).done(function () {
        // ok
    }).fail(function (xhr) {
        alert(xhr.responseJSON?.message || 'Failed to update status');
    });
});
</script>
@endsection