People › Manage Learner
🎬 Simulate:

Manage Learner

National Training Institute
Name Email Faculty Major Student ID Affiliation Date
Somchai Phommasack somchai.p@example.com Engineering Engineering Technology TVET-2023-015 2025-09-01
Bounsong Keolakhone bounsong.k@example.com Business Administration Accounting TVET-2023-028 2025-09-03
Naly Southivong naly.s@example.com Information Technology Computer Science TVET-2023-041 2025-09-10
Khamla Vongkhamphanh khamla.v@example.com Agriculture Agricultural Technology TVET-2023-052 2025-10-15

Screen Flow (uc-idp-28-manage-learner-to-institution.flow.puml):

→ 2A confirmed / cancelled → dialog closes, list refreshes (SCR-IDP.70) → 2B close / 2C confirmed / cancelled → dialog closes, returns to list (SCR-IDP.70) → end (navigate away) → [*]
📝 Spec notes — UC-IDP.28 / SCR-IDP.70 + SCR-IDP.67 + SCR-IDP.69 + SCR-IDP.68 (fields, actions, requirements)
Identity
  • Screen: SCR-IDP.70 — Manage Learner (page — UC entry)
  • Use case: UC-IDP.28 — Manage Learner to Institution
Brief description

This page is the learner administration view for a specific institution, accessible from the My Institution navigation group. It displays a table of all learners currently affiliated with the institution, showing each learner's full name, email address, faculty, major, student ID (for this institution), and affiliation date. A search bar with Search and Clear buttons above the table allows the admin to filter the enrolled learner list by name, email address, or student ID — the filter is applied when the admin clicks Search or presses Enter; clicking Clear resets the filter and restores the full list. An Add Learner button at the top opens SCR-IDP.67. Each row has a View button (opens SCR-IDP.69) and a Remove button (opens SCR-IDP.68). Access is scope-enforced per SS-IDP.31.

Fields
  • learner_name "Name" — text · computed: User.firstname + User.lastname · always · read-only · region: Learner list
  • email "Email" — text · LearnerProfile.email · always · read-only · region: Learner list
  • faculty "Faculty" — text · Faculty.name via InstituteLearner.faculty_id · always · read-only · region: Learner list
  • major "Major" — text · Major.name via InstituteLearner.major_id · always · read-only · region: Learner list
  • student_id "Student ID" — text · InstituteLearner.student_id · always · read-only · region: Learner list
  • affiliation_date "Affiliation Date" — date · InstituteLearner.affiliated_date · always · read-only · region: Learner list
  • empty_state_message "No enrolled learners" — text · literal · read-only · region: Empty state · visible when: learner_list.count == 0 && search_query == ""
  • search_query "Search" — text · no data_ref · always visible · placeholder: "Search by name, email, or student ID" · max_length: 200 · region: Page header · filter applied on Search click or Enter keypress
  • no_results_message "No learners found matching your search" — text · literal · read-only · region: Empty state · visible when: learner_list.count == 0 && search_query != ""
Actions
  • add_learner "+ Add Learner" — always enabled · opens SCR-IDP.67 dialog · triggers UC-IDP.28-A-2A-1
  • view_profile "View" — per-row, always enabled · opens SCR-IDP.69 read-only dialog · triggers UC-IDP.28-A-2B-1
  • remove_learner "Remove" — per-row, always enabled · opens SCR-IDP.68 confirmation dialog · triggers UC-IDP.28-A-2C-1
  • search_filter "Search" — always enabled · fires when Admin clicks Search or presses Enter · triggers UC-IDP.28-A-2D-1
  • clear_filter "Clear" — enabled when search_query != "" · resets search_query, restores full list · triggers UC-IDP.28-A-2D-1
Additional requirements
  1. The page must display the target institution's name as context so the admin can confirm which institution's learner list they are managing. [refs: SS-IDP.31]
  2. The learner list must auto-refresh (without full page reload) after the Add Learner dialog (SCR-IDP.67) closes on success (AF 2A) and after the Remove confirmation dialog (SCR-IDP.68) closes on success (AF 2C).
  3. The table must include visible column headers and support keyboard navigation in conformance with WCAG 2.1 AA. [refs: NFR-09]

