@extends('layouts.app2')

@section('title', 'Users')
@section('dynamic_css_excpt')
@endsection
@section('dynamic_css')
    <!-- <link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" media="all" rel="stylesheet" type="text/css"/>-->
    <link href="{!! asset('css/dataTables.bootstrap4.min.css') !!}" media="all" rel="stylesheet" type="text/css"/>
    <link href="https://cdn.datatables.net/buttons/1.5.6/css/buttons.bootstrap4.min.css" media="all" rel="stylesheet" type="text/css"/>
    <style>
        select.form-control:not([size]):not([multiple]) {
            height: calc(1.95rem + 0px);
        }
        .panel-title{
            font-size: 15px;
            display: table-cell;
            vertical-align: middle;
        }
        .custom-col-md-6{
            width:50%;
            display: table;
            height: 40px;
        }
        .table td {
            padding: .5rem 1rem .5rem 1rem;
            vertical-align: middle;
            border-top: 1px solid #dee2e6;
        }
        .table .btn{
            min-width: 89px;
        }

        select options {
            text-transform: capitalize;
        }

        .text-blue{
            color: #304192;
            font-weight: 600;
            font-size: 14px;
        }
        /************************ slider button ************************************/

        /* The switch - the box around the slider */
        .switch {
            position: relative;
            display: inline-block;
            width: 55px;
            height: 26px;
        }

        /* Hide default HTML checkbox */
        .switch input {
            opacity: 0;
            width: 0;
            height: 0;
        }

        /* The slider */
        .slider {
            position: absolute;
            cursor: pointer;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: #ccc;
            /* background-color: red;*/
            -webkit-transition: .4s;
            transition: .4s;
        }

        .slider:before {
            position: absolute;
            content: "";
            height: 24px;
            width: 24px;
            left: 3px;
            bottom: 1px;
            background-color: white;
            -webkit-transition: .4s;
            transition: .4s;

        }

        input:checked + .slider {
            background-color: #2196F3;
            /* background-color: green;*/
        }

        input:focus + .slider {
            box-shadow: 0 0 1px #2196F3;
            /* background-color: green;*/
        }

        input:checked + .slider:before {
            -webkit-transform: translateX(26px);
            -ms-transform: translateX(26px);
            transform: translateX(26px);
        }

        /* Rounded sliders */
        .slider.round {
            border-radius: 34px;
        }

        .slider.round:before {
            border-radius: 50%;
        }

        .vl{
            height: 26px;
            border-left: 1px solid #999;
        }

        .fBlack{
            color:#999;
        }

        /*****************************************************************************/
        @media (max-width: 768px)
        {
            li.page-item {

                display: none;
            }
            .dataTables_length {
                margin-bottom: -5px;
                margin-left: 19px;
            }
            .custom-col-md-6{
                width:50%;
                display: table;
                height: 34px;
            }
            .page-item.previous,
            .page-item.next,
            .page-item:first-child,
            .page-item:last-child,
            .page-item.active {

                display: block;
            }

            .result-set{
                padding-left: 15px;
                padding-right: 15px;
            }

            .btn.btn-sm,.btn.btn-xsm {
                padding: .3rem .7rem;
                font-size: .54rem;
            }
            .table .btn {
                min-width: 50px;
            }

            .btn.btn-xsm{
                padding: .2rem .2rem;
            }

            #data-table{
                width: 100% !important;
            }

        }

        .dataTables_filter{
            display: inline-block;
            float: right;
        }

        .btn-secondary {
            background-color: #1c7095!important;
            color: #fff!important;
            padding: .40rem .60rem;
        }

        .verification{
            width: 100% !important;
        }

        /*.verification tbody tr td:nth-child(8){*/
        /*display: flex;*/
        /*}*/
        .verification th{
            text-align: center;
        }
        .verification td{
            text-align: center;
        }
        .dataTables_length{
            margin-bottom: -56px;
        }
        .dt-buttons{
            left: 165px;
        margin-bottom: -43px;
        }

        .img-circular{
            width: 95px;
            height: 95px;
            background-size: cover;
           
        }
        img{
            border-radius: 50%;
        }
        .mod_head{
            background-color: #1f2b49 !important;
        }

        .modal-dialog.modal-notify .modal-body {
            padding: 0px !important;
        }
        .modal-body {
            padding: 0px !important;
        }
        .modal-header{
            height: 52px !important;
            padding: 7px !important;
        }



    </style>
