@extends('admin.layouts.app')

@section('content')
    <div class="page-header">
        <div class="row">
            <div class="col-sm-12">
                <h3 class="page-title">Master Formulation Details</h3>
                <ul class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ route('master-formulations.index') }}">Master Formulations</a>
                    </li>
                    <li class="breadcrumb-item active">Master Formulation Details</li>
                </ul>
            </div>
        </div>

        <div class="d-flex align-items-center gap-2">
            {{-- Previous Button --}}
            @if ($previous)
                <a href="{{ route('master-formulations.show', $previous->id) }}" class="btn btn-outline-secondary">
                    &laquo; Previous
                </a>
            @else
                <button class="btn btn-outline-secondary" disabled>&laquo; Previous</button>
            @endif

            {{-- Jump to Specific PO Dropdown --}}
            <div class="dropdown">
                <button class="btn btn-primary dropdown-toggle" type="button" id="jumpToPODropdown"
                    data-bs-toggle="dropdown" aria-expanded="false">
                    Jump to PO
                </button>
                <ul class="dropdown-menu" aria-labelledby="jumpToPODropdown"
                    style="max-height: 300px; overflow-y: auto; min-width: 300px;">
                    <li class="px-3 py-2">
                        <input type="text" class="form-control form-control-sm" id="poSearchInput"
                            placeholder="Search PO code or date..." onkeyup="filterPOs()" oninput="filterPOs()">
                    </li>
                    <li>
                        <hr class="dropdown-divider">
                    </li>
                    @foreach ($allMfs as $po)
                        <li>
                            <a class="dropdown-item po-item {{ $po->id == $masterFormulation->id ? 'active fw-bold' : '' }}"
                                href="{{ route('master-formulations.show', $po->id) }}"
                                data-po-code="{{ strtolower($po->brand_name) }}"
                                data-po-date="{{ $po->created_at->format('d/m/Y') }}">
                                <span>{{ $po->brand_name }}</span>
                            </a>
                        </li>
                    @endforeach
                </ul>
            </div>

            {{-- Next Button --}}
            @if ($next)
                <a href="{{ route('master-formulations.show', $next->id) }}" class="btn btn-outline-secondary">
                    Next &raquo;
                </a>
            @else
                <button class="btn btn-outline-secondary" disabled>Next &raquo;</button>
            @endif

            {{-- Edit Button --}}
            <a href="{{ route('master-formulations.edit', $masterFormulation->id) }}"
                class="btn btn-light btn-outline-secondary">
                <img src="{{ asset('assets/img/icons/edit.svg') }}" alt="Edit">
            </a>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-12">
            <div class="card">
                <div class="card-body">
                    <div class="form-row row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-label">Brand</label>
                                <input type="text" class="form-control" value="{{ $masterFormulation->brand_name }}"
                                    readonly>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-label">Product (manual)</label>
                                <input type="text" class="form-control" value="{{ $masterFormulation->product_name }}"
                                    readonly>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-label">Batch Size</label>
                                <input type="text" class="form-control" value="{{ $masterFormulation->batch_size }}"
                                    readonly>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-label">Created At</label>
                                <input type="text" class="form-control"
                                    value="{{ $masterFormulation->created_at->format('d M, Y') }}" readonly>
                            </div>
                        </div>

                        {{-- <div class="col-md-12 mt-3">
                            <a href="{{ route('master-formulations.index') }}" class="btn btn-secondary">Cancel</a>
                        </div> --}}
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover table-bordered align-middle">
                            <thead class="table-light">
                                <caption>
                                    Raw Material Items
                                </caption>
                                <tr>
                                    <th>Sr #</th>
                                    <th>Raw Material Item</th>
                                    <th>Quantity</th>
                                </tr>
                            </thead>
                            <tbody class="">
                                @forelse ($masterFormulation->mfItems as $item)
                                    <tr class="">
                                        <td>{{ $loop->iteration }}</td>
                                        <td>{{ $item->rawItem->name ?? '' }}</td>
                                        <td>{{ number_format($item->quantity ?? 0) }}</td>

                                    </tr>

                                @empty
                                    <tr>
                                        <td colspan="3">No Data!</td>

                                    </tr>
                                @endforelse
                            </tbody>
                            <tfoot>

                            </tfoot>
                        </table>
                    </div>




                </div>
            </div>
        </div>
    </div>
@endsection
