ui: Display score grid in team page

configs/nginx/base/demo.conf

@@ -150,6 +150,13 @@ server {
             expires epoch;
             add_header Cache-Control no-cache;
         }
+        location /scores.json {
+            include fic-auth.conf;
+
+            root /srv/TEAMS/$team/;
+            expires epoch;
+            add_header Cache-Control no-cache;
+        }
         location = /events.json {
             root /srv/TEAMS/;
             expires epoch;

configs/nginx/base/docker.conf

@@ -136,6 +136,13 @@ server {
             expires epoch;
             add_header Cache-Control no-cache;
         }
+        location /scores.json {
+	    include    fic-get-team.conf;
+
+            root       ${PATH_TEAMS}/$team/;
+            expires    epoch;
+            add_header Cache-Control no-cache;
+        }
         location /teams.json {
             root       ${PATH_TEAMS};
             expires    epoch;

configs/nginx/base/prod.conf

@@ -140,6 +140,13 @@ server {
             expires epoch;
             add_header Cache-Control no-cache;
         }
+        location /scores.json {
+            include fic-get-team.conf;
+
+            root /srv/TEAMS/$team/;
+            expires epoch;
+            add_header Cache-Control no-cache;
+        }
         location = /events.json {
             root /srv/TEAMS/;
             expires epoch;

frontend/ui/src/components/ScoreGrid.svelte

@@ -0,0 +1,84 @@
+<script>
+ import {
+     Badge,
+     CardBody,
+     Column,
+     Icon,
+     Table,
+ } from 'sveltestrap';
+
+ import DateFormat from '../components/DateFormat.svelte';
+
+ import { my } from '../stores/my.js';
+ import { themes } from '../stores/themes.js';
+
+ let req = null;
+ function refresh_scores() {
+     req = fetch('scores.json', {headers: {'Accept': 'application/json'}}).then((data) => data.json());
+ }
+ refresh_scores();
+
+ export { className as class };
+ let className = '';
+</script>
+
+{#await req}
+    <CardBody>
+        Veuillez patienter &hellips;
+    </CardBody>
+{:then scores}
+    {#if scores}
+        <Table class="mb-0" hover striped rows={scores} let:row>
+            <Column header="Heure">
+                <DateFormat date={new Date(row.time)} />
+            </Column>
+            <Column header="Raison">
+                {#if row.reason == "Validation"}
+                    <Badge color="success"><Icon name="check" /></Badge>
+                    Étape validée
+                {:else if row.reason == "First blood"}
+                    <Badge color="light"><Icon name="trophy" /></Badge>
+                    Bonus premier sang
+                {:else if row.reason == "Bonus flag"}
+                    <Badge color="danger"><Icon name="flag-fill" /></Badge>
+                    Flag bonus complété
+                {:else if row.reason == "Tries"}
+                    <Badge color="warning"><Icon name="backspace" /></Badge>
+                    Malus nombre de tentatives
+                {:else if row.reason == "Hint"}
+                    <Badge color="info"><Icon name="lightbulb" /></Badge>
+                    Indice dévoilé
+                {:else if row.reason == "Display choices"}
+                    <Badge color="secondary"><Icon name="info-square" /></Badge>
+                    Échange champ de texte contre liste de choix
+                {:else}
+                    <Badge color="primary"><Icon name="question" /></Badge>
+                    {row.reason}
+                {/if}
+                {#if row.id_exercice && $my.exercices[row.id_exercice]}
+                    sur <a href="/{$themes[$my.exercices[row.id_exercice].theme_id].urlid}/{$themes[$my.exercices[row.id_exercice].theme_id].exercices[row.id_exercice].urlid}">
+                        {$themes[$my.exercices[row.id_exercice].theme_id].exercices[row.id_exercice].title}
+                    </a>
+                {/if}
+            </Column>
+            <Column header="Détail">
+                <span title="Valeur initiale (cette valeur est fixe)">{Math.trunc(10*row.points)/10}</span> &times; <span title="Coefficient multiplicateur (il varie selon les événements en cours sur la plateforme)">{row.coeff}</span>
+            </Column>
+            <Column header="Points">
+                {Math.trunc(10*row.points * row.coeff)/10}
+            </Column>
+        </Table>
+    {:else}
+        Vous n'avez fait aucune action vous faisant gagner ou perdre des points.
+    {/if}
+    <button class="btn btn-primary" on:click={refresh_scores}>
+        <Icon name="arrow-clockwise" />
+    </button>
+{:catch error}
+    <CardBody>
+        Une erreur s'est produite: {JSON.stringify(error)}
+    </CardBody>
+    <button class="btn btn-primary" on:click={refresh_scores}>
+        <Icon name="arrow-clockwise" />
+    </button>
+{/await}

frontend/ui/src/routes/edit.svelte

@@ -13,12 +13,14 @@
      Alert,
      Badge,
      Card,
+     CardHeader,
      Col,
      Container,
      Icon,
      Row,
  } from 'sveltestrap';
 
+ import ScoreGrid from '../components/ScoreGrid.svelte';
  import TeamChangeName from '../components/TeamChangeName.svelte';
  import TeamMembers from '../components/TeamMembers.svelte';
 
@@ -45,6 +47,13 @@
             {/if}
             </Col>
             <Col md>
+            <Card>
+                <CardHeader>
+                    <Icon name="table" />
+                    Détail du score
+                </CardHeader>
+                <ScoreGrid />
+            </Card>
             <!--BrowserNotify /-->
             </Col>
         </Row>