@endsection

@section('content')
    <div class="container">
        <div class="row container_layout">
            <div class="col-md-12 pl0 pr0 mobile_view">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item">
                            <a href="{{ route('adminhome')}}">
                                <i class="material-icons">home</i>
                            </a>
                        </li>
                        <li class="breadcrumb-item"><a href="{{ route('employees') }}">Employees</a></li>
                        <li class="breadcrumb-item active"><a href="{{ route('employeeVerificationView') }}">Employee Verification</a></li>
                    </ol>
                </nav>
            </div>


            <div class="col-md-12 p20 bg-white">
                <div class="panel panel-default">
                    <div class="panel-heading ">

                        <div class="row e1f5fe bdbdbd grey lighten-1 custom_row_o" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample" style="cursor: pointer;">
                            <div class="col-md-6 custom-col-md-6" style="max-width: 50%;">

                                <div class="panel-title pl5">
                                    <i class="fa fa-filter"></i> <span class="label_text"> Custom Filter </span>
                                </div>

                            </div>
                            <div class="col-md-6 custom-col-md-6 text-right" style="max-width: 50%;">

                            </div>
                        </div>

                    </div>
                    <div class="panel-body">
                        <div class="row bg_body custom_row_o">
                            <div class="col-md-12 collapse show mt10" id="collapseExample">

                                {{ csrf_field() }}
                                <div class="row result-set">
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue"> District </label>
                                        <select class="form-control input-md" id="district" name="district">
                                            @if($data['districts'])
                                                <option value="" selected disabled>==== Select District ====</option>
                                                <option value="1" @if($data['district']==1) {{'selected'}} @endif> All </option>

                                                @foreach($data['districts'] as $dist)
                                                    @if(($data['district']) && ($data['district']==$dist->district_code))
                                                        <option value="{{ $dist->district_code}}" selected> {{ $dist->district_name }} </option>
                                                    @else
                                                        <option value="{{ $dist->district_code}}"> {{ $dist->district_name }} </option>
                                                    @endif
                                                @endforeach
                                            @else
                                                <option value="{{$data['district']}}" selected>{{$data['district_name']}}</option>
                                            @endif
                                        </select>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue">Block</label>
                                        <select class="form-control input-md" id="block" name="block">

                                            @if($data['block_list'])
                                                <option value="" disabled selected>==== Select A Block ====</option>
                                                @foreach($data['block_list'] as $blk)
                                                    @if(($data['block']) && ($data['block']==$blk->block_id))
                                                        <option value="{{ $blk->block_id}}" selected> {{ $blk->block_name }} </option>
                                                    @else
                                                        <option value="{{ $blk->block_id}}"> {{ $blk->block_name }} </option>
                                                    @endif
                                                @endforeach
                                            @elseif($data['block'])
                                                <option value="{{$data['block']}}" selected>{{$data['block_name']}}</option>
                                            @else
                                                <option value="" disabled selected>==== Select A Block ====</option>
                                            @endif

                                        </select>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue">Gram Panchayat</label>
                                        <select class="form-control input-md" id="panchyat" name="panchyat">
                                            <option value="">==== Select Gram Panchayat ====</option>
                                            @if($data['panchyat_list'])
                                                @foreach($data['panchyat_list'] as $pan)
                                                    @if(($data['panchyat']) && ($data['panchyat']==$pan->gram_panchyat_id))
                                                        <option value="{{ $pan->gram_panchyat_id}}" selected> {{ $pan->gram_panchyat_name }} </option>
                                                    @else
                                                        <option value="{{ $pan->gram_panchyat_id}}"> {{ $pan->gram_panchyat_name }} </option>
                                                    @endif
                                                @endforeach
                                            @endif
                                        </select>



                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue">Program</label>
                                        <select class="form-control input-md" id="program" name="program">
                                            <option value=""  selected>==== Select Program ====</option>
                                            @if($data['programe'])
                                                @foreach($data['programe'] as $pr)

                                                    @if(($data['program_s']) && ($data['program_s']==$pr->program_id))
                                                        <option value="{{ $pr->program_id}}" selected> {{ $pr->program_name }} </option>
                                                    @else
                                                        <option value="{{ $pr->program_id}}"> {{ $pr->program_name }} </option>
                                                    @endif
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                </div>
                                <div class="row result-set">
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue">Level</label>
                                        <select class="form-control input-md" id="level" name="level">
                                            <option value=""  selected>==== Select Levels ====</option>
                                            @if($data['level'])
                                                @foreach($data['level'] as $lev)
                                                    @if(($data['level_s']) && ($data['level_s']==$lev->level_id))
                                                        <option value="{{ $lev->level_id}}" selected> {{ $lev->level }} </option>
                                                    @else
                                                        <option value="{{ $lev->level_id}}"> {{ $lev->level }} </option>
                                                    @endif
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue"> Designation </label>
                                        <select class="form-control input-md" id="designation" name="designation">
                                            <option value="">==== Select Designation ====</option>
                                            @if($data['designation_list'])
                                                @foreach($data['designation_list'] as $des)
                                                    @if(($data['designation_s']) && ($data['designation_s']==$des->designation_id))
                                                        <option value="{{ $des->designation_id}}" selected> {{ $des->designation_name }} </option>
                                                    @else
                                                        <option value="{{ $des->designation_id}}"> {{ $des->designation_name }} </option>
                                                    @endif
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="control-label text-blue">Service Status</label>
                                        <select class="form-control input-md" id="service_status" name="service_status">
                                            <option value="" disabled selected>==== Select Service Status ====</option>
                                            @if($data['status'])
                                                @foreach($data['status'] as $st)


                                                    @if(($data['service_status']) && ($data['service_status']==$st->status_id))
                                                        <option value="{{ $st->status_id }}" selected> {{ $st->status_name }} </option>
                                                    @else
                                                        <option value="{{ $st->status_id }}"> {{ $st->status_name }} </option>
                                                    @endif
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                    <div class="col-md-3 text-right margin-auto">
                                        <button type="submit" class="btn btn-primary btn-sm search"><i class="fa fa-search" aria-hidden="true"></i> Search</button>
                                        <a href="{{ route('employeeusers.display') }}" class="btn btn-warning  btn-sm"> <i class="fa fa-refresh" aria-hidden="true"></i> Reset</a>
                                    </div>
                                </div>

                            </div>
                        </div>
                        <div class="result-set mt10" id="no-more-tables">
                            <div class="row">
                                <div class="col-md-12 pl0 pr0">
                                    <table class="table table-responsive employeeList" cellspacing="10">
                                        <thead>
                                            <tr class="note note-primary">
                                                <th scope="col" class="note-dange">#</th>
                                                <th scope="col">Employee Code</th>
                                                <th scope="col">Employee Name</th>
                                                <th scope="col">Designation</th>
                                                <th scope="col">Posted District</th>
                                                <th scope="col">Posted Block</th>
                                                <th scope="col">GP</th>
                                                <th scope="col">Service Status</th>
                                                {{-- <th scope="col">Date Of Joining</th>                                          
                                                <th scope="col">Contact No</th> --}}
                                                
                                                <th scope="col">Aggrements</th>
                                                
                                            </tr>
                                        </thead>

                                    </table>

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



        </div>

    </div>

    <div class="modal fade top" id="fluidModalTopWarningDemo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="true"  style="display: none;" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-top modal-notify modal-primary" role="document">
            <!--Content-->
            <div class="modal-content">
                <!--Header-->
                <div class="modal-header mod_head">
                    <p class="heading lead">Employement Details</p>

                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true" class="white-text">×</span>
                    </button>
                </div>

                <!--Body-->
                <div class="modal-body">
                    <div id="printSection">
                    <div class="container">
                        <div class="row" id="profile" style="font-size:13px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
                           
                            <div class="col-md-12 mt-2" style="text-align:center;">
                                
                               <img src="" id="dp" class="img-circular" onerror="if (this.src != '{{asset('images/profile_pic.jpg')}}') this.src = '{{asset('images/profile_pic.jpg')}}';" style="box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Employee Code</label>
                                <p id="code"></p>

                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Employee Name</label>
                                <p id="name"></p>
    
                            </div>
                           
                           <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Designation</label>
                                <p id="designation_name"></p>

                            </div>
                            {{-- <div class="col-md-3 mt-3">
                                    <div style="border:1px solid grey;width: 149px;
                                    height: 161px;padding: 8px;">
                                        <img src="{{asset('images/profile_pic.jpg')}}" style="width: 131px;height: 146px;">
                                    </div>
                               </div> --}}
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Service Status</label>
                                <p id="status" style="font-weight:bold"></p>

                            </div>   
                            <div class="col-md-3 mt-1">
                                    <label style="color:#2196F3;font-weight:bold;">Date Of Joining</label>
                                    <p id="joining_date"></p>
    
                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Contract Date</label>
                                <p id="contract_date"></p>

                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Date of Birth</label>
                                <p id="dob"></p>

                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">PAN No</label>
                                <p id="pan"></p>
                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Posted District</label>
                                <p id="posted_district"></p>
                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Posted Block</label>
                                <p id="posted_block"></p>
                            </div>
                            <div class="col-md-3 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Posted GP</label>
                                <p id="posted_gp"></p>
                            </div>
                           
                           
                            
                            
                            <div class="col-md-12" style="background-color:#1f2b49">
                                <p style="padding-top: 11px;color: white;font-size: 15px;">Contact Details</p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Mobile</label>
                                <p id="mobile"></p>

                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;" class="bs-linebreak">Alternate Mobile</label>
                                <p id="alt_mobile"></p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Email</label>
                                <p id="email"></p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Home District</label>
                                <p id="home_district"></p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Home Block</label>
                                <p id="home_block"></p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Home Town</label>
                                <p id="home_town"></p>
                            </div>
                            <div class="col-md-12" style="background-color:#1f2b49">
                                <p style="padding-top: 11px;color: white;font-size: 15px;">Bank Details</p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Account No</label>
                                <p id="account_no"></p>

                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">IFSC</label>
                                <p id="ifsc"></p>
                            </div>
                            <div class="col-md-4 mt-1">
                                <label style="color:#2196F3;font-weight:bold;">Bank Name</label>
                                <p id="bank_name"></p>
                            </div>
                            <div class="col-md-12" style="text-align:center;">
                                <button type="submit" onclick="printDiv('printSection')" class="btn btn-success btn-sm">Print</button>
                                <button type="submit" data-dismiss="modal" aria-label="Close"  class="btn btn-danger btn-sm">Cancel</button>
                            </div>
                           
                        </div>
                        </div>
                    
                    </div>
                    
                
                </div>
            </div>
        </div>
    </div>