↳ Embedded dialog: SCR-IDP.67 — Add Learner to Institution
Identity
  • Screen: SCR-IDP.67 — Add Learner to Institution (dialog — embedded in SCR-IDP.70)
  • Spec file: scr-idp-67-add-learner-to-institution.yaml (detailed)
  • Use case: UC-IDP.28 AF 2A
Brief description

Inline row editor dialog for adding one or more registered Learners to the current institution. Admin clicks "+ Add" to append a blank row. Each row has: (1) an autocomplete field to search and select a registered Learner by name or email, (2) a Faculty dropdown (global vocabulary, required before Major can be chosen), (3) a Major dropdown (Active Majors under the selected faculty per SS-IDP.33; resets when Faculty changes), (4) a Student ID input, (5) a × remove button. Multiple rows can be added before confirming. Learners already affiliated with the institution appear as disabled options and cannot be selected. A Learner selected in one row is also disabled in all other rows to prevent duplicates. The Save button (labelled "Save (N)") is enabled only when all rows have a selected Learner, Faculty, Major, and a non-empty, institution-unique Student ID.

Fields
  • row_learner "Select Learner" — enum (per-row autocomplete) · LearnerProfile.id · required when row exists · option text: User.firstname + User.lastname + User.email · already-affiliated learners and learners selected in other rows shown as disabled
  • row_faculty_id "Faculty" — enum (per-row dropdown) · InstitutionLearner.faculty_id · required when row exists · options: global Faculty vocabulary A–Z · enabled after Learner selected · when Faculty changes, Major resets
  • row_major_id "Major" — enum (per-row dropdown) · InstitutionLearner.major_id · required when row exists · options: Active Majors under selected Faculty (SS-IDP.33), sorted A–Z · enabled after Faculty selected · resets when Faculty changes
  • row_student_id "Student ID" — text (per-row) · InstitutionLearner.student_id · required when row exists · max_length: 100 · must be unique within institution and batch · enabled after Major selected
Actions
  • add_row "+ Add" — always enabled · appends a new blank row to the Learner Entries list · triggers: (none)
  • remove_row "×" — per-row, always enabled · removes the row; removed Learner becomes selectable in other rows again · triggers: (none)
  • confirm "Save (N)" — enabled when all rows have selected Learner, Faculty, Major, and non-empty Student ID · triggers UC-IDP.28-A-2A-3
  • cancel "Cancel" — always enabled · triggers UC-IDP.28-A-2A-3 (closes dialog, no changes)
Additional requirements
  1. A Learner already affiliated with the current institution appears as a disabled (greyed-out) option in the autocomplete and cannot be selected.
  2. A Learner selected in one row is shown as disabled in all other rows' autocomplete dropdowns to prevent duplicate entries in the same batch.
  3. Each row's autocomplete shows the Learner's full name and email address as option text to help the Admin identify the correct person.
  4. The Save button label dynamically reflects the number of completed rows — "Save (N)". Disabled when no rows exist or any row has an unselected Learner, Faculty, Major, or an empty Student ID.
  5. All Student IDs entered must be unique within the target institution — no Student ID already assigned to an enrolled learner, and no two rows in the same batch may share the same Student ID. Conflicts are highlighted inline on the affected rows; Save button remains disabled until resolved.
  6. The Major dropdown shows only Active Majors under the selected Faculty (SS-IDP.33), sorted A–Z. When Faculty changes, Major is cleared and re-populated. [refs: SS-IDP.33]
↳ Embedded dialog: SCR-IDP.69 — Enrolled Learner Profile
Identity
  • Screen: SCR-IDP.69 — Enrolled Learner Profile (dialog — embedded in SCR-IDP.70)
  • Spec file: scr-idp-69-enrolled-learner-profile.yaml (detailed)
  • Use case: UC-IDP.28 AF 2B
Brief description

