date-picker/report.php at main · rgzpaul/date-picker · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<?php
// Legge le date salvate
$data = json_decode(file_get_contents('db.json'), true) ?? [];

// Raggruppa per data e raccoglie i nomi
$dateGroups = [];
foreach ($data as $entry) {
  // Supporta sia il nuovo formato (array con date e name) che il vecchio (solo stringa)
  if (is_array($entry) && isset($entry['date'])) {
    $date = $entry['date'];
    $name = $entry['name'] ?? 'Anonimo';
  } else {
    $date = $entry;
    $name = 'Anonimo';
  }

  if (!isset($dateGroups[$date])) {
    $dateGroups[$date] = ['count' => 0, 'names' => []];
  }
  $dateGroups[$date]['count']++;
  if (!in_array($name, $dateGroups[$date]['names'])) {
    $dateGroups[$date]['names'][] = $name;
  }
}

// Ordina per conteggio decrescente
uasort($dateGroups, function($a, $b) {
  return $b['count'] - $a['count'];
});

// Crea il counter per compatibilita
$counter = [];
foreach ($dateGroups as $date => $info) {
  $counter[$date] = $info['count'];
}

// Funzione per formattare la data come "LUN 21/08"
function formatDateItalian($dateStr)
{
  $giorniSettimana = [
    'Mon' => 'LUN',
    'Tue' => 'MAR',
    'Wed' => 'MER',
    'Thu' => 'GIO',
    'Fri' => 'VEN',
    'Sat' => 'SAB',
    'Sun' => 'DOM',
  ];

  // Assicurati che il formato della data sia correttamente interpretato
  // Il formato YYYY-MM-DD che viene salvato da index.php
  $timestamp = strtotime($dateStr);
  if ($timestamp === false) {
    // In caso di problemi con il formato, ritorna la stringa originale
    return $dateStr;
  }

  $giorno = $giorniSettimana[date('D', $timestamp)] ?? date('D', $timestamp);
  $dataFormattata = date('d/m', $timestamp);

  return "$giorno $dataFormattata";
}

// Calcola la data più popolare
$mostPopularDate = !empty($counter) ? key($counter) : null;
$totalVotes = array_sum($counter);
$totalDates = count($counter);

?>
<!DOCTYPE html>
<html lang="it">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Report</title>
  <link href="http://minisoft.it/cdn/icons/collection/idea.png" rel="shortcut icon" type="image/x-icon" />
  <link href="https://prgz.it/datePicker/webclip.png" rel="apple-touch-icon" />
  <script src="https://cdn.tailwindcss.com"></script>
  <script src="https://unpkg.com/lucide@latest"></script>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
  <style>
    body {
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    }

    .card {
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
      border: 1px solid #e2e8f0;
    }

    .btn {
      transition: background-color 0.15s ease;
    }

    @media (max-width: 768px) {
      .card {
        padding: 1.5rem !important;
      }

      .stats-card {
        padding: 1rem !important;
      }

      .date-item {
        padding: 0.75rem !important;
      }
    }
  </style>
</head>

<body class="min-h-screen py-12 px-4 bg-slate-50">
  <div class="max-w-2xl mx-auto">
    <div class="card bg-white p-8 rounded-lg">
      <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-8">
        <h1 class="text-xl font-semibold text-slate-800 flex items-center">
          <i data-lucide="bar-chart-2" class="w-5 h-5 mr-2 text-slate-500"></i>Report
        </h1>

        <a href="index.php" class="btn bg-slate-100 hover:bg-slate-200 text-slate-700 px-4 py-2 rounded-md text-sm font-medium inline-flex items-center justify-center w-full sm:w-auto border border-slate-200">
          <i data-lucide="arrow-left" class="w-4 h-4 mr-2"></i> Indietro
        </a>
      </div>

      <?php if (!empty($counter)): ?>
        <!-- Stats Cards -->
        <div class="grid grid-cols-2 gap-3 mb-6">
          <div class="stats-card bg-slate-50 border border-slate-200 rounded-md p-4">
            <div class="text-xs text-slate-500 mb-1">Date proposte</div>
            <div class="text-2xl font-semibold text-slate-800"><?= $totalDates ?></div>
          </div>

          <?php if ($mostPopularDate): ?>
            <div class="stats-card bg-slate-50 border border-slate-200 rounded-md p-4">
              <div class="text-xs text-slate-500 mb-1">Data scelta</div>
              <div class="text-2xl font-semibold text-slate-800"><?= formatDateItalian($mostPopularDate) ?></div>
            </div>
          <?php endif; ?>
        </div>

        <h2 class="text-sm font-medium text-slate-500 mb-3 uppercase tracking-wide">
          Classifica
        </h2>

        <ul class="space-y-2">
          <?php foreach ($dateGroups as $date => $info): ?>
            <?php
            $count = $info['count'];
            $names = $info['names'];
            $percentage = ($count / $totalVotes) * 100;
            ?>
            <li class="date-item p-3 bg-slate-50 rounded-md border border-slate-200">
              <div class="flex justify-between items-center mb-2">
                <div class="flex items-center">
                  <span class="text-sm font-medium text-slate-700 mr-3">
                    <?= htmlspecialchars(formatDateItalian($date)) ?>
                  </span>
                  <span class="text-xs text-slate-500">
                    <?= $count ?> vot<?= ($count == 1) ? 'o' : 'i' ?>
                  </span>
                </div>
                <span class="text-xs text-slate-400"><?= number_format($percentage, 0) ?>%</span>
              </div>
              <div class="w-full bg-slate-200 rounded-full h-1.5 mb-2">
                <div class="bg-slate-600 h-1.5 rounded-full" style="width: <?= $percentage ?>%"></div>
              </div>
              <div class="flex flex-wrap gap-1.5">
                <?php foreach ($names as $name): ?>
                  <span class="inline-flex items-center text-xs bg-slate-200 text-slate-600 px-2 py-0.5 rounded">
                    <i data-lucide="user" class="w-3 h-3 mr-1"></i><?= htmlspecialchars($name) ?>
                  </span>
                <?php endforeach; ?>
              </div>
            </li>
          <?php endforeach; ?>
        </ul>
      <?php else: ?>
        <div class="bg-slate-50 border border-slate-200 p-6 rounded-md text-center">
          <p class="text-slate-500 text-sm mb-4">Nessun dato disponibile. Non ci sono ancora date selezionate.</p>
          <a href="index.php" class="btn inline-block bg-slate-800 hover:bg-slate-700 text-white px-5 py-2 rounded-md text-sm font-medium">
            Seleziona date
          </a>
        </div>
      <?php endif; ?>
    </div>
  </div>
  <script>lucide.createIcons();</script>
</body>

</html>