@extends('layouts.app')

@section('title', __('accounting-reports::lang.general_ledger'))

@section('content')
<section class="content-header">
    <h1>@lang('accounting-reports::lang.general_ledger')</h1>
</section>

<section class="content">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-solid">
                <div class="box-header with-border">
                    <h3 class="box-title">Filters</h3>
                </div>
                <div class="box-body">
                    <form id="filter-form">
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>@lang('accounting-reports::lang.select_account')</label>
                                    <select name="account_id" id="account_id" class="form-control select2" style="width:100%" required>
                                        <option value="">@lang('lang_v1.please_select')</option>
                                        @if(isset($accountsDropdown))
                                            @foreach($accountsDropdown as $accountId => $accountName)
                                                <option value="{{ $accountId }}">{{ $accountName }}</option>
                                            @endforeach
                                        @else
                                            @foreach($accounts as $accountId => $accountName)
                                                <option value="{{ $accountId }}">{{ $accountName }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                    @if(empty($accounts) && empty($accountsDropdown ?? []))
                                        <p class="help-block text-danger">
                                            <i class="fa fa-exclamation-triangle"></i> 
                                            No Chart of Accounts found. Please set up Chart of Accounts first.
                                        </p>
                                    @endif
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>@lang('accounting-reports::lang.location')</label>
                                    <select name="location_id" id="location_id" class="form-control select2" style="width:100%">
                                        <option value="">@lang('accounting-reports::lang.all_locations')</option>
                                        @foreach($locations as $locationId => $locationName)
                                            <option value="{{ $locationId }}">{{ $locationName }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="form-group">
                                    <label for="from_date">@lang('accounting-reports::lang.from_date'):</label>
                                    <div class="input-group">
                                        <span class="input-group-addon">
                                            <i class="fa fa-calendar"></i>
                                        </span>
                                        <input type="text" id="from_date" value="{{ date('Y-m-01') }}" class="form-control" readonly>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="form-group">
                                    <label for="to_date">@lang('accounting-reports::lang.to_date'):</label>
                                    <div class="input-group">
                                        <span class="input-group-addon">
                                            <i class="fa fa-calendar"></i>
                                        </span>
                                        <input type="text" id="to_date" value="{{ date('Y-m-d') }}" class="form-control" readonly>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <button type="button" id="generate-btn" class="btn btn-primary">
                                    <i class="fa fa-refresh"></i> @lang('accounting-reports::lang.generate')
                                </button>
                                <button type="button" id="export-btn" class="btn btn-success" style="display:none;">
                                    <i class="fa fa-download"></i> @lang('accounting-reports::lang.export')
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="row" id="ledger-container" style="display:none;">
        <div class="col-md-12">
            <div class="box box-solid">
                <div class="box-header with-border">
                    <h3 class="box-title" id="account-title">@lang('accounting-reports::lang.account_statement')</h3>
                </div>
                <div class="box-body">
                    <div id="ledger-summary" class="row" style="margin-bottom: 20px;">
                        <div class="col-md-3">
                            <div class="info-box">
                                <span class="info-box-icon bg-blue"><i class="fa fa-book"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">@lang('accounting-reports::lang.opening_balance')</span>
                                    <span class="info-box-number" id="opening-balance">0.00</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="info-box">
                                <span class="info-box-icon bg-green"><i class="fa fa-arrow-up"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">@lang('accounting-reports::lang.total_debit')</span>
                                    <span class="info-box-number" id="total-debit">0.00</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="info-box">
                                <span class="info-box-icon bg-red"><i class="fa fa-arrow-down"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">@lang('accounting-reports::lang.total_credit')</span>
                                    <span class="info-box-number" id="total-credit">0.00</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="info-box">
                                <span class="info-box-icon bg-yellow"><i class="fa fa-balance-scale"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">@lang('accounting-reports::lang.closing_balance')</span>
                                    <span class="info-box-number" id="closing-balance">0.00</span>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="table-responsive">
                        <table class="table table-bordered table-striped table-hover" id="ledger_table" style="width:100%;">
                            <thead>
                                <tr>
                                    <th>@lang('accounting-reports::lang.voucher_date')</th>
                                    <th>@lang('accounting-reports::lang.voucher_no')</th>
                                    <th>@lang('accounting-reports::lang.narration')</th>
                                    <th>@lang('accounting-reports::lang.reference')</th>
                                    <th>@lang('accounting-reports::lang.debit')</th>
                                    <th>@lang('accounting-reports::lang.credit')</th>
                                    <th>@lang('accounting-reports::lang.running_balance')</th>
                                </tr>
                            </thead>
                            <tbody id="ledger-tbody">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@endsection

@section('javascript')
<script type="text/javascript">
    $(document).ready(function() {
        // Initialize date picker
        $('#from_date, #to_date').datepicker({
            autoclose: true,
            format: datepicker_date_format
        });

        // Initialize select2
        $('.select2').select2();

        // Generate ledger
        $('#generate-btn').on('click', function() {
            var accountId = $('#account_id').val();
            var fromDate = $('#from_date').val();
            var toDate = $('#to_date').val();
            var locationId = $('#location_id').val();

            if (!accountId) {
                toastr.error('@lang("accounting-reports::lang.select_account")');
                return;
            }

            if (!fromDate || !toDate) {
                toastr.error('@lang("accounting-reports::lang.please_select_date_range")');
                return;
            }

            $.ajax({
                url: '{{ route("accounting-reports.general-ledger.get-data") }}',
                method: 'GET',
                data: {
                    account_id: accountId,
                    from_date: fromDate,
                    to_date: toDate,
                    location_id: locationId
                },
                beforeSend: function() {
                    $('#generate-btn').prop('disabled', true).html('<i class="fa fa-spinner fa-spin"></i> Loading...');
                },
                success: function(response) {
                    if (response.success) {
                        displayLedger(response);
                        $('#ledger-container').show();
                        $('#export-btn').show();
                    } else {
                        toastr.error(response.error || 'Error loading ledger');
                    }
                },
                error: function(xhr) {
                    var errorMsg = 'Error loading ledger';
                    if (xhr.responseJSON && xhr.responseJSON.error) {
                        errorMsg = xhr.responseJSON.error;
                    }
                    toastr.error(errorMsg);
                },
                complete: function() {
                    $('#generate-btn').prop('disabled', false).html('<i class="fa fa-refresh"></i> @lang("accounting-reports::lang.generate")');
                }
            });
        });

        function displayLedger(data) {
            // Update summary
            var accountTitle = '';
            if (data.account && data.account.code) {
                accountTitle = data.account.code + ' - ' + (data.account.name || '');
            } else if (data.account && data.account.name) {
                accountTitle = data.account.name;
            } else {
                accountTitle = 'Account Statement';
            }
            $('#account-title').text(accountTitle);
            $('#opening-balance').text(parseFloat(data.opening_balance || 0).toFixed(2));
            $('#total-debit').text(parseFloat(data.total_debit || 0).toFixed(2));
            $('#total-credit').text(parseFloat(data.total_credit || 0).toFixed(2));
            $('#closing-balance').text(parseFloat(data.closing_balance || 0).toFixed(2));

            // Update table
            var tbody = $('#ledger-tbody');
            tbody.empty();

            if (data.entries && data.entries.length > 0) {
                data.entries.forEach(function(entry) {
                    var row = '<tr>';
                    row += '<td>' + entry.date + '</td>';
                    row += '<td><a href="{{ url("accounting-reports/voucher") }}/' + entry.voucher_id + '" target="_blank">' + entry.voucher_no + '</a></td>';
                    row += '<td>' + (entry.narration || '-') + '</td>';
                    row += '<td>' + (entry.reference || '-') + '</td>';
                    row += '<td class="text-right">' + parseFloat(entry.debit || 0).toFixed(2) + '</td>';
                    row += '<td class="text-right">' + parseFloat(entry.credit || 0).toFixed(2) + '</td>';
                    row += '<td class="text-right"><strong>' + parseFloat(entry.balance || 0).toFixed(2) + '</strong></td>';
                    row += '</tr>';
                    tbody.append(row);
                });
            } else {
                tbody.append('<tr><td colspan="7" class="text-center">@lang("accounting-reports::lang.no_transactions")</td></tr>');
            }
        }
    });
</script>
@endsection