%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/silvzytp/calling_code/resources/views/backend/pages/manager/
Upload File :
Create Path :
Current File : /home/silvzytp/calling_code/resources/views/backend/pages/manager/index.blade.php

@extends('layouts.backend')
@section('title', $siteTitle)
@section('action')
<div class="d-flex align-items center">
    @permission('app.managers.create')
    <a href="{{ route(routeName().'.managers.create') }}" class="btn btn-sm btn-primary"><i class="ti-plus fs-ism fw-800"></i> Add Manager</a>
    @endpermission
</div>
@endsection
@push('styles')
<style>
    .onoffswitch {
        position: relative;
        width: 95px;
        -webkit-user-select:none;
        -moz-user-select:none;
        -ms-user-select: none;
        margin: auto;
    }
    .onoffswitch-checkbox {
        display: none;
    }
    .onoffswitch-label {
        display: block;
        overflow: hidden;
        cursor: pointer;
        border-radius: 20px;
        margin-bottom: 0;
    }
    .onoffswitch-inner {
        display: block;
        width: 200%;
        margin-left: -100%;
        transition: margin 0.3s ease-in 0s;
    }
    .onoffswitch-inner:before, .onoffswitch-inner:after {
        display: block;
        float: left;
        width: 50%;
        height: 25px;
        padding: 0;
        line-height: 25px;
        font-size: 14px;
        color: white;
        font-family: Trebuchet, Arial, sans-serif;
        font-weight: 400;
        box-sizing: border-box;
    }
    .onoffswitch-inner:before {
        content: "Enabled";
        padding-right: 15px;
        background-color: green;
        color: #FFFFFF;
    }
    .onoffswitch-inner:after {
        content: "Disabled";
        padding-right: 10px;
        background-color: red;
        color: #FFFFFF;
        text-align: right;
    }
    .onoffswitch-switch {
        display: block;
        width: 25px;
        margin: 2px;
        background: #FFFFFF;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 67px;
        border-radius: 20px;
        transition: all 0.3s ease-in 0s;
    }
    .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
        margin-left: 0;
    }
    .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
        right: 0px;
    }
    ol.agent-list{
        margin: 0 0 0 18px;
        padding: 0;
    }
</style>
@endpush

@section('content')

    <div class="row">
        <div class="col-12">
            <div id="bulk-card" class="d-none">
                <form method="POST" id="bulk-form">
                    @csrf
                    <div class="d-flex align-items-center mb-3">
                        <x-form.selectbox name="operation" divClass="mb-0">
                            <option value="">--Select--</option>
                            @permission('app.managers.bulk-destroy')
                            <option value="delete">Deleted</option>
                            @endpermission
                            @permission('app.managers.bulk-status')
                            <option value="enabled">Enabled</option>
                            <option value="disabled">Disabled</option>
                            @endpermission
                        </x-form.selectbox>

                        <div class="bulk-apply">
                            <button class="btn btn-md btn-primary rounded-0 ml-2 px-3">Apply</button>
                        </div>
                    </div>
                </form>
            </div>

            <div class="card">
                <div class="card-body px-0">
                    <table class="table table-sm table-borderless table-style" id="admin-datatables">
                        <thead>
                            <th>
                                <div class="custom-control custom-checkbox">
                                    <input type="checkbox" class="custom-control-input" id="all_checked">
                                    <label class="custom-control-label" for="all_checked"></label>
                                </div>
                            </th>
                            <th>Profile</th>
                            <th>Name</th>
                            <th>Email</th>
                            <th>Role</th>
                            <th>Enabled/Disabled</th>
                            <th class="text-right">Action</th>
                        </thead>
                        <tbody>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    @include('backend.modal.user-details')
@endsection

