@extends('layout.app')
@section('title', 'Edit Remark - ' . ($remark->vehicle->vehicle_no ?? 'Vehicle'))

@push('header_script')
<link rel="stylesheet" href="{{ asset('theme/assets/vendor/daterange/daterange.css') }}">
@endpush

@section('content')
<div class="app-hero-header d-flex align-items-center mb-3">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="javascript:void(0);">Fleet Management</a></li>
        <li class="breadcrumb-item"><a href="{{ route('vehicle-remarks.index') }}">Multiple Remark List</a></li>
        <li class="breadcrumb-item active" aria-current="page">Edit Remark</li>
    </ol>
    <div class="ms-auto">
        @if(!empty($redirectTo) && $redirectTo === 'performance')
            <a href="{{ url('vehicle-performance/' . ($performanceId ?: $remark->vehicle_id) . '?tab=tab3') }}" class="btn btn-outline-primary btn-sm">
                <i class="ri-arrow-go-back-line"></i> Back to Truck Performance
            </a>
        @else
            <a href="{{ route('vehicle-remarks.create', ['vehicle_id' => $remark->vehicle_id]) }}" class="btn btn-outline-primary btn-sm">
                <i class="ri-arrow-go-back-line"></i> Back
            </a>
        @endif
    </div>
</div>

<div class="app-body">
    <div class="row">
        <div class="col-12 col-md-8 mx-auto">
            <div class="card shadow-sm border">
                <div class="card-header bg-white py-3">
                    <h6 class="card-title m-0 fw-bold text-primary">
                        <i class="ri-edit-line me-1"></i> Edit Vehicle Remark
                    </h6>
                </div>
                <div class="card-body p-4">
                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul class="mb-0">
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                    <form action="{{ route('vehicle-remarks.update', $remark->id) }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')
                        <input type="hidden" name="vehicle_id" value="{{ $remark->vehicle_id }}">
                        <input type="hidden" name="redirect_to" value="{{ $redirectTo ?? '' }}">
                        <input type="hidden" name="performance_id" value="{{ $performanceId ?? '' }}">

                        <div class="mb-3">
                            <label class="form-label fw-bold">Truck / Vehicle</label>
                            <input type="text" class="form-control bg-light" readonly value="{{ $remark->vehicle->vehicle_no ?? 'N/A' }}">
                        </div>

                        <div class="mb-3">
                            <label class="form-label fw-bold">Date <span class="text-danger">*</span></label>
                            <input type="text" name="date" class="form-control datepicker" value="{{ date('d-m-Y', strtotime($remark->date)) }}" required>
                        </div>

                        <div class="mb-3">
                            <label class="form-label fw-bold">Remark <span class="text-danger">*</span></label>
                            <textarea name="remark" class="form-control" rows="3" required>{{ old('remark', $remark->remark) }}</textarea>
                        </div>

                        <div class="mb-4">
                            <label class="form-label fw-bold">Attachment / Photo</label>
                            @if(!empty($photoUrl))
                                <div class="mb-2">
                                    <span class="small text-muted me-2">Current Photo:</span>
                                    <a href="{{ $photoUrl }}" target="_blank" class="btn btn-sm btn-outline-info">
                                        <i class="ri-image-line"></i> View Attachment
                                    </a>
                                </div>
                            @endif
                            <input type="file" name="photo" class="form-control" accept="image/*,application/pdf">
                            <small class="text-muted">Leave empty to keep existing attachment.</small>
                        </div>

                        <div class="d-flex justify-content-end gap-2">
                            @if(!empty($redirectTo) && $redirectTo === 'performance')
                                <a href="{{ url('vehicle-performance/' . ($performanceId ?: $remark->vehicle_id) . '?tab=tab3') }}" class="btn btn-light">Cancel</a>
                            @else
                                <a href="{{ route('vehicle-remarks.create', ['vehicle_id' => $remark->vehicle_id]) }}" class="btn btn-light">Cancel</a>
                            @endif
                            <button type="submit" class="btn btn-primary px-4">Update Remark</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('footer_script')
<script src="{{ asset('theme/assets/vendor/daterange/daterange.js') }}"></script>
<script>
$(document).ready(function() {
    $('.datepicker').daterangepicker({
        singleDatePicker: true,
        locale: { format: 'DD-MM-YYYY' }
    });
});
</script>
@endpush