Optimiert die Darstellung von vordefinierten Aktivitäten in DiaryView.vue, indem die Logik zur Anzeige von Aktivitätsnamen und -codes verbessert wird. Aktualisiert das Styling der Bildsymbole und passt die Positionierung der Bilder an, um eine bessere Benutzererfahrung zu gewährleisten.

This commit is contained in:
Torsten Schulz (local)
2025-09-16 00:14:30 +02:00
parent 02732a01da
commit ba4b56360d

View File

@@ -126,13 +126,13 @@
</span>
<span v-else @click="startActivityEdit(item)" class="clickable activity-label"
:title="item.predefinedActivity && item.predefinedActivity.name ? item.predefinedActivity.name : ''">
{{ (item.predefinedActivity && item.predefinedActivity.code && item.predefinedActivity.code.trim() !== '')
? item.predefinedActivity.code
: (item.predefinedActivity ? item.predefinedActivity.name : item.activity) }}
<span v-if="item.predefinedActivity && item.predefinedActivity.imageLink"
@click.stop="showActivityImage(item.predefinedActivity.imageLink)"
class="image-icon"
title="Bild anzeigen">🖼</span>
{{ (item.predefinedActivity && item.predefinedActivity.code && item.predefinedActivity.code.trim() !== '')
? item.predefinedActivity.code
: (item.predefinedActivity ? item.predefinedActivity.name : item.activity) }}
</span>
</td>
<td>{{ item.groupActivity ? item.groupActivity.name : '' }}</td>
@@ -161,13 +161,13 @@
<td></td>
<td>
<span class="activity-label" :title="(groupItem.groupPredefinedActivity && groupItem.groupPredefinedActivity.name) ? groupItem.groupPredefinedActivity.name : ''">
{{ (groupItem.groupPredefinedActivity && groupItem.groupPredefinedActivity.code && groupItem.groupPredefinedActivity.code.trim() !== '')
? groupItem.groupPredefinedActivity.code
: groupItem.groupPredefinedActivity.name }}
<span v-if="groupItem.groupPredefinedActivity && groupItem.groupPredefinedActivity.imageLink"
@click.stop="showActivityImage(groupItem.groupPredefinedActivity.imageLink)"
class="image-icon"
title="Bild anzeigen">🖼</span>
{{ (groupItem.groupPredefinedActivity && groupItem.groupPredefinedActivity.code && groupItem.groupPredefinedActivity.code.trim() !== '')
? groupItem.groupPredefinedActivity.code
: groupItem.groupPredefinedActivity.name }}
</span>
</td>
<td>{{ groupItem.groupsGroupActivity.name }}</td>
@@ -1756,19 +1756,21 @@ img {
.memberImage {
position: fixed;
max-width: 500px;
max-height: 500px;
top: calc(50% - 250px);
left: calc(50% - 250px);
border: 2px solid #555;
box-shadow: 4px 4px 3px #aaa;
overflow: hidden;
padding: 3px;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
}
.memberImage>img {
max-width: 100%;
max-height: 100%;
max-width: 90%;
max-height: 90%;
object-fit: contain;
}
.groups {
@@ -1840,7 +1842,7 @@ img {
}
.image-icon {
margin-left: 8px;
margin-right: 8px;
cursor: pointer;
font-size: 16px;
opacity: 0.7;