@extends('template.coin.layouts.copy')

@section('title', __('Dashboard'))
@section('css')
<style>
.slds-container--large{
    max-width:100% !important;
}
.nk-content{
    padding-left:0px !important;
    padding-right:0px !important;
    background-color: #fff;
}
.nk-header-fixed+.nk-content{
    margin-top:35px;
}

    zl-performance .zl-performance-th, zl-performance .zl-performance-th-sortable{
        white-space: normal;
    }
    
    .zlds table{
      border-collapse: separate;
    border-spacing: 0 9px;  
    }
    .zlds .zlds-font-size--xx-large {
    font-size: 19px;
}
.zlds .zlds-font-weight--bold {
    font-weight: 400;
}
.zl-card-performance-traders{
     color:#535353 !important;
}
.zlds  tr{
   border-collapse: separate;
    border-spacing: 0 0px;  
}
zl-username h4{
    color:#000 !important;
}

@media screen and (max-width: 980px) {
    .zls-trg{
        display:none;
    }
    
    .zlds .zzz-grid-l{
        display:block;
    }
}

</style>

@endsection

@section('content')
<div class="nk-content nk-content-fluid">
    @if(Session::has('errmessage'))
                    <div class="alert alert-danger alert-thick alert-plain">
                        <div class="alert-cta flex-wrap flex-md-nowrap g-2">
                            <div class="alert-text has-icon">
                                <em class="icon ni ni-info-fill text-danger"></em>
                                <p>{{Session::get('errmessage')}}</p>
                            </div>
                            <button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
    <span aria-hidden="true" style="color:#000">&times;</span>
  </button> 
                        </div>
                    </div>
                    @endif
                    
                    @if(Session::has('sucmessage'))
                    <div class="alert alert-success alert-thick alert-plain">
                        <div class="alert-cta flex-wrap flex-md-nowrap g-2">
                            <div class="alert-text has-icon">
                                <em class="icon ni ni-info-fill text-success"></em>
                                <p>{{Session::get('sucmessage')}}</p>
                            </div>
                           <button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
    <span aria-hidden="true" style="color:#000">&times;</span>
  </button> 
                        </div>
                    </div>
                    @endif
  <zl-performance>
    <div class="zl-performance-wrapper slds-container--center slds-container--large slds-is-relative slds-p-left--small slds-p-right--small" style="max-width: none!important;">
        <zl-performance-forex>
            <ngl-tabs class="firsttab">
                <ul role="tablist" class="slds-tabs--default__nav">
    <li role="presentation" class=" slds-text-title--caps slds-tabs--default__item">
        <a role="tab" href="{{url('dashboard')}}" aria-selected="true" tabindex="0" class="slds-tabs--default__link">
            <span tabindex="0">Home</span>
            <!---->
        </a>
    </li>
    <li role="presentation" class="slds-active slds-text-title--caps slds-tabs--default__item">
        <a role="tab" aria-selected="true" tabindex="0" class="slds-tabs--default__link">
            <span tabindex="0">ALL TRADERS</span>
            <!---->
        </a>
    </li>
    <!---->
