@extends('admin.layouts.layouts')

@section('title', 'Edit | Asset Inventory')

@section('page-css')
    <style>
        .owner_details {
            border: 2px solid #ccc;
            border-radius: 10px;
            padding: 15px;
            margin-bottom: 15px;
        }
    </style>
@endsection

@section('content')
    <div class="page-header">
        <h3 class="page-title">Edit Asset Inventory</h3>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
                <li class="breadcrumb-item"><a href="{{ route('asset-inventory.index') }}">Asset Inventory</a></li>
                <li class="breadcrumb-item active" aria-current="page">Edit</li>
            </ol>
        </nav>
    </div>
    <div class="card">
        {!! Form::open([
            'route' => 'asset-inventory.store',
            'method' => 'POST',
            'id' => 'asset-inventory-form',
            'enctype' => 'multipart/form-data',
        ]) !!}
        @csrf
        {!! Form::hidden('id', $assetInventoryDetail->id, ['id' => 'id']) !!}
        <div class="card-body">
            <div class="row">
                <div class="col-md-4">
                    <div class="form-group">
                        <label for="asset_category_id" class="form-label">Asset Category <span
                                class="text-danger">*</span></label>
                        <select name="asset_category_id" id="asset_category_id"
                            class="form-control form-control-lg" data-parsley-required
                            data-parsley-required-message="Please select asset category"
                            data-parsley-errors-container='#asset_category_id_error'>
                            <option value="">Select Asset Category</option>
                            @foreach ($assetCategories as $key => $assetCategory)
                                <option value="{{ $key }}"
                                    {{ old('asset_category_id', $assetInventoryDetail->asset_category_id) == $key ? 'selected' : '' }}>
                                    {{ $assetCategory }}
                                </option>
                            @endforeach
                        </select>
                        <span class="text-danger"
                            id="asset_category_id_error">{{ $errors->first('asset_category_id') }}</span>
                    </div>
                </div>

                <div class="col-md-4">
                    <div class="form-group">
                        <label for="asset_id" class="form-label">Asset <span
                                class="text-danger">*</span></label>
                        <select name="asset_id" id="asset_id"
                            class="form-control form-control-lg" data-parsley-required
                            data-parsley-required-message="Please select asset"
                            data-parsley-errors-container='#asset_id_error'>
                            <option value="">Select Asset</option>
                        </select>
                        <span class="text-danger"
                            id="asset_id_error">{{ $errors->first('asset_id') }}</span>
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        <label for="no_of_items" class="form-label">Number <span class="text-danger">*</span></label>
                        <input type="text" class="form-control number" id="no_of_items" name="no_of_items"
                            value="{{ old('no_of_items', $assetInventoryDetail->no_of_items) }}" placeholder="Enter Number" data-parsley-required
                            data-parsley-required-message="Please enter number"
                            data-parsley-type="digits" data-parsley-type-message="Please enter valid number"
                            data-parsley-errors-container='#no_of_items_error'>
                        <span class="text-danger" id="no_of_items_error"></span>
                    </div>
                </div>
                <div class="col-md-1 mt-4">
                    <a class="btn btn-sm btn-primary" id="addAssetInventoryItem"><i class="fa fa-plus"></i> Add</a>
                </div>
            </div>
            {{-- <div class="row mt-3" id="serialNoContainer">
                @foreach($assetInventoryDetail->assetInventoryItems as $index => $item)
                    <div class="col-md-3 serial-field" data-index="{{ $index+1 }}">
                        <div class="form-group d-flex align-items-end">
                            <div style="flex:1">
                                <label class="form-label">Serial No {{ $index+1 }} <span class="text-danger">*</span></label>
                                <input type="text" class="form-control"
                                    name="serial_no[]"
                                    value="{{ old('serial_no.'.$index, $item->serial_no) }}"
                                    placeholder="Enter Serial No"
                                    data-parsley-required
                                    data-parsley-required-message="Please enter serial no">
                            </div>
                            <button type="button" class="btn btn-danger btn-sm ml-2 remove-serial">
                                <i class="fa fa-trash"></i>
                            </button>
                        </div>
                    </div>
                @endforeach
            </div> --}}

            <div class="row mt-3">
                <div class="col-md-6">
                    <table class="table table-bordered" id="serialNoTable">
                        <thead>
                            <tr>
                                <th>Serial No</th>
                                <th>Generated Code</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody id="serialNoContainer">
                            @foreach($assetInventoryDetail->assetInventoryItems as $index => $item)
                                <tr class="serial-field" data-index="{{ $loop->iteration }}">
                                    <td>
                                        <input type="text" class="form-control"
                                            name="serial_no[]"
                                            value="{{ $item->serial_no }}"
                                            placeholder="Enter Serial No"
                                            data-parsley-required
                                            data-parsley-required-message="Please enter serial no">
                                    </td>
                                    <td>
                                        <input type="text" class="form-control generated-code"
                                            name="generated_code[]"
                                            value="{{ $item->code }}" readonly>
                                    </td>
                                    <td>
                                        <!-- Remove button will be shown only for last row via JS -->
                                        <button type="button" class="btn btn-danger btn-sm remove-serial">
                                            <i class="fa fa-trash"></i>
                                        </button>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="card-footer">
            <button type="submit" class="btn btn-primary btn-fw" id="addAssetInventory">Update</button>
            <a href="{{ route('asset-inventory.index') }}" class="btn btn-light btn-fw">Cancel</a>
        </div>
        {{ Form::close() }}
    </div>
@endsection

@section('page-js')
    <script type="text/javascript">
        var assetInventoryList = "{{ route('asset-inventory.index') }}";
        var assetInventoryStore = "{{ route('asset-inventory.store') }}";
        var getAssetByAssetCategory = "{{ route('get-asset') }}";
        var getAssetLastCode = "{{ route('get-asset-last-code', ':assetId') }}";
        var selectedAssetId = "{{ $assetInventoryDetail->asset_id ?? '' }}";
        var isEdit = true;

        $(document).ready(function() {
            @if ($assetInventoryDetail->asset_category_id)
                $('#asset_category_id').val("{{ $assetInventoryDetail->asset_category_id }}").trigger('change');
            @endif
        });

    </script>
    <script src="{{ asset('assets/js/admin/asset-inventory.js') }}"></script>
@endsection