blackicedbear/FHC-Core
1
0
Fork 0
mirror of https://github.com/FH-Complete/FHC-Core.git synced 2026-07-25 16:44:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

added set language feature; phrasen plugin with optional reload if non responsive phrasen are used; stundenplan header mode & buttons reworked

Browse Source
This commit is contained in:
Johann Hoffmann
2024-10-24 17:46:42 +02:00
parent 805ed20a18
commit e387671e09
20 changed files with 166 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/Cis4/Cis.css
+32 -1
View File
@@ -218,12 +218,27 @@ html {
max-height: calc(100vh - var(--fhc-cis-header-height));
}
#nav-user-menu img {
object-fit: cover;
height: calc( 3 * var(--fhc-cis-header-py));
}
#fhc-languages {
display: flex;
text-align: center;
}
#fhc-languages .btn {
flex: 1;
display: flex;
}
/* desktop */
@media (min-width: 992px) {
body {
display: flex;
padding-top: var(--fhc-cis-header-height);
width: 100vw;
width: 99vw;
/* overflow: visible !important; */
}
#cis-header {
@@ -310,6 +325,22 @@ html {
min-width: var(--fhc-cis-menu-width);
background-color: var(--fhc-cis-menu-lvl-2-bg);
}
#nav-user-menu img {
object-fit: cover;
height: calc( 3 * var(--fhc-cis-header-py));
}
#fhc-languages {
display: flex;
text-align: center;
}
#fhc-languages .btn {
flex: 1;
display: flex;
}
#nav-main-menu {
height: 100%;
background-color: var(--fhc-cis-menu-bg);
public/images/icons/at.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

public/images/icons/uk.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.5 KiB