</ul>

                <div role="tabpanel" class="slds-tabs--default__content">
                    <ngl-tabs class="secondtab-subcontents">
                        <div role="tabpanel" class="slds-tabs--default__content">
                            <zl-performance-forex-all>
                                <zl-performance-forex-list>
                                    <div class="padding15" style="margin-top: 20px; height: initial; overflow-y: initial;">
                                        <table class="zl-performance-table zl-performance-table-simple">
                                            @if(!blank($copyTraders))
                   @foreach($copyTraders as $copyTrader)
                                            <div style="height: 9px;"></div>
                                            <tbody class="large zl-card-performance-traders">
                                                <tr>
                                                    <!---->
                                                    <td rowspan="2" class="slds-text-align--center">
                                                        <zl-user-logo size="large" _nghost-sxg-c84="">
                                                            <div _ngcontent-sxg-c84="" class="zlds-avatar menuitem">
                                                                <span _ngcontent-sxg-c84="" class="slds-avatar slds-avatar--circle slds-avatar--large">
                                                                    <img _ngcontent-sxg-c84="" data-auto="menu_avatar" class="menuitem" src="/account/storage/traders/{{$copyTrader->avatar}}" alt="{{$copyTrader->name}}" />
                                                                </span>
                                                                <span _ngcontent-sxg-c84="" class="zlds-avatar__icon-nw zlds-flag zlds-flag-{{$copyTrader->flags}}" title="{{$copyTrader->flag_name}}"></span>
                                                                <!----><!---->
                                                            </div>
                                                        </zl-user-logo>
                                                    </td>
                                                    <td rowspan="2" class="zl-performance-profile">
                                                        <zl-username type="trader" public="record.profile.public">
                                                            <a class="text-main zlds-link--brand" title="{{$copyTrader->name}}" href="{{url('copytrade/details/')."/".$copyTrader->copyTradeId}}">
                                                                <h4>{{$copyTrader->name}}</h4>
                                                                <!---->
                                                            </a>
                                                            <!----><!----><!----><!----><!----><!----><!---->
                                                        </zl-username>
                                                        <br />
                                                        <div style="display: inline-flex;">
                                                            <zl-broker-logo size="S">
                                                               
                                                                <!----><!----><!---->
                                                            </zl-broker-logo>
                                                            <zl-trader-badge size="x-small">
                                                                <span>
                                                                    <!----><!----><!---->
                                                                    <zl-badge>
                                                                        <zl-icon category="zlds" title="{{$copyTrader->name}}">
                                                                            <ngl-icon>
                                                                                <svg class="slds-icon slds-icon--x-small" aria-hidden="true"><use xlink:href="{{getTemplateFiles('coin')}}/assets/user/img/icon/zls/symbols.svg#icon-badge-ea" x="0"></use></svg>
                                                                                <!---->
                                                                            </ngl-icon>
                                                                        </zl-icon>
                                                                    </zl-badge>
                                                                    <!---->
                                                                </span>
                                                                <!----><!---->
                                                                <span>
                                                                    <zl-icon category="zlds" icon="icon-badge-fully-verified" nglpopoverbehavior="" nglinteractive="true" nglpopoverplacement="bottom" tabindex="0">
                                                                        <ngl-icon>
                                                                            <svg class="slds-icon slds-icon--x-small" aria-hidden="true"><use xlink:href="{{getTemplateFiles('coin')}}/assets/user/img/icon/zls/symbols.svg#icon-badge-fully-verified" x="0"></use></svg>
                                                                            <!---->
                                                                        </ngl-icon>
                                                                    </zl-icon>
                                                                    <!---->
                                                                </span>
                                                                <!----><!---->
                                                            </zl-trader-badge>
                                                        </div>
                                                        <div
                                                            nglpopoverbehavior=""
                                                            nglinteractive="true"
                                                            nglpopoverplacement="right"
                                                            tabindex="0"
                                                            class="tether-target tether-element-attached-middle tether-element-attached-left tether-target-attached-middle tether-target-attached-right"
                                                        >
                                                            <div class="slds-text-body--small">
                                                                <zl-truncate-text>
                                                                    <span style="word-wrap: break-word; white-space: pre-wrap;">{{$copyTrader->descs}}</span>
                                                                    <!----><!----><!---->
                                                                </zl-truncate-text>
                                                            </div>
                                                        </div>
                                                        <!----><!----><!---->
                                                    </td>
                                                 
                                                    <td colspan="2">
                                                        <div class="zl-performance-th-sortable" title="The sum of the invested funds of all Real Investors copying this Trader's signals">Amount Following</div>
                                                        <div class="zlds-font-weight--bold zlds-text--success zlds-font-size--xx-large">${{number_format($copyTrader->amount_following,2,'.',',')}}</div>
                                                    </td>
                                                    <td colspan="2" class="slds-text-align--left">
                                                        <div class="zl-performance-th-sortable" title="The number of Live and Demo users following this Trader.">Investors</div>
                                                        <span style="font-size: 22px;">{{$copyTrader->investor}}</span>
                                                    </td>
                                                    <td colspan="2" class="slds-text-align--left" style="font-size: initial;">
                                                        <!---->
                                                        <div class="zl-performance-th-sortable">
                                                            <span style="margin-right: 2px;">MIN INVESTMENT</span>
                                                            <zl-icon nglpopoverplacement="bottom" nglinteractive="true" nglpopoverbehavior="" nglpopoverdelay="400" category="zlds" icon="icon-info-icon-no-color" size="x-small" tabindex="0">
                                                                <ngl-icon>
                                                                    <svg class="slds-icon slds-icon--x-small" aria-hidden="true"><use xlink:href="{{getTemplateFiles('coin')}}/assets/user/img/icon/zls/symbols.svg#icon-info-icon-no-color" x="0"></use></svg>
                                                                    <!---->
                                                                </ngl-icon>
                                                            </zl-icon>
                                                            <!---->
                                                        </div>
                                                        <div class="zlds-font-size--xx-large" style="color: rgb(51, 153, 66);">${{number_format($copyTrader->minimum_trade,0,'.',',')}}</div>
                                                        <!----><!----><!----><!---->
                                                    </td>
                                                    <!----><!----><!---->
                                                </tr>
                                                <tr>
                                                    <td colspan="2">
                                                        <div
                                                            class="zl-performance-th-sortable zl-sort-desc"
                                                            title=""
                                                        >
                                                            Investors Profit (1m)<!---->
                                                        </div>
                                                        <div class="zlds-text-color--brand zlds-font-size--xx-large">${{number_format($copyTrader->investors_profit,2,'.',',')}}</div>
                                                    </td>
                                                    <td colspan="2" class="slds-text-align--left">
                                                        <div class="zl-performance-th-sortable">
                                                            <span nglpopoverplacement="bottom" nglinteractive="true" nglpopoverbehavior="" nglpopoverdelay="600" tabindex="0">ROI</span>
                                                            <!---->&nbsp;<!---->
                                                        </div>
                                                        <span>{{$copyTrader->roi}}% </span>
                                                        <!----><!---->
                                                    </td>
                                                    <td style="vertical-align: middle; text-align: left;" colspan="2">
                                                        <div class="slds-grid zzz-grid-l">
                                                            <div class="slds-col slds-no-flex slds-col--bump-left" style="margin-left: unset;">
                                                                <a queryparamshandling="preserve" href="{{url('copytrade/details/')."/".$copyTrader->copyTradeId}}">
                                                               
                                                                </a>
                                                                <!---->
                                                                <div class="slds-show--inline-block" style="position: relative;">
                                                                    <zl-follow-button type="forex">
                                                                        <a href='{{url('copytrade/details/')."/".$copyTrader->copyTradeId}}' class="slds-button slds-m-around--xxx-small slds-truncate zl-follow-button slds-button--brand" style="min-width: 0px;">
                                                                            <span>
                                                                                <!---->
                                                                                <span>
                                                                                    <!---->
                                                                                     <span>View</span>
                                                                                    <!----><!---->
                                                                                </span>
                                                                                <!----><!---->
                                                                            </span>
                                                                        </a>
                                                                    </zl-follow-button>
                                                                    <!----><!---->
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                                <!----><!----><!---->
                                            </tbody>
                                  @endforeach
                    @endif          
                                           
                                            
                                        </table>
                                    </div>
                                </zl-performance-forex-list>
                            </zl-performance-forex-all>
                        </div>
                    </ngl-tabs>
                </div>
            </ngl-tabs>
        </zl-performance-forex>
    </div>
</zl-performance> 
<div class="dataTables_paginate paging_simple_numbers" id="DataTables_Table_0_paginate">
                            {{ $copyTraders->links('vendor.pagination.bootstrap-4') }}
                        </div>
</div>

@endsection

@section('js')

@endsection