@endsection

@section('dynamic_js')
    <script src="{{ asset('js/lib/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('js/lib/dataTables.bootstrap4.min.js') }}"></script>
    <script src="https://cdn.datatables.net/buttons/1.5.6/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.bootstrap4.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.print.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.colVis.min.js"></script>
    <script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
    <script src="{{ asset('plugins/bootstrap-material-datetimepicker/js/bootstrap-material-datetimepicker.js') }}"></script>

    <!--<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>-->
    <script>


        $(document).on('change','#district',function () {
            $('.page-loader-wrapper').fadeIn();
            var dis_id=$('#district').val();
            $('#block').empty();
            var option = "<option value=''>==== Select A Block ====</option>";
            $('#block').append(option);
            $('#panchyat').empty();
            var option = "<option value=''>==== Select Gram Panchayat ====</option>";
            $('#panchyat').append(option);
            $.ajax({
                // headers: {
                //     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                // },
                type: "GET",
                url: "{{route('get_employees_blocks')}}",
                dataType: 'json',
                data: {'dis_id': dis_id,"_token": "{{ csrf_token() }}"},
                success: function (data) {
                    $('.page-loader-wrapper').fadeOut();

                    $('#block').empty();
                    var option = "<option value=''>==== Select A Block ====</option>";
                    $.each(data,function (index,value) {
                        option += '<option class="block_name_count" value="'+value.block_id+'">'+value.block_name+'<span style="color:red;">('+value.count+')</span></option>'
                    });

                    $('#block').append(option);




                },
                error: function (jqXHR, textStatus, errorThrown) {
                    $('.page-loader-wrapper').fadeOut();
                    Swal.fire({
                        type: 'error',
                        title: 'Oops...',
                        text: 'Something went wrong!',

                    })
                }
            })

        });

        $(document).on('change','#block',function () {
            var block_id=$('#block').val();
            $('.page-loader-wrapper').fadeIn();
            $('#panchyat').empty();
            var option = "<option value=''>==== Select Gram Panchayat ====</option>";
            $('#panchyat').append(option);
            $.ajax({
                // headers: {
                //     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                // },
                type: "GET",
                url: "{{route('employeesget_Gp')}}",
                dataType: 'json',

                data: {'block_id': block_id,"_token": "{{ csrf_token() }}"},
                success: function (data) {

                    $('.page-loader-wrapper').fadeOut();
                    if (data.msg == 'success') {
                        $('#panchyat').empty();
                        var option = "<option value=''>==== Select Gram Panchayat ====</option>";
                        $.each(data.gp,function (index,value) {
                            option += '<option value="'+value.gram_panchyat_id+'">'+value.gram_panchyat_name+'</option>'
                        });

                        $('#panchyat').append(option);
                    }
                    if (data.msg == 'failed') {
                        $('.page-loader-wrapper').fadeOut();
                        Swal.fire({
                            type: 'error',
                            title: 'Oops...',
                            text: 'Something went wrong!'
                        })
                    }
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    $('.page-loader-wrapper').fadeOut();
                    Swal.fire({
                        type: 'error',
                        title: 'Oops...',
                        text: 'Something went wrong!',


                    })
                }
            })

        });

        $(document).on('change','#level',function (e) {
            e.preventDefault();
            $('.page-loader-wrapper').fadeIn();
            var level=$('#level').val()
            $.ajax({
                // headers: {
                //     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                // },
                type: "GET",
                url: "{{route('get_designation_employees')}}",
                dataType: 'json',
                data: {'level': level,"_token": "{{ csrf_token() }}"},
                success: function (data) {
                    $('.page-loader-wrapper').fadeOut();

                    $('.page-loader-wrapper').fadeOut();
                    if (data.msg == 'success') {
                        $('#designation').empty();
                        var option = "<option value=''>==== Select Designation ====</option>";
                        $.each(data.designation,function (index,value) {
                            option += '<option value="'+value.designation_id+'">'+value.designation_name+'</option>'
                        });

                        $('#designation').append(option);
                    }
                    if (data.msg == 'failed') {
                        $('.page-loader-wrapper').fadeOut();
                        Swal.fire({
                            type: 'error',
                            title: 'Oops...',
                            text: 'Something went wrong!'
                        })
                    }
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    $('.page-loader-wrapper').fadeOut();

                    Swal.fire({
                        type: 'error',
                        title: 'Oops...',
                        text: 'Something went wrong!',


                    })
                }
            })

        })

        $('.employeeList').DataTable({
            "processing": true,
            "serverSide": true,
            "responsive": true,
            "scrollX": true,
            buttons: [
                'copyHtml5',
                'excelHtml5',
                'csvHtml5',
                'pdfHtml5'
            ],
            "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
            dom: 'Blfrtip',
            "language": {
                "processing": 'Loading data...'
            },

            "ajax": {
                "url": "{{ route('getEmployeeList')}}",
                "data": function (d) {
                    d.dis_id=$('#district').val();
                    d.block_id=$('#block').val();
                    d.panchayat_id=$('#panchyat').val();
                    d.program_id=$('#program').val();
                    d.level_id=$('#level').val();
                    d.des_id=$('#designation').val();
                    d.ser_status=$('#service_status').val();
                }
            },
            "columns": [
                {data: 'DT_Row_Index', name: 'DT_Row_Index'},
                {"data": "employee_code",
                    "render": function(data, type, row, meta){
                        if(type === 'display'){
                            data = '<a href="' + row.employee_code + '" style="color:blue;" id="profile_view">'+ row.employee_code +'</a>';
                        }
                        return data;
                    }
                },
                {"data": "name"},
                {"data": "designation_name"},
                {"data": "district_name"},
                {"data": "block_name"},
                {"data": "gram_panchyat_name"},
                {"data": "action"},
                // {"data": "date_of_joining"},             
                // {"data": "mobile"},
                // {"data": "first_aggrement"},
                { "data": "first_aggrement",  
					"render":function(data, type, row, meta){
                    return "<a href='"+row.first_aggrement+"' target='_blank' class='badge badge-pill badge-sm badge-info' style='padding: 10px'>View</a>"
				}
			},

            ],
        });

        $(document).on('click', '.search', function (e) {
            e.preventDefault();
            $('.employeeList').DataTable().ajax.reload();

        });

        $(document).on('click','#profile_view',function(e){
            e.preventDefault();
            var code=$(this).attr('href');
            var url=$('#image_url').val();
            $('#code').empty();
            $('#name').empty();
            $('#designation_name').empty();
            $('#joining_date').empty();
            $('#contract_date').empty();
            $('#posted_district').empty();
            $('#posted_block').empty();
            $('#posted_gp').empty();
            $('#pan').empty();
            $('#dob').empty();
            $('#mobile').empty();
            $('#alt_mobile').empty();
            $('#email').empty();
            $('#home_district').empty();
            $('#home_block').empty();
            $('#home_town').empty();
            $('#account_no').empty();
            $('#ifsc').empty();
            $('#bank_name').empty();
            $('#dp').empty();
            $('#status').empty();
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                type: "POST",
                url: "{{route('employeeViewProfile')}}",
                dataType: 'json',
                data: {'code': code},
                success: function (data) {
                    if (data.msg == 'success') {
                        $('#fluidModalTopWarningDemo').modal('show');
                        $('#code').append(data.data.employee_code);
                        $('#name').append(data.data.name);
                        $('#designation_name').append(data.data.designation_name);
                        $('#joining_date').append(data.data.date_of_joining);
                        $('#contract_date').append(data.data.contract_date);
                        $('#posted_district').append(data.data.district_name);
                        $('#posted_block').append(data.data.block_name);
                        $('#posted_gp').append(data.data.gram_panchyat_name);
                        $('#pan').append(data.data.pan_no);
                        $('#dob').append(data.data.date_of_birth);
                        $('#mobile').append(data.data.mobile);
                        $('#alt_mobile').append(data.data.alternate_mobile);
                        $('#email').append(data.data.email);
                        $('#home_district').append(data.data.home_dist);
                        $('#home_block').append(data.data.home_blo);
                        $('#home_town').append(data.data.home_town);
                        $('#account_no').append(data.data.account_no);
                        $('#ifsc').append(data.data.ifsc_code);
                        $('#bank_name').append(data.data.bank_name);
                        $('#dp').attr("src",url+data.data.photo_upload);
                       
                        if(data.data.status==1){
                            $('#status').css('color', 'green');
                            $('#status').append('Serving');
                        }else if(data.data.status==2){
                            $('#status').css('color', 'red');
                            $('#status').append('Terminated') 
                        }else if(data.data.status==3){
                            $('#status').css('color', 'red');
                            $('#status').append('Resigned') 
                        }else if(data.data.status==4){
                            $('#status').css('color', 'red');
                            $('#status').append('Suspended');
                        }else if(data.data.status==5){
                            $('#status').css('color', 'green');
                            $('#status').append('On Hold');
                        }else if(data.data.status==6){
                            $('#status').css('color', 'red');
                            $('#status').append('Death');
                        }else if(data.data.status==7){
                            $('#status').css('color', 'red');
                            $('#status').append('Unauthorized');
                        }
                    }
                    if (data.msg == 'failed') {

                        Swal.fire({
                            type: 'error',
                            title: 'Oops...',
                            text: 'Something went wrong!'
                        })
                    }
                },
                error: function (jqXHR, textStatus, errorThrown) {

                    Swal.fire({
                        type: 'error',
                        title: 'Oops...',
                        text: 'Something went wrong!',

                    })
                }
            })
           });

      

        function printDiv(printSection) {
            var printContents = document.getElementById(printSection).innerHTML;
            var originalContents = document.body.innerHTML;

            document.body.innerHTML = printContents;

            window.print();

            document.body.innerHTML = originalContents;
            
            setTimeout(function() {
                location.reload();
            }, 1000);
        }    

    </script>
@endsection