@extends(\Auth::user()->role != 10 ? 'layout' : 'layoutfrontdesk')

@section('title','Roles')

@section('css')
<style type="text/css">
    .cool-checkbox-label {
        display: flex;
        align-items: center;
    }

    .cool-modul-name {
        margin-left: 10px; /* Adjust the left margin for spacing */
        font-size: 18px; /* Adjust the font size */
        color: #333; /* Adjust the text color */
    }
	/* .datatable-column-width{
		overflow: hidden; text-overflow: ellipsis; max-width: 200px;
	} */


</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/iCheck/1.0.3/skins/all.css">
<link href="../../../../global_assets/datatableasset/fixedColumns.min.css" rel="stylesheet" type="text/css">

@endsection

@section('content')

	<!-- Page header -->
	<div class="page-header page-header-light">
		<div class="page-header-content header-elements-md-inline">
			<div class="page-title d-flex">
				<h4><span class="font-weight-semibold">Index</span> - Data Role</h4>
				<a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
			</div>
		</div>
	</div>
	<!-- /page header -->

	<!-- Content area -->
	<div class="content">

        {{-- <div class="card">
			<div class="card-body">
				<div class="form-group row col-sm-5">
                    <label class="col-form-label col-sm-2"><h6><b>Role</b></h6></label>
                    <div class="col-sm-5">
                        <select name="filter_status" id="filter_status" class="form-control form-control-select2" onchange="refreshPage()">
                            @foreach ($roles as $key => $role)
                                @if ($key == 1) @continue @endif
                                <option value="{{$key}}" {{ $selectedRole == $key ? 'selected' : '' }}> {{$role}} </option>
                            @endforeach
                        </select>
                    </div>
                </div>
			</div>
		</div> --}}

        <input type="hidden" id="filter_status" value="{{$selectedUser}}">

        <!-- Hover rows -->
        <div class="card">
            <div class="card-body">

                <div class="row">
                    <div class="col">
                        <h5 class="font-weight-semibold">Akses Role</h5>
                        <span class="text-primary">* Akses akan terupdate saat login ulang</span>
                    </div>
                </div>

                @foreach ($group_moduls as $group_modul)
                    @if (in_array($group_modul->id,[10,20,30,40]))
                        <ul class="nav nav-sidebar" data-nav-type="accordion">

                            <li id="" class="nav-item nav-item-submenu">
                                @php
                                    $cekaksesallmenu = cekaksesuserallakses($selectedUser, 'akses_properti');
                                @endphp
                                <button id="" class="btn bg-slate nav-link" style="width: 100%; font-size: 16px">
                                    <input type="checkbox" class="form-check-input-switchery aksesallmenu" {{$cekaksesallmenu}} value="1" data-role="{{$selectedRole}}" data-group_modul_id="akses_properti">
                                    <span class="font-weight-bold ml-1 text-underline"><u>Akses properti</u></span>
                                </button>
                                <ul class="nav nav-group-sub">
                                    <div class="card p-3">
                                        <div class="row">
                                            @if(array_key_exists('akses_properti', $moduls))
                                            @foreach ($moduls['akses_properti'] as $modul)
                                                @php
                                                    // $cekakses = cekaksesrole($akses, $modul, $selectedRole, 'akses_properti');
                                                $cekakses = cekaksesuser($akses, $modul, $selectedUser, $modul['group_modul_id'], 'akses_properti');
                                                @endphp
                                                <div class="col-md-6">
                                                    <input type="checkbox" class="form-check-input-switchery aksesrole allrole{{$selectedUser}}" {{$cekakses}} value="1" data-role="{{$selectedRole}}" data-modul_id="{{$modul['id']}}" data-group_modul_id="{{$modul['group_modul_id']}}">
                                                    <span class="cool-modul-name">{!!$modul['modul']!!}</span>
                                                </div>
                                            @endforeach
                                            @endif
                                        </div>
                                    </div>
                                </ul>
                            </li>
                        </ul>
                        @break
                    @endif
                @endforeach
                @foreach ($group_moduls as $group_modul)
                @if (in_array($group_modul->id,[10,20,30,40,49]))
                    @continue
                @endif
                <ul class="nav nav-sidebar" data-nav-type="accordion">

                    <li id="" class="nav-item nav-item-submenu">
                        @php
                            // $cekaksesallmenu = cekaksesroleallakses($selectedRole, $group_modul->id);
                            $cekaksesallmenu = cekaksesuserallakses($selectedUser, $group_modul->id);
                            // $cekaksesallmenu = false;
                        @endphp
                        <button id="" class="btn bg-slate nav-link" style="width: 100%; font-size: 16px">
                            <input type="checkbox" class="form-check-input-switchery aksesallmenu" {{$cekaksesallmenu}} value="1" data-role="{{$selectedRole}}" data-group_modul_id="{{$group_modul->id}}">
                            <span class="font-weight-bold ml-1 text-underline"><u>{{$group_modul->group_modul}}</u></span>
                        </button>
                        <ul class="nav nav-group-sub">
                            <div class="card p-3">
                                <div class="row">
                                    @if(array_key_exists($group_modul->id, $moduls))
                                    @foreach ($moduls[$group_modul->id] as $modul)
                                        @php
                                            // $cekakses = cekaksesrole($akses, $modul, $selectedRole, $group_modul->id);
                                        $cekakses = cekaksesuser($akses, $modul, $selectedUser, $group_modul->id);
                                        @endphp
                                        <div class="col-md-6">
                                            <input type="checkbox" class="form-check-input-switchery aksesrole allrole{{$selectedUser}}" {{$cekakses}} value="1" data-role="{{$selectedRole}}" data-modul_id="{{$modul['id']}}" data-group_modul_id="{{$group_modul->id}}">
                                            <span class="cool-modul-name">{{$modul['modul']}}</span>
                                        </div>
                                    @endforeach
                                    @endif
                                </div>
                            </div>
                        </ul>
                    </li>
                </ul>
                @endforeach

            </div>
        </div>
        <!-- /hover rows -->

	</div>
	<!-- /content area -->

    <!-- Danger modal -->
	<div id="modal_theme_danger" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-danger" align="center">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="" method="post" id="delform">
				    @csrf
				    @method('DELETE')
					<div class="modal-body" align="center">
						<h2> Apakah anda yakin untuk menghapus data ini? </h2>
					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link" data-dismiss="modal">Cancel</button>
						<button type="submit" class="btn bg-danger">Delete</button>
					</div>
				</form>
			</div>
		</div>
	</div>
	<!-- /default modal -->

