{% extends 'super_admin_templates/base.html' %}
{% block content %}
<!-- Content Wrapper. Contains page content -->

<style type="text/css">
    .pagination-page-info {
        padding: .6em;
        padding-left: 0;
        width: 40em;
        margin: .5em;
        margin-left: 0;
        font-size: 12px;
    }

    .pagination-page-info b {
        color: black;
        background: #6aa6ed;
        padding-left: 2px;
        padding: .1em .25em;
        font-size: 150%;
    }

    .centered {
        text-align: center;
    }
</style>

<script>
    $(document).ready(function () {
        // Select all checkboxes
        $('#selectmerchant').click(function () {
            var checked = this.checked;
            $('.merchant-checkbox').each(function () {
                this.checked = checked;
            });
        });
    });
</script>


<script>
    $(document).ready(function () {
        // Select all checkboxes
        $('#settlementMerchant').click(function () {
            var checked = this.checked;
            $('.settlementMerchant-checkbox').each(function () {
                this.checked = checked;
            });
        });
    });
</script>

<script>
    function openUpdateModal(commission) {
        // Set the form action URL using the ID
        const updateGenerateCommissionBaseURL = "{{ url_for('admin_reports.update_generated_commission', generatedCommissionId='__ID__') }}";
        const formAction = updateGenerateCommissionBaseURL.replace('__ID__', commission.id);
        document.getElementById('updateGenerateCommissionForm').action = formAction;


        // Populate the form fields
        document.getElementById('editmerchantName').value = commission.merchantName || '';
        document.getElementById('editmerchantType').value = commission.merchantType || '';
        document.getElementById('edittotalTxnAmount').value = commission.totalTxnAmount || '';
        document.getElementById('editnetCommissionAmount').value = commission.netCommissionAmount || '';
        document.getElementById('editcommissionAmount').value = commission.commissionAmount || '';
        document.getElementById('editGstValue').value = commission.gstValue || '';
        document.getElementById('editTdsValue').value = commission.tdsValue || '';

        // Show the modal
        const modal = new bootstrap.Modal(document.getElementById('updateTask'));
        modal.show();
    }
</script>

