4. Niveau- / categorie-modals
In deze mockup/schermafbeelding zijn twee afzonderlijke modals in één gecombineerde schets weergegeven. Functioneel gaat het echter om twee verschillende views met een eigen doel, eigen invoervelden en eigen regels. Om die reden worden zij in de onderliggende subhoofdstukken apart uitgewerkt. Dit voorkomt dat velddefinities, waardelagen en requirements van beide modals onnodig door elkaar gaan lopen.
4.1 Modal - Nieuw niveau
4.1.1 Schermafbeelding

4.1.2 Scherm meta data
| Veld | Waarde |
|---|---|
| Scherm-ID | SCH-DOC-02-02 |
| Schermnaam | Niveau- / categorie-modals - Nieuw niveau |
| Doelgroep / onderdeel | Docent |
| Bronbestand | oefenhub_docent_02B_niveau_categorie_modals_v1_11.html |
| Mockupversie | V1.11 |
| Screenshotbestand | oefenhub_docent_02B_niveau_categorie_modals_v1_11.png |
| Processtap / context | Modal behorend bij Oefenaanbod > Niveaus en categorieën; docent maakt vanuit de structuurweergave een nieuw niveau aan. |
| Documentatiestatus | Uitgewerkt op basis van HTML-mockup, PNG-screenshot, Functioneel Ontwerp, Technisch Ontwerp en Software Requirements Specification en afgeleide architectuur-/databroncontext. |
| Opmerkingen | Dit hoofdstuk documenteert uitsluitend de modal Nieuw niveau. Informatie over Nieuwe categorie is afgesplitst naar hoofdstuk 4.2. Generieke header-, profiel-, berichten- en footercomponenten worden centraal beschreven in hoofdstuk 1 en worden hier niet opnieuw volledig uitgewerkt. |
| Route / URL-patroon | Functioneel geopend vanuit docentcontext: Oefenaanbod > Niveaus en categorieën > actie Nieuw niveau. |
| Autorisatie / vereiste rol-context | Actieve docentcontext. |
| Primair domeinobject / hoofdentiteit | TeacherLevel. |
| Gerelateerde schermen / navigatie | 03_niveaus_en_categorieen, 12_collaborator, 13_eigenaarschap_overdragen, 11_autoriseer_niveau. |
4.1.3 Functionele beschrijving
Deze modal ondersteunt het aanmaken van een nieuw niveau binnen de actieve docentcontext. De mockup toont hiervoor een compacte create-flow met drie functionele onderdelen: naam, beschrijving en zichtbaarheid.
Bij aanmaak van een niveau worden minimaal de volgende functionele keuzes vastgelegd:
- de naam van het niveau;
- een optionele beschrijving;
- de zichtbaarheid Open of Privé.
De mockup maakt expliciet duidelijk dat een nieuw niveau automatisch de ingelogde docent als actuele eigenaar krijgt. Daarnaast is Open de standaardkeuze, terwijl Privé als direct alternatief beschikbaar is.
Deze modal ondersteunt nog geen aanvullende beheerstappen zoals:
- collaborators kiezen;
- leerlingen aan niveau koppelen;
- eigenaarschap overdragen;
- categorieën toevoegen.
Die vervolgstappen horen functioneel bij de vervolgschermen rond het geselecteerde niveau en worden dus bewust niet in deze create-modal gecombineerd.
De toelichting onder het zichtbaarheidselement sluit aan op de docentstructuur:
- Open niveaus zijn zichtbaar voor andere docenten en kunnen, waar toegestaan, door leerlingen zelf gekozen worden;
- Privé niveaus zijn niet algemeen zichtbaar en blijven beperkt tot eigenaar en actief gekoppelde collaborators.
De mockup toont geen aparte bevestigingsmodal of foutdialoog. Sluiten kan via het sluitkruis of via Annuleren. Validatie- en opslagregels worden daarom functioneel afgeleid, maar zijn niet als afzonderlijke foutstaten in de mockup zichtbaar.
4.1.4 UI-elementen en velddefinities
| Element-ID | Type | GUI-verwijzing | Omschrijving | Zichtbaar label | Opmerking | Technische naam |
|---|---|---|---|---|---|---|
| SCH-DOC-02-02-S01 | S | Pagina > modalvoorbeelden | Sectie waarin de voorbeeldmodal voor nieuw niveau wordt getoond. | Voorbeeldmodals | Inleidende mockupsectie; dit hoofdstuk documenteert alleen de linker modal. | ModalPreviewSection |
| SCH-DOC-02-02-MOD01 | MOD | Linker modal | Modal voor het aanmaken van een nieuw niveau. | Nieuw niveau | Wordt geopend vanuit actie Nieuw niveau op het overzichtsscherm. | CreateLevelModal |
| SCH-DOC-02-02-FORM01 | FORM | MOD01 > formulier | Formuliercontainer voor het aanmaken van een nieuw niveau. | n.v.t. | Submit-context voor naam, beschrijving en zichtbaarheid. | CreateLevelForm |
| SCH-DOC-02-02-F01 | F | MOD01 > invoerveld | Vrij invoerveld voor de naam van het nieuwe niveau. | Naam van het niveau | Verplicht veld. | LevelNameInput |
| SCH-DOC-02-02-H01 | H | MOD01 > toelichting F01 | Hinttekst met voorbeeldnaamgeving voor het niveau. | Vrije naamgeving, bijvoorbeeld Groep 7, Klas 2026 - Groep 7 of Rekenen plusgroep. | Ondersteunt invoer zonder vaste template. | LevelNameHint |
| SCH-DOC-02-02-F02 | F | MOD01 > tekstvak | Vrij tekstvak voor een optionele beschrijving van het niveau. | Beschrijving | Ondersteunt langere toelichting. | LevelDescriptionTextarea |
| SCH-DOC-02-02-H02 | H | MOD01 > toelichting F02 | Hinttekst bij de beschrijving. | Optionele toelichting die zichtbaar kan worden in het blok ‘Geselecteerd niveau’. | Verduidelijkt hergebruik van de beschrijving elders in de UI. | LevelDescriptionHint |
| SCH-DOC-02-02-RAD01 | RAD | MOD01 > zichtbaarheid | Radiokeuze voor open zichtbaarheid. | Open | Standaard geselecteerde keuze in de mockup. | LevelVisibilityOpenRadio |
| SCH-DOC-02-02-RAD02 | RAD | MOD01 > zichtbaarheid | Radiokeuze voor privé-zichtbaarheid. | Privé | Exclusieve alternatief op Open. | LevelVisibilityPrivateRadio |
| SCH-DOC-02-02-H03 | H | MOD01 > toelichting zichtbaarheid | Uitleg over functioneel verschil tussen open en privé. | Open niveaus zijn zichtbaar voor andere docenten en kunnen door leerlingen zelf gekoppeld worden waar toegestaan. Privé-niveaus zijn alleen zichtbaar voor de eigenaar en actief gekoppelde collaborators. | Functionele toelichting, geen foutmelding. | LevelVisibilityHint |
| SCH-DOC-02-02-B01 | B | MOD01 > footer | Annuleert het aanmaken van een nieuw niveau en sluit de modal. | Annuleren | Secundaire actie. | CancelCreateLevelButton |
| SCH-DOC-02-02-B02 | B | MOD01 > footer | Maakt een nieuw niveau aan binnen docentcontext. | Aanmaken | Primaire submitactie van MOD01. | SubmitCreateLevelButton |
| SCH-DOC-02-02-B03 | B | MOD01 > kop | Sluit de modal zonder opslaan. | × | Sluitkruis rechtsboven. | CloseCreateLevelModalButton |
4.1.5 Waardelagen
| Element-ID | GUI-verwijzing | Zichtbaar label | Technische naam | Databron | Waardebron | Datatype | Bewerkbaar | Validatie / regel |
|---|---|---|---|---|---|---|---|---|
| SCH-DOC-02-02-MOD01 | Linker modal | Nieuw niveau | CreateLevelModal | Geen persistente zelfstandige databron; UI-container boven op TeacherLevels-createflow | Runtime zichtbaarheid vanuit actie Nieuw niveau op scherm SCH-DOC-02-01 | Modal state / boolean | Nee | Alleen zichtbaar vanuit actieve docentcontext. |
| SCH-DOC-02-02-FORM01 | MOD01 > formulier | n.v.t. | CreateLevelForm | TeacherLevels (aanmaakcontext: naam, beschrijving, zichtbaarheid, actuele eigenaar) | Samengevoegde submitcontext uit F01, F02, RAD01/RAD02 en ingelogde docent | Form object | Ja | Submit alleen geldig wanneer verplichte velden en contextregels slagen. |
| SCH-DOC-02-02-F01 | MOD01 > invoerveld | Naam van het niveau | LevelNameInput | TeacherLevels > Name | Directe gebruikersinvoer | String | Ja | Verplicht; vrije naamgeving; moet functioneel een niveau kunnen identificeren binnen docentstructuur. |
| SCH-DOC-02-02-H01 | MOD01 > toelichting F01 | Vrije naamgeving, bijvoorbeeld Groep 7, Klas 2026 - Groep 7 of Rekenen plusgroep. | LevelNameHint | Geen persistente databron; statische schermuitleg | Vaste hinttekst vanuit schermconfiguratie / content | String | Nee | Uitleg ondersteunt invoer, maar wordt niet opgeslagen als domeinwaarde. |
| SCH-DOC-02-02-F02 | MOD01 > tekstvak | Beschrijving | LevelDescriptionTextarea | TeacherLevels > Description | Directe gebruikersinvoer | String / tekst | Ja | Optioneel; langere toelichting toegestaan. |
| SCH-DOC-02-02-H02 | MOD01 > toelichting F02 | Optionele toelichting die zichtbaar kan worden in het blok ‘Geselecteerd niveau’. | LevelDescriptionHint | Geen persistente databron; statische schermuitleg | Vaste hinttekst vanuit schermconfiguratie / content | String | Nee | Hint legt hergebruik uit, niet de opslag zelf. |
| SCH-DOC-02-02-RAD01 | MOD01 > zichtbaarheid | Open | LevelVisibilityOpenRadio | TeacherLevels > VisibilityType / IsOpen | Standaard runtime-keuze in formulier | Enum / boolean-optie | Ja | Open is standaardwaarde bij nieuw niveau. |
| SCH-DOC-02-02-RAD02 | MOD01 > zichtbaarheid | Privé | LevelVisibilityPrivateRadio | TeacherLevels > VisibilityType / IsOpen | Alternatieve runtime-keuze in formulier | Enum / boolean-optie | Ja | Wederzijds exclusief met Open. |
| SCH-DOC-02-02-H03 | MOD01 > toelichting zichtbaarheid | Open niveaus zijn zichtbaar voor andere docenten en kunnen door leerlingen zelf gekoppeld worden waar toegestaan. Privé-niveaus zijn alleen zichtbaar voor de eigenaar en actief gekoppelde collaborators. | LevelVisibilityHint | Geen persistente databron; statische schermuitleg | Vaste uitlegtekst in de modal | String | Nee | Verduidelijkt functionele impact van de keuze Open/Privé. |
| SCH-DOC-02-02-B02 | MOD01 > footer | Aanmaken | SubmitCreateLevelButton | TeacherLevels + auditregistratie bij niveau-aanmaak | Submit-actie op CreateLevelForm | Action / command | Ja | Zet actuele eigenaar automatisch op ingelogde docent; niveau krijgt bij aanmaak minimaal naam, beschrijving en zichtbaarheid mee. |
| SCH-DOC-02-02-B01 | MOD01 > footer | Annuleren | CancelCreateLevelButton | Geen persistente databron | Runtime UI-state | Action / command | Ja | Sluit de modal zonder persistente wijziging. |
| SCH-DOC-02-02-B03 | MOD01 > kop | × | CloseCreateLevelModalButton | Geen persistente databron | Runtime UI-state | Action / command | Ja | Sluit de modal zonder persistente wijziging. |
4.1.6 Schermtrace naar SRS en acceptatiecriteria
De onderstaande tabel legt per schermrequirement de koppeling naar het centrale schermrequirements-trace-register, SRS-requirements en acceptatiecriteria vast. De normatieve requirementtekst staat in de SRS; dit schermdocument beschrijft alleen de lokale schermcontext.
Deze tabel bevat alleen schermtraceability. De normatieve requirementtekst en acceptatiecriteria staan centraal in de SRS.
| Schermrequirement | Dekt | Schermcontext |
|---|---|---|
REQ-SCH-DOC-02-02-01 | SRS-TCH-008 AC-TCH-008 | Vanuit het scherm Niveaus en categorieën een modal Nieuw niveau kunnen openen binnen actieve docentcontext |
REQ-SCH-DOC-02-02-02 | SRS-TCH-008 AC-TCH-008 | De modal Nieuw niveau minimaal de velden naam, beschrijving en zichtbaarheid bevatten |
REQ-SCH-DOC-02-02-03 | SRS-TCH-008 AC-TCH-008 | Bij het aanmaken van een nieuw niveau de ingelogde docent automatisch als actuele eigenaar van dat niveau worden vastgelegd |
REQ-SCH-DOC-02-02-04 | SRS-TCH-008 AC-TCH-008 | De standaard zichtbaarheid van een nieuw niveau Open zijn, met Privé als direct selecteerbaar alternatief |
REQ-SCH-DOC-02-02-05 | SRS-TCH-008 AC-TCH-008 | Een open niveau functioneel verschillen van een privé-niveau conform de docentstructuurregels; deze zichtbaarheid al bij aanmaak vastgelegd worden |
REQ-SCH-DOC-02-02-06 | SRS-TCH-008 AC-TCH-008 | De beschrijving van een niveau optioneel zijn en functioneel herbruikbaar zijn in niveau-overzichten of detailblokken |
REQ-SCH-DOC-02-02-07 | SRS-TCH-008 AC-TCH-008 | De modal Nieuw niveau mag geen aanvullende beheerstappen zoals collaborators, leerlingkoppelingen of categoriebeheer combineren in dezelfde aanmaakflow |
REQ-SCH-DOC-02-02-08 | SRS-TCH-001 AC-TCH-001 | Zowel het sluitkruis als de knop Annuleren de modal zonder persistente wijziging kunnen sluiten |
REQ-SCH-DOC-02-02-09 | SRS-TCH-001 AC-TCH-001 | De uiteindelijke technische validatie en foutafhandeling van de create-flow aansluiten op de algemene formulier- en opslagarchitectuur van OefenHub en hoeft niet volledig visueel in deze mockup aanwezig te zijn |
REQ-SCH-DOC-02-02-10 | SRS-NFR-AUD-001 SRS-TCH-008 AC-NFR-AUD-001 AC-TCH-008 | Van aanmaak van een nieuw niveau herleidbaar zijn wie en wanneer de actie heeft uitgevoerd |
4.2 Modal - Nieuwe categorie
4.2.1 Schermafbeelding

