@extends('admin.layout.index')
@section('title', 'Muftaax | Roles Management')
@section('custom-style')
    <style>

    </style>
@endsection
@section('content')

    <!-- Start::app-content -->
    <div class="main-content app-content">
        <div class="container-fluid">

            <!-- Page Header -->
            <div class="my-4 page-header-breadcrumb d-flex align-items-center justify-content-between flex-wrap gap-2">
                <div>
                    <h1 class="page-title fw-medium fs-18 mb-2">Roles Management</h1>
                    <div class="">
                        <nav>
                            <ol class="breadcrumb mb-0">
                                <li class="breadcrumb-item"><a href="javascript:void(0);">Roles Management</a></li>
                                <li class="breadcrumb-item active" aria-current="page">Create Role</li>
                            </ol>
                        </nav>
                    </div>
                </div>

            </div>

            <!-- Start::row-1 -->
            <div class="row">
                <div class="col-sm-12">
                    <div class="card custom-card">
                        <div class="card-header">
                            <div class="card-title">New Role</div>
                        </div>
                        <div class="card-body">
                            <form id="role-form" method="POST" action="{{ route('storeRole') }}">
                                @csrf
                                <div class="row">
                                    <div class="col-sm-6">
                                        <div class="form-group mb-2">
                                            <label for="role-title" class="form-label">Role Title</label>
                                            <input type="text" class="form-control" name="name" id="role-title"
                                                placeholder="Role Title">
                                        </div>
                                    </div>
                                    {{-- <div class="col-sm-6">
										<div class="form-group mb-3">
											<label class="form-label">Status</label>
											<select class="form-control" name="status" required>
												<option>-- Select --</option>
												<option value="Enable">Enable</option>
												<option value="Disable">Disable</option>
											</select>
										</div>
									</div> --}}
                                </div>


                                <h4 class="fs-16 mt-3 mb-3">Permissions</h4>

                                <div class="table-responsive">
                                    <table class="table text-nowrap table-bordered">
                                        <thead>
                                            <tr>
                                                <th scope="col">Modules</th>
                                                <th>View</th>
                                                <th scope="col">Add</th>
                                                <th scope="col">Edit</th>
                                                <th scope="col">Delete</th>
                                                <th scope="col">Block</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>Dashboard</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="view-dashboard"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Analytics</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="analytics"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Restaurant Category</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="restaurant-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-restaurant-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-restaurant-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-restaurant-category"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Ride Category</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="ride-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-ride-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-ride-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-ride-category"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Top Deals</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="top-deals-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-top-deals-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-top-deals-category"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-top-deals-category"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Sub Admins</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="admins"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-admins"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-admins"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-admins"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="block-admins"></td>
                                            </tr>
                                            <tr>
                                                <td>Roles</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="roles"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-roles"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-roles"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-roles"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Users</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="users"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="c disabledreate-users"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-users"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-users"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="block-users"></td>
                                            </tr>
                                            <tr>
                                                <td>Restaurants</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="restaurants"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-restaurants"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-restaurants"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="block-restaurants"></td>
                                            </tr>
                                            <tr>
                                                <td>Drivers</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="drivers"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="driver-verifications"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-drivers"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="block-drivers" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Rides</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="rides"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Banners</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="banners"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-banners"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-banners"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-banners"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Support</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="support"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="e disableddit-support"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-support"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>FAQ</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="faqs"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="create-faqs"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-faqs"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-faqs"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Feedback and Ratings</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="feedback-and-rating"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-feedback"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Issues Resolution</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="issue-resolutions"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="edit-resolutions"></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="delete-issue-resolutions"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                            <tr>
                                                <td>Contact Us</td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="contact-us"></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permissions[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                                <td><input type="checkbox" name="permission[]" id="staffPermissions"
                                                        value="" disabled></td>
                                            </tr>
                                        </tbody>
                                    </table>

                                    <button class="btn btn-dark mt-3" type="submit">Submit</button>

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


            </div>
            <!--End::row-1 -->

        </div>
    </div>
    <!-- End::app-content -->



@endsection
@section('custom-script')
    <script>
        $(document).ready(function() {
            $('#role-form').on('submit', function(e) {
                e.preventDefault();

                // Disable submit button
                $('button[type="submit"]').prop('disabled', true).text('Processing...');

                // Initialize Notyf
                var notyf = new Notyf();

                $.ajax({
                    type: 'POST',
                    url: '{{ route('storeRole') }}',
                    data: $(this).serialize(),
                    success: function(response) {
                        notyf.success(response.message);

                        setTimeout(function() {
                            window.location.href = '{{ route('roles') }}';
                        }, 3000); // Redirect after 3 seconds
                    },
                    error: function(response) {
                        notyf.error('Error: ' + response.responseJSON.message);
                        // Re-enable submit button
                        $('button[type="submit"]').prop('disabled', false).text('Submit');
                    }
                });
            });
        });
    </script>
@endsection