Tests: Einstiegsseite (5PT)

fbufbi commented 3 years ago

Aufklappbarer Kopfbereich (klappt immer für alle Tests auf): Details der Tests anzeigen, eigene Tests mit Status "in Arbeit" bearbeiten (hier: eingeloggt als Gerber Michael)

Mobile: Einstieg über Liste der Anlässe => Sofern Tests vorhanden sind, wird der neuste Test angezeigt
Pfeil nach links => zurück auf Liste der Anlässe
Klick auf Icon Plus => Tests erfassen
Klick auf Icon PDF => Report
- Report ist immer aktiv, hat aber erst Inhalt, wenn mind. für 1 Test Noten erfasst wurden
- IdReport 290044 wird im settings.js gespeichert
- GET /Files/CrystalReports/Anlass/{settings.TestsByCourseReportId}?ids={Id}&token={token}
336 Berechnung gesamthafter Mittelwert und Durchschnitt: Noten (grade), die ein String sind, werden bei der Berechnung ignoriert (String-Noten sind Texteinträge wie "besucht", "dispensiert", "keine Note")
Klick auf Name und Mittelwert #337

Tabelle:

Die Tabelle lässt sich nach allen Spalten mit Labels sortieren.
- Nach Punkten muss nicht unbedingt sortiert werden können, da sie äquivalent zur Note sind (=> Lösung umsetzen, die technisch am einfachsten ist)
- Es wird alphanumerisch sortiert (Erwartung: bei absteigender Sortierung zuerst Noten, dann Texteinträge alphabetisch, dann leere Werte)
Desktop: Die Spaltenbreite ist für alle Tests gleich, so dass Punkte und Noten Platz haben. Bei Tests ohne Punkte rückst die Notenspalte nach vorne, die Spaltenbreite ändert sich aber nicht.
Der Kopfbereich der Tabelle lässt sich aufklappen, um Details der Tests anzuzeigen und eigene Tests mit Status "in Arbeit" zu bearbeiten. Desktop: Der Kopfbereich wird für alle Tests aufgeklappt, wenn er für einen geöffnet wird.
- Desktop: Bezeichnung des Tests wird in gesamter Länge angezeigt (keine Ellipsierung), Höhe nicht beschränkt. Ist ein Wort länger als die Spaltenbreite, wird das Wort umgebrochen.
- Das prozentuale Verhältnis des Faktors zu den anderen Tests wird auf 2 Nachkommastellen gerundet. Ganze Zahlen als solches ausgeben (16.67%, 25%). Bei den Punkten wird - sofern vorhanden - die korrigierte Punktzahl ausgeführt, sonst die maximale Punktzahl
- Die Lehrperson wird auf einer Zeile dargestellt und ellipsiert
- Test bearbeiten über den Stift. Der Stift ist nur sichtbar, wenn der Status des Tests "in Arbeit" ist und der Test von der eingeloggten Person erfasst wurde.
Status publiziert:
- Keine Bearbeitung des Tests mehr möglich (Stift nicht angezeigt).
- Alle Spalten Punkte/Noten ausgegraut und nicht mehr bearbeitbar.
- Der Status selber ist in der secondary color und weiterhin klickbar, um einen Test wieder in Bearbeitung zu nehmen.

Endpunkt