public/js/api/phrasen.js
+5 -1
View File
@@ -18,5 +18,9 @@
export default {
loadCategory(category) {
return this.$fhcApi.get('/api/frontend/v1/phrasen/loadModule/' + category);
},
setLanguage(categories,language) {
const payload = {categories, language}
return this.$fhcApi.post('/api/frontend/v1/phrasen/setLanguage', payload);
}
};
};
public/js/apps/Cis.js
+7 -3
View File
@@ -1,10 +1,11 @@
import FhcSearchbar from "../components/searchbar/searchbar.js";
import CisMenu from "../components/Cis/Menu.js";
import FhcApi from '../plugin/FhcApi.js';
import Phrasen from '../plugin/Phrasen.js';
import fhcapifactory from "./api/fhcapifactory.js";
Vue.$fhcapi = fhcapifactory;
Vue.createApp({
const app = Vue.createApp({
components: {
FhcSearchbar,
CisMenu
@@ -90,4 +91,7 @@ Vue.createApp({
},
}
}).mount('#cis-header');
});
app.use(FhcApi);
app.use(Phrasen);
app.mount('#cis-header');
public/js/apps/Cis/Cms.js
+2 -2
View File
@@ -35,6 +35,6 @@ const app = Vue.createApp({
},
});
app.use(primevue.config.default, { zIndex: { overlay: 9999 } });
app.use(Phrasen);
app.use(Phrasen, {reload: true});
app.mount("#cms");
//#cms [data-confirm], #cms [data-href]
//#cms [data-confirm], #cms [data-href]
public/js/apps/Cis/Documents.js
+6 -4
View File
@@ -1,12 +1,13 @@
import Phrasen from '../../mixins/Phrasen.js';
// import Phrasen from '../../mixins/Phrasen.js';
import Phrasen from '../../plugin/Phrasen.js';
//import {TabulatorFull as Tabulator} from '../../../../vendor/olifolkerd/tabulator5/dist/js/tabulator_esm.min.js';
//import CssLib from '../../helpers/CssLib.js';
//CssLib.import('../../vendor/olifolkerd/tabulator5/dist/css/tabulator_bootstrap5.min.css');
const app = Vue.createApp({
mixins: [
Phrasen
],
// mixins: [
// Phrasen
// ],
data() {
return {
inscriptiontable: null,
@@ -90,4 +91,5 @@ const app = Vue.createApp({
});
}
});
app.use(Phrasen, {reload: true});
app.mount('#content');
public/js/apps/Cis/MyLv/Student.js
+1 -1
View File
@@ -5,4 +5,4 @@ Vue.createApp({
components: {
MylvStudent
}
}).use(Phrasen).mount('#content');
}).use(Phrasen, {reload: true}).mount('#content');
public/js/apps/Cis/Stundenplan.js
+1 -1
View File
@@ -109,5 +109,5 @@ const app = Vue.createApp({
`
});
app.config.unwrapInjectedRef = true;
app.use(Phrasen);
app.use(Phrasen, {reload: true});
app.mount('#content');
public/js/apps/Dashboard.js
+7 -2
View File
@@ -1,7 +1,9 @@
import {CoreNavigationCmpt} from '../components/navigation/Navigation.js';
import CoreDashboard from '../components/Dashboard/Dashboard.js';
import FhcApi from '../../plugin/FhcApi.js';
import Phrasen from '../../plugin/Phrasen.js';
Vue.createApp({
const app = Vue.createApp({
data: () => ({
appSideMenuEntries: {}
}),
@@ -9,4 +11,7 @@ Vue.createApp({
CoreNavigationCmpt,
CoreDashboard
}
}).mount('#main');
})
app.use(FhcApi);
app.use(Phrasen);
app.mount('#main');
public/js/apps/lehre/Antrag.js
+2 -2
View File
@@ -20,5 +20,5 @@ const app = Vue.createApp({
}
});
app
.use(Phrasen)
.mount('#wrapper');
.use(Phrasen, {reload: true})
.mount('#wrapper');
public/js/components/Calendar/Header.js
+19 -11
View File
@@ -5,7 +5,6 @@ export default {
modes:{
week:"Woche",
month:"Monat",
years:"Jahre",
},
}
},
@@ -44,9 +43,23 @@ export default {
},
template: `
<div class="calendar-header card-header w-100" :class="classHeader">
<div class="row justify-content-end" style="position: absolute; width: 98%; pointer-events: none;">
<div class="col-auto" style="pointer-events: all;">
<div role="group" aria-label="Kalender Modus">
<button type="button" :class="{'active':mode_kurzbz == mode}" style="margin-right: 4px;" @click.prevent="$emit('updateMode',mode_kurzbz)" class="btn btn-outline-secondary" v-for="(mode_bezeichnung,mode_kurzbz) in modes">
<i v-if="mode_kurzbz == 'week'" class="fa fa-calendar-week"></i>
<i v-else-if="mode_kurzbz == 'month'" class="fa fa-calendar-days"></i>
</button>
</div>
</div>
</div>
<div class="row">
<button class="btn btn-outline-secondary border-0 col-auto" :class="{'btn-sm':!this.size}" @click="$emit('prev')"><i class="fa fa-chevron-left"></i></button>
<div class="col text-center">
<div class="col-5 d-flex justify-content-end">
<button class="btn btn-outline-secondary border-0" :class="{'btn-sm':!this.size}" @click="$emit('prev')"><i class="fa fa-chevron-left"></i></button>
</div>
<div class="justify-content-center text-center col-2">
<div class="d-flex justify-content-center align-items-center">
<button class="btn btn-link link-secondary text-decoration-none" :class="{'btn-sm': !this.size}" @click="$emit('click')">
{{ title }}
@@ -54,14 +67,9 @@ export default {
</button>
</div>
</div>
<button class="col-auto btn btn-outline-secondary border-0" :class="{'btn-sm': !this.size}" @click="$emit('next')"><i class="fa fa-chevron-right"></i></button>
</div>
<div class="row justify-content-center">
<div class="col-auto">
<div class="btn-group" role="group" aria-label="Kalender Modus">
<button type="button" :class="{'active':mode_kurzbz == mode}" @click.prevent="$emit('updateMode',mode_kurzbz)" class="btn btn-outline-secondary" v-for="(mode_bezeichnung,mode_kurzbz) in modes">{{mode_bezeichnung}}</button>
</div>
<div class="col-5 d-flex justify-content-start">
<button class="btn btn-outline-secondary border-0" :class="{'btn-sm': !this.size}" @click="$emit('next')"><i class="fa fa-chevron-right"></i></button>
</div>
</div>
</div>`
}
}
public/js/components/Cis/Menu.js
+10
View File
@@ -12,6 +12,8 @@ export default {
logoUrl: String,
avatarUrl: String,
logoutUrl: String,
atFlagUrl: String,
ukFlagUrl: String,
selectedtypes: Array,
searchbaroptions: Object,
searchfunction: Function
@@ -60,10 +62,14 @@ export default {
setActiveEntry(content_id){
this.activeEntry = content_id;
},
handleChangeLanguage(lang) {
this.$p.setLanguage(lang, this.$fhcApi)
}
},
mounted(){
this.entries = this.menu;
this.$p.loadCategory(['ui', 'global'])
},
template: /*html*/`
<!--<p>CISVUE HEADER</p>
@@ -83,6 +89,10 @@ export default {
<ul id="nav-user-menu" class="collapse list-unstyled" aria-labelledby="nav-user-btn">
<li><a class="btn btn-level-2 rounded-0 d-block" href="#" id="menu-profil">Profil</a></li>
<li><a class="btn btn-level-2 rounded-0 d-block" href="#">Ampeln</a></li>
<li class="fhc-languages" style="text-align: center;">
<a class="btn btn-level-2 rounded-0" href="#" @click="handleChangeLanguage('German')"><img :src="atFlagUrl"/></a>
<a class="btn btn-level-2 rounded-0" href="#" @click="handleChangeLanguage('English')"><img :src="ukFlagUrl"/></a>
</li>
<li><hr class="dropdown-divider"></li>
<li><a class="btn btn-level-2 rounded-0 d-block" :href="logoutUrl">Logout</a></li>
</ul>
public/js/plugin/Phrasen.js
+16 -2
View File
@@ -2,6 +2,7 @@ import FhcApi from './FhcApi.js';
const categories = Vue.reactive({});
const loadingModules = {};
let reload = false;
function extractCategory(obj, category) {
return obj.filter(e => e.category == category).reduce((res, elem) => {
@@ -19,8 +20,19 @@ function getValueForLoadedPhrase(category, phrase, params) {
return result;
}
const phrasen = {
setLanguage(language, api) {
const catArray = Object.keys(categories)
return api.factory.phrasen.setLanguage(catArray, language).then(res => {
if(reload) window.location.reload()
res.data.forEach(row => {
categories[row.category][row.phrase] = row.text
})
return res
})
},
loadCategory(category) {
if (Array.isArray(category))
return Promise.all(category.map(this.config.globalProperties
@@ -63,12 +75,14 @@ const phrasen = {
export default {
install(app, options) {
reload = options?.reload ?? reload
app.use(FhcApi, options?.fhcApi || undefined);
app.config.globalProperties.$p = {
t: phrasen.t,
loadCategory: cat => phrasen.loadCategory.call(app, cat),
setLanguage: phrasen.setLanguage,
t_ref: phrasen.t_ref
};
app.provide('$p', app.config.globalProperties.$p);
}
}
}