Skip to content

Commit 6bedba6

Browse files
committed
Editable menu
1 parent 7ed79cf commit 6bedba6

File tree

13 files changed

+431
-85
lines changed

13 files changed

+431
-85
lines changed

coreui/src/containers/TheHeader.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
<CHeaderNavItem class="px-3" to="/dashboard">Dashboard</CHeaderNavItem>
1717
<CHeaderNavItem class="px-3" to="/notes" exact>Notes</CHeaderNavItem>
1818
<CHeaderNavItem class="px-3" to="/users" exact>Users</CHeaderNavItem>
19-
<CHeaderNavItem class="px-3">Settings</CHeaderNavItem>
19+
<CHeaderNavItem class="px-3" to="/menu" exact>Menu</CHeaderNavItem>
2020
</CHeaderNav>
2121
<CHeaderNav class="mr-4">
2222
<CHeaderNavItem class="d-md-down-none mx-2">

coreui/src/router/index.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,8 @@ const Note = () => import('@/views/notes/Note')
6464
const EditNote = () => import('@/views/notes/EditNote')
6565
const CreateNote = () => import('@/views/notes/CreateNote')
6666

67+
const EditMenu = () => import('@/views/menu/EditMenu')
68+
6769
Vue.use(Router)
6870

6971
export default new Router({
@@ -81,6 +83,11 @@ function configRoutes () {
8183
name: 'Home',
8284
component: TheContainer,
8385
children: [
86+
{
87+
path: '/menu',
88+
name: 'Edit Menu',
89+
component: EditMenu
90+
},
8491
{
8592
path: 'dashboard',
8693
name: 'Dashboard',

coreui/src/views/menu/EditMenu.vue

Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
<template>
2+
<CRow>
3+
<CCol cols="12" xl="6">
4+
<transition name="slide">
5+
<CCard>
6+
<CCardBody>
7+
<div v-if="!isRoleSelected">
8+
<CSelect
9+
:value.sync="roleSelected"
10+
:options="roles"
11+
label="Select role assigned to menu"
12+
/>
13+
<CButton color="primary" @click="selectRole()">Edit</CButton>
14+
</div>
15+
<div v-else>
16+
<CTable
17+
hover
18+
:items="tableData"
19+
:fields="fields"
20+
>
21+
<template #assigned="{item}">
22+
<td v-if="item.assigned">
23+
<CButton color="primary" @click="toggleElement( item.id )">Hide</CButton>
24+
</td>
25+
<td v-else>
26+
<CButton color="danger" @click="toggleElement( item.id )">Show</CButton>
27+
</td>
28+
</template>
29+
<template #dropdown="{item}">
30+
<td>
31+
<i v-if="item.dropdown" class="cui-chevron-right icons font-2xl d-block"></i>
32+
</td>
33+
</template>
34+
</CTable>
35+
</div>
36+
</CCardBody>
37+
</CCard>
38+
</transition>
39+
</CCol>
40+
</CRow>
41+
</template>
42+
43+
<script>
44+
import axios from 'axios'
45+
export default {
46+
name: 'TheSidebar',
47+
data () {
48+
return {
49+
isRoleSelected: false,
50+
roleSelected: 'guest',
51+
roles: [],
52+
buffor: [],
53+
tableData: [],
54+
fields: ['assigned', 'dropdown', 'slug', 'name'],
55+
thisMenuRole: null,
56+
}
57+
},
58+
methods: {
59+
addElementToBuffor(data, icon){
60+
this.buffor.push(
61+
{
62+
dropdown: icon,
63+
name: data['name'],
64+
id: data['id'],
65+
slug: data['slug'],
66+
assigned: data['assigned'],
67+
}
68+
);
69+
},
70+
innerBuildArrayData(data, deep){
71+
for(let i=0; i<data.length; i++){
72+
switch(data[i]['slug']){
73+
case 'link':
74+
if(deep > 1){
75+
this.addElementToBuffor(data[i], true);
76+
}else{
77+
this.addElementToBuffor(data[i], false);
78+
}
79+
break
80+
case 'title':
81+
this.addElementToBuffor(data[i], false);
82+
break;
83+
case 'dropdown':
84+
this.addElementToBuffor(data[i], false);
85+
this.innerBuildArrayData(data[i]['elements'], deep+1)
86+
break;
87+
}
88+
}
89+
},
90+
buildArrayData(data){
91+
this.buffor = [];
92+
this.innerBuildArrayData(data, 1);
93+
return this.buffor;
94+
},
95+
selectRole(){
96+
let self = this;
97+
console.log(this.roleSelected);
98+
axios.get('/api/menu/edit/selected?token=' + localStorage.getItem("api_token") + '&role=' + this.roleSelected )
99+
.then(function (response) {
100+
self.tableData = self.buildArrayData(response.data.menuToEdit);
101+
self.thisMenuRole = response.data.role;
102+
self.isRoleSelected = true;
103+
}).catch(function (error) {
104+
console.log(error);
105+
self.$router.push({ path: '/login' });
106+
});
107+
},
108+
toggleElement(id){
109+
let self = this;
110+
axios.get('/api/menu/edit/selected/switch?token=' + localStorage.getItem("api_token") + '&role=' + this.thisMenuRole + '&id=' + id )
111+
.then(function (response) {
112+
self.selectRole();
113+
}).catch(function (error) {
114+
console.log(error);
115+
self.$router.push({ path: '/login' });
116+
});
117+
}
118+
},
119+
mounted () {
120+
this.$root.$on('toggle-sidebar', () => this.show = !this.show)
121+
let self = this;
122+
axios.get('/api/menu/edit?token=' + localStorage.getItem("api_token") )
123+
.then(function (response) {
124+
self.roles = response.data.roles;
125+
}).catch(function (error) {
126+
console.log(error);
127+
self.$router.push({ path: '/login' });
128+
});
129+
}
130+
}
131+
</script>
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
<?php
2+
3+
namespace App\Http\Controllers;
4+
5+
use Illuminate\Http\Request;
6+
use App\Services\EditMenuViewService;
7+
use App\Menurole;
8+
9+
class MenuEditController extends Controller
10+
{
11+
/**
12+
* Create a new controller instance.
13+
*
14+
* @return void
15+
*/
16+
public function __construct()
17+
{
18+
$this->middleware('auth');
19+
$this->middleware('admin');
20+
}
21+
22+
/**
23+
* Display a listing of roles.
24+
*
25+
* @return \Illuminate\Http\Response
26+
*/
27+
public function index()
28+
{
29+
$roles = explode(',', env("APP_ROLES", 'guest,user,admin'));
30+
return response()->json( array('roles' => $roles) );
31+
}
32+
33+
public function menuSelected(Request $request){
34+
$sidebar = new EditMenuViewService();
35+
return response()->json( array(
36+
'role' => $request->input('role'),
37+
'menuToEdit' => $sidebar->getDataForView($request->input('role')),
38+
) );
39+
}
40+
41+
public function switch(Request $request){
42+
$menuRole = Menurole::where('role_name', '=', $request->input('role'))
43+
->where('menus_id', '=', $request->input('id'))
44+
->first();
45+
if($menuRole){
46+
$menuRole->delete();
47+
}else{
48+
$menuRole = new Menurole();
49+
$menuRole->role_name = $request->input('role');
50+
$menuRole->menus_id = $request->input('id');
51+
$menuRole->save();
52+
}
53+
return response()->json( array('success' => true) );
54+
}
55+
}

laravel/app/Http/Menus/GetSidebarMenu.php

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,11 @@ public function __construct(){
2020
}
2121

2222
private function getMenuFromDB($menuId, $menuName){
23-
$this->menu = Menus::where('menu_id', '=', $menuId)->where('menu_name', '=', $menuName)->orderBy('sequence', 'asc')->get();
23+
$this->menu = Menus::join('menu_role', 'menus.id', '=', 'menu_role.menus_id')
24+
->select('menus.*')
25+
->where('menus.menu_id', '=', $menuId)
26+
->where('menu_role.role_name', '=', $menuName)
27+
->orderBy('menus.sequence', 'asc')->get();
2428
}
2529

2630
private function getGuestMenu(){
@@ -31,10 +35,16 @@ private function getUserMenu(){
3135
$this->getMenuFromDB(1, 'user');
3236
}
3337

38+
private function getAdminMenu(){
39+
$this->getMenuFromDB(1, 'admin');
40+
}
41+
3442
public function get($roles){
3543
$roles = explode(',', $roles);
3644
if(empty($roles)){
3745
$this->getGuestMenu();
46+
}elseif(in_array('admin', $roles)){
47+
$this->getAdminMenu();
3848
}elseif(in_array('user', $roles)){
3949
$this->getUserMenu();
4050
}else{
@@ -44,4 +54,11 @@ public function get($roles){
4454
return $rfd->render($this->menu);
4555
}
4656

47-
}
57+
public function getAll(){
58+
$this->menu = Menus::select('menus.*')
59+
->where('menus.menu_id', '=', 1)
60+
->orderBy('menus.sequence', 'asc')->get();
61+
$rfd = new RenderFromDatabaseData;
62+
return $rfd->render($this->menu);
63+
}
64+
}

laravel/app/MenuBuilder/MenuBuilder.php

Lines changed: 21 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -38,10 +38,11 @@ private function addElementToMenuLastPosition($element, $offset = 0){
3838
return $this->innerAddElementToMenuLastPosition($this->menu, $element, $offset);
3939
}
4040

41-
private function addRegularLink($name, $href, $icon, $iconType){
41+
private function addRegularLink($id, $name, $href, $icon, $iconType){
4242
$hasIcon = $icon === false ? false : true;
4343
if($hasIcon){
4444
array_push($this->menu, array(
45+
'id' => $id,
4546
'slug' => 'link',
4647
'name' => $name,
4748
'href' => $href,
@@ -51,6 +52,7 @@ private function addRegularLink($name, $href, $icon, $iconType){
5152
));
5253
}else{
5354
array_push($this->menu, array(
55+
'id' => $id,
5456
'slug' => 'link',
5557
'name' => $name,
5658
'href' => $href,
@@ -59,11 +61,12 @@ private function addRegularLink($name, $href, $icon, $iconType){
5961
}
6062
}
6163

62-
private function addDropdownLink($name, $href, $icon, $iconType){
64+
private function addDropdownLink($id, $name, $href, $icon, $iconType){
6365
$num = count($this->menu);
6466
$hasIcon = $icon === false ? false : true;
6567
if($hasIcon){
6668
$this->addElementToMenuLastPosition(array(
69+
'id' => $id,
6770
'slug' => 'link',
6871
'name' => $name,
6972
'href' => $href,
@@ -73,6 +76,7 @@ private function addDropdownLink($name, $href, $icon, $iconType){
7376
));
7477
}else{
7578
$this->addElementToMenuLastPosition(array(
79+
'id' => $id,
7680
'slug' => 'link',
7781
'name' => $name,
7882
'href' => $href,
@@ -81,18 +85,19 @@ private function addDropdownLink($name, $href, $icon, $iconType){
8185
}
8286
}
8387

84-
public function addLink($name, $href, $icon = false, $iconType = 'coreui'){
88+
public function addLink($id, $name, $href, $icon = false, $iconType = 'coreui'){
8589
if($this->dropdown === true){
86-
$this->addDropdownLink($name, $href, $icon, $iconType);
90+
$this->addDropdownLink($id, $name, $href, $icon, $iconType);
8791
}else{
88-
$this->addRegularLink($name, $href, $icon, $iconType);
92+
$this->addRegularLink($id, $name, $href, $icon, $iconType);
8993
}
9094
}
9195

92-
public function addTitle($name, $icon = false, $iconType = 'coreui'){
96+
public function addTitle($id, $name, $icon = false, $iconType = 'coreui'){
9397
$hasIcon = $icon === false ? false : true;
9498
if($hasIcon){
9599
array_push($this->menu, array(
100+
'id' => $id,
96101
'slug' => 'title',
97102
'name' => $name,
98103
'hasIcon' => $hasIcon,
@@ -101,58 +106,60 @@ public function addTitle($name, $icon = false, $iconType = 'coreui'){
101106
));
102107
}else{
103108
array_push($this->menu, array(
109+
'id' => $id,
104110
'slug' => 'title',
105111
'name' => $name,
106112
'hasIcon' => $hasIcon
107113
));
108114
}
109115
}
110116

111-
public function beginDropdown($name, $href, $icon = false, $iconType = 'coreui'){
112-
//if($this->dropdown === true){
113-
// throw new Exception('Starting dropdown inside dropdown');
114-
//}
117+
public function beginDropdown($id, $href, $name, $icon = false, $iconType = 'coreui'){
115118
$this->dropdown = true;
116119
$this->dropdownDeep++;
117120
$hasIcon = $icon === false ? false : true;
118121
if($this->dropdownDeep === 1){
119122
if($hasIcon){
120123
array_push($this->menu, array(
124+
'id' => $id,
121125
'slug' => 'dropdown',
122126
'name' => $name,
123127
'hasIcon' => $hasIcon,
124128
'icon' => $icon,
125129
'iconType' => $iconType,
126130
'elements' => array(),
127-
'href' => $href,
131+
'href' => $href
128132
));
129133
}else{
130134
array_push($this->menu, array(
135+
'id' => $id,
131136
'slug' => 'dropdown',
132137
'name' => $name,
133138
'hasIcon' => $hasIcon,
134139
'elements' => array(),
135-
'href' => $href,
140+
'href' => $href
136141
));
137142
}
138143
}else{
139144
if($hasIcon){
140145
$this->addElementToMenuLastPosition(array(
146+
'id' => $id,
141147
'slug' => 'dropdown',
142148
'name' => $name,
143149
'hasIcon' => $hasIcon,
144150
'icon' => $icon,
145151
'iconType' => $iconType,
146152
'elements' => array(),
147-
'href' => $href,
153+
'href' => $href
148154
), 1);
149155
}else{
150156
$this->addElementToMenuLastPosition(array(
157+
'id' => $id,
151158
'slug' => 'dropdown',
152159
'name' => $name,
153160
'hasIcon' => $hasIcon,
154161
'elements' => array(),
155-
'href' => $href,
162+
'href' => $href
156163
), 1);
157164
}
158165
}

0 commit comments

Comments
 (0)