@extends('layouts.app') @section('content')<h2>Point of Sale</h2><div class="grid"><div class="card"><h3>Quick shortcuts</h3><p><a href="/products">＋ Add Product</a></p><p><a href="/customers">＋ Add Customer</a></p><label>Search product / scanner</label><input id="search" placeholder="Scan SKU or type product name" style="width:95%"></div><div class="card"><h3>Products</h3><table><thead><tr><th>Product</th><th>Price</th></tr></thead><tbody id="items">@foreach($products as $p)<tr><td>{{ $p->name }}</td><td>{{ number_format($p->price,2) }}</td></tr>@endforeach</tbody></table></div><div class="card"><h3>Customer</h3><select style="width:100%"><option value="">Walk-in customer</option>@foreach($customers as $c)<option value="{{ $c->id }}">{{ $c->name }}</option>@endforeach</select><p>Sale-entry and checkout workflow must be connected before using this screen for live sales.</p></div></div><script>document.getElementById('search').addEventListener('input',e=>{let q=e.target.value.toLowerCase();document.querySelectorAll('#items tr').forEach(r=>r.style.display=r.innerText.toLowerCase().includes(q)?'':'none')})</script>@endsection