@extends('layouts/contentLayoutMaster')
@section('title', 'Dashboard Analytics')
@section('vendor-style')
    <!-- vendor css files -->
    <link rel="stylesheet" href="{{ asset(mix('vendors/css/charts/apexcharts.css')) }}">
    <link rel="stylesheet" href="{{ asset(mix('vendors/css/extensions/tether-theme-arrows.css')) }}">
    <link rel="stylesheet" href="{{ asset(mix('vendors/css/extensions/tether.min.css')) }}">
    <link rel="stylesheet" href="{{ asset(mix('vendors/css/extensions/shepherd-theme-default.css')) }}">
@endsection
@section('page-style')
    <!-- Page css files -->
    <link rel="stylesheet" href="{{ asset(mix('css/pages/dashboard-analytics.css')) }}">
    <link rel="stylesheet" href="{{ asset(mix('css/pages/card-analytics.css')) }}">
    <link rel="stylesheet" href="{{ asset(mix('css/plugins/tour/tour.css')) }}">
@endsection
@section('content')
    {{-- Dashboard Analytics Start --}}
    <section id="dashboard-analytics">
        @if($roles != 'OPERATIONS' && $roles != 'VENDOR_OPERATIONS' && $roles != 'VENDOR_ADMIN')
            <div class="card">
                <div class="col-lg-12 col-md-12 col-12">
                    <form class="row" id="frm-filter" action="{{ url('/') }}" method="get">
                        <div class="col-lg-3 col-md-3 col-3">
                            <div class="form-group">
                                <label>Client</label>
                                <select name="client" id="client" class="form-control" onchange="filterFrm()">
                                    <option value="" selected="selected">All</option>
                                    @if($employers_list)
                                        @foreach($employers_list as $employer_list)
                                            <option {{ isset($_GET['client']) && $_GET['client'] == $employer_list->id ? 'selected' : ''}} value="{{$employer_list->id}}">
                                                @if($employer_list->b2b_company_name != '')
                                                    {{$employer_list->b2b_company_name}}
                                                @else
                                                    {{$employer_list->first_name}} {{$employer_list->last_name}}
                                                @endif
                                            </option>
                                        @endforeach
                                    @endif
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-3">
                            <div class="form-group">
                                <label>Type</label>
                                <select name="source_type" id="source_type" class="form-control" onchange="filterFrm()">
                                    <option value="" selected="selected">All</option>
                                    <option {{ isset($_GET['source_type']) && $_GET['source_type'] == "B2B" ? 'selected' : ''}} value="B2B">B2B</option>
                                    <option {{ isset($_GET['source_type']) && $_GET['source_type'] == "B2C" ? 'selected' : ''}} value="B2C">B2C</option>
                                </select>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        @endif
        <div class="row">
          <!-- <div class="col-lg-6 col-md-12 col-sm-12">
          <div class="card bg-analytics text-white">
            <div class="card-content">
              <div class="card-body text-center">
                <img src="{{ asset('images/elements/decore-left.png') }}" class="img-left" alt="card-img-left">
                <img src="{{ asset('images/elements/decore-right.png')}}" class="img-right" alt="card-img-right">
                <div class="avatar avatar-xl bg-primary shadow mt-0">
                    <div class="avatar-content">
                        <i class="feather icon-award white font-large-1"></i>
                    </div>
                </div>
               <div class="text-center">
                  <h1 class="mb-2 text-white">Congratulations {{ Auth::user()->first_name.' '.Auth::user()->middle_name.' '.Auth::user()->last_name }},</h1>
                  <p></p>
                  {{-- <p class="m-auto w-75">You have done <strong>57.6%</strong> more sales today. Check your new badge in your profile.</p> --}}
                </div> 
              </div>
            </div>
          </div>
        </div> -->
        @if($roles != 'OPERATIONS' && $roles != 'VENDOR_OPERATIONS' && $roles != 'VENDOR_ADMIN')
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
              <div class="card-header d-flex flex-column align-items-start pb-0" style="border: 2px solid #fbbb20;">
                  <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                  <div class="avatar bg-rgba-primary p-50 m-0">
                      <div class="avatar-content">
                          <img src="{{url('images/portrait/small/user.png')}}" class="img-fluid" width="20" height="20">
                      </div>
                  </div>
                  <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{ $employers }}</h2>
                  <p class="mb-0" style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;"><a style="color:#000000;"  href="{{ url('/employers?perpage=10&status=&source='.$source.'&s=') }}">Client Onboarding</a></p>
              </div>
             </div>
            </div>
          </div>
          
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
                <div class="card-header d-flex flex-column align-items-start pb-0" style="border: 2px solid #fbbb20;">
                    <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                        <div class="avatar-content">
                            <img src="http://admin.lynxconnect.in/images/portrait/small/add-user.png" class="img-fluid" width="20" height="20">
                        </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{$employees}}</h2>
                    <p class="mb-0"style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;">
                        <a style="color:#000000;" href="{{ url('/candidates') }}">Candidate Onboarded</a>
                    </p>
                </div>
                </div>
               
            </div>
          </div>
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
                <div class="card-header d-flex flex-column align-items-start pb-0" style="border: 2px solid #fbbb20;">
                    <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                        <div class="avatar-content">
                            <img src="http://admin.lynxconnect.in/images/portrait/small/add-user.png" class="img-fluid" width="20" height="20">
                        </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{$employees_up}}</h2>
                    <p class="mb-0"style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;">
                        <a style="color:#000000;" href="{{ url('/candidates/actual-candidates') }}">Candidates Doc</a>
                    </p>
                </div>
                </div>
               
            </div>
          </div>
          @endif
           @if($roles != 'OPERATIONS' && $roles != 'VENDOR_OPERATIONS' && $roles != 'VENDOR_ADMIN')
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
              <div class="card-header d-flex flex-column align-items-start pb-0"style="border: 2px solid #62bf51;">
                    <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                      <div class="avatar-content">
                           <img src="http://admin.lynxconnect.in/images/portrait/small/clock.png" class="img-fluid" width="20" height="20">
                      </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{isset($in_tat_orders[0]->in_tat) ? $in_tat_orders[0]->in_tat : 0}}</h2>
                    <p class="mb-0"style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;">
                        <a href="{{url('orders?perpage=10&status=&source='.$source.'&tat=IN_TAT&s=')}}" style="color:#000000;" >In-TAT</a>
                    </p>
              </div>
             </div>
            </div>
          </div>
          
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
                <div class="card-header d-flex flex-column align-items-start pb-0" style="border: 2px solid #ff5252;">
                    <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                        <div class="avatar-content">
                           <img src="http://admin.lynxconnect.in/images/portrait/small/wait.png" class="img-fluid" width="20" height="20">
                        </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{isset($in_tat_orders[0]->out_of_tat) ? $in_tat_orders[0]->out_of_tat : 0}}</h2>
                    <p class="mb-0"style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;">
                        <a href="{{url('orders?perpage=10&status=&source='.$source.'&tat=OUT_OF_TAT&s=')}}" style="color:#000000;">Out of TAT</a>
                    </p>
                </div>
                </div>
               
            </div>
          </div>
          @endif
          
           @if($roles != 'OPERATIONS' && $roles != 'VENDOR_OPERATIONS' && $roles != 'VENDOR_ADMIN')
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
              <div class="card-header d-flex flex-column align-items-start pb-0"style="border: 2px solid  #ff5252;">
                  <div style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                  <div class="avatar bg-rgba-primary p-50 m-0">
                      <div class="avatar-content">
                          <img src="http://admin.lynxconnect.in/images/portrait/small/exclamation-mark.png" class="img-fluid" width="20" height="20">
                      </div>
                  </div>
                  <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{$tasks - $task_assigned}}</h2>
                  <p class="mb-0" style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;"><a href="{{ url('orders/qc-allocator?perpage=10&type=&status=NON_ASSIGNED&source='.$source.'&s=') }}" style="color:#000000;"> Assign Task Pending</a></p>
              </div>
             </div>
            </div>
          </div>
          
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
                <div class="card-header d-flex flex-column align-items-start pb-0" style="border: 2px solid  #62bf51;">
                    <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                        <div class="avatar-content">
                        <img src="http://admin.lynxconnect.in/images/portrait/small/check-box.png" class="img-fluid" width="20" height="20">
                        </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{$task_assigned}}</h2>
                    <p class="mb-0"style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;"><a href="{{ url('orders/qc-allocator?perpage=10&type=&status=ASSIGNED&source='.$source.'&s=') }}"  style="color:#000000;">Task Assigned </a></p>
                </div>
                </div>
               
            </div>
          </div>
          @endif
          
              @if($roles != 'OPERATIONS' && $roles != 'VENDOR_OPERATIONS' && $roles != 'VENDOR_ADMIN')
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
              <div class="card-header d-flex flex-column align-items-start pb-0"style="border: 2px solid  #62bf51;">
                  <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                  <div class="avatar bg-rgba-primary p-50 m-0">
                      <div class="avatar-content">
                          <img src="http://admin.lynxconnect.in/images/portrait/small/checklist.png" class="img-fluid" width="20" height="20">
                      </div>
                  </div>
                  <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{$vendor_assign_task}}</h2>
                  <p class="mb-0" style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;"><a href="{{ url('orders/vendor-allocator?perpage=10&type=&vendor_id=&status=ASSIGNED&source='.$source.'&s=') }}" style="color:#000000;">Vendor Assign Task </a></p>
              </div>
             </div>
            </div>
          </div>
          
          <div class="col-lg-3 col-md-6 col-12">
            <div class="card">
                <div class="card-header d-flex flex-column align-items-start pb-0" style="border: 2px solid  #FBBB20;">
                    <div  style="padding-bottom: 44px;margin-top: -14px;margin-left: -10px;">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                        <div class="avatar-content">
                            <img src="http://admin.lynxconnect.in/images/portrait/small/briefcase.png" class="img-fluid" width="20" height="20">
                        </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25" style="color:#000000;position: absolute;bottom: 21px;right: 10px;">{{$vendors}}</h2>
                    <p class="mb-0"style="font-weight: 400; position: absolute; bottom: 10px;right: 10px;"><a style="color:#000000;" href="{{ url('/vendor') }}"> Vendor Onboarded </a></p>
                </div>
                </div>
               
            </div>
          </div>
          @endif
          
          @if($roles == 'VENDOR_ADMIN')
            <div class="col-lg-3 col-md-6 col-12">
              <div class="card">
                <div class="card-header d-flex flex-column align-items-start pb-0">
                    <div class="avatar bg-rgba-primary p-50 m-0">
                        <div class="avatar-content">
                            <i class="feather icon-users text-primary font-medium-5"></i>
                        </div>
                    </div>
                    <h2 class="text-bold-700 mt-1 mb-25">{{ $vendor_user }}</h2>
                    <p class="mb-0">Users</p>
                </div>
                <div class="card-content" style="min-height: 95px;">
                    {{-- <div id="subscribe-gain-chart"></div> --}}
                </div>
              </div>
            </div>
          @endif
      </div>
      
      <div class="row">
        @if($roles != 'OPERATIONS' && $roles != 'VENDOR_OPERATIONS' && $roles != 'VENDOR_ADMIN')
          <div class="col-md-6 col-12">
            <div class="card">
               
              <div class="card-content" >
                   
                  <div class="card-body" style=" margin-bottom: 60px;" >
                      <h4 class="card-title"><a style="color:#000" href="{{ url('/orders?perpage=10&status=&source=&s=&doc_upload=Done&start_date=&end_date=') }}">Case Tracker</a></h4>
                      <div class="row pb-50">
                          <div class="col-lg-6 col-12 d-flex justify-content-between flex-column order-lg-1 order-2 mt-lg-0 mt-2">
                              <div>
                                  <h2 class="text-bold-700 mb-25">{{ $orders }}</h2>
                                  <p class="text-bold-500 mb-75">No. of Cases</p>
                                 <!-- <h5 class="font-medium-2">
                                      <span class="text-success">+5.2% </span>
                                      <span>vs last 7 days</span>
                                  </h5>-->
                              </div>
                              <a href="{{ url('/orders?perpage=10&status=&source=&s=&doc_upload=Done&start_date=&end_date=') }}" class="btn btn-primary shadow" style="margin-top: 60px;">View Details <i class="feather icon-chevrons-right"></i></a>
                          </div>
                         <div class="col-lg-6 col-12 d-flex justify-content-between flex-column text-right order-lg-2 order-1">
                              <!--  <div class="dropdown chart-dropdown">
                                  <button class="btn btn-sm border-0 dropdown-toggle p-0" type="button" id="dropdownItem5"
                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    Last 7 Days
                                  </button>
                                  <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownItem5">
                                    <a class="dropdown-item" href="#">Last 28 Days</a>
                                    <a class="dropdown-item" href="#">Last Month</a>
                                    <a class="dropdown-item" href="#">Last Year</a>
                                  </div>
                              </div>--> 
                             <!-- <div id="avg-session-chart"></div> -->
                          </div> 
                      </div>
                      
                      <hr/>
                      <div class="row avg-sessions pt-50">
                          <div class="col-6">
                              <p class="mb-0">Total Cases: {{ $orders }}</p>
                              <div class="progress progress-bar-primary mt-25">
                                <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="100" aria-valuemax="100"
                                  style="width:100%"></div>
                              </div>
                          </div>
                          <div class="col-6">
                              <p class="mb-0">Inprogress: {{ $orders_inprogress }}</p>
                              <div class="progress progress-bar-warning mt-25">
                                <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="100" aria-valuemax="100"
                                  style="width:100%"></div>
                              </div>
                          </div>
                          <div class="col-6">
                              <p class="mb-0">Created: {{ $orders_pending }}</p>
                              <div class="progress progress-bar-danger mt-25">
                                <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="100" aria-valuemax="100"
                                  style="width:100%"></div>
                              </div>
                          </div>
                          <div class="col-6">
                              <p class="mb-0">Completed: {{ $orders_complete }}</p>
                              <div class="progress progress-bar-success mt-25">
                                <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="100" aria-valuemax="100"
                                  style="width:100%"></div>
                              </div>
                          </div>
                      </div>
                      
                  </div>
              </div>
            </div>
          </div>
          @endif
            @if($roles == 'VENDOR_OPERATIONS' || $roles == 'VENDOR_ADMIN')
              <div class="col-md-12 col-12">
            @else
              <div class="col-md-6 col-12">
            @endif
            <div class="card">
              <div class="card-header d-flex justify-content-between pb-0">
                  <h4 class="card-title"><a style="color:#000" >Task Tracker</a></h4>
                  <!-- <div class="dropdown chart-dropdown">
                      <button class="btn btn-sm border-0 dropdown-toggle p-0" type="button" id="dropdownItem4"
                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        Last 7 Days
                      </button>
                      <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownItem4">
                        <a class="dropdown-item" href="#">Last 28 Days</a>
                        <a class="dropdown-item" href="#">Last Month</a>
                        <a class="dropdown-item" href="#">Last Year</a>
                      </div>
                  </div> -->
              </div>
              <div class="card-content">
                  <div class="card-body pt-0">
                      <div class="row">
                          <div class="col-sm-2 col-12 d-flex flex-column flex-wrap text-center">
                              <h1 class="font-large-2 text-bold-700 mt-2 mb-0">{{ $tasks  }}</h1>
                              <small>Tasks</small>
                          </div>
                          <div class="col-sm-10 col-12 d-flex justify-content-center">
                              <div id="support-tracker-chart" data-id="{{ $complete > 0 ? number_format(($complete / ($tasks ))*100, 2) : 0 }}"></div>
                          </div>
                      </div>
                      <div class="chart-info d-flex justify-content-between">
                          <div class="text-center">
                              <p class="mb-50"><a href="{{url('/orders/tasks?perpage=10&type=&employer_id=&status=CREATED&source=&severity=&tat=&start_date=&end_date=&doc_upload=&s=')}}">CREATED</a></p>
                              <span class="font-large-1">{{ $created }}</span>
                          </div>
                          <div class="text-center">
                              <p class="mb-50"> <a href="{{ url('/orders/tasks?perpage=10&type=&employer_id=&status=IN_PROGRESS&source=&severity=&tat=&start_date=&end_date=&s=') }}">IN PROGRESS</a></p> 
                              <span class="font-large-1">{{ $in_progress }}</span>
                          </div>
                          <div class="text-center">
                              <p class="mb-50"><a href="{{ url('/orders/tasks?perpage=10&type=&employer_id=&status=COMPLETE&source=&severity=&tat=&start_date=&end_date=&s=') }}">COMPLETED</a></p>
                              <span class="font-large-1">{{ $complete }}</span>
                          </div>
                      </div>
                  </div>
              </div>
            </div>
            </div>
            </div>
            @can('dashboard.group_task_tracker')
            <style>
                table, th, td {border: 1px solid black;border-collapse: collapse;}
                th {text-align: center;}
            </style>
            <div class="card">
                <div class="card-header d-flex justify-content-between pb-0">
                    <h4 class="card-title"><a style="color:#000" href="{{ url('/orders/tasks') }}">Task Summary </a></h4>
                    <div class="table-responsive mt-1 mb-2">
                        <table style="width:100%; text-align: center;">
                            <tr style="background-color:indigo; color:white;font-size: 12px;">
                                <!--<th>Verifications</th>-->
                                <!--<th>No. of Verifications</th>-->
                                <!--<th>Completed</th>-->
                                <!--<th>In-progress</th>-->
                                <!--<th>Created</th>-->
                                <!--<th>In-TAT</th>-->
                                <!--<th>Out of TAT</th>-->
                                <!--<th>No TAT</th>-->
                                <!--<th>In-TAT (%)</th>-->
                                <!--<th>Out of TAT (%)</th>-->
                                
                                <th>Verifications</th>
                                <th>Application Onboarded</th>
                                <th>Incomplete Application</th>
                                <th>Verification Initiated</th>
                                <th>Completed</th>
                                <th>In-progress</th>
                                <th>In-TAT</th>
                                <th>Out of TAT</th>
                                <th>In-TAT (%)</th>
                                <th>Out of TAT (%)</th>
                            </tr>
                            @if($dashboard_data)
                                @foreach($dashboard_data as $key => $val)
                                    <tr>
                                        <td style=" font-weight: bold;" align="left">{{$val->task_name}}</td>
                                        <td><a href="{{ url('orders/tasks?perpage=10&type='.$val->task_type.'&employer_id=&status=&source='.$source.'&severity=&s=') }}">{{$val->total_task}}</a></td>
                                        <td><a href="{{ url('orders/tasks?perpage=500&type='.$val->task_type.'&employer_id=&status=&source='.$source.'&severity=&tat=No_TAT&s=') }}">{{$val->No_TAT}}</a></td>
                                        <td><a href="{{ url('orders/tasks?perpage=10&type='.$val->task_type.'&status=&source=&severity=&tat=&start_date=&end_date=&doc_upload=Done&s=') }}">{{$val->task_initiated}}</a></td>
                                        <td><a href="{{ url('orders/tasks?perpage=10&type='.$val->task_type.'&employer_id=&status=COMPLETE&source='.$source.'&severity=&s=') }}">{{$val->completed_task}}</a></td>
                                        
                                         
                                        <td><a href="{{ url('orders/tasks?perpage=10&type='.$val->task_type.'&employer_id=&status=IN_PROGRESS&source='.$source.'&severity=&s=') }}">{{$val->in_progress}}</a></td>
                                        
                                        <td><a href="{{ url('orders/tasks?perpage=10&type='.$val->task_type.'&employer_id=&status=&source='.$source.'&severity=&tat=IN_TAT&s=') }}">{{$val->in_tat}}</a></td>
                                        <td><a href="{{ url('orders/tasks?perpage=500&type='.$val->task_type.'&employer_id=&status=&source='.$source.'&severity=&tat=OUT_OF_TAT&s=') }}">{{$val->out_of_tat}}</a></td>
                                       
                                        <td>{{ $val->in_tat > 0 ? number_format((($val->in_tat / $val->total_task) * 100), 2) : 0 }}</td>
                                        <td>{{ $val->out_of_tat > 0 ? number_format((($val->out_of_tat / $val->total_task) * 100), 2) : 0 }}</td>
                                    </tr>
                                @endforeach
                            @endif
                        </table>
                    </div>
                </div>
            </div>
            @endcan
        </div>
        </div>
    </section>
  <!-- Dashboard Analytics end -->
  @endsection

@section('vendor-script')
    <!-- vendor files -->
    <script src="{{ asset(mix('vendors/js/charts/apexcharts.min.js')) }}"></script>
    <script src="{{ asset(mix('vendors/js/extensions/tether.min.js')) }}"></script>
    <script src="{{ asset(mix('vendors/js/extensions/shepherd.min.js')) }}"></script>
@endsection
@section('page-script')
    <!-- Page js files -->
    <script src="{{ asset(mix('js/scripts/pages/dashboard-analytics.js')) }}"></script>
    <script type="text/javascript">
        function filterFrm(){
          $('#frm-filter').submit();
        }
    </script>
@endsection