initial commit

resources/js/plugins/custom.js

@@ -0,0 +1,72 @@
+import { ref } from 'vue'
+
+export default function myPlugin() {
+  return {
+    apply: 'RadiogroupElement',
+    setup(props, context, component) {
+        const myRef = ref(null)
+        console.log('component',component.form$.value,context)
+        
+        const disqualifyValues = context?.attrs?.disqualify?.split(',').map(val => val.trim()) || []
+        console.log('Disqualify Values:', disqualifyValues)
+
+        const radioValue = ref(component.value)
+
+        // Watch the value of the radio group
+        watch(radioValue, (newValue) => {
+            if (!disqualifyValues.includes(newValue)) {
+            console.log('Selected value is not disqualified:', newValue)
+            myRef.value = `Selected value: ${newValue}`
+            } else {
+            console.log('Selected value is disqualified:', newValue)
+            myRef.value = 'This option is disqualified'
+            console.log('component element',component.form$.value.$el)
+            component.form$.value.$el.setAttribute('disqualify',true) 
+            // context.emit('handleDisqualifyStep')
+            }
+        })
+
+        watch(() => component.value, (newValue) => {
+            radioValue.value = newValue
+        })
+
+        // const checkDisqualification = () => {
+        //     if (disqualifyValues.includes(radioValue.value)) {
+        //     console.log('Selected value is disqualified:', radioValue.value)
+        //     myRef.value = 'This option is disqualified'
+            
+        //     // Navigate to the disqualification step
+        //     if (context.$emit) {
+        //         context.$emit('go-to-step', 'disqualification')
+        //     }
+        //     } else {
+        //     console.log('Selected value is not disqualified:', radioValue.value)
+        //     myRef.value = `Selected value: ${radioValue.value}`
+        //     }
+        // }
+    
+        // const handleNextStep = () => {
+        //     checkDisqualification()
+        // }
+    
+        // // Watch the form submission or next button click event
+        // onMounted(() => {
+        //     component.on('next-step', handleNextStep)
+        // })
+    
+        // onBeforeUnmount(() => {
+        //     component.off('next-step', handleNextStep)
+        // })
+    
+        // // Update the radioValue when component.value changes
+        // watch(() => component.value, (newValue) => {
+        //     radioValue.value = newValue
+        // })
+
+        return {
+            ...component,
+            myRef,
+        }
+    },
+  }
+}