Sonntagsarbeiten #30
15
src/App.vue
15
src/App.vue
@ -12,8 +12,8 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
<Footer />
|
||||
</template>
|
||||
<script>
|
||||
import Footer from '@/views/partials/Footer.vue'
|
||||
import Navbar from '@/views/partials/Navbar.vue'
|
||||
import Footer from '@/components/Footer.vue'
|
||||
import Navbar from '@/components/Navbar.vue'
|
||||
|
||||
export default {
|
||||
name: "App",
|
||||
@ -23,9 +23,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showMobileNavbar: false,
|
||||
memberId: null,
|
||||
searchText: "",
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@ -34,14 +32,5 @@ export default {
|
||||
updated() {
|
||||
this.memberId = localStorage.getItem("user_id");
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
localStorage.clear();
|
||||
this.$router.push({ path: "/" });
|
||||
},
|
||||
searchRedirect() {
|
||||
this.$router.push({ path: `/s/search?text`, query: { query: this.searchText } } );
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
@ -5,15 +5,20 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
-->
|
||||
|
||||
<template>
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-white">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="#">KI</a>
|
||||
<router-link
|
||||
class="navbar-brand"
|
||||
:to="{ path:'/s/search' }"
|
||||
>
|
||||
<img class="wtf-logo wtf-logo--navbar" src="@/assets/img/wtf_logo.svg">
|
||||
<span class="d-none d-sm-inline">Kompetenzinventar</span>
|
||||
<span class="d-sm-none">KI</span>
|
||||
</router-link>
|
||||
<button
|
||||
@click="showMobileNavbar = !showMobileNavbar"
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
@ -22,9 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
</button>
|
||||
<div
|
||||
class="collapse navbar-collapse"
|
||||
:class="{
|
||||
show: showMobileNavbar,
|
||||
}"
|
||||
:class="{ show: showMobileNavbar }"
|
||||
id="navbarSupportedContent"
|
||||
>
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||
@ -39,7 +42,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
<li class="nav-item">
|
||||
<router-link
|
||||
class="nav-link"
|
||||
:to="{ path: `/s/profile/${memberId}` }"
|
||||
:to="{ path: `/s/profile/${$root.memberId}` }"
|
||||
active-class="active"
|
||||
>Mein Profil</router-link
|
||||
>
|
||||
@ -56,7 +59,6 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
<button class="btn btn-outline-danger" @click="logout()">
|
||||
Logout
|
||||
</button>
|
||||
<a class="nav-link active" aria-current="page" href="#"></a>
|
||||
</li>
|
||||
</ul>
|
||||
<form class="d-flex" @submit.prevent="searchRedirect()">
|
||||
@ -81,3 +83,39 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import RequestMixin from "@/mixins/request.mixin"
|
||||
|
||||
export default {
|
||||
name: "Navbar",
|
||||
mixins: [RequestMixin],
|
||||
data() {
|
||||
return {
|
||||
showMobileNavbar: false,
|
||||
searchText: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
localStorage.clear();
|
||||
this.$router.push({ path: "/" });
|
||||
},
|
||||
searchRedirect() {
|
||||
this.$router.push({ path: `/s/search?text`, query: { query: this.searchText } } );
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
.wtf-logo--navbar {
|
||||
height: 40px;
|
||||
margin-bottom: -5px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
</style>
|
Loading…
Reference in New Issue
Block a user