fix errors with data structure

This commit is contained in:
Julien Fastré 2023-11-29 16:00:46 +01:00
parent 6da297d1d2
commit ae2265df21
Signed by: julienfastre
GPG Key ID: BDE2190974723FCB
2 changed files with 18 additions and 13 deletions

View File

@ -165,6 +165,6 @@ export interface NewsItemType {
id: number; id: number;
title: string; title: string;
content: string; content: string;
startdate: { date: DateTime }; startDate: DateTime;
enddate: { date: DateTime | null} endDate: DateTime | null;
} }

View File

@ -15,7 +15,7 @@
</template> </template>
<template #body> <template #body>
<p class="news-date"> <p class="news-date">
{{ $t('widget.news.date') }}: <span>{{ formatDate(item.startdate.date) }}</span> <span>{{ $d(newsItemStartDate(), 'short') }}</span>
</p> </p>
<div v-html="convertMarkdownToHtml(item.content)"></div> <div v-html="convertMarkdownToHtml(item.content)"></div>
</template> </template>
@ -30,12 +30,17 @@ import DOMPurify from 'dompurify';
import { DateTime, NewsItemType } from "../../../types"; import { DateTime, NewsItemType } from "../../../types";
import type { PropType } from 'vue' import type { PropType } from 'vue'
import { defineProps, ref } from "vue"; import { defineProps, ref } from "vue";
import {dateToISO} from "../../../chill/js/date"; import {ISOToDatetime} from "../../../chill/js/date";
const props = defineProps({ const props = defineProps({
item: { item: {
type: Object as PropType<NewsItemType>, type: Object as PropType<NewsItemType>,
required: true required: true
},
maxLength: {
type: Number,
required: false,
default: 200,
} }
}) })
@ -52,13 +57,13 @@ const closeModal = () => {
showModal.value = false; showModal.value = false;
}; };
const shouldTruncate = (content: string, maxLength = 100): boolean => { const shouldTruncate = (content: string): boolean => {
return content.length > maxLength; return content.length > props.maxLength;
}; };
const truncateContent = (content: string, maxLength = 100): string => { const truncateContent = (content: string): string => {
if (shouldTruncate(content, maxLength)) { if (shouldTruncate(content)) {
let truncatedContent = content.slice(0, maxLength); let truncatedContent = content.slice(0, props.maxLength);
let linkDepth = 0; let linkDepth = 0;
let linkStartIndex = -1; let linkStartIndex = -1;
@ -103,13 +108,13 @@ const convertMarkdownToHtml = (markdown: string): string => {
return DOMPurify.sanitize(rawHtml) return DOMPurify.sanitize(rawHtml)
}; };
const prepareContent = (content: string, maxLength = 200): string => { const prepareContent = (content: string): string => {
const htmlContent = convertMarkdownToHtml(content); const htmlContent = convertMarkdownToHtml(content);
return truncateContent(htmlContent, maxLength); return truncateContent(htmlContent);
}; };
const formatDate = (datetime: DateTime): string|null => { const newsItemStartDate = (): null|Date => {
return dateToISO(new Date(datetime.toString())) return ISOToDatetime(props.item?.startDate.datetime);
} }
</script> </script>