Dynamic side menu bar

how to create dynamic side menu bar with user and admin role changes with different menus?

this has nothing to do with Framework 7.

But you can send the menu from the backend, depending if its admin or not.
eg:

// backend
if (user.isAdmin) {
 return getAdminModules(user.id)
} else {
  return getUserModules(user.id)
}

// front

let content = ''
menuModules.forEach(m => {
  content += `<span>${m.text}</span>`
})
// append content to menu

Is just the prototype of one way to do it. you should write your own logic, depending on your needs.
good luck

I usually use body classes to hide or display elements, based on e.g. user role, login/logout status:

<body class="is_login is_admin">

Then the css is defined something like:

.for_login { display:none; }
body.is_login .for_login { display: block; }

And elements with special meanings work like this:

<a class="for_login">Logout</a>

I usually do this with menu items, but have used it for whole views as well. For example to display login view when not logged in.

First of all thanks for your replay @pvtallulah @Tim

.

This is my problem. In index page in included side pane (Menu). I already done menu bar active after login using this.

if(sessionStorage.length > 0) {
app.params.panel.leftBreakpoint = 768;
app.panel.left.initBreakpoints();
}

but one problem. you can see that in above image. After login when i reload the page menu appears first after that full view comes because i put menu in index page. Is there any solution?