@php
    $approve = 0;
    if(sizeof($Tpermistion) > 0)
    {
        $approve = $Tpermistion[0]->approve;
    }
@endphp

<form id="journal_entry_form">

    <div class="row mt-2">
        <div class="col-lg-3">
            <label>Date</label>
            <input type="date" class="form-control" id="journal_entry_date" name="journal_entry_date" value="2025-08-19">
        </div>
        @if($approve == 0)
            <div class="col-lg-6" >
                <label>Approver Email</label>
                <input type="text" class="form-control" id="send_email_address" name="send_email_address">
            </div>
        @elseif($approve == 1)
            <input type="hidden" class="form-control" id="send_email_address" name="send_email_address">
        @endif
           
    </div>

    <br>

    <div class="row">
        <div class="col-lg-12">
            <table class="table table-sm table-striped mt-1" id="journal_entry_table">

                <tr>
                    <th class="text-center">Account Type</th>
                    <th class="text-center">Remarks</th>
                    <th class="text-center">Debit</th>
                    <th class="text-center">Credit</th>
                    <th class="text-center">Remove</th>
                </tr>


                <tr id="row1">
                    <td style="width: 25%">

                        <select class="form-control _journal_entry_type select2">
                            <option value="-1">Account Name</option>
                            @foreach ($ChartOfAccounts as $value)
                                <option value="{{ $value->id }}">{{ $value->account_code }} -
                                    {{ $value->account_name }}
                                </option>
                            @endforeach
                        </select>

                    </td>
                    <td style="width: 45%">
                        <input type="text" class="form-control _remarks" autocomplete="off">
                    </td>
                    <td style="width: 15%">
                        <input type="text" class="form-control _debit_amount" autocomplete="off" value="0">
                    </td>
                    <td style="width: 15%">
                        <input type="text" class="form-control _credit_amount" autocomplete="off" value="0">
                    </td>
                    <td style="width: 5%;" class="text-center">
                        <button type="button" class="btn bg-danger btn-sm _remove_row"><i class="fas fa-trash"></i></button>
                    </td>
                </tr>
                <tr id="row2">
                    <td style="width: 25%">

                        <select class="form-control _journal_entry_type select2">
                            <option value="-1">Account Name</option>
                            @foreach ($ChartOfAccounts as $value)
                                <option value="{{ $value->id }}">{{ $value->account_code }} -
                                    {{ $value->account_name }}
                                </option>
                            @endforeach
                        </select>
                        <input type="hidden" id="journal_entry_id" class="form-control">

                    </td>
                    <td style="width: 45%">
                        <input type="text" class="form-control _remarks" autocomplete="off">
                    </td>
                    <td style="width: 15%">
                        <input type="text" class="form-control _debit_amount _debit_amount_clone" autocomplete="off"
                            value="0">
                    </td>
                    <td style="width: 15%">
                        <input type="text" class="form-control _credit_amount _credit_amount_clone"
                            autocomplete="off" value="0">
                    </td>
                    <td style="width: 5%;" class="text-center">
                        <button type="button" class="btn bg-danger btn-sm _remove_row"><i class="fas fa-trash"></i></button>
                    </td>
                </tr>

            </table>

            <table class="table table-sm mt-1" id="journal_entry_table_sum">
                <tr>
                    <td style="width: 25%"></td>
                    <td style="width: 45%"></td>
                    <td style="width: 15%">&nbsp;&nbsp;<b><span id="debit_total">0.00</span></b></td>
                    <td style="width: 15%">&nbsp;&nbsp;<b><span id="credit_total">0.00</span></b></td>
                </tr>
            </table>

        </div>
    </div>

    <br>
    <div class="row">
        <div class="col-lg-12">
            <button type="button" class="btn btn-success" onclick="cloneRow()">
                <span id="btn_loading"></span>
                Add
            </button>

            @if($approve == 1)
                <button type="button" class="btn btn-primary" id="btn_save" onclick="saveJournalEntry(1)">
                    <span id="btn_loading"></span>
                    Create Journal Entry
                </button>
            @else
                <button type="button" class="btn btn-primary" id="btn_save" onclick="saveJournalEntry(2)">
                    <span id="btn_loading"></span>
                    Approval Journal Entry
                </button>
            @endif

        </div>
    </div>
</form>

