@extends('admin.layout')
@section('content')
    <div class="container-fluid">
        <!--  Row 1 -->
        <div class="container-fluid">
            <!--  Row 1 -->
            <div class="row justify-content-end g-2 mb-3">
                <div class="col-lg-auto  col-md-auto col-sm-auto col-auto my-auto me-auto">
                    <h2 class="main_title m-0">Manage User</h2>
                </div>


                <div class="col-lg-auto  col-md-auto col-sm-auto col-auto">
                    <a id="exportBtn" class="btn btn-success"><i class="fa fa-download me-2"></i>Export </a>
                </div>
            </div>
            <div class="row">
                <div class="col-12">
                    <div class="white_shadow_rs">
                        <table id="datatable" class="table table-striped data-table-dr" style="width:100%">
                            <thead>
                                <tr>
                                    <th>Sr No</th>
                                    <th>Parent SAP Code </th>
                                    <th>Emp SAP Code </th>
                                    <th>Emp Code </th>
                                    <th>Employee Name </th>
                                    <th>Designation </th>
                                    <th>Mobile </th>
                                    <th>Email-Id </th>
                                    <th>State </th>
                                    <th> Reporting City </th>
                                    <th>Status</th>
                                    <th>Date And Time</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>

            </div>

        </div>
    @endsection
    @section('js')
        <script>
            var userTable;
            $(function() {

                var columns = [{
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex',
                        searchable: false
                    },
                    {
                        data: 'parant_position_code',
                        name: 'parant_position_code'
                    },
                    {
                        data: 'position_code',
                        name: 'position_code'
                    },
                    {
                        data: 'emp_code',
                        name: 'emp_code'
                    },
                    {
                        data: 'emp_name',
                        name: 'emp_name'
                    },
                    {
                        data: 'emp_position_name',
                        name: 'emp_position_name'
                    },
                    {
                        data: 'mobile_no',
                        name: 'mobile_no'
                    },
                    {
                        data: 'email_id',
                        name: 'email_id'
                    },
                    {
                        data: 'state_name',
                        name: 'state_name'
                    },
                    {
                        data: 'reporting_city',
                        name: 'reporting_city'
                    },
                    {
                        data: 'status',
                        name: 'status'
                    },
                    {
                        data: 'created_at',
                        name: 'created_at',
                    }
                ];

                var columnDefs = [];

                userTable = getdatatable("{{ route('manageuserpeginate') }}", columns, columnDefs);
            });

            function getdatatable(url, columns, columnDefs) {
                return $('#datatable').DataTable({
                    processing: true,
                    serverSide: true,
                    bDestroy: true,
                    fixedHeader: true,
                    order: [],
                    scrollX: true,
                    columns: columns,
                    columnDefs: columnDefs,
                    ajax: {
                        method: 'POST',
                        url: url,
                        data: function(d) {
                            d._token = "{{ csrf_token() }}";
                        }
                    },
                });
            }

            function user_status_change(user_id, status) {
                Swal.fire({
                    title: 'Are you sure?',
                    text: "Do you want to activate your status?",
                    icon: 'success',
                    showDenyButton: true,
                    confirmButtonColor: '#3085d6',
                    denyButtonColor: '#d33',
                    denyButtonText: 'No',
                    confirmButtonText: 'Yes'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: "{{ route('updateUserStatus') }}",
                            type: 'POST',
                            data: {
                                'user_id': user_id,
                                'status': status,
                                '_token': "{{ csrf_token() }}"
                            },
                            dataType: "json",
                            success: function(response) {
                                if (response.status == 1) {
                                    $.notify(response.message, "success");
                                    userTable.draw();
                                } else {
                                    $.notify(response.message, "error");
                                }
                            },
                            error: function(jqXHR) {
                                $.notify(jqXHR.responseJSON.message, "error");
                            }
                        });
                    } else {
                        $.notify("The status remains unchanged.", "info");
                        userTable.draw();
                    }
                });
            }

            $('#exportBtn').click(function() {
                $.ajax({
                    url: "{{ route('exportUsers') }}",
                    type: 'GET',
                    data: {},
                    xhrFields: {
                        responseType: 'blob'
                    },
                    success: function(response) {
                        var blob = new Blob([response], {
                            type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
                        });
                        var link = document.createElement('a');
                        link.href = window.URL.createObjectURL(blob);
                        link.download = 'users_export.xlsx';
                        link.click();
                    },
                    error: function(xhr, status, error) {
                        console.error(error);
                    }
                });
            });
        </script>
    @endsection