refactor: allow for tenants #163
1
.gitignore
vendored
1
.gitignore
vendored
@ -6,6 +6,7 @@ node_modules
|
||||
/public/config.js
|
||||
|
||||
# local env files
|
||||
.env
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
|
@ -56,6 +56,13 @@ cp public/config.js.dev public/config.js
|
||||
vi public/config.js
|
||||
```
|
||||
|
||||
### Umgebungsvariablen setzen
|
||||
|
||||
```
|
||||
cp env.example .env
|
||||
vi .env
|
||||
```
|
||||
|
||||
### Compiles and hot-reloads for development
|
||||
```
|
||||
npm run serve
|
||||
|
6
env.example
Normal file
6
env.example
Normal file
@ -0,0 +1,6 @@
|
||||
VUE_APP_PASSWORD_RESET_URL="https://resetpw.wtf-eg.de/"
|
||||
VUE_APP_IMPRINT_URL="https://wtf-eg.de/impressum/"
|
||||
VUE_APP_ISSUE_URL="https://git.wtf-eg.de/kompetenzinventar/ki-doku/issues/new/choose"
|
||||
VUE_APP_PRIVACY_URL="https://wtf-eg.de/datenschutz/"
|
||||
VUE_APP_SOURCE_CODE_URL="https://git.wtf-eg.de/kompetenzinventar"
|
||||
VUE_APP_TENANT="WTF"
|
@ -11,6 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
<router-view :key="$route.fullPath" />
|
||||
<Footer />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Footer from '@/components/Footer'
|
||||
import Navbar from '@/components/Navbar'
|
||||
|
@ -4,11 +4,12 @@
|
||||
* SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
*/
|
||||
|
||||
@use "sass:string";
|
||||
@import "variables";
|
||||
@import "bootstrap/scss/bootstrap";
|
||||
|
||||
.bg-wtf {
|
||||
background-image: url(../assets/img/wtf-header-bg.jpg);
|
||||
.bg-tenant {
|
||||
background-image: url("../assets/img/" + string.to-lower-case($VUE_APP_TENANT) + "-header-bg.jpg");
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
@ -12,24 +12,53 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
<div class="d-inline-block">
|
||||
<div class="fw-bold text-white mb-2">Kompetenzinventar</div>
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="https://git.wtf-eg.de/kompetenzinventar">Quellcode</a></li>
|
||||
<li><a href="https://git.wtf-eg.de/kompetenzinventar/ki-doku/issues/new/choose">Problem melden</a></li>
|
||||
<li><a :href="source_code_url">Quellcode</a></li>
|
||||
<li><a :href="issue_url">Problem melden</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 d-sm-flex justify-content-center">
|
||||
<div class="d-inline-block">
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="https://wtf-eg.de/impressum/">Impressum</a></li>
|
||||
<li><a href="https://wtf-eg.de/datenschutz/">Datenschutzerklärung</a></li>
|
||||
<li><a :href="imprint_url">Impressum</a></li>
|
||||
<li><a :href="privacy_url">Datenschutzerklärung</a></li>
|
||||
</ul>
|
||||
<img class="wtf-logo wtf-logo--footer" src="@/assets/img/wtf_logo_white.svg">
|
||||
<img
|
||||
class="tenant-logo tenant-logo--footer"
|
||||
:src="loadImage('logo')"
|
||||
alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
const imprint_url = process.env.VUE_APP_IMPRINT_URL || ""
|
||||
const issue_url = process.env.VUE_APP_ISSUE_URL || ""
|
||||
const privacy_url = process.env.VUE_APP_PRIVACY_URL || ""
|
||||
const source_code_url = process.env.VUE_APP_SOURCE_CODE_URL || ""
|
||||
const tenant = process.env.VUE_APP_TENANT || "WTF"
|
||||
|
||||
return {
|
||||
imprint_url,
|
||||
issue_url,
|
||||
privacy_url,
|
||||
source_code_url,
|
||||
tenant,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
loadImage(type) {
|
||||
return require(`../assets/img/${this.tenant.toLowerCase()}_${type}.svg`)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
a {
|
||||
color: #fff;
|
||||
@ -41,7 +70,7 @@ a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.wtf-logo--footer {
|
||||
.tenant-logo--footer {
|
||||
max-width: 200px;
|
||||
}
|
||||
</style>
|
||||
|
@ -11,7 +11,10 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
class="navbar-brand"
|
||||
:to="{ path:'/s/search' }"
|
||||
>
|
||||
<img class="wtf-logo wtf-logo--navbar" src="@/assets/img/wtf_logo.svg">
|
||||
<img
|
||||
class="tenant-logo tenant-logo--navbar"
|
||||
:src="loadImage('logo')"
|
||||
alt="">
|
||||
<span class="d-none d-sm-inline">Kompetenzinventar</span>
|
||||
<span class="d-sm-none">KI</span>
|
||||
</router-link>
|
||||
@ -79,14 +82,20 @@ export default {
|
||||
name: 'Navbar',
|
||||
mixins: [RequestMixin],
|
||||
data() {
|
||||
const tenant = process.env.VUE_APP_TENANT || "WTF"
|
||||
|
||||
return {
|
||||
showMobileNav: false
|
||||
showMobileNav: false,
|
||||
tenant,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['currentUserId'])
|
||||
},
|
||||
methods: {
|
||||
loadImage(type) {
|
||||
return require(`../assets/img/${this.tenant.toLowerCase()}_${type}.svg`)
|
||||
},
|
||||
toggleMobileNav() {
|
||||
this.showMobileNav = !this.showMobileNav
|
||||
},
|
||||
@ -100,8 +109,7 @@ export default {
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
.wtf-logo--navbar {
|
||||
.tenant-logo--navbar {
|
||||
height: 40px;
|
||||
margin-bottom: -5px;
|
||||
margin-top: -5px;
|
||||
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="bg-wtf py-3">
|
||||
<div class="bg-tenant py-3">
|
||||
<div class="container">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<Avatar class="me-3" :name="profile.nickname" />
|
||||
|
@ -5,17 +5,20 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="bg-wtf">
|
||||
<div class="bg-tenant">
|
||||
<div class="container pt-5">
|
||||
<div class="text-center mb-5">
|
||||
<img class="wtf-logo wtf-logo--index" src="@/assets/img/wtf_logo.svg">
|
||||
<img
|
||||
class="tenant-logo tenant-logo--index"
|
||||
:src="loadImage('logo')"
|
||||
alt="">
|
||||
<h1 class="text-white">Kompetenzinventar</h1>
|
||||
</div>
|
||||
<form @submit.prevent="submitLogin()" class="card bg-white login-form">
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label for="exampleInputusername1" class="form-label" >
|
||||
WTF-Benutzername:
|
||||
{{tenant}}-Benutzername:
|
||||
</label>
|
||||
<input
|
||||
type="username"
|
||||
@ -37,7 +40,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
/>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Login</button>
|
||||
<a class="btn btn-link" href="https://resetpw.wtf-eg.de/">Passwort vergessen?</a>
|
||||
<a class="btn btn-link" :href="password_reset_url">Passwort vergessen?</a>
|
||||
<div
|
||||
class="alert alert-danger mt-3 mb-0"
|
||||
role="alert"
|
||||
@ -58,17 +61,26 @@ export default {
|
||||
name: "Index",
|
||||
mixins: [RequestMixin],
|
||||
data() {
|
||||
const password_reset_url = process.env.VUE_APP_PASSWORD_RESET_URL || ""
|
||||
const tenant = process.env.VUE_APP_TENANT || "WTF"
|
||||
|
||||
return {
|
||||
showErrorMessage: false,
|
||||
username: "",
|
||||
password: "",
|
||||
password_reset_url,
|
||||
tenant,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
loadImage(type) {
|
||||
return require(`../assets/img/${this.tenant.toLowerCase()}_${type}.svg`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
}
|
||||
@ -78,7 +90,7 @@ export default {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.wtf-logo--index {
|
||||
.tenant-logo--index {
|
||||
max-width: 200px;
|
||||
}
|
||||
</style>
|
||||
|
@ -6,9 +6,9 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="bg-wtf text-white pt-3 pb-4">
|
||||
<div class="bg-tenant text-white pt-3 pb-4">
|
||||
<div class="container">
|
||||
<div class="fs-3 text-center lh-1 mb-3">Finde WTF Member</div>
|
||||
<div class="fs-3 text-center lh-1 mb-3">Finde {{tenant}} Member</div>
|
||||
<div class="card mx-auto bg-white">
|
||||
<div class="card-body">
|
||||
<form @submit.prevent="handleSubmit">
|
||||
@ -93,8 +93,11 @@ export default {
|
||||
Spinner,
|
||||
},
|
||||
data() {
|
||||
const tenant = process.env.VUE_APP_TENANT || "WTF"
|
||||
|
||||
return {
|
||||
textChanged: false
|
||||
tenant,
|
||||
textChanged: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -175,6 +178,7 @@ export default {
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
max-width: 768px;
|
||||
|
@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<div class="bg-wtf py-3 mb-4">
|
||||
<div class="bg-tenant py-3 mb-4">
|
||||
<div class="container">
|
||||
<h3 class="text-white text-center mb-0">Profil bearbeiten</h3>
|
||||
</div>
|
||||
|
18
vue.config.js
Normal file
18
vue.config.js
Normal file
@ -0,0 +1,18 @@
|
||||
const { defineConfig } = require('@vue/cli-service');
|
||||
|
||||
let sav = "";
|
||||
for (let e in process.env) {
|
||||
if (/VUE_APP_/i.test(e)) {
|
||||
sav += `$${e}: "${process.env[e]}";`;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = defineConfig({
|
||||
css: {
|
||||
loaderOptions: {
|
||||
sass: {
|
||||
additionalData: sav,
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
Loading…
x
Reference in New Issue
Block a user