@push('scripts')
    <script>
        table = $('#admin-datatables').DataTable({
            processing: true,
            serverSide: true,
            order: [], //Initial no order
            bInfo: true, //TO show the total number of data
            bFilter: false, //For datatable default search box show/hide
            responsive: true,
            ordering: false,
            lengthMenu: [
                [5, 10, 15, 25, 50, 100, 1000, 10000, -1],
                [5, 10, 15, 25, 50, 100, 1000, 10000, "All"]
            ],
            pageLength: 25, //number of data show per page
            ajax: {
                url: "{{ route(routeName().'.managers.get-data') }}",
                type: "POST",
                dataType: "JSON",
                data: function(d) {
                    d._token = _token;
                    d.search_text = $("input#search-here").val();
                },
            },
            columns: [
                {data: 'bulk_check',orderable: false, searchable: false},
                {data: 'profile', orderable: false, searchable: false},
                {data: 'name'},
                {data: 'email'},
                {data: 'role'},
                {data: 'status', orderable: false, searchable: false},
                {data: 'action', orderable: false, searchable: false},
            ],
            language: {
                processing: '<img src="{{ asset("uploads/images/table-loading.svg") }}">',
                emptyTable: '<strong class="text-danger">No Data Found</strong>',
                infoEmpty: '',
                zeroRecords: '<strong class="text-danger">No Data Found</strong>',
                oPaginate: {
                    sPrevious: "Previous", // This is the link to the previous page
                    sNext: "Next", // This is the link to the next page
                },
                lengthMenu: "<div class='d-flex align-items-center'>_MENU_ <input type='text' class='border form-control ml-1' id='search-here' placeholder='Enter name, email, phone no..'></div>"
            },
            dom: "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6' <'float-right pr-15'B>>>" +
            "<'row'<'col-sm-12'tr>>" +
            "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'<'float-right pr-15'p>>>",
            buttons: {
                buttons: [
                    {
                        extend: 'pdf',
                        filename: 'users_{{ date("d_m_d") }}',
                        title: 'User List',
                        orientation: "portrait",
                        pageSize: "A4",
                        className: 'pdfButton btn btn-sm btn-primary',
                        exportOptions: {
                            columns: '1,2,3,4,5'
                        },
                    },
                    {
                        extend: 'excel',
                        filename: 'users_{{ date("d_m_d") }}',
                        title: 'User List',
                        className: 'excelButton btn btn-sm btn-primary',
                        exportOptions: {
                            columns: '1,2,3,4,5'
                        },
                    },
                    {
                        extend: 'csv',
                        filename: 'users_{{ date("d_m_d") }}',
                        title: 'User List',
                        className: 'csvButton btn btn-sm btn-primary',
                        exportOptions: {
                            columns: '1,2,3,4,5'
                        },
                    },
                    {
                        extend: 'print',
                        title: 'User List',
                        orientation: "portrait",
                        pageSize: "A4",
                        className: 'printButton btn btn-sm btn-primary',
                        exportOptions: {
                            columns: '1,2,3,4,5'
                        },
                        customize: function ( win ) {
                            $(win.document.body)
                                .addClass('bg-white')
                                .css('font-size','10pt');

                            $(win.document.body).find('table')
                                .addClass('compact bg-white')
                                .css('font-size','inherit' );
                        }
                    }
                ]
            }
        });

        @permission('app.managers.destroy')
        // deletable btn
        $(document).on('click', 'button.confirm-deletable-action', function(){
            // modal data
            let data_id = $('#deletable-modal input.datatable').val();
            const url = "{{ route(routeName().'.managers.destroy') }}";

            deletable_action(data_id,url); // define function
        });
        @endpermission


        // user status enabled/disabled
        $(document).on('click', 'input.user-status', function(){
            let data_id = $(this).data('id');
            const url = "{{ route(routeName().'.managers.status') }}";
            if (this.checked) {
               var status = 1;
            }else{
               var status = 2;
            }

            datatable_status(data_id,status,url);
        });

        // user bulk deletable
        $(document).on('click', 'button.bulk-deletable-action', function(){
            var data_id = $('#deletable-modal input.datatable').val();
            var operation_type = $('#deletable-modal .modal-body input.operation-type').val();
            const url = "{{ route(routeName().'.managers.bulk-destroy') }}";
            bulk_deletable_action(data_id,operation_type,url);
        });
    
        $(document).on("keyup keypress", "input#search-here", function(){
            table.ajax.reload(); 
        });
    </script>
@endpush

Zerion Mini Shell 1.0