@extends('admin.admin_dashboard')
@section('customcss')
<style>
    .item-row { border-bottom: 1px solid #eee; padding: 10px 0; }
    .item-row:last-child { border-bottom: none; }
</style>
@endsection

@section('admin')
<div class="content-body">
    <div class="container-fluid">
        <div class="row page-titles">
            <ol class="breadcrumb">
                <li class="breadcrumb-item active"><a href="{{route('admin.product-sales.index')}}">Sales</a></li>
                <li class="breadcrumb-item active"><a href="javascript:void(0)">Edit Sale</a></li>
            </ol>
        </div>
        
        <div class="col-xl-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Edit Sale Order: {{$productSale->sale_no}}</h4>
                </div>
                <div class="card-body">
                    @if($productSale->status !== 'draft')
                    <div class="alert alert-warning">
                        <strong>Note:</strong> Only draft sales can be edited.
                    </div>
                    @else
                    <form action="{{route('admin.product-sales.update', $productSale->id)}}" method="post" id="saleForm">
                        @csrf
                        @method('PUT')
                        
                        <div class="row">
                            <div class="mb-3 col-md-3">
                                <label class="form-label">Sale No: <span class="text-danger">*</span></label>
                                <input type="text" class="form-control @error('sale_no') is-invalid @enderror" name="sale_no" value="{{old('sale_no', $productSale->sale_no)}}" required>
                                @error('sale_no')<div class="invalid-feedback">{{$message}}</div>@enderror
                            </div>
                            <div class="mb-3 col-md-3">
                                <label class="form-label">Sale Date: <span class="text-danger">*</span></label>
                                <input type="date" class="form-control @error('sale_date') is-invalid @enderror" name="sale_date" value="{{old('sale_date', $productSale->sale_date->format('Y-m-d'))}}" required>
                                @error('sale_date')<div class="invalid-feedback">{{$message}}</div>@enderror
                            </div>
                            <div class="mb-3 col-md-3">
                                <label class="form-label">Customer Type: <span class="text-danger">*</span></label>
                                <select class="form-control" name="customer_type" id="customerType" required>
                                    <option value="walk_in" {{old('customer_type', $productSale->customer_type) == 'walk_in' ? 'selected' : ''}}>Walk-in Customer</option>
                                    <option value="student" {{old('customer_type', $productSale->customer_type) == 'student' ? 'selected' : ''}}>Student</option>
                                </select>
                            </div>
                            <div class="mb-3 col-md-3" id="studentWrap" style="display: {{$productSale->customer_type == 'student' ? 'block' : 'none'}}">
                                <label class="form-label">Select Student:</label>
                                <select class="form-control @error('student_id') is-invalid @enderror" name="student_id" id="studentSelect">
                                    <option value="">Select Student</option>
                                    @foreach($students as $student)
                                    <option value="{{$student->id}}" {{old('student_id', $productSale->student_id) == $student->id ? 'selected' : ''}}>{{$student->student_name_english}} ({{$student->admission_roll}})</option>
                                    @endforeach
                                </select>
                                @error('student_id')<div class="invalid-feedback">{{$message}}</div>@enderror
                            </div>
                            <div class="mb-3 col-md-3" id="customerNameWrap" style="display: {{$productSale->customer_type == 'walk_in' ? 'block' : 'none'}}">
                                <label class="form-label">Customer Name:</label>
                                <input type="text" class="form-control" name="customer_name" value="{{old('customer_name', $productSale->customer_name)}}">
                            </div>
                        </div>

                        <hr>
                        <h5>Sale Items</h5>
                        <div id="itemsContainer">
                            @foreach($productSale->items as $index => $item)
                            <div class="item-row">
                                <div class="row">
                                    <div class="col-md-5">
                                        <label class="form-label">Product <span class="text-danger">*</span></label>
                                        <select class="form-control product-select" name="items[{{$index}}][product_id]" required>
                                            <option value="">Select Product</option>
                                            @foreach($products as $product)
                                            <option value="{{$product->id}}" data-price="{{$product->selling_price}}" data-stock="{{$product->current_stock}}" {{$item->product_id == $product->id ? 'selected' : ''}}>{{$product->name}} (Stock: {{$product->current_stock}})</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-md-2">
                                        <label class="form-label">Quantity <span class="text-danger">*</span></label>
                                        <input type="number" class="form-control item-qty" name="items[{{$index}}][quantity]" value="{{$item->quantity}}" min="1" required>
                                        <small class="text-muted stock-info">Available: {{$item->product->current_stock}}</small>
                                    </div>
                                    <div class="col-md-2">
                                        <label class="form-label">Unit Price <span class="text-danger">*</span></label>
                                        <input type="number" step="0.01" class="form-control item-price" name="items[{{$index}}][unit_price]" value="{{$item->unit_price}}" min="0" required>
                                    </div>
                                    <div class="col-md-2">
                                        <label class="form-label">Total</label>
                                        <input type="text" class="form-control item-total" readonly value="{{number_format($item->total, 2)}}">
                                    </div>
                                    <div class="col-md-1">
                                        <label class="form-label">&nbsp;</label>
                                        <button type="button" class="btn btn-danger btn-sm remove-item"><i class="fas fa-trash"></i></button>
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        </div>
                        <button type="button" class="btn btn-info btn-sm mt-2" id="addItem"><i class="fas fa-plus"></i> Add Item</button>

                        <hr>
                        <div class="row">
                            <div class="col-md-8">
                                <div class="mb-3">
                                    <label class="form-label">Payment Method: <span class="text-danger">*</span></label>
                                    <select class="form-control @error('payment_method') is-invalid @enderror" name="payment_method" required>
                                        <option value="cash" {{old('payment_method', $productSale->payment_method) == 'cash' ? 'selected' : ''}}>Cash</option>
                                        <option value="bank" {{old('payment_method', $productSale->payment_method) == 'bank' ? 'selected' : ''}}>Bank Transfer</option>
                                    </select>
                                    @error('payment_method')<div class="invalid-feedback">{{$message}}</div>@enderror
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Notes:</label>
                                    <textarea class="form-control" name="notes" rows="2">{{old('notes', $productSale->notes)}}</textarea>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <h5>Total Amount: <span id="grandTotal">৳{{number_format($productSale->total_amount, 2)}}</span></h5>
                            </div>
                        </div>

                        <div class="row" style="text-align: right;">
                            <div class="mb-3 col-md-12">
                                <button type="submit" class="btn btn-primary">Update Sale</button>
                                <a href="{{route('admin.product-sales.show', $productSale->id)}}" class="btn btn-secondary">Cancel</a>
                            </div>
                        </div>
                    </form>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@section('customjs')
<script>
let itemIndex = {{count($productSale->items)}};

$(document).ready(function() {
    // Customer type change
    $('#customerType').change(function() {
        if ($(this).val() === 'student') {
            $('#studentWrap').show();
            $('#customerNameWrap').hide();
        } else {
            $('#studentWrap').hide();
            $('#customerNameWrap').show();
        }
    });

    // Product selection - auto fill price and show stock
    $(document).on('change', '.product-select', function() {
        let price = $(this).find(':selected').data('price');
        let stock = $(this).find(':selected').data('stock');
        let $row = $(this).closest('.item-row');
        
        $row.find('.item-price').val(price || 0);
        $row.find('.stock-info').text('Available: ' + stock);
        $row.find('.item-qty').attr('max', stock);
        
        calculateRow($row);
    });

    // Calculate on qty or price change
    $(document).on('input', '.item-qty, .item-price', function() {
        calculateRow($(this).closest('.item-row'));
    });

    // Add new item row
    $('#addItem').click(function() {
        let html = `
            <div class="item-row">
                <div class="row">
                    <div class="col-md-5">
                        <select class="form-control product-select" name="items[${itemIndex}][product_id]" required>
                            <option value="">Select Product</option>
                            @foreach($products as $product)
                            <option value="{{$product->id}}" data-price="{{$product->selling_price}}" data-stock="{{$product->current_stock}}">{{$product->name}} (Stock: {{$product->current_stock}})</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-2">
                        <input type="number" class="form-control item-qty" name="items[${itemIndex}][quantity]" value="1" min="1" required>
                        <small class="text-muted stock-info"></small>
                    </div>
                    <div class="col-md-2">
                        <input type="number" step="0.01" class="form-control item-price" name="items[${itemIndex}][unit_price]" value="0" min="0" required>
                    </div>
                    <div class="col-md-2">
                        <input type="text" class="form-control item-total" readonly value="0.00">
                    </div>
                    <div class="col-md-1">
                        <button type="button" class="btn btn-danger btn-sm remove-item"><i class="fas fa-trash"></i></button>
                    </div>
                </div>
            </div>
        `;
        $('#itemsContainer').append(html);
        itemIndex++;
        updateRemoveButtons();
    });

    // Remove item row
    $(document).on('click', '.remove-item', function() {
        $(this).closest('.item-row').remove();
        calculateGrandTotal();
        updateRemoveButtons();
    });

    // Form submission - validate stock
    $('#saleForm').submit(function(e) {
        let hasError = false;
        $('.item-row').each(function() {
            let qty = parseInt($(this).find('.item-qty').val()) || 0;
            let maxQty = parseInt($(this).find('.item-qty').attr('max')) || 0;
            if (qty > maxQty) {
                alert('Quantity exceeds available stock for one or more items.');
                hasError = true;
                return false;
            }
        });
        if (hasError) {
            e.preventDefault();
        }
    });

    function calculateRow($row) {
        let qty = parseFloat($row.find('.item-qty').val()) || 0;
        let price = parseFloat($row.find('.item-price').val()) || 0;
        let total = qty * price;
        $row.find('.item-total').val(total.toFixed(2));
        calculateGrandTotal();
    }

    function calculateGrandTotal() {
        let grand = 0;
        $('.item-total').each(function() {
            grand += parseFloat($(this).val()) || 0;
        });
        $('#grandTotal').text('৳' + grand.toFixed(2));
    }

    function updateRemoveButtons() {
        let itemCount = $('.item-row').length;
        $('.remove-item').prop('disabled', itemCount <= 1);
    }

    // Initial calculation
    calculateGrandTotal();
    updateRemoveButtons();
});
</script>
@endsection