@eeplatform/nuxt-layer-common 1.3.1 → 1.3.3
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 +12 -0
- package/components/EnrollmentForm.vue +1419 -0
- package/composables/useBasicEdu.ts +231 -0
- package/composables/useEnrollment.ts +97 -0
- package/package.json +2 -2
- package/types/enrollment.d.ts +95 -0
- package/types/school.d.ts +4 -0
|
@@ -0,0 +1,1419 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<v-row no-gutters>
|
|
3
|
+
<v-col cols="12" class="mb-4">
|
|
4
|
+
<v-row>
|
|
5
|
+
<v-col cols="3" class="pb-0">
|
|
6
|
+
<v-row no-gutters>
|
|
7
|
+
<InputLabel class="text-capitalize" title="Region" required />
|
|
8
|
+
<v-col cols="12">
|
|
9
|
+
<v-autocomplete
|
|
10
|
+
v-model="enrollment.region"
|
|
11
|
+
:rules="[requiredRule]"
|
|
12
|
+
:items="regionOptions"
|
|
13
|
+
></v-autocomplete>
|
|
14
|
+
</v-col>
|
|
15
|
+
</v-row>
|
|
16
|
+
</v-col>
|
|
17
|
+
|
|
18
|
+
<v-col cols="3" class="pb-0">
|
|
19
|
+
<v-row no-gutters>
|
|
20
|
+
<InputLabel class="text-capitalize" title="Province" required />
|
|
21
|
+
<v-col cols="12">
|
|
22
|
+
<v-autocomplete
|
|
23
|
+
v-model="enrollment.province"
|
|
24
|
+
:rules="[requiredRule]"
|
|
25
|
+
:items="provinceOptions"
|
|
26
|
+
></v-autocomplete>
|
|
27
|
+
</v-col>
|
|
28
|
+
</v-row>
|
|
29
|
+
</v-col>
|
|
30
|
+
|
|
31
|
+
<v-col cols="4" class="pb-0">
|
|
32
|
+
<v-row no-gutters>
|
|
33
|
+
<InputLabel
|
|
34
|
+
class="text-capitalize"
|
|
35
|
+
title="City/Municipality"
|
|
36
|
+
required
|
|
37
|
+
/>
|
|
38
|
+
<v-col cols="12">
|
|
39
|
+
<v-autocomplete
|
|
40
|
+
v-model="enrollment.cityMunicipality"
|
|
41
|
+
:rules="[requiredRule]"
|
|
42
|
+
:items="cityMunicipalityOptions"
|
|
43
|
+
></v-autocomplete>
|
|
44
|
+
</v-col>
|
|
45
|
+
</v-row>
|
|
46
|
+
</v-col>
|
|
47
|
+
</v-row>
|
|
48
|
+
</v-col>
|
|
49
|
+
|
|
50
|
+
<v-col cols="12" class="mb-4">
|
|
51
|
+
<v-row>
|
|
52
|
+
<v-col cols="6" class="pb-0">
|
|
53
|
+
<v-row no-gutters>
|
|
54
|
+
<InputLabel class="text-capitalize" title="School" required />
|
|
55
|
+
<v-col cols="12">
|
|
56
|
+
<v-autocomplete
|
|
57
|
+
v-model="enrollment.school"
|
|
58
|
+
:rules="[requiredRule]"
|
|
59
|
+
:items="gradeLevels"
|
|
60
|
+
></v-autocomplete>
|
|
61
|
+
</v-col>
|
|
62
|
+
</v-row>
|
|
63
|
+
</v-col>
|
|
64
|
+
</v-row>
|
|
65
|
+
</v-col>
|
|
66
|
+
|
|
67
|
+
<v-col cols="12" class="mb-2">
|
|
68
|
+
<v-row>
|
|
69
|
+
<v-col cols="2" class="pb-0">
|
|
70
|
+
<v-row no-gutters>
|
|
71
|
+
<InputLabel class="text-capitalize" title="School Year" required />
|
|
72
|
+
<v-col cols="12">
|
|
73
|
+
<v-autocomplete
|
|
74
|
+
v-model="enrollment.schoolYear"
|
|
75
|
+
:rules="[requiredRule]"
|
|
76
|
+
:items="effectiveSchoolYearOptions"
|
|
77
|
+
></v-autocomplete>
|
|
78
|
+
</v-col>
|
|
79
|
+
</v-row>
|
|
80
|
+
</v-col>
|
|
81
|
+
|
|
82
|
+
<v-col cols="2" class="pb-0">
|
|
83
|
+
<v-row no-gutters>
|
|
84
|
+
<InputLabel class="text-capitalize" title="Grade Level" required />
|
|
85
|
+
<v-col cols="12">
|
|
86
|
+
<v-autocomplete
|
|
87
|
+
v-model="enrollment.gradeLevel"
|
|
88
|
+
:rules="[requiredRule]"
|
|
89
|
+
:items="gradeLevels"
|
|
90
|
+
></v-autocomplete>
|
|
91
|
+
</v-col>
|
|
92
|
+
</v-row>
|
|
93
|
+
</v-col>
|
|
94
|
+
</v-row>
|
|
95
|
+
</v-col>
|
|
96
|
+
|
|
97
|
+
<v-col cols="12">
|
|
98
|
+
<v-checkbox
|
|
99
|
+
v-model="returningLearner"
|
|
100
|
+
label="Returning Learner(Balik-Aral)"
|
|
101
|
+
hide-details
|
|
102
|
+
density="compact"
|
|
103
|
+
></v-checkbox>
|
|
104
|
+
</v-col>
|
|
105
|
+
|
|
106
|
+
<v-col v-if="!returningLearner" cols="12">
|
|
107
|
+
<v-row no-gutters>
|
|
108
|
+
<v-col cols="12" class="mt-4">
|
|
109
|
+
<v-row>
|
|
110
|
+
<v-col cols="3">
|
|
111
|
+
<v-row no-gutters>
|
|
112
|
+
<InputLabel
|
|
113
|
+
class="text-capitalize"
|
|
114
|
+
title="PSA Birth Certificate No."
|
|
115
|
+
/>
|
|
116
|
+
<v-col cols="12">
|
|
117
|
+
<v-text-field
|
|
118
|
+
v-model="enrollment.learnerInfo.psaBirthCertificateNo"
|
|
119
|
+
type="number"
|
|
120
|
+
></v-text-field>
|
|
121
|
+
</v-col>
|
|
122
|
+
</v-row>
|
|
123
|
+
</v-col>
|
|
124
|
+
|
|
125
|
+
<v-col cols="3">
|
|
126
|
+
<v-row no-gutters>
|
|
127
|
+
<InputLabel
|
|
128
|
+
class="text-capitalize"
|
|
129
|
+
title="Leaner Reference Number"
|
|
130
|
+
required
|
|
131
|
+
/>
|
|
132
|
+
<v-col cols="12">
|
|
133
|
+
<v-text-field
|
|
134
|
+
v-model="enrollment.learnerInfo.learnerReferenceNumber"
|
|
135
|
+
:rules="[requiredRule]"
|
|
136
|
+
type="number"
|
|
137
|
+
></v-text-field>
|
|
138
|
+
</v-col>
|
|
139
|
+
</v-row>
|
|
140
|
+
</v-col>
|
|
141
|
+
</v-row>
|
|
142
|
+
</v-col>
|
|
143
|
+
|
|
144
|
+
<v-col cols="12">
|
|
145
|
+
<v-row>
|
|
146
|
+
<v-col cols="4">
|
|
147
|
+
<v-row no-gutters>
|
|
148
|
+
<InputLabel
|
|
149
|
+
class="text-capitalize"
|
|
150
|
+
title="Last Name"
|
|
151
|
+
required
|
|
152
|
+
/>
|
|
153
|
+
<v-col cols="12">
|
|
154
|
+
<v-text-field
|
|
155
|
+
v-model="enrollment.learnerInfo.lastName"
|
|
156
|
+
:rules="[requiredRule]"
|
|
157
|
+
></v-text-field>
|
|
158
|
+
</v-col>
|
|
159
|
+
</v-row>
|
|
160
|
+
</v-col>
|
|
161
|
+
|
|
162
|
+
<v-col cols="4">
|
|
163
|
+
<v-row no-gutters>
|
|
164
|
+
<InputLabel
|
|
165
|
+
class="text-capitalize"
|
|
166
|
+
title="First Name"
|
|
167
|
+
required
|
|
168
|
+
/>
|
|
169
|
+
<v-col cols="12">
|
|
170
|
+
<v-text-field
|
|
171
|
+
v-model="enrollment.learnerInfo.firstName"
|
|
172
|
+
:rules="[requiredRule]"
|
|
173
|
+
></v-text-field>
|
|
174
|
+
</v-col>
|
|
175
|
+
</v-row>
|
|
176
|
+
</v-col>
|
|
177
|
+
|
|
178
|
+
<v-col cols="4">
|
|
179
|
+
<v-row no-gutters>
|
|
180
|
+
<InputLabel
|
|
181
|
+
v-model="enrollment.learnerInfo.middleName"
|
|
182
|
+
class="text-capitalize"
|
|
183
|
+
title="Middle Name"
|
|
184
|
+
required
|
|
185
|
+
/>
|
|
186
|
+
<v-col cols="12">
|
|
187
|
+
<v-text-field></v-text-field>
|
|
188
|
+
</v-col>
|
|
189
|
+
</v-row>
|
|
190
|
+
</v-col>
|
|
191
|
+
</v-row>
|
|
192
|
+
</v-col>
|
|
193
|
+
|
|
194
|
+
<v-col cols="12">
|
|
195
|
+
<v-row>
|
|
196
|
+
<v-col cols="2">
|
|
197
|
+
<v-row no-gutters>
|
|
198
|
+
<v-col cols="12">
|
|
199
|
+
<InputLabel class="text-capitalize" title="Extension Name" />
|
|
200
|
+
</v-col>
|
|
201
|
+
<v-col cols="12">
|
|
202
|
+
<v-text-field
|
|
203
|
+
v-model="enrollment.learnerInfo.extensionName"
|
|
204
|
+
placeholder="e.g., Jr., Sr., III"
|
|
205
|
+
></v-text-field>
|
|
206
|
+
</v-col>
|
|
207
|
+
</v-row>
|
|
208
|
+
</v-col>
|
|
209
|
+
|
|
210
|
+
<v-col cols="2">
|
|
211
|
+
<v-row no-gutters>
|
|
212
|
+
<v-col cols="12">
|
|
213
|
+
<InputLabel
|
|
214
|
+
class="text-capitalize"
|
|
215
|
+
title="Birthdate"
|
|
216
|
+
required
|
|
217
|
+
/>
|
|
218
|
+
</v-col>
|
|
219
|
+
<v-col cols="12">
|
|
220
|
+
<v-mask-input
|
|
221
|
+
v-model="enrollment.learnerInfo.birthDate"
|
|
222
|
+
mask="##/##/####"
|
|
223
|
+
placeholder="MM/DD/YYYY"
|
|
224
|
+
density="comfortable"
|
|
225
|
+
variant="outlined"
|
|
226
|
+
></v-mask-input>
|
|
227
|
+
</v-col>
|
|
228
|
+
</v-row>
|
|
229
|
+
</v-col>
|
|
230
|
+
|
|
231
|
+
<v-col cols="1">
|
|
232
|
+
<v-row no-gutters>
|
|
233
|
+
<v-col cols="12">
|
|
234
|
+
<InputLabel class="text-capitalize" title="Age" />
|
|
235
|
+
</v-col>
|
|
236
|
+
<v-col cols="12">
|
|
237
|
+
<v-text-field
|
|
238
|
+
v-model="enrollment.learnerInfo.age"
|
|
239
|
+
type="number"
|
|
240
|
+
readonly
|
|
241
|
+
></v-text-field>
|
|
242
|
+
</v-col>
|
|
243
|
+
</v-row>
|
|
244
|
+
</v-col>
|
|
245
|
+
|
|
246
|
+
<v-col cols="2">
|
|
247
|
+
<v-row no-gutters>
|
|
248
|
+
<v-col cols="12">
|
|
249
|
+
<InputLabel class="text-capitalize" title="Sex" />
|
|
250
|
+
</v-col>
|
|
251
|
+
<v-col cols="12">
|
|
252
|
+
<v-select
|
|
253
|
+
v-model="enrollment.learnerInfo.sex"
|
|
254
|
+
:items="['Male', 'Female']"
|
|
255
|
+
placeholder="Select Sex"
|
|
256
|
+
></v-select>
|
|
257
|
+
</v-col>
|
|
258
|
+
</v-row>
|
|
259
|
+
</v-col>
|
|
260
|
+
</v-row>
|
|
261
|
+
</v-col>
|
|
262
|
+
|
|
263
|
+
<v-col cols="12" class="mt-4">
|
|
264
|
+
<v-row>
|
|
265
|
+
<v-col cols="4">
|
|
266
|
+
<v-row no-gutters>
|
|
267
|
+
<InputLabel
|
|
268
|
+
class="text-capitalize"
|
|
269
|
+
title="Place of Birth (Municipality/City)"
|
|
270
|
+
required
|
|
271
|
+
/>
|
|
272
|
+
<v-col cols="12">
|
|
273
|
+
<v-combobox
|
|
274
|
+
v-model="enrollment.learnerInfo.placeOfBirth"
|
|
275
|
+
:rules="[requiredRule]"
|
|
276
|
+
:items="citiesMunicipalities"
|
|
277
|
+
:hide-no-data="false"
|
|
278
|
+
>
|
|
279
|
+
<template v-slot:no-data>
|
|
280
|
+
<v-list-item>
|
|
281
|
+
<v-list-item-title>
|
|
282
|
+
No results matching "<strong>search</strong>". Press
|
|
283
|
+
<kbd>enter</kbd> to create a new one
|
|
284
|
+
</v-list-item-title>
|
|
285
|
+
</v-list-item>
|
|
286
|
+
</template>
|
|
287
|
+
</v-combobox>
|
|
288
|
+
</v-col>
|
|
289
|
+
</v-row>
|
|
290
|
+
</v-col>
|
|
291
|
+
|
|
292
|
+
<v-col cols="3">
|
|
293
|
+
<v-row no-gutters>
|
|
294
|
+
<InputLabel
|
|
295
|
+
class="text-capitalize"
|
|
296
|
+
title="Mother Tongue"
|
|
297
|
+
required
|
|
298
|
+
/>
|
|
299
|
+
<v-col cols="12">
|
|
300
|
+
<v-combobox
|
|
301
|
+
v-model="enrollment.learnerInfo.motherTongue"
|
|
302
|
+
:rules="[requiredRule]"
|
|
303
|
+
:items="motherTongueOptions"
|
|
304
|
+
:hide-no-data="false"
|
|
305
|
+
>
|
|
306
|
+
<template v-slot:no-data>
|
|
307
|
+
<v-list-item>
|
|
308
|
+
<v-list-item-title>
|
|
309
|
+
No results matching "<strong>search</strong>". Press
|
|
310
|
+
<kbd>enter</kbd> to create a new one
|
|
311
|
+
</v-list-item-title>
|
|
312
|
+
</v-list-item>
|
|
313
|
+
</template>
|
|
314
|
+
</v-combobox>
|
|
315
|
+
</v-col>
|
|
316
|
+
</v-row>
|
|
317
|
+
</v-col>
|
|
318
|
+
|
|
319
|
+
<v-col cols="4">
|
|
320
|
+
<v-row>
|
|
321
|
+
<v-col cols="12" class="pb-0">
|
|
322
|
+
<InputLabel
|
|
323
|
+
class="text-capitalize"
|
|
324
|
+
title="Indigenous People/Cultural Community"
|
|
325
|
+
/>
|
|
326
|
+
</v-col>
|
|
327
|
+
<v-col cols="9" class="pt-0">
|
|
328
|
+
<v-combobox
|
|
329
|
+
v-model="enrollment.learnerInfo.indigenousCommunity"
|
|
330
|
+
:items="indigenousCommunitiesPhilippines"
|
|
331
|
+
:hide-no-data="false"
|
|
332
|
+
>
|
|
333
|
+
<template v-slot:no-data>
|
|
334
|
+
<v-list-item>
|
|
335
|
+
<v-list-item-title>
|
|
336
|
+
No results matching "<strong>search</strong>". Press
|
|
337
|
+
<kbd>enter</kbd> to create a new one
|
|
338
|
+
</v-list-item-title>
|
|
339
|
+
</v-list-item>
|
|
340
|
+
</template>
|
|
341
|
+
</v-combobox>
|
|
342
|
+
</v-col>
|
|
343
|
+
</v-row>
|
|
344
|
+
</v-col>
|
|
345
|
+
</v-row>
|
|
346
|
+
</v-col>
|
|
347
|
+
|
|
348
|
+
<v-col cols="12">
|
|
349
|
+
<v-row>
|
|
350
|
+
<v-col cols="12" class="pb-0">
|
|
351
|
+
<InputLabel
|
|
352
|
+
class="text-capitalize"
|
|
353
|
+
title="4Ps Household ID Number"
|
|
354
|
+
/>
|
|
355
|
+
</v-col>
|
|
356
|
+
<v-col cols="4" class="pt-0">
|
|
357
|
+
<v-text-field
|
|
358
|
+
v-model="enrollment.learnerInfo.fourPsHouseholdId"
|
|
359
|
+
></v-text-field>
|
|
360
|
+
</v-col>
|
|
361
|
+
</v-row>
|
|
362
|
+
</v-col>
|
|
363
|
+
|
|
364
|
+
<v-col cols="12">
|
|
365
|
+
<v-checkbox
|
|
366
|
+
v-model="withDisability"
|
|
367
|
+
label="Learner with Disability"
|
|
368
|
+
hide-details
|
|
369
|
+
density="compact"
|
|
370
|
+
></v-checkbox>
|
|
371
|
+
</v-col>
|
|
372
|
+
|
|
373
|
+
<v-col v-if="withDisability" cols="12">
|
|
374
|
+
<v-row no-gutters>
|
|
375
|
+
<v-col cols="12">
|
|
376
|
+
<v-checkbox
|
|
377
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
378
|
+
label="Visual Impairment"
|
|
379
|
+
hide-details
|
|
380
|
+
density="compact"
|
|
381
|
+
value="Visual Impairment"
|
|
382
|
+
></v-checkbox>
|
|
383
|
+
</v-col>
|
|
384
|
+
|
|
385
|
+
<v-col cols="12" class="pl-6">
|
|
386
|
+
<v-checkbox
|
|
387
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
388
|
+
label="A. Blind"
|
|
389
|
+
hide-details
|
|
390
|
+
density="compact"
|
|
391
|
+
value="Blind"
|
|
392
|
+
></v-checkbox>
|
|
393
|
+
</v-col>
|
|
394
|
+
|
|
395
|
+
<v-col cols="12" class="pl-6">
|
|
396
|
+
<v-checkbox
|
|
397
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
398
|
+
label="B. Low vision"
|
|
399
|
+
hide-details
|
|
400
|
+
density="compact"
|
|
401
|
+
value="Low vision"
|
|
402
|
+
></v-checkbox>
|
|
403
|
+
</v-col>
|
|
404
|
+
|
|
405
|
+
<v-col cols="12">
|
|
406
|
+
<v-checkbox
|
|
407
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
408
|
+
label="Multiple Disorder"
|
|
409
|
+
hide-details
|
|
410
|
+
density="compact"
|
|
411
|
+
value="Multiple Disorder"
|
|
412
|
+
></v-checkbox>
|
|
413
|
+
</v-col>
|
|
414
|
+
|
|
415
|
+
<v-col cols="12">
|
|
416
|
+
<v-checkbox
|
|
417
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
418
|
+
label="Hearing Impairment"
|
|
419
|
+
hide-details
|
|
420
|
+
density="compact"
|
|
421
|
+
value="Hearing Impairment"
|
|
422
|
+
></v-checkbox>
|
|
423
|
+
</v-col>
|
|
424
|
+
|
|
425
|
+
<v-col cols="12">
|
|
426
|
+
<v-checkbox
|
|
427
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
428
|
+
label="Autism Spectrum Disorder"
|
|
429
|
+
hide-details
|
|
430
|
+
density="compact"
|
|
431
|
+
value="Autism Spectrum Disorder"
|
|
432
|
+
></v-checkbox>
|
|
433
|
+
</v-col>
|
|
434
|
+
|
|
435
|
+
<v-col cols="12">
|
|
436
|
+
<v-checkbox
|
|
437
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
438
|
+
label="Speech/Language Disorder"
|
|
439
|
+
hide-details
|
|
440
|
+
density="compact"
|
|
441
|
+
value="Speech Language Disorder"
|
|
442
|
+
></v-checkbox>
|
|
443
|
+
</v-col>
|
|
444
|
+
|
|
445
|
+
<v-col cols="12">
|
|
446
|
+
<v-checkbox
|
|
447
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
448
|
+
label="Learning Disability"
|
|
449
|
+
hide-details
|
|
450
|
+
density="compact"
|
|
451
|
+
value="Learning Disability"
|
|
452
|
+
></v-checkbox>
|
|
453
|
+
</v-col>
|
|
454
|
+
|
|
455
|
+
<v-col cols="12">
|
|
456
|
+
<v-checkbox
|
|
457
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
458
|
+
label="Emotional - Behavioral Disorder"
|
|
459
|
+
hide-details
|
|
460
|
+
density="compact"
|
|
461
|
+
value="Emotional Behavioral Disorder"
|
|
462
|
+
></v-checkbox>
|
|
463
|
+
</v-col>
|
|
464
|
+
|
|
465
|
+
<v-col cols="12">
|
|
466
|
+
<v-checkbox
|
|
467
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
468
|
+
label="Cerebral Palsy"
|
|
469
|
+
hide-details
|
|
470
|
+
density="compact"
|
|
471
|
+
value="Cerebral Palsy"
|
|
472
|
+
></v-checkbox>
|
|
473
|
+
</v-col>
|
|
474
|
+
|
|
475
|
+
<v-col cols="12">
|
|
476
|
+
<v-checkbox
|
|
477
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
478
|
+
label="Intellectual Disability"
|
|
479
|
+
hide-details
|
|
480
|
+
density="compact"
|
|
481
|
+
value="Intellectual Disability"
|
|
482
|
+
></v-checkbox>
|
|
483
|
+
</v-col>
|
|
484
|
+
|
|
485
|
+
<v-col cols="12">
|
|
486
|
+
<v-checkbox
|
|
487
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
488
|
+
label="Orthopedic/Physical Handicap"
|
|
489
|
+
hide-details
|
|
490
|
+
density="compact"
|
|
491
|
+
value="Orthopedic Physical Handicap"
|
|
492
|
+
></v-checkbox>
|
|
493
|
+
</v-col>
|
|
494
|
+
|
|
495
|
+
<v-col cols="12">
|
|
496
|
+
<v-checkbox
|
|
497
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
498
|
+
label="Special Health Problem / Chronic Disease"
|
|
499
|
+
hide-details
|
|
500
|
+
density="compact"
|
|
501
|
+
value="Special Health Problem"
|
|
502
|
+
></v-checkbox>
|
|
503
|
+
</v-col>
|
|
504
|
+
|
|
505
|
+
<v-col cols="12" class="pl-6">
|
|
506
|
+
<v-checkbox
|
|
507
|
+
v-model="enrollment.learnerInfo.disabilities"
|
|
508
|
+
label="A. Cancer"
|
|
509
|
+
hide-details
|
|
510
|
+
density="compact"
|
|
511
|
+
value="Cancer"
|
|
512
|
+
></v-checkbox>
|
|
513
|
+
</v-col>
|
|
514
|
+
</v-row>
|
|
515
|
+
</v-col>
|
|
516
|
+
|
|
517
|
+
<v-col cols="12" class="mt-2">
|
|
518
|
+
<v-row no-gutters>
|
|
519
|
+
<v-col cols="12">
|
|
520
|
+
<span class="font-weight-bold text-subtitle-1">
|
|
521
|
+
Current Address
|
|
522
|
+
</span>
|
|
523
|
+
</v-col>
|
|
524
|
+
|
|
525
|
+
<v-col cols="12">
|
|
526
|
+
<v-row>
|
|
527
|
+
<v-col cols="3">
|
|
528
|
+
<v-row no-gutters>
|
|
529
|
+
<InputLabel class="text-capitalize" title="House No." />
|
|
530
|
+
<v-col cols="12">
|
|
531
|
+
<v-text-field
|
|
532
|
+
v-model="enrollment.address.current.houseNumber"
|
|
533
|
+
></v-text-field>
|
|
534
|
+
</v-col>
|
|
535
|
+
</v-row>
|
|
536
|
+
</v-col>
|
|
537
|
+
|
|
538
|
+
<v-col cols="3">
|
|
539
|
+
<v-row no-gutters>
|
|
540
|
+
<InputLabel class="text-capitalize" title="Street" />
|
|
541
|
+
<v-col cols="12">
|
|
542
|
+
<v-text-field
|
|
543
|
+
v-model="enrollment.address.current.streetName"
|
|
544
|
+
></v-text-field>
|
|
545
|
+
</v-col>
|
|
546
|
+
</v-row>
|
|
547
|
+
</v-col>
|
|
548
|
+
|
|
549
|
+
<v-col cols="3">
|
|
550
|
+
<v-row no-gutters>
|
|
551
|
+
<InputLabel
|
|
552
|
+
class="text-capitalize"
|
|
553
|
+
title="Barangay"
|
|
554
|
+
required
|
|
555
|
+
/>
|
|
556
|
+
<v-col cols="12">
|
|
557
|
+
<v-text-field
|
|
558
|
+
v-model="enrollment.address.current.barangay"
|
|
559
|
+
:rules="[requiredRule]"
|
|
560
|
+
></v-text-field>
|
|
561
|
+
</v-col>
|
|
562
|
+
</v-row>
|
|
563
|
+
</v-col>
|
|
564
|
+
</v-row>
|
|
565
|
+
</v-col>
|
|
566
|
+
|
|
567
|
+
<v-col cols="12">
|
|
568
|
+
<v-row>
|
|
569
|
+
<v-col cols="3">
|
|
570
|
+
<v-row no-gutters>
|
|
571
|
+
<InputLabel
|
|
572
|
+
class="text-capitalize"
|
|
573
|
+
title="Municipality/City"
|
|
574
|
+
required
|
|
575
|
+
/>
|
|
576
|
+
<v-col cols="12">
|
|
577
|
+
<v-text-field
|
|
578
|
+
v-model="enrollment.address.current.municipalityCity"
|
|
579
|
+
:rules="[requiredRule]"
|
|
580
|
+
></v-text-field>
|
|
581
|
+
</v-col>
|
|
582
|
+
</v-row>
|
|
583
|
+
</v-col>
|
|
584
|
+
|
|
585
|
+
<v-col cols="3">
|
|
586
|
+
<v-row no-gutters>
|
|
587
|
+
<InputLabel
|
|
588
|
+
class="text-capitalize"
|
|
589
|
+
title="Province"
|
|
590
|
+
required
|
|
591
|
+
/>
|
|
592
|
+
<v-col cols="12">
|
|
593
|
+
<v-text-field
|
|
594
|
+
v-model="enrollment.address.current.province"
|
|
595
|
+
:rules="[requiredRule]"
|
|
596
|
+
></v-text-field>
|
|
597
|
+
</v-col>
|
|
598
|
+
</v-row>
|
|
599
|
+
</v-col>
|
|
600
|
+
|
|
601
|
+
<v-col cols="3">
|
|
602
|
+
<v-row no-gutters>
|
|
603
|
+
<InputLabel
|
|
604
|
+
class="text-capitalize"
|
|
605
|
+
title="Country"
|
|
606
|
+
required
|
|
607
|
+
/>
|
|
608
|
+
<v-col cols="12">
|
|
609
|
+
<v-text-field
|
|
610
|
+
v-model="enrollment.address.current.country"
|
|
611
|
+
:rules="[requiredRule]"
|
|
612
|
+
></v-text-field>
|
|
613
|
+
</v-col>
|
|
614
|
+
</v-row>
|
|
615
|
+
</v-col>
|
|
616
|
+
|
|
617
|
+
<v-col cols="2">
|
|
618
|
+
<v-row no-gutters>
|
|
619
|
+
<InputLabel
|
|
620
|
+
class="text-capitalize"
|
|
621
|
+
title="Zip Code"
|
|
622
|
+
required
|
|
623
|
+
/>
|
|
624
|
+
<v-col cols="12">
|
|
625
|
+
<v-text-field
|
|
626
|
+
v-model="enrollment.address.current.zipCode"
|
|
627
|
+
:rules="[requiredRule]"
|
|
628
|
+
></v-text-field>
|
|
629
|
+
</v-col>
|
|
630
|
+
</v-row>
|
|
631
|
+
</v-col>
|
|
632
|
+
</v-row>
|
|
633
|
+
</v-col>
|
|
634
|
+
</v-row>
|
|
635
|
+
</v-col>
|
|
636
|
+
|
|
637
|
+
<v-col cols="12" class="mt-2">
|
|
638
|
+
<v-row no-gutters>
|
|
639
|
+
<v-col cols="12">
|
|
640
|
+
<span class="font-weight-bold text-subtitle-1">
|
|
641
|
+
Permanent Address
|
|
642
|
+
</span>
|
|
643
|
+
</v-col>
|
|
644
|
+
|
|
645
|
+
<v-col cols="12">
|
|
646
|
+
<v-checkbox
|
|
647
|
+
v-model="sameAsCurrentAddress"
|
|
648
|
+
label="Same as Current Address"
|
|
649
|
+
hide-details
|
|
650
|
+
density="compact"
|
|
651
|
+
></v-checkbox>
|
|
652
|
+
</v-col>
|
|
653
|
+
|
|
654
|
+
<v-col cols="12">
|
|
655
|
+
<v-row>
|
|
656
|
+
<v-col cols="3">
|
|
657
|
+
<v-row no-gutters>
|
|
658
|
+
<InputLabel class="text-capitalize" title="House No." />
|
|
659
|
+
<v-col cols="12">
|
|
660
|
+
<v-text-field
|
|
661
|
+
v-model="enrollment.address.permanent.houseNumber"
|
|
662
|
+
:readonly="sameAsCurrentAddress"
|
|
663
|
+
></v-text-field>
|
|
664
|
+
</v-col>
|
|
665
|
+
</v-row>
|
|
666
|
+
</v-col>
|
|
667
|
+
|
|
668
|
+
<v-col cols="3">
|
|
669
|
+
<v-row no-gutters>
|
|
670
|
+
<InputLabel class="text-capitalize" title="Street" />
|
|
671
|
+
<v-col cols="12">
|
|
672
|
+
<v-text-field
|
|
673
|
+
v-model="enrollment.address.permanent.streetName"
|
|
674
|
+
:readonly="sameAsCurrentAddress"
|
|
675
|
+
></v-text-field>
|
|
676
|
+
</v-col>
|
|
677
|
+
</v-row>
|
|
678
|
+
</v-col>
|
|
679
|
+
|
|
680
|
+
<v-col cols="3">
|
|
681
|
+
<v-row no-gutters>
|
|
682
|
+
<InputLabel
|
|
683
|
+
class="text-capitalize"
|
|
684
|
+
title="Barangay"
|
|
685
|
+
required
|
|
686
|
+
/>
|
|
687
|
+
<v-col cols="12">
|
|
688
|
+
<v-text-field
|
|
689
|
+
v-model="enrollment.address.permanent.barangay"
|
|
690
|
+
:rules="[requiredRule]"
|
|
691
|
+
:readonly="sameAsCurrentAddress"
|
|
692
|
+
></v-text-field>
|
|
693
|
+
</v-col>
|
|
694
|
+
</v-row>
|
|
695
|
+
</v-col>
|
|
696
|
+
</v-row>
|
|
697
|
+
</v-col>
|
|
698
|
+
|
|
699
|
+
<v-col cols="12">
|
|
700
|
+
<v-row>
|
|
701
|
+
<v-col cols="3">
|
|
702
|
+
<v-row no-gutters>
|
|
703
|
+
<InputLabel
|
|
704
|
+
class="text-capitalize"
|
|
705
|
+
title="Municipality/City"
|
|
706
|
+
required
|
|
707
|
+
/>
|
|
708
|
+
<v-col cols="12">
|
|
709
|
+
<v-text-field
|
|
710
|
+
v-model="enrollment.address.permanent.municipalityCity"
|
|
711
|
+
:rules="[requiredRule]"
|
|
712
|
+
:readonly="sameAsCurrentAddress"
|
|
713
|
+
></v-text-field>
|
|
714
|
+
</v-col>
|
|
715
|
+
</v-row>
|
|
716
|
+
</v-col>
|
|
717
|
+
|
|
718
|
+
<v-col cols="3">
|
|
719
|
+
<v-row no-gutters>
|
|
720
|
+
<InputLabel
|
|
721
|
+
class="text-capitalize"
|
|
722
|
+
title="Province"
|
|
723
|
+
required
|
|
724
|
+
/>
|
|
725
|
+
<v-col cols="12">
|
|
726
|
+
<v-text-field
|
|
727
|
+
v-model="enrollment.address.permanent.province"
|
|
728
|
+
:rules="[requiredRule]"
|
|
729
|
+
:readonly="sameAsCurrentAddress"
|
|
730
|
+
></v-text-field>
|
|
731
|
+
</v-col>
|
|
732
|
+
</v-row>
|
|
733
|
+
</v-col>
|
|
734
|
+
|
|
735
|
+
<v-col cols="3">
|
|
736
|
+
<v-row no-gutters>
|
|
737
|
+
<InputLabel
|
|
738
|
+
class="text-capitalize"
|
|
739
|
+
title="Country"
|
|
740
|
+
required
|
|
741
|
+
/>
|
|
742
|
+
<v-col cols="12">
|
|
743
|
+
<v-text-field
|
|
744
|
+
v-model="enrollment.address.permanent.country"
|
|
745
|
+
:rules="[requiredRule]"
|
|
746
|
+
:readonly="sameAsCurrentAddress"
|
|
747
|
+
></v-text-field>
|
|
748
|
+
</v-col>
|
|
749
|
+
</v-row>
|
|
750
|
+
</v-col>
|
|
751
|
+
|
|
752
|
+
<v-col cols="2">
|
|
753
|
+
<v-row no-gutters>
|
|
754
|
+
<InputLabel
|
|
755
|
+
class="text-capitalize"
|
|
756
|
+
title="Zip Code"
|
|
757
|
+
required
|
|
758
|
+
/>
|
|
759
|
+
<v-col cols="12">
|
|
760
|
+
<v-text-field
|
|
761
|
+
v-model="enrollment.address.permanent.zipCode"
|
|
762
|
+
:rules="[requiredRule]"
|
|
763
|
+
:readonly="sameAsCurrentAddress"
|
|
764
|
+
></v-text-field>
|
|
765
|
+
</v-col>
|
|
766
|
+
</v-row>
|
|
767
|
+
</v-col>
|
|
768
|
+
</v-row>
|
|
769
|
+
</v-col>
|
|
770
|
+
</v-row>
|
|
771
|
+
</v-col>
|
|
772
|
+
|
|
773
|
+
<v-col cols="12" class="mt-2">
|
|
774
|
+
<v-row no-gutters>
|
|
775
|
+
<v-col cols="12">
|
|
776
|
+
<span class="font-weight-bold text-subtitle-1">
|
|
777
|
+
Parent/Guardian Information
|
|
778
|
+
</span>
|
|
779
|
+
</v-col>
|
|
780
|
+
|
|
781
|
+
<v-col cols="12">
|
|
782
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
783
|
+
Father's Name
|
|
784
|
+
</span>
|
|
785
|
+
</v-col>
|
|
786
|
+
|
|
787
|
+
<v-col cols="12">
|
|
788
|
+
<v-row>
|
|
789
|
+
<v-col cols="3">
|
|
790
|
+
<v-row no-gutters>
|
|
791
|
+
<InputLabel
|
|
792
|
+
class="text-capitalize"
|
|
793
|
+
title="Last Name"
|
|
794
|
+
required
|
|
795
|
+
/>
|
|
796
|
+
<v-col cols="12">
|
|
797
|
+
<v-text-field
|
|
798
|
+
v-model="enrollment.parentGuardianInfo.father.lastName"
|
|
799
|
+
:rules="[requiredRule]"
|
|
800
|
+
></v-text-field>
|
|
801
|
+
</v-col>
|
|
802
|
+
</v-row>
|
|
803
|
+
</v-col>
|
|
804
|
+
|
|
805
|
+
<v-col cols="3">
|
|
806
|
+
<v-row no-gutters>
|
|
807
|
+
<InputLabel
|
|
808
|
+
class="text-capitalize"
|
|
809
|
+
title="First Name"
|
|
810
|
+
required
|
|
811
|
+
/>
|
|
812
|
+
<v-col cols="12">
|
|
813
|
+
<v-text-field
|
|
814
|
+
v-model="enrollment.parentGuardianInfo.father.firstName"
|
|
815
|
+
:rules="[requiredRule]"
|
|
816
|
+
></v-text-field>
|
|
817
|
+
</v-col>
|
|
818
|
+
</v-row>
|
|
819
|
+
</v-col>
|
|
820
|
+
|
|
821
|
+
<v-col cols="3">
|
|
822
|
+
<v-row no-gutters>
|
|
823
|
+
<InputLabel class="text-capitalize" title="Middle Name" />
|
|
824
|
+
<v-col cols="12">
|
|
825
|
+
<v-text-field
|
|
826
|
+
v-model="
|
|
827
|
+
enrollment.parentGuardianInfo.father.middleName
|
|
828
|
+
"
|
|
829
|
+
></v-text-field>
|
|
830
|
+
</v-col>
|
|
831
|
+
</v-row>
|
|
832
|
+
</v-col>
|
|
833
|
+
|
|
834
|
+
<v-col cols="3">
|
|
835
|
+
<v-row no-gutters>
|
|
836
|
+
<InputLabel
|
|
837
|
+
class="text-capitalize"
|
|
838
|
+
title="Contact Number"
|
|
839
|
+
/>
|
|
840
|
+
<v-col cols="12">
|
|
841
|
+
<v-mask-input
|
|
842
|
+
v-model="
|
|
843
|
+
enrollment.parentGuardianInfo.father.contactNumber
|
|
844
|
+
"
|
|
845
|
+
:mask="{
|
|
846
|
+
mask: '09NN-NNN-NNNN',
|
|
847
|
+
tokens: {
|
|
848
|
+
N: { pattern: /[0-9]/ },
|
|
849
|
+
},
|
|
850
|
+
}"
|
|
851
|
+
placeholder="09XX-XXX-XXXX"
|
|
852
|
+
variant="outlined"
|
|
853
|
+
density="comfortable"
|
|
854
|
+
></v-mask-input>
|
|
855
|
+
</v-col>
|
|
856
|
+
</v-row>
|
|
857
|
+
</v-col>
|
|
858
|
+
</v-row>
|
|
859
|
+
</v-col>
|
|
860
|
+
|
|
861
|
+
<v-col cols="12">
|
|
862
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
863
|
+
Mother's Name
|
|
864
|
+
</span>
|
|
865
|
+
</v-col>
|
|
866
|
+
|
|
867
|
+
<v-col cols="12">
|
|
868
|
+
<v-row>
|
|
869
|
+
<v-col cols="3">
|
|
870
|
+
<v-row no-gutters>
|
|
871
|
+
<InputLabel
|
|
872
|
+
class="text-capitalize"
|
|
873
|
+
title="Last Name"
|
|
874
|
+
required
|
|
875
|
+
/>
|
|
876
|
+
<v-col cols="12">
|
|
877
|
+
<v-text-field
|
|
878
|
+
v-model="enrollment.parentGuardianInfo.mother.lastName"
|
|
879
|
+
:rules="[requiredRule]"
|
|
880
|
+
></v-text-field>
|
|
881
|
+
</v-col>
|
|
882
|
+
</v-row>
|
|
883
|
+
</v-col>
|
|
884
|
+
|
|
885
|
+
<v-col cols="3">
|
|
886
|
+
<v-row no-gutters>
|
|
887
|
+
<InputLabel
|
|
888
|
+
class="text-capitalize"
|
|
889
|
+
title="First Name"
|
|
890
|
+
required
|
|
891
|
+
/>
|
|
892
|
+
<v-col cols="12">
|
|
893
|
+
<v-text-field
|
|
894
|
+
v-model="enrollment.parentGuardianInfo.mother.firstName"
|
|
895
|
+
:rules="[requiredRule]"
|
|
896
|
+
></v-text-field>
|
|
897
|
+
</v-col>
|
|
898
|
+
</v-row>
|
|
899
|
+
</v-col>
|
|
900
|
+
|
|
901
|
+
<v-col cols="3">
|
|
902
|
+
<v-row no-gutters>
|
|
903
|
+
<InputLabel class="text-capitalize" title="Middle Name" />
|
|
904
|
+
<v-col cols="12">
|
|
905
|
+
<v-text-field
|
|
906
|
+
v-model="
|
|
907
|
+
enrollment.parentGuardianInfo.mother.middleName
|
|
908
|
+
"
|
|
909
|
+
></v-text-field>
|
|
910
|
+
</v-col>
|
|
911
|
+
</v-row>
|
|
912
|
+
</v-col>
|
|
913
|
+
|
|
914
|
+
<v-col cols="3">
|
|
915
|
+
<v-row no-gutters>
|
|
916
|
+
<InputLabel
|
|
917
|
+
class="text-capitalize"
|
|
918
|
+
title="Contact Number"
|
|
919
|
+
/>
|
|
920
|
+
<v-col cols="12">
|
|
921
|
+
<v-mask-input
|
|
922
|
+
v-model="
|
|
923
|
+
enrollment.parentGuardianInfo.mother.contactNumber
|
|
924
|
+
"
|
|
925
|
+
:mask="{
|
|
926
|
+
mask: '09NN-NNN-NNNN',
|
|
927
|
+
tokens: {
|
|
928
|
+
N: { pattern: /[0-9]/ },
|
|
929
|
+
},
|
|
930
|
+
}"
|
|
931
|
+
placeholder="09XX-XXX-XXXX"
|
|
932
|
+
variant="outlined"
|
|
933
|
+
density="comfortable"
|
|
934
|
+
></v-mask-input>
|
|
935
|
+
</v-col>
|
|
936
|
+
</v-row>
|
|
937
|
+
</v-col>
|
|
938
|
+
</v-row>
|
|
939
|
+
</v-col>
|
|
940
|
+
|
|
941
|
+
<v-col cols="12">
|
|
942
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
943
|
+
Legal Guardian’s Name
|
|
944
|
+
</span>
|
|
945
|
+
</v-col>
|
|
946
|
+
|
|
947
|
+
<v-col cols="3">
|
|
948
|
+
<v-checkbox
|
|
949
|
+
v-model="fatherLegalGuardianSame"
|
|
950
|
+
label="Father is the Legal Guardian"
|
|
951
|
+
hide-details
|
|
952
|
+
density="compact"
|
|
953
|
+
></v-checkbox>
|
|
954
|
+
</v-col>
|
|
955
|
+
|
|
956
|
+
<v-col cols="3">
|
|
957
|
+
<v-checkbox
|
|
958
|
+
v-model="motherLegalGuardianSame"
|
|
959
|
+
label="Mother is the Legal Guardian"
|
|
960
|
+
hide-details
|
|
961
|
+
density="compact"
|
|
962
|
+
></v-checkbox>
|
|
963
|
+
</v-col>
|
|
964
|
+
|
|
965
|
+
<v-col cols="12">
|
|
966
|
+
<v-row>
|
|
967
|
+
<v-col cols="3">
|
|
968
|
+
<v-row no-gutters>
|
|
969
|
+
<InputLabel
|
|
970
|
+
class="text-capitalize"
|
|
971
|
+
title="Last Name"
|
|
972
|
+
required
|
|
973
|
+
/>
|
|
974
|
+
<v-col cols="12">
|
|
975
|
+
<v-text-field
|
|
976
|
+
v-model="
|
|
977
|
+
enrollment.parentGuardianInfo.legalGuardian.lastName
|
|
978
|
+
"
|
|
979
|
+
:rules="[requiredRule]"
|
|
980
|
+
:readonly="
|
|
981
|
+
fatherLegalGuardianSame || motherLegalGuardianSame
|
|
982
|
+
"
|
|
983
|
+
></v-text-field>
|
|
984
|
+
</v-col>
|
|
985
|
+
</v-row>
|
|
986
|
+
</v-col>
|
|
987
|
+
|
|
988
|
+
<v-col cols="3">
|
|
989
|
+
<v-row no-gutters>
|
|
990
|
+
<InputLabel
|
|
991
|
+
class="text-capitalize"
|
|
992
|
+
title="First Name"
|
|
993
|
+
required
|
|
994
|
+
/>
|
|
995
|
+
<v-col cols="12">
|
|
996
|
+
<v-text-field
|
|
997
|
+
v-model="
|
|
998
|
+
enrollment.parentGuardianInfo.legalGuardian.firstName
|
|
999
|
+
"
|
|
1000
|
+
:rules="[requiredRule]"
|
|
1001
|
+
:readonly="
|
|
1002
|
+
fatherLegalGuardianSame || motherLegalGuardianSame
|
|
1003
|
+
"
|
|
1004
|
+
></v-text-field>
|
|
1005
|
+
</v-col>
|
|
1006
|
+
</v-row>
|
|
1007
|
+
</v-col>
|
|
1008
|
+
|
|
1009
|
+
<v-col cols="3">
|
|
1010
|
+
<v-row no-gutters>
|
|
1011
|
+
<InputLabel class="text-capitalize" title="Middle Name" />
|
|
1012
|
+
<v-col cols="12">
|
|
1013
|
+
<v-text-field
|
|
1014
|
+
v-model="
|
|
1015
|
+
enrollment.parentGuardianInfo.legalGuardian.middleName
|
|
1016
|
+
"
|
|
1017
|
+
:readonly="
|
|
1018
|
+
fatherLegalGuardianSame || motherLegalGuardianSame
|
|
1019
|
+
"
|
|
1020
|
+
></v-text-field>
|
|
1021
|
+
</v-col>
|
|
1022
|
+
</v-row>
|
|
1023
|
+
</v-col>
|
|
1024
|
+
|
|
1025
|
+
<v-col cols="3">
|
|
1026
|
+
<v-row no-gutters>
|
|
1027
|
+
<InputLabel
|
|
1028
|
+
class="text-capitalize"
|
|
1029
|
+
title="Contact Number"
|
|
1030
|
+
/>
|
|
1031
|
+
<v-col cols="12">
|
|
1032
|
+
<v-mask-input
|
|
1033
|
+
v-model="
|
|
1034
|
+
enrollment.parentGuardianInfo.legalGuardian
|
|
1035
|
+
.contactNumber
|
|
1036
|
+
"
|
|
1037
|
+
:mask="{
|
|
1038
|
+
mask: '09NN-NNN-NNNN',
|
|
1039
|
+
tokens: {
|
|
1040
|
+
N: { pattern: /[0-9]/ },
|
|
1041
|
+
},
|
|
1042
|
+
}"
|
|
1043
|
+
placeholder="09XX-XXX-XXXX"
|
|
1044
|
+
variant="outlined"
|
|
1045
|
+
density="comfortable"
|
|
1046
|
+
:readonly="
|
|
1047
|
+
fatherLegalGuardianSame || motherLegalGuardianSame
|
|
1048
|
+
"
|
|
1049
|
+
></v-mask-input>
|
|
1050
|
+
</v-col>
|
|
1051
|
+
</v-row>
|
|
1052
|
+
</v-col>
|
|
1053
|
+
</v-row>
|
|
1054
|
+
</v-col>
|
|
1055
|
+
</v-row>
|
|
1056
|
+
</v-col>
|
|
1057
|
+
</v-row>
|
|
1058
|
+
</v-col>
|
|
1059
|
+
|
|
1060
|
+
<v-col v-else cols="12">
|
|
1061
|
+
<v-row no-gutters>
|
|
1062
|
+
<v-col cols="12">
|
|
1063
|
+
<v-row>
|
|
1064
|
+
<v-col cols="3">
|
|
1065
|
+
<v-row no-gutters>
|
|
1066
|
+
<InputLabel
|
|
1067
|
+
class="text-capitalize"
|
|
1068
|
+
title="Last Grade Level Completed"
|
|
1069
|
+
required
|
|
1070
|
+
/>
|
|
1071
|
+
<v-col cols="12">
|
|
1072
|
+
<v-autocomplete
|
|
1073
|
+
v-model="enrollment.lastGradeLevelCompleted"
|
|
1074
|
+
:rules="[requiredRule]"
|
|
1075
|
+
:items="gradeLevels"
|
|
1076
|
+
></v-autocomplete>
|
|
1077
|
+
</v-col>
|
|
1078
|
+
</v-row>
|
|
1079
|
+
</v-col>
|
|
1080
|
+
|
|
1081
|
+
<v-col cols="3">
|
|
1082
|
+
<v-row no-gutters>
|
|
1083
|
+
<InputLabel
|
|
1084
|
+
class="text-capitalize"
|
|
1085
|
+
title="Last School Year Completed"
|
|
1086
|
+
required
|
|
1087
|
+
/>
|
|
1088
|
+
<v-col cols="12">
|
|
1089
|
+
<v-autocomplete
|
|
1090
|
+
v-model="enrollment.lastGradeLevelCompleted"
|
|
1091
|
+
:rules="[requiredRule]"
|
|
1092
|
+
:items="lastSchoolYearOptions"
|
|
1093
|
+
></v-autocomplete>
|
|
1094
|
+
</v-col>
|
|
1095
|
+
</v-row>
|
|
1096
|
+
</v-col>
|
|
1097
|
+
</v-row>
|
|
1098
|
+
</v-col>
|
|
1099
|
+
|
|
1100
|
+
<v-col cols="8">
|
|
1101
|
+
<v-row no-gutters>
|
|
1102
|
+
<InputLabel
|
|
1103
|
+
class="text-capitalize"
|
|
1104
|
+
title="Last School Attended"
|
|
1105
|
+
required
|
|
1106
|
+
/>
|
|
1107
|
+
<v-col cols="12">
|
|
1108
|
+
<v-text-field
|
|
1109
|
+
v-model="enrollment.lastSchoolAttended"
|
|
1110
|
+
:rules="[requiredRule]"
|
|
1111
|
+
></v-text-field>
|
|
1112
|
+
</v-col>
|
|
1113
|
+
</v-row>
|
|
1114
|
+
</v-col>
|
|
1115
|
+
</v-row>
|
|
1116
|
+
</v-col>
|
|
1117
|
+
|
|
1118
|
+
<v-col cols="12" class="mt-4">
|
|
1119
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
1120
|
+
If school will implement other distance learning modalities aside from
|
|
1121
|
+
face-to-face instruction, what would you prefer for your child?
|
|
1122
|
+
</span>
|
|
1123
|
+
</v-col>
|
|
1124
|
+
|
|
1125
|
+
<v-col cols="12" class="mt-2">
|
|
1126
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
1127
|
+
Choose all that apply:
|
|
1128
|
+
</span>
|
|
1129
|
+
</v-col>
|
|
1130
|
+
|
|
1131
|
+
<v-col cols="12">
|
|
1132
|
+
<v-row no-gutters>
|
|
1133
|
+
<v-col v-for="alternative in alternativeLearning" cols="3">
|
|
1134
|
+
<v-checkbox
|
|
1135
|
+
v-model="enrollment.alternativeLearningOptions"
|
|
1136
|
+
label="Modular (Print)"
|
|
1137
|
+
hide-details
|
|
1138
|
+
density="compact"
|
|
1139
|
+
:value="alternative"
|
|
1140
|
+
>
|
|
1141
|
+
<template #label>
|
|
1142
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
1143
|
+
{{ alternative }}
|
|
1144
|
+
</span>
|
|
1145
|
+
</template>
|
|
1146
|
+
</v-checkbox>
|
|
1147
|
+
</v-col>
|
|
1148
|
+
</v-row>
|
|
1149
|
+
</v-col>
|
|
1150
|
+
|
|
1151
|
+
<v-col cols="12" class="mt-16">
|
|
1152
|
+
<v-checkbox
|
|
1153
|
+
v-model="enrollment.isCertifiedAndConsented"
|
|
1154
|
+
hide-details
|
|
1155
|
+
density="compact"
|
|
1156
|
+
:rules="[requiredRule]"
|
|
1157
|
+
>
|
|
1158
|
+
<template v-slot:label>
|
|
1159
|
+
<span class="font-weight-bold text-subtitle-2">
|
|
1160
|
+
I hereby certify that the above information given are true and
|
|
1161
|
+
correct o the best of my knowledge and I allow the Department of
|
|
1162
|
+
Education to use my child’s details to create and/or update his/her
|
|
1163
|
+
learner profile in the Learner Information System. The information
|
|
1164
|
+
herein shall be treated as confidential in compliance with the Data
|
|
1165
|
+
Privacy Act of 2012.
|
|
1166
|
+
</span>
|
|
1167
|
+
</template>
|
|
1168
|
+
</v-checkbox>
|
|
1169
|
+
</v-col>
|
|
1170
|
+
</v-row>
|
|
1171
|
+
</template>
|
|
1172
|
+
<script setup lang="ts">
|
|
1173
|
+
const prop = defineProps({
|
|
1174
|
+
selfService: {
|
|
1175
|
+
type: Boolean,
|
|
1176
|
+
default: false,
|
|
1177
|
+
},
|
|
1178
|
+
});
|
|
1179
|
+
|
|
1180
|
+
import { VMaskInput } from "vuetify/labs/VMaskInput";
|
|
1181
|
+
const { requiredRule } = useUtils();
|
|
1182
|
+
|
|
1183
|
+
const regionOptions: string[] = [];
|
|
1184
|
+
const provinceOptions: string[] = [];
|
|
1185
|
+
const cityMunicipalityOptions: string[] = [];
|
|
1186
|
+
|
|
1187
|
+
const {
|
|
1188
|
+
gradeLevels,
|
|
1189
|
+
generateSchoolYears,
|
|
1190
|
+
getPhilippineCities,
|
|
1191
|
+
getPhilippineMunicipalities,
|
|
1192
|
+
motherTongueOptions,
|
|
1193
|
+
} = useBasicEdu();
|
|
1194
|
+
|
|
1195
|
+
const effectiveSchoolYearOptions = generateSchoolYears();
|
|
1196
|
+
const lastSchoolYearOptions = generateSchoolYears(50).reverse();
|
|
1197
|
+
|
|
1198
|
+
const { data: citiesData } = await useLazyAsyncData("getCities", () =>
|
|
1199
|
+
getPhilippineCities()
|
|
1200
|
+
);
|
|
1201
|
+
|
|
1202
|
+
const { data: municipalitiesData } = await useLazyAsyncData(
|
|
1203
|
+
"getMunicipalities",
|
|
1204
|
+
() => getPhilippineMunicipalities()
|
|
1205
|
+
);
|
|
1206
|
+
|
|
1207
|
+
const citiesMunicipalities = computed(() => {
|
|
1208
|
+
return [
|
|
1209
|
+
...(citiesData.value || []).map((i: any) => i.name),
|
|
1210
|
+
...(municipalitiesData.value || []).map(
|
|
1211
|
+
(i: any) => `Municipality of ${i.name}`
|
|
1212
|
+
),
|
|
1213
|
+
];
|
|
1214
|
+
});
|
|
1215
|
+
|
|
1216
|
+
const indigenousCommunitiesPhilippines = [
|
|
1217
|
+
// Luzon (Northern Philippines) - Cordillera Groups (Igorot Subgroups)
|
|
1218
|
+
"Ifugao",
|
|
1219
|
+
"Bontoc",
|
|
1220
|
+
"Kalinga",
|
|
1221
|
+
"Ibaloi",
|
|
1222
|
+
"Kankanaey",
|
|
1223
|
+
"Isneg",
|
|
1224
|
+
"Tinguian",
|
|
1225
|
+
|
|
1226
|
+
// Luzon (Northern Philippines) - Negrito Groups
|
|
1227
|
+
"Aeta",
|
|
1228
|
+
"Agta",
|
|
1229
|
+
"Dumagat",
|
|
1230
|
+
|
|
1231
|
+
// Visayas (Central Philippines) - Mindoro, Palawan, and other groups
|
|
1232
|
+
"Hanunoo (Mindoro)",
|
|
1233
|
+
"Buhid (Mindoro)",
|
|
1234
|
+
"Iraya (Mindoro)",
|
|
1235
|
+
"Tagbanwa (Palawan)",
|
|
1236
|
+
"Palawano (Palawan)",
|
|
1237
|
+
"Batak (Palawan)",
|
|
1238
|
+
"Ati (Visayas)",
|
|
1239
|
+
"Suludnon (Panay)",
|
|
1240
|
+
|
|
1241
|
+
// Mindanao (Southern Philippines) - Lumad Subgroups (Non-Muslim)
|
|
1242
|
+
"Manobo",
|
|
1243
|
+
"T'boli",
|
|
1244
|
+
"B'laan",
|
|
1245
|
+
"Higaonon",
|
|
1246
|
+
"Mandaya",
|
|
1247
|
+
"Bagobo",
|
|
1248
|
+
"Subanen",
|
|
1249
|
+
"Talaandig",
|
|
1250
|
+
|
|
1251
|
+
// Mindanao (Southern Philippines) - Moro Groups (Muslim)
|
|
1252
|
+
"Maranao",
|
|
1253
|
+
"Maguindanao",
|
|
1254
|
+
"Tausug",
|
|
1255
|
+
"Yakan",
|
|
1256
|
+
"Sama-Bajau",
|
|
1257
|
+
];
|
|
1258
|
+
|
|
1259
|
+
const returningLearner = ref(false);
|
|
1260
|
+
const withDisability = ref(false);
|
|
1261
|
+
const sameAsCurrentAddress = ref(false);
|
|
1262
|
+
const fatherLegalGuardianSame = ref(false);
|
|
1263
|
+
const motherLegalGuardianSame = ref(false);
|
|
1264
|
+
|
|
1265
|
+
const alternativeLearning = [
|
|
1266
|
+
"Modular (Print)",
|
|
1267
|
+
"Online",
|
|
1268
|
+
"Radio-Based Instruction",
|
|
1269
|
+
"Blended",
|
|
1270
|
+
"Modular (Digital)",
|
|
1271
|
+
"Educational Television",
|
|
1272
|
+
"Homeschooling",
|
|
1273
|
+
];
|
|
1274
|
+
|
|
1275
|
+
const enrollment = defineModel<TBasicEducEnrForm>({
|
|
1276
|
+
default: () => useEnrollment().enrollment,
|
|
1277
|
+
});
|
|
1278
|
+
|
|
1279
|
+
watch(returningLearner, (val) => {
|
|
1280
|
+
if (val) {
|
|
1281
|
+
enrollment.value.learnerInfo.psaBirthCertificateNo = "";
|
|
1282
|
+
enrollment.value.learnerInfo.learnerReferenceNumber = "";
|
|
1283
|
+
enrollment.value.learnerInfo.firstName = "";
|
|
1284
|
+
enrollment.value.learnerInfo.middleName = "";
|
|
1285
|
+
enrollment.value.learnerInfo.lastName = "";
|
|
1286
|
+
enrollment.value.learnerInfo.extensionName = "";
|
|
1287
|
+
enrollment.value.learnerInfo.birthDate = "";
|
|
1288
|
+
enrollment.value.learnerInfo.placeOfBirth = "";
|
|
1289
|
+
enrollment.value.learnerInfo.sex = "";
|
|
1290
|
+
enrollment.value.learnerInfo.motherTongue = "";
|
|
1291
|
+
enrollment.value.learnerInfo.age = 0;
|
|
1292
|
+
enrollment.value.learnerInfo.disabilities = [];
|
|
1293
|
+
enrollment.value.learnerInfo.indigenousCommunity = "";
|
|
1294
|
+
enrollment.value.learnerInfo.fourPsHouseholdId = "";
|
|
1295
|
+
enrollment.value.parentGuardianInfo.father.firstName = "";
|
|
1296
|
+
enrollment.value.parentGuardianInfo.father.lastName = "";
|
|
1297
|
+
enrollment.value.parentGuardianInfo.father.middleName = "";
|
|
1298
|
+
enrollment.value.parentGuardianInfo.father.contactNumber = "";
|
|
1299
|
+
enrollment.value.parentGuardianInfo.mother.firstName = "";
|
|
1300
|
+
enrollment.value.parentGuardianInfo.mother.lastName = "";
|
|
1301
|
+
enrollment.value.parentGuardianInfo.mother.middleName = "";
|
|
1302
|
+
enrollment.value.parentGuardianInfo.mother.contactNumber = "";
|
|
1303
|
+
enrollment.value.parentGuardianInfo.legalGuardian.firstName = "";
|
|
1304
|
+
enrollment.value.parentGuardianInfo.legalGuardian.lastName = "";
|
|
1305
|
+
enrollment.value.parentGuardianInfo.legalGuardian.middleName = "";
|
|
1306
|
+
enrollment.value.parentGuardianInfo.legalGuardian.contactNumber = "";
|
|
1307
|
+
enrollment.value.address.current.houseNumber = "";
|
|
1308
|
+
enrollment.value.address.current.streetName = "";
|
|
1309
|
+
enrollment.value.address.current.sitio = "";
|
|
1310
|
+
enrollment.value.address.current.barangay = "";
|
|
1311
|
+
enrollment.value.address.current.municipalityCity = "";
|
|
1312
|
+
enrollment.value.address.current.province = "";
|
|
1313
|
+
enrollment.value.address.current.country = "";
|
|
1314
|
+
enrollment.value.address.current.zipCode = "";
|
|
1315
|
+
enrollment.value.address.permanent.houseNumber = "";
|
|
1316
|
+
enrollment.value.address.permanent.streetName = "";
|
|
1317
|
+
enrollment.value.address.permanent.sitio = "";
|
|
1318
|
+
enrollment.value.address.permanent.barangay = "";
|
|
1319
|
+
enrollment.value.address.permanent.municipalityCity = "";
|
|
1320
|
+
enrollment.value.address.permanent.province = "";
|
|
1321
|
+
enrollment.value.address.permanent.country = "";
|
|
1322
|
+
enrollment.value.address.permanent.zipCode = "";
|
|
1323
|
+
}
|
|
1324
|
+
});
|
|
1325
|
+
|
|
1326
|
+
watchEffect(() => {
|
|
1327
|
+
if (sameAsCurrentAddress.value) {
|
|
1328
|
+
enrollment.value.address.permanent.houseNumber =
|
|
1329
|
+
enrollment.value.address.current.houseNumber;
|
|
1330
|
+
enrollment.value.address.permanent.streetName =
|
|
1331
|
+
enrollment.value.address.current.streetName;
|
|
1332
|
+
enrollment.value.address.permanent.sitio =
|
|
1333
|
+
enrollment.value.address.current.sitio;
|
|
1334
|
+
enrollment.value.address.permanent.barangay =
|
|
1335
|
+
enrollment.value.address.current.barangay;
|
|
1336
|
+
enrollment.value.address.permanent.municipalityCity =
|
|
1337
|
+
enrollment.value.address.current.municipalityCity;
|
|
1338
|
+
enrollment.value.address.permanent.province =
|
|
1339
|
+
enrollment.value.address.current.province;
|
|
1340
|
+
enrollment.value.address.permanent.country =
|
|
1341
|
+
enrollment.value.address.current.country;
|
|
1342
|
+
enrollment.value.address.permanent.zipCode =
|
|
1343
|
+
enrollment.value.address.current.zipCode;
|
|
1344
|
+
} else {
|
|
1345
|
+
enrollment.value.address.permanent.houseNumber = "";
|
|
1346
|
+
enrollment.value.address.permanent.streetName = "";
|
|
1347
|
+
enrollment.value.address.permanent.sitio = "";
|
|
1348
|
+
enrollment.value.address.permanent.barangay = "";
|
|
1349
|
+
enrollment.value.address.permanent.municipalityCity = "";
|
|
1350
|
+
enrollment.value.address.permanent.province = "";
|
|
1351
|
+
enrollment.value.address.permanent.country = "";
|
|
1352
|
+
enrollment.value.address.permanent.zipCode = "";
|
|
1353
|
+
}
|
|
1354
|
+
});
|
|
1355
|
+
|
|
1356
|
+
watchEffect(() => {
|
|
1357
|
+
if (fatherLegalGuardianSame.value) {
|
|
1358
|
+
enrollment.value.parentGuardianInfo.legalGuardian.firstName =
|
|
1359
|
+
enrollment.value.parentGuardianInfo.father.firstName;
|
|
1360
|
+
enrollment.value.parentGuardianInfo.legalGuardian.lastName =
|
|
1361
|
+
enrollment.value.parentGuardianInfo.father.lastName;
|
|
1362
|
+
enrollment.value.parentGuardianInfo.legalGuardian.middleName =
|
|
1363
|
+
enrollment.value.parentGuardianInfo.father.middleName;
|
|
1364
|
+
enrollment.value.parentGuardianInfo.legalGuardian.contactNumber =
|
|
1365
|
+
enrollment.value.parentGuardianInfo.father.contactNumber;
|
|
1366
|
+
motherLegalGuardianSame.value = false;
|
|
1367
|
+
} else {
|
|
1368
|
+
enrollment.value.parentGuardianInfo.legalGuardian.firstName = "";
|
|
1369
|
+
enrollment.value.parentGuardianInfo.legalGuardian.lastName = "";
|
|
1370
|
+
enrollment.value.parentGuardianInfo.legalGuardian.middleName = "";
|
|
1371
|
+
enrollment.value.parentGuardianInfo.legalGuardian.contactNumber = "";
|
|
1372
|
+
}
|
|
1373
|
+
});
|
|
1374
|
+
|
|
1375
|
+
watchEffect(() => {
|
|
1376
|
+
if (motherLegalGuardianSame.value) {
|
|
1377
|
+
enrollment.value.parentGuardianInfo.legalGuardian.firstName =
|
|
1378
|
+
enrollment.value.parentGuardianInfo.mother.firstName;
|
|
1379
|
+
enrollment.value.parentGuardianInfo.legalGuardian.lastName =
|
|
1380
|
+
enrollment.value.parentGuardianInfo.mother.lastName;
|
|
1381
|
+
enrollment.value.parentGuardianInfo.legalGuardian.middleName =
|
|
1382
|
+
enrollment.value.parentGuardianInfo.mother.middleName;
|
|
1383
|
+
enrollment.value.parentGuardianInfo.legalGuardian.contactNumber =
|
|
1384
|
+
enrollment.value.parentGuardianInfo.mother.contactNumber;
|
|
1385
|
+
fatherLegalGuardianSame.value = false;
|
|
1386
|
+
} else {
|
|
1387
|
+
enrollment.value.parentGuardianInfo.legalGuardian.firstName = "";
|
|
1388
|
+
enrollment.value.parentGuardianInfo.legalGuardian.lastName = "";
|
|
1389
|
+
enrollment.value.parentGuardianInfo.legalGuardian.middleName = "";
|
|
1390
|
+
enrollment.value.parentGuardianInfo.legalGuardian.contactNumber = "";
|
|
1391
|
+
}
|
|
1392
|
+
});
|
|
1393
|
+
|
|
1394
|
+
import { useMask } from "vuetify";
|
|
1395
|
+
|
|
1396
|
+
watchEffect(() => {
|
|
1397
|
+
const mask = useMask({ mask: "##/##/####" });
|
|
1398
|
+
const date = mask.mask(enrollment.value.learnerInfo.birthDate);
|
|
1399
|
+
if (
|
|
1400
|
+
enrollment.value.learnerInfo.birthDate &&
|
|
1401
|
+
new Date(date).toString() !== "Invalid Date"
|
|
1402
|
+
) {
|
|
1403
|
+
const birthDate = new Date(date);
|
|
1404
|
+
|
|
1405
|
+
const today = new Date();
|
|
1406
|
+
let age = today.getFullYear() - birthDate.getFullYear();
|
|
1407
|
+
const monthDiff = today.getMonth() - birthDate.getMonth();
|
|
1408
|
+
if (
|
|
1409
|
+
monthDiff < 0 ||
|
|
1410
|
+
(monthDiff === 0 && today.getDate() < birthDate.getDate())
|
|
1411
|
+
) {
|
|
1412
|
+
age--;
|
|
1413
|
+
}
|
|
1414
|
+
enrollment.value.learnerInfo.age = age;
|
|
1415
|
+
} else {
|
|
1416
|
+
enrollment.value.learnerInfo.age = 0;
|
|
1417
|
+
}
|
|
1418
|
+
});
|
|
1419
|
+
</script>
|