{{ header }}
<style type="text/css">
.table tr:nth-child(odd),.table tr:nth-child(even) {
    background-color: unset !important;
}
.table thead th {
    border-bottom: 2px solid #f1ae004d;
}

.table-bordered td, .table-bordered th {
   border-color: #f1ae004d !important;
}
.ltn__pagination ul li a {
    height: auto;
    width: 22px;
    line-height: 0px;
    border: unset;
}
.ltn__pagination ul li {
    margin-top: 0px;
}

</style>
<div id="account-password" class="container">
    <ul class="breadcrumb">
        {% for breadcrumb in breadcrumbs %}
            <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
        {% endfor %}
    </ul>
    <div class="row">{{ column_left }}
        {% if column_left and column_right %}
            {% set class = 'col-sm-6' %}
        {% elseif column_left or column_right %}
            {% set class = 'col-sm-9' %}
        {% else %}
            {% set class = 'col-sm-12' %}
        {% endif %}
        <div id="content" class="{{ class }}">{{ content_top }}
           {% if ranks.percentage >= 43 %} 
                <h2>{{ heading_title }} <small>  ({{ ranks.name }}) {{ ranks.percentage }}%</small></h2> 
                {% if is_eligible or (challenge_status_id == 2) %}
                    <h3>{{require_message}} </h3>
                    <h3>
                        {{ business_message }}
                        {% if ranks.percentage == 43 %} 
                            1500000
                        {% endif %}
                        {% if ranks.percentage == 46 %} 
                            12000000
                        {% endif %}
                        {% if ranks.percentage == 47 %} 
                            105000000
                        {% endif %}
                    </h3>
                {% endif %}
                <h3 class="mb-0">{{ text_status }} {{ challenge_status }}</h3>
                <form action="{{ action }}" method="post" enctype="multipart/form-data" class="form-horizontal">
                    {#<fieldset>#}
                        {% if is_eligible %}
                            <div class="pull-left">
                                <button type="button" id="button-apply" class="btn btn-default">{{ button_require }}</button>
                                <span id="challenge-error" ></span>
                            </div>
                        {% endif %}
                    {#</fieldset>#}
                    {#<div class="buttons clearfix">#}
                        {#<div class="pull-left"><a href="{{ back }}" class="btn btn-default">{{ button_back }}</a></div>#}
                        {#  <div class="pull-right">#}
                            {#    <input type="submit" value="{{ button_continue }}" class="btn btn-primary" />#}
                        {#  </div>#}
                    {#</div>#}
                </form>
                {% if (challenge_status_id >= 3 and challenge_status_id < 6) %}
                    {% if tot_challenge_pur %}
                        <p class="m-0"> Total Challenge Purchasing : {{ tot_challenge_pur }} ({{ tot_challenge_pur_per }})</p>
                        <p class="m-0"> Challenge To Complete : {{ tot_challenge_pur_rem }} ({{ tot_challenge_pur_per_rem }})</p>
                    {% endif %}
                
                    <p class="m-0">{{ text_challenge_start_date }} {{ challenge_start_date }}</p>
                    <p class="m-0">Challenge End Date: {{ challenge_end_date }}</p>
                    {#<h3>{{ text_status }} {{ status }}</h3>#}
                    <br>
                    <div id="filter-order">
                        <h3>Business cut off</h3>
                        {% if challenge_history %}
                            <div class="table-responsive">
                                <table class="table table-bordered table-hover">
                                    <thead>
                                        <tr style="background:#fffcf4 !important;">
                                            <th>Date From</th>
                                            <th>Date To</th>
                                            <th>Amount</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for history in challenge_history %}
                                            <tr>
                                                <td>{{ history.date_from }}</td>
                                                <td>{{ history.date_to }}</td>
                                                <td>{{ history.amount }}</td>
                                            </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        {% else %}
                            <p>{{ text_empty }}</p>
                        {% endif %}
                    </div>
                    <div>
                        <h3>Monthly Business</h3>
                        {% if monthly_income %}
                            <div class="table-responsive">
                                <table class="table table-bordered table-hover">
                                    <thead>
                                        <tr style="background:#fffcf4 !important;">
                                            <th>From</th>
                                            <th>To</th>
                                            <th>Business</th>
                                            <th>Under Challenge Deduction</th>
                                            <th>Same/Upr Rank Deduction</th>
                                            <th>net</th>
                                            <th>Not Counted</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for m_income in monthly_income %}
                                            <tr>
                                                <td>{{ m_income.from }}</td>
                                                <td>{{ m_income.to }}</td>
                                                <td>{{ m_income.total }}</td>
                                                <td>{{ m_income.deduction }}</td>
                                                <td>{{ m_income.rank_ded }}</td>
                                                <td>{{ m_income.net }}</td>
                                                <td>{{ m_income.not_count }}</td>
                                            </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        {% else %}
                            <p>{{ text_empty }}</p>
                        {% endif %}
                    </div>
                    <div>
                        <h3>Business Excluded From Same/UperRank</h3>
                        {% if upr_rank_business %}
                            <div class="table-responsive">
                                <table class="table table-bordered table-hover">
                                    <thead>
                                        <tr style="background:#fffcf4 !important;">
                                            <th>Name</th>
                                            <th>User</th>
                                            <th>From</th>
                                            <th>To</th>
                                            <th>Total</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for uprrankbusiness in upr_rank_business %}
                                            <tr>
                                                <td>{{ uprrankbusiness.name }}</td>
                                                <td>{{ uprrankbusiness.username }}</td>
                                                <td>{{ uprrankbusiness.from }}</td>
                                                <td>{{ uprrankbusiness.to }}</td>
                                                <td>{{ uprrankbusiness.total }}</td>
                                            </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        {% else %}
                            <p>{{ text_empty }}</p>
                        {% endif %}
                    </div>
                {% endif %}
            {% endif %}
            {{ content_bottom }}
        </div>
        {{ column_right }}
    </div>
    <br>
    <div class="buttons clearfix mb-5">
    <div class="pull-left"><a href="{{ back }}" class="btn btn-default">{{ button_back }}</a></div>
    </div>
</div>
 <script type="text/javascript"><!--
  
 $(document).delegate('#button-apply', 'click', function() {
    $.ajax({
  
        url: 'index.php?route=challenge/challenge/apply',
        type: 'post',
        data: "",
        dataType: 'json',
        beforeSend: function() {
         	$('#button-apply').button('loading');
		},
        success: function(json) {   
            $('.alert-dismissible, .text-danger').remove();
            if (json['redirect']) {
                location = json['redirect'];
            } else if (json['error']) {
                $('#button-apply').button('reset');
                if (json['error']['warning']) {
                    $('#challenge-error').prepend('<div class="alert alert-danger alert-dismissible">' + json['error']['warning'] + '<button type="button" class="close" data-dismiss="alert">&times;</button></div>');
                }
              
            } 
           
        },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
    });
});
  </script>
{{ footer }}