Skip to content

Improve calendar widget layout #11

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Visionz73 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Improve calendar widget layout #11

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 30 additions & 12 deletions src/controllers/dashboard.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -101,18 +101,36 @@
// Load HaveToPay widget data
require_once __DIR__.'/widgets/havetopay_widget.php';

// Get upcoming events for calendar short
$stmt = $pdo->prepare("
SELECT e.*, u.username AS creator_name
FROM events e
LEFT JOIN users u ON u.id = e.created_by
WHERE (e.assigned_to = ? OR e.created_by = ?)
AND e.event_date >= CURDATE()
ORDER BY e.event_date ASC
LIMIT 5
");
$stmt->execute([$userId, $userId]);
$upcomingEvents = $stmt->fetchAll(PDO::FETCH_ASSOC);
// Get upcoming events for calendar widget (today onwards)
$today = new DateTimeImmutable('today');
$stmt = $pdo->prepare(
"SELECT e.*, u.username AS creator_name
FROM events e
LEFT JOIN users u ON u.id = e.created_by
WHERE (e.assigned_to = ? OR e.created_by = ?)
AND e.event_date >= ?
ORDER BY e.event_date ASC, IFNULL(e.start_time, '') ASC
LIMIT 10"
);
$stmt->execute([
$userId,
$userId,
$today->format('Y-m-d')
]);
$upcomingEvents = $stmt->fetchAll(PDO::FETCH_ASSOC);

// Group events by date for easier rendering
$eventsByDate = [];
foreach ($upcomingEvents as $event) {
$date = $event['event_date'];
if (!isset($eventsByDate[$date])) {
$eventsByDate[$date] = [];
}
$eventsByDate[$date][] = $event;
}

// Today's events for header stats
$todayEvents = $eventsByDate[$today->format('Y-m-d')] ?? [];

// Get recent documents for documents short
$stmt = $pdo->prepare("
Expand Down
43 changes: 26 additions & 17 deletions templates/dashboard.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -911,28 +911,37 @@
<div class="dashboard-short">
<div class="short-header p-6" onclick="window.location.href='calendar.php'">
<div class="flex items-center justify-between">
<h3 class="text-white font-semibold text-xl">Kalender</h3>
<h3 class="text-white font-semibold text-xl">
<?= date('l, d.m.') ?>
</h3>
<div class="text-right">
<div class="stats-number text-3xl"><?= count($upcomingEvents ?? []) ?></div>
<div class="stats-number text-3xl"><?= count($todayEvents) ?></div>
<div class="text-white/60 text-sm">heute</div>
</div>
</div>
</div>

<div class="p-6">
<div class="short-scroll space-y-3">
<div class="short-scroll space-y-2">
<?php if (!empty($upcomingEvents)): ?>
<?php foreach(array_slice($upcomingEvents, 0, 4) as $event): ?>
<div class="short-list-item p-4" onclick="window.location.href='calendar.php'">
<div class="flex justify-between items-start mb-2">
<h4 class="text-white font-medium text-sm truncate flex-1"><?= htmlspecialchars($event['title']) ?></h4>
<span class="text-blue-400 text-xs ml-2"><?= date('H:i', strtotime($event['event_date'])) ?></span>
<?php $currentDate = ''; ?>
<?php foreach ($upcomingEvents as $event): ?>
<?php if ($currentDate !== $event['event_date']): ?>
<?php $currentDate = $event['event_date']; ?>
<div class="text-white/60 text-xs mt-2">
<?= date('D d.m', strtotime($currentDate)) ?>
</div>
<?php if(!empty($event['description'])): ?>
<p class="text-white/60 text-xs truncate"><?= htmlspecialchars($event['description']) ?></p>
<?php endif; ?>
<div class="text-xs text-white/50 mt-2">
<span><?= date('d.m.Y', strtotime($event['event_date'])) ?></span>
<?php endif; ?>
<div class="short-list-item p-3" onclick="window.location.href='calendar.php'">
<div class="flex justify-between items-center">
<span class="truncate flex-1 text-white text-sm">
<?= htmlspecialchars($event['title']) ?>
</span>
<?php if (!empty($event['start_time'])): ?>
<span class="text-blue-400 text-xs ml-2">
<?= substr($event['start_time'], 0, 5) ?>
</span>
<?php endif; ?>
</div>
</div>
<?php endforeach; ?>
Expand All @@ -942,7 +951,7 @@
</div>
<?php endif; ?>
</div>

<div class="mt-6">
<button onclick="window.location.href='calendar.php'" class="quick-action-btn w-full px-4 py-2">
Neuer Termin
Expand Down Expand Up @@ -1129,10 +1138,10 @@ class="quick-action-btn px-3 py-2 text-sm"

<div class="flex justify-between items-center">
<span class="text-white/80 text-sm">Termine</span>
<span class="text-white font-semibold"><?= count($upcomingEvents ?? []) ?></span>
<span class="text-white font-semibold"><?= count($upcomingEvents) ?></span>
</div>
<div class="progress-bar">
<div class="progress-fill bg-gradient-to-r from-purple-500 to-purple-400" style="width: <?= min(100, count($upcomingEvents ?? []) * 20) ?>%"></div>
<div class="progress-fill bg-gradient-to-r from-purple-500 to-purple-400" style="width: <?= min(100, count($upcomingEvents) * 20) ?>%"></div>
</div>

<div class="mt-6">
Expand Down
73 changes: 48 additions & 25 deletions templates/widgets/calendar_widget.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,19 +3,35 @@
requireLogin();
require_once __DIR__.'/../../src/lib/db.php';

// Fetch upcoming events for the current user
$stmt = $pdo->prepare("
SELECT e.*, u.username AS creator_name
FROM events e
LEFT JOIN users u ON u.id = e.created_by
WHERE (e.assigned_to = ? OR e.created_by = ?)
AND e.event_date >= CURDATE()
ORDER BY e.event_date ASC
LIMIT 5
");
$stmt->execute([$user['id'], $user['id']]);
// Fetch upcoming events starting today
$today = new DateTimeImmutable('today');
$stmt = $pdo->prepare(
"SELECT e.*, u.username AS creator_name
FROM events e
LEFT JOIN users u ON u.id = e.created_by
WHERE (e.assigned_to = ? OR e.created_by = ?)
AND e.event_date >= ?
ORDER BY e.event_date ASC, IFNULL(e.start_time, '') ASC
LIMIT 10"
);
$stmt->execute([
$user['id'],
$user['id'],
$today->format('Y-m-d')
]);
$upcomingEvents = $stmt->fetchAll(PDO::FETCH_ASSOC);

// Group events by date
$eventsByDate = [];
foreach ($upcomingEvents as $event) {
$date = $event['event_date'];
if (!isset($eventsByDate[$date])) {
$eventsByDate[$date] = [];
}
$eventsByDate[$date][] = $event;
}
$todayEvents = $eventsByDate[$today->format('Y-m-d')] ?? [];

// Get total event count for current month
$stmt = $pdo->prepare("
SELECT COUNT(*) as total
Expand Down Expand Up @@ -43,29 +59,36 @@ class="widget-button px-3 py-1 text-xs bg-white/10 border border-white/20 text-w
</div>

<div class="flex justify-between items-center mb-6">
<h2 class="text-white/90 text-xl font-semibold">Kalender</h2>
<h2 class="text-white/90 text-xl font-semibold">
<?= date('l, d.m.') ?>
</h2>
<div class="text-right">
<div class="text-xs text-white/60 mb-1">Termine</div>
<div class="text-lg font-bold text-white/90"><?= count($upcomingEvents ?? []) ?></div>
<div class="text-xs text-white/60 mb-1">heute</div>
<div class="text-lg font-bold text-white/90"><?= count($todayEvents) ?></div>
</div>
</div>

<div class="widget-scroll-container flex-1">
<div id="dashboardEventList" class="widget-scroll-content space-y-2">
<?php if (!empty($upcomingEvents)): ?>
<?php $currentDate = ''; ?>
<?php foreach ($upcomingEvents as $event): ?>
<?php if ($currentDate !== $event['event_date']): ?>
<?php $currentDate = $event['event_date']; ?>
<div class="text-white/60 text-xs mt-3">
<?= date('D d.m', strtotime($currentDate)) ?>
</div>
<?php endif; ?>
<div class="widget-list-item p-3 bg-white/5 border border-white/10 rounded-lg transition-all duration-300 hover:bg-white/10 hover:border-white/20 hover:transform hover:translateX-1 cursor-pointer" onclick="window.location.href='calendar.php'">
<div class="flex justify-between items-start">
<div class="flex-1 min-w-0">
<div class="task-title text-sm truncate text-white/90">
<?= htmlspecialchars($event['title']) ?>
</div>
<?php if (!empty($event['description'])): ?>
<div class="task-description text-xs truncate text-white/60">
<?= htmlspecialchars($event['description']) ?>
</div>
<?php endif; ?>
</div>
<div class="flex justify-between items-center">
<span class="truncate flex-1 text-white text-sm">
<?= htmlspecialchars($event['title']) ?>
</span>
<?php if (!empty($event['start_time'])): ?>
<span class="text-blue-400 text-xs ml-2">
<?= substr($event['start_time'],0,5) ?>
</span>
<?php endif; ?>
</div>
</div>
<?php endforeach; ?>
Expand Down