{% extends 'admin/layouts/base.html.twig' %}
{% set active = 'app_admin_wallet_setting' %}
{% set blockValue = 0 %}
{% set banifitesValue = 0 %}

{% set breadcrumbs = [
    {
        'link': path('app_admin_dashboard'), 'title': 'Home'
    },
    {
        'title':'Wallet Management',
    },
    {
        'title': 'Wallet Setting',
    }
]%}


{% block content %}
{% if errors is not empty %}
    <div class="alert alert-danger">
        <ul>
            {% for errorBlcoks in errors %}
                {% for error in errorBlcoks %}
                    <li>{{ error }}</li>
                {% endfor %}
            {% endfor %}
        </ul>
    </div>
{% endif %}
<div class="">
    <div class="card">
        <form id="wallet-setting-form"  class="wallet-form-validate" method="post" action="{{path('app_admin_wallet_setting')}}">
            <div class="card-body border-top">
                <div class="row mb-3">
                    <label class="col-lg-3 col-form-label"><h6>Minimum Amount<span class="text-danger">*</span> :</h6></label>
                    <div class="col-lg-6">
                        <input type="number" id="minimum_amount" name="minimum_amount" value="{{wallet_setting_data.getMinimunAmount ?? ''}}" class="form-control">
                    </div>
                </div>

                <div class="row mb-3">
                    <label class="col-lg-3 col-form-label"><h6>Maximum Amount<span class="text-danger">*</span> :</h6></label>
                    <div class="col-lg-6">
                        <input type="number" id="maximum_amount" name="maximum_amount" value="{{wallet_setting_data.getMaximumAmount ?? ''}}" class="form-control">
                    </div>
                </div>

                <div class="row mb-3">
                    <label class="col-lg-3 col-form-label"><h6>Withdrawal Payment Method<span class="text-danger">*</span> :</h6></label>
                    <div class="col-lg-6">
                        <select name="withdrawal_payment_method" data-placeholder="" class="form-control multiselect form-select" id="withdrawal_payment_method">
                            {% set selectedValue = wallet_setting_data.getWalletPaymentId.getId ?? '' %}
                            <option value="">Select Payment Method</option>
                            <!-- You can replace this with your actual options -->
                            {% for payment_setting in payment_setting_data %}
                                <option value="{{payment_setting.getId}}" {% if selectedValue == payment_setting.getId %} selected {% endif %}>{{payment_setting.getPaymentTypeName}}</option>
                            {% endfor %}
                        </select>
                        <span>You need to set CoinPayments payment method in the payment settings module.</span>
                    </div>
                </div>

                <div class="row mb-3">
                    <label class="col-lg-3 col-form-label"><h6>Payment Gateway Charge:</h6></label>
                    <div class="col-lg-6">
                        <div class="form-check-horizontal">
                            <input type="checkbox" class="form-check-input" id="payment_gateway_charge" name="payment_gateway_charge" value="1" {% if wallet_setting_data.getPaymentGetwayCharges is defined and wallet_setting_data.getPaymentGetwayCharges == '1' %} checked {% endif %}>
                            <span>If checked, you can set payment gateway charge to the user for wallet withdrawal.</span>
                        </div>
                    </div>
                </div>

                <div id="payment_getway_charge_div">
                    <!-- Your hidden fields go here -->
                    <div class="row mb-3">
                        <label class="col-lg-3 col-form-label"><h6>Gateway Charge Type:</h6></label>
                        <div class="col-lg-6">
                            {% set selectedChargeTypeValue = wallet_setting_data.getPaymentGetwayChargType ?? '' %}
                            <select name="payment_getway_charg_type" data-placeholder="" class="form-control multiselect" id="payment_getway_charg_type">
                                <option value="" {% if selectedChargeTypeValue == "" %} selected {% endif %}>Select Payment Charge Type</option>
                                <option value="percentage" {% if selectedChargeTypeValue == "percentage" %} selected {% endif %}>Percentage</option>
                                <option value="fixed_amount" {% if selectedChargeTypeValue == "fixed_amount" %} selected {% endif %}>Fixed Amount</option>
                            </select>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <label class="col-lg-3 col-form-label"></label>
                        <div class="col-lg-6">
                            <input type="number" id="charg_amount_bank_transfer" name="charg_amount_bank_transfer" value="{{wallet_setting_data.getChargAmountBankTransfer ?? ''}}" class="form-control">
                            <span>Gateway Charge Amount For Bank Transfer</span>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <label class="col-lg-3 col-form-label"></label>
                        <div class="col-lg-6">
                            <input type="number" id="charge_amount_payple" name="charge_amount_payple" value="{{wallet_setting_data.getChargeAmountPayple ?? ''}}" class="form-control">
                            <span>Gateway charge amount for PayPal</span>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <label class="col-lg-3 col-form-label"></label>
                        <div class="col-lg-6">
                            <input type="number" id="charge_amount_strip" name="charge_amount_strip" value="{{wallet_setting_data.getChargeAmountStrip ?? ''}}" class="form-control">
                            <span>Gateway charge amount for Stripe</span>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <label class="col-lg-3 col-form-label"></label>
                        <div class="col-lg-6">
                            <input type="number" id="charge_amount_coins" name="charge_amount_coins" value="{{wallet_setting_data.getChargeAmountCoins ?? ''}}" class="form-control">
                            <span>Gateway charge amount for Coinpayments - USDC.BEP20</span>
                        </div>
                    </div>
                </div>
            </div>
           <div class="card-footer d-flex justify-content-end">
                <button type="reset" class="btn btn-light" id="reset">Reset</button>
                <button type="submit" class="btn btn-primary ms-3">Submit <i class="ph-paper-plane-tilt ms-2"></i></button>
            </div>
        </form>
    </div>
</div>
{% endblock %}
{% block javascripts %}
    <script>
        $(document).ready(function() {
            // Trigger change event on payment gateway charge checkbox
            $("#payment_gateway_charge").change();

            // Hide the payment gateway charge div initially
            // $('#payment_getway_charge_div').hide();
         $('.wallet-form-validate').on('submit', function(e) {
            if ($(this).valid()) {
                Swal.fire({
                    title: 'Processing...',
                    allowOutsideClick: false,
                    didOpen: () => {
                        Swal.showLoading();
                    }
                });
                this.submit();
            }
        });
        });

        // Event listener for change on payment gateway charge checkbox
        $("#payment_gateway_charge").change(function() {
            if ($(this).prop("checked")) {
                $('#payment_getway_charge_div').css("display", "block"); // Show the div
            } else {
                $('#payment_getway_charge_div').css("display", "none"); // Show the div
                // Reset form fields
                $("#payment_getway_charg_type").val("").multiselect("refresh");
                $("#charg_amount_bank_transfer").val(""); 
                $("#charg_amount_bank_transfer-error").remove(); 
                $("#charge_amount_payple").val(""); 
                $("#charge_amount_strip").val(""); 
                $("#charge_amount_coins").val(""); 
            }
        });

        const validator = $('.wallet-form-validate').validate({

            ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
            errorClass: 'validation-invalid-label',
            successClass: 'validation-valid-label',
            validClass: 'validation-valid-label',
            highlight: function(element, errorClass) {
                $(element).removeClass(errorClass);
            },
            unhighlight: function(element, errorClass) {
                $(element).removeClass(errorClass);
            },
            success: function(label) {
                label.addClass('validation-valid-label').text('Success.'); // remove to hide Success message
            },

            // Different components require proper error label placement
            errorPlacement: function(error, element) {

                // Input with icons and Select2
                if (element.hasClass('multiselect')) {
                     error.appendTo(element.parent().parent());
                }

                // Input group, form checks and custom controls
                else if (element.parents().hasClass('form-control-feedback') || element.parents().hasClass('form-check') || element.parents().hasClass('input-group')) {
                    error.appendTo(element.parent().parent());
                }

                // Other elements
                else {
                    error.insertAfter(element);
                }
            },
            rules: {
                minimum_amount: {
                    required: true,
                },
                maximum_amount: {
                    required: true,
                },
                withdrawal_payment_method: {
                    required: true
                },
            },
        });

        // Reset form
        $('#reset').on('click', function() {
            validator.resetForm();
        });
    </script>
{% endblock %}