@extends('admin::curd.index')
@section('heading')
<i class="fa fa-file-text-o"></i> {!! trans('assets::asset_utilization.name') !!} <small> {!! trans('cms.manage') !!} {!! trans('assets::asset_utilization.names') !!}</small>
@stop

@section('title')
{!! trans('assets::asset_utilization.names') !!}
@stop

@section('breadcrumb')
<ol class="breadcrumb">
    <li><a href="{!! trans_url('admin') !!}"><i class="fa fa-dashboard"></i> {!! trans('cms.home') !!} </a></li>
    <li class="active">{!! trans('assets::asset_utilization.names') !!}</li>
</ol>
@stop

@section('entry')
<div class="box box-warning" id='assets-asset_utilization-entry'>
</div>
@stop

@section('tools')
@stop

@section('content')
<div class="table-responsive clearfix">
<table id="assets-asset_utilization-list" class="table table-striped  data-table">
    <thead  class="list_head">
        <th>
            <div class="reset" style="display:none;"></div>
        </th>
        <th>Trans No.</th>
        <th style="width: 15%">Trans Date</th>
        <th>Entry Date</th>
        <th style="width: 10%;">User</th>
        <th style="width: 20%;">Asset ID</th>
        <th>Asset Name</th>
        <th>Transactions</th>
        <th style="width: 10%">Unit</th>
        <th>Amount</th>
    </thead>
    <thead  class="search_bar">
        <th>
            <div class="reset" style="display:none;"><a id="resetnow" class="headpicture" style="cursor:pointer;"><i
                        class="fa fa-refresh" style="color:#000;"></i></a></div>
        </th>
        <th>{!! Form::text('search[trans_no]')->placeholder('Search transaction No.')->raw()!!}</th>
        {{-- <th>{!! Form::date('search[asset_utilizations.trans_date]')->placeholder('Select transaction date')->addClass('datepick')->raw()!!}
        </th> --}}
        {{-- <th>{!! Form::text('search[asset_utilizations.trans_date][min]')->addClass('datepick')->placeholder('Min')->style('width: 45%;')->value(date('01 M, Y'))->id('ser_trans_date_min')->raw() !!}
            {!! Form::text('search[asset_utilizations.trans_date][max]')->addClass('datepick')->style('width: 50%;')->placeholder('Max')->value(date('d M, Y'))->id('ser_trans_date_max')->raw() !!}</th> --}}
        <th></th>
            <th>{!! Form::date('search[entry_date]')->addClass('datepick')->placeholder('Select Entry date ')->raw()!!}</th>
        <th>{!! Form::select('search[asset_utilizations.user_id]')-> options([''=> 'All']+Company::users())->id('search_user_id')->raw()!!}</th>
        {{-- <th>{!! Form::select('search[asset_utilizations.asset_id]')-> options()->id('search_asset_id')->raw()!!}</th> --}}
        <th>{!! Form::select('search[asset_id]')->options([])->id('search_asset_id')->raw()!!}</th>
        <th></th>
        <th></th>
        <th>{!! Form::select('search[unit]')-> options([''=>'All','Km' => 'Km','Count' => 'Count','Hours' => 'Hours'])->id('search_unit')->raw()!!}</th>
        <th></th>
    </thead>
</table>
</div>
@stop

@section('script')
<script type="text/javascript">

var oTable;
$(document).ready(function(){
    $(".datepick").pickadate({
        format: 'dd mmm, yyyy',
        formatSubmit: 'yyyy-mm-dd',
        hiddenSuffix: '',
        selectMonths: true,
        selectYears: true
    }).prop('type','text');
    $("#search_asset_id").select2({
            // minimumInputLength: 3,
            ajax: {
                url: "{{ trans_url('admin/assets/select2/asset') }}",
                dataType: 'json',
                delay: 250,
                data: function(params) {
                    return {
                        q: params.term, // search term
                        // sublocation_id: $("#sublocationid").val(),
                        page: params.page
                    };
                },
                processResults: function(data, params) {

                    params.page = params.page || 1;
                    return {
                        results: data.items,
                        pagination: {
                            more: (params.page * 30) < data.total_count
                        }
                    };
                },
                cache: true
            },
            escapeMarkup: function(markup) {
                return markup;
            }, // let our custom formatter work

            templateResult: formatRepo, // omitted for brevity, see the source of this page
            templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
        });

        function formatRepo(repo) {
            if (repo.loading) return repo.name;
            var markup = "<div class='select2-result-repository clearfix'>" +
                "<div class='select2-result'><span>" + repo.rfc + "&nbsp;" + repo.name + "</span></div>";

            return markup;
        }

        function formatRepoSelection(repo) {
            return repo.rfc;
        }
    app.load('#assets-asset_utilization-entry', '{!!trans_url("admin")!!}/assets/asset_utilization/0');
    oTable = $('#assets-asset_utilization-list').dataTable( {
        "bProcessing": true,
        "sDom": 'R<>rt<ilp><"clear">',
        "bServerSide": true,
        "sAjaxSource": '{!!trans_url("admin")!!}/assets/asset_utilization',
        "fnServerData" : function ( sSource, aoData, fnCallback ) {

            $('#assets-asset_utilization-list .search_bar input, #assets-asset_utilization-list .search_bar select').each(
                function(){
                    aoData.push( { 'name' : $(this).attr('name'), 'value' : $(this).val() } );
                }
            );
            app.dataTable(aoData);
            $.ajax({
                'dataType'  : 'json',
                'data'      : aoData,
                'type'      : 'GET',
                'url'       : sSource,
                'success'   : fnCallback
            });
        },

        "columns": [
            {data:'dresets'},
            {data :'trans_no'},
            {data :'trans_date'},
            {data :'entry_date'},
            {data :'user_id'},
            {data :'asset_id'},
            {data :'asset_name'},
            {data :'transactions'},
            {data :'unit'},
            {data :'amount'}
        ],
        "pageLength": 25,
         "order": [[ 0, "desc" ]],
     });
    //  $('input[id=ser_trans_date_min]').change(function() {
        
    //     $("#ser_trans_date_max").pickadate('picker').set({
    //         select: $('input[id=ser_trans_date_min]').val(),
    //         min: new Date($('input[id=ser_trans_date_min]').val())
    //     });
    //     });
     $("#resetnow").click(function() {
    $('.search_bar input, .search_bar select').each(function() {
        $(this).val('');
    })
    var today = new Date();
    // $("input[name='search[asset_utilizations.trans_date][max]']").val('');
    // $("input[name='search[asset_utilizations.trans_date][min]']").val('');
    // $("#ser_trans_date_min").pickadate('picker').set({
    //     select: new Date(today.getFullYear(), today.getMonth(), 1),
    // });
    // $("#ser_trans_date_max").pickadate('picker').set({
    //     select: new Date(),
    // });


    document.getElementById("select2-search_asset_id-container").innerHTML = " ";
    // document.getElementById("select2-ser_suppliers_id-container").innerHTML = " ";
    oTable.api().draw();
    $(".reset").css({
        'display': 'none'
    });
});
$('.search_bar').change(function() {
    $(".reset").css({
        'display': 'inline'
    });
    return;
});
    $('#assets-asset_utilization-list tbody').on( 'click', 'tr', function () {

        oTable.$('tr.selected').removeClass('selected');
        $(this).addClass('selected');

        var d = $('#assets-asset_utilization-list').DataTable().row( this ).data();

        $('#assets-asset_utilization-entry').load('{!!trans_url("admin")!!}/assets/asset_utilization' + '/' + d.id);
    });

    $("#assets-asset_utilization-list .search_bar input, #assets-asset_utilization-list .search_bar select").on('keyup select', function (e) {
        e.preventDefault();
        if (e.keyCode == 13 || e.keyCode == 9) {
            oTable.api().draw();
        }
    });
    $("#assets-asset_utilization-list .search_bar select,.datepick").on('change', function (e) {
        e.preventDefault();
        oTable.api().draw();
    });

    // $("#search_company").change(function(){
    //  if($("#search_company option:selected").val()!=''){
    // var company = $("#search_company option:selected").val();
   
    //  }
    //  else
    //  {
    //     $("#search_division").val('');
    //     oTable.api().draw();
    //     var company=0;
    //  }
    //   $("#search_division").load('{{URL::to("admin/company/division/employee")}}'+'/'+company);

    // });

    // $("#search_company").change(function(){
    // var company = $("#search_company option:selected").val();
    // $("#search_division").load('{{URL::to("/admin/company/division/employee")}}'+'/'+company);
    // });

    // $("#search_division").change(function(){
    // var division = $("#search_division option:selected").val();
    // $("#search_asset").load('{{URL::to("/admin/assets/asset/division")}}'+'/'+division);
    // });
});
</script>
@stop

@section('style')
@stop