@extends('admin.layouts.master')

@section('title')
    Team Sales
@stop

@section('style')

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" />

@stop

@section('content')
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                <span class="fa fa-book"></span> Team Sales
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-book"></i> Admin Panel</a></li>
                <li class="active">Team Sales</li>
            </ol>
        </section>
        <div style="margin: 20px;"></div>

        <!-- Main content -->
        <section class="content">

            {{--<div class="btn-group dropdown">
                <button type="button" class="btn btn-info">Action Options</button>
                <button type="button" class="btn btn-info dropdown-toggle" id="mydp" data-toggle="dropdown" aria-haspopup="true" >
                    <span class="caret"></span>
                    <span class="sr-only">Action option</span>
                </button>
                <ul class="dropdown-menu" role="menu" aria-labelledby="mydp">
                    <li><a href="#">View PDF</a></li>
                    <li><a href="#">Export to Excel</a></li>
                </ul>
            </div>--}}
            <div style="margin: 1px;"></div>

            <div>

            <form action="{{route('reports.team-sales')}}" method="post" class="form-inline form-template">
              {{ csrf_field() }}
              <div class="clearfix"></div>
              <div class="col-lg-6">
                 <div class="form-group width-100-percent" style="padding:20px;">
                       <div class="col-md-4 no-padding">
                         <label for="" class="not-required">Year:</label>
                       </div>
                       <div class="col-md-6 no-padding">
                        <div class='input-group date' id='year-datetimepicker'>
                           <input type='text' name="yyear" id="yyear" class="form-control"/>
                           <span class="input-group-addon">
                               <i class="fa fa-calendar" aria-hidden="true"></i>
                           </span>
                        </div>
                       </div>

                       <div class="col-md-4 no-padding">
                            <label for="month" class="not-required">Month:</label>
                       </div>
                         <div class="col-md-6 no-padding">
                         <select class="form-control" id="mmonth" name="mmonth" style="width: 120%;">
                           <option value=""></option>
                           @foreach($months as $month)
                               <option value="{{$month->id}}">{{$month->name}}</option>
                           @endforeach
                         </select>
                        </div>

                       <div class="col-md-4 no-padding">
                            <label for="month" class="not-required">Team:</label>
                       </div>
                         <div class="col-md-6 no-padding">
                         <select class="form-control" id="team" name="team" style="width: 120%;">
                           <option value=""></option>
                           @foreach($teams as $team)
                               <option value="{{$team->id}}">{{$team->name}}</option>
                           @endforeach
                         </select>
                        </div>
                      {{--<div class="col-md-6 no-padding">
                        <label for="" class="not-required">From Date:</label>
                      </div>
                      <div class="col-md-6 no-padding">
                       <div class='input-group date year-datetimepicker'>
                          <input type='text' name="dtFrom" id="dtFrom" class="form-control" required="required" />
                          <span class="input-group-addon">
                              <i class="fa fa-calendar" aria-hidden="true"></i>
                          </span>
                       </div>
                      </div>

                      <div class="col-md-6 no-padding">
                          <label for="" class="not-required">To Date:</label>
                        </div>
                        <div class="col-md-6 no-padding">
                         <div class='input-group date year-datetimepicker'>
                            <input type='text' name="dtTo" id="dtTo" class="form-control" required="required" />
                            <span class="input-group-addon">
                                <i class="fa fa-calendar" aria-hidden="true"></i>
                            </span>
                         </div>
                        </div>--}}
                     {{--<div class="col-md-6 no-padding">
                           <label for="developer" class="not-required">Agent:</label>
                      </div>
                     <div class="col-md-6 no-padding">
                     <select class="form-control" id="agent" name="agent" style="width: 120%;">
                        <option ></option>
                        @foreach($agents as $agent)
                            @if (Auth::user()->role_id == 4)
                                <option value="{{$agent->id}}" selected>{{$agent->fullname}}</option>
                            @else
                                <option value="{{$agent->agent_id}}">{{$agent->agent_name}}</option>
                            @endif
                        @endforeach
                     </select>--}}
                    </div>

                    {{--<div class="col-md-6 no-padding">
                          <label for="month" class="not-required"></label>
                     </div>--}}

                    <div class="clearfix"></div>

                <div class="form-group " style="padding-top:1px;margin-left:220px;">
                    <button id="btnOK" name="btnOK" type="submit" class="btn btn-success"><i class="fa fa-filter" aria-hidden="true"></i> Generate</button>
                </div>

              </div>

            </form>
            </div>

            <div class="clearfix"></div>

            @if(Session('info'))
                <div class="row">
                    <div class="col-md-6 col-md-offset-3 text-center">
                        <div class="tem alert alert-success navbar-fixed-bottom"><span class="glyphicon glyphicon-ok-circle"></span> {{Session('info')}}</div>
                    </div>
                </div>
            @endif


        </section>

    </div>
@stop

@section('script')
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

    <script>

    $(document).ready(function() {
        $('#year-datetimepicker').datetimepicker({
         format: 'YYYY'
        });

        $('#from-datetimepicker').datetimepicker({
             format: 'MMMM/DD/YYYY'
        });

        $('#to-datetimepicker').datetimepicker({
             format: 'MMMM/DD/YYYY'
        });
    });

    </script>
@stop