@extends('procurement::layouts.master')
@section('title','Log Build')
@section('content')
<h1 class="h3 mb-4">Log Build</h1>
<form method="POST" action="{{ route('procurement.production.build.store') }}">
@csrf
<div class="card shadow mb-4"><div class="card-body">
    <div class="row">
        <div class="col-md-3"><div class="form-group"><label>Project <span class="text-danger">*</span></label>
            <select name="project_id" id="project-select" class="form-control" required>
                <option value="">— Select —</option>
                @foreach($projects as $p)<option value="{{ $p->id }}" {{ old('project_id')==$p->id?'selected':'' }}>{{ $p->name }}</option>@endforeach
            </select>
        </div></div>
        <div class="col-md-3"><div class="form-group"><label>Run</label>
            <select name="run_id" class="form-control">
                <option value="">— None —</option>
                @foreach($projects as $p)@foreach($p->runs as $r)
                <option value="{{ $r->id }}" data-project="{{ $p->id }}" {{ old('run_id')==$r->id?'selected':'' }}>{{ $p->name }} / {{ $r->run_number }}</option>
                @endforeach @endforeach
            </select>
        </div></div>
        <div class="col-md-2"><div class="form-group"><label>Boards Built <span class="text-danger">*</span></label>
            <input type="number" name="boards" id="boards-input" class="form-control" value="{{ old('boards',1) }}" min="1" required>
        </div></div>
        <div class="col-md-2"><div class="form-group"><label>Build Date <span class="text-danger">*</span></label>
            <input type="date" name="build_date" class="form-control" value="{{ old('build_date',date('Y-m-d')) }}" required>
        </div></div>
        <div class="col-md-2"><div class="form-group"><label>Notes</label>
            <input type="text" name="notes" class="form-control" value="{{ old('notes') }}" placeholder="First article batch">
        </div></div>
    </div>
</div></div>

