@extends('admin.layouts.master')
@section('content')
    @include('admin.layouts.css')
    <style>
        .select2-search__field {
            line-height: normal;
            font-family: "Noto Nastaliq Urdu", serif !important;
        }

        .card-body .selection span {
            font-family: "Noto Nastaliq Urdu", serif;
            font-size: 18px;
        }

        .select2-results__option {
            font-family: "Noto Nastaliq Urdu", serif;
        }

        .dataTables_filter label {
            direction: rtl !important;
            padding: 11px;

        }

        .direction-ltr {
            direction: ltr !important;
        }

        .balance-textbox {
            padding: 7.8px;
        }
    </style>
    <!-- Page Header -->
    <div class="d-md-flex d-block align-items-center justify-content-end my-4 page-header-breadcrumb">
        <div class="ms-md-1 ms-0">
            <nav>
                <ol class="breadcrumb mb-0">
                    <li class="breadcrumb-item urdu-fonts"><a href="javascript:void(0);">@lang('lang.bank')</a></li>
                    <li class="breadcrumb-item active urdu-fonts" aria-current="page">@lang('lang.bank_payment')</li>
                </ol>
            </nav>
        </div>
    </div>

    <div class="row">
        <div class="col-xl-12">
            <div class="card custom-card">
                <div dir="rtl" class="card-header justify-content-between">
                    <div class="card-title">
                        <h3>
                            @lang('lang.bank_payment')
                        </h3>
                    </div>
                    <div class="tr_no col-md-4 d-flex align-items-end justify-content-end">
                        <div class="col-md-6">
                            <label for="form-label" class="form-label d-inline-block  mb-3">@lang('lang.tr_no')</label>
                            <input type="number" id="trans_no" style="font-family: inherit;"
                                class="form-control rounded-0 direction-ltr" name="transaction_no">
                        </div>
                        <div class="col-md-auto">
                            <button id="bankRemove" class="btn btn-danger rounded-0"><i class="fa fa-xmark"></i></button>
                        </div>
                    </div>

                </div>
                <form action="{{ route('admin.bank.bank_payment.store') }}" class=" needs-validation" method="POST"
                    novalidate>
                    @csrf
                    <div class="card-body" id="main">
                        <div class="row  gy-4 mb-5">
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 text-end">
                                <input class="credit_debit" type="hidden" value="" name="debit_credit">
                                <h5 class="urdu-fonts">@lang('lang.credit_payment')/@lang('lang.debit_payment')</h5>
                                <button type="button" name="credit_debit"
                                    class="btn btn-primary btn-lg btn_banam mt-2  urdu-fonts">@lang('lang.credit_payment')</button>
                            </div>
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <label class="form-label mb-3">@lang('lang.date')</label>
                                <input id="from_date" name="recorded_at" type="date"
                                    value="{{ @$id->record_created == null ? date('Y-m-d') : @$id->record_created }}"
                                    required class="form-control">
                            </div>
                        </div>
                        <input type="hidden" id="update_id" name="update_id" value="{{ @$id->id }}">
                        <input type="hidden" name="prevprofile" value="{{ @$id->profile_img }}">
                        <div class="row gy-4">
                            <!-- Page Header Close -->

                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <label class="form-label  mb-3">@lang('lang.supplier_balance')</label>
                                <input style="font-family: inherit" id="bank_balance" readonly value=""
                                    name="bank_balance" type="text" class="balance-textbox form-control">
                            </div>
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <label class="form-label mb-3">@lang('lang.name_payment')</label>
                                <select id="bank_data" required dir="rtl"
                                    class="select_bank js-example-basic-single select2-hidden-accessible" name="bank_id"
                                    tabindex="-1" aria-hidden="true">
                                    <option disabled selected class="urdu-fonts" value="">
                                        بنام درج</option>
                                    @foreach ($banks as $bank)
                                        <option class="urdu-fonts" value="{{ $bank->id }}"
                                            {{ @$bank->id == @$id->bank_id ? 'selected' : '' }}>
                                            {{ $bank->name . ' ' . $bank->cast }}
                                        </option>
                                    @endforeach

                                </select>
                                <div id="supplier_id_error" class="float-right text-end urdu-fonts invalid-feedback">
                                    @lang('validation.custom.banaam')
                                </div>
                            </div>
                        </div>
                        <div class="row gy-4 mt-2">
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <label class="form-label mb-3">@lang('lang.tafseel_payment')</label>
                                <div class="form-floating mb-4">
                                    <textarea id="description" name="description" class="form-control summernote" placeholder="Leave a csupplieromment here"
                                        style="height: 43px;">{!! @$id->description !!}</textarea>
                                </div>
                            </div>
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 ">
                                <label class="form-label  mb-3">@lang('lang.for_payment')</label>
                                <input id="muballig" value="{{ @$id->muballig }}" name="muballig" required type="number"
                                    style="font-family: inherit;" class="form-control direction-ltr" placeholder="">
                                <div id="muballig_error" class="float-right text-end urdu-fonts invalid-feedback">
                                    @lang('validation.custom.required_name')
                                </div>
                            </div>
                        </div>

                    </div>
                    <div dir="rtl" class="card-footer  col-xl-12 col-lg-6 col-md-6 col-sm-12 mt-2 ">
                        <button type="submit" class="simpleSubmit btn btn-primary urdu-fonts ">@lang('lang.submit') <div
                                class="spinner spinner-border spinner-border-sm" style="display:none; margin-right: 3px;"
                                role="status">
                            </div></button>
                    </div>



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

        <!-- End:: row-1 -->
    </div>

    @push('page-script')
        <script type="f3faaad96f397e92a96631ac-text/javascript">
            // Define base URLs for routes without parameters
            const supplierPaymentIndexBaseUrl = '{{ url('admin/supplier/supplier_payment/index') }}';
            const supplierPaymentDeleteBaseUrl = '{{ url('admin/supplier/supplier_payment/delete') }}';
        </script>
        <script type="f3faaad96f397e92a96631ac-text/javascript">
            $(document).ready(function() {
                $("#trans_no").focus(function() {
                    $(document).on('keypress', function(e) {
                        if (e.which == 13) {
                            var tr_no = $('#trans_no').val();
                            $.ajax({
                                url: "{{ route('admin.bank.bank_payment.transaction_search') }}",
                                type: "GET",
                                data: {
                                    tr_no: tr_no
                                },
                                success: function(response) {
                                    if (response.debit_credit == 'D') {
                                        $('.btn_banam').val('D')
                                        $('.btn_banam').text('بنام ')
                                    } else if (response.debit_credit == 'C') {
                                        $('.btn_banam').val('C')
                                        $('.btn_banam').text('جمع')
                                    }
                                    var select_option = '<option value="' + response
                                        .banks[0].id +
                                        '">' + response.banks[0].name + '</option>';
                                    $(this).attr("disabled", false);
                                    $(".spinner").css("display", "none");
                                    $('#muballig').val(response.muballig)
                                    $('#update_id').val(response.id)
                                    $('#description').summernote('code', response
                                        .description);
                                    $('#bank_data').html(select_option)
                                    $('#from_date').val(response.recorded_at)

                                },
                                error: function(response) {
                                    console.log(response);
                                    if (response.status === 422) {
                                        var errors = response.responseJSON.errors;
                                        var errorMessages = "";
                                        $.each(errors, function(key, value) {
                                            errorMessages += value[0] +
                                                "\n";
                                        });
                                        Swal.fire(errorMessages, "Error", "error");
                                    } else if (response.status === 500) {
                                        Swal.fire("Internal Servor Error", "Error",
                                            "error");
                                    } else {
                                        Swal.fire("error", "an error occured", "error");
                                    }
                                    $('button[type="submit"]').attr("disabled", false);
                                    $(".spinner").css("display", "none");
                                },
                            });
                        }
                    })
                });
                $(".credit_debit").val("C");
                $(".btn_banam").on("click", function() {
                    let text = $(this).text();
                    if (text == "بنام") {
                        $(this).text("جمع");
                        $(".credit_debit").val("C");
                    } else if (text == "جمع") {
                        $(this).text("بنام");
                        $(".credit_debit").val("D");
                    }
                });


                $('.select_bank').change(function() {
                    var id = $(this).val();
                    $.ajax({
                        url: "{{ route('admin.bank.bank_payment.index') }}",
                        type: "GET",
                        data: {
                            bank_id: id
                        },
                        success: function(response) {
                            $('#bank_balance').val(response.Amount)
                            $('button[type="submit"]').attr("disabled", false);
                            $(".spinner").css("display", "none");
                        },
                        error: function(response) {
                            console.log(response);
                            if (response.status === 422) {
                                var errors = response.responseJSON.errors;
                                var errorMessages = "";
                                $.each(errors, function(key, value) {
                                    errorMessages += value[0] +
                                        "\n";
                                });
                                Swal.fire(errorMessages, "Error", "error");
                            } else if (response.status === 500) {
                                Swal.fire("Internal Servor Error", "Error", "error");
                            } else {
                                Swal.fire("error", "an error occured", "error");
                            }
                            $('button[type="submit"]').attr("disabled", false);
                            $(".spinner").css("display", "none");
                        },
                    });
                })
                $('.summernote').summernote({
                    placeholder: '...تفصیل درج کریں',
                    tabsize: 2,
                    height: 100,
                    disableDragAndDrop: true,
                    toolbar: [
                        ['style', ['style']],
                        ['font', ['underline', 'strikethrough', 'superscript', 'subscript']],
                        ['fontsize', ['fontsize']],
                        ['color', ['color']],
                        ['para', ['ul', 'ol', 'paragraph']],
                    ]
                });
                $('#bankRemove').click(function() {
                    var url = "{{ route('admin.bank.bank_payment.delete') }}";
                    var value = $('#trans_no').val();
                    deletetransaction(url, value)

                })


            });
        </script>
    @endpush
@endsection
<script src="/cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js" data-cf-settings="f3faaad96f397e92a96631ac-|49" defer></script>