Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
scc-net
netvs
netvs-core
Commits
c3eae7b0
Commit
c3eae7b0
authored
Apr 01, 2020
by
gj4210
👁
Browse files
UPD: Refactored navbar into it's own component
parent
1d0011ff
Changes
2
Hide whitespace changes
Inline
Side-by-side
frontend/src/App.vue
View file @
c3eae7b0
<
template
>
<div
id=
"app"
>
<b-navbar
toggleable=
"lg"
fixed=
"top"
:type=
"$sysinfo.host_oper_mode.is_prod?'light':'dark'"
:variant=
"$sysinfo.host_oper_mode.is_prod?'light':'dark'"
:class=
"`bg-$
{$sysinfo.host_oper_mode.mode}`">
<!-- Brand and toggle get grouped for better mobile display -->
<b-navbar-brand
to=
"/"
>
<img
class=
"d-inline-block align-top scc-img"
alt=
"SCC"
src=
"@/assets/img/scc_logo_small.png"
/>
<span
v-if=
"!$sysinfo.host_oper_mode.is_prod"
>
Instanz:
{{
$sysinfo
.
host_oper_mode
.
mode
}}
</span>
</b-navbar-brand>
<b-navbar-toggle
target=
"navbarNavDropdown"
>
<font-awesome-icon
icon=
"bars"
></font-awesome-icon>
</b-navbar-toggle>
<!-- Collect the nav links, forms, and other content for toggling -->
<b-collapse
is-nav
id=
"navbarNavDropdown"
>
<b-navbar-nav>
<b-nav-item
v-if=
"$sysinfo_mods_by_name['dnsvs']"
to=
"/dnsvs/"
:active=
"$route.path.startsWith('/dnsvs/')"
>
DNSVS
</b-nav-item>
<b-nav-item
v-if=
"$sysinfo_mods_by_name['dhcp_leases']"
to=
"/dhcp-leases/"
:active=
"$route.path.startsWith('/dhcp-leases/')"
>
DHCP-Leases
</b-nav-item>
<b-nav-item
href=
"https://www-net.scc.kit.edu/~netadmin/natvs/user/wrapper.cgi/"
target=
"_blank"
>
NATVS+
</b-nav-item>
<b-nav-item
href=
"https://www-net.scc.kit.edu/~netadmin/netdoc/user/wrapper.cgi/"
target=
"_blank"
>
NETDOC
</b-nav-item>
</b-navbar-nav>
<b-navbar-nav
class=
"ml-auto"
>
<b-nav-form>
<div
class=
"input-group mr-sm-2"
>
<div
id=
"scope_filter_display"
class=
"input-group-prepend"
>
<span
class=
"input-group-text"
>
DNSVS
</span>
</div>
<input
class=
"form-control"
type=
"search"
id=
"nav-search"
name=
"search"
placeholder=
"Suchbegriff"
aria-label=
"Search"
>
<div
class=
"input-group-append"
>
<button
class=
"btn btn-outline-success my-2 my-sm-0"
type=
"submit"
>
Suchen
</button>
</div>
</div>
</b-nav-form>
<b-nav-item><span
class=
"d-none d-xl-inline"
>
Erweiterte
</span>
Suche
</b-nav-item>
<b-nav-item>
<i
class=
"fas fa-tasks"
aria-hidden=
"true"
></i>
Transaktion
<span
class=
"badge badge-pill badge-success"
id=
"trans_count"
>
0
</span>
</b-nav-item>
<b-nav-item-dropdown
v-if=
"$store.state.user"
right
:toggle-class=
"$route.path.startsWith('/user/')?'active':''"
>
<template
slot=
"button-content"
>
<font-awesome-icon
:icon=
"['far', 'user']"
></font-awesome-icon>
<span
v-if=
"$store.state.user"
>
{{
$store
.
state
.
user
.
login_name
}}
</span>
</
template
>
<
template
v-if=
"$store.state.user"
>
<b-dropdown-item
to=
"/user/tokens"
:active=
"$route.path === '/user/tokens'"
><font-awesome-icon
icon=
"code"
></font-awesome-icon>
API-Tokens
</b-dropdown-item>
<b-dropdown-divider></b-dropdown-divider>
<b-dropdown-item
@
click=
"logout()"
>
Abmelden
</b-dropdown-item>
</
template
>
</b-nav-item-dropdown>
<b-nav-item
v-else
>
<font-awesome-icon
:icon=
"['far', 'user']"
></font-awesome-icon>
<span>
Anmelden
</span>
</b-nav-item>
</b-navbar-nav>
</b-collapse>
<!-- /.navbar-collapse -->
</b-navbar>
<Navbar/>
<div
id=
"wrapper"
>
<div
id=
"page-content-wrapper"
>
<div
class=
"container"
>
...
...
@@ -100,8 +44,10 @@
<
script
>
import
LoginService
from
'
@/api-services/login.service
'
import
Navbar
from
"
./components/Navbar
"
;
export
default
{
components
:
{
Navbar
},
data
()
{
return
{
breadcrumbs
:
[],
...
...
frontend/src/components/Navbar.vue
0 → 100644
View file @
c3eae7b0
<
template
>
<b-navbar
toggleable=
"lg"
fixed=
"top"
:type=
"$sysinfo.host_oper_mode.is_prod?'light':'dark'"
:variant=
"$sysinfo.host_oper_mode.is_prod?'light':'dark'"
:class=
"`bg-$
{$sysinfo.host_oper_mode.mode}`">
<!-- Brand and toggle get grouped for better mobile display -->
<b-navbar-brand
to=
"/"
>
<img
class=
"d-inline-block align-top scc-img"
alt=
"SCC"
src=
"@/assets/img/scc_logo_small.png"
/>
<span
v-if=
"!$sysinfo.host_oper_mode.is_prod"
>
Instanz:
{{
$sysinfo
.
host_oper_mode
.
mode
}}
</span>
</b-navbar-brand>
<b-navbar-toggle
target=
"navbarNavDropdown"
>
<font-awesome-icon
icon=
"bars"
></font-awesome-icon>
</b-navbar-toggle>
<!-- Collect the nav links, forms, and other content for toggling -->
<b-collapse
is-nav
id=
"navbarNavDropdown"
>
<b-navbar-nav>
<b-nav-item
v-if=
"$sysinfo_mods_by_name['dnsvs']"
to=
"/dnsvs/"
:active=
"$route.path.startsWith('/dnsvs/')"
>
DNSVS
</b-nav-item>
<b-nav-item
v-if=
"$sysinfo_mods_by_name['dhcp_leases']"
to=
"/dhcp-leases/"
:active=
"$route.path.startsWith('/dhcp-leases/')"
>
DHCP-Leases
</b-nav-item>
<b-nav-item
href=
"https://www-net.scc.kit.edu/~netadmin/natvs/user/wrapper.cgi/"
target=
"_blank"
>
NATVS+
</b-nav-item>
<b-nav-item
href=
"https://www-net.scc.kit.edu/~netadmin/netdoc/user/wrapper.cgi/"
target=
"_blank"
>
NETDOC
</b-nav-item>
</b-navbar-nav>
<b-navbar-nav
class=
"ml-auto"
>
<b-nav-form>
<div
class=
"input-group mr-sm-2"
>
<div
id=
"scope_filter_display"
class=
"input-group-prepend"
>
<span
class=
"input-group-text"
>
DNSVS
</span>
</div>
<input
class=
"form-control"
type=
"search"
id=
"nav-search"
name=
"search"
placeholder=
"Suchbegriff"
aria-label=
"Search"
>
<div
class=
"input-group-append"
>
<button
class=
"btn btn-outline-success my-2 my-sm-0"
type=
"submit"
>
Suchen
</button>
</div>
</div>
</b-nav-form>
<b-nav-item><span
class=
"d-none d-xl-inline"
>
Erweiterte
</span>
Suche
</b-nav-item>
<b-nav-item>
<i
class=
"fas fa-tasks"
aria-hidden=
"true"
></i>
Transaktion
<span
class=
"badge badge-pill badge-success"
id=
"trans_count"
>
0
</span>
</b-nav-item>
<b-nav-item-dropdown
v-if=
"$store.state.user"
right
:toggle-class=
"$route.path.startsWith('/user/')?'active':''"
>
<template
slot=
"button-content"
>
<font-awesome-icon
:icon=
"['far', 'user']"
></font-awesome-icon>
<span
v-if=
"$store.state.user"
>
{{
$store
.
state
.
user
.
login_name
}}
</span>
</
template
>
<
template
v-if=
"$store.state.user"
>
<b-dropdown-item
to=
"/user/tokens"
:active=
"$route.path === '/user/tokens'"
><font-awesome-icon
icon=
"code"
></font-awesome-icon>
API-Tokens
</b-dropdown-item>
<b-dropdown-divider></b-dropdown-divider>
<b-dropdown-item
@
click=
"logout()"
>
Abmelden
</b-dropdown-item>
</
template
>
</b-nav-item-dropdown>
<b-nav-item
v-else
>
<font-awesome-icon
:icon=
"['far', 'user']"
></font-awesome-icon>
<span>
Anmelden
</span>
</b-nav-item>
</b-navbar-nav>
</b-collapse>
<!-- /.navbar-collapse -->
</b-navbar>
</template>
<
script
>
export
default
{
name
:
"
Navbar
"
}
</
script
>
<
style
scoped
>
</
style
>
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment