@extends('admin.layouts.master')

@section('title')
    Rentals
@stop

@section('style')
    <style>
        tr.group,
        tr.group:hover {
            background-color: #ddd !important;
        }
        /*filter on top*/
        tfoot {
            display: table-header-group;
        }
        thead {
            display: table-row-group;
        }
        /*hide show entries
        .dataTables_length {
            display: none;
        }
        .dataTables_filter {
            display: none;
        }*/
        select.fstyle { width: 50px }
        /*#rentals_table select
        {
            width:340px !important;
        }*/
        table.dataTable tr.odd { background-color: #E2E4FF; }
        table.dataTable tr.even { background-color: white; }
    </style>

@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-key"></span> Rentals
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-users"></i> Admin Panel</a></li>
                <li class="active">Rentals</li>
            </ol>
        </section>

        {{--<input type="hidden" id="cmonth" name="cmonth" value="{{$cmonth}}" readonly>--}}
        <!-- Main content -->
        <section class="content" style=" padding-bottom: 10%;">
            {{--@if (Auth::user()->role_id == 4)
                <div style="margin-top: 30px;"></div>
            @else--}}
                <div class="page-header">
                    <a href="{{route('rentals.new')}}" class="btn btn-primary"><i class="fa fa-plus-circle"></i> New Rental</a>
                    {{--<button id="btnMonth" name="btnMonth" class="btn btn-success"><i class="fa fa-eye"></i> View This Month </button>--}}
                    {{--<div style="width: 280px;float:right;">
                        <div style="float:right;display: inline-block;font-size: 14px;">
                            Year:
                            <select name="yyear" id="yyear" class="form-control ddate">
                                @foreach ($years as $year)
                                    <option value="{{$year->yyear}}">{{$year->yyear}}</option>
                                @endforeach
                            </select>
                        </div>
                        <div style="float:right;display: inline-block;font-size: 14px;">
                            Month:
                            <select name="mmonth" id="mmonth" class="form-control ddate">                         
                                @foreach ($months as $month)
                                    <option value="{{$month->mmonth}}">{{$month->mmonth}}</option>
                                @endforeach
                            </select>

                        </div>
                        <div style="float:right;display: inline-block;font-size: 14px;margin-top:20px;padding-right:5px;">
                            <button id="btnFilter" class="btn btn-info"><i class="fa fa-filter" aria-hidden="true"></i> Filter</button>
                        </div>
                    </div>--}}
                </div>
            {{--@endif--}}

            <table class="table table-hover" id="rentals_table" width="100%">
                <thead>
                <tr style="background: grey ;color:#fff; font-weight: bold">
                    <td>ID</td>                    
                    <td>Rental Contract Date</td>
                    <td>Client Name</td>
                    <td>Authorized Name</td>
                    <td>Property Location</td>                    
                    <td>Monthly Rent</td>
                    <td>Deposit</td>
                    <td>Advanced</td>                  
                    <td>Agent</td>
                    <td>Manager</td>
                    {{--@if (Auth::user()->role_id == 4)
                        <td hidden>Actions</td>
                    @else
                        <td>Actions</td>
                    @endif--}}
                    <td>Actions</td>
                </tr>
                </thead>
                @if (isset($rentals))
                    @foreach($rentals as $rental)
                        <tr >
                            <td><a href="{{ route('rentals.edit',[$rental->id]) }}">{{$rental->id}}</a></td>
                            <td width="12%">{{date("d-M-Y", strtotime($rental->contract_date))}}</td>
                            <td>{{$rental->client->client_name ?? '' }}</td>
                            <td>{{$rental->authorized_name ?? '' }}</td>
                            <td>{{$rental->prop_location ?? '' }}</td>
                            <td style="text-align: right">{{number_format($rental->monthly_rent,2)}}</td>
                            <td style="text-align: right">{{number_format($rental->deposit,2)}}</td>
                            <td style="text-align: right">{{number_format($rental->advance,2)}}</td>   
                            <td>
                                {{strtoupper($rental->agent->code) ?? '' }}
                            </td>
                            <td>{{$rental->manager->fullname ?? '' }}</td>
                            {{--@if (Auth::user()->role_id == 4)
                                <td hidden></td>
                            @else--}}
                            <td class="btn btn-default ">
                                {{--<a href="#" data-toggle="modal" data-target="#e{{$rental->id}}" class="btn btn-primary btn-xs"><i class="fa fa-edit"></i></a>--}}
                                <a href="{{ route('rentals.edit',[$rental->id]) }}" class="btn btn-primary btn-xs"><i class="fa fa-edit"></i></a>
                                <a href="#" data-toggle="modal" data-target="#d{{$rental->id}}" class="text-danger btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
                                <!-- Delete Modal -->
                                <div class="modal fade" id="d{{$rental->id}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                    <div class="modal-dialog" role="document">
                                        <form method="post" action="{{route('rentals.delete')}}">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title" id="myModalLabel"><i class="fa fa-warning"></i> confirm deletion </h4>
                                            </div>
                                            <div class="modal-body text-danger">
                                                <input type="hidden" name="id" value="{{$rental->id}}">
                                                Are you sure want to delete this rental entry?
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                <button type="submit" class="btn btn-primary">Confirm</button>
                                            </div>

                                        </div>
                                            {{csrf_field()}}
                                        </form>
                                    </div>
                                </div>
                            </td>
                            {{--@endif--}}
                        </tr>
                    @endforeach
                @endif
                <tfoot>
                    <tr>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                </tfoot>
            </table>
            @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>
    $(document).ready(function() {
        /*$('#rentals_table').DataTable( {
            "bDestroy": true,
            "order": [[ 0, "desc" ]]
        } );*/

        $("#rentals_table").dataTable().fnDestroy();
            $('#rentals_table').DataTable( {
            /*"columnDefs": [
                { "visible": false, "targets": [0,2,3] }
                ],*/
                "bDestroy": true,
                "order": [[ 0, "desc" ]],
                initComplete: function () {
                    this.api().columns([2,3,8,9]).every( function () {
                        var column = this;
                        var select = $('<select class="fstyle" id="lnOpt"><option value=""></option></p>')
                            .appendTo( $(column.footer()).empty() )
                            .on( 'change', function () {
                                var val = $.fn.dataTable.util.escapeRegex(
                                    $(this).val()
                                );
                                column
                                    .search( val ? '^'+val+'$' : '', true, false )
                                    .draw();
                            } );

                        column.data().unique().sort().each( function ( d, j ) {
                            select.append( '<option value="'+d+'">'+d+'</option>' )
                        } );
                    } );
                }
            } );

        /*$('#mmonth').on('change', function () {
            var yy = $("#yyear").val();
            var mm = $('#mmonth').find('option:selected').val();
            alert(mm);
            //alert(this.value+' '+yy);
            window.location.href = '/sales/month/'+this.value+'/'+yy;
            $('#mmonth').val(this.value);
        });*/

        /*$('#btnMonth').on('click', function () {
            var cm = $("#cmonth").val();
            var yy = $("#yyear").val();
            window.location.href = '/sales/month/'+cm+'/'+yy;
            //alert(mm+' ' +this.value);
        });*/

        $('#btnFilter').on('click', function () {
            //alert('ready');
            var mm = $("#mmonth").val();
            var yy = $("#yyear").val();

            //alert(mm +' - '+ yy);

            window.location.href = '/rentals/month/'+mm+'/'+yy;

            //alert(cm +' - '+ yy);
            /*var cm = $("#cmonth").val();
            var yy = $("#yyear").val();
            window.location.href = '/sales/month/'+cm+'/'+yy;*/
            //alert(mm+' ' +this.value);
        });

    } );
</script>
@stop