@extends('layouts.layout')

@section('body_class', 'nav-md')

@section('css')
<link rel="stylesheet" href="{{ asset('/css/dashboard.css') }}">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css">
<style type="text/css">
    .h-50 {
        height: 50px;
    }
</style>
@endsection

@section('body_content')
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            @include("pages.dashboard.inc.title")

            @if(count($elite_notif_bugs) > 0)
				<div style="background: #f00;">
					<table class="table table-condensed">
						<thead>
							<tr>
								<th>Customer ID</th>
								<th>Reveral Code</th>
								<th>Total</th>
								<th>Valid Until</th>
							</tr>
						</thead>
						
						<tbody>
						@foreach($elite_notif_bugs as $elitebugs)
							@if($elitebugs->total > 1)
								<tr>
									<td>{{ $elitebugs->customer_id }}</td>
									<td>{{ $elitebugs->myreferral_code }}</td>
									<td>{{ $elitebugs->total }}</td>
									<td>{{ $elitebugs->valid_until }}</td>
								</tr>
							@endif
						@endforeach
						</tbody>
					</table>
				</div>
			@endif
			

			<!-- <div class="alert alert-info"><center><b>UPDATE RATE</b></center></div> -->
			
			<div class="x_panel" style="padding: 0 !important; margin-top: 10px;">
				<div class="x_content">
					<div class="col-xs-12 col-md-3">
						<div style="border: 2px solid #888; padding: 15px; padding-top: 0;">
							<h4 style="padding-bottom: 7px; border-bottom: 1px solid #000;">
								<div class="row">
									<div class="col-sm-12 col-md-7">
										XAUUSD
										<small></small>
									</div>
									<div class="col-sm-12 col-md-5 text-left" style="border: 0px solid #f00;">
										<small style="font-size: 10px;">
											<i class="fa fa-refresh"></i> <span id="last_updated_1">{{ date('Y-m-d H:i') }}</span>
										</small>
									</div>
								</div>
							</h4>
							<div class="text-center" style="padding: 5px;">
								<h1 id="xau_usd" class="loading">{{ $xau_data }}</h1>
								<label style="font-size: 19px;">USD/oz</label>
							</div>
						</div>
					</div>
					<div class="col-xs-12 col-md-3">
						<div style="border: 2px solid #888; padding: 15px; padding-top: 0;">
							<h4 style="padding-bottom: 7px; border-bottom: 1px solid #000;">
								<div class="row">
									<div class="col-xs-12 col-sm-12">
										XAUUSDG
										<small>31.1034768</small>
									</div>
								</div>
							</h4>
							<div class="text-center" style="padding: 5px;">
								<h1 id="xau_usdg" class="loading">{{ $xau_usdg }}</h1>
								<label style="font-size: 19px;">USD/Gr</label>
							</div>
						</div>
					</div>
					<div class="col-xs-12 col-md-3">
						<div style="border: 2px solid #888; padding: 15px; padding-top: 0;">
							<h4 style="padding-bottom: 7px; border-bottom: 1px solid #000;">
								<div class="row">
									<div class="col-sm-12 col-md-7">
										USD <i class="fa fa-arrow-right"></i> IDR
										<small>(E-Rate)</small>
									</div>
									<div class="col-sm-12 col-md-5 text-left" style="border: 0px solid #f00;">
										<small style="font-size: 10px;">
											<i class="fa fa-refresh"></i> <span id="last_updated_2">{{ date('Y-m-d H:i') }}</span>
										</small>
									</div>
								</div>
							</h4>
							<div class="text-center" style="padding: 5px;">
								<div class="row">
									<div class="col-xs-12 col-sm-12 col-md-12" style="border-right: 0px solid #000;">
										<h1 id="usd_rate" class="loading">{{ $usd }}</h1>
										<label style="font-size: 19px;">Kurs US GLOBAL</label>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-xs-12 col-md-3">
						<div style="border: 2px solid #888; padding: 15px; padding-top: 0;">
							<h4 style="padding-bottom: 7px; border-bottom: 1px solid #000;">
								<div class="row">
									<div class="col-xs-12 col-sm-12">
										XAUIDRG
										<small>(XAUUSDG x USD <i class="fa fa-arrow-right"></i> IDR)</small>
									</div>
								</div>
							</h4>
							<div class="text-center" style="padding: 5px;">
								<h1 id="xau_idrg" class="loading">{{ $xau_idrg }}</h1>
								<label style="font-size: 19px;">IDR/Gr</label>
							</div>
						</div>
					</div>
					
					<div class="col-xs-12 col-sm-12 text-right" style="padding-top: 10px;">
						<i>Live delay: 1 minute ( Source: <a href="https://harga-emas.net/">harga-emas.net</a> )</i>
						<!-- <i>Live delay: 1 minute ( Source: <small>Website sumber sedang mengalami down</small> )</i> -->
					</div>
				</div>
			</div>   
			
		@if (auth()->user()->id_users_team == '1')	
			<div class="row">
				<div class="col-xs-12 col-sm-12">
					<div class="x_panel">
						<div class="x_content">
							<table class="table table-bordered table-striped">
								<thead>
									<tr>
										<th class="text-center">Code</th>
										<th class="text-center">Nominal</th>
										<th class="text-center">Created</th>
										<th class="text-center">Name</th>
										<th class="text-center">Handphone</th>
										<th class="text-center">Email</th>
										<th class="text-center">Type</th>
										<th class="text-center">Elite</th>
										<th class="text-center">Status Customer</th>
										<th class="text-center">Status Iris</th>
										<th class="text-center">Notes</th>
									</tr>
								</thead>
								<tbody>
									@forelse ($data_dashboard_wallet as $data_wallet)
										<tr>
											<td class="text-center">{{ $data_wallet->code }}</td>
											<td class="text-right">Rp {{ number_format($data_wallet->nominal) }}</td>
											<td class="text-center">{{ $data_wallet->created_at }}</td>
											<td class="text-center">{{ $data_wallet->name }}</td>
											<td class="text-center">{{ $data_wallet->handphone }}</td>
											<td class="text-center">{{ $data_wallet->email }}</td>
											<td class="text-center">{{ $data_wallet->type }}</td>
											<td class="text-center">{{ $data_wallet->is_elite }}</td>
											<td class="text-center">
												@if ($data_wallet->customer_status == 'AKUN DI WATCHLIST')
													<span class="label" style="background-color: rgb(236, 253, 0); color: black;">
														WATCHLIST
													</span>
												@elseif($data_wallet->customer_status == 'AKUN DI BLOCK')
													<span class="label" style="background-color: rgb(254, 0, 0); color: white;">
														BLOCK
													</span>
												@else
												
												@endif

											</td>
											<td class="text-center">{{ $data_wallet->status_iris }}</td>
											<td class="text-center">{{ $data_wallet->notes }}</td>
										</tr>
									@empty
										<tr>
											<td colspan="11" class="text-center">Tidak ada data</td>
										</tr>
									@endforelse
								</tbody>
							</table>
							<div class="text-center">
								{{ $data_dashboard_wallet->links() }}
							</div>
						</div>
					</div>
				</div>
			</div>
			@endif
			
		</div>
		
        @include('includes.footer')
    </div>
