@extends('mla.layouts.app')
@section('content')
<style>
    svg{
        width: 12px;
    }
    nav .flex{
   display: none;
    }
    .hidden p{
        display: none
    }
    .table-responsive{
    overflow-x: initial !important;
    }
       .bs-searchbox .form-control{
    width: 150px !important;
    }
    .bootstrap-select .dropdown-toggle{
        width: 180px !important;
    }
</style>
<div class="page-wrapper">

    <!-- ============================================================== -->
    <!-- Container fluid  -->
    <!-- ============================================================== -->
    <div class="container-fluid">
        <!-- ============================================================== -->
        <!-- Bread crumb and right sidebar toggle -->
        <!-- ============================================================== -->
        <div class="row page-titles">
            <div class="col-md-5 align-self-center">
                <h4 class="text-themecolor">Family Manage</h4>
            </div>
            <div class="col-md-7 align-self-center text-right">
                <div class="d-flex justify-content-end align-items-center">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{route('mla.index')}}">Home</a></li>
                        <li class="breadcrumb-item">Family Manage</li>
                    </ol>
                    <!-- <button type="button" class="btn btn-info d-none d-lg-block m-l-15"><i class="fa fa-plus-circle"></i> Create New</button> -->
                </div>
            </div>
        </div>
        <!-- ============================================================== -->
        <!-- End Bread crumb and right sidebar toggle -->
        <!-- ============================================================== -->


        <div class="row">
            <div class="col-lg-12">
                {{-- <div class="text-right m-xs mb-3">
                    <a href="#" class="btn btn-warning btn-sm m-xxs" data-toggle="modal"
                        data-target="#exampleModal"><i class="fa fa-user"></i> Add Admin</a>
                </div> --}}


               

                <!-- <div class="tabs-container">-->
                <!-- <ul class="nav nav-tabs">
                    <li class="active"><a data-toggle="tab" href="#tab-1"><i class="fa fa-hand-o-down"></i>
                            Caste Report</a></li>
                </ul>  -->
                <div class="ibox-title">
                    <h5><span class="text-info"> All Family</span></h5>
                     <div class="ibox-tools">
                        @if(session()->has('success'))
                        <span class="text-success samll">{{session()->get('success')}}</span>
                        @endif
                        {{-- <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            <i class="fa fa-wrench"></i>
                        </a>
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a> --}}
                    </div>
                </div>
                
                <div class="tab-content">
                    <div id="tab-1" class="tab-pane active">
                        <div class="panel-body" style="background: #fff !important;
                    border: 1px solid #e7eaec;
                    border-radius: 2px;
                    padding: 20px 20px;
                    position: relative;">


                            <div class="table-responsive">
                                <div id="DataTables_Table_0_wrapper"
                                    class="dataTables_wrapper form-inline dt-bootstrap no-footer">
                                    <form action="{{request()->url()}}" id="searchForm" method="get">
                                    <div class="dataTables_length" id="DataTables_Table_0_length"><label>Show
                                            <select name="paginate" id="paginate"
                                                aria-controls="DataTables_Table_0"
                                                class="form-control input-sm">
                                                <option @if($paginate == 10) selected @endif value="10">10</option>
                                                <option @if($paginate == 25) selected @endif value="25">25</option>
                                                <option @if($paginate == 50) selected @endif value="50">50</option>
                                                <option @if($paginate == 100) selected @endif value="100">100</option>
                                            </select> entries</label></div>
                                             
                                     <div id="DataTables_Table_0_filter" class="dataTables_filter">
                                        <label>Search:<input type="search" value="{{$search}}" name="search" class="form-control input-sm"
                                                placeholder="" aria-controls="DataTables_Table_0"></label>
                                    </div> 
                                     <div id="DataTables_Table_0_filter" class="dataTables_filter" style="padding-right:5px;">
                                        <select name="ward" id="ward"
                                                class="form-control selectpicker" style="max-width:100px;" data-live-search="true" onchange="this.form.submit()">
                                            <option value="">Select Ward No</option>
                                            @foreach($ward as $v)
                                                <option @if($ward_id == $v->part_no) selected @endif value="{{$v->part_no}}">{{$v->part_no}}</option>
                                                @endforeach
                                            </select>
                                    </div>
                                </form>
                                   
                                    <table
                                        class="table table-striped table-bordered table-hover dataTables-example dataTable no-footer"
                                        id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info"
                                        role="grid">
                                        <thead>
                                            <tr role="row">
                                                    <th class="@if($sort_f == 'id' && $sort_by == 'desc') sorting_desc @elseif($sort_f == 'id' && $sort_by == 'asc') sorting_asc @else sorting @endif" tabindex="0"
                                                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                                        aria-label="Access Data: activate to sort column ascending"
                                                        style="width: 813.172px;">
                                                        <input type="hidden" name="sort_f" value="id">
                                                        @php
                                                        if($sort_by == 'asc'){ 
                                                          $sort = 'desc';
                                                        }
                                                        elseif($sort_by == 'desc'){
                                                        $sort = 'asc';
                                                    }else{
                                                        $sort = 'asc';
                                                    }
                                                        @endphp
                                                        <input type="hidden" name="sort_by" value="{{$sort}}">
                                                        <input type="submit" style="background: transparent;border: none;" value="No.">
                                                    </th>
                                                    <form action="{{request()->url()}}" method="get">
                                                <input type="hidden" name="ward" value="{{$ward_id}}">
                                                <th class="@if($sort_f == 'c_house_no' && $sort_by == 'desc') sorting_desc @elseif($sort_f == 'c_house_no' && $sort_by == 'asc') sorting_asc @else sorting @endif" tabindex="0"
                                                    aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                                    aria-label="Caste: activate to sort column ascending"
                                                    style="width: 383.219px;">
                                                    <input type="hidden" name="sort_f" value="c_house_no">
                                                    @php
                                                    if($sort_by == 'asc'){ 
                                                      $sort = 'desc';
                                                    }
                                                    elseif($sort_by == 'desc'){
                                                    $sort = 'asc';
                                                }else{
                                                    $sort = 'asc';
                                                }
                                                    @endphp
                                                    <input type="hidden" name="sort_by" value="{{$sort}}">
                                                    <input type="submit" style="background: transparent;border: none;" value="House No."> 
                                                </th>
                                            </form>
                                            <form action="{{request()->url()}}" method="get">
                                                <input type="hidden" name="ward" value="{{$ward_id}}">
                                                <th class="@if($sort_f == 'total' && $sort_by == 'desc') sorting_desc @elseif($sort_f == 'total' && $sort_by == 'asc') sorting_asc @else sorting @endif" tabindex="0"
                                                    aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                                    aria-label="Access Data: activate to sort column ascending"
                                                    style="width: 813.172px;">
                                                    <input type="hidden" name="sort_f" value="total">
                                                    @php
                                                    if($sort_by == 'asc'){ 
                                                      $sort = 'desc';
                                                    }
                                                    elseif($sort_by == 'desc'){
                                                    $sort = 'asc';
                                                }else{
                                                    $sort = 'asc';
                                                }
                                                    @endphp
                                                    <input type="hidden" name="sort_by" value="{{$sort}}">
                                                    <input type="submit" style="background: transparent;border: none;" value="Total">
                                                </th>
                                            </form>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            {{-- @dd($house) --}}
                                            @if(count($house) != 0)
                                            @foreach($house as $key => $r)
                                                <tr>
                                                    <td>{{ ($key+1) + ($house->currentPage() - 1)*$house->perPage() }}</td>
                                                    <td>{{$r->c_house_no}}</td>
                                                    <td>{{$r->total}}</td>
                                                   
                                                 </tr>
                                            @endforeach
                                            @else
                                            <tr class="odd">
                                                <td valign="top" colspan="5"
                                                    class="dataTables_empty text-center">No data
                                                    available in table</td>
                                            </tr>
                                            @endif
                                        </tbody>
                                    </table>
                                    {{-- <div class="dataTables_info" id="DataTables_Table_0_info" role="status"
                                    aria-live="polite">
                                     Showing {{$user->onFirstPage()}} to {{$user->perPage()}} of {{$user->count()}} entries 
                                </div> --}}
                                    <div class="dataTables_paginate paging_simple_numbers"
                                        id="DataTables_Table_0_paginate">
                                        @if($hasTable == 1)
                                        {{ $house->appends(request()->input())->links() }}
                                        @endif
                                        {{-- <ul class="pagination">
                                            <li class="paginate_button previous disabled"
                                                id="DataTables_Table_0_previous"><a href="#"
                                                    aria-controls="DataTables_Table_0" data-dt-idx="0"
                                                    tabindex="0">Previous</a></li>
                                            <li class="paginate_button next disabled"
                                                id="DataTables_Table_0_next"><a href="#"
                                                    aria-controls="DataTables_Table_0" data-dt-idx="1"
                                                    tabindex="0">Next</a></li>
                                        </ul> --}}
                                    </div>
                                </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- ============================================================== -->
    <!-- End Container fluid  -->
    <!-- ============================================================== -->
</div>


 

{{-- @if($errors->any()) --}}
<script>
$('#exampleModal').modal('show');
</script>
{{-- @endif --}}
<script>
    $('#paginate').on('change', function(){
        $('#searchForm').submit();
    });
</script>

<script>
    $('.number').keyup(function(e) {
        if (/\D/g.test(this.value)) {
            this.value = this.value.replace(/\D/g, '');
        }
    });
</script>

<script>
$(function() {

$('.string').keydown(function (e) {

if (e.shiftKey || e.ctrlKey || e.altKey) {

  e.preventDefault();

} else {

  var key = e.keyCode;

  if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {

    e.preventDefault();

  }

}

});

});
</script>
@endsection