+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/tp_portal/stores/studentStore.ts
+import { defineStore } from 'pinia'
+import { StudentAPI } from '@/tp_portal/api/student'
+import type { Student } from '@/types'
+
+export const useStudentStore = defineStore('student', {
+ state: () => ({
+ students: [] as Student[],
+ loading: false,
+ error: null as string | null
+ }),
+
+ actions: {
+ async fetchStudents(cohortId: number): Promise
+
+
+
+
+ Loading cohort details...
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ cohort.name }}
+ + {{ cohort.startDate }} - {{ cohort.endDate }} + +
+
+
+
+
+
+
+
+
+
+
+
+ Workflow Status
+
+
+
+
+ {{ step.number }}
+
+
+ {{ step.title }}
+ {{ step.desc }}
+ Current
+
+
+
+
+
+
+
+
+
+ Students
+
+
+
+
+
+
+
+
+
+
+
+ Pending: {{ statusCounts.pending }}
+ In Progress: {{ statusCounts.in_progress }}
+ Completed: {{ statusCounts.completed }}
+
+
+
+
+
+
+
+
+
+ | Student Name | +Student ID | +Status | +Actions | +|
|---|---|---|---|---|
| {{ student.name }} | +{{ student.email }} | +{{ student.studentId || '-' }} | ++ + {{ student.status.replace('_', ' ') }} + + | ++ + | +
+
+
+ No students found
+Try adjusting your filters or add students to this cohort
+
+
+ Cohort not found
+ +
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/tp_portal/stores/tpSigningStore.ts
+import { defineStore } from 'pinia'
+import { TPSigningAPI } from '@/tp_portal/api/tpSigning'
+import type { FormField, FieldValues, SigningResult } from '@/types'
+
+export const useTPSigningStore = defineStore('tpSigning', {
+ state: () => ({
+ cohort: null as Cohort | null,
+ formFields: [] as FormField[],
+ fieldValues: {} as FieldValues,
+ isComplete: false,
+ loading: false,
+ error: null as string | null
+ }),
+
+ actions: {
+ async loadCohort(cohortId: number): Promise
+
+
+
+
+ TP Signing Phase
+
+ {{ cohort.name }}
+ {{ studentCount }} students
+
+
+
+
+
+
+
+ Signing Progress: {{ signingProgress }}%
+
+
+
+
+
+
+
+ Current Phase: TP Signing
+You are signing the first document. This will be replicated to all {{ studentCount }} students.
+
+ 1. TP Signs
+ 2. Students Sign
+ 3. Sponsor Signs
+ 4. TP Reviews
+
+
+
+
+
+
+
+
+
+
+
+ Document Preview
+
+
+
+
+
+
+
+
+
+
+
+ Document Preview
+ Interactive PDF viewer with form fields +
+
+
+
+ Fill Form Fields
+
+
+
+
+
+
+
+
+
+
+
+ ![Signature]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ⚠️ {{ error }}
+
+
+ ✓ All fields ready for signing
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Signing Complete!
++ Your signature and fields have been replicated to all {{ studentCount }} student documents. +
+
+
+
+
+ What's Next?
+-
+
- Students will receive email invitations +
- Students fill their personal fields +
- Sponsor receives ONE email for the cohort +
- TP reviews all completed documents +
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/tp_portal/stores/studentDetailStore.ts
+import { defineStore } from 'pinia'
+import { StudentAPI } from '@/tp_portal/api/student'
+import type { Student, Upload, AuditEvent } from '@/types'
+
+export const useStudentDetailStore = defineStore('studentDetail', {
+ state: () => ({
+ student: null as Student | null,
+ auditLog: [] as AuditEvent[],
+ loading: false,
+ error: null as string | null
+ }),
+
+ actions: {
+ async loadStudent(cohortId: number, studentId: number): Promise
+
+
+
+
+ Loading student details...
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ student.name }}
+ {{ student.email }} +
+
+
+
+
+
+
+
+
+
+
+ Document Status
+
+
+
+
+
+
+
+
+ Student Document
+
+
+ {{ student.status.replace('_', ' ') }}
+
+
+
+
+
+
+ 1
+ TP Signed
+
+
+ 2
+ Student Filled
+
+
+ 3
+ Sponsor Verified
+
+
+
+
+ Required Uploads
+
+
+
+
+
+
+
+
+
+ {{ upload.label }}
+
+
+ ✓ Uploaded ({{ formatDate(upload.uploadedAt) }})
+
+
+ ⏳ Pending
+
+
+
+
+
+
+
+
+
+
+ Form Field Values
+
+
+
+
+
+
+ {{ formatFieldName(key) }}
+ {{ value || '(empty)' }}
+
+
+ No fields filled yet
+
+
+
+
+ Student Information
+
+
+
+
+ Email
+ {{ student.email }}
+
+
+ Student ID
+ {{ student.studentId || 'N/A' }}
+
+
+ Phone
+ {{ student.phone || 'N/A' }}
+
+
+ Enrolled
+ {{ formatDate(student.createdAt) }}
+
+
+ Audit Log
+
+
+
+
+
+
+
+ {{ event.type }}
+ {{ event.description }}
+ {{ formatDate(event.timestamp) }}
+
+
+ No events recorded yet
+
+
+
+
+
+ Student not found
+The student may have been removed or the link is invalid.
+ +
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/sponsor_portal/stores/sponsorStore.ts
+import { defineStore } from 'pinia'
+import { SponsorAPI } from '@/sponsor_portal/api/sponsor'
+import type { Cohort, Student, SponsorForm } from '@/types'
+
+export const useSponsorStore = defineStore('sponsor', {
+ state: () => ({
+ cohort: null as Cohort | null,
+ students: [] as Student[],
+ loading: false,
+ error: null as string | null,
+ isComplete: false
+ }),
+
+ actions: {
+ async loadCohort(token: string): Promise
+
+
+
+
+ Loading cohort information...
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ cohort.name }}
+ +
+
+
+
+ {{ completedCount }} of {{ totalCount }} students completed
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ student.name }}
+ {{ student.email }}
+
+ ID: {{ student.studentId }}
+
+
+ Pending
+
+
+
+
+ All students completed!
+You can now proceed to the sponsor signing phase.
+
+
+
+
+
+
+
+
+
+ {{ student.name }}
+ {{ student.email }}
+
+ Completed: {{ formatDate(student.completedAt) }}
+
+
+ ✓ Completed
+
+
+
+
+ No completed students yet
+Students will appear here after they complete their portion.
+
+
+
+
+ Sponsor Information
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![Signature]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ⚠️ {{ error }}
+
+
+ ✓ Ready to sign
+
+
+
+
+
+
+
+
+ Sponsor Verification Complete!
++ Your signature and information have been applied to all {{ pendingCount }} pending student documents. +
+
+
+
+
+ What's Happening Now?
+-
+
- Students receive final confirmation +
- Documents are being finalized +
- TP will review and complete the workflow +
+
+
+
+
+
+
+
+
+
+
+
+ Invalid Access Link
++ This sponsor link is invalid or has expired. + Please contact your training provider for a new link. +
+
+
+
+
+
+
+
+
+
+
+
+ Bulk Sign All Documents
++ Review and sign once to apply your signature to all {{ pendingCount }} pending student documents +
+
+
+
+
+
+
+
+
+
+
+ Pending Students ({{ pendingStudents.length }})
+
+
+
+ {{ student.name }} - {{ student.email }}
+
+
+
+ Completed Students ({{ completedStudents.length }})
+
+
+
+ {{ student.name }} - {{ student.email }}
+
+
+
+
+
+
+ Document Preview
+
+
+
+ Generating document preview...
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/sponsor/stores/dashboard.ts
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { CohortAPI } from '@/sponsor/api/cohort'
+import type { CohortData, Student } from '@/sponsor/types'
+
+export const useSponsorDashboardStore = defineStore('sponsorDashboard', {
+ state: () => ({
+ cohort: null as CohortData | null,
+ isLoading: false,
+ error: null as string | null,
+ lastRefresh: null as Date | null
+ }),
+
+ getters: {
+ pendingStudents: (state) => {
+ // Students who have completed their part but not yet signed by sponsor
+ return state.cohort?.students.filter(s => s.status === 'completed_student') || []
+ },
+
+ completedStudents: (state) => {
+ // Students fully completed (including sponsor signature)
+ return state.cohort?.students.filter(s => s.status === 'completed_all') || []
+ },
+
+ totalCount: (state) => {
+ return state.cohort?.students.length || 0
+ },
+
+ completedCount: (state) => {
+ return state.cohort?.students.filter(s => s.status === 'completed_all').length || 0
+ },
+
+ isReadyForSigning: (state) => {
+ return state.cohort?.status === 'ready_for_sponsor'
+ },
+
+ isCompleted: (state) => {
+ return state.cohort?.status === 'completed'
+ }
+ },
+
+ actions: {
+ async fetchCohortData(cohortId: number, token: string): Promise
+
+
+
+
+
+
+ + {{ cohort.name }} +
++ Cohort ID: {{ cohort.id }} | Created: {{ formatDate(cohort.created_at) }} +
+
+
+
+
+ Overall Progress
+ + +
+
+
+
+
+ {{ completedCount }} of {{ totalCount }} students completed
+ {{ progressPercentage }}%
+
+
+
+
+
+
+ {{ statusText }}
+
+
+ All students ready for your signature
+
+
+ All documents signed successfully
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ All students have completed their part!
+You can now proceed with bulk signing
+
+
+
+
+
+
+
+
+
+ {{ student.name.charAt(0).toUpperCase() }}
+
+
+
+ {{ student.name }}
+{{ student.email }}
+
+
+
+ {{ formatStatus(student.status) }}
+
+
+
+ {{ student.progress }}%
+
+
+
+
+
+
+
+
+ No completed students yet
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ student.name }}
+{{ student.email }}
+
+
+ {{ formatStatus(student.status) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ bannerMessage }}
+
+
+ (Expires in {{ timeRemaining }})
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Renewal email sent! Check your inbox for the new access link.
+
+
+
+
+
+ {{ errorMessage }}
+
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/tp/stores/monitor.ts
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { CohortAPI } from '@/tp/api/cohort'
+import type { Cohort, CohortAnalytics, ExportResponse } from '@/tp/types'
+
+export const useTPMonitorStore = defineStore('tpMonitor', {
+ state: () => ({
+ cohorts: [] as Cohort[],
+ isLoading: false,
+ error: null as string | null,
+ isPolling: false,
+ lastRefresh: null as Date | null
+ }),
+
+ getters: {
+ analytics: (state) => {
+ const total = state.cohorts.length
+ const active = state.cohorts.filter(c =>
+ ['in_progress', 'ready_for_sponsor'].includes(c.status)
+ ).length
+ const completed = state.cohorts.filter(c => c.status === 'completed').length
+
+ // Calculate average completion time
+ const completedCohorts = state.cohorts.filter(c => c.status === 'completed')
+ let avgTime = 'N/A'
+
+ if (completedCohorts.length > 0) {
+ const totalMs = completedCohorts.reduce((sum, c) => {
+ if (c.completed_at && c.created_at) {
+ return sum + (new Date(c.completed_at).getTime() - new Date(c.created_at).getTime())
+ }
+ return sum
+ }, 0)
+
+ const avgMs = totalMs / completedCohorts.length
+ const days = Math.floor(avgMs / (1000 * 60 * 60 * 24))
+ const hours = Math.floor((avgMs % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))
+ avgTime = days > 0 ? `${days}d ${hours}h` : `${hours}h`
+ }
+
+ return {
+ totalCohorts: total,
+ activeCohorts: active,
+ completedCohorts: completed,
+ avgCompletionTime: avgTime
+ } as CohortAnalytics
+ },
+
+ pendingCohorts: (state) => {
+ return state.cohorts.filter(c => c.status === 'pending')
+ },
+
+ inProgressCohorts: (state) => {
+ return state.cohorts.filter(c => c.status === 'in_progress')
+ },
+
+ readyForSponsorCohorts: (state) => {
+ return state.cohorts.filter(c => c.status === 'ready_for_sponsor')
+ },
+
+ completedCohorts: (state) => {
+ return state.cohorts.filter(c => c.status === 'completed')
+ }
+ },
+
+ actions: {
+ async fetchCohorts(): Promise
+
+
+
+
+
+
+
+
+
+
+ Cohort Monitor
++ Track all active cohorts and their signing progress in real-time +
+
+
+
+
+
+
+
+
+
+
+ Total Cohorts
+ {{ analytics.totalCohorts }}
+
+
+ Active Now
+ {{ analytics.activeCohorts }}
+
+
+ Completed
+ {{ analytics.completedCohorts }}
+
+
+ Avg Completion Time
+ {{ analytics.avgCompletionTime }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Cohort Name
+ Status
+ Students
+ Progress
+ Last Updated
+ Actions
+
+
+
+
+ No cohorts found
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ cohort.name }}
+ ID: {{ cohort.id }}
+
+
+ {{ formatStatus(cohort.status) }}
+
+
+
+
+
+
+
+
+
+ {{ cohort.student_count }} total
+
+
+ {{ cohort.completed_count }} completed
+
+
+
+
+
+
+
+
+
+
+ {{ cohort.progress }}%
+
+ {{ formatRelativeTime(cohort.last_updated) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ formatStatus(cohort.status) }}
+
+ {{ cohort.name }}
+ ID: {{ cohort.id }}
+
+ Students:
+ {{ cohort.student_count }}
+
+
+ Progress:
+ {{ cohort.progress }}%
+
+
+ Updated:
+ {{ formatRelativeTime(cohort.last_updated) }}
+
+
+
+
+
+
+
+ {{ isPolling ? 'Live updates active' : 'Updates paused' }}
+ ({{ timeSinceLastUpdate }})
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/student/stores/upload.ts
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { SubmissionAPI } from '@/student/api/submission'
+import type { DocumentRequirement, UploadedFile, UploadProgress } from '@/student/types'
+
+export const useStudentUploadStore = defineStore('studentUpload', {
+ state: () => ({
+ requiredDocuments: [] as DocumentRequirement[],
+ uploadedFiles: {} as Record
+
+
+
+
+
+
+
+
+
+ Step 1 of 3: Upload Documents
+ {{ uploadedCount }}/{{ requiredCount }} completed
+
+
+
+
+
+
+
+
+ + Upload Required Documents +
++ Please upload the following documents for your enrollment in {{ cohortName }} +
+
+
+
+
+ Required Documents
+ +
+
+
+
+
+
+
+
+
+
+
+
+ {{ requirement.name }}
+ * +{{ requirement.description }}
++ Accepted: {{ requirement.accepted_types.join(', ') }} | Max: {{ requirement.max_size }}MB +
+
+
+
+
+ Uploaded
+
+
+
+
+
+
+
+
+
+
+
+
+ + + or drag and drop +
+
+
+
+ Uploading...
+ {{ getUploadProgress(requirement.id) }}%
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ getUploadedFile(requirement.id)?.name }}
+
+
+ {{ formatFileSize(getUploadedFile(requirement.id)?.size) }}
+
+
+
+
+
+
+
+ {{ getError(requirement.id) }}
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/student/stores/form.ts
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { SubmissionAPI } from '@/student/api/submission'
+import type { FormField, FormSubmissionData } from '@/student/types'
+
+export const useStudentFormStore = defineStore('studentForm', {
+ state: () => ({
+ fields: [] as FormField[],
+ signatureData: {} as Record
+
+
+
+
+
+
+
+
+
+ Step 2 of 3: Complete Your Fields
+ {{ completedFields }}/{{ totalFields }} completed
+
+
+
+
+
+
+
+
+ + Complete Your Information +
++ Please fill in all required fields below. Your progress is automatically saved. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + {{ field.description }} +
++ {{ errors[field.id] }} +
+
+
+
+
+
+
+ + {{ errors[field.id] }} +
+
+
+
+
+
+
+ + {{ errors[field.id] }} +
+
+
+
+
+
+
+ + {{ errors[field.id] }} +
+
+
+
+
+
+
+
+
+
+
+
+
+ + {{ field.description }} +
++ {{ errors[field.id] }} +
+
+
+
+
+
+
+
+
+
+
+
+ + {{ errors[field.id] }} +
+
+
+
+
+
+
+ + {{ errors[field.id] }} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + {{ errors[field.id] }} +
+
+
+
+
+ + {{ field.description }} +
++ {{ errors[field.id] }} +
+
+
+
+
+
+
+
+
+
+
+ Saving...
+
+
+
+
+
+ Saved
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/student/stores/progress.ts
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { SubmissionAPI } from '@/student/api/submission'
+import type { ProgressData, SaveDraftResponse, SubmitResponse } from '@/student/types'
+
+export const useStudentProgressStore = defineStore('studentProgress', {
+ state: () => ({
+ cohortName: '',
+ uploadProgress: 0,
+ formProgress: 0,
+ step1Completed: false,
+ step2Completed: false,
+ step3Completed: false,
+ submitted: false,
+ lastSaved: null as number | null,
+ hasUnsavedChanges: false,
+ isLoading: false,
+ error: null as string | null
+ }),
+
+ getters: {
+ overallProgressPercent: (state) => {
+ const total = 3
+ const completed = [
+ state.step1Completed,
+ state.step2Completed,
+ state.step3Completed
+ ].filter(Boolean).length
+ return Math.round((completed / total) * 100)
+ }
+ },
+
+ actions: {
+ async fetchProgress(submissionId: number, token: string): Promise
+
+
+
+
+
+
+
+
+
+
+ + Your Submission Progress +
++ Cohort: {{ cohortName }} +
+
+
+ Last Saved
+ {{ lastSavedText }}
+
+
+
+
+ Overall Progress
+ + +
+
+
+
+
+ {{ overallProgress }}% Complete
+ {{ completedSteps }} of {{ totalSteps }} Steps
+
+
+
+
+
+
+ {{ statusText }}
+
+
+ {{ statusDescription }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 1
+
+
+
+ Upload Required Documents
+Government ID, certificates, photos
+
+
+
+
+
+
+
+ {{ uploadProgress }}%
+
+
+ {{ step1Completed ? 'Completed' : 'Pending' }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 2
+
+
+
+ Complete Your Information
+Personal details, signatures, agreements
+
+
+
+
+
+
+
+ {{ formProgress }}%
+
+
+ {{ step2Completed ? 'Completed' : 'Pending' }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 3
+
+
+
+ Review & Submit
+Final review before sponsor signature
+
+
+ {{ step3Completed ? 'Completed' : 'Pending' }}
+
+
+
+
+
+
+ Quick Actions
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Saving draft...
+
+
+
+
+ Draft saved
+
+
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/student/stores/status.ts
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { SubmissionAPI } from '@/student/api/submission'
+import type { SubmissionStatus, DocumentSummary, FieldSummary } from '@/student/types'
+
+export const useStudentStatusStore = defineStore('studentStatus', {
+ state: () => ({
+ cohortName: '',
+ submittedAt: null as string | null,
+ studentCompletedAt: null as string | null,
+ sponsorSigned: false,
+ sponsorSignedAt: null as string | null,
+ tpReviewed: false,
+ tpReviewedAt: null as string | null,
+ isCompleted: false,
+ completedAt: null as string | null,
+ uploadedDocuments: [] as DocumentSummary[],
+ completedFields: [] as FieldSummary[],
+ estimatedCompletion: null as string | null,
+ isLoading: false,
+ error: null as string | null
+ }),
+
+ getters: {
+ currentStatus: (state) => {
+ if (state.isCompleted) return 'completed'
+ if (state.tpReviewed) return 'tp_reviewed'
+ if (state.sponsorSigned) return 'sponsor_signed'
+ if (state.submittedAt) return 'in_review'
+ return 'not_submitted'
+ }
+ },
+
+ actions: {
+ async fetchStatus(submissionId: number, token: string): Promise
+
+
+
+
+
+
+
+
+
+
+
+
+ Submission Successful!
++ Your application has been submitted for sponsor signature. You'll receive email updates as your submission progresses. +
+
+
+
+
+
+
+
+
+ Submission Status
++ Cohort: {{ cohortName }} +
++ Submitted: {{ submittedAt }} +
+
+
+ Current Status
+
+ {{ statusText }}
+
+
+
+
+
+ Progress Timeline
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Student Completed
+ ({{ studentCompletedAt }}) +All documents uploaded and forms completed
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Sponsor Signature +
+ ({{ sponsorSignedAt }}) + Pending ++ {{ sponsorSigned ? 'Sponsor has signed the document' : 'Waiting for sponsor to review and sign' }} +
+
+ Estimated completion: {{ estimatedCompletion }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + TP Final Review +
+ ({{ tpReviewedAt }}) + Pending ++ {{ tpReviewed ? 'Training provider completed final review' : 'Waiting for TP to verify and finalize' }} +
+
+
+
+
+
+
+
+
+
+
+
+ + Final Document Ready +
+ ({{ completedAt }}) ++ {{ isCompleted ? 'Signed document is ready for download' : 'All parties must complete their steps' }} +
+
+
+
+
+ Submission Summary
+ +
+
+
+
+
+
+
+ Uploaded Documents
+
+ No documents uploaded
+
+
+
+
+ {{ doc.name }}
+ {{ formatFileSize(doc.size) }}
+
+
+
+ Completed Fields
+
+ No fields completed
+
+
+
+
+ {{ field.label }}:
+ {{ field.value }}
+
+
+
+
+
+ Email Notifications
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Checking status...
+
+
+
+
+
+ {{ toastMessage }}
+
+
+
+
+
+
+
+
+```
+
+**Email Template Components:**
+```vue
+
+
+
+
+
+
+
+
+
+ Email Notification Preferences
++ Control which emails you receive about your submission in {{ cohortName }} +
+
+
+
+
+ Email Settings
+ +
+
+
+
+
+
+
+
+
+
+ Status Updates
++ Receive emails when your submission status changes +
+
+ Examples: Sponsor signed, TP reviewed, completed
+
+
+
+
+
+
+
+
+ Completion Reminders
++ Receive reminders if you haven't completed your submission +
+
+ Sent after 24 hours (not started) and 72 hours (incomplete)
+
+
+
+
+
+
+
+
+ Sponsor Signature Alerts
++ Get notified when sponsor signs your document +
+
+ Immediate notification when sponsor completes their part
+
+
+
+
+
+
+ Final Completion Alerts
++ Get notified when document is fully signed and ready +
+
+ Includes download link for final document
+
+
+
+
+
+ Reminder Frequency
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ Email Preview
+ +
+
+ Example: Status Update Email
+
+
+ Subject: Your submission status has been updated
+
+ Hi {{ studentName }},
+ Your document for {{ cohortName }} has been signed by the sponsor.
+ Current status: Sponsor Signed
+ View your submission: View Status
+
+
+
+
+ Unsubscribe from All Emails
++ This will disable all email notifications. You will need to check the portal manually for updates. +
+ +
+
+
+
+
+
+
+
+ {{ toastMessage }}
+
+
+
+
+
+
+
+ Saving preferences...
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/student/stores/notifications.ts
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import { NotificationAPI } from '@/student/api/notification'
+
+export interface NotificationPreferences {
+ status_updates: boolean
+ reminders: boolean
+ sponsor_alerts: boolean
+ completion_alerts: boolean
+ reminder_frequency: string
+ cohort_name: string
+ student_name: string
+}
+
+export const useStudentNotificationStore = defineStore('studentNotifications', {
+ state: () => ({
+ preferences: null as NotificationPreferences | null,
+ isLoading: false,
+ error: null as string | null
+ }),
+
+ actions: {
+ async fetchPreferences(submissionId: number, token: string): PromiseYou've been invited to join {{ cohortName }}
+Hi {{ studentName }},
+You've been invited to complete your documents for {{ cohortName }}.
+Click the button below to get started:
+ Start Your Submission +This link will expire in 7 days.
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/sponsor/stores/cohort.ts
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import { CohortAPI } from '@/sponsor/api/cohort'
+import type { Cohort, Student, BulkSignRequest } from '@/sponsor/types'
+
+export const useSponsorCohortStore = defineStore('sponsorCohort', {
+ state: () => ({
+ cohortName: '',
+ cohortId: null as number | null,
+ students: [] as Student[],
+ isLoading: false,
+ error: null as string | null
+ }),
+
+ actions: {
+ async fetchCohort(cohortId: number, token: string): Promise
+
+
+
+
+
+
+
+
+
+
+ + {{ cohortName }} +
++ Review and sign student documents for this cohort +
+
+
+
+ Total Students:
+ {{ totalStudents }}
+
+
+ Pending:
+ {{ pendingStudents }}
+
+
+ Completed:
+ {{ completedStudents }}
+
+
+
+ Cohort ID
+ #{{ cohortId }}
+
+
+
+
+
+
+
+ Waiting for Your Signature
+ {{ pendingStudents }}
+ students need signing
+
+
+
+ Already Signed
+ {{ completedStudents }}
+ students completed
+
+
+ Total Students
+ {{ totalStudents }}
+ in this cohort
+
+
+
+
+ Bulk Signing
+ +
+
+
+
+
+
+
+
+
+ + Your signature will be applied to all {{ pendingStudents }} pending student submissions. +
++ This is a bulk operation. After signing, all students will be notified and the training provider will receive confirmation. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + By typing your name, you certify this is your legal signature +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ All Documents Signed
++ You have already signed all student documents in this cohort. +
+
+
+
+
+
+
+
+
+ Student List
+
+
+
+
+
+ No students found
+
+
+
+
+
+
+
+
+
+
+ | Student Name | +Status | +Submitted | +Progress | +|
|---|---|---|---|---|
| {{ student.name }} | +{{ student.email }} | ++ + {{ student.signed ? 'Signed' : 'Pending' }} + + | +{{ formatDate(student.submitted_at) }} | +
+
+
+
+
+
+ {{ student.signed ? '100%' : '0%' }}
+ |
+
+
+
+
+
+
+
+
+
+ {{ student.signed ? 'Signed' : 'Pending' }}
+
+ {{ student.name }}
+ {{ student.email }}
+
+ Submitted: {{ formatDate(student.submitted_at) }}
+
+
+
+
+
+
+
+
+
+
+
+
+ Signing Preview
+ +
+
+
+
+
+ What will happen:
+-
+
- Your signature will be applied to {{ pendingStudents }} student submissions +
- All students will receive email notification +
- Training provider will be notified +
- Status will change to "Sponsor Signed" +
+
+
+ Affected Students:
+
+
+
+
+
+ | Name | +|
|---|---|
| {{ student.name }} | +{{ student.email }} | +
+
+
+ Your Signature:
+
+ ![]()
+
+
+ {{ typedSignature }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Signing Complete!
++ You have successfully signed all {{ pendingStudents }} student documents. +
++ Students and the training provider have been notified. +
+ +
+
+
+
+
+
+
+ Signing documents...
+ Applying signature to {{ pendingStudents }} submissions
+
+
+ {{ toastMessage }}
+
+
+
+
+
+
+
+
+```
+
+**Pinia Store:**
+```typescript
+// app/javascript/sponsor/stores/notifications.ts
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import { NotificationAPI } from '@/sponsor/api/notification'
+
+export interface NotificationPreferences {
+ signing_requests: boolean
+ student_alerts: boolean
+ reminders: boolean
+ completion_alerts: boolean
+ reminder_frequency: string
+ cohort_name: string
+}
+
+export const useSponsorNotificationStore = defineStore('sponsorNotifications', {
+ state: () => ({
+ preferences: null as NotificationPreferences | null,
+ isLoading: false,
+ error: null as string | null
+ }),
+
+ actions: {
+ async fetchPreferences(cohortId: number, token: string): Promise
+
+
+
+
+
+
+ Email Notification Preferences
++ Manage which emails you receive for cohort {{ cohortName }} +
+
+
+
+
+ Email Settings
+ +
+
+
+
+
+
+
+
+
+
+ Signing Requests
++ Receive emails when assigned to sign documents +
+
+ Includes initial invitation and cohort access link
+
+
+
+
+
+
+
+
+ Student Completion Alerts
++ Get notified when students submit their documents +
+
+ Sent once per cohort, not per student
+
+
+
+
+
+
+
+
+ Completion Reminders
++ Receive reminders if you haven't signed yet +
+
+ Sent after 48 hours and 72 hours if incomplete
+
+
+
+
+
+
+ Completion Confirmation
++ Get confirmation after you complete signing +
+
+ Includes summary and next steps
+
+
+
+
+
+ Reminder Frequency
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ Email Preview
+ +
+
+ Example: Signing Request
+
+
+ Subject: Action Required: Sign documents for {{ cohortName }}
+
+ Hello,
+ You have been assigned to sign student documents for {{ cohortName }}.
+ 3 students are waiting for your signature.
+ Click here to review and sign
+ This link will expire in 7 days.
+
+
+
+
+ Unsubscribe from All Emails
++ This will disable all email notifications. You will need to check the portal manually for updates. +
+ +
+
+
+
+
+
+
+
+ {{ toastMessage }}
+
+
+
+
+
+
+
+ Saving preferences...
+
+