17th-Ranger-Battalion-ORG/milsim-site-v4
8
1
Fork 0
Code Issues 22 Pull Requests 1 Actions 2 Packages Projects Releases Wiki Activity

added support for optional checkboxes

Browse Source
This commit is contained in:
ajdj100
2025-11-20 14:27:34 -05:00
parent 23ebbe7a85
commit d9e4c1d6ff
4 changed files with 46 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
ui/src/components/trainingReport/trainingReportForm.vue
View File

@@ -3,7 +3,7 @@ import { trainingReportSchema, courseEventAttendeeSchema } from '@shared/schemas
import { Course, CourseAttendee, CourseAttendeeRole, CourseEventDetails } from '@shared/types/course'
import { useForm, useFieldArray, FieldArray as VeeFieldArray, ErrorMessage, Field as VeeField } from 'vee-validate'
import { toTypedSchema } from '@vee-validate/zod'
import { onMounted, ref } from 'vue'
import { computed, onMounted, ref } from 'vue'
import { getAllAttendeeRoles, getAllTrainings, postTrainingReport } from '@/api/trainingReport'
import { getMembers, Member } from '@/api/member'
import FieldGroup from '../ui/field/FieldGroup.vue'
@@ -19,7 +19,7 @@ import FieldLegend from '../ui/field/FieldLegend.vue'
import FieldDescription from '../ui/field/FieldDescription.vue'
import Checkbox from '../ui/checkbox/Checkbox.vue'
const { handleSubmit, resetForm, errors } = useForm({
const { handleSubmit, resetForm, errors , values } = useForm({
validationSchema: toTypedSchema(trainingReportSchema),
initialValues: {
course_id: null,
@@ -55,6 +55,8 @@ function onSubmit(vals) {
const { remove, push, fields } = useFieldArray('attendees');
const selectedCourse = computed<Course | undefined>(() => {return trainings.value?.find(c => c.id == values.course_id)})
const trainings = ref<Course[] | null>(null);
const members = ref<Member[] | null>(null);
const eventRoles = ref<CourseAttendeeRole[] | null>(null);
@@ -108,7 +110,8 @@ onMounted(async () => {
class="grid grid-cols-[180px_140px_50px_1fr_auto] gap-3 font-medium text-sm text-muted-foreground px-1">
<div>Member</div>
<div>Role</div>
<div>Passed</div>
<div v-if="selectedCourse?.hasBookwork">Bookwork</div>
<div v-if="selectedCourse?.hasQual">Qual</div>
<div>Remarks</div>
<div></div> <!-- empty for remove button -->
</div>
@@ -146,7 +149,7 @@ onMounted(async () => {
</VeeField>
<!-- Passed Checkbox -->
<VeeField v-slot="{ field }" :name="`attendees[${index}].passed`" type="checkbox"
<VeeField v-if="selectedCourse?.hasBookwork" v-slot="{ field }" :name="`attendees[${index}].passed`" type="checkbox"
:value="true" :unchecked-value="false">
<label>
<input type="checkbox" :name="`attendees[${index}].passed`" v-bind="field"
@@ -154,6 +157,14 @@ onMounted(async () => {
</label>
</VeeField>
<!-- Passed Checkbox -->
<VeeField v-if="selectedCourse?.hasQual" v-slot="{ field }" :name="`attendees[${index}].passed`" type="checkbox"
:value="true" :unchecked-value="false">
<label>
<input type="checkbox" :name="`attendees[${index}].passed`" v-bind="field"
:value="true" />
</label>
</VeeField>
<!-- Remarks -->
<VeeField :name="`attendees[${index}].remarks`" v-slot="{ field: f, errors: e }">