ui: Display grades works

ui/src/components/SurveyList.svelte

@@ -88,6 +88,8 @@
                                       <div class="spinner-border spinner-border-sm" role="status"></div>
                                   {:then score}
                                       {score.score}
+                                  {:catch error}
+                                      <i class="bi text-warning bi-exclamation-triangle-fill" title={error}></i>
                                   {/await}
                               </td>
                           {/if}

ui/src/lib/users.js

@@ -61,7 +61,7 @@ export async function getUserNeedingHelp() {
 }
 
 export async function getScore(survey) {
-  const res = await fetch(`api/surveys/${survey.id}/score`, {headers: {'Accept': 'application/json'}})
+  const res = await fetch(survey.kind === "w" ? `api/works/${survey.id}/score` : `api/surveys/${survey.id}/score`, {headers: {'Accept': 'application/json'}})
   if (res.status == 200) {
     return await res.json();
   } else {

ui/src/lib/works.js

@@ -87,6 +87,18 @@ export class Work {
       }
     }
   }
+
+  async getGrades() {
+    const res = await fetch(`api/works/${this.id}/grades`, {
+      method: 'GET',
+      headers: {'Accept': 'application/json'},
+    });
+    if (res.status == 200) {
+      return await res.json();
+    } else {
+      throw new Error((await res.json()).errmsg);
+    }
+  }
 }
 
 export async function getWorks() {

ui/src/routes/works/[wid]/index.svelte

@@ -16,6 +16,7 @@
  import { user } from '../../../stores/user';
  import SurveyBadge from '../../../components/SurveyBadge.svelte';
  import WorkAdmin from '../../../components/WorkAdmin.svelte';
+ import { getScore } from '../../../lib/users';
 
  export let work = null;
 </script>
@@ -30,5 +31,58 @@
 
     {#if $user && $user.is_admin}
         <WorkAdmin work={w} on:saved={() => edit = false} />
+
+        <hr>
+        <h3 class="mt-3">Notes</h3>
+        <div class="card mt-3 mb-5">
+            {#await w.getGrades()}
+                <div class="text-center">
+                    <div class="spinner-border text-primary mx-3" role="status"></div>
+                    <span>Chargement des notes &hellip;</span>
+                </div>
+            {:then grades}
+                <table class="table table-hover table-striped mb-0">
+                    <thead>
+                        <tr>
+                            <th>Login</th>
+                            <th>Note</th>
+                            <th>Commentaire</th>
+                            <th>Date de la note</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {#if !grades}
+                            <div class="text-center">
+                                Aucune note n'a encore été envoyée pour ce travail.
+                            </div>
+                        {:else}
+                            {#each grades as grade, gid (grade.id)}
+                                <tr>
+                                    <td>
+                                        <a href="users/{grade.id_user}">{grade.login}</a>
+                                    </td>
+                                    <td>{grade.score}</td>
+                                    <td>{#if grade.comment}{grade.comment}{:else}-{/if}</td>
+                                    <td>{grade.date}</td>
+                                </tr>
+                            {/each}
+                        {/if}
+                    </tbody>
+                </table>
+            {/await}
+        </div>
+    {:else}
+        {#await getScore(w)}
+            <div class="spinner-border spinner-border-sm" role="status"></div>
+        {:then grade}
+            <div class="alert alert-info">
+                <strong>Note finale&nbsp;:</strong> <span title="Établie le {grade.date}">{grade.score}</span> {#if grade.comment}&ndash; {grade.comment}{/if}
+            </div>
+        {:catch error}
+            <div class="alert alert-danger">
+                <i class="bi text-warning bi-exclamation-triangle-fill" title={error}></i>
+                <strong>{error.message}</strong>
+            </div>
+        {/await}
     {/if}
 {/await}

ui/src/routes/works/index.svelte

@@ -83,6 +83,8 @@
                                         <div class="spinner-border spinner-border-sm" role="status"></div>
                                     {:then score}
                                         {score.score}
+                                    {:catch error}
+                                        <i class="bi text-warning bi-exclamation-triangle-fill" title={error}></i>
                                     {/await}
                                 </td>
                             {/if}