@extends('Admin.layouts.app')
@section('pagetitle', __('messages.services'))
@section('content')

<table class="table table-striped"  id="DataTable">
    <thead>
        <tr>
            <th>#</th>
            <th style="text-align:center;">@lang('dashboard.title_ar')</th>
            <th style="text-align:center;">@lang('dashboard.title_en')</th>
            <th style="text-align:center;">@lang('dashboard.image')</th>
            <th style="text-align:center;">@lang('dashboard.visibility')</th>
            <th></th>
        </tr>
    </thead>
    <tbody class="row_position">

    </tbody>
</table>
@endsection

@section('css')
@endsection

@section('js')
    <script type="text/javascript">
        $(function() {

            var table = $('#DataTable').DataTable({
                processing: true,
                serverSide: true,
                createdRow: function( row, data, dataIndex ) {
                    $( row ).attr('data-position', data.position);
                    $( row ).attr('data-id', data.id);
                },
                ajax: "{{ route('admin.service.index') }}",
                columns: [{
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex',

                        orderable: false,
                        searchable: false
                    },
                    {
                        data: 'title_ar',
                        name: 'title_ar'
                    },
                    {
                        data: 'title_en',
                        name: 'title_en'
                    },
                    {
                        data: 'image',
                        name: 'image'
                    },
                    {
                        data: 'display',
                        name: 'display'
                    },
                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                        searchable: false
                    },
                ]
            });

        });

        function sortable(ids,positions) {
            $.ajax({
                url: "{{ route('admin.ids.reorder') }}",
                type: 'POST',
                data: {
                    _token: "{{ csrf_token() }}",
                    ids: ids,
                    positions: positions,
                    table: "services"
                },
                success: function() {
                    toastr.success("{{ __('messages.updatedSuccessfully') }}");
                }
            });
        }

        $(document).on('click', '.toggleswitch', function() {
            id = $(this).attr('data-id');
            event.preventDefault();
            swal({
                    text: "@lang('messages.toggle')",
                    title: "@lang('messages.display')",
                    icon: "warning",
                    buttons: true,
                    dangerMode: true,
                })
                .then((willchagestatus) => {
                    if (willchagestatus) {
                        $.ajax({
                            type: "POST",
                            url: "{{ route('admin.service.switch') }}",
                            data: {
                                _token: "{{ csrf_token() }}",
                                id: id,
                                display: $('#checkbox'+id).attr('checked') ? 0 : 1
                            },
                            dataType: 'text',
                            cache: false,
                            success: function() {
                                toastr.success("{{ __('messages.updatedSuccessfully') }}");
                                $('#checkbox'+id).is(':checked') ? $('#checkbox'+id).attr('checked', false) : $('#checkbox'+id).attr('checked', true);
                            }
                        });
                    }
                });

        });

    </script>
@endsection