@extends('admin.layouts.app')

@section('title', 'Edit Wastage')
@section('page_title', 'Edit Wastage')

@section('content')
<div class="card">
    <div class="card-header">
        <h5 class="mb-0">Edit Wastage</h5>
    </div>
    <div class="card-body">
        <form action="{{ route('wastages.update', $wastage->id) }}" method="POST">
            @csrf
            @method('PUT')
            <div class="row">
                <div class="col-md-4 mb-3">
                    <label class="form-label">Date <span class="text-danger">*</span></label>
                    <input type="date" name="date" class="form-control @error('date') is-invalid @enderror" value="{{ $wastage->date }}" required>
                    @error('date')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
            </div>
            
            <hr>
            <h5>Wastage Items</h5>
            <div class="table-responsive">
                <table class="table table-bordered" id="wastageItemsTable">
                    <thead>
                        <tr>
                            <th>Product</th>
                            <th>Quantity</th>
                            <th>Rate</th>
                            <th>Amount</th>
                            <th><button type="button" class="btn btn-success btn-sm" id="addRow"><i class="fas fa-plus"></i></button></th>
                        </tr>
                    </thead>
                    <tbody id="wastageItemsBody">
                        @foreach($wastage->items as $item)
                        <tr>
                            <td>
                                <select name="products[]" class="form-select product-select" required>
                                    <option value="">Select Product</option>
                                    @foreach($products as $product)
                                        <option value="{{ $product->id }}" data-price="{{ $product->purchase_price }}" {{ $item->product_id == $product->id ? 'selected' : '' }}>{{ $product->name }} ({{ $product->code }})</option>
                                    @endforeach
                                </select>
                            </td>
                            <td>
                                <input type="number" name="quantities[]" class="form-control quantity" step="0.01" value="{{ $item->quantity }}" required>
                            </td>
                            <td>
                                <input type="number" name="rates[]" class="form-control rate" step="0.01" value="{{ $item->rate }}" required>
                            </td>
                            <td>
                                <input type="number" class="form-control amount" step="0.01" value="{{ $item->quantity * $item->rate }}" readonly>
                            </td>
                            <td>
                                <button type="button" class="btn btn-danger btn-sm removeRow"><i class="fas fa-trash"></i></button>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="3" class="text-end"><strong>Total Amount:</strong></td>
                            <td><input type="number" name="total_amount" id="totalAmount" class="form-control" step="0.01" value="{{ $wastage->total_amount }}" readonly></td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
            
            <div class="mb-3">
                <label class="form-label">Notes</label>
                <textarea name="notes" class="form-control @error('notes') is-invalid @enderror" rows="3">{{ $wastage->notes }}</textarea>
                @error('notes')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            
            <button type="submit" class="btn btn-primary">
                <i class="fas fa-save"></i> Update Wastage
            </button>
            <a href="{{ route('wastages.index') }}" class="btn btn-secondary">Cancel</a>
        </form>
    </div>
</div>
@endsection

@section('scripts')
<script>
$(document).ready(function() {
    function calculateRowAmount(row) {
        var quantity = parseFloat(row.find('.quantity').val()) || 0;
        var rate = parseFloat(row.find('.rate').val()) || 0;
        var amount = quantity * rate;
        row.find('.amount').val(amount.toFixed(2));
        calculateTotal();
    }
    
    function calculateTotal() {
        var total = 0;
        $('.amount').each(function() {
            total += parseFloat($(this).val()) || 0;
        });
        $('#totalAmount').val(total.toFixed(2));
    }
    
    $(document).on('change', '.product-select', function() {
        var price = $(this).find('option:selected').data('price') || 0;
        $(this).closest('tr').find('.rate').val(price);
        calculateRowAmount($(this).closest('tr'));
    });
    
    $(document).on('input', '.quantity, .rate', function() {
        calculateRowAmount($(this).closest('tr'));
    });
    
    $('#addRow').click(function() {
        var row = `
            <tr>
                <td>
                    <select name="products[]" class="form-select product-select" required>
                        <option value="">Select Product</option>
                        @foreach($products as $product)
                            <option value="{{ $product->id }}" data-price="{{ $product->purchase_price }}">{{ $product->name }} ({{ $product->code }})</option>
                        @endforeach
                    </select>
                </td>
                <td>
                    <input type="number" name="quantities[]" class="form-control quantity" step="0.01" value="1" required>
                </td>
                <td>
                    <input type="number" name="rates[]" class="form-control rate" step="0.01" value="0" required>
                </td>
                <td>
                    <input type="number" class="form-control amount" step="0.01" value="0" readonly>
                </td>
                <td>
                    <button type="button" class="btn btn-danger btn-sm removeRow"><i class="fas fa-trash"></i></button>
                </td>
            </tr>
        `;
        $('#wastageItemsBody').append(row);
    });
    
    $(document).on('click', '.removeRow', function() {
        if ($('#wastageItemsBody tr').length > 1) {
            $(this).closest('tr').remove();
            calculateTotal();
        }
    });
});
</script>
@endsection