@extends('layouts.app')
@section('title', 'Ticket: '.$ticket->ticket_no)
@section('breadcrumb')
<li class="breadcrumb-item"><a href="{{ route('repairs.index') }}">Repairs</a></li>
<li class="breadcrumb-item active">{{ $ticket->ticket_no }}</li>
@endsection
@section('content')

@php
$rc = ['pending'=>'warning','diagnosing'=>'info','in_progress'=>'primary','completed'=>'success','delivered'=>'success','cancelled'=>'secondary'];
$isOverdue = $ticket->expected_delivery && $ticket->expected_delivery < today() && !in_array($ticket->status, ['delivered','cancelled']);
@endphp

<div class="page-header d-flex justify-content-between align-items-start">
    <div>
        <h1 class="page-title" style="font-family:monospace;">{{ $ticket->ticket_no }}</h1>
        <div class="d-flex gap-2 mt-1">
            <span class="badge bg-{{ $rc[$ticket->status] ?? 'secondary' }}" style="font-size:.875rem;">{{ $ticket->status_name }}</span>
            @if($isOverdue)<span class="badge bg-danger">OVERDUE</span>@endif
            @if($ticket->balance_due > 0)<span class="badge bg-warning text-dark">Balance Due: ৳{{ number_format($ticket->balance_due, 2) }}</span>@endif
        </div>
    </div>
    <div class="d-flex gap-2">
        @can_permission('repair.edit')
        <button class="btn btn-sm btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#statusModal">
            <i class="bi bi-arrow-repeat me-1"></i> Update Status
        </button>
        <a href="{{ route('repairs.edit', $ticket) }}" class="btn btn-sm btn-outline-primary">
            <i class="bi bi-pencil me-1"></i> Edit
        </a>
        @endcan_permission
    </div>
</div>

{{-- Summary Cards --}}
<div class="row g-3 mb-3">
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:#ede9fe;"><i class="bi bi-tools" style="color:#7c3aed;"></i></div>
            <div><span class="badge bg-{{ $rc[$ticket->status] ?? 'secondary' }}" style="font-size:.875rem;">{{ $ticket->status_name }}</span><div class="stat-label mt-1">Status</div></div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:#dbeafe;"><i class="bi bi-person-gear" style="color:#1d4ed8;"></i></div>
            <div><div class="stat-value" style="font-size:1rem;">{{ $ticket->technician?->name ?? 'Unassigned' }}</div><div class="stat-label">Technician</div></div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:#d1fae5;"><i class="bi bi-cash" style="color:#059669;"></i></div>
            <div><div class="stat-value" style="font-size:1rem;">৳{{ number_format($ticket->actual_cost, 2) }}</div><div class="stat-label">Repair Cost</div></div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:{{ $ticket->balance_due > 0 ? '#fee2e2' : '#d1fae5' }};"><i class="bi bi-wallet2" style="color:{{ $ticket->balance_due > 0 ? '#dc2626' : '#059669' }};"></i></div>
            <div><div class="stat-value" style="font-size:1rem;color:{{ $ticket->balance_due > 0 ? '#dc2626' : '#059669' }};">৳{{ number_format($ticket->balance_due, 2) }}</div><div class="stat-label">Balance Due</div></div>
        </div>
    </div>
</div>

<div class="row g-3">
    <div class="col-12 col-md-5">

        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-person me-2"></i>Customer</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.875rem;">
                    <tr><td class="text-muted" style="width:40%;">Name</td><td class="fw-600">{{ $ticket->customer->name }}</td></tr>
                    <tr><td class="text-muted">Phone</td><td>{{ $ticket->customer->phone ?? '—' }}</td></tr>
                    <tr><td class="text-muted">Email</td><td>{{ $ticket->customer->email ?? '—' }}</td></tr>
                </table>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-laptop me-2"></i>Device Details</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.875rem;">
                    <tr><td class="text-muted" style="width:40%;">Device</td><td class="fw-600">{{ $ticket->device_name }}</td></tr>
                    <tr><td class="text-muted">Model</td><td>{{ $ticket->device_model ?? '—' }}</td></tr>
                    <tr><td class="text-muted">Serial No.</td><td><code style="font-size:.8rem;">{{ $ticket->serial_no ?? '—' }}</code></td></tr>
                </table>
            </div>
        </div>

        <div class="card">
            <div class="card-header"><i class="bi bi-calendar me-2"></i>Timeline</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.875rem;">
                    <tr><td class="text-muted" style="width:45%;">Received</td><td>{{ $ticket->received_date->format('d M Y') }}</td></tr>
                    <tr><td class="text-muted">Expected</td>
                        <td style="{{ $isOverdue ? 'color:#dc2626;font-weight:600;' : '' }}">
                            {{ $ticket->expected_delivery?->format('d M Y') ?? '—' }}
                            @if($isOverdue) <span class="badge bg-danger" style="font-size:.62rem;">OVERDUE</span>@endif
                        </td>
                    </tr>
                    <tr><td class="text-muted">Delivered</td><td>{{ $ticket->delivered_date?->format('d M Y') ?? '—' }}</td></tr>
                    <tr><td class="text-muted">Created by</td><td>{{ $ticket->creator->name }}</td></tr>
                </table>
            </div>
        </div>

    </div>

    <div class="col-12 col-md-7">

        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-chat-text me-2"></i>Problem Description</div>
            <div class="card-body" style="font-size:.9rem;white-space:pre-wrap;">{{ $ticket->problem_description }}</div>
        </div>

        @if($ticket->diagnosis)
        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-search me-2" style="color:#7c3aed;"></i>Diagnosis</div>
            <div class="card-body" style="font-size:.9rem;white-space:pre-wrap;">{{ $ticket->diagnosis }}</div>
        </div>
        @endif

        @if($ticket->solution)
        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-check-circle me-2" style="color:#059669;"></i>Solution / Work Done</div>
            <div class="card-body" style="font-size:.9rem;white-space:pre-wrap;">{{ $ticket->solution }}</div>
        </div>
        @endif
	@if(in_array($ticket->status, ['completed','in_progress']))
	@can_permission('repair.deliver')
	<button class="btn btn-sm btn-success" data-bs-toggle="modal" data-bs-target="#deliverModal">
    <i class="bi bi-box-arrow-up me-1"></i> Deliver & Collect
	</button>
	@endcan_permission
	@endif
	<a href="{{ route('repairs.print', $ticket) }}" class="btn btn-sm btn-outline-secondary" target="_blank">
    <i class="bi bi-printer me-1"></i> Print Ticket
	</a>


        <div class="card">
            <div class="card-header"><i class="bi bi-cash-stack me-2"></i>Financials</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.875rem;">
                    <tr><td class="text-muted">Estimated Cost</td><td>৳{{ number_format($ticket->estimated_cost, 2) }}</td></tr>
                    <tr><td class="text-muted">Actual Cost</td><td class="fw-600">৳{{ number_format($ticket->actual_cost, 2) }}</td></tr>
                    <tr><td class="text-muted">Paid Amount</td><td class="text-success fw-600">৳{{ number_format($ticket->paid_amount, 2) }}</td></tr>
                    <tr style="{{ $ticket->balance_due > 0 ? 'background:#fef2f2;' : 'background:#f0fdf4;' }}">
                        <td class="fw-700">Balance Due</td>
                        <td class="fw-800" style="color:{{ $ticket->balance_due > 0 ? '#dc2626' : '#059669' }};">৳{{ number_format($ticket->balance_due, 2) }}</td>
                    </tr>
                </table>
            </div>
        </div>

    </div>
