@extends('admin.layouts.app')

@section('title', 'Add Sale / POS')
@section('page_title', 'Add Sale / POS')

@section('content')
@php
    $products = $products ?? collect();
    $customers = $customers ?? collect();
@endphp

<div class="page-shell">
    <div class="page-head">
        <div>
            <h1 class="page-title">Add Sale / POS</h1>
            <div class="page-subtitle">Create a sale invoice with customer, item, quantity, and payment details.</div>
        </div>
        <a href="{{ route('admin.sales.index') }}" class="btn btn-light">Back to List</a>
    </div>

    <form method="POST" action="{{ route('admin.sales.store') }}">
        @csrf

        <div class="grid-3">
            <div class="card">
                <label for="customer_name">Customer</label>
                <select id="customer_name" name="customer_name">
                    <option value="">Walk-in Customer</option>
                    @foreach($customers as $customer)
                        <option value="{{ $customer->name }}" @selected(old('customer_name') == $customer->name)>{{ $customer->name }}</option>
                    @endforeach
                </select>
            </div>

            <div class="card">
                <label for="sale_date">Sale Date</label>
                <input type="date" id="sale_date" name="sale_date" value="{{ old('sale_date', now()->toDateString()) }}">
            </div>

            <div class="card">
                <label for="invoice_no">Invoice No</label>
                <input type="text" id="invoice_no" name="invoice_no" value="{{ old('invoice_no') }}">
            </div>

            <div class="card">
                <label for="product_name">Product</label>
                <select id="product_name" name="product_name">
                    <option value="">Select Product</option>
                    @foreach($products as $product)
                        @php $productName = $product->product_name ?? $product->name; @endphp
                        <option value="{{ $productName }}" @selected(old('product_name') == $productName)>{{ $productName }}</option>
                    @endforeach
                </select>
            </div>

            <div class="card">
                <label for="quantity_sold">Quantity</label>
                <input type="number" id="quantity_sold" name="quantity_sold" value="{{ old('quantity_sold', 1) }}" min="1">
            </div>

            <div class="card">
                <label for="unit_price">Unit Price</label>
                <input type="number" step="0.01" id="unit_price" name="unit_price" value="{{ old('unit_price', 0) }}">
            </div>

            <div class="card">
                <label for="discount_amount">Discount</label>
                <input type="number" step="0.01" id="discount_amount" name="discount_amount" value="{{ old('discount_amount', 0) }}">
            </div>

            <div class="card">
                <label for="paid_amount">Paid Amount</label>
                <input type="number" step="0.01" id="paid_amount" name="paid_amount" value="{{ old('paid_amount', 0) }}">
            </div>

            <div class="card">
                <label for="payment_method">Payment Method</label>
                <select id="payment_method" name="payment_method">
                    <option value="Cash">Cash</option>
                    <option value="Card">Card</option>
                    <option value="Mobile Banking">Mobile Banking</option>
                    <option value="Bank">Bank</option>
                    <option value="Due">Due</option>
                </select>
            </div>
        </div>

        <div class="grid-2" style="margin-top:12px;">
            <div class="card">
                <label for="notes">Notes</label>
                <textarea id="notes" name="notes" rows="5">{{ old('notes') }}</textarea>
            </div>

            <div class="card">
                <div class="page-subtitle" style="margin-bottom:12px;">Sales Summary</div>
                <div class="alert alert-info">
                    Current POS is configured as single-line sale entry unless your controller supports multi-item sales.
                </div>

                <div class="form-actions">
                    <button type="submit" class="btn primary">Save Sale</button>
                    <a href="{{ route('admin.sales.index') }}" class="btn btn-light">Cancel</a>
                </div>
            </div>
        </div>
    </form>
</div>
@endsection