@extends('admin.layouts.app')

@section('title', 'Screens Report')

@section('content')
<!-- TOPBAR -->
<div class="top_bar page-content">
    <!-- LOADER -->
    <div class="loader">
        <div class="top_status_bar load">
            <div class="progress_bar bar" style="left: 0px;">
            </div>
        </div>
    </div>
    <!-- END LOADER -->
    <!-- BREADCRUMBS -->
    <div class="breadcrumbs">
        <ul>
            <li><a href="{{route('admin.dashboard')}}">Home</a></li>
            <li><a href="{{route('admin.screens.index')}}" class="">Advertiser Report</a></li>
        </ul>
        <button class="btn btn-large pull-right help theme_btn help_btn">?</button>
    </div>
    <!-- END BREADCRUMBS -->
</div>
<!-- END TOPBAR -->
<!-- PAGE CONTENT -->
<div class="page-content">
    <div class="row">
        <div class="col-md-12">
            <!-- Begin: life time stats -->
            <div class="portlet">
                <div class="portlet-title">
                    <div class="caption">
                        <h2>Advertiser Reports
                            <span class="subtitle">All Advertiser are reports listed here, you can manage from here.</span>
                        </h2>
                    </div>
                </div>



                <!--------------------FILTER---------------------->
                <div class="tab-content">
                    <!--MY TASK TAB START-->
                    <div class="tab-pane active" id="advertiser">
                        <div class="row form-group">
                            {{-- <div class="col-md-2">
                                <select name="column_drop" id="column_drop"
                                    class="form-control select2 column_drop select2-hidden-accessible" tabindex="-1"
                                    aria-hidden="true">
                                    <option value=""></option>
                                    <option value="screen_name">Screen Name</option>
                                    <option value="dates">Date Range</option>
                                    <option value="date_period">Date Period</option>


                                </select>

                            </div> --}}
                            {{-- <div class="col-md-2 value-drop">
                                <select name="value_drop" id="value_drop" disabled=""
                                    class="form-control select2 option_filters select2-hidden-accessible" tabindex="-1"
                                    aria-hidden="true">
                                    <option value=""></option>
                                </select>
                            </div> --}}



                            {{-- <div class="col-md-4 hide filter_dates">

                                <div class="input-group">
                                    <div class="start_date">
                                    <input name="filter_start_date"
                                        class="form-control filter_start_date custom_calender_date_open" value="" type="text"
                                        placeholder="From Date" index="start" autocomplete="off">
                                    <span class="input-group-btn">
                                        <button class="btn default custom_calender_date_open" type="button" style="margin: 0">
                                            <i class="fa fa-calendar"></i>
                                        </button>
                                    </span>
                                    </div>
                                    <div class="start_date">
                                    <input name="filter_end_date"
                                        class="form-control filter_end_date custom_calender_date_open" value="" type="text"
                                        placeholder="To Date" index="start" autocomplete="off">
                                    <span class="input-group-btn">
                                        <button class="btn default custom_calender_date_open" type="button" style="margin: 0">
                                            <i class="fa fa-calendar"></i>
                                        </button>
                                    </span>
                                </div>
                                </div>
        
        
                            </div> --}}

                            {{-- <div class="col-md-4 pr_0">
                                <button class="theme_btn_round btn filter_all" type="button" name="load" value="Filter"
                                    style="">Filter</button>
                                <button class="theme_btn_round btn reset_filter" type="button" name=""
                                    value="Clear All">Clear All</button>
                                <form id="export_excel" method="post" action="" style="display: inline-block;">
                                    <input type="hidden" name="_token" value="">                                            
                                    <button class="theme_btn_round btn export_excel" style="" type="submit">
                                        Export
                                    </button>
                                </form>
                            </div>
                            <div class="column_filters" style="display: block;">
                            </div> --}}

                            {{-- <div class="leads_action_grey actions_selected">
                                <div class="actions_dropdown_grey">
                                    <span>Lead options</span>
                                    <ul class="actions_list_grey">
                                        <li class="option 1">Option 1</li>
                                    </ul>
                                </div>
                            </div> --}}
                            <div class="col-md-2">
                                <select name="city" class="select2" id="city">
                                    <option value="">City</option>
                                    <option value="0">ALL</option>
                                    @foreach($cities as $key => $city)
                                    <option value="{{ $city->id }}">{{ $city->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-2">
                                <select name="venue" class="select2" id="venue">
                                    <option value="">Branch</option>
                                    <option value="0">ALL</option>
                                    @foreach($venues as $key => $venue)
                                    <option value="{{ $venue->id }}">{{ $venue->venueTranslation->title }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-2">
                                <select name="period" class="select2" id="period">
                                    <option value="">Period</option>
                                    <option value="0">All time</option>
                                    <option value="day">Last 24 hrs</option> 
                                    <option value="this_week">Last week</option> 
                                    <option value="last_month">Last month</option> 
                                    <option value="last_year">Last year</option> 
                                    
                                </select>
                            </div>
                            
                        </div>
                        <!--------------------FILTER---------------------->

                        <!--------------------Search---------------------->
                        <div class="tb_search">
                   
                        </div>
                        <table id="screen_data_table"
                            class="table filterable table-striped table-bordered table-hover custom_table">
                            <thead class="flip-content thead">
                                <tr>
                                    <th class="th_1 "></th>
                                    <th class="th_2 ">Id</th>
                                    <th class="th_3 ">Advertiser Name</th>
                                    <th class="th_3 ">Total</th>
                                    <th class="th_3 ">Mobile</th>
                                    {{-- <th class="th_4 ">Venue Name</th>
                                    <th class="th_5 ">Revenue</th>
                                    <th class="th_6 ">Number of ads</th>
                                    <th class="th_7 ">City</th> --}}
                                    {{-- <th class="th_5 ">Screen Code</th>
                                    <th class="th_6 ">Venue </th>
                                    <th class="th_7 ">Location </th> --}}
                                </tr>
                            </thead>
                            <tbody class="tbody">
                                <!--=====================-->
                                <!--=====================-->



                            </tbody>
                            {{-- <tfoot>
                                <tr>
                                    <th style="text-align:center">Total:</th>
                                    <th style="text-align:right"></th>
                                    <th style="text-align:right"></th>
                                    <th></th>
                                    <th></th>
                                    <th></th>
                                    <th class="city_name_footer">All</th>   
                                </tr>
                            </tfoot> --}}
                        </table>

                    </div>




                </div>
            </div>
            <!-- End: life time stats -->
        </div>
    </div>
</div>
<!-- END PAGE CONTENT -->


@stop
@section('styles')
<link rel="stylesheet" type="text/css" href="{{ asset('plugins/global/bootstrap-toastr/toastr.min.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ asset('css/croppie.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ asset('css/sweetalert.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ asset('css/toastr.min.css') }}" />

<style>
    .inner-table .paging_simple_numbers{
        float: right;
    }

    /*  */
    td.details-control, td.venue-details-control {
        background: url("{{ url('images/details_open.png') }}") no-repeat center center;
        cursor: pointer;
    }
    tr.shown td.details-control, tr.shown td.venue-details-control {
        background: url("{{ url('images/details_close.png') }}") no-repeat center center;
    }
    .details-table td .actions, .venue-details-control td .actions {
        width: 100%;
    }

    .details-table th, .venue-details-control th {
        background-color: #666 !important;
    }

    /*  */
    .screen-details-table {
        border: 2px solid #DDD;
    }
    .venue-details-table thead th {
        height: 45px;
    }
    .screen-details-table thead th {
        background-color: #DDD !important;
        color: #000 !important;
        height: 45px;
    }
    .venue-details-table {
        border: 2px solid #000;
    }
    #screen_data_table {
        /* background-color: #000 !important; */
        border: 2px solid #000;
    }

    /*  */
    .venue-details-table td.inner-table {
        padding: 0 !important;
    }
    .table>tbody>tr>td, table>thead>tr>th {
        line-height: 25px !important;
    }
    .screen-details-table {
        width: 100% !important;
    }
    .screen-details-table tbody td:nth-child(3) {
        margin-left: 30px;
        display: inline;
    }
    #screen_data_table tbody tr {
        background: #fff !important;
        border: none !important;
    }
    #screen_data_table .venue-details-table thead tr th {
        background-color: #ddd !important;
        color: #000 !important;
        border: none !important;
        font-weight: bold !important;
    }
    #screen_data_table .venue-details-table tbody tr {
        background: #ddd !important;
        border: none !important;
    }

    #screen_data_table .venue-details-table .screen-details-table tbody tr,
    #screen_data_table .venue-details-table .screen-details-table thead tr th {
        background: #FFF !important;
        border: none !important;
        background-color: #FFF !important;
    }
</style>

@stop
@section('admin_js')
@include('admin.reports.advatiser.js.index')

@stop