@extends('app-new')

@push('head-script')
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/vendors.min.css">
@endpush

@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">Thrift Fund - Import Historical Data</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ url($alias.'/thrift-funds') }}">Thrift Fund</a></li>
                    <li class="breadcrumb-item active">Import</li>
                </ol>
            </div>
        </div>
    </div>
@endpush

@push('prev-next-head')
    <div class="content-header-right text-end col-md-3 col-12">
        <div class="form-group breadcrumb-right">
            <a href="{{ url($alias.'/thrift-funds') }}" class="btn btn-secondary btn-sm"><i data-feather="arrow-left-circle"></i> Back</a>
        </div>
    </div>
@endpush

@section('content')
<section id="basic-form-layouts">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Import Already-Calculated Ledger Data</h4>
                </div>
                <div class="card-body">
                    <p class="text-muted">
                        Upload a CSV/Excel file with one row per employee per month. Values are imported exactly as
                        given — no interest or balance calculation is performed. Required columns:
                    </p>
                    <p class="text-muted">
                        <code>employee_code, transaction_type, month, year, opening_balance, deposit_amount,
                        interest_amount, total_deposit, total_interest, remarks, transaction_date</code>
                    </p>
                    <p class="text-muted">
                        <code>closing_balance</code> and <code>status</code> are calculated automatically from the
                        columns above — do not include them in the file.
                    </p>
                    <p class="text-muted">
                        Rows must be sorted oldest-to-newest per employee. An employee with no existing Thrift Fund
                        will be auto-enrolled using their earliest row.
                    </p>

                    <a href="{{ url($alias.'/thrift-funds/import/sample') }}" class="btn btn-outline-secondary btn-sm mb-2">
                        <i data-feather="download"></i> Download Sample File
                    </a>

                    <form id="thrift-fund-import-form" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <div class="row">
                            <div class="col-md-6 mb-1">
                                <label class="form-label" for="file">File (CSV / XLSX) <span class="text-danger">*</span></label>
                                <input type="file" class="form-control" id="file" name="file" accept=".csv,.txt,.xlsx,.xls">
                                <span class="text-danger" id="err-file"></span>
                            </div>
                        </div>

                        <div class="form-actions mt-2">
                            <button type="button" id="submit-thrift-fund-import" class="btn btn-primary">Import</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@push('footer-script')
<script>
var importUrl = "{!! route('thriftfund.import.store', ['alias' => $alias]) !!}";

$(function () {
    $('#submit-thrift-fund-import').on('click', function () {
        $('.text-danger').text('');

        var fileInput = $('#file')[0];
        if (!fileInput.files.length) {
            $('#err-file').text('Please choose a file to import.');
            return;
        }

        var formData = new FormData();
        formData.append('_token', "{{ csrf_token() }}");
        formData.append('file', fileInput.files[0]);

        $.ajax({
            url: importUrl,
            type: 'POST',
            data: formData,
            contentType: false,
            processData: false,
            success: function (res) {
                if (res.status === 'fail') {
                    Swal.fire({ title: 'Error', text: res.message || 'Unable to import Thrift Fund data', icon: 'error', confirmButtonColor: '#DD6B55' });
                    return;
                }

                Swal.fire({ title: 'Success', text: res.message || 'Import completed successfully', icon: 'success', confirmButtonColor: '#00c292' }).then(function () {
                    window.location.href = "{{ url($alias.'/thrift-funds') }}";
                });
            },
            error: function (xhr) {
                if (xhr.status === 422 && xhr.responseJSON && xhr.responseJSON.errors) {
                    $.each(xhr.responseJSON.errors, function (field, messages) {
                        $('#err-' + field).text(messages[0]);
                    });
                } else {
                    Swal.fire({ title: 'Error', text: (xhr.responseJSON && xhr.responseJSON.message) ? xhr.responseJSON.message : 'Unable to import Thrift Fund data', icon: 'error', confirmButtonColor: '#DD6B55' });
                }
            }
        });
    });
});
</script>
@endpush