@endsection

@section('js')
	<!-- Theme JS files -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/iCheck/1.0.3/icheck.min.js"></script>
	<script src="{{asset('global_assets/js/plugins/forms/styling/uniform.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/notifications/pnotify.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/notifications/bootbox.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/tables/datatables/datatables.min.js')}}"></script>
	<script src="{{asset('global_assets/datatableasset/fixedColumns.min.js')}}"></script>

	<script src="{{asset('global_assets/js/plugins/forms/selects/select2.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/buttons/spin.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/buttons/ladda.min.js')}}"></script>

	<script src="{{asset('global_assets/js/demo_pages/form_checkboxes_radios.js')}}"></script>

	<script src="{{asset('assets/js/app.js')}}"></script>

	<script>
        $(document).ready(function () {
            $('input[type="checkbox"]').iCheck({
                checkboxClass: 'icheckbox_flat-green',
                radioClass: 'iradio_flat-green'
            });
        });
        $(document).on('change', '.aksesallmenu', function() {
			var check = $(this).is(':checked')?1:0
			var role = $('#filter_status').val(); // Get the selected role
            var group_modul = $(this).data('group_modul_id'); // Add group_modul_id

			$.ajax({
				type: 'GET',
				url: `{{url('updateroleallakses')}}/${check}/${role}/${group_modul}`,

				success: function (data) {
					console.log(data)
					new PNotify({
						title: 'Success',
						text: 'Akses Role terupdate.',
						icon: 'icon-checkmark3',
						type: 'success'
					});
					setTimeout(function(){
						var newWidget = $(data);
						$('#widget-container').replaceWith(newWidget);
					},1000);
					location.reload();
				}
			})
		})


        $(document).on('change', '.aksesrole', function () {
            var check = $(this).is(':checked') ? 1 : 0;
            var role = $('#filter_status').val(); // Get the selected role
            var modul = $(this).data('modul_id');
            var group_modul = $(this).data('group_modul_id');

            console.log("check = " + check, "role = " + role, "modul = " + modul, "group_modul = " + group_modul);
            $.ajax({
                type: 'GET',
                url: `{{ url('updaterole') }}/${check}/${role}/${modul}/${group_modul}`,
                success: function (data) {
                    console.log(data);
                    new PNotify({
                        title: 'Success',
                        text: 'Akses Role terupdate.',
                        icon: 'icon-checkmark3',
                        type: 'success',
                        delay: 700
                    });
                }
            });
        });


		//modal delete
		$(document).on("click", ".delbutton", function () {
		     var url = $(this).data('uri');
		     $("#delform").attr("action", url);
		});

	</script>

	<script type="text/javascript">
		$( document ).ready(function() {
			// Basic datatable
			$('.datatable-basic').DataTable({
					fixedColumns: {
						left: 1,
						// right: 1
					},
					headerCallback: function(thead, data, start, end, display) {
					$(thead)
						.find('th')
						.css({
							'background-color': '#607D8B',
							'color': '#FFFFFF'
						}); // Set your desired background color
					},
					paging: false,
					scrollX: true,
					scrollCollapse: true,
					scrollY: '500px',
					ordering: false,
				});


	        // Default style
	        @if(session('error'))
	            new PNotify({
	                title: 'Error',
	                text: '{{ session('error') }}.',
	                icon: 'icon-blocked',
	                type: 'error'
	            });
            @endif
            @if ( session('success'))
	            new PNotify({
	                title: 'Success',
	                text: '{{ session('success') }}.',
	                icon: 'icon-checkmark3',
	                type: 'success'
	            });
            @endif

		});
	</script>

    <script>
        function refreshPage() {
            var selectedRole = $('#filter_status').val();
            window.location.href = '{{ url("roles-menu-index") }}?role=' + selectedRole;
        }
    </script>

@endsection