remove hardcoded h1 tag, keep the title h1 tag; more cleanup;

This commit is contained in:
Johann Hoffmann
2024-11-22 11:43:05 +01:00
parent e2b42de6b3
commit ecab3ea4d9
5 changed files with 187 additions and 188 deletions
@@ -36,7 +36,8 @@ export default {
} }
).catch(err => console.error('ERROR:', err)); ).catch(err => console.error('ERROR:', err));
}, },
template: `<div class="dashboard-admin-widgets"> template: `
<div class="dashboard-admin-widgets">
<div v-for="widget in widgets" :key="widget.widget_id" class="form-check form-switch"> <div v-for="widget in widgets" :key="widget.widget_id" class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" :id="'dashboard-admin-widgets-' + widget.widget_id" v-model="widget.allowed" @input.prevent="sendChange(widget.widget_id)"> <input class="form-check-input" type="checkbox" role="switch" :id="'dashboard-admin-widgets-' + widget.widget_id" v-model="widget.allowed" @input.prevent="sendChange(widget.widget_id)">
<label class="form-check-label" :for="'dashboard-admin-widgets-' + widget.widget_id">{{(widget.setup && widget.setup.name) || widget.widget_kurzbz}}</label> <label class="form-check-label" :for="'dashboard-admin-widgets-' + widget.widget_id">{{(widget.setup && widget.setup.name) || widget.widget_kurzbz}}</label>
@@ -1,5 +1,4 @@
import AbstractWidget from './Abstract'; import AbstractWidget from './Abstract';
export default { export default {
mixins: [ mixins: [
AbstractWidget AbstractWidget
@@ -12,7 +11,8 @@ export default {
created() { created() {
this.$emit('setConfig', false) this.$emit('setConfig', false)
}, },
template: `<div :class="css"> template: `
<div :class="css">
<h5 class="card-title">{{ config.title }}</h5> <h5 class="card-title">{{ config.title }}</h5>
<p class="card-text">{{ config.msg }}</p> <p class="card-text">{{ config.msg }}</p>
</div>` </div>`
+79 -78
View File
@@ -1,89 +1,90 @@
import AbstractWidget from './Abstract'; import AbstractWidget from './Abstract';
import BsModal from '../Bootstrap/Modal'; import BsModal from '../Bootstrap/Modal';
const MAX_LOADED_NEWS = 10; const MAX_LOADED_NEWS = 10;
export default { export default {
name: "WidgetsNews", name: "WidgetsNews",
components: { BsModal }, components: {BsModal},
data: () => ({ data: () => ({
allNewsList: [], allNewsList: [],
singleNews: {}, singleNews: {},
}), }),
mixins: [AbstractWidget], mixins: [AbstractWidget],
computed: { computed: {
getNewsWidgetStyle() { getNewsWidgetStyle() {
return this.width == 1 ? "padding: 1rem 1rem;" : "padding: 0px;" return this.width == 1 ? "padding: 1rem 1rem;" : "padding: 0px;"
}, },
newsList() { newsList() {
//Return news amount depending on widget width and size //Return news amount depending on widget width and size
let quantity = this.width; let quantity = this.width;
if (this.width === 1) { if (this.width === 1) {
quantity = this.height === 1 ? 4 : 10; quantity = this.height === 1 ? 4 : 10;
} }
return this.allNewsList.slice(0, quantity); return this.allNewsList.slice(0, quantity);
}, },
placeHolderImgURL: function () { placeHolderImgURL: function () {
return ( return (
FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.app_root +
"skin/images/fh_technikum_wien_illustration_klein.png" "skin/images/fh_technikum_wien_illustration_klein.png"
); );
}, },
}, },
created() { created() {
this.$fhcApi.factory.cms this.$fhcApi.factory.cms
.news(MAX_LOADED_NEWS) .news(MAX_LOADED_NEWS)
.then((res) => { .then((res) => {
this.allNewsList = res.data; this.allNewsList = res.data;
}) })
.catch((err) => { .catch((err) => {
console.error("ERROR: ", err.response.data); console.error("ERROR: ", err.response.data);
}); });
this.$emit("setConfig", false); this.$emit("setConfig", false);
}, },
methods: { methods: {
contentURI: function (content_id) { contentURI: function (content_id) {
return ( return (
FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.app_root +
FHC_JS_DATA_STORAGE_OBJECT.ci_router + FHC_JS_DATA_STORAGE_OBJECT.ci_router +
"/CisVue/Cms/content/" + "/CisVue/Cms/content/" +
content_id content_id
); );
}, },
allNewsURI: function () { allNewsURI: function () {
return ( return (
FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.app_root +
FHC_JS_DATA_STORAGE_OBJECT.ci_router + FHC_JS_DATA_STORAGE_OBJECT.ci_router +
"/CisVue/Cms/news" "/CisVue/Cms/news"
); );
}, },
setSingleNews(singleNews) { setSingleNews(singleNews) {
this.singleNews = singleNews; this.singleNews = singleNews;
this.$refs.newsModal.show(); this.$refs.newsModal.show();
}, },
}, },
template: /*html*/ `<div class="widgets-news h-100" :style="getNewsWidgetStyle"> template: /*html*/ `
<div class="widgets-news h-100" :style="getNewsWidgetStyle">
<div class="d-flex flex-column h-100 "> <div class="d-flex flex-column h-100 ">
<div class="h-100" style="overflow-y: auto" v-if="width == 1"> <div class="h-100" style="overflow-y: auto" v-if="width == 1">
<div v-for="(news, index) in newsList" :key="news.id" class="mt-2"> <div v-for="(news, index) in newsList" :key="news.id" class="mt-2">
<div v-if="index > 0 " class="fhc-seperator"></div> <div v-if="index > 0 " class="fhc-seperator"></div>
<a :href="contentURI(news.content_id)" >{{ news.content_obj.betreff?news.content_obj.betreff:getDate(news.insertamum) }}</a><br> <a :href="contentURI(news.content_id)" >{{ news.content_obj.betreff?news.content_obj.betreff:getDate(news.insertamum) }}</a><br>
<span class="small text-muted">{{ formatDateTime(news.insertamum) }}</span> <span class="small text-muted">{{ formatDateTime(news.insertamum) }}</span>
</div>
</div>
<div v-else-if="width > 1 && height === 1" class="h-100" :class="'row row-cols-' + width">
<div class="h-100" v-for="news in newsList" :key="news.id">
<div class="news-content h-100" :style="'--news-widget-height: '+height" ref="htmlContent" v-html="news.content_obj.content"></div>
</div>
</div>
<div v-else class="h-100" :class="'row row-cols-' + width + ' gx-2'">
<div class="h-100" v-for="news in newsList" :key="news.id">
<div class="news-content h-100" :style="'--news-widget-height: '+height" ref="htmlContent" v-html="news.content_obj.content"></div>
</div>
</div> </div>
</div> </div>
<div v-else-if="width > 1 && height === 1" class="h-100" :class="'row row-cols-' + width">
<div class="h-100" v-for="news in newsList" :key="news.id">
<div class="news-content h-100" :style="'--news-widget-height: '+height" ref="htmlContent" v-html="news.content_obj.content"></div>
</div>
</div>
<div v-else class="h-100" :class="'row row-cols-' + width + ' gx-2'">
<div class="h-100" v-for="news in newsList" :key="news.id">
<div class="news-content h-100" :style="'--news-widget-height: '+height" ref="htmlContent" v-html="news.content_obj.content"></div>
</div>
</div>
</div>
</div>`, </div>`,
}; };
+104 -106
View File
@@ -1,7 +1,7 @@
import AbstractWidget from './Abstract'; import AbstractWidget from './Abstract';
export default { export default {
name: "WidgetsUrl", name: "WidgetsUrl",
mixins: [AbstractWidget], mixins: [AbstractWidget],
inject: { inject: {
editModeIsActive: { editModeIsActive: {
@@ -9,119 +9,117 @@ export default {
default: false default: false
} }
}, },
data: () => ({ data: () => ({
title_input: "", title_input: "",
url_input: "", url_input: "",
validation:{ validation: {
invalidURL: false, invalidURL: false,
invalidTitel:false, invalidTitel: false,
} }
}), }),
computed: {
tagName() {
return this.config.tag !== undefined && this.config.tag.length > 0
? this.config.tag
: this.$p.t("bookmark", "myBookmarks");
},
emptyBookmarks() {
if (this.shared instanceof Array && this.shared.length == 0) return true;
if (!this.shared) return true; computed: {
tagName() {
return this.config.tag !== undefined && this.config.tag.length > 0
? this.config.tag
: this.$p.t("bookmark", "myBookmarks");
},
emptyBookmarks() {
if (this.shared instanceof Array && this.shared.length == 0) return true;
return false; if (!this.shared) return true;
},
},
methods: {
isValidationSuccessfull(){
// validate the input fields
if (this.title_input.length === 0) {
this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidTitel"));
this.validation.invalidTitel = true;
}
if (!URL.canParse(this.url_input)) {
this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidUrl"));
this.validation.invalidURL = true;
}
return !Object.values(this.validation).some(value => value === true); return false;
},
}, },
async fetchBookmarks() { methods: {
await this.$fhcApi.factory.bookmark isValidationSuccessfull() {
.getBookmarks() // validate the input fields
.then((res) => res.data) if (this.title_input.length === 0) {
.then((result) => { this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidTitel"));
this.shared = result; this.validation.invalidTitel = true;
}) }
.catch(this.$fhcAlert.handleSystemError); if (!URL.canParse(this.url_input)) {
}, this.$fhcAlert.alertError(this.$p.t("bookmark", "invalidUrl"));
addLink() { this.validation.invalidURL = true;
// reset is-invalid css on url input field }
for(let key of Object.keys(this.validation)){
this.validation[key] = false;
}
// early return if validation failed
if (!this.isValidationSuccessfull()) return;
this.$fhcApi.factory.bookmark
.insert({
tag: this.config.tag,
title: this.title_input,
url: this.url_input,
})
.then((res) => res.data)
.then((result) => {
this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkAdded"));
// refetch the bookmarks to see the updates
this.fetchBookmarks();
})
.catch(this.$fhcAlert.handleSystemError);
// reset the values for the title and url inputs return !Object.values(this.validation).some(value => value === true);
this.title_input = ""; },
this.url_input = ""; async fetchBookmarks() {
}, await this.$fhcApi.factory.bookmark
async removeLink(bookmark_id) { .getBookmarks()
let isConfirmed = await this.$fhcAlert.confirmDelete(); .then((res) => res.data)
.then((result) => {
// early return if the confirm dialog was not confirmed this.shared = result;
if(!isConfirmed) return; })
.catch(this.$fhcAlert.handleSystemError);
this.$fhcApi.factory.bookmark },
.delete(bookmark_id) addLink() {
.then((res) => res.data) // reset is-invalid css on url input field
.then((result) => { for (let key of Object.keys(this.validation)) {
this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkDeleted")); this.validation[key] = false;
// refetch the bookmarks to see the updates }
this.fetchBookmarks();
}) // early return if validation failed
.catch(this.$fhcAlert.handleSystemError); if (!this.isValidationSuccessfull()) return;
},
}, this.$fhcApi.factory.bookmark
async mounted() { .insert({
await this.fetchBookmarks(); tag: this.config.tag,
}, title: this.title_input,
created() url: this.url_input,
{ })
// .then((res) => res.data)
// this.$emit('setConfig', true); -> use this to enable widget config mode if needed .then((result) => {
}, this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkAdded"));
template: /*html*/ ` // refetch the bookmarks to see the updates
this.fetchBookmarks();
})
.catch(this.$fhcAlert.handleSystemError);
// reset the values for the title and url inputs
this.title_input = "";
this.url_input = "";
},
async removeLink(bookmark_id) {
let isConfirmed = await this.$fhcAlert.confirmDelete();
// early return if the confirm dialog was not confirmed
if (!isConfirmed) return;
this.$fhcApi.factory.bookmark
.delete(bookmark_id)
.then((res) => res.data)
.then((result) => {
this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkDeleted"));
// refetch the bookmarks to see the updates
this.fetchBookmarks();
})
.catch(this.$fhcAlert.handleSystemError);
},
},
async mounted() {
await this.fetchBookmarks();
},
created() {
//
// this.$emit('setConfig', true); -> use this to enable widget config mode if needed
},
template: /*html*/ `
<div class="widgets-url w-100 h-100" style="padding: 1rem 1rem;"> <div class="widgets-url w-100 h-100" style="padding: 1rem 1rem;">
<div class="d-flex flex-column justify-content-between"> <div class="d-flex flex-column justify-content-between">
<!-- todo: widgetTag ?? --> <!-- todo: widgetTag ?? -->
<template v-if="shared"> <template v-if="shared">
<template v-if="!emptyBookmarks"> <template v-if="!emptyBookmarks">
<div v-for="link in shared" :key="link.id" class="d-flex mt-2"> <div v-for="link in shared" :key="link.id" class="d-flex mt-2">
<a target="_blank" :href="link.url"> <a target="_blank" :href="link.url">
<i class="fa fa-solid fa-arrow-up-right-from-square"></i> <i class="fa fa-solid fa-arrow-up-right-from-square"></i>{{ link.title }}
{{ link.title }} </a>
</a> <a class="ms-auto" href="#" @click.prevent="removeLink(link.bookmark_id)" v-show="configMode || editModeIsActive">
<a class="ms-auto" href="#" @click.prevent="removeLink(link.bookmark_id)" v-show="configMode || editModeIsActive"> <i class="fa fa-regular fa-trash-can" style="color: #e01b24;"></i>
<i class="fa fa-regular fa-trash-can" style="color: #e01b24;"></i> </a>
</a> </div>
</div>
</template> </template>
<div v-else class="d-flex mt-2"> <div v-else class="d-flex mt-2">
<span>{{$p.t('bookmark','emptyBookmarks')}}</span> <span>{{$p.t('bookmark','emptyBookmarks')}}</span>
@@ -131,7 +129,7 @@ export default {
<input maxlength="255" required class="form-control form-control-sm" :class="{'is-invalid':validation.invalidTitel}" placeholder="Titel" type="text" v-model="title_input" name="title" > <input maxlength="255" required class="form-control form-control-sm" :class="{'is-invalid':validation.invalidTitel}" placeholder="Titel" type="text" v-model="title_input" name="title" >
<!-- validation html for titel --> <!-- validation html for titel -->
<div class="invalid-feedback"> <div class="invalid-feedback">
{{$p.t("bookmark", "invalidTitel")}}. {{$p.t("bookmark", "invalidTitel")}}.
</div> </div>
</div> </div>
@@ -139,7 +137,7 @@ export default {
<input required id="bookmark_link" class="form-control form-control-sm mt-2" :class="{'is-invalid':validation.invalidURL}" type="url" placeholder="URL" v-model="url_input" name="url"> <input required id="bookmark_link" class="form-control form-control-sm mt-2" :class="{'is-invalid':validation.invalidURL}" type="url" placeholder="URL" v-model="url_input" name="url">
<!-- validation html for url --> <!-- validation html for url -->
<div class="invalid-feedback"> <div class="invalid-feedback">
{{$p.t("bookmark", "invalidUrl")}}. {{$p.t("bookmark", "invalidUrl")}}.
</div> </div>
</div> </div>
-1
View File
@@ -73,7 +73,6 @@ EOXML04;
<xsl:output encoding="UTF-8" omit-xml-declaration="yes" indent="yes"/> <xsl:output encoding="UTF-8" omit-xml-declaration="yes" indent="yes"/>
<xsl:output method="html"/> <xsl:output method="html"/>
<xsl:template match="/"> <xsl:template match="/">
<h1>News</h1>
<div class="row"> <div class="row">
<xsl:choose> <xsl:choose>
<xsl:when test="content/stg_extras"> <xsl:when test="content/stg_extras">