torsten/trainingstagebuch
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(DiaryView): simplify grouped plan table structure and improve rendering logic
All checks were successful
Deploy tt-tagebuch / deploy (push) Successful in 44s
Details

Browse Source 
- Removed the "Gemeinsam" header from the grouped plan table for a cleaner layout.
- Adjusted the rendering logic to conditionally display shared items and group items more efficiently, enhancing clarity in the activity display.
- Updated colspan attributes to ensure proper alignment and presentation of table data.
This commit is contained in:
Torsten Schulz (local)
2026-05-08 13:50:45 +02:00
parent 9622e9bdb7
commit 2b16cdff53
1 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
frontend/src/views/DiaryView.vue
View File

@@ -414,7 +414,6 @@
<thead>
<tr v-if="showGroupedPlanTable">
<th>{{ $t('diary.startTime') }}</th>
<th>Gemeinsam</th>
<th v-for="group in groups" :key="`group-col-${group.id}`">{{ group.name }}</th>
</tr>
<tr v-else>
@@ -429,8 +428,8 @@
<tbody v-if="showGroupedPlanTable">
<tr v-for="row in groupedPlanRows" :key="row.key">
<td>{{ formatDisplayTime(row.startTime) }}</td>
<td>
<div v-if="row.sharedItems.length" class="plan-cell-stack">
<td v-if="row.sharedItems.length" :colspan="groups.length">
<div class="plan-cell-stack">
<div v-for="item in row.sharedItems" :key="`shared-${item.id}`" class="plan-cell-item">
<div class="plan-activity-main">
<span @click="startActivityEdit(item)" class="clickable activity-label">{{ getPlanItemDisplayLabel(item) }}</span>
@@ -445,30 +444,31 @@
</div>
</div>
</div>
<span v-else class="plan-row-muted">-</span>
</td>
<td v-for="group in groups" :key="`row-${row.key}-group-${group.id}`">
<div v-if="(row.groupItems[group.id] || []).length" class="plan-cell-stack">
<div v-for="item in (row.groupItems[group.id] || [])" :key="`group-item-${item.id}`" class="plan-cell-item">
<div class="plan-activity-main">
<span @click="startActivityEdit(item)" class="clickable activity-label">{{ getPlanItemDisplayLabel(item) }}</span>
<span v-if="!isStructuralPlanItem(item)" class="plan-status-badge" :class="`plan-status-badge-${getPlanItemStatus(item).tone}`">
{{ getPlanItemStatus(item).label }}
</span>
</div>
<div class="plan-row-actions">
<button @click="startActivityEdit(item)" class="plan-row-action-button">{{ $t('common.edit') }}</button>
<button v-if="!isStructuralPlanItem(item)" @click="toggleActivityMembers(item)" class="plan-row-action-button">{{ $t('diary.assignShort') }}</button>
<button @click="removePlanItem(item.id)" class="plan-row-action-button plan-row-action-button-danger">{{ $t('common.delete') }}</button>
<template v-else>
<td v-for="group in groups" :key="`row-${row.key}-group-${group.id}`">
<div v-if="(row.groupItems[group.id] || []).length" class="plan-cell-stack">
<div v-for="item in (row.groupItems[group.id] || [])" :key="`group-item-${item.id}`" class="plan-cell-item">
<div class="plan-activity-main">
<span @click="startActivityEdit(item)" class="clickable activity-label">{{ getPlanItemDisplayLabel(item) }}</span>
<span v-if="!isStructuralPlanItem(item)" class="plan-status-badge" :class="`plan-status-badge-${getPlanItemStatus(item).tone}`">
{{ getPlanItemStatus(item).label }}
</span>
</div>
<div class="plan-row-actions">
<button @click="startActivityEdit(item)" class="plan-row-action-button">{{ $t('common.edit') }}</button>
<button v-if="!isStructuralPlanItem(item)" @click="toggleActivityMembers(item)" class="plan-row-action-button">{{ $t('diary.assignShort') }}</button>
<button @click="removePlanItem(item.id)" class="plan-row-action-button plan-row-action-button-danger">{{ $t('common.delete') }}</button>
</div>
</div>
</div>
</div>
<span v-else class="plan-row-muted">-</span>
</td>
<span v-else class="plan-row-muted">-</span>
</td>
</template>
</tr>
<tr>
<td>{{ calculateNextTime }}</td>
<td :colspan="groups.length + 1">
<td :colspan="groups.length">
<span class="plan-add-hint">{{ $t('diary.planAddHint') }}</span>
</td>
</tr>