@extends('layout.app')
@section('title', 'Asset Fitment')

@section('content')

<div class="app-hero-header d-flex align-items-center">
    <ol class="breadcrumb">
        <li class="breadcrumb-item">Vehicle Maintenance</li>
        <li class="breadcrumb-item">
            <a href="{{ route('asset-assignment.index') }}">Asset Assignment</a>
        </li>
        <li class="breadcrumb-item active">Fit / Replace Asset</li>
    </ol>
</div>

<div class="app-body">
    <div class="row justify-content-center">
        <div class="col-md-10">

            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">Asset Fitment / Replacement</h5>
                </div>

                <div class="card-body">
                    {!! Form::open(['route' => 'asset-assignment.store']) !!}

                    <div class="row gx-3">

                        <!-- Vehicle -->
                        <div class="col-md-4">
                            <label class="form-label">Vehicle *</label>
                            {!! Form::select('vehicle_id', ['' => '-- Select Vehicle --'] + $vehicles, null, [
                                'class' => 'form-control select2',
                                'id' => 'vehicle_id',
                                'required'
                            ]) !!}
                        </div>

                        <!-- Position -->
                        {{-- <div class="col-md-4">
                            <label class="form-label">Position *</label>
                            {!! Form::select('position_id', ['' => '-- Select Position --'] + $positions, null, [
                                'class' => 'form-control select2',
                                'required'
                            ]) !!}
                        </div> --}}

                        <!-- Category -->
                        <div class="col-md-4">
                            <label class="form-label">Category *</label>
                            {!! Form::select('category_id', ['' => '-- Select Category --'] + $categories, null, [
                                'class' => 'form-control select2',
                                'id' => 'category_id',
                                'required'
                            ]) !!}
                        </div>

                        <!-- CURRENT KM -->
                        <div class="col-md-4">
                            <label class="form-label">Vehicle Current KM *</label>
                            {!! Form::number('current_km', null, [
                                'class' => 'form-control',
                                'required',
                                'placeholder' => 'Enter current odometer'
                            ]) !!}
                        </div>

                        <!-- OLD ASSET (AUTO / DISPLAY ONLY) -->
                        <div class="col-md-4">
                            <label class="form-label">Currently Installed Asset</label>
                            <input type="text" id="old_asset_display" class="form-control" readonly placeholder="Auto fetch">
                            <input type="hidden" name="old_asset_id" id="old_asset_id">
                        </div>

                        <!-- NEW ASSET -->
                        <div class="col-md-4">
                            <label class="form-label">New Asset (Serial No) *</label>
                            <select name="asset_id" id="asset_id" class="form-control select2" required>
                                <option value="">-- Select Category First --</option>
                            </select>
                        </div>

                        <!-- FITMENT DATE -->
                        <div class="col-md-4">
                            <label class="form-label">Fitment Date *</label>
                            {!! Form::date('fitment_date', date('Y-m-d'), ['class' => 'form-control']) !!}
                        </div>

                        <!-- REMOVAL REASON -->
                        <div class="col-md-4">
                            <label class="form-label">Removal Reason</label>
                            <input type="text" name="removal_reason" class="form-control" placeholder="Optional">
                        </div>

                        <!-- SUBMIT -->
                        <div class="col-12 text-end mt-3">
                            <button type="submit" class="btn btn-primary">
                                <i class="ri-save-line"></i> Save Fitment
                            </button>
                        </div>

                    </div>

                    {!! Form::close() !!}
                </div>
            </div>

        </div>
    </div>
</div>

@endsection