A read-only dialog displaying a learner's profile as viewed by an Administrator from the enrolled learners list. Presents full name, contact information (email and mobile), the student ID, faculty, and major assigned to this learner at the current institution, and a table of all institutions the learner is affiliated with (each showing the per-institution student ID, faculty, major, and enrollment date). All information is read-only. The row for the current institution is visually distinguished with a "[Current]" badge.

Fields
  • full_name "Full Name" — text · computed: [User.firstname, User.lastname] via LearnerProfile.user_id · read-only · region: Learner Identity
  • email "Email" — text · LearnerProfile.email · read-only · region: Contact Information
  • mobile "Mobile" — phone · LearnerProfile.mobile · read-only · region: Contact Information
  • student_id "Student ID" — text · InstituteLearner.student_id · read-only · current institution context only (AR-2) · region: Enrollment at This Institution
  • faculty "Faculty" — text · Faculty.name via InstituteLearner.faculty_id · read-only · current institution context only · region: Enrollment at This Institution
  • major "Major" — text · Major.name via InstituteLearner.major_id · read-only · current institution context only · region: Enrollment at This Institution
  • affiliation_institution_name "Institution" — text · Institute.name via InstituteLearner.institute_id · read-only · table column · region: All Affiliations
  • affiliation_student_id "Student ID" — text · InstituteLearner.student_id · read-only · table column · region: All Affiliations
  • affiliation_faculty "Faculty" — text · Faculty.name via InstituteLearner.faculty_id · read-only · table column · region: All Affiliations
  • affiliation_major "Major" — text · Major.name via InstituteLearner.major_id · read-only · table column · region: All Affiliations
  • affiliation_enrolled_at "Enrollment Date" — date · InstituteLearner.enrolled_at · read-only · table column · region: All Affiliations
Actions
  • close "Close" — always enabled · triggers UC-IDP.28-A-2B-2 · data-bs-dismiss="modal"
Additional requirements
  1. All fields are read-only — no inline editing is permitted from this dialog.
  2. The student ID, faculty, and major in "Enrollment at This Institution" are specific to the current institution context — only the InstituteLearner record for the institution whose enrolled learners list triggered this dialog. A learner affiliated with multiple institutions may have different values at each. [refs: SS-IDP.31]
  3. In the All Affiliations table, the row for the current institution (per SS-IDP.31 scope) must be visually distinguished — e.g. a "[Current]" badge or highlighted row style. [refs: SS-IDP.31]
↳ Embedded dialog: SCR-IDP.68 — Remove Learner from Institution Confirmation
Identity
  • Screen: SCR-IDP.68 — Remove Learner from Institution Confirmation (dialog — embedded in SCR-IDP.70)
  • Spec file: scr-idp-68-remove-learner-from-institution-confirmation.yaml (detailed)
  • Use case: UC-IDP.28 AF 2C
Brief description

Confirmation dialog shown when the Admin clicks Remove for a Learner in the enrolled learners list (SCR-IDP.70), reached via UC-IDP.28 AF 2C. Displays the selected Learner's full name and the current institution name so the Admin can verify the action before proceeding. A warning message makes clear that only the Learner's affiliation with this institution will be removed — the Learner's platform account and any other institution affiliations remain fully intact.

Fields
  • learner_display_name "Learner" — text · param.learner_name (User.firstname + User.lastname via LearnerProfile; passed from calling page row) · always · read-only
  • institution_display_name "Institution" — text · param.institution_name (Institute.name; from calling page context — SCR-IDP.70) · always · read-only
Actions
  • confirm_remove "Confirm Remove" — always enabled · triggers UC-IDP.28-A-2C-2 · styled as danger (btn-danger) per AR-2
  • cancel "Cancel" — always enabled · triggers UC-IDP.28-A-2C-1 (closes dialog, no changes)
Additional requirements
  1. The dialog must clearly state that only the Learner's affiliation with this institution will be removed — the Learner's platform account and any other institution memberships remain unaffected. Suggested copy: "This will remove [Learner Name]'s affiliation with [Institution Name] only. The learner's affiliations with other institutions are not affected."
  2. The Confirm Remove button must be visually styled as a destructive (danger) action to reduce the risk of accidental confirmation.