@extends('layout.app')
@section('title', 'Create Stock Journal')
@push('header_script')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="{{ asset('theme/assets/vendor/daterange/daterange.css') }}">
@endpush
@section('content')
<div class="app-hero-header d-flex align-items-center">
    <ol class="breadcrumb">
        <li class="breadcrumb-item">
            <a href="javascript:void(0);">Voucher Entry</a>
        </li>
        <li class="breadcrumb-item">
            <a href="{{ route('stock-journal.index') }}">Stock Journals</a>
        </li>
        <li class="breadcrumb-item text-primary" aria-current="page">Create</li>
    </ol>
</div>

<div class="app-body">
    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title mb-0">Stock Journal Details</h4>
                </div>
                <div class="card-body">
                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul class="mb-0">
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                    @if (session('error_msg'))
                        <div class="alert alert-danger">
                            {{ session('error_msg') }}
                        </div>
                    @endif

                    <form action="{{ route('stock-journal.store') }}" method="POST">
                        @csrf
                        <div class="row mb-4">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Voucher No <span class="text-danger">*</span></label>
                                    <input type="text" name="voucher_no" class="form-control" value="{{ old('voucher_no', $voucherNo) }}" readonly required>
                                    <div class="text-danger">{{ $errors->first('voucher_no') }}</div>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Voucher Date <span class="text-danger">*</span></label>
                                    <input type="text" name="voucher_date" id="voucher_date" class="form-control" value="{{ old('voucher_date', date('d-m-Y')) }}" required>
                                    <div class="text-danger">{{ $errors->first('voucher_date') }}</div>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Reference</label>
                                    <input type="text" name="reference" class="form-control" value="{{ old('reference') }}" placeholder="e.g. SR-001">
                                    <div class="text-danger">{{ $errors->first('reference') }}</div>
                                </div>
                            </div>
                        </div>

                        @php
                            $oldOutItems = old('out_item_id', ['']);
                            $oldOutQty = old('out_quantity', ['']);
                            $oldOutRate = old('out_rate', ['']);
                            
                            $oldInItems = old('in_item_id', ['']);
                            $oldInQty = old('in_quantity', ['']);
                            $oldInRate = old('in_rate', ['']);
                        @endphp

                        <!-- STOCK OUT SECTION -->
                        <h5 class="mb-3 text-danger border-bottom pb-2">Stock Out (Source)</h5>
                        <div class="table-responsive mb-4">
                            <table class="table table-bordered mb-0" id="stockOutTable">
                                <thead class="table-light">
                                    <tr>
                                        <th width="40%">Item Name <span class="text-danger">*</span></th>
                                        <th width="15%">Quantity <span class="text-danger">*</span></th>
                                        <th width="20%">Rate <span class="text-danger">*</span></th>
                                        <th width="20%">Value</th>
                                        <th width="5%">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($oldOutItems as $key => $oldItemId)
                                    <tr class="out-row">
                                        <td>
                                            <select name="out_item_id[]" class="form-select select2 item-select out-item-select" required>
                                                <option value="">Select Item</option>
                                                @foreach($products as $product)
                                                    <option value="{{ $product->id }}" {{ (string)$oldItemId === (string)$product->id ? 'selected' : '' }}>{{ $product->product_name }}</option>
                                                @endforeach
                                            </select>
                                            <small class="text-muted out-stock-display"></small>
                                        </td>
                                        <td>
                                            <input type="number" name="out_quantity[]" class="form-control out-qty calc-input" step="0.01" min="0.01" value="{{ $oldOutQty[$key] ?? '' }}" required>
                                        </td>
                                        <td>
                                            <input type="number" name="out_rate[]" class="form-control out-rate calc-input" step="0.01" min="0" value="{{ $oldOutRate[$key] ?? '' }}" required readonly>
                                        </td>
                                        <td>
                                            <input type="number" class="form-control out-value" readonly>
                                        </td>
                                        <td>
                                            <button type="button" class="btn btn-danger btn-sm remove-row"><i class="ri-delete-bin-line"></i></button>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="3" class="text-end fw-bold">Total Stock Out Value:</td>
                                        <td>
                                            <input type="text" id="total_out_display" class="form-control fw-bold text-danger" value="0.00" readonly>
                                        </td>
                                        <td>
                                            <button type="button" id="addOutRow" class="btn btn-primary btn-sm"><i class="ri-add-line"></i> Add</button>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                            <div class="text-danger">{{ $errors->first('out_item_id') }}</div>
                            <div class="text-danger">{{ $errors->first('out_item_id.*') }}</div>
                        </div>

                        <!-- STOCK IN SECTION -->
                        <h5 class="mb-3 text-success border-bottom pb-2">Stock In (Destination)</h5>
                        <div class="table-responsive mb-4">
                            <table class="table table-bordered mb-0" id="stockInTable">
                                <thead class="table-light">
                                    <tr>
                                        <th width="40%">Item Name <span class="text-danger">*</span></th>
                                        <th width="15%">Quantity <span class="text-danger">*</span></th>
                                        <th width="20%">Rate <span class="text-danger">*</span></th>
                                        <th width="20%">Value</th>
                                        <th width="5%">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($oldInItems as $key => $oldItemId)
                                    <tr class="in-row">
                                        <td>
                                            <select name="in_item_id[]" class="form-select select2 item-select" required>
                                                <option value="">Select Item</option>
                                                @foreach($products as $product)
                                                    <option value="{{ $product->id }}" {{ (string)$oldItemId === (string)$product->id ? 'selected' : '' }}>{{ $product->product_name }}</option>
                                                @endforeach
                                            </select>
                                        </td>
                                        <td>
                                            <input type="number" name="in_quantity[]" class="form-control in-qty calc-input" step="0.01" min="0.01" value="{{ $oldInQty[$key] ?? '' }}" required>
                                        </td>
                                        <td>
                                            <input type="number" name="in_rate[]" class="form-control in-rate calc-input" step="0.01" min="0" value="{{ $oldInRate[$key] ?? '' }}" required>
                                        </td>
                                        <td>
                                            <input type="number" class="form-control in-value" readonly>
                                        </td>
                                        <td>
                                            <button type="button" class="btn btn-danger btn-sm remove-row"><i class="ri-delete-bin-line"></i></button>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="3" class="text-end fw-bold">Total Stock In Value:</td>
                                        <td>
                                            <input type="text" id="total_in_display" class="form-control fw-bold text-success" value="0.00" readonly>
                                        </td>
                                        <td>
                                            <button type="button" id="addInRow" class="btn btn-primary btn-sm"><i class="ri-add-line"></i> Add</button>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                            <div class="text-danger">{{ $errors->first('in_item_id') }}</div>
                            <div class="text-danger">{{ $errors->first('in_item_id.*') }}</div>
                        </div>

                        <!-- SUMMARY SECTION -->
                        <div class="row mb-4 bg-light p-3 rounded">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="fw-bold text-danger">Total Out</label>
                                    <input type="text" id="summary_out" class="form-control form-control-lg fw-bold" value="0.00" readonly>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="fw-bold text-success">Total In</label>
                                    <input type="text" id="summary_in" class="form-control form-control-lg fw-bold" value="0.00" readonly>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="fw-bold">Difference (Must be 0.00)</label>
                                    <input type="text" id="summary_diff" class="form-control form-control-lg fw-bold" value="0.00" readonly>
                                </div>
                            </div>
                        </div>

                        <div class="row mb-4">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Narration</label>
                                    <textarea name="narration" class="form-control" rows="3" placeholder="Explain the reason for this journal...">{{ old('narration') }}</textarea>
                                </div>
                            </div>
                        </div>

                        <div class="text-end">
                            <a href="{{ route('stock-journal.index') }}" class="btn btn-light">Cancel</a>
                            <button type="submit" class="btn btn-primary" id="btnSubmit">Save Journal</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@push('footer_script')
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script src="{{ asset('theme/assets/vendor/daterange/daterange.js') }}"></script>
    <script src="{{ asset('theme/assets/vendor/daterange/custom-daterange.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('#voucher_date').daterangepicker({
                singleDatePicker: true,
                autoUpdateInput: true,
                locale: {
                    format: 'DD-MM-YYYY'
                }
            });

            function initSelect2() {
                $('.select2').select2();
            }
            initSelect2();

            // Fetch average cost for Stock Out
            $(document).on('change', '.out-item-select', function() {
                let tr = $(this).closest('tr');
                let itemId = $(this).val();
                let rateInput = tr.find('.out-rate');
                let stockDisplay = tr.find('.out-stock-display');
                
                if(itemId) {
                    stockDisplay.text('Fetching rate...');
                    $.ajax({
                        url: "{{ route('stock-inward.get-average-cost') }}", // Re-using existing avg cost logic!
                        type: "GET",
                        data: { item_id: itemId },
                        success: function(res) {
                            if(res.success) {
                                rateInput.val(res.average_cost);
                                stockDisplay.text('Avg Cost: ₹' + res.average_cost);
                                calculateTotals();
                            }
                        }
                    });
                } else {
                    rateInput.val('');
                    stockDisplay.text('');
                    calculateTotals();
                }
            });

            // Calculate totals whenever inputs change
            $(document).on('input', '.calc-input', function() {
                calculateTotals();
            });

            function calculateTotals() {
                let totalOut = 0;
                let totalIn = 0;

                $('#stockOutTable tbody tr').each(function() {
                    let qty = parseFloat($(this).find('.out-qty').val()) || 0;
                    let rate = parseFloat($(this).find('.out-rate').val()) || 0;
                    let val = qty * rate;
                    $(this).find('.out-value').val(val.toFixed(2));
                    totalOut += val;
                });

                $('#stockInTable tbody tr').each(function() {
                    let qty = parseFloat($(this).find('.in-qty').val()) || 0;
                    let rate = parseFloat($(this).find('.in-rate').val()) || 0;
                    let val = qty * rate;
                    $(this).find('.in-value').val(val.toFixed(2));
                    totalIn += val;
                });

                $('#total_out_display').val(totalOut.toFixed(2));
                $('#total_in_display').val(totalIn.toFixed(2));
                $('#summary_out').val(totalOut.toFixed(2));
                $('#summary_in').val(totalIn.toFixed(2));
                
                let diff = Math.abs(totalOut - totalIn).toFixed(2);
                $('#summary_diff').val(diff);
                
                if (diff > 0) {
                    $('#summary_diff').removeClass('text-success').addClass('text-danger');
                    $('#btnSubmit').prop('disabled', true);
                } else {
                    $('#summary_diff').removeClass('text-danger').addClass('text-success');
                    $('#btnSubmit').prop('disabled', false);
                }
            }

            // Remove Row
            $(document).on('click', '.remove-row', function() {
                let tbody = $(this).closest('tbody');
                if(tbody.find('tr').length > 1) {
                    $(this).closest('tr').remove();
                    calculateTotals();
                } else {
                    alert("At least one row is required.");
                }
            });

            // Add Out Row
            $('#addOutRow').click(function() {
                let row = $('#stockOutTable tbody tr:first').clone();
                row.find('input').val('');
                row.find('.out-stock-display').text('');
                row.find('select').val('').trigger('change');
                // Select2 clone fix
                row.find('.select2-container').remove();
                row.find('select').removeClass('select2-hidden-accessible');
                $('#stockOutTable tbody').append(row);
                initSelect2();
            });

            // Add In Row
            $('#addInRow').click(function() {
                let row = $('#stockInTable tbody tr:first').clone();
                row.find('input').val('');
                row.find('select').val('').trigger('change');
                // Select2 clone fix
                row.find('.select2-container').remove();
                row.find('select').removeClass('select2-hidden-accessible');
                $('#stockInTable tbody').append(row);
                initSelect2();
            });

            // Initial calculation
            calculateTotals();
            
            // Prevent submission if not balanced
            $('form').submit(function(e) {
                let diff = parseFloat($('#summary_diff').val());
                if(diff !== 0) {
                    e.preventDefault();
                    alert('Total Stock Out must equal Total Stock In before posting.');
                }
            });
        });
    </script>
@endpush