You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
76 lines
1.9 KiB
76 lines
1.9 KiB
import { Component } from '../../lib/vues6/vues6.js'
|
|
import { event_bus } from '../service/EventBus.service.js'
|
|
import { action_service } from '../service/Action.service.js'
|
|
|
|
const template = `
|
|
<div class="bg-light border-right coreid-sidebar-wrapper" id="sidebar-wrapper" v-bind:class="{ collapsed: isCollapsed }">
|
|
<div class="sidebar-heading">{{ app_name }}</div>
|
|
<div class="list-group list-group-flush">
|
|
<a
|
|
href="#"
|
|
@click="perform(action)"
|
|
class="list-group-item list-group-item-action bg-light"
|
|
v-for="action in actions"
|
|
>{{ action.text }}</a>
|
|
</div>
|
|
</div>
|
|
`
|
|
|
|
// TODO figure out why this doesn't show up in mobile layouts
|
|
|
|
export default class SideBarComponent extends Component {
|
|
static get selector() { return 'coreid-sidebar' }
|
|
static get props() { return ['app_name'] }
|
|
static get template() { return template }
|
|
|
|
actions = [
|
|
{
|
|
text: 'Profile',
|
|
action: 'redirect',
|
|
next: '/dash/profile',
|
|
},
|
|
{
|
|
text: 'Users',
|
|
action: 'redirect',
|
|
next: '/dash/users',
|
|
},
|
|
{
|
|
text: 'Groups',
|
|
action: 'redirect',
|
|
next: '/dash/groups',
|
|
},
|
|
{
|
|
text: 'LDAP Clients',
|
|
action: 'redirect',
|
|
next: '/dash/ldap/clients',
|
|
},
|
|
{
|
|
text: 'SAML Service Providers',
|
|
action: 'redirect',
|
|
next: '/dash/saml/service-providers',
|
|
},
|
|
{
|
|
text: 'Settings',
|
|
action: 'redirect',
|
|
next: '/dash/settings',
|
|
},
|
|
]
|
|
|
|
constructor() {
|
|
super()
|
|
event_bus.event('sidebar.toggle').subscribe(() => {
|
|
this.toggle()
|
|
})
|
|
}
|
|
|
|
isCollapsed = false
|
|
|
|
toggle() {
|
|
this.isCollapsed = !this.isCollapsed
|
|
}
|
|
|
|
perform(action) {
|
|
return action_service.perform({delay: 0, ...action})
|
|
}
|
|
}
|