@extends('layouts.admin')

@section('meta')
	<title>{{ __('message.dashboard') }} - {{ config('app.name', 'Dashboard') }}</title>
@endsection

@section('content')

<!-- widget grid -->
<section id="widget-grid" class="">

  <!-- row -->
  <div class="row">

    <!-- NEW WIDGET START -->
    {{-- searcy --}}
    <div class="col-md-12" style="margin-bottom: 30px;">
	     <form method="get" id="search-form">
	      <div class="rows">
	      	<div class="col-md-1 col-xs-4" style="margin-top:10px;font-weight: bold;">
				{{ __('message.start date') }} 
	      	</div>
	        <div class="col-md-2 col-xs-8">
	            <input type="text" id="datepicker_start" class="form-control" name="start_date" title="{{ __('message.start date') }}" value="{{$start_date}}" placeholder="Start Date" readonly="">
	        </div>
	        <div class="col-md-1 col-xs-4" style="margin-top:10px;font-weight: bold;">
	      		{{ __('message.end date') }}
	      	</div>
	        <div class="col-md-2 col-xs-8">
	            <input type="text" id="datepicker_end" class="form-control" name="end_date" title="{{ __('message.end date') }}" value="{{$end_date}}" placeholder="End Date" readonly="">
	        </div>          
	      </div>
	      
	      <div class="rows">          
	        <div class="col-md-3 col-xs-12" style="padding-bottom:10px;">
	            <button type="submit" class="btn btn-primary">
	              <i class="fa fa-search"></i>
				  {{ __('message.search') }}

	            </button>
	            <a href="{{route('admin.home')}}" type="reset" class="btn">
	              <i class="fa fa-refresh"></i>
	              <span class="hidden-xs"> {{ __('message.refresh') }}</span>
	            </a>
	        </div>
	      </div>
	      <div class="col-sm-12 col-xs-12">
	        <button type="button" class="btn btn-primary search-date" id="today">
					<i class="fa fa-calendar"></i>
					{{ __('message.today') }}
					</button>
					<button type="button" class="btn btn-primary search-date" id="yesterday">
					<i class="fa fa-calendar"></i>
					{{ __('message.yesterday') }}
					</button>
					<button type="button" class="btn btn-primary search-date" id="this-week">
					<i class="fa fa-calendar"></i>
					{{ __('message.this week') }}
					</button>
					<button type="button" class="btn btn-primary search-date" id="last-week">
					<i class="fa fa-calendar"></i>
					{{ __('message.last week') }}
					</button>
					<button type="button" class="btn btn-primary search-date" id="this-month">
					<i class="fa fa-calendar"></i>
					{{ __('message.this month') }}
					</button>
					<button type="button" class="btn btn-primary search-date" id="last-month">
					<i class="fa fa-calendar"></i>
					{{ __('message.last month') }}
					</button>               
	      </div>
	    </form>
	</div>
    {{-- End Search --}}
    <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">

          <div class="row">

			<div class="col-sm-4">

				<div class="well well-sm bg-color-darken txt-color-white text-center" style="box-shadow: 0px 1px 5px 0px #000000;">
					<h5>
						<i class="fa fa-lg fa-fw fa-user fa-lg"></i>
						{{ __('message.member') }} {{ __('message.registered') }}
					</h5>
					<h1 style="font-weight:bold;font-size: 50px;">{{$memberToday}}</h1>
					
				</div>

			</div>

			<div class="col-sm-4">

				<div class="well well-sm bg-color-teal txt-color-white text-center" style="box-shadow: 0px 1px 5px 0px #000000;">
					<h5>{{ __('message.loan') }} {{ __('message.applied') }}</h5>
					<h1 style="font-weight:bold;font-size: 50px;">{{$loanToday}}</h1>
				</div>

			</div>

			<div class="col-sm-4">

				<div class="well well-sm bg-color-pinkDark txt-color-white text-center" style="box-shadow: 0px 1px 5px 0px #000000;">
					<h5>{{ __('message.landing') }} {{ __('message.amount') }}</h5>
					<h1 style="font-weight:bold;font-size: 50px;">{{number_format($loanTodayAmount,2)}}</h1>
				</div>

			</div>

		</div>
    </article>
  </div>

  <!-- end row -->

  

  <!-- end row -->

</section>
<!-- end widget grid -->

@endsection
@section("scripts")
  <script>
  $( function() {
    $( "#datepicker_start" ).datepicker({ dateFormat: 'yy-mm-d',maxDate: '0' });
    $( "#datepicker_end" ).datepicker({ dateFormat: 'yy-mm-d',maxDate: '0' });
  } );
  </script>
@endsection