</div>

{{-- Update Status Modal --}}
@can_permission('repair.edit')
<div class="modal fade" id="statusModal" tabindex="-1">
    <div class="modal-dialog"><div class="modal-content" style="border-radius:14px;border:none;">
        <form method="POST" action="{{ route('repairs.status', $ticket) }}">
            @csrf
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title"><i class="bi bi-arrow-repeat me-2"></i>Update Status</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label class="form-label fw-semibold">New Status</label>
                    <select name="status" class="form-select" required>
                        @foreach(App\Models\RepairTicket::STATUSES as $key => $label)
                        <option value="{{ $key }}" {{ $ticket->status === $key ? 'selected' : '' }}>{{ $label }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Diagnosis (optional)</label>
                    <textarea name="diagnosis" class="form-control" rows="2" placeholder="Update diagnosis notes">{{ $ticket->diagnosis }}</textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Solution / Work Done (optional)</label>
                    <textarea name="solution" class="form-control" rows="2" placeholder="What was done">{{ $ticket->solution }}</textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Additional Notes</label>
                    <textarea name="notes" class="form-control" rows="2" placeholder="Any additional update notes (will be appended to problem description)"></textarea>
                </div>
            </div>
            <div class="modal-footer border-0">
                <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                <button type="submit" class="btn btn-primary"><i class="bi bi-check-circle me-1"></i>Update</button>
            </div>
        </form>
    </div></div>
</div>
@endcan_permission
{{-- Deliver & Collect Payment Modal --}}
@if(in_array($ticket->status, ['completed','in_progress']))
@can_permission('repair.deliver')
<div class="modal fade" id="deliverModal" tabindex="-1">
    <div class="modal-dialog"><div class="modal-content" style="border-radius:14px;border:none;">
        <form method="POST" action="{{ route('repairs.deliver', $ticket) }}">@csrf
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title fw-700"><i class="bi bi-box-arrow-up me-2 text-success"></i>Deliver & Collect Payment</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label class="form-label fw-semibold">Actual Repair Cost</label>
                    <div class="input-group"><span class="input-group-text">৳</span>
                    <input type="number" name="actual_cost" class="form-control" value="{{ $ticket->actual_cost }}" min="0" step="0.01" required></div>
                </div>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Amount Collecting Now</label>
                    <div class="input-group"><span class="input-group-text">৳</span>
                    <input type="number" name="paid_amount" class="form-control" value="{{ $ticket->balance_due }}" min="0" step="0.01" required></div>
                </div>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Account</label>
                    <select name="account_id" class="form-select">
                        <option value="">— No payment —</option>
                        @foreach(\App\Models\Account::active()->get() as $acc)
                        <option value="{{ $acc->id }}">{{ $acc->name }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Payment Method</label>
                    <select name="payment_method" class="form-select">
                        <option value="cash">Cash</option>
                        <option value="mobile_banking">Mobile Banking</option>
                        <option value="bank_transfer">Bank Transfer</option>
                    </select>
                </div>
            </div>
            <div class="modal-footer border-0">
                <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                <button type="submit" class="btn btn-success fw-600"><i class="bi bi-check-circle me-1"></i>Mark Delivered</button>
            </div>
        </form>
    </div></div>
</div>
@endcan_permission
@endif
@endsection