<!-- Start::app-content -->
<div class="main-content app-content">
    <div class="container-fluid">

        <!-- Page Header -->
        <div class="d-md-flex d-block align-items-center justify-content-between my-4 page-header-breadcrumb">
            <h1 class="page-title fw-semibold fs-18 mb-0">Settlement</h1>
            <div class="ms-md-1 ms-0">
                <nav>
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item"><a href="{{ url_for('admin.dashboard') }}">Home</a></li>
                        <li class="breadcrumb-item active" aria-current="page">Commission Settlement List</li>
                    </ol>
                </nav>
            </div>
        </div>
        <!-- Page Header Close -->

        <!-- Start::row-1 -->
        <div class="row">
            <div class="col-xl-12">
                <div class="card custom-card">
                    <div class="card-header">
                        <div class="card-title">
                            Commission Settlement List
                        </div>
                    </div>
                    <div class="card-body">
                        {% with messages = get_flashed_messages() %}
                        {% if messages %}
                        <ul class="flashes">
                            {% for message in messages %}
                            <h2><b>
                                    <center style="color:green">{{ message }}</center>
                                </b></h2>
                            {% endfor %}
                        </ul>
                        {% endif %}
                        {% endwith %}
                        <center>
                            {% if error %}
                            <h2><b>
                                    <center style="color:RED">{{ error }}</center>
                                </b></h2>
                            {% endif %}
                        </center>

                        <nav class="nav nav-style-6 nav-pills mb-3 nav-justified d-sm-flex d-block" role="tablist">
                            {% if 'view' in session.get('unSettlementCommissionPermissions', []) %}
                            {% if redirectval == "UnsettlementCommission" %}
                            <a class="nav-link active" data-bs-toggle="tab" role="tab" aria-current="page"
                                href="#nav-products-justified" aria-selected="true">Unsettlement Commission</a>
                            {% else %}
                            <a class="nav-link" data-bs-toggle="tab" role="tab" aria-current="page"
                                href="#nav-products-justified" aria-selected="true">Unsettlement Commission</a>
                            {% endif %}
                            {% endif %}
                            {% if 'view' in session.get('generateSettlementCommissionPermissions', []) %}
                            {% if redirectval == "GenerateCommission" %}
                            <a class="nav-link active" data-bs-toggle="tab" role="tab" href="#nav-cart-justified"
                                aria-selected="false">Generate Commission</a>
                            {% else %}
                            <a class="nav-link" data-bs-toggle="tab" role="tab" href="#nav-cart-justified"
                                aria-selected="false">Generate Commission</a>
                            {% endif %}
                            {% endif %}
                            {% if 'view' in session.get('settlementCommissionPermissions', []) %}
                            {% if redirectval == "SettlementCommission" %}
                            <a class="nav-link active" data-bs-toggle="tab" role="tab" href="#nav-settlement-justified"
                                aria-selected="false">Settlement Commission</a>
                            {% else %}
                            <a class="nav-link" data-bs-toggle="tab" role="tab" href="#nav-settlement-justified"
                                aria-selected="false">Settlement Commission</a>
                            {% endif %}
                            {% endif %}
                        </nav>

                        <div class="tab-content">
                            {% if 'view' in session.get('unSettlementCommissionPermissions', []) %}
                            {% if redirectval == "UnsettlementCommission" %}
                            <div class="tab-pane show active text-muted" id="nav-products-justified" role="tabpanel">
                                {% else %}
                                <div class="tab-pane text-muted" id="nav-products-justified" role="tabpanel">
                                    {% endif %}
                                    <div class="row">
                                        <div class="col-xl-12">
                                            <form method="GET"
                                                action="{{ url_for('admin_reports.commission_settlements') }}"
                                                class="row gy-2 gx-3 align-items-center mb-4">

                                                <div class="col-auto">
                                                    <select class="form-select" id="selectYear" name="selectYear">
                                                        <option value="{{ current_year }}" {% if
                                                            selectYear==current_year|string %} selected {% endif %}>{{
                                                            current_year }}</option>
                                                        <option value="{{ last_year }}" {% if
                                                            selectYear==last_year|string %} selected {% endif %}>{{
                                                            last_year }}</option>
                                                    </select>
                                                </div>

                                                <div class="col-auto">
                                                    <select class="form-select" id="selectMonth" name="selectMonth">
                                                        <option value="January" {% if selectMonth=="January" %} selected
                                                            {% endif %}>January</option>
                                                        <option value="February" {% if selectMonth=="February" %}
                                                            selected {% endif %}>February</option>
                                                        <option value="March" {% if selectMonth=="March" %} selected {%
                                                            endif %}>March</option>
                                                        <option value="April" {% if selectMonth=="April" %} selected {%
                                                            endif %}>April</option>
                                                        <option value="May" {% if selectMonth=="May" %} selected {%
                                                            endif %}>May</option>
                                                        <option value="June" {% if selectMonth=="June" %} selected {%
                                                            endif %}>June</option>
                                                        <option value="July" {% if selectMonth=="July" %} selected {%
                                                            endif %}>July</option>
                                                        <option value="August" {% if selectMonth=="August" %} selected
                                                            {% endif %}>August</option>
                                                        <option value="September" {% if selectMonth=="September" %}
                                                            selected {% endif %}>September</option>
                                                        <option value="October" {% if selectMonth=="October" %} selected
                                                            {% endif %}>October</option>
                                                        <option value="November" {% if selectMonth=="November" %}
                                                            selected {% endif %}>November</option>
                                                        <option value="December" {% if selectMonth=="December" %}
                                                            selected {% endif %}>December</option>
                                                    </select>
                                                </div>


                                                <div class="col-auto">
                                                    <button type="submit" class="btn btn-primary">Search</button>
                                                </div>
                                                <div class="col-auto">
                                                    <a href="{{url_for('admin_reports.commission_settlements')}}"><button
                                                            type="button" class="btn btn-warning">Reset</button></a>
                                                </div>
                                                {% for error in form.selectYear.errors %}
                                                <span class="text-danger" class="error">{{ error }}</span>
                                                {% endfor %}
                                                {% for error in form.selectMonth.errors %}
                                                <span class="text-danger" class="error">{{ error }}</span>
                                                {% endfor %}

                                                <div class="col-auto">
                                                    <a
                                                        href="{{url_for('admin_reports.admin_download_commissions_settlement_excel_reports',selectYear=selectYear,selectMonth=selectMonth)}}"><button
                                                            type="button" title="Click to download" class="btn btn-secondary"><i
                                                                class="ri-file-excel-line"></i></button></a>
                                                </div>

                                            </form>

                                        </div>
                                    </div>

                                    <!-- Add some space -->
                                    <div class="mt-3"></div>
                                    <!-- End space -->
                                    <form method="POST" action="{{ url_for('admin_reports.generate_new_commission') }}"
                                        class="row gy-2 gx-3 align-items-center mb-4">
                                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                                        <input type="hidden" name="selectYear" value="{{selectYear}}">
                                        <input type="hidden" name="selectMonth" value="{{selectMonth}}">

                                        <div class="table-responsive">
                                            <table id="" class="table text-nowrap">
                                                <thead class="table-primary">
                                                    <tr>
                                                        <th scope="col"><input type="checkbox"
                                                                id="selectmerchant" />S.No</th>
                                                        <th scope="col">Merchant Name</th>
                                                        <th scope="col">Merchant Type</th>
                                                        <th scope="col">Txn Amount(₹)</th>
                                                        <th scope="col">Total OverAll Commissio n(₹)</th>
                                                        <th scope="col">Net Commission(₹)</th>
                                                        <!-- <th scope="col">GST(%)</th> -->
                                                        <th scope="col">TDS(%)</th>
                                                        <th scope="col">TDS(₹)</th>
                                                        <th scope="col">Commission Amount(₹)</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    {% if commissionsList %}
                                                    {% for each_unsettle_commission in commissionsList %}
                                                    <tr>
                                                        <td scope="col"><input type="checkbox" class="merchant-checkbox"
                                                                name="merchantIds"
                                                                value="{{ each_unsettle_commission.merchantId }}-{{ loop.index }}" />{{
                                                            loop.index }}</td>

                                                        {% if each_unsettle_commission.merchantName %}
                                                        <td>{{ each_unsettle_commission.merchantName }}</td>
                                                        {% else %}
                                                        <td class="centered">-</td>
                                                        {% endif %}

                                                        {% if each_unsettle_commission.merchantType %}
                                                        <td>{{ each_unsettle_commission.merchantType }}</td>
                                                        {% else %}
                                                        <td class="centered">-</td>
                                                        {% endif %}

                                                        <td style="text-align: right;">{{
                                                            each_unsettle_commission.totalAmount }}</td>
                                                        <td style="text-align: right;">{{
                                                            each_unsettle_commission.totalOverallCommission }}</td>
                                                        <td style="text-align: right;">
                                                            {{each_unsettle_commission.totalUserParentCommissionAmount}}
                                                        </td>
                                                        <!-- <td><input type="text" class="form-control merchant-checkbox" pattern="([0-9]+([.][0-9]*)?|[.][0-9])" id="gstValue" name="gstValue" value="0" placeholder="Enter GST Value"></td> -->
                                                        <td><input type="text" pattern="([0-9]+([.][0-9]*)?|[.][0-9])"
                                                                class="form-control" id="tdsValue"
                                                                value="{{each_unsettle_commission.tdsValue}}"
                                                                placeholder="Enter TDS Value" readonly></td>
                                                        <td style="text-align: right;">
                                                            {{each_unsettle_commission.tdsTotal}}</td>
                                                        <td style="text-align: right;">
                                                            {{each_unsettle_commission.commissionAmount}}</td>
                                                    </tr>
                                                    {% endfor %}
                                                    {% else %}
                                                    <tr>
                                                        <td colspan="12" style="text-align: center;">No Data Found</td>
                                                    </tr>
                                                    {% endif %}
                                                </tbody>
                                            </table>

                                        </div>

                                        <div>
                                            <div class="modal-footer justify-content-between">
                                                <button type="submit" class="btn btn-primary">Submit</button>
                                            </div>
                                        </div>
                                    </form>
                                    <div class="col-sm-12 col-md-12 mt-3">
                                        <nav aria-label="Page navigation" class="pagination-style-1">
                                            <ul class="pagination mb-0">
                                                {% if pagination %}
                                                <div class="pagination">
                                                    {{ pagination.links }}
                                                </div>
                                                {% endif %}
                                            </ul>
                                        </nav>
                                    </div>
                                </div>
                                {% endif %}

                                {% if 'view' in session.get('generateSettlementCommissionPermissions', []) %}
                                {% if redirectval == "GenerateCommission" %}
                                <div class="tab-pane show active text-muted" id="nav-cart-justified" role="tabpanel">
                                    {% else %}
                                    <div class="tab-pane text-muted" id="nav-cart-justified" role="tabpanel">
                                        {% endif %}

                                        <form method="GET"
                                            action="{{url_for('admin_reports.generate_commissions_list')}}"
                                            enctype="multipart/form-data">

                                            <!-- Add your form fields here -->
                                            <div class="row">
                                                <div class="col-auto">
                                                    <select class="form-select" id="selectYear" name="selectYear">
                                                        <option value="{{ current_year }}" {% if
                                                            selectYear==current_year|string %} selected {% endif %}>{{
                                                            current_year }}</option>
                                                        <option value="{{ last_year }}" {% if
                                                            selectYear==last_year|string %} selected {% endif %}>{{
                                                            last_year }}</option>
                                                    </select>
                                                </div>

                                                <div class="col-auto">
                                                    <select class="form-select" id="selectMonth" name="selectMonth">
                                                        <option value="January" {% if selectMonth=="January" %} selected
                                                            {% endif %}>January</option>
                                                        <option value="February" {% if selectMonth=="February" %}
                                                            selected {% endif %}>February</option>
                                                        <option value="March" {% if selectMonth=="March" %} selected {%
                                                            endif %}>March</option>
                                                        <option value="April" {% if selectMonth=="April" %} selected {%
                                                            endif %}>April</option>
                                                        <option value="May" {% if selectMonth=="May" %} selected {%
                                                            endif %}>May</option>
                                                        <option value="June" {% if selectMonth=="June" %} selected {%
                                                            endif %}>June</option>
                                                        <option value="July" {% if selectMonth=="July" %} selected {%
                                                            endif %}>July</option>
                                                        <option value="August" {% if selectMonth=="August" %} selected
                                                            {% endif %}>August</option>
                                                        <option value="September" {% if selectMonth=="September" %}
                                                            selected {% endif %}>September</option>
                                                        <option value="October" {% if selectMonth=="October" %} selected
                                                            {% endif %}>October</option>
                                                        <option value="November" {% if selectMonth=="November" %}
                                                            selected {% endif %}>November</option>
                                                        <option value="December" {% if selectMonth=="December" %}
                                                            selected {% endif %}>December</option>
                                                    </select>
                                                </div>
                                                <div class="col-auto">
                                                    <button type="submit" class="btn btn-primary">Search</button>
                                                </div>
                                                <div class="col-auto">
                                                    <a href="{{url_for('admin_reports.generate_commissions_list')}}"><button
                                                            type="button" class="btn btn-warning">Reset</button></a>
                                                </div>
                                                {% for error in form.selectYear.errors %}
                                                <span class="text-danger" class="error">{{ error }}</span>
                                                {% endfor %}
                                                {% for error in form.selectMonth.errors %}
                                                <span class="text-danger" class="error">{{ error }}</span>
                                                {% endfor %}
                                            </div>
                                        </form>



                                        <!-- Add some space -->
                                        <div class="mt-3"></div>
                                        <!-- End space -->
                                        <form method="POST"
                                            action="{{url_for('admin_reports.merchant_settlement')}}"
                                            enctype="multipart/form-data">
                                            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                                            <div class="table-responsive">
                                                <table id="" class="table text-nowrap">
                                                    <thead class="table-primary">
                                                        <tr>
                                                            <th scope="col"><input type="checkbox"
                                                                    id="settlementMerchant" />S.No</th>
                                                            <th scope="col">Merchant Name</th>
                                                            <th scope="col">Merchant Type</th>
                                                            <th scope="col">Year</th>
                                                            <th scope="col">Month</th>
                                                            <th scope="col">Txn Amount(₹)</th>
                                                            <th scope="col">Net Commission(₹)</th>
                                                            <th scope="col">GST(%)</th>
                                                            <th scope="col">TDS(%)</th>
                                                            <th scope="col">Commission Amount(₹)</th>
                                                            <th scope="col">Status</th>
                                                            <th scope="col">Generated On</th>
                                                            <th scope="col">Action</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        {% if generatedCommissionsList %}
                                                        {% for each_generated_commission in generatedCommissionsList %}
                                                        <tr>
                                                            <td scope="col"><input type="checkbox"
                                                                    class="settlementMerchant-checkbox"
                                                                    name="generatedCommissionIdsList[]"
                                                                    value="{{ each_generated_commission.id }}" />{{
                                                                snoCount+loop.index }}</td>

                                                            {% if each_generated_commission.userId.fullName %}
                                                            <td>{{ each_generated_commission.userId.fullName }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            

                                                            {% if each_generated_commission.userId.merchantType %}
                                                            <td>{{ each_generated_commission.userId.merchantType }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            

                                                            {% if each_generated_commission.year %}
                                                            <td>{{ each_generated_commission.year }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            

                                                            {% if each_generated_commission.month %}
                                                            <td>{{ each_generated_commission.month }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            
                                                            <td style="text-align: right;">{{
                                                                each_generated_commission.totalTxnAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_generated_commission.netCommissionAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_generated_commission.gstAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_generated_commission.tdsAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_generated_commission.commissionAmount }}</td>
                                                            <td>
                                                                {% if each_generated_commission.status == 1 %}
                                                                <a class="btn btn-sm btn-success" href="#">Generated</a>
                                                                {% else %}
                                                                <a class="btn btn-sm btn-warning" href="#">Settled</a>
                                                                {% endif %}
                                                            </td>
                                                            <td>{{each_generated_commission.createdOn}}</td>
                                                            <td>
                                                                <!--   <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#updateTask{{ loop.index }}">
                                                        <i class="ri-edit-line"></i>
                                                    </a> -->

                                                                <a href="javascript:void(0);" onclick='openUpdateModal({
                                                    "id": "{{ each_generated_commission.id }}",
                                                    "merchantName": "{{ each_generated_commission.userId.fullName }}",
                                                    "merchantType": "{{ each_generated_commission.userId.merchantType }}",
                                                    "totalTxnAmount": "{{ each_generated_commission.totalTxnAmount }}",
                                                    "netCommissionAmount": "{{ each_generated_commission.netCommissionAmount }}",
                                                    "commissionAmount": "{{ each_generated_commission.commissionAmount }}",
                                                    "gstValue": {{ each_generated_commission.gstValue | tojson }},
                                                    "tdsValue": {{ each_generated_commission.tdsValue | tojson }}
                                                    })' class="btn btn-icon btn-sm btn-info-transparent rounded-pill">
                                                                    <i class="ri-edit-line"></i>
                                                                </a>

                                                            </td>
                                                        </tr>
                                                        {% endfor %}
                                                        {% else %}
                                                        <tr>
                                                            <td colspan="12" style="text-align: center;">No Data Found
                                                            </td>
                                                        </tr>
                                                        {% endif %}
                                                    </tbody>
                                                </table>

                                            </div>

                                            <div>
                                                <div class="modal-footer justify-content-between">
                                                    <button type="submit" class="btn btn-primary">Settlement</button>
                                                </div>
                                            </div>
                                        </form>

                                        <!-- Add some space -->
                                        <div class="col-sm-12 col-md-12 mt-3">
                                            <nav aria-label="Page navigation" class="pagination-style-1">
                                                <ul class="pagination mb-0">
                                                    {% if pagination %}
                                                    <div class="pagination">
                                                        {{ pagination.links }}
                                                    </div>
                                                    {% endif %}
                                                </ul>
                                            </nav>
                                        </div>
                                        <!-- End space -->
                                    </div>
                                    {% endif %}

                                    {% if 'view' in session.get('settlementCommissionPermissions', []) %}
                                    {% if redirectval == "SettlementCommission" %}
                                    <div class="tab-pane show active text-muted" id="nav-settlement-justified"
                                        role="tabpanel">
                                        {% else %}
                                        <div class="tab-pane text-muted" id="nav-settlement-justified" role="tabpanel">
                                            {% endif %}

                                            <form method="GET"
                                                action="{{url_for('admin_reports.settlement_commissions_list')}}"
                                                enctype="multipart/form-data">

                                                <!-- Add your form fields here -->
                                                <div class="row">
                                                    <div class="col-auto">
                                                        <select class="form-select" id="selectYear" name="selectYear">
                                                            <option value="{{ current_year }}" {% if
                                                                selectYear==current_year|string %} selected {% endif %}>
                                                                {{ current_year }}</option>
                                                            <option value="{{ last_year }}" {% if
                                                                selectYear==last_year|string %} selected {% endif %}>{{
                                                                last_year }}</option>
                                                        </select>
                                                    </div>

                                                    <div class="col-auto">
                                                        <select class="form-select" id="selectMonth" name="selectMonth">
                                                            <option value="January" {% if selectMonth=="January" %}
                                                                selected {% endif %}>January</option>
                                                            <option value="February" {% if selectMonth=="February" %}
                                                                selected {% endif %}>February</option>
                                                            <option value="March" {% if selectMonth=="March" %} selected
                                                                {% endif %}>March</option>
                                                            <option value="April" {% if selectMonth=="April" %} selected
                                                                {% endif %}>April</option>
                                                            <option value="May" {% if selectMonth=="May" %} selected {%
                                                                endif %}>May</option>
                                                            <option value="June" {% if selectMonth=="June" %} selected
                                                                {% endif %}>June</option>
                                                            <option value="July" {% if selectMonth=="July" %} selected
                                                                {% endif %}>July</option>
                                                            <option value="August" {% if selectMonth=="August" %}
                                                                selected {% endif %}>August</option>
                                                            <option value="September" {% if selectMonth=="September" %}
                                                                selected {% endif %}>September</option>
                                                            <option value="October" {% if selectMonth=="October" %}
                                                                selected {% endif %}>October</option>
                                                            <option value="November" {% if selectMonth=="November" %}
                                                                selected {% endif %}>November</option>
                                                            <option value="December" {% if selectMonth=="December" %}
                                                                selected {% endif %}>December</option>
                                                        </select>
                                                    </div>
                                                    <div class="col-auto">
                                                        <button type="submit" class="btn btn-primary">Search</button>
                                                    </div>
                                                    <div class="col-auto">
                                                        <a
                                                            href="{{url_for('admin_reports.settlement_commissions_list')}}"><button
                                                                type="button" class="btn btn-warning">Reset</button></a>
                                                    </div>
                                                    {% for error in form.selectYear.errors %}
                                                    <span class="text-danger" class="error">{{ error }}</span>
                                                    {% endfor %}
                                                    {% for error in form.selectMonth.errors %}
                                                    <span class="text-danger" class="error">{{ error }}</span>
                                                    {% endfor %}

                                                </div>
                                            </form>


                                            <!-- Add some space -->
                                            <div class="mt-3"></div>
                                            <!-- End space -->
                                            <div class="table-responsive">
                                                <table id="" class="table text-nowrap">
                                                    <thead class="table-primary">
                                                        <tr>
                                                            <th scope="col"><input type="checkbox"
                                                                    id="settlementMerchant" />S.No</th>
                                                            <th scope="col">Merchant Name</th>
                                                            <th scope="col">Merchant Type</th>
                                                            <th scope="col">Year</th>
                                                            <th scope="col">Month</th>
                                                            <th scope="col">Txn Amount(₹)</th>
                                                            <th scope="col">Net Commission(₹)</th>
                                                            <th scope="col">GST(%)</th>
                                                            <th scope="col">TDS(%)</th>
                                                            <th scope="col">Commission Amount(₹)</th>
                                                            <th scope="col">Status</th>
                                                            <th scope="col">Generated On</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        {% if settlementCommissionsList %}
                                                        {% for each_settlement_commission in settlementCommissionsList
                                                        %}
                                                        <tr>
                                                            <td scope="col">{{ snoCount+loop.index }}</td>

                                                            {% if each_settlement_commission.userId.fullName %}
                                                            <td>{{ each_settlement_commission.userId.fullName }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            
                                                            {% if each_settlement_commission.userId.merchantType %}
                                                            <td>{{ each_settlement_commission.userId.merchantType }}
                                                            </td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            

                                                            {% if each_settlement_commission.year %}
                                                            <td>{{ each_settlement_commission.year }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            

                                                            {% if each_settlement_commission.month %}
                                                            <td>{{ each_settlement_commission.month }}</td>
                                                            {% else %}
                                                            <td class="centered">-</td>
                                                            {% endif %}
                                                            
                                                            <td style="text-align: right;">{{
                                                                each_settlement_commission.totalTxnAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_settlement_commission.netCommissionAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_settlement_commission.gstAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_settlement_commission.tdsAmount }}</td>
                                                            <td style="text-align: right;">{{
                                                                each_settlement_commission.commissionAmount }}</td>
                                                            <!--  <td>
                                                <a class="btn btn-sm btn-success" href="#">{{each_settlement_commission.generatedStatus}}</a>
                                            </td> -->

                                                            <td>
                                                                {% if each_settlement_commission.status == 2%}
                                                                <a class="btn btn-sm btn-success" href="#">Settled</a>
                                                                {% else %}
                                                                <a class="btn btn-sm btn-warning" href="#">Generated</a>
                                                                {% endif %}
                                                            </td>

                                                            <td>{{each_settlement_commission.createdOn}}</td>
                                                        </tr>
                                                        {% endfor %}
                                                        {% else %}
                                                        <tr>
                                                            <td colspan="12" style="text-align: center;">No Data Found
                                                            </td>
                                                        </tr>
                                                        {% endif %}
                                                    </tbody>
                                                </table>

                                            </div>

                                            <!-- Add some space -->
                                            <div class="col-sm-12 col-md-12 mt-3">
                                                <nav aria-label="Page navigation" class="pagination-style-1">
                                                    <ul class="pagination mb-0">
                                                        {% if pagination %}
                                                        <div class="pagination">
                                                            {{ pagination.links }}
                                                        </div>
                                                        {% endif %}
                                                    </ul>
                                                </nav>
                                            </div>
                                            <!-- End space -->
                                        </div>
                                        {% endif %}
                                    </div>



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

                </div>
            </div>
            <!-- End::app-content -->

            <!-- Update Bank Modal -->
            <div class="modal fade" id="updateTask" tabindex="-1" role="dialog" aria-labelledby="updateTaskLabel"
                aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="updateTaskLabel">Update Commission</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <form method="POST" action="" id="updateGenerateCommissionForm"
                                enctype="multipart/form-data">
                                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                                <input type="hidden" id="latitude_update" name="latitude">
                                <input type="hidden" id="longitude_update" name="longitude">

                                <div class="form-group">
                                    <label for="editmerchantName">Merchant Name*</label>
                                    <input type="text" class="form-control" id="editmerchantName" name="merchantName"
                                        pattern="^[a-zA-Z0-9\s@#$()+_\-/]+$"
                                        title="Merchant Name must contain only alphanumeric characters, spaces, and specific special characters: @#$()+_-/"
                                        readonly>
                                </div>
                                <div class="form-group">
                                    <label for="editmerchantType">Merchant Type*</label>
                                    <input type="text" class="form-control" id="editmerchantType" name="merchantType"
                                        pattern="^[a-zA-Z0-9\s@#$()+_\-/]+$"
                                        title="Merchant Name must contain only alphanumeric characters, spaces, and specific special characters: @#$()+_-/"
                                        readonly>
                                </div>
                                <div class="form-group">
                                    <label for="edittotalTxnAmount">Txn Amount*</label>
                                    <input type="text" class="form-control" id="edittotalTxnAmount"
                                        name="totalTxnAmount" pattern="^\d+(\.\d+)?$"
                                        title="Total Txn Amount contain only numeric characters" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="editnetCommissionAmount">Net Commission Amount*</label>
                                    <input type="text" class="form-control" id="editnetCommissionAmount"
                                        name="netCommissionAmount" pattern="^\d+(\.\d+)?$"
                                        title="Minimum Amount contain only numeric characters" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="editcommissionAmount">Commission Amount*</label>
                                    <input type="text" class="form-control" id="editcommissionAmount"
                                        name="commissionAmount" pattern="^\d+(\.\d+)?$"
                                        title="Commission Amount contain only numeric characters" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="editGstValue">GST(%)*</label>
                                    <input type="text" class="form-control" id="editGstValue" name="gstValue"
                                        pattern="^\d{1,10}(\.\d+)?$" title="GST Value contain only numeric characters"
                                        required>
                                    <span id="gstValue_edit_error" class="error"></span>
                                </div>
                                <div class="form-group">
                                    <label for="editTdsValue">TDS(%)*</label>
                                    <input type="text" class="form-control" id="editTdsValue" name="tdsValue"
                                        pattern="^\d{1,10}(\.\d+)?$" title="Tds Value contain only numeric characters"
                                        required>
                                    <span id="tdsValue_edit_error" class="error"></span>
                                </div>
                                <!-- Add more edit form fields as needed -->
                                <div class="modal-footer justify-content-between">
                                    <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                                    <button type="submit" class="btn btn-primary form_submit">Update</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <!-- End Update Bank Modal -->

            <script type="text/javascript">
                function numberToWords(number) {
                    var words = new Array();
                    words[0] = '';
                    words[1] = 'One';
                    words[2] = 'Two';
                    words[3] = 'Three';
                    words[4] = 'Four';
                    words[5] = 'Five';
                    words[6] = 'Six';
                    words[7] = 'Seven';
                    words[8] = 'Eight';
                    words[9] = 'Nine';
                    words[10] = 'Ten';
                    words[11] = 'Eleven';
                    words[12] = 'Twelve';
                    words[13] = 'Thirteen';
                    words[14] = 'Fourteen';
                    words[15] = 'Fifteen';
                    words[16] = 'Sixteen';
                    words[17] = 'Seventeen';
                    words[18] = 'Eighteen';
                    words[19] = 'Nineteen';
                    words[20] = 'Twenty';
                    words[30] = 'Thirty';
                    words[40] = 'Forty';
                    words[50] = 'Fifty';
                    words[60] = 'Sixty';
                    words[70] = 'Seventy';
                    words[80] = 'Eighty';
                    words[90] = 'Ninety';
                    var op;
                    if (number > 99999999999) {
                        return 'out of range';
                    }
                    var crore = Math.floor(number / 10000000); /* Crore */
                    number %= 10000000;
                    var lakh = Math.floor(number / 100000); /* Lakh */
                    number %= 100000;
                    var thousand = Math.floor(number / 1000); /* Thousand */
                    number %= 1000;
                    var hundred = Math.floor(number / 100); /* Hundred */
                    number %= 100;
                    var ten = Math.floor(number / 10);
                    var one = number % 10;
                    var result = '';
                    if (crore > 0) {
                        result += (numberToWords(crore) + ' Crore ');
                    }
                    if (lakh > 0) {
                        result += (numberToWords(lakh) + ' Lakh ');
                    }
                    if (thousand > 0) {
                        result += (numberToWords(thousand) + ' Thousand ');
                    }
                    if (hundred > 0) {
                        result += (numberToWords(hundred) + ' Hundred ');
                    }
                    if (ten > 0) {
                        if (ten < 2) {
                            result += words[ten * 10 + one];
                        } else {
                            result += words[ten * 10];
                            if (one > 0) {
                                result += ('-' + words[one]);
                            }
                        }
                    } else if (one > 0) {
                        result += words[one];
                    }
                    return result;
                }


                $(document).ready(function () {
                    $('input[id="creditamount"]').on('keyup', function () {
                        var amount = $(this).val();
                        $('#credit_amount_words').text('');
                        if (amount > 0 && amount != "" && amount != "undefined") {
                            var formattedNumber = new Intl.NumberFormat('en-IN', {
                                style: 'currency',
                                currency: 'INR'
                            }).format(amount);
                            var numberwords = numberToWords(amount);
                            $('#credit_amount_words').text(formattedNumber + "(" + numberwords + " Rupees)");
                        } else {
                            $('#credit_amount_words').text('');
                        }
                    });

                    $('input[id="debitamount"]').on('keyup', function () {
                        var amount = $(this).val();
                        $('#debit_amount_words').text('');
                        if (amount > 0 && amount != "" && amount != "undefined") {
                            var formattedNumber = new Intl.NumberFormat('en-IN', {
                                style: 'currency',
                                currency: 'INR'
                            }).format(amount);
                            var numberwords = numberToWords(amount);
                            $('#debit_amount_words').text(formattedNumber + "(" + numberwords + " Rupees)");
                        } else {
                            $('#debit_amount_words').text('');
                        }
                    });


                    $('input[id="adminamount"]').on('keyup', function () {
                        var amount = $(this).val();
                        $('#admin_amount_words').text('');
                        if (amount > 0 && amount != "" && amount != "undefined") {
                            var formattedNumber = new Intl.NumberFormat('en-IN', {
                                style: 'currency',
                                currency: 'INR'
                            }).format(amount);
                            var numberwords = numberToWords(amount);
                            $('#admin_amount_words').text(formattedNumber + "(" + numberwords + " Rupees)");
                        } else {
                            $('#admin_amount_words').text('');
                        }
                    });

                });


                $(document).ready(function () {

                    $('#credit_to_wallet').validate({
                        submitHandler: function (form) {
                            $('#cotpLogid').val('');
                            var transferType = $('#credittransferType').val();
                            if (transferType != "" && transferType != "") {
                                transferType = transferType;
                            } else {
                                transferType = "";
                            }
                            data = "credit_to_wallet=Wallet " + transferType + " Credit"
                            $.ajax({
                                type: "POST",
                                url: "{{url_for('wallet_credits_debits.generate_credit_debit_wallet_otp')}}",
                                data: data, // serializes the form's elements.
                                success: function (response) {
                                    if (response.responseStatus == 1) {
                                        var otpCheckId = response.otpCheckId;
                                        $('#cotpLogid').val(otpCheckId);
                                        $('#otpLogid').val(otpCheckId);
                                        $('#checkotp').modal('show');
                                        return false;
                                    } else {
                                        alert(response.result)
                                        return false;
                                    }
                                }
                            });
                            $('#btnYes').click(function (e) {
                                var otpCode = $('#otpCode').val();
                                var otpCheckId = $('#otpLogid').val();
                                if (otpCode != "" && otpCode != "undefined") {
                                    data = "otpCode=" + otpCode + "&otpCheckId=" + otpCheckId
                                    $.ajax({
                                        type: "POST",
                                        url: "{{url_for('wallet_credits_debits.check_wallet_otp')}}",
                                        data: data, // serializes the form's elements.
                                        success: function (response) {
                                            if (response.responseStatus == 1) {
                                                $('#checkotp').modal('hide');
                                                e.preventDefault();
                                                form.submit();
                                            } else {
                                                alert(response.result);
                                                return false;
                                            }
                                        }
                                    });

                                } else {
                                    alert("Please Enter Otp.");
                                }
                            });

                        }
                    });



                    $('#debit_to_wallet').validate({
                        submitHandler: function (form) {
                            $('#cotpLogid').val('');
                            var transferType = $('#debittransferType').val();
                            if (transferType != "" && transferType != "") {
                                transferType = transferType;
                            } else {
                                transferType = "";
                            }
                            data = "credit_to_wallet=Wallet " + transferType + " Debit"
                            $.ajax({
                                type: "POST",
                                url: "{{url_for('wallet_credits_debits.generate_credit_debit_wallet_otp')}}",
                                data: data, // serializes the form's elements.
                                success: function (response) {
                                    if (response.responseStatus == 1) {
                                        var otpCheckId = response.otpCheckId;
                                        $('#dotpLogid').val(otpCheckId);
                                        $('#otpLogid').val(otpCheckId);
                                        $('#checkotp').modal('show');
                                        return false;
                                    } else {
                                        alert(response.result)
                                        return false;
                                    }
                                }
                            });
                            $('#btnYes').click(function (e) {
                                var otpCode = $('#otpCode').val();
                                var otpCheckId = $('#otpLogid').val();
                                if (otpCode != "" && otpCode != "undefined") {
                                    data = "otpCode=" + otpCode + "&otpCheckId=" + otpCheckId
                                    $.ajax({
                                        type: "POST",
                                        url: "{{url_for('wallet_credits_debits.check_wallet_otp')}}",
                                        data: data, // serializes the form's elements.
                                        success: function (response) {
                                            if (response.responseStatus == 1) {
                                                $('#checkotp').modal('hide');
                                                e.preventDefault();
                                                form.submit();
                                            } else {
                                                alert(response.result);
                                                return false;
                                            }
                                        }
                                    });

                                } else {
                                    alert("Please Enter Otp.");
                                }
                            });

                        }
                    });

                });
            </script>


            <script type="text/javascript">

                $(document).ready(function () {

                    $('#updateGenerateCommissionForm').validate({
                        rules: {

                            gstValue: {
                                required: true,
                                minlength: 0,
                                maxlength: 10,
                            },
                            tdsValue: {
                                required: true,
                                minlength: 0,
                                maxlength: 10,
                            },
                        },
                        messages: {

                            gstValue: {
                                required: 'GST value Name is required',
                                minlength: 'gstValue must be greaterthan or equals to 0',
                                maxlength: 'gstValue must be lessthan or equals to 9999999999',
                            },

                            tdsValue: {
                                required: 'TDS value Name is required',
                                minlength: 'tdsValue must be greaterthan or equals to 0',
                                maxlength: ' tdsValuemust be lessthan or equals to 9999999999',
                            },
                        },
                        submitHandler: function (form, event) {
                            $('.form_submit').prop('disabled', true);
				            $('#newLoadingModel').show();
                            event.preventDefault();
                            getLocationAndProceed(
                                (lat, lng) => {
                                    $(form).find('input[name="latitude"]').val(lat);
                                    $(form).find('input[name="longitude"]').val(lng);
                                    $.ajax({
                                        url: form.action,
                                        type: form.method,
                                        data: $(form).serialize(),
                                        xhrFields: {
                                        withCredentials: true   // THIS ensures cookies/session are sent
                                    },
                                        success: function (response) {
                                            if (response.responseStatus == 1 || response.responseStatus == 4) {
                                                form.reset();
                                                location.reload();
                                            } else if (response.responseStatus == 0) {
                                                $('.form_submit').prop('disabled', false);
        				                        $('#newLoadingModel').hide();
                                                $.each(response.result, function (key, value) {
                                                    $('#' + key + "_error").text(value)
                                                });
                                                return false;
                                            } else if (response.responseStatus == 2) {
                                                $('.form_submit').prop('disabled', false);
        				                        $('#newLoadingModel').hide();
                                                $('#errorMessage').text(response.result);
                                                return false;
                                            } else {
                                                location.reload();
                                            }

                                        },
                                    error: function (xhr) {
                                        // You can also reload page after error (e.g. CSRF token mismatch)
                                        location.reload();
                                    }
                                    });
                                },
                                function () {
                                        $('.form_submit').prop('disabled', false);
                                        $('#newLoadingModel').hide();
                                            alert("Location access is required to proceed. Please enable it in your browser.");
                                    }
                                );
                            }
                        });
                    });
            </script>

            {% endblock %}