{% include 'header.twig' %}


<br> <br>

<!-- // page and other top info -->
                    <div id="affiliates">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-6">
                <div class="card card_v2">
                    <div class="card-header v2_header">
                        <div id="def_side_title">
                            <div class="icon">
                                <i class="far fa-link"></i>
                            </div>
                            <div class="name">
                                Referral link
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="aff_item_link">
                            
                            <div id="msg">

                            </div>
                            <div class="item_link">
                                <input type="text" class="form-control" id="myInput" value="{{ site["url"] }}/affiliates?ref={{ user['ref_code'] }}">
                            </div>
                          <!--  <button class="btn btn-primary d-block w-100 mt-3" onclick="copyLink()">Copy Link</button> -->
                        </div>

                        <div class="aff_item">
                            <div class="item_left">
                                <div class="icon">
                                    <i class="far fa-percent"></i>
                                </div>
                              Commission rate
                            </div>
                            <div class="item_right">
                              {{ settings["ref_bonus"] }}%
                            </div>
                        </div>

                        <div class="aff_item">
                            <div class="item_left">
                                <div class="icon">
                                    <i class="far fa-sack-dollar"></i>
                                </div>
                             Minimum payout
                            </div>
                            <div class="item_right">
                             	{{settings["referral_payout"]}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-6">
                <div class="card card_v2">
                    <div class="card-header v2_header">
                        <div id="def_side_title">
                            <div class="icon">
                                <i class="far fa-link"></i>
                            </div>
                            <div class="name">
                               Affiliates Statistics
                            </div>
                        </div>
                    </div>
                    <div class="card-body">

                        <div class="affiliate_wrap">
                            <div class="sm_aff_item">
                                <div class="icon">
                                    <i class="fas fa-mouse-pointer"></i>
                                </div>
                                <div class="sm_content">
                                    <p>Total Clicks</p>
                                    <h4>{{ ref['referral_clicks'] }}</h4>
                                </div>
                            </div>
    
                            <div class="sm_aff_item">
                                <div class="icon">
                                    <i class="far fa-user-plus"></i>
                                </div>
                                <div class="sm_content">
                                    <p>Total Invited</p>
                                    <h4>{{ ref['referral_sign_up'] }}</h4>
                                </div>
                            </div>
    
                            <div class="sm_aff_item">
                                <div class="icon">
                                    <i class="far fa-hand-holding-usd"></i>
                                </div>
                                <div class="sm_content">
                                    <p>Total Outgoing Payment</p>
                                    <h4>{{ currency['symbol'] }}{{ ref['referral_earned_commision']*currency["value"] }}</h4>
                                </div>
                            </div>
    
                            <div class="sm_aff_item">
                                <div class="icon">
                                    <i class="far fa-user-check"></i>
                                </div>
                                <div class="sm_content">
                                    <p>Total earnings</p>
                                    <h4>{{ currency['symbol'] }}{{ (ref['referral_total_commision'] - (ref['referral_earned_commision']  +  ref['referral_requested_commision'] +  ref['referral_rejected_commision'])) *currency["value"] }}</h4>
                                </div>
                            </div>
    
    
                          <!--  <div class="sm_aff_item">
                                <div class="icon">
                                    <i class="far fa-badge-dollar"></i>
                                </div>
                                <div class="sm_content">
                                    <p>Total earnings</p>
                                    <h4>$0.00</h4>
                                </div>
                            </div>
    
                            <div class="sm_aff_item">
                                <div class="icon">
                                    <i class="far fa-sack-dollar"></i>
                                </div>
                                <div class="sm_content">
                                    <p>Available earnings</p>
                                    <h4>$0.00</h4>
                                </div>
                            </div> -->
                        </div>
                                            </div>
                </div>
            </div>
        </div>
            </div>
</div>


{% include 'footer.twig' %}