4.2.2 Scherm meta data
| Veld | Waarde |
|---|---|
| Scherm-ID | SCH-DOC-02-03 |
| Schermnaam | Niveau- / categorie-modals - Nieuwe categorie |
| Doelgroep / onderdeel | Docent |
| Bronbestand | oefenhub_docent_02B_niveau_categorie_modals_v1_11.html |
| Mockupversie | V1.11 |
| Screenshotbestand | oefenhub_docent_02B_niveau_categorie_modals_v1_11.png |
| Processtap / context | Modal behorend bij Oefenaanbod > Niveaus en categorieën; docent koppelt een bestaande centrale categorie aan het geselecteerde niveau of maakt een nieuwe centrale categorie aan en koppelt die direct. |
| Documentatiestatus | Uitgewerkt op basis van HTML-mockup, PNG-screenshot, Functioneel Ontwerp, Technisch Ontwerp en Software Requirements Specification en afgeleide architectuur-/databroncontext. |
| Opmerkingen | Dit hoofdstuk documenteert uitsluitend de modal Nieuwe categorie. Informatie over Nieuw niveau is afgesplitst naar hoofdstuk 4.1. Generieke header-, profiel-, berichten- en footercomponenten worden centraal beschreven in hoofdstuk 1 en worden hier niet opnieuw volledig uitgewerkt. |
| Route / URL-patroon | Functioneel geopend vanuit docentcontext: Oefenaanbod > Niveaus en categorieën > actie Nieuwe categorie. |
| Autorisatie / vereiste rol-context | Actieve docentcontext. |
| Primair domeinobject / hoofdentiteit | Central Category plus TeacherLevelCategory-koppeling binnen het geselecteerde TeacherLevel. |
| Gerelateerde schermen / navigatie | 03_niveaus_en_categorieen, 12_collaborator, 13_eigenaarschap_overdragen, 11_autoriseer_niveau. |
4.2.3 Functionele beschrijving
Deze modal ondersteunt de actie Nieuwe categorie binnen een geselecteerd niveau. De mockup toont bewust één dialoog met twee routes:
- een bestaande centrale categorie koppelen aan het huidige niveau;
- een nieuwe centrale categorie aanmaken en die direct aan het huidige niveau koppelen.
De linker kolom ondersteunt hergebruik van een bestaande centrale categorie. De docent kiest daar een record uit de centrale lijst en ziet vervolgens een preview van de gekozen categorie-identiteit. De mockup benadrukt dat in deze route exact dezelfde naam, kleur en icoonidentiteit aan het niveau worden gekoppeld.
De rechter kolom ondersteunt het aanmaken van een volledig nieuwe centrale categorie. Daarbij legt de docent minimaal vast:
- naam van de categorie;
- achtergrondkleur;
- icoon.
Deze modal stuurt functioneel op het voorkomen van doublures:
- eerst wordt links hergebruik van een bestaande centrale categorie aangeboden;
- rechts wordt expliciet aangegeven dat een nieuwe categorie alleen bedoeld is wanneer de gewenste categorie nog niet bestaat;
- onder het formulier wordt extra gewaarschuwd voor semantische doublures in naamgeving.
De mockup maakt daarnaast expliciet duidelijk dat elke categorie openbaar is. Een nieuwe categorie wordt dus onderdeel van het centrale categoriemodel en kan ook door andere docenten in andere niveaus gebruikt worden. De docent maakt hier functioneel geen privé-categorie aan.
De bestaande-categorieroute en de nieuwe-categorieroute blijven onderdeel van dezelfde modal, maar hebben ieder een eigen primaire actie:
- Kies bestaande categorie;
- Nieuwe aanmaken.
Onderaan staat één centrale actie Annuleren voor het sluiten van de modal zonder wijziging. Daarnaast is er een sluitkruis rechtsboven.
De mockup toont geen aparte technische foutstatussen of bevestigingsdialogen. Validatie, opslag en audit worden daarom functioneel afgeleid uit de bredere docentstructuur, het centrale categoriemodel en de algemene opslagarchitectuur.
4.2.4 UI-elementen en velddefinities
| Element-ID | Type | GUI-verwijzing | Omschrijving | Zichtbaar label | Opmerking | Technische naam |
|---|---|---|---|---|---|---|
| SCH-DOC-02-03-S01 | S | Pagina > modalvoorbeelden | Sectie waarin de voorbeeldmodal voor categoriebeheer wordt getoond. | Voorbeeldmodals | Inleidende mockupsectie; dit hoofdstuk documenteert alleen de rechter, brede modal. | ModalPreviewSection |
| SCH-DOC-02-03-MOD01 | MOD | Brede modal | Modal voor het koppelen van een bestaande categorie of het aanmaken van een nieuwe centrale categorie. | Nieuwe categorie | Wordt geopend vanuit actie Nieuwe categorie op het overzichtsscherm. | CreateOrAttachCategoryModal |
| SCH-DOC-02-03-T01 | T | MOD01 > intro | Inleidende tekst boven beide routes. | Kies links een bestaande centrale categorie om aan dit niveau te koppelen, of maak rechts een volledig nieuwe categorie aan. Elke categorie is openbaar en kan daardoor door meerdere docenten in verschillende niveaus worden gebruikt. | Beschrijft de tweerichtingsflow van de modal. | CategoryModalIntroText |
| SCH-DOC-02-03-S02 | S | MOD01 > linker kolom | Linker sectie voor het kiezen van een bestaande centrale categorie. | Bestaande categorie kiezen | Hergebruikroute binnen de modal. | ExistingCategoryColumn |
| SCH-DOC-02-03-T02 | T | MOD01 > linker kolom | Toelichting op de hergebruikroute. | Selecteer een bestaande categorie uit de centrale lijst. Je koppelt dan exact dezelfde naam, kleur en icoon aan dit niveau. | Uitleg boven de selectielijst. | ExistingCategoryColumnIntro |
| SCH-DOC-02-03-FORM01 | FORM | MOD01 > linker kolom | Selectiecontext voor het koppelen van een bestaande centrale categorie aan het niveau. | n.v.t. | De mockup toont een keuzelijst, preview en één bevestigingsknop. | AttachExistingCategoryForm |
| SCH-DOC-02-03-F01 | F | MOD01 > keuzelijst | Scrollbare selectielijst met bestaande centrale categorieën. | Bestaande categorieën | Toont o.a. Rekenen, Spelling, Taal, Woordenschat en Begrijpend lezen. | ExistingCategorySelectionList |
| SCH-DOC-02-03-S03 | S | MOD01 > preview | Previewblok van de gekozen centrale categorie. | Geselecteerde categorie | Readonly samenvatting van naam, kleur en icoon. | SelectedCategoryPreview |
| SCH-DOC-02-03-B01 | B | MOD01 > linker kolom | Bevestigt het koppelen van de gekozen bestaande categorie aan het huidige niveau. | Kies bestaande categorie | Primaire actie van de hergebruikroute. | SubmitAttachExistingCategoryButton |
| SCH-DOC-02-03-S04 | S | MOD01 > scheiding | Visuele scheiding tussen beide routes. | n.v.t. | Alleen layoutmatig element. | CategoryRouteDivider |
| SCH-DOC-02-03-S05 | S | MOD01 > rechter kolom | Rechter sectie voor het aanmaken van een nieuwe centrale categorie. | Nieuwe categorie maken | Nieuwe-categorieroute binnen dezelfde modal. | CreateCategoryColumn |
| SCH-DOC-02-03-T03 | T | MOD01 > rechter kolom | Toelichting op de nieuwe-categorieroute. | Gebruik deze optie alleen als de bedoelde categorie nog niet bestaat in de centrale lijst. | Stuurt op beperking van doublures. | CreateCategoryColumnIntro |
| SCH-DOC-02-03-M01 | M | MOD01 > rechter kolom | Informatieve melding dat categorieën openbaar zijn en onderdeel worden van het centrale categoriemodel. | Elke categorie is openbaar. | Geen foutmelding maar functionele waarschuwing/uitleg. | PublicCategoryInfoMessage |
| SCH-DOC-02-03-FORM02 | FORM | MOD01 > rechter kolom | Formuliercontainer voor het aanmaken van een nieuwe centrale categorie. | n.v.t. | Submit-context voor naam, kleur en icoon. | CreateCategoryForm |
| SCH-DOC-02-03-F02 | F | MOD01 > invoerveld | Vrij invoerveld voor de naam van de nieuwe categorie. | Naam van de categorie | Verplicht veld. | CategoryNameInput |
| SCH-DOC-02-03-H01 | H | MOD01 > toelichting F02 | Hinttekst bij de categorienaam. | Controleer eerst links of er al een bestaande categorie met dezelfde bedoeling beschikbaar is. | Stuurt functioneel op hergebruik. | CategoryNameHint |
| SCH-DOC-02-03-F03 | F | MOD01 > kleurkeuze | Keuzecomponent voor de achtergrondkleur van de nieuwe categorie. | Achtergrondkleur | De mockup toont meerdere vaste kleurkeuzes. | CategoryColorChoice |
| SCH-DOC-02-03-H02 | H | MOD01 > toelichting F03 | Hinttekst bij de kleurkeuze. | Naam, kleur en icoon vormen samen de centrale categorie-identiteit. | Verduidelijkt semantische rol van kleur. | CategoryColorHint |
| SCH-DOC-02-03-F04 | F | MOD01 > icoonblok | Keuze-/uploadcomponent voor het categorie-icoon. | Icoon | Mockup ondersteunt upload of keuze van bestaand pictogram. | CategoryIconPicker |
| SCH-DOC-02-03-H03 | H | MOD01 > toelichting F04 | Toelichting bij de icoonkeuze. | Upload een nieuw pictogram of kies een bestaand icoon. Aanbevolen: vierkant icoon met transparante achtergrond. | Richtlijn voor visuele consistentie. | CategoryIconHint |
| SCH-DOC-02-03-M02 | M | MOD01 > onder formulier | Informatieve waarschuwing tegen semantische doublures bij naamgeving. | Let op bij naamgeving. | Ondersteunt de regel om waar mogelijk bestaande centrale categorieën te hergebruiken. | CategoryNamingWarningMessage |
| SCH-DOC-02-03-B02 | B | MOD01 > rechter kolom | Maakt een nieuwe centrale categorie aan en koppelt die direct aan het huidige niveau. | Nieuwe aanmaken | Primaire submitactie van de nieuwe-categorieroute. | SubmitCreateCategoryButton |
| SCH-DOC-02-03-B03 | B | MOD01 > onderzijde | Sluit de categorie-modal zonder koppelen of aanmaken. | Annuleren | Centrale annuleeractie voor de hele modal. | CancelCategoryModalButton |
| SCH-DOC-02-03-B04 | B | MOD01 > kop | Sluit de modal zonder opslaan. | × | Sluitkruis rechtsboven. | CloseCategoryModalButton |
4.2.5 Waardelagen
| Element-ID | GUI-verwijzing | Zichtbaar label | Technische naam | Databron | Waardebron | Datatype | Bewerkbaar | Validatie / regel |
|---|---|---|---|---|---|---|---|---|
| SCH-DOC-02-03-MOD01 | Brede modal | Nieuwe categorie | CreateOrAttachCategoryModal | Geen persistente zelfstandige databron; UI-container boven op TeacherLevelCategories-attachflow en Categories-createflow | Runtime zichtbaarheid vanuit actie Nieuwe categorie op scherm SCH-DOC-02-01 | Modal state / boolean | Nee | Alleen zichtbaar vanuit actieve docentcontext en geselecteerd niveau. |
| SCH-DOC-02-03-T01 | MOD01 > intro | Kies links een bestaande centrale categorie om aan dit niveau te koppelen, of maak rechts een volledig nieuwe categorie aan. Elke categorie is openbaar en kan daardoor door meerdere docenten in verschillende niveaus worden gebruikt. | CategoryModalIntroText | Geen persistente databron; statische schermuitleg | Vaste inleidende tekst in de modal | String | Nee | Legt tweerichtingsflow en openbaar karakter van categorieën uit. |
| SCH-DOC-02-03-S02 | MOD01 > linker kolom | Bestaande categorie kiezen | ExistingCategoryColumn | Geen zelfstandige opslag; UI-sectie boven op centrale Categories-query | Runtime sectieweergave | Section | Nee | Ondersteunt alleen hergebruik van bestaande centrale categorieën. |
| SCH-DOC-02-03-T02 | MOD01 > linker kolom | Selecteer een bestaande categorie uit de centrale lijst. Je koppelt dan exact dezelfde naam, kleur en icoon aan dit niveau. | ExistingCategoryColumnIntro | Geen persistente databron; statische schermuitleg | Vaste toelichting in linker route | String | Nee | Benadrukt dat bestaande identiteit ongewijzigd hergebruikt wordt. |
| SCH-DOC-02-03-FORM01 | MOD01 > linker kolom | n.v.t. | AttachExistingCategoryForm | TeacherLevelCategories (koppeling niveau-categorie) + verwijzing naar bestaand Categories-record | Samengevoegde submitcontext uit F01 en huidig TeacherLevel | Form object | Ja | Submit koppelt bestaande centrale categorie aan geselecteerd niveau. |
| SCH-DOC-02-03-F01 | MOD01 > keuzelijst | Bestaande categorieën | ExistingCategorySelectionList | Categories (Name, Color, Icon, Status) | Query op centrale categoriebron, gefilterd op kiesbare/actieve records | Collectie / selection state | Ja | Docent kiest bestaand centraal record; maakt geen nieuwe identiteit aan. |
| SCH-DOC-02-03-S03 | MOD01 > preview | Geselecteerde categorie | SelectedCategoryPreview | Categories (Name, Color, Icon) | Afgeleide weergave van huidige selectie in F01 | Samengesteld object | Nee | Preview moet exact dezelfde centrale categorie-identiteit tonen als de gekozen record. |
| SCH-DOC-02-03-B01 | MOD01 > linker kolom | Kies bestaande categorie | SubmitAttachExistingCategoryButton | TeacherLevelCategories + verwijzing naar bestaand Categories-record | Submit op basis van geselecteerde Categories-record en huidig TeacherLevel | Action / command | Ja | Koppelt bestaande centrale categorie aan geselecteerd niveau; naam, kleur en icoon blijven afkomstig uit de centrale categoriebron. |
| SCH-DOC-02-03-S05 | MOD01 > rechter kolom | Nieuwe categorie maken | CreateCategoryColumn | Geen zelfstandige opslag; UI-sectie boven op Categories-createflow | Runtime sectieweergave | Section | Nee | Ondersteunt creatie van nieuwe centrale categorie binnen de context van het geselecteerde niveau. |
| SCH-DOC-02-03-T03 | MOD01 > rechter kolom | Gebruik deze optie alleen als de bedoelde categorie nog niet bestaat in de centrale lijst. | CreateCategoryColumnIntro | Geen persistente databron; statische schermuitleg | Vaste toelichting in rechter route | String | Nee | Stuurt docent op beperking van doublures. |
| SCH-DOC-02-03-M01 | MOD01 > rechter kolom | Elke categorie is openbaar. | PublicCategoryInfoMessage | Geen persistente eigen databron; functionele systeemuitleg | Statische uitlegtekst vanuit schermconfiguratie / content | Informatiemelding | Nee | Moet docent erop wijzen dat nieuwe categorieën onderdeel worden van het centrale categoriemodel. |
| SCH-DOC-02-03-FORM02 | MOD01 > rechter kolom | n.v.t. | CreateCategoryForm | Categories (Name, Color, Icon, CreatedBy, CreatedAt) + TeacherLevelCategories (koppeling aan huidig niveau) | Samengevoegde submitcontext uit F02, F03 en F04 binnen geselecteerd niveau | Form object | Ja | Submit leidt functioneel tot aanmaak van nieuwe centrale categorie plus directe koppeling aan huidig niveau. |
| SCH-DOC-02-03-F02 | MOD01 > invoerveld | Naam van de categorie | CategoryNameInput | Categories > Name | Directe gebruikersinvoer | String | Ja | Verplicht; docent moet eerst beoordelen of bestaande centrale categorie al beschikbaar is. |
| SCH-DOC-02-03-H01 | MOD01 > toelichting F02 | Controleer eerst links of er al een bestaande categorie met dezelfde bedoeling beschikbaar is. | CategoryNameHint | Geen persistente databron; statische schermuitleg | Vaste hinttekst vanuit schermconfiguratie / content | String | Nee | Ondersteunt hergebruik en vermindert kans op semantische doublures. |
| SCH-DOC-02-03-F03 | MOD01 > kleurkeuze | Achtergrondkleur | CategoryColorChoice | Categories > Color | Directe gebruikerskeuze uit vooraf aangeboden kleurset | Enum / string | Ja | Naam, kleur en icoon vormen samen de centrale categorie-identiteit. |
| SCH-DOC-02-03-H02 | MOD01 > toelichting F03 | Naam, kleur en icoon vormen samen de centrale categorie-identiteit. | CategoryColorHint | Geen persistente databron; statische schermuitleg | Vaste hinttekst vanuit schermconfiguratie / content | String | Nee | Legt semantische rol van kleur binnen de centrale identiteit uit. |
| SCH-DOC-02-03-F04 | MOD01 > icoonblok | Icoon | CategoryIconPicker | Categories > Icon / IconReference | Directe gebruikerskeuze of upload-keuze binnen de modal | Asset reference / string | Ja | Verplicht onderdeel van categorie-identiteit; mockup adviseert vierkant icoon met transparante achtergrond. |
| SCH-DOC-02-03-H03 | MOD01 > toelichting F04 | Upload een nieuw pictogram of kies een bestaand icoon. Aanbevolen: vierkant icoon met transparante achtergrond. | CategoryIconHint | Geen persistente databron; statische schermuitleg | Vaste hinttekst in uploadblok | String | Nee | Richtlijn voor visuele consistentie, geen zelfstandige domeinwaarde. |
| SCH-DOC-02-03-M02 | MOD01 > onder formulier | Let op bij naamgeving. | CategoryNamingWarningMessage | Geen persistente eigen databron; functionele systeemuitleg | Statische waarschuwingstekst vanuit schermconfiguratie / content | Informatiemelding | Nee | Ondersteunt regel dat semantische doublures door beheer gemigreerd of samengevoegd moeten kunnen worden. |
| SCH-DOC-02-03-B02 | MOD01 > rechter kolom | Nieuwe aanmaken | SubmitCreateCategoryButton | Categories + TeacherLevelCategories + auditregistratie bij tag-/categorieaanmaak | Submit-actie op CreateCategoryForm | Action / command | Ja | Nieuwe categorie wordt centraal aangemaakt, is openbaar en wordt direct aan het huidige niveau gekoppeld. |
| SCH-DOC-02-03-B03 | MOD01 > onderzijde | Annuleren | CancelCategoryModalButton | Geen persistente databron | Runtime UI-state | Action / command | Ja | Sluit de modal zonder aanmaak of koppeling. |
| SCH-DOC-02-03-B04 | MOD01 > kop | × | CloseCategoryModalButton | Geen persistente databron | Runtime UI-state | Action / command | Ja | Sluit de modal zonder aanmaak of koppeling. |
4.2.6 Schermtrace naar SRS en acceptatiecriteria
De onderstaande tabel legt per schermrequirement de koppeling naar het centrale schermrequirements-trace-register, SRS-requirements en acceptatiecriteria vast. De normatieve requirementtekst staat in de SRS; dit schermdocument beschrijft alleen de lokale schermcontext.
Deze tabel bevat alleen schermtraceability. De normatieve requirementtekst en acceptatiecriteria staan centraal in de SRS.
| Schermrequirement | Dekt | Schermcontext |
|---|---|---|
REQ-SCH-DOC-02-03-01 | SRS-TCH-008 AC-TCH-008 | Vanuit het scherm Niveaus en categorieën een modal Nieuwe categorie kunnen openen binnen de context van het geselecteerde niveau |
REQ-SCH-DOC-02-03-02 | SRS-TCH-001 AC-TCH-001 | De categorie-modal twee expliciete routes ondersteunen: een bestaande centrale categorie koppelen of een nieuwe centrale categorie aanmaken |
REQ-SCH-DOC-02-03-03 | SRS-TCH-001 AC-TCH-001 | Bij de route bestaande categorie kiezen het systeem een lijst van bestaande centrale categorieën tonen en een preview van de geselecteerde categorie-identiteit weergeven |
REQ-SCH-DOC-02-03-04 | SRS-TCH-008 AC-TCH-008 | Bij het koppelen van een bestaande categorie exact dezelfde centrale naam-, kleur- en icoonidentiteit aan het niveau worden verbonden |
REQ-SCH-DOC-02-03-05 | SRS-TCH-001 AC-TCH-001 | Bij de route nieuwe categorie maken het systeem minimaal naam, achtergrondkleur en icoon van de nieuwe categorie vastleggen |
REQ-SCH-DOC-02-03-06 | SRS-TCH-001 AC-TCH-001 | De docent expliciet informeren dat nieuwe categorieën openbaar zijn en onderdeel worden van het centrale categoriemodel |
REQ-SCH-DOC-02-03-07 | SRS-TCH-001 AC-TCH-001 | De docent functioneel sturen op hergebruik van bestaande centrale categorieën om onnodige doublures te beperken |
REQ-SCH-DOC-02-03-08 | SRS-TCH-008 AC-TCH-008 | Een nieuw aangemaakte centrale categorie direct aan het huidige niveau gekoppeld kunnen worden als onderdeel van dezelfde gebruikersflow |
REQ-SCH-DOC-02-03-09 | SRS-TCH-001 AC-TCH-001 | De categorie-identiteit bestaan uit minimaal naam, kleur en icoon, zodat dezelfde centrale categorie in meerdere docentcontexten consistent weergegeven kan worden |
REQ-SCH-DOC-02-03-10 | SRS-TCH-001 AC-TCH-001 | De modal een centrale annuleeractie en een sluitkruis bieden waarmee zonder persistente wijziging kan worden afgesloten |
REQ-SCH-DOC-02-03-11 | SRS-NFR-AUD-001 SRS-TCH-001 AC-NFR-AUD-001 AC-TCH-001 | Wanneer een docent een nieuwe categorie met overlappende bedoeling aanmaakt, beheer deze herleidbaar kunnen samenvoegen of migreren naar een bestaande centrale categorie |
REQ-SCH-DOC-02-03-12 | SRS-NFR-AUD-001 SRS-TCH-001 AC-NFR-AUD-001 AC-TCH-001 | Van koppelen van een bestaande categorie en van aanmaak van een nieuwe categorie herleidbaar zijn wie en wanneer de actie heeft uitgevoerd |
REQ-SCH-DOC-02-03-13 | SRS-TCH-001 AC-TCH-001 | De uiteindelijke technische validatie en foutafhandeling van de categorie-modal aansluiten op de algemene formulier- en opslagarchitectuur van OefenHub en hoeft niet volledig visueel in deze mockup aanwezig te zijn |
4.3 Technische koppeling
Voor technische uitwerking zijn vooral relevant:
- 05 Autorisatie, policies en server-side contextcontrole voor bevoegdheidscontrole vóór tonen en opslaan van niveau- en categoriemutaties.
- 08 Oefencatalogus, niveaus, categorieën, oefeningen en modules voor naamvalidatie, status, sorteervolgorde en koppeling tussen niveaus en categorieën.
- 11 Rolflows technisch voor docentrolflows rond eigenaar- en collaboratorbevoegdheden.
- 17 Readmodels, tellers, badges, caching en materialisatie voor herberekening van afgeleide beheer- en frontpagewaarden na mutaties.
- 19 Logging, audit, securitylogging en technische foutafhandeling voor auditbaarheid en foutafhandeling bij beheeracties.
- 24 Frontend, Blazor, routing, state en componentopbouw voor modalgedrag, validatiemeldingen en componentstate.