@extends($activeTemplate.'layouts.dash')

@push('style')
<style>
.typeitem {
	float: left;
	width: 33.30%;
	margin-left: 0px;
}
.over {
	border-bottom: 1px solid #000;
}
</style>
@endpush

@section('content')
	<div style="height: auto; overflow: hidden;">
		<div class="top" style="background: none;">
			<div data-href="{{route('user.agents.index')}}" class="linkBTN" style="float:left; line-height:46px;width:50%; height:46px;cursor:pointer;" id="btnClose">
				<img src="/assets/images/arrow-back-up-white.png" style="margin-left:12px;width:32px;padding:0 4px;" />
			</div>
		</div>
		<div style="width: 100%; height: auto; overflow: hidden; position:relative;">
			<img src="/assets/images/team-min.jpg" style="width:100%;">

			<div style="cursor: pointer;position:absolute; bottom:20px; left:1%; width:34%; text-align:center; color:#fff;">
				<div style="font-weight:bold; font-size:22px;" id="invitation"></div>
			</div>
			
			<div onclick="copyText('','Invite link copied!');" style="cursor: pointer;position:absolute; bottom:20px; left:52%; width:44%; text-align:center; color:#fff;">
				<div style="font-size: 18px; overflow: hidden;  text-overflow: ellipsis; white-space: nowrap;" id="link">Commission</div>
				<div style="text-decoration: underline;font-weight: 900;">{{ config('settings')->cur_sym }}{{ showAmount($user->referral) }}</div>
			</div>
		</div>
	</div>

	<div style=" width: 100%; margin: 0 auto; margin-top:1px; text-align: center; background:#fff; color:#000; position: relative; height: auto; overflow: hidden;">
		@foreach($levels as $level)
		<div class="typeitem @if($lev_id == $level->level) over @endif linkBTN" data-href="{{ route('user.agents.view', ['id' => $level->level]) }}" value="1">
			<div style="padding:10px;font-weight:700;" id="number6">{{ config('settings')->cur_sym }}{{ showAmount($lGot[$level->level]) }}</div>
			<div style="padding:10px; padding-top:0px; font-size:12px;">Level {{$level->level}}(<font id="number3" style="font-weight:600;">{{ count($usr[$level->level]) }}</font>)</div>
		</div>
		@endforeach
	</div>

	<div style="width: 100%; margin: 0 auto; position: relative; margin-top: 10px; background: #fff; height: auto; overflow: hidden; padding-top:10px; padding-bottom:10px; " id="itemlist">
		@forelse($userList as $user)
		<?php $seletID = mt_rand(1, 4); ?>
		<div style="height:45px;padding-top:10px; border-bottom:1px solid #eee;">
			<div style="float:left;width:20%;text-align:center;">
				<img src="/assets/images/user{{$seletID}}.jpg" style="height:30px;border-radius:25px;" />
			</div>
			<div style="float:left;width:50%;">
				<div style="font-weight:bold;">{{ $user->mobile }}</div>
				<div style="color:#888; padding-top:4px; font-size:12px;">{{ $user->created_at->format('dS F Y, H:i A') }}</div>
			</div>
			<div style="float:left;width:30%;text-align:center;">
				<div style="font-weight: bold; color: #000;">{{ config('settings')->cur_sym }}{{ showAmount($user->invested) }}</div>
				<div style="color:#888; padding-top:4px; font-size:10px;">invested</div>
			</div>
		</div>
		@empty
		<div style="padding:2px; width:95%; margin:0 auto; margin-top:50px;">
			<div style="border-radius: 5px; color:#fff; text-align:center; margin-top:35px;position:relative;">
				<img src="/assets/images/no.png" style=" width:100%;" /><br>
			</div>
		</div>
		<div class="layui-flow-more">No more data</div>
		@endforelse
</div>
@endsection