@foreach($componentsByProject as $projectId => $components)
<div class="card shadow mb-4 project-bom" id="bom-{{ $projectId }}" style="display:none">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h6 class="m-0 font-weight-bold">Parts to Consume</h6>
        <div class="d-flex align-items-center">
            <input type="text" data-pf-filter="bom-consume-table-{{ $projectId }}" class="form-control form-control-sm mr-2" placeholder="Search parts..." style="width:160px">
            <small class="text-muted text-nowrap">Uncheck parts not used in this build (e.g. fan, heatsink, enclosure)</small>
        </div>
    </div>
    <div class="card-body p-0">
        <table class="table table-sm mb-0" data-pf-table id="bom-consume-table-{{ $projectId }}">
            <thead class="thead-dark"><tr>
                <th>Include</th>
                <th data-pf-sort="text">Ref <i class="fas fa-sort text-white-50 pf-sort-icon"></i></th>
                <th data-pf-sort="text">Part / Description <i class="fas fa-sort text-white-50 pf-sort-icon"></i></th>
                <th class="text-center" data-pf-sort="number">Qty/Board <i class="fas fa-sort text-white-50 pf-sort-icon"></i></th>
                <th class="text-center">Required</th>
                <th class="text-center" data-pf-sort="number">On Hand <i class="fas fa-sort text-white-50 pf-sort-icon"></i></th>
            </tr></thead>
            <tbody>
                @foreach($components as $c)
                <tr data-pf-row class="{{ $c->needs_attention ? 'table-warning' : '' }}">
                    <td><input type="checkbox" name="include[{{ $c->id }}]" value="1" class="include-check" checked></td>
                    <td><code class="small">{{ $c->ref_designator ?: '—' }}</code></td>
                    <td><code class="small">{{ $c->part_number ?: '—' }}</code><br><small class="text-muted">{{ Str::limit($c->description,50) }}</small></td>
                    <td class="text-center">{{ $c->qty_per_board }}</td>
                    <td class="text-center required-qty" data-per-board="{{ $c->qty_per_board }}">{{ $c->qty_per_board }}</td>
                    <td class="text-center {{ ($c->stock->qty_on_hand ?? 0) < $c->qty_per_board ? 'text-danger font-weight-bold' : '' }}">{{ $c->stock->qty_on_hand ?? 0 }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endforeach

<button type="submit" class="btn btn-dark btn-lg"><i class="fas fa-industry mr-1"></i> Log Build</button>
<a href="{{ route('procurement.stock.index') }}" class="btn btn-link">Cancel</a>
</form>

<div class="card shadow mb-4 mt-4">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h6 class="m-0 font-weight-bold">Build History</h6>
        <div class="d-flex align-items-center">
            <input type="text" data-pf-filter="build-history-table" class="form-control form-control-sm mr-2" placeholder="Search builds..." style="width:180px">
            <span class="text-muted small text-nowrap">{{ $builds->sum('quantity') }} unit(s) built total</span>
        </div>
    </div>
    <div class="card-body p-0">
        <div class="table-responsive">
        <table class="table table-sm mb-0" data-pf-table id="build-history-table">
            <thead class="thead-light">
                <tr>
                    <th data-pf-sort="date">Date <i class="fas fa-sort text-muted pf-sort-icon"></i></th>
                    <th data-pf-sort="text">Project <i class="fas fa-sort text-muted pf-sort-icon"></i></th>
                    <th class="text-center" data-pf-sort="number">Boards Built <i class="fas fa-sort text-muted pf-sort-icon"></i></th>
                    <th data-pf-sort="text">Reference <i class="fas fa-sort text-muted pf-sort-icon"></i></th>
                    <th data-pf-sort="text">Performed By <i class="fas fa-sort text-muted pf-sort-icon"></i></th>
                    <th>Notes</th><th></th>
                </tr>
            </thead>
            <tbody>
                @forelse($builds as $build)
                <tr data-pf-row>
                    <td data-pf-value="{{ $build->movement_date->toDateString() }}"><small>{{ $build->movement_date->format('M j, Y') }}</small></td>
                    <td data-pf-value="{{ $build->component->project->name ?? '' }}">
                        @if($build->component->project)
                        <a href="{{ route('procurement.projects.show', $build->component->project) }}">{{ $build->component->project->name }}</a>
                        @else
                        <span class="text-muted">—</span>
                        @endif
                    </td>
                    <td class="text-center font-weight-bold">{{ $build->quantity }}</td>
                    <td><code class="small">{{ $build->reference }}</code></td>
                    <td><small>{{ $build->performed_by ?: '—' }}</small></td>
                    <td><small>{{ $build->notes ?: '—' }}</small></td>
                    <td class="text-nowrap">
                        <button type="button" class="btn btn-xs btn-outline-secondary" data-toggle="collapse" data-target="#build-detail-{{ $build->id }}">
                            Details
                        </button>
                    </td>
                </tr>
                <tr class="collapse" id="build-detail-{{ $build->id }}">
                    <td colspan="7" class="bg-light p-3">
                        <div class="row">
                            <div class="col-md-6">
                                <h6 class="small font-weight-bold text-uppercase text-muted">Consumed ({{ $build->consumed->count() }})</h6>
                                @forelse($build->consumed as $line)
                                <div class="small d-flex justify-content-between border-bottom py-1">
                                    <span>{{ $line->component->description }} <span class="text-muted">({{ $line->component->ref_designator ?: '—' }})</span></span>
                                    <span class="font-weight-bold">{{ abs($line->quantity) }}</span>
                                </div>
                                @empty
                                <p class="small text-muted mb-0">No parts recorded for this build.</p>
                                @endforelse
                            </div>
                            <div class="col-md-6">
                                <h6 class="small font-weight-bold text-uppercase text-muted">
                                    Excluded from this build ({{ $build->excluded->count() }})
                                </h6>
                                @forelse($build->excluded as $line)
                                <div class="small border-bottom py-1">{{ $line->description }} <span class="text-muted">({{ $line->ref_designator ?: '—' }})</span></div>
                                @empty
                                <p class="small text-muted mb-0">Every current BOM line was included.</p>
                                @endforelse
                                <p class="small text-muted mt-2 mb-0"><i class="fas fa-info-circle mr-1"></i>Measured against today's BOM — a line added or removed from the project since this build will show up here even if the choice at build time was different.</p>
                            </div>
                        </div>
                    </td>
                </tr>
                @empty
                <tr><td colspan="7" class="text-center text-muted py-2">No builds logged yet.</td></tr>
                @endforelse
            </tbody>
        </table>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
function refresh() {
    var pid = document.getElementById('project-select').value;
    document.querySelectorAll('.project-bom').forEach(function(el){
        var visible = pid && el.id === 'bom-' + pid;
        el.style.display = visible ? '' : 'none';
        // Hiding a card doesn't stop its checked boxes from being submitted — disable them
        // too, or every other project's parts get included and show up as bogus shortages.
        el.querySelectorAll('.include-check').forEach(function(cb){ cb.disabled = !visible; });
    });
    var boards = parseInt(document.getElementById('boards-input').value) || 1;
    document.querySelectorAll('.required-qty').forEach(function(td){
        td.textContent = (parseInt(td.dataset.perBoard) || 0) * boards;
    });
}
document.getElementById('project-select').addEventListener('change', refresh);
document.getElementById('boards-input').addEventListener('input', refresh);
refresh();
</script>
@endpush