re orginising the edit role view

Resources/views/admin/roles/edit.blade.php

@@ -12,14 +12,21 @@
 @stop
 
 @section('styles')
-<link href="{{{ core_asset('css/vendor/iCheck/flat/red.css') }}}" rel="stylesheet" type="text/css" />
+<link href="{{{ core_asset('css/vendor/iCheck/flat/blue.css') }}}" rel="stylesheet" type="text/css" />
 @stop
 
 @section('content')
 <div class="row">
     <div class="col-md-12">
-        <div class="box box-<?php echo $errors->first() ? 'danger' : 'info'; ?>">
         {!! Form::open(['route' => ['dashboard.role.update', $role->id], 'method' => 'put']) !!}
+        <div class="nav-tabs-custom">
+            <ul class="nav nav-tabs">
+                <li class="active"><a href="#tab_1-1" data-toggle="tab">Data</a></li>
+                <li class=""><a href="#tab_2-2" data-toggle="tab">Permissions</a></li>
+                <li class=""><a href="#tab_3-3" data-toggle="tab">Users</a></li>
+            </ul>
+            <div class="tab-content">
+                <div class="tab-pane active" id="tab_1-1">
                     <div class="box-body">
                         <div class="row">
                             @include('flash::message')
@@ -40,28 +47,20 @@
                                 </div>
                             </div>
                         </div>
-                <div class="row">
-                    <div class="col-md-6">
-                        <h3>Users with this role</h3>
-                        <ul>
-                            <?php foreach($role->users()->get() as $user): ?>
-                                <li>
-                                    <a href="{{ URL::route('dashboard.user.edit', [$user->id]) }}">{{ $user->present()->fullname() }}</a>
-                                </li>
-                            <?php endforeach; ?>
-                        </ul>
-                    </div>
                     </div>
+                </div><!-- /.tab-pane -->
+                <div class="tab-pane" id="tab_2-2">
+                    <div class="box-body">
                         <div class="row">
-                    <div class="col-md-6">
+                            <div class="col-md-12">
                                 <?php foreach($permissions as $name => $value): ?>
                                     <h3>{{ $name }} Module</h3>
-                            <?php foreach($value as $subRoleTitle => $roleName): ?>
-                                <h4>{{ $subRoleTitle }}</h4>
-                                <?php foreach($roleName as $rolePerm): ?>
+                                    <?php foreach($value as $subPermissionTitle => $permissionName): ?>
+                                        <h4>{{ ucfirst($subPermissionTitle) }}</h4>
+                                        <?php foreach($permissionName as $permissionAction): ?>
                                             <div class="checkbox">
-                                        <label for="<?php echo "$subRoleTitle.$rolePerm" ?>">
-                                            <input id="<?php echo "$subRoleTitle.$rolePerm" ?>" name="permissions[<?php echo "$subRoleTitle.$rolePerm" ?>]" type="checkbox" class="flat-red" <?php echo $role->hasAccess("$subRoleTitle.$rolePerm") ? 'checked' : '' ?> value="true" /> {{ $rolePerm }}
+                                                <label for="<?php echo "$subPermissionTitle.$permissionAction" ?>">
+                                                    <input id="<?php echo "$subPermissionTitle.$permissionAction" ?>" name="permissions[<?php echo "$subPermissionTitle.$permissionAction" ?>]" type="checkbox" class="flat-blue" <?php echo $role->hasAccess("$subPermissionTitle.$permissionAction") ? 'checked' : '' ?> value="true" /> {{ ucfirst($permissionAction) }}
                                                 </label>
                                             </div>
                                         <?php endforeach; ?>
@@ -70,23 +69,40 @@
                             </div>
                         </div>
                     </div>
-            <div class="box-footer">
+                </div><!-- /.tab-pane -->
+                <div class="tab-pane" id="tab_3-3">
+                    <div class="box-body">
+                        <div class="row">
+                            <div class="col-md-12">
+                                <h3>Users with this role</h3>
+                                <ul>
+                                    <?php foreach($role->users()->get() as $user): ?>
+                                        <li>
+                                            <a href="{{ URL::route('dashboard.user.edit', [$user->id]) }}">{{ $user->present()->fullname() }}</a>
+                                        </li>
+                                    <?php endforeach; ?>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
                 <button type="submit" class="btn btn-primary btn-flat">Update</button>
                 <a class="btn btn-danger pull-right btn-flat" href="{{ URL::route('dashboard.role.index')}}"><i class="fa fa-times"></i> Cancel</a>
+                <div class="clearfix"></div>
+            </div><!-- /.tab-content -->
         </div>
         {!! Form::close() !!}
     </div>
-    </div>
 </div>
 @stop
 
 @section('scripts')
 <script>
 $( document ).ready(function() {
-    //Flat red color scheme for iCheck
-    $('input[type="checkbox"].flat-red, input[type="radio"].flat-red').iCheck({
-        checkboxClass: 'icheckbox_flat-red',
-        radioClass: 'iradio_flat-red'
+    $('input[type="checkbox"].flat-blue, input[type="radio"].flat-blue').iCheck({
+        checkboxClass: 'icheckbox_flat-blue',
+        radioClass: 'iradio_flat-blue'
     });
 });
 </script>