@extends('layouts.admin')

@section('content')
<style>
.newsalegoal_dashboard .revenewrap .cirdata{margin-top:10px;margin-bottom:0px;}
.newsalegoal_dashboard .setupgoal label{float:left;font-size:16px;font-weight: bold;padding-left:10px}
.newsalegoal_dashboard .setupgoal b{float:right;font-size:18px;margin-top:-1px;padding-right:10px;color:#2E7D32}
.yearlysale_table thead th{text-align:center;font-weight:bold !important}
.yearlysale_table tbody tr td:first-child{font-weight:bold !important;}
.yearsgoal_table{height:200px;overflow-x:scroll}
.yearsgoal_table thead tr th{font-weight:bold;}
.yearlysale_table tbody>tr>td:first-child, .table-full-small thead tr>th:first-child{padding-left: 4px;}
.table_outer_layer {position:relative;overflow:auto; }

.table_outer_layer table,.table_outer_layer td,.table_outer_layer tr,.table_outer_layer th{border: 1px solid;border-collapse: collapse;}

.table_outer_layer th {background: #696c6f;color: #fff;}

.revenewrap legend{font-size:15px}
</style>

<div class="row m-b-40 newsalegoal_dashboard">
{{ csrf_field() }}
<div class="col-md-3 pull-right">
    <form>
        <div class="form-group">
        @if(isset($salesFors))
        <select id="dashboard_for" name="dashboard_for" class="form-control" style="background-color:#ffffff;padding:0  10px">
            @if($salesFors)
            @foreach($salesFors as $salesForId => $salesForName)
            <option value="{{ $salesForId }}">{{ $salesForName }}</option>
            @endforeach
            @endif
        </select>
        @else
        <select id="dashboard_for" name="dashboard_for" class="form-control" style="background-color:#ffffff;padding:0  10px">
            <option value="team-{{ $salesTeamId }}">TEAM</option>
            @if($teamMembers)
            @foreach($teamMembers as $teamMemberId => $teamMemberName)
            <option value="salesman-{{ $teamMemberId }}">{{ $teamMemberName }}</option>
            @endforeach
            @endif
        </select>
        @endif
        </div>
    </form>
</div>
<div class="clearfix"></div>
<div id="yearly-sales-goals-box">
{!! $yearSalesGoalsHtml !!}
</div>
<div class="clearfix"></div><hr/>

<div class="col-md-3">&nbsp;</div>
<div class="col-md-3">
    <form>
        <div class="form-group" style="width:95%;">
        <select id="st_period" name="st_period" class="form-control" style="background-color:#ffffff;padding:0  10px">
            <option value="today">TODAY</option>
            <option value="current_week">WEEK</option>
            <option value="current_month">MONTH</option>
            <option value="current_year">YEAR</option>
        </select>
        </div>
    </form>
</div>
<div class="col-md-6">&nbsp;</div>
<div class="clearfix"></div>

<div class="col-md-6">
    <div class="col-md-6">
      <div class="well white text-center revenewrap">
       <legend>GROSS REVENUE</legend>
            <h3 class="cirdata" id="st-gr">${{ $salesStats['grossRevenue'] }}</h3>
       </div>
    </div>
    <div class="col-md-6">
      <div class="well white text-center revenewrap">
       <legend>NET REVENUE</legend>
            <h3 class="cirdata" id="st-nr">${{ $salesStats['netRevenue'] }}</h3>
       </div>
    </div>
    <div class="col-md-6">
      <div class="well white text-center revenewrap">
       <legend>LOADS MOVED</legend>
            <h3 class="cirdata" id="st-lm">{{ $salesStats['loadsCount'] }}</h3>
       </div>
    </div>
    <div class="col-md-6">
      <div class="well white text-center revenewrap">
       <legend>COMMISSION</legend>
            <h3 class="cirdata" id="st-cm">${{ $salesStats['commission'] }}</h3>
       </div>
    </div>
</div>
<div class="col-md-6">
    <div id="pace-goal-box">
        <div class="col-md-12">
          <div class="well white text-center revenewrap">
           <legend>CURRENT GOAL</legend>
                <h3 class="cirdata" id="st-cg">${{ $currentPaceGoal }}</h3>
           </div>
        </div>
        <div class="col-md-12">
          <div class="well white text-center revenewrap">
           <legend>NEXT TIER GOAL</legend>
                <h3 class="cirdata" id="st-ntg">${{ $nextPaceGoal }}</h3>
           </div>
        </div>
    </div>
</div>



<div class="clearfix"></div><hr/>
<div class="col-md-3 pull-right">
    <form>
        <div class="form-group">
        <select id="cs_period" name="cs_period" class="form-control" style="background-color:#ffffff;padding:0  10px">
            <option value="today">TODAY</option>
            <option value="current_week">WEEK</option>
            <option value="current_month">MONTH</option>
            <option value="current_year">YEAR</option>
        </select>
        </div>
    </form>
</div>
<div class="col-md-12 m-b-20">
    <div class="card">
        <div class="datatables ordertable">
          <table id="clients-sales-table" class="table table-striped table-full table-full-small" cellspacing="0" width="100%">
            <thead>
              <tr>
                <th>CLIENT</th>
                <th>GROSS SALES</th>
                <th>AVERAGE MARGIN</th>
                <th>TOTAL LOADS</th>
                <th>DAYS SINCE LAST LOAD</th>
                <th>AVERAGE LOAD</th>
                <th>POD ASSIGNMENT</th>
              </tr>
            </thead>
            <tbody>
            </tbody>
          </table>
        </div>
    </div>
</div>
</div>

@endsection

@section('scripts')
<script charset="utf-8" src="{{asset('backend/js/services/salesTeamDashboard.js?v=1.1')}}"></script>
@endsection