@extends('layouts.app')

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

@section('content')
<section class="content-header">
    <h1>@lang('accounting-reports::lang.batch_print')</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">Select Accounts & Date Range</h3>
                </div>
                <div class="box-body">
                    {!! Form::open(['url' => action([\Modules\AccountingReports\Http\Controllers\BatchPrintController::class, 'process']), 'method' => 'post', 'id' => 'batch-print-form']) !!}
                        <div class="row">
                            <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="start_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" name="start_date" id="start_date" value="{{ @format_date('now -1 month') }}" class="form-control" readonly required>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="form-group">
                                    <label for="end_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" name="end_date" id="end_date" value="{{ @format_date('now') }}" class="form-control" readonly required>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>&nbsp;</label><br>
                                    <button type="button" id="select-all-btn" class="btn btn-default btn-sm">
                                        <i class="fa fa-check-square"></i> Select All
                                    </button>
                                    <button type="button" id="deselect-all-btn" class="btn btn-default btn-sm">
                                        <i class="fa fa-square"></i> Deselect All
                                    </button>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Select Accounts to Print:</label>
                                    <div style="max-height: 400px; overflow-y: auto; border: 1px solid #ddd; padding: 10px; border-radius: 4px;">
                                        <div class="row">
                                            @foreach($accounts as $accountId => $accountName)
                                                <div class="col-md-4" style="margin-bottom: 8px;">
                                                    <label style="font-weight: normal; cursor: pointer;">
                                                        <input type="checkbox" name="account_ids[]" value="{{ $accountId }}" class="account-checkbox" style="margin-right: 5px;">
                                                        {{ $accountName }}
                                                    </label>
                                                </div>
                                            @endforeach
                                        </div>
                                    </div>
                                    <small class="text-muted">Selected: <span id="selected-count">0</span> account(s)</small>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <button type="submit" class="btn btn-primary btn-lg" id="print-btn">
                                    <i class="fa fa-print"></i> Print Selected Accounts
                                </button>
                                <button type="button" class="btn btn-default" onclick="window.location.reload()">
                                    <i class="fa fa-refresh"></i> Reset
                                </button>
                            </div>
                        </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@section('javascript')
<script>
$(document).ready(function() {
    // Initialize date pickers
    $('#start_date').datepicker({
        autoclose: true,
        format: datepicker_date_format
    });
    
    $('#end_date').datepicker({
        autoclose: true,
        format: datepicker_date_format
    });

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

    // Update selected count
    function updateSelectedCount() {
        var count = $('.account-checkbox:checked').length;
        $('#selected-count').text(count);
    }

    // Select all accounts
    $('#select-all-btn').click(function() {
        $('.account-checkbox').prop('checked', true);
        updateSelectedCount();
    });

    // Deselect all accounts
    $('#deselect-all-btn').click(function() {
        $('.account-checkbox').prop('checked', false);
        updateSelectedCount();
    });

    // Update count on checkbox change
    $('.account-checkbox').change(function() {
        updateSelectedCount();
    });

    // Initial count
    updateSelectedCount();

    // Form validation
    $('#batch-print-form').submit(function(e) {
        var selectedAccounts = $('.account-checkbox:checked').length;
        
        if (selectedAccounts === 0) {
            e.preventDefault();
            toastr.error('Please select at least one account to print.');
            return false;
        }

        if (!$('#start_date').val() || !$('#end_date').val()) {
            e.preventDefault();
            toastr.error('Please select start and end dates.');
            return false;
        }

        // Show loading
        $('#print-btn').prop('disabled', true).html('<i class="fa fa-spinner fa-spin"></i> Generating PDF...');
    });
});
</script>
@endsection