@extends('layouts.master')

@section('content')

<div class="workflow-page">
<div class="workflow-header">
    <div>
        <h1 class="workflow-title">
            New Stock Receipt
        </h1>
        <div class="workflow-subtitle">
            Record goods received into inventory
        </div>
    </div>
</div>
<form method="POST"
      action="{{ route('supply.receipts.store') }}">
    @csrf
    {{-- RECEIPT INFORMATION --}}
    <div class="workflow-card">
        <div class="workflow-card-header">
            Receipt Information
        </div>
        <div class="workflow-card-body">
            <div class="workflow-grid-3">
                <div class="workflow-form-group">
                    <label>Receipt Number</label>
                    <input type="text"
                           value="{{ $receiptNo ?? 'AUTO' }}"
                           readonly>
                </div>
                <div class="workflow-form-group">
                    <label>Receipt Date</label>
                    <input type="date"
                           name="receipt_date"
                           value="{{ old('receipt_date', date('Y-m-d')) }}">
                </div>
                <div class="workflow-form-group">
                    <label>Supplier</label>
                    <select name="supplier_id" required>
                        <option value="">
                            Select Supplier
                        </option>
                        @foreach($suppliers as $supplier)
                            <option value="{{ $supplier->id }}">
                                {{ $supplier->supplier_name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="workflow-form-group">
                    <label>Delivery Note</label>
                    <input type="text"
                           name="delivery_note"
                           value="{{ old('delivery_note') }}">
                </div>
                <div class="workflow-form-group">
                    <label>Invoice Number</label>
                    <input type="text"
                           name="invoice_no"
                           value="{{ old('invoice_no') }}">
                </div>
                <div class="workflow-form-group">
                    <label>Receiving Location</label>
                    <select name="location_id" required>
                        <option value="">
                            Select Location
                        </option>
                        @foreach($locations as $location)
                            <option value="{{ $location->id }}">
                                {{ $location->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>
    </div>
    {{-- RECEIPT ITEMS --}}
    <div class="workflow-card">
        <div class="workflow-card-header">
            Receipt Items
        </div>
        <div class="workflow-card-body">
            <table class="workflow-table">
                <thead>
                    <tr>
                        <th>Item</th>
                        <th>Batch No</th>
                        <th>Expiry Date</th>
                        <th>Quantity</th>
                        <th>Unit Cost</th>
                        <th>Total</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            <select name="item_id[]" required>
                                <option value="">
                                    Select Item
                                </option>
                                @foreach($items as $item)
                                    <option value="{{ $item->id }}">
                                        {{ $item->item_code }}
                                        -
                                        {{ $item->item_name }}
                                    </option>
                                @endforeach
                            </select>
                        </td>
                        <td>
                            <input type="text"
                                   name="batch_no[]">
                        </td>
                        <td>
                            <input type="date"
                                   name="expiry_date[]">
                        </td>
                        <td>
                            <input type="number"
                                   min="1"
                                   name="quantity[]">
                        </td>
                        <td>
                            <input type="number"
                                   step="0.01"
                                   min="0"
                                   name="unit_cost[]">
                        </td>
                        <td>
                            <input type="number"
                                   step="0.01"
                                   readonly
                                   name="line_total[]">
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    {{-- REMARKS --}}
    <div class="workflow-card">
        <div class="workflow-card-header">
            Remarks
        </div>
        <div class="workflow-card-body">
            <textarea rows="4"
                      name="remarks"></textarea>
        </div>
    </div>
    <div class="workflow-actions">
        <a href="{{ route('supply.receipts.index') }}"
           class="workflow-btn workflow-btn-outline">
            Cancel
        </a>
        <button type="submit"
                name="action"
                value="draft"
                class="workflow-btn workflow-btn-secondary">
            Save Draft
        </button>
        <button type="submit"
                name="action"
                value="submit"
                class="workflow-btn workflow-btn-success">
            Submit For Approval
        </button>
    </div>
</form>
</div>
<script>
document.addEventListener(
    'input',
    function (e) {
        if (
            e.target.name !== 'quantity[]' &&
            e.target.name !== 'unit_cost[]'
        ) {
            return;
        }
        let row =
            e.target.closest('tr');
        let quantity =
            parseFloat(
                row.querySelector(
                    'input[name="quantity[]"]'
                ).value
            ) || 0;
        let unitCost =
            parseFloat(
                row.querySelector(
                    'input[name="unit_cost[]"]'
                ).value
            ) || 0;
        row.querySelector(
            'input[name="line_total[]"]'
        ).value =
            (
                quantity *
                unitCost
            ).toFixed(2);
    }
);
</script>

@endsection