jivanrij/go-no-go
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Also improves how buttons are shown with the missing files.

Browse Source
This commit is contained in:
Jonathan van Rij
2026-02-16 09:13:54 +01:00
parent bc1d5a2796
commit 07a8276899
5 changed files with 45 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
resources/js/Components/QuestionCard.vue
View File

@@ -1,5 +1,6 @@
<script setup>
import { computed } from 'vue'
import RadioButtonGroup from '@/Components/RadioButtonGroup.vue'
const props = defineProps({
question: {
@@ -39,6 +40,14 @@ const isTextOnly = computed(() => {
return !hasRadioButtons.value && props.question.details
})
const availableOptions = computed(() => {
const opts = []
if (props.question.has_yes) opts.push({ value: 'yes', label: 'Yes' })
if (props.question.has_no) opts.push({ value: 'no', label: 'No' })
if (props.question.has_na) opts.push({ value: 'not_applicable', label: 'N/A' })
return opts
})
const updateValue = (value) => {
emit('update:modelValue', { ...props.modelValue, value })
}
@@ -65,41 +74,13 @@ const updateTextValue = (event) => {
<!-- Radio button question -->
<div v-if="hasRadioButtons">
<div class="flex flex-wrap gap-4 mb-3">
<label v-if="question.has_yes" class="flex items-center gap-2 cursor-pointer">
<input
type="radio"
:name="`question-${question.id}`"
value="yes"
:checked="modelValue.value === 'yes'"
@change="updateValue('yes')"
class="w-4 h-4 text-primary bg-surface border-gray-600 focus:ring-primary focus:ring-offset-surface"
/>
<span class="text-white">Yes</span>
</label>
<label v-if="question.has_no" class="flex items-center gap-2 cursor-pointer">
<input
type="radio"
:name="`question-${question.id}`"
value="no"
:checked="modelValue.value === 'no'"
@change="updateValue('no')"
class="w-4 h-4 text-primary bg-surface border-gray-600 focus:ring-primary focus:ring-offset-surface"
/>
<span class="text-white">No</span>
</label>
<label v-if="question.has_na" class="flex items-center gap-2 cursor-pointer">
<input
type="radio"
:name="`question-${question.id}`"
value="not_applicable"
:checked="modelValue.value === 'not_applicable'"
@change="updateValue('not_applicable')"
class="w-4 h-4 text-primary bg-surface border-gray-600 focus:ring-primary focus:ring-offset-surface"
/>
<span class="text-white">N/A</span>
</label>
</div>
<RadioButtonGroup
:modelValue="modelValue.value"
@update:modelValue="updateValue($event)"
:name="`question-${question.id}`"
:options="availableOptions"
class="mb-3"
/>
<!-- Details textarea (conditional) -->
<div v-if="showDetails" class="mt-2">

33
resources/js/Pages/Screening/Show.vue
View File

@@ -3,6 +3,7 @@ import { computed } from 'vue'
import { Head, useForm } from '@inertiajs/vue3'
import AppLayout from '@/Layouts/AppLayout.vue'
import AppButton from '@/Components/AppButton.vue'
import RadioButtonGroup from '@/Components/RadioButtonGroup.vue'
defineOptions({ layout: AppLayout })
@@ -54,30 +55,14 @@ const allAnswered = computed(() => {
<span class="text-gray-400 font-mono text-sm mt-1 shrink-0">{{ index + 1 }}.</span>
<div class="flex-1">
<p class="text-white mb-3">{{ question }}</p>
<div class="flex gap-4">
<label class="flex items-center gap-2 cursor-pointer">
<input
type="radio"
:name="`question-${index + 1}`"
value="yes"
v-model="form.answers[index + 1]"
class="w-4 h-4 text-primary bg-surface border-gray-600 focus:ring-primary focus:ring-offset-surface"
data-cy="yes"
/>
<span class="text-white">Yes</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<input
type="radio"
:name="`question-${index + 1}`"
value="no"
v-model="form.answers[index + 1]"
class="w-4 h-4 text-primary bg-surface border-gray-600 focus:ring-primary focus:ring-offset-surface"
data-cy="no"
/>
<span class="text-white">No</span>
</label>
</div>
<RadioButtonGroup
v-model="form.answers[index + 1]"
:name="`question-${index + 1}`"
:options="[
{ value: 'yes', label: 'Yes' },
{ value: 'no', label: 'No' },
]"
/>
<p v-if="form.errors[`answers.${index + 1}`]" class="text-red-500 text-sm mt-1">
{{ form.errors[`answers.${index + 1}`] }}
</p>