<script>

    $('._journal_entry_type').select2();

    function saveJournalEntry(mode) {

        var csrf_token = $('meta[name="csrf-token"]').attr('content');

        var journalEntryDate = $("#journal_entry_date").val();

        var send_email_address = $("#send_email_address").val();

        var send_email_valid = true;

        var approve = ;

        if(approve == 0)
        {
            if(send_email_address == "")
            {
                send_email_valid = false;
            }
        }

        if(send_email_valid) {
            if (journalEntryDate != "") {

                $("#btn_save").attr("disabled", true);
                $("#btn_loading").addClass("fa fa-spinner fa-spin fa-fw");
                $("#message_area").html("");

                var dataArray = [];
                $("#journal_entry_table tr:not(:first)").each(function() {
                    var currentRow = $(this).closest("tr");
                    var data = {
                        journalEntryTypeId: currentRow.find("._journal_entry_type option:selected").val(),
                        remarks: currentRow.find("._remarks").val(),
                        debitAmount: currentRow.find("._debit_amount").val(),
                        creditAmount: currentRow.find("._credit_amount").val()

                    };
                    dataArray.push(data);
                });

                $.ajax({
                    type: 'post',
                    url: '{{ url('/journal-entry/save-journal-entry') }}',
                    data: {
                        _token: csrf_token,
                        journal_data: dataArray,
                        journal_entry_date: journalEntryDate,
                        mode: mode,
                        send_email_address: send_email_address
                    },
                    async: true,
                    success: function(data) {
                        // alert(data);
                        $("#btn_save").attr("disabled", false);
                        $("#btn_loading").removeClass("fa fa-spinner fa-spin fa-fw");
                        $('#btn_save').html('Create Journal Entry');
                        swlToster('success', "Record successfully saved");
                        $("#journal_entry_form")[0].reset();
                        location.reload();


                    },
                    error: function(data) {
                        if (data.status == 422) {
                            var errors = data.responseJSON.errors;
                            for (i in errors) {
                                $("#message_area").append(
                                    "<span class='fa fa-exclamation-triangle mt-sm-1 mr-1'></span> <span class='mr-4'>" +
                                    errors[i] + "</span >");
                            }
                            $("#btn_save").attr("disabled", false);
                            $("#btn_loading").removeClass("fa fa-spinner fa-spin fa-fw");
                        } else {
                            $("#btn_save").attr("disabled", false);
                            $("#btn_loading").removeClass("fa fa-spinner fa-spin fa-fw");
                            swlToster('error', "Something went wrong");
                        }
                    }
                });
            } else {
                $("#btn_save").attr("disabled", true);
                swlToster('error', "Please Select Date!");
            }
        } else {
            swlToster('error', "Email Address is Required!");
        }
    }

    function cloneRow(type, type2, amount) {

        var row = document.getElementById("row2"); // find row to copy
        var table = document.getElementById("journal_entry_table"); // find table to append to
        var rowCount = $('#journal_entry_table tr').length;

        // Destroy select2 on all select elements inside the row before cloning
        $(row).find('select.select2').each(function () {
            if ($(this).hasClass('select2-hidden-accessible')) {
                $(this).select2('destroy');
            }
        });

        var clone = row.cloneNode(true); // copy children too
        clone.id = "row" + rowCount; // change id or other attributes/contents

        // Clear values and disable/enable accordingly
        $(clone).find(type2).prop('disabled', true).val(0);
        $(clone).find(type).prop('disabled', false).val(amount);

        // Append the cloned row to the table
        table.appendChild(clone);

        // Re-initialize select2 on the new cloned row
        $('#row' + rowCount).find('select.select2').select2();

        // If you want to set the default selection, use something like this:
        // $('#row' + rowCount).find('.select2').val(amount).trigger('change');

        $('._journal_entry_type').select2();
    }




    $(document).ready(function() {

        $(document).on("keyup change", "._debit_amount", function() {
            // $(this).closest('tr').find('._credit_amount').prop('disabled', true);
            //// alert("click bound to document listening for #test-element");


        });

        $(document).on("keyup change", "._credit_amount", function() {
            // $(this).closest('tr').find('._debit_amount').prop('disabled', true);
            //// alert("click bound to document listening for #test-element");


        });

        $(document).on("blur", "._debit_amount_clone", function() {

            getsum();

        });

        $(document).on("blur", "._credit_amount_clone", function() {

            getsum();

        });

        $(document).on("blur", "._remarks", function() {

            $("._remarks").val($(this).val());

        });

        $(document).on("change", "#journal_entry_date", function() {

           $("#btn_save").attr("disabled", false);

        });

        $(document).on("click", "._remove_row", function() {

            var id = $(this).closest('tr').attr('id');

            if(id != 'row1' && id != 'row2')
            {
                $(this).closest('tr').remove();
            }
            else
            {
                swlToster('warning', "Can't remove that rows");
            }

        });

        

    });

    function getsum() {
        // alert();
        var sum_debit = 0;
        var sum_credit = 0;
        $("._debit_amount").each(function() {
            if($(this).val() != '')
            {
                if (!isNaN($(this).val())) {
                    sum_debit += parseFloat($(this).val());
                } else {
                    swlToster('warning', "Non-numeric input detected");
                }
            }
        });

        $("._credit_amount").each(function() {
            if($(this).val() != '')
            {
                if (!isNaN($(this).val())) {
                    sum_credit += parseFloat($(this).val());
                } else {
                    swlToster('warning', "Non-numeric input detected");
                }
            }
        });

        if (sum_debit != sum_credit) {

            var type = "";
            var type2 = "";
            var amount = "";
            if (sum_debit > sum_credit) {
                type = "._credit_amount";
                type2 = "._debit_amount";
                amount = sum_debit - sum_credit;

            } else if (sum_credit - sum_debit) {
                type = "._debit_amount";
                type2 = "._credit_amount";
                amount = sum_credit - sum_debit;

            }

            // cloneRow(type, type2, amount);



        }

        var sum_debit_total = 0;
        var sum_credit_total = 0;

        $("._debit_amount").each(function() {
            if($(this).val() != '')
            {
                if (!isNaN($(this).val())) {
                    sum_debit_total += parseFloat($(this).val());
                    $('#debit_total').text(sum_debit_total.toFixed(2));
                } else {
                    swlToster('warning', "Non-numeric input detected");
                }
            }
            
        });

        $("._credit_amount").each(function() {
            if($(this).val() != '')
            {
                if (!isNaN($(this).val())) {
                    sum_credit_total += parseFloat($(this).val());
                    $('#credit_total').text(sum_credit_total.toFixed(2));
                } else {
                    swlToster('warning', "Non-numeric input detected");
                }
            }
        });
    }
</script>