</div>
@endsection


@section("scripts")
    @include('includes.helper_js')
    <script type="text/javascript">
        @if (Session::has('oops'))
            Helper.errorNotif('{{ Session::get('oops') }}');
        @endif
    </script>
	
	<script type="text/javascript">
		
			
		let harga_beli = "{{ $rate_lei['harga_beli'] }}";
		let harga_jual = "{{ $rate_lei['harga_jual'] }}";
		$('#harga_beli').val(formatRibuan(harga_beli));
		$('#harga_jual').val(formatRibuan(harga_jual));
		$(document).ready(function() {
			//$(".fa-bars").trigger("click");
			
			setTimeout(function() { headerVal() }, 5000);
			
		});
		
		
		function formatRibuan(angka) {
			angka = angka.replace(/\D/g, ''); // hanya angka
			return angka.replace(/\B(?=(\d{3})+(?!\d))/g, '.');
		}
		
		function headerVal() {
			$.ajax({
				url: '{{ url("kurs/new/get_new") }}',
				method: "GET",
				headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
				success: function(response) {
					//$('.loading').html('<i class="fa fa-spinner fa-pulse"></i>');
					setTimeout(function() {
						$('#xau_usd').html(response.xau_data);
						$('#xau_usdg').html(response.xau_usdg);
						$('#usd_rate').html(response.usd);
						$('#xau_idrg').html(response.xau_idrg);
						$('#last_updated_1').html(response.last_updated);
						$('#last_updated_2').html(response.last_updated);
					}, 200);
					
					setTimeout(function() { headerVal() }, 5000);	
				},
				error: function(response) {
					var response = response.responseJSON;
					alert(response.error);
				}
			});
		}
		
		function getNilaiAsli(value) {
			return value.replace(/\./g, '');
		}
		
	</script>
@endsection