@eeplatform/nuxt-layer-common 1.7.34 → 1.7.36
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1452,7 +1452,7 @@ const prop = defineProps({
|
|
|
1452
1452
|
});
|
|
1453
1453
|
const { requiredRule, debounce } = useUtils();
|
|
1454
1454
|
|
|
1455
|
-
const enrollment = defineModel<
|
|
1455
|
+
const enrollment = defineModel<TLearner>({
|
|
1456
1456
|
default: () => useEnrollment().enrollment,
|
|
1457
1457
|
});
|
|
1458
1458
|
|
|
@@ -0,0 +1,708 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<v-card width="100%">
|
|
3
|
+
<v-toolbar density="compact" class="px-4">
|
|
4
|
+
<v-toolbar-title class="text-h6 font-weight-bold">
|
|
5
|
+
Enrollment Application Details
|
|
6
|
+
</v-toolbar-title>
|
|
7
|
+
</v-toolbar>
|
|
8
|
+
|
|
9
|
+
<v-card-text style="max-height: 100vh; overflow-y: auto" class="pa-6">
|
|
10
|
+
<v-row no-gutters v-if="localProps.application">
|
|
11
|
+
<!-- School Information -->
|
|
12
|
+
<v-col cols="12" class="mb-6">
|
|
13
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
14
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
15
|
+
School Information
|
|
16
|
+
</v-card-title>
|
|
17
|
+
<v-row no-gutters>
|
|
18
|
+
<v-col cols="12" class="mb-2">
|
|
19
|
+
<strong>Region:</strong>
|
|
20
|
+
{{ localProps.application.regionName ?? "N/A" }}
|
|
21
|
+
</v-col>
|
|
22
|
+
<v-col cols="12" class="mb-2">
|
|
23
|
+
<strong>Division:</strong>
|
|
24
|
+
{{ localProps.application.divisionName ?? "N/A" }}
|
|
25
|
+
</v-col>
|
|
26
|
+
<v-col cols="12" class="mb-2">
|
|
27
|
+
<strong>School:</strong>
|
|
28
|
+
{{ getSchoolName(localProps.application.school) ?? "N/A" }}
|
|
29
|
+
</v-col>
|
|
30
|
+
<v-col cols="12" class="mb-2">
|
|
31
|
+
<strong>School Year:</strong>
|
|
32
|
+
{{ localProps.application.schoolYear ?? "N/A" }}
|
|
33
|
+
</v-col>
|
|
34
|
+
<v-col cols="12" class="mb-2">
|
|
35
|
+
<strong>Grade Level:</strong>
|
|
36
|
+
{{
|
|
37
|
+
formatGradeLevel(localProps.application.gradeLevel) ?? "N/A"
|
|
38
|
+
}}
|
|
39
|
+
</v-col>
|
|
40
|
+
<v-col cols="12">
|
|
41
|
+
<strong>Returning Learner:</strong>
|
|
42
|
+
{{ localProps.application.returningLearner ? "Yes" : "No" }}
|
|
43
|
+
</v-col>
|
|
44
|
+
</v-row>
|
|
45
|
+
</v-card>
|
|
46
|
+
</v-col>
|
|
47
|
+
|
|
48
|
+
<!-- Special Program -->
|
|
49
|
+
<v-col
|
|
50
|
+
cols="12"
|
|
51
|
+
class="mb-6"
|
|
52
|
+
v-if="localProps.application.specialProgram"
|
|
53
|
+
>
|
|
54
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
55
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
56
|
+
Special Program
|
|
57
|
+
</v-card-title>
|
|
58
|
+
<v-row no-gutters>
|
|
59
|
+
<v-col cols="12" class="mb-2">
|
|
60
|
+
<strong>Special Program:</strong>
|
|
61
|
+
{{ localProps.application.specialProgramName ?? "N/A" }}
|
|
62
|
+
</v-col>
|
|
63
|
+
|
|
64
|
+
<v-col
|
|
65
|
+
v-if="localProps.application.specialProgramMajor"
|
|
66
|
+
cols="12"
|
|
67
|
+
class="mb-2"
|
|
68
|
+
>
|
|
69
|
+
<strong>Major:</strong>
|
|
70
|
+
{{ localProps.application.specialProgramMajor ?? "N/A" }}
|
|
71
|
+
</v-col>
|
|
72
|
+
|
|
73
|
+
<v-col cols="12" class="mb-2">
|
|
74
|
+
<strong>GWA:</strong>
|
|
75
|
+
{{ localProps.application.gwa ?? "N/A" }}
|
|
76
|
+
</v-col>
|
|
77
|
+
|
|
78
|
+
<v-col
|
|
79
|
+
v-if="
|
|
80
|
+
localProps.application.subjects &&
|
|
81
|
+
localProps.application.subjects.length
|
|
82
|
+
"
|
|
83
|
+
cols="12"
|
|
84
|
+
class="mb-2"
|
|
85
|
+
>
|
|
86
|
+
<v-row no-gutters>
|
|
87
|
+
<v-col
|
|
88
|
+
v-for="subject in localProps.application.subjects"
|
|
89
|
+
cols="12"
|
|
90
|
+
class="mb-2"
|
|
91
|
+
>
|
|
92
|
+
<strong>{{ subject.title }}:</strong>
|
|
93
|
+
{{ subject.title ?? "N/A" }}
|
|
94
|
+
</v-col>
|
|
95
|
+
</v-row>
|
|
96
|
+
</v-col>
|
|
97
|
+
</v-row>
|
|
98
|
+
</v-card>
|
|
99
|
+
</v-col>
|
|
100
|
+
|
|
101
|
+
<!-- Learner Information -->
|
|
102
|
+
<v-col
|
|
103
|
+
cols="12"
|
|
104
|
+
class="mb-6"
|
|
105
|
+
v-if="!localProps.application.returningLearner"
|
|
106
|
+
>
|
|
107
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
108
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
109
|
+
Learner Information
|
|
110
|
+
</v-card-title>
|
|
111
|
+
<v-row no-gutters>
|
|
112
|
+
<v-col cols="6" class="mb-2">
|
|
113
|
+
<strong>PSA Birth Certificate No.:</strong>
|
|
114
|
+
{{
|
|
115
|
+
localProps.application.learnerInfo?.psaBirthCertificateNo ??
|
|
116
|
+
"N/A"
|
|
117
|
+
}}
|
|
118
|
+
</v-col>
|
|
119
|
+
<v-col cols="12" class="mb-2">
|
|
120
|
+
<strong>LRN:</strong>
|
|
121
|
+
{{ localProps.application.learnerInfo?.lrn ?? "N/A" }}
|
|
122
|
+
</v-col>
|
|
123
|
+
<v-col cols="12" class="mb-2">
|
|
124
|
+
<strong>Full Name:</strong>
|
|
125
|
+
{{
|
|
126
|
+
`${localProps.application.learnerInfo?.firstName ?? ""} ${
|
|
127
|
+
localProps.application.learnerInfo?.middleName ?? ""
|
|
128
|
+
} ${localProps.application.learnerInfo?.lastName ?? ""}`
|
|
129
|
+
}}
|
|
130
|
+
</v-col>
|
|
131
|
+
<v-col cols="12" class="mb-2">
|
|
132
|
+
<strong>Extension Name:</strong>
|
|
133
|
+
{{ localProps.application.learnerInfo?.extensionName ?? "N/A" }}
|
|
134
|
+
</v-col>
|
|
135
|
+
<v-col cols="12" class="mb-2">
|
|
136
|
+
<strong>Birth Date:</strong>
|
|
137
|
+
{{ birthDate }}
|
|
138
|
+
</v-col>
|
|
139
|
+
<v-col cols="6" class="mb-2">
|
|
140
|
+
<strong>Age:</strong>
|
|
141
|
+
{{ localProps.application.learnerInfo?.age ?? "N/A" }}
|
|
142
|
+
</v-col>
|
|
143
|
+
<v-col cols="12" class="mb-2">
|
|
144
|
+
<strong>Sex:</strong>
|
|
145
|
+
{{ localProps.application.learnerInfo?.sex ?? "N/A" }}
|
|
146
|
+
</v-col>
|
|
147
|
+
<v-col cols="6" class="mb-2">
|
|
148
|
+
<strong>Place of Birth:</strong>
|
|
149
|
+
{{ placeOfBirth }}
|
|
150
|
+
</v-col>
|
|
151
|
+
<v-col cols="12" class="mb-2">
|
|
152
|
+
<strong>Mother Tongue:</strong>
|
|
153
|
+
{{ localProps.application.learnerInfo?.motherTongue ?? "N/A" }}
|
|
154
|
+
</v-col>
|
|
155
|
+
<v-col cols="12" class="mb-2">
|
|
156
|
+
<strong>Indigenous Community:</strong>
|
|
157
|
+
{{
|
|
158
|
+
localProps.application.learnerInfo?.indigenousCommunity ??
|
|
159
|
+
"N/A"
|
|
160
|
+
}}
|
|
161
|
+
</v-col>
|
|
162
|
+
<v-col cols="12" class="mb-2">
|
|
163
|
+
<strong>4Ps Household ID:</strong>
|
|
164
|
+
{{
|
|
165
|
+
localProps.application.learnerInfo?.fourPsHouseholdId ?? "N/A"
|
|
166
|
+
}}
|
|
167
|
+
</v-col>
|
|
168
|
+
<v-col cols="12" class="mb-2">
|
|
169
|
+
<strong>With Disability:</strong>
|
|
170
|
+
{{
|
|
171
|
+
localProps.application.learnerInfo?.withDisability
|
|
172
|
+
? "Yes"
|
|
173
|
+
: "No"
|
|
174
|
+
}}
|
|
175
|
+
</v-col>
|
|
176
|
+
<v-col
|
|
177
|
+
cols="12"
|
|
178
|
+
v-if="
|
|
179
|
+
localProps.application.learnerInfo?.withDisability &&
|
|
180
|
+
localProps.application.learnerInfo?.disabilities?.length
|
|
181
|
+
"
|
|
182
|
+
>
|
|
183
|
+
<strong>Disabilities:</strong>
|
|
184
|
+
<v-chip-group class="mt-1">
|
|
185
|
+
<v-chip
|
|
186
|
+
v-for="disability in localProps.application.learnerInfo
|
|
187
|
+
.disabilities"
|
|
188
|
+
:key="disability"
|
|
189
|
+
size="small"
|
|
190
|
+
variant="outlined"
|
|
191
|
+
>
|
|
192
|
+
{{ disability }}
|
|
193
|
+
</v-chip>
|
|
194
|
+
</v-chip-group>
|
|
195
|
+
</v-col>
|
|
196
|
+
</v-row>
|
|
197
|
+
</v-card>
|
|
198
|
+
</v-col>
|
|
199
|
+
|
|
200
|
+
<!-- Current Address -->
|
|
201
|
+
<v-col
|
|
202
|
+
cols="12"
|
|
203
|
+
class="mb-6"
|
|
204
|
+
v-if="!localProps.application.returningLearner"
|
|
205
|
+
>
|
|
206
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
207
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
208
|
+
Current Address
|
|
209
|
+
</v-card-title>
|
|
210
|
+
<v-row no-gutters>
|
|
211
|
+
<v-col cols="12" class="mb-2">
|
|
212
|
+
<strong>House No.:</strong>
|
|
213
|
+
{{
|
|
214
|
+
localProps.application.address?.current?.houseNumber ?? "N/A"
|
|
215
|
+
}}
|
|
216
|
+
</v-col>
|
|
217
|
+
<v-col cols="12" class="mb-2">
|
|
218
|
+
<strong>Street:</strong>
|
|
219
|
+
{{
|
|
220
|
+
localProps.application.address?.current?.streetName ?? "N/A"
|
|
221
|
+
}}
|
|
222
|
+
</v-col>
|
|
223
|
+
<v-col cols="12" class="mb-2">
|
|
224
|
+
<strong>Barangay:</strong>
|
|
225
|
+
{{
|
|
226
|
+
localProps.application.address?.current?.barangayName ?? "N/A"
|
|
227
|
+
}}
|
|
228
|
+
</v-col>
|
|
229
|
+
<v-col cols="12" class="mb-2">
|
|
230
|
+
<strong>Municipality/City:</strong>
|
|
231
|
+
{{
|
|
232
|
+
localProps.application.address?.current
|
|
233
|
+
?.municipalityCityName ?? "N/A"
|
|
234
|
+
}}
|
|
235
|
+
</v-col>
|
|
236
|
+
<v-col cols="12" class="mb-2">
|
|
237
|
+
<strong>Province:</strong>
|
|
238
|
+
{{
|
|
239
|
+
localProps.application.address?.current?.provinceName ?? "N/A"
|
|
240
|
+
}}
|
|
241
|
+
</v-col>
|
|
242
|
+
<v-col cols="12" class="mb-2">
|
|
243
|
+
<strong>Country:</strong>
|
|
244
|
+
{{ localProps.application.address?.current?.country ?? "N/A" }}
|
|
245
|
+
</v-col>
|
|
246
|
+
<v-col cols="12">
|
|
247
|
+
<strong>Zip Code:</strong>
|
|
248
|
+
{{ localProps.application.address?.current?.zipCode ?? "N/A" }}
|
|
249
|
+
</v-col>
|
|
250
|
+
</v-row>
|
|
251
|
+
</v-card>
|
|
252
|
+
</v-col>
|
|
253
|
+
|
|
254
|
+
<!-- Permanent Address -->
|
|
255
|
+
<v-col
|
|
256
|
+
cols="12"
|
|
257
|
+
class="mb-6"
|
|
258
|
+
v-if="!localProps.application.returningLearner"
|
|
259
|
+
>
|
|
260
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
261
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
262
|
+
Permanent Address
|
|
263
|
+
</v-card-title>
|
|
264
|
+
<v-row no-gutters>
|
|
265
|
+
<v-col cols="12" class="mb-2">
|
|
266
|
+
<strong>House No.:</strong>
|
|
267
|
+
{{
|
|
268
|
+
localProps.application.address?.permanent?.houseNumber ??
|
|
269
|
+
"N/A"
|
|
270
|
+
}}
|
|
271
|
+
</v-col>
|
|
272
|
+
<v-col cols="12" class="mb-2">
|
|
273
|
+
<strong>Street:</strong>
|
|
274
|
+
{{
|
|
275
|
+
localProps.application.address?.permanent?.streetName ?? "N/A"
|
|
276
|
+
}}
|
|
277
|
+
</v-col>
|
|
278
|
+
<v-col cols="12" class="mb-2">
|
|
279
|
+
<strong>Barangay:</strong>
|
|
280
|
+
{{
|
|
281
|
+
localProps.application.address?.permanent?.barangayName ??
|
|
282
|
+
"N/A"
|
|
283
|
+
}}
|
|
284
|
+
</v-col>
|
|
285
|
+
<v-col cols="12" class="mb-2">
|
|
286
|
+
<strong>Municipality/City:</strong>
|
|
287
|
+
{{
|
|
288
|
+
localProps.application.address?.permanent
|
|
289
|
+
?.municipalityCityName ?? "N/A"
|
|
290
|
+
}}
|
|
291
|
+
</v-col>
|
|
292
|
+
<v-col cols="12" class="mb-2">
|
|
293
|
+
<strong>Province:</strong>
|
|
294
|
+
{{
|
|
295
|
+
localProps.application.address?.permanent?.provinceName ??
|
|
296
|
+
"N/A"
|
|
297
|
+
}}
|
|
298
|
+
</v-col>
|
|
299
|
+
<v-col cols="12" class="mb-2">
|
|
300
|
+
<strong>Country:</strong>
|
|
301
|
+
{{
|
|
302
|
+
localProps.application.address?.permanent?.country ?? "N/A"
|
|
303
|
+
}}
|
|
304
|
+
</v-col>
|
|
305
|
+
<v-col cols="12">
|
|
306
|
+
<strong>Zip Code:</strong>
|
|
307
|
+
{{
|
|
308
|
+
localProps.application.address?.permanent?.zipCode ?? "N/A"
|
|
309
|
+
}}
|
|
310
|
+
</v-col>
|
|
311
|
+
</v-row>
|
|
312
|
+
</v-card>
|
|
313
|
+
</v-col>
|
|
314
|
+
|
|
315
|
+
<!-- Parent/Guardian Information -->
|
|
316
|
+
<v-col
|
|
317
|
+
cols="12"
|
|
318
|
+
class="mb-6"
|
|
319
|
+
v-if="!localProps.application.returningLearner"
|
|
320
|
+
>
|
|
321
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
322
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
323
|
+
Parent/Guardian Information
|
|
324
|
+
</v-card-title>
|
|
325
|
+
|
|
326
|
+
<!-- Father's Information -->
|
|
327
|
+
<v-row no-gutters class="mb-4">
|
|
328
|
+
<v-col cols="12" class="mb-2">
|
|
329
|
+
<span class="font-weight-medium">Father's Information:</span>
|
|
330
|
+
</v-col>
|
|
331
|
+
<v-col cols="12" class="mb-2">
|
|
332
|
+
<strong>Name:</strong>
|
|
333
|
+
{{
|
|
334
|
+
`${
|
|
335
|
+
localProps.application.parentGuardianInfo?.father
|
|
336
|
+
?.firstName ?? ""
|
|
337
|
+
} ${
|
|
338
|
+
localProps.application.parentGuardianInfo?.father
|
|
339
|
+
?.middleName ?? ""
|
|
340
|
+
} ${
|
|
341
|
+
localProps.application.parentGuardianInfo?.father
|
|
342
|
+
?.lastName ?? ""
|
|
343
|
+
}`
|
|
344
|
+
}}
|
|
345
|
+
</v-col>
|
|
346
|
+
<v-col cols="12" class="mb-2">
|
|
347
|
+
<strong>Contact Number:</strong>
|
|
348
|
+
{{
|
|
349
|
+
localProps.application.parentGuardianInfo?.father
|
|
350
|
+
?.contactNumber ?? "N/A"
|
|
351
|
+
}}
|
|
352
|
+
</v-col>
|
|
353
|
+
</v-row>
|
|
354
|
+
|
|
355
|
+
<!-- Mother's Information -->
|
|
356
|
+
<v-row no-gutters class="mb-4">
|
|
357
|
+
<v-col cols="12" class="mb-2">
|
|
358
|
+
<span class="font-weight-medium">Mother's Information:</span>
|
|
359
|
+
</v-col>
|
|
360
|
+
<v-col cols="12" class="mb-2">
|
|
361
|
+
<strong>Name:</strong>
|
|
362
|
+
{{
|
|
363
|
+
`${
|
|
364
|
+
localProps.application.parentGuardianInfo?.mother
|
|
365
|
+
?.firstName ?? ""
|
|
366
|
+
} ${
|
|
367
|
+
localProps.application.parentGuardianInfo?.mother
|
|
368
|
+
?.middleName ?? ""
|
|
369
|
+
} ${
|
|
370
|
+
localProps.application.parentGuardianInfo?.mother
|
|
371
|
+
?.lastName ?? ""
|
|
372
|
+
}`
|
|
373
|
+
}}
|
|
374
|
+
</v-col>
|
|
375
|
+
<v-col cols="12" class="mb-2">
|
|
376
|
+
<strong>Contact Number:</strong>
|
|
377
|
+
{{
|
|
378
|
+
localProps.application.parentGuardianInfo?.mother
|
|
379
|
+
?.contactNumber ?? "N/A"
|
|
380
|
+
}}
|
|
381
|
+
</v-col>
|
|
382
|
+
</v-row>
|
|
383
|
+
|
|
384
|
+
<!-- Legal Guardian's Information -->
|
|
385
|
+
<v-row no-gutters>
|
|
386
|
+
<v-col cols="12" class="mb-2">
|
|
387
|
+
<span class="font-weight-medium"
|
|
388
|
+
>Legal Guardian's Information:</span
|
|
389
|
+
>
|
|
390
|
+
</v-col>
|
|
391
|
+
<v-col cols="12" class="mb-2">
|
|
392
|
+
<strong>Name:</strong>
|
|
393
|
+
{{
|
|
394
|
+
`${
|
|
395
|
+
localProps.application.parentGuardianInfo?.legalGuardian
|
|
396
|
+
?.firstName ?? ""
|
|
397
|
+
} ${
|
|
398
|
+
localProps.application.parentGuardianInfo?.legalGuardian
|
|
399
|
+
?.middleName ?? ""
|
|
400
|
+
} ${
|
|
401
|
+
localProps.application.parentGuardianInfo?.legalGuardian
|
|
402
|
+
?.lastName ?? ""
|
|
403
|
+
}`
|
|
404
|
+
}}
|
|
405
|
+
</v-col>
|
|
406
|
+
<v-col cols="12">
|
|
407
|
+
<strong>Contact Number:</strong>
|
|
408
|
+
{{
|
|
409
|
+
localProps.application.parentGuardianInfo?.legalGuardian
|
|
410
|
+
?.contactNumber ?? "N/A"
|
|
411
|
+
}}
|
|
412
|
+
</v-col>
|
|
413
|
+
</v-row>
|
|
414
|
+
</v-card>
|
|
415
|
+
</v-col>
|
|
416
|
+
|
|
417
|
+
<!-- Senior High School Information -->
|
|
418
|
+
<v-col
|
|
419
|
+
cols="12"
|
|
420
|
+
class="mb-6"
|
|
421
|
+
v-if="
|
|
422
|
+
localProps.application.seniorHighInfo &&
|
|
423
|
+
['grade-11', 'grade-12'].includes(localProps.application.gradeLevel)
|
|
424
|
+
"
|
|
425
|
+
>
|
|
426
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
427
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
428
|
+
Senior High School Information
|
|
429
|
+
</v-card-title>
|
|
430
|
+
<v-row no-gutters>
|
|
431
|
+
<v-col cols="12" class="mb-2">
|
|
432
|
+
<strong>Semester:</strong>
|
|
433
|
+
{{ localProps.application.seniorHighInfo.semester ?? "N/A" }}
|
|
434
|
+
</v-col>
|
|
435
|
+
<v-col cols="12" class="mb-2">
|
|
436
|
+
<strong>Track:</strong>
|
|
437
|
+
{{ localProps.application.seniorHighInfo.trackName ?? "N/A" }}
|
|
438
|
+
</v-col>
|
|
439
|
+
<v-col cols="12">
|
|
440
|
+
<strong>Strand:</strong>
|
|
441
|
+
{{ localProps.application.seniorHighInfo.strandName ?? "N/A" }}
|
|
442
|
+
</v-col>
|
|
443
|
+
</v-row>
|
|
444
|
+
</v-card>
|
|
445
|
+
</v-col>
|
|
446
|
+
|
|
447
|
+
<!-- Returning Learner Information -->
|
|
448
|
+
<v-col
|
|
449
|
+
cols="12"
|
|
450
|
+
class="mb-6"
|
|
451
|
+
v-if="localProps.application.returningLearner"
|
|
452
|
+
>
|
|
453
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
454
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
455
|
+
Returning Learner Information
|
|
456
|
+
</v-card-title>
|
|
457
|
+
<v-row no-gutters>
|
|
458
|
+
<v-col cols="6" class="mb-2">
|
|
459
|
+
<strong>Last Grade Level Completed:</strong>
|
|
460
|
+
{{
|
|
461
|
+
formatGradeLevel(
|
|
462
|
+
localProps.application.lastGradeLevelCompleted ?? ""
|
|
463
|
+
) ?? "N/A"
|
|
464
|
+
}}
|
|
465
|
+
</v-col>
|
|
466
|
+
<v-col cols="6" class="mb-2">
|
|
467
|
+
<strong>Last School Year Completed:</strong>
|
|
468
|
+
{{ localProps.application.lastSchoolYearCompleted ?? "N/A" }}
|
|
469
|
+
</v-col>
|
|
470
|
+
<v-col cols="12">
|
|
471
|
+
<strong>Last School Attended:</strong>
|
|
472
|
+
{{ localProps.application.lastSchoolAttended ?? "N/A" }}
|
|
473
|
+
</v-col>
|
|
474
|
+
</v-row>
|
|
475
|
+
</v-card>
|
|
476
|
+
</v-col>
|
|
477
|
+
|
|
478
|
+
<!-- Alternative Learning Options -->
|
|
479
|
+
<v-col
|
|
480
|
+
cols="12"
|
|
481
|
+
class="mb-6"
|
|
482
|
+
v-if="localProps.application.alternativeLearningOptions?.length"
|
|
483
|
+
>
|
|
484
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
485
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
486
|
+
Preferred Learning Modalities
|
|
487
|
+
</v-card-title>
|
|
488
|
+
<v-chip-group>
|
|
489
|
+
<v-chip
|
|
490
|
+
v-for="option in localProps.application
|
|
491
|
+
.alternativeLearningOptions"
|
|
492
|
+
:key="option"
|
|
493
|
+
size="small"
|
|
494
|
+
variant="outlined"
|
|
495
|
+
color="primary"
|
|
496
|
+
>
|
|
497
|
+
{{ option }}
|
|
498
|
+
</v-chip>
|
|
499
|
+
</v-chip-group>
|
|
500
|
+
</v-card>
|
|
501
|
+
</v-col>
|
|
502
|
+
|
|
503
|
+
<!-- Application Status -->
|
|
504
|
+
<v-col cols="12">
|
|
505
|
+
<v-card variant="outlined" border="thin" class="pa-4">
|
|
506
|
+
<v-card-title class="text-h6 font-weight-bold pa-0 mb-3">
|
|
507
|
+
Application Status
|
|
508
|
+
</v-card-title>
|
|
509
|
+
<v-row no-gutters>
|
|
510
|
+
<v-col cols="12" class="mb-2">
|
|
511
|
+
<strong>Application Date:</strong>
|
|
512
|
+
{{ formatDate(localProps.application.createdAt ?? "") }}
|
|
513
|
+
</v-col>
|
|
514
|
+
|
|
515
|
+
<v-col cols="12" class="mb-2">
|
|
516
|
+
<strong class="mr-2">Status:</strong>
|
|
517
|
+
<v-chip
|
|
518
|
+
size="small"
|
|
519
|
+
:color="getStatusColor(localProps.application.status ?? '')"
|
|
520
|
+
variant="flat"
|
|
521
|
+
>
|
|
522
|
+
{{ formatStatus(localProps.application.status ?? "") }}
|
|
523
|
+
</v-chip>
|
|
524
|
+
</v-col>
|
|
525
|
+
|
|
526
|
+
<v-col
|
|
527
|
+
cols="12"
|
|
528
|
+
v-if="
|
|
529
|
+
localProps.application.updatedAt !==
|
|
530
|
+
localProps.application.createdAt
|
|
531
|
+
"
|
|
532
|
+
>
|
|
533
|
+
<strong>Last Updated:</strong>
|
|
534
|
+
{{ formatDate(localProps.application.updatedAt ?? "") }}
|
|
535
|
+
</v-col>
|
|
536
|
+
</v-row>
|
|
537
|
+
</v-card>
|
|
538
|
+
</v-col>
|
|
539
|
+
</v-row>
|
|
540
|
+
</v-card-text>
|
|
541
|
+
|
|
542
|
+
<v-toolbar class="pa-0" density="compact">
|
|
543
|
+
<v-row no-gutters>
|
|
544
|
+
<v-col
|
|
545
|
+
:cols="localProps.application?.status === 'pending' ? '6' : '12'"
|
|
546
|
+
class="pa-0"
|
|
547
|
+
>
|
|
548
|
+
<v-btn
|
|
549
|
+
block
|
|
550
|
+
variant="text"
|
|
551
|
+
class="text-none"
|
|
552
|
+
@click="emits('close')"
|
|
553
|
+
size="large"
|
|
554
|
+
height="48"
|
|
555
|
+
>
|
|
556
|
+
Close
|
|
557
|
+
</v-btn>
|
|
558
|
+
</v-col>
|
|
559
|
+
|
|
560
|
+
<v-col
|
|
561
|
+
v-if="localProps.application?.status === 'pending'"
|
|
562
|
+
cols="6"
|
|
563
|
+
class="pa-0"
|
|
564
|
+
>
|
|
565
|
+
<v-menu>
|
|
566
|
+
<template #activator="{ props }">
|
|
567
|
+
<v-btn
|
|
568
|
+
block
|
|
569
|
+
variant="flat"
|
|
570
|
+
color="black"
|
|
571
|
+
class="text-none"
|
|
572
|
+
size="large"
|
|
573
|
+
height="48"
|
|
574
|
+
v-bind="props"
|
|
575
|
+
tile
|
|
576
|
+
>
|
|
577
|
+
More actions
|
|
578
|
+
</v-btn>
|
|
579
|
+
</template>
|
|
580
|
+
|
|
581
|
+
<v-list class="pa-0">
|
|
582
|
+
<v-list-item @click="emits('accept')">
|
|
583
|
+
<v-list-item-title class="text-subtitle-1 font-weight-medium">
|
|
584
|
+
Accept Application
|
|
585
|
+
</v-list-item-title>
|
|
586
|
+
</v-list-item>
|
|
587
|
+
|
|
588
|
+
<v-list-item @click="emits('reject')" class="text-red">
|
|
589
|
+
<v-list-item-title class="text-subtitle-1 font-weight-medium">
|
|
590
|
+
Reject Application
|
|
591
|
+
</v-list-item-title>
|
|
592
|
+
</v-list-item>
|
|
593
|
+
</v-list>
|
|
594
|
+
</v-menu>
|
|
595
|
+
</v-col>
|
|
596
|
+
</v-row>
|
|
597
|
+
</v-toolbar>
|
|
598
|
+
</v-card>
|
|
599
|
+
</template>
|
|
600
|
+
|
|
601
|
+
<script setup lang="ts">
|
|
602
|
+
const localProps = defineProps({
|
|
603
|
+
application: {
|
|
604
|
+
default: () => useEnrollment().enrollment.value,
|
|
605
|
+
},
|
|
606
|
+
});
|
|
607
|
+
|
|
608
|
+
const placeOfBirth = computed(() => {
|
|
609
|
+
const province =
|
|
610
|
+
localProps.application.learnerInfo?.placeOfBirth.provinceName ?? "";
|
|
611
|
+
const city =
|
|
612
|
+
localProps.application.learnerInfo?.placeOfBirth.cityMunicipalityName ?? "";
|
|
613
|
+
|
|
614
|
+
if (province && city) {
|
|
615
|
+
return `${province}, ${city}`;
|
|
616
|
+
} else if (!province && city) {
|
|
617
|
+
return city;
|
|
618
|
+
} else {
|
|
619
|
+
return "N/A";
|
|
620
|
+
}
|
|
621
|
+
});
|
|
622
|
+
|
|
623
|
+
const birthDate = computed(() => {
|
|
624
|
+
const dateStr = localProps.application.learnerInfo?.birthDate;
|
|
625
|
+
if (!dateStr) return "N/A";
|
|
626
|
+
|
|
627
|
+
try {
|
|
628
|
+
return new Date(dateStr).toLocaleDateString();
|
|
629
|
+
} catch {
|
|
630
|
+
return dateStr;
|
|
631
|
+
}
|
|
632
|
+
});
|
|
633
|
+
|
|
634
|
+
const emits = defineEmits(["close", "reject", "accept"]);
|
|
635
|
+
|
|
636
|
+
function getStatusColor(status: string): string {
|
|
637
|
+
const colorMap: Record<string, string> = {
|
|
638
|
+
pending: "warning",
|
|
639
|
+
approved: "success",
|
|
640
|
+
rejected: "error",
|
|
641
|
+
enrolled: "primary",
|
|
642
|
+
};
|
|
643
|
+
|
|
644
|
+
return colorMap[status] || "grey";
|
|
645
|
+
}
|
|
646
|
+
|
|
647
|
+
function formatDate(dateString: string): string {
|
|
648
|
+
if (!dateString) return "N/A";
|
|
649
|
+
|
|
650
|
+
try {
|
|
651
|
+
return new Date(dateString).toLocaleDateString("en-US", {
|
|
652
|
+
year: "numeric",
|
|
653
|
+
month: "long",
|
|
654
|
+
day: "numeric",
|
|
655
|
+
hour: "2-digit",
|
|
656
|
+
minute: "2-digit",
|
|
657
|
+
});
|
|
658
|
+
} catch {
|
|
659
|
+
return dateString;
|
|
660
|
+
}
|
|
661
|
+
}
|
|
662
|
+
|
|
663
|
+
function formatStatus(status: string): string {
|
|
664
|
+
if (!status) return "N/A";
|
|
665
|
+
|
|
666
|
+
const statusMap: Record<string, string> = {
|
|
667
|
+
pending: "Pending",
|
|
668
|
+
approved: "Approved",
|
|
669
|
+
rejected: "Rejected",
|
|
670
|
+
enrolled: "Enrolled",
|
|
671
|
+
};
|
|
672
|
+
|
|
673
|
+
return statusMap[status] || status.charAt(0).toUpperCase() + status.slice(1);
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
function getSchoolName(schoolId: string): string {
|
|
677
|
+
if (!schoolId) return "N/A";
|
|
678
|
+
|
|
679
|
+
// Try to get school name from the selectedApplicant first
|
|
680
|
+
if (localProps.application?.schoolName) {
|
|
681
|
+
return localProps.application.schoolName;
|
|
682
|
+
}
|
|
683
|
+
|
|
684
|
+
return "";
|
|
685
|
+
}
|
|
686
|
+
|
|
687
|
+
function formatGradeLevel(gradeLevel: string): string {
|
|
688
|
+
if (!gradeLevel) return "N/A";
|
|
689
|
+
|
|
690
|
+
const gradeLevelMap: Record<string, string> = {
|
|
691
|
+
kinder: "Kindergarten",
|
|
692
|
+
"grade-1": "Grade 1",
|
|
693
|
+
"grade-2": "Grade 2",
|
|
694
|
+
"grade-3": "Grade 3",
|
|
695
|
+
"grade-4": "Grade 4",
|
|
696
|
+
"grade-5": "Grade 5",
|
|
697
|
+
"grade-6": "Grade 6",
|
|
698
|
+
"grade-7": "Grade 7",
|
|
699
|
+
"grade-8": "Grade 8",
|
|
700
|
+
"grade-9": "Grade 9",
|
|
701
|
+
"grade-10": "Grade 10",
|
|
702
|
+
"grade-11": "Grade 11",
|
|
703
|
+
"grade-12": "Grade 12",
|
|
704
|
+
};
|
|
705
|
+
|
|
706
|
+
return gradeLevelMap[gradeLevel] || gradeLevel;
|
|
707
|
+
}
|
|
708
|
+
</script>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export default function useEnrollment() {
|
|
2
|
-
const enrollment = ref<
|
|
2
|
+
const enrollment = ref<TLearner>({
|
|
3
3
|
schoolId: "",
|
|
4
4
|
school: "",
|
|
5
5
|
schoolName: "",
|
|
@@ -109,7 +109,7 @@ export default function useEnrollment() {
|
|
|
109
109
|
isCertifiedAndConsented: false,
|
|
110
110
|
});
|
|
111
111
|
|
|
112
|
-
function add(value:
|
|
112
|
+
function add(value: TLearner) {
|
|
113
113
|
return useNuxtApp().$api("/api/basic-education/enrollments", {
|
|
114
114
|
method: "POST",
|
|
115
115
|
body: value,
|
package/package.json
CHANGED
package/types/enrollment.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare type
|
|
1
|
+
declare type TLearner = {
|
|
2
2
|
_id?: string;
|
|
3
3
|
region: string; // e.g., "NCR"
|
|
4
4
|
regionName?: string; // e.g., "National Capital Region"
|
|
@@ -34,9 +34,9 @@ declare type TTLearner = {
|
|
|
34
34
|
isCertifiedAndConsented: boolean;
|
|
35
35
|
status?: string;
|
|
36
36
|
remarks?: string;
|
|
37
|
-
createdAt?:
|
|
38
|
-
updatedAt?:
|
|
39
|
-
deletedAt?:
|
|
37
|
+
createdAt?: string;
|
|
38
|
+
updatedAt?: string;
|
|
39
|
+
deletedAt?: string;
|
|
40
40
|
createdBy?: string;
|
|
41
41
|
updatedBy?: string;
|
|
42
42
|
deletedBy?: string;
|