GET /Courses/{Id}?expand=ParticipatingStudents,EvaluationStatusRef,Tests,Gradings,FinalGrades
Option Filter (Alle Tests oder Meine Tests): Meine > Tests[].IsOwner === true
Dropdown Tests Auswahl: Tests[].Designation
Dropdown Notenskala: GET /GradingScales/{Tests.[id].GradingScaleId} wennTests.[id].IsPointGrading === true => GradingScales read only
Details zum Test: {Tests.[id]
- Designation
- Date
- Weight
- IsPointGrading === true => (MaxPoints/MaxPointsAdjusted)
- Owner
- IsPublished

Sobald man zurück auf diese Seite kommt, müssen die Daten neu geladen werden.

fbufbi commented 2 years ago

@mfehlmann IdReport 290044, in der Beschreibung ergänzt

caebr commented 2 years ago

@schefbi Welche Ids müssen beim Report mitgeschickt werden?

schefbi commented 2 years ago

@schefbi Welche Ids müssen beim Report mitgeschickt werden?

@caebr Die Id des Courses.

caebr commented 2 years ago

Es sind nicht Buttons, sondern Schaltflächen: Siehe https://getuikit.com/docs/filter#reset-filter Wird so schon im Evento-Modul gebraucht.

schefbi commented 2 years ago

@mfehlmann im Task #336 unter Mittelwert und Durchschnitt: findest du die Berechnung. Der Mittelwert pro Lernende wird vom Backend noch nicht korrekt übertragen. Das wird am 08.02.2022 auf Testumgebung korrigiert.

fbufbi commented 2 years ago

@mburri Gehe ich richtig in der Annahme, dass nun nach allen Spalten mit einem Titel sortiert werden kann, also auch nach der Spalte Punkte? Ich würde in dem Fall im Desktop-Mockup noch den Titel "Punkte" ergänzen (kommt im Mockup nur bei Test 5 vor), damit die Logik dieselbe ist wie bei Mobile.

mburri commented 2 years ago

@fbufbi

Ich denke es braucht den "Begriff" Punkte eigentlich nicht - es handelt sich ja um eine lineare Transformation Punkte -> Note. D.h. ob ich nach Punkte oder Note sortiere ergibt ja die gleiche Sortieren - darum ist es ja einerlei, auf was der Benutzer klickt - er muss lediglich nach dieser Spalte sortieren können. Und für uns sind Punkte und Note in der gleichen Spalte. Ich frage mich auch - wenn in der Desktop Ansicht jetzt "Punkte" ergänzt wird - müsste man dann nicht auch "Note" hinschreiben? und dann den Namen des Tests oben drüber? Aber selbstverständlich könnten wir das so implementieren.

fbufbi commented 2 years ago

@mburri Wie heute im Daily besprochen verzichten wir überall auf das Label "Punkte" und sortieren nicht danach. Es reicht die Sortierung nach der Note, da diese ja den Punkten entspricht. Ich werde das Mockup Mobile nach der UX-Besprechung anpassen.

pmurkowsky commented 2 years ago

Neue Version wie heute mit @fbufbi besprochen.

333-Desktop-zugeklappt

333-Desktop-aufgeklappt

333-Mobile-zugeklappt

mburri commented 2 years ago

@fbufbi und @pmurkowsky : was passiert beim Aufklappen des Tabellenheaders in der Desktop Ansicht: wird der Header für alle Spalten aufgeklappt oder nur für diejenige die man angeklickt hat?

fbufbi commented 2 years ago

@fbufbi und @pmurkowsky : was passiert beim Aufklappen des Tabellenheaders in der Desktop Ansicht: wird der Header für alle Spalten aufgeklappt oder nur für diejenige die man angeklickt hat?

@mburri Der Tabellenheader wird für alle Spalten aufgeklappt und die Tabelle darunter wird als ganzes nach unten geschoben. Ich arbeite heute an den Mockups und werde sie im Laufe des Tages bei allen betroffenen Tasks austauschen und allenfalls die Beschreibung aktualisieren.

fbufbi commented 2 years ago

@mburri: vgl. Mockups oben

Mobile:

[ ] Das Dropdown muss auf die Breite des Elements beschränkt sein, lange Fächernamen umbrechen
[x] Der Name ist zwar ein Link, aber nicht blau.
[x] Der Mittelwert hat eine kleinere Schrift (analog "Offene Absenzen" in der Präsenzkontrolle)
[x] Die unterste Zeile heisst "Durchschnitt" und hat zusätzlich einen kleinen Mittelwert darunter wie bei den Schüler/innen

Desktop:

[x] Die Spalte "Name" darf breiter sein

mburri commented 2 years ago

[x] Sortierung nach Punkte/ Note funktioniert nicht mehr
[x] Reihenfolge der Tests: Absteigend nach Datum sortieren
[x] Mobile: Im Dropdown die zusätzliche Option "Note" ergänzen um die Gesamtnote des Schülers anzuzeigen

mburri commented 2 years ago

[ ] Im Dropdown muss nach der Option "Note" noch ein Querstrich ergänzt werden

caebr commented 2 years ago

@fbufbi Ich habe mir das mit den Dropdowns kurz im Smartphone-Simulator angeschaut. Es ist also tatsächlich so, dass die Texte nach der Änderung (auf das Dropdown analog zum Multiselect) auch auf mobile abgeschnitten werden.

Somit würden wir die Änderung rückgängig machen und wieder die Implementation wie bei "Absenzen bearbeiten" verwenden. Ok?

fbufbi commented 2 years ago

@caebr Könnt ihr nicht einfach den inline-style white-space entfernen anstatt das ganze wieder zurückzubauen?

caebr commented 2 years ago

@fbufbi Können schon, aber wir tendieren eher dazu das überall das native Element zu verwenden. Der Aufwand des Rückbaus ist nicht gross. Im Folgenden ein paar Screenshots zur Illustration:

ng-select Jetzige Implementation ohne white-space

select-neu Natives Select-Element

select Heutige Implementation "Absenzen bearbeiten" (Natives Element)

Was meinst du?

fbufbi commented 2 years ago

@caebr Die Aussage der Screenshots ist mir nicht ganz klar. Meint ihr damit, dass das native Element praktisch genau so aussieht wie das jetzige Dropdown ohne white-space und es damit gut einsetzbar wäre? Wenn das so ist, ihr das native Element bevorzugt und der Rückbau mit geringem Aufwand verbunden ist, dann ist dieser für mich i.O.

caebr commented 2 years ago

@fbufbi Mit dem nativen Element würde es so aussehen wie Screenshot 2 (was analog zur heutigen Darstellung bei "Absenzen bearbeiten" ist). Dein Vorschlag würde aussehen wie Scrennshot 1.

fbufbi commented 2 years ago

@caebr Das native Element ist ok, wenn ihr das bevorzugt.

fbufbi commented 2 years ago

@mburri Wir erhalten einen Decode Error, wenn folgende Felder leer sind: Geburtsdatum, Adresse. Dann lässt sich die Seite mit den Tests nicht aufrufen. Beispiel l1, Fach Französisch-S2, 22a (ID Anlass 9248).

mburri commented 2 years ago

@fbufbi es sind verschiedene Properties plötzlich leer - ich habe diese jetzt auf Optional gestellt - kann es sein dass neue Daten oder ein Hotfix eingespielt wurde?

fbufbi commented 2 years ago

@fbufbi es sind verschiedene Properties plötzlich leer - ich habe diese jetzt auf Optional gestellt - kann es sein dass neue Daten oder ein Hotfix eingespielt wurde?

@mburri Ich habe zwei Datensätze erfasst, bei denen verschiedene Properties leer sind. Auch wenn jemand kein Geburtsdatum oder keine Adresse haben sollte (was natürlich kaum passiert), müssen die Tests angezeigt werden können. Diese Decode Errors sind für uns immer wieder ein Problem, siehe auch https://github.com/bkd-mba-fbi/webapp-schulverwaltung/issues/228

mburri commented 2 years ago

@fbufbi es sind verschiedene Properties plötzlich leer - ich habe diese jetzt auf Optional gestellt - kann es sein dass neue Daten oder ein Hotfix eingespielt wurde?

@mburri Ich habe zwei Datensätze erfasst, bei denen verschiedene Properties leer sind. Auch wenn jemand kein Geburtsdatum oder keine Adresse haben sollte (was natürlich kaum passiert), müssen die Tests angezeigt werden können. Diese Decode Errors sind für uns immer wieder ein Problem, siehe auch #228

Ja, das verstehe ich - aber läuft jetzt die app wieder?

fbufbi commented 2 years ago

@mburri Ja, die App läuft wieder.

fbufbi commented 2 years ago

@mburri In der mobilen Ansicht sollte der Mittelwert in einer kleineren Schriftgrösse angezeigt werden analog dem roten Text "Offene Absenzen" im Absenzenwesen > Präsenzkontrolle (l1, Lektion Klassenstunde, 22a vom 02.05.)

fbufbi commented 2 years ago

@mburri Der Report sollte (zumindest mit Edge) in einem separaten Tab geöffnet werden => Analog Absenzenwesen > Auswertung (z.B. Klasse 22a mit l1). Zurzeit öffnet es den Report im gleichen Tab.

mfehlmann commented 2 years ago

@mburri Der Report sollte (zumindest mit Edge) in einem separaten Tab geöffnet werden => Analog Absenzenwesen > Auswertung (z.B. Klasse 22a mit l1). Zurzeit öffnet es den Report im gleichen Tab.

Done

fbufbi commented 2 years ago

@mburri

Mobile: Die Ansicht ist sehr unschön, es sollte alles auf den Screen passen ohne scrollen nach rechts
Desktop: In der Tabelle ist das Label Note verschoben, wenn es ein Test Typ Punkte ist:
Mobil & Desktop: Die graue Linie zuunterst unter dem Durchschnitt ist zu kurz (sie kann auch ganz weggelassen werden, wenn das einfacher ist)

caebr commented 2 years ago

@mburri

1. Mobile: Die Ansicht ist sehr unschön, es sollte alles auf den Screen passen ohne scrollen nach rechts
   ![image](https://user-images.githubusercontent.com/49237948/168307658-d4f03ed6-ec1a-4a55-be55-647873038fc8.png)

2. Desktop: In der Tabelle ist das Label Note verschoben, wenn es ein Test Typ Punkte ist:
   ![image](https://user-images.githubusercontent.com/49237948/168307994-1d38c052-3298-4120-882a-95dce247eb34.png)

3. Mobil & Desktop: Die graue Linie zuunterst unter dem Durchschnitt ist zu kurz (sie kann auch ganz weggelassen werden, wenn das einfacher ist)
   ![image](https://user-images.githubusercontent.com/49237948/168308264-1139f697-4956-43e5-9492-b8387d099939.png)

@fbufbi Die Punkte 2 und 3 sind gemacht und auf master.

Beim Punkt 1 ist es etwas schwierig, da haben wir mit dem aktuellen Layout nicht so viel Spielraum. Die Felder Punkte und Note können nicht kleiner sein (wegen dem potenziellen Inhalt); man könnte höchstens den Namen ellipsieren und ein bisschen Padding entfernen, aber halt auch nur beschränkt.

fbufbi commented 2 years ago

@caebr Punkt 1: Ja, der Name kann stärker ellipsiert werden. Am Padding würde ich nichts ändern, wenn nicht unbedingt nötig (oder wir schauen das morgen am Daily an, wie es ausschauen würde).

caebr commented 2 years ago

@fbufbi

mobile-tests

Hier mal ein Versuch (nur kurz zusammengehackt). Das wäre jetzt mit einem Mobile mit Width: 412. Was verwendest du als Richtgrösse?

Wir können das morgen besprechen.

fbufbi commented 2 years ago

@caebr Zwischen der Box Punkte & Note könnt ihr die margin noch auf 1rem reduzieren (bisher 1.5)

caebr commented 2 years ago

@fbufbi Also ich habe mal einen Vorschlag versucht zu machen, der ohne grösseren Umbau des Layouts in den verschiedenen Browsern in den Grössen 375 - 414 mehr oder weniger ok aussehen sollte.

fbufbi commented 2 years ago

@mburri Die Einschränkung auf "Meine Tests" funktioniert nicht richtig: Der Header (mit den Angaben zu Bezeichnung, Faktor, Lehrperson) bleibt stehen, während die Spalten in der Tabelle mit den Noten und Punkte korrekt verschwinden. Beispiel mit l1 / l4 für das Fach Französisch-S2, 22a (ID Anlass 9248):

fbufbi commented 2 years ago

@fbufbi Also ich habe mal einen Vorschlag versucht zu machen, der ohne grösseren Umbau des Layouts in den verschiedenen Browsern in den Grössen 375 - 414 mehr oder weniger ok aussehen sollte.

@caebr Den Ansatz finde ich sehr gut! Die Ausführung muss noch optimiert werden und es gibt side effects. Hier meine Darstellung mit 414 px:

Bild 1, und 3: Test mit Noten => Die Darstellung wurde in vielen Ansichten schmaler, auch in der Absenzenverwaltung (offene Absenzen, Details zu den Absenzen). Zudem klebt der Spinner nun immer links.
Bild 1: Der Kopfbereich braucht zu viel Platz und ist nicht schöne ausgerichtet. Bitte so wie in Bild 3 mit Icon oben rechts im Kreuz. Grundsätzlich: Die grauen Linien der Tabelle müssen ganz durchgezogen sein.
Bild 4: Test mit Punkte => Der Abstand rechts ist nicht ganz ausgeschöpft, könnte bis zur rot gestrichelten Linie gehen. Grundsätzlich: Die grauen Linien der Tabelle müssen ganz durchgezogen sein.
Bild 5: Note => sollte nur mit Notenspalte sein, also analog Bild 1. Den Mittelwert braucht es hier nicht, dieser steht ja unter dem Namen. Ausserdem wird hier die unterste grauen Linie halb abgeschnitten (im Screen unter Zurfluh), bitte Linie durchziehen. Grundsätzlich: Die grauen Linien der Tabelle müssen ganz durchgezogen sein.

fbufbi commented 2 years ago

@mburri In der Tabelle (Desktop) erscheint zwischen Note und Mittelwert eine sekrechte graue Linie auf der Zeile, auf der man sich gerade befindet.

mburri commented 2 years ago

@fbufbi Wir können den Fehler nicht nachvollziehen - kann es sein, dass das Problem an der Integration in eurer Umgebung liegt? Wir haben getestet mit Chrome, Firefox, Edge

caebr commented 2 years ago

d 5: Note => sollte nur mit Notenspalte sein, also analog Bild 1. Den Mittelwert braucht es hier nicht, dieser steht ja unter dem Namen. Ausserdem wird hier die unterste grauen Linie halb abgeschnitten (im Screen unter Zur

@fbufbi @schefbi Bild 1-4 konnte ich nicht nachvollziehen. Die Punkte in Bild 5 werden wir angehen.

schefbi commented 2 years ago

@fbufbi 1-4 war ein Problem mit dem Beta. Wurde jetzt gelöst.

fbufbi commented 2 years ago

@schefbi Fehlt uns eine Einschränkung auf den Status der Anmeldung der Lernenden? GYM l2 Fach Deutsch-S1, 22a => viele LL sind sistiert, werden aber trotzdem angezeigt.

schefbi commented 2 years ago

@schefbi Fehlt uns eine Einschränkung auf den Status der Anmeldung der Lernenden? GYM l2 Fach Deutsch-S1, 22a => viele LL sind sistiert, werden aber trotzdem angezeigt.

Issue erfasst bei SLH ging vergessen. Ich habe explizit angenommen, dass es mit dieser Beziehung vorhanden ist.

=> Wird in #425 bearbeitet.

fbufbi commented 2 years ago

Test OK, Einschränkung auf den Status der Anmeldungen folgt in #425

bkd-mba-fbi / webapp-schulverwaltung

Tests: Einstiegsseite (5PT) #333

336 Berechnung gesamthafter Mittelwert und Durchschnitt: Noten (grade), die ein String sind, werden bei der Berechnung ignoriert (String-Noten sind Texteinträge wie "besucht", "dispensiert", "keine Note")