initial commit

resources/js/components/Form/SelectInput.vue

@@ -0,0 +1,43 @@
+<template>
+    <div class="input-div">
+        <select
+            :class="className"
+            @input="$emit('update:modelValue', $event.target.value)"
+            v-model="input"
+            @change="validateInput"
+        >
+        <option v-if="empty" value="" disabled>{{empty}}</option>
+        <option :key="item.id" v-for="item in items" :value="item.id">{{item.value}}</option>
+        </select>
+        <ValidationError :msg="errors[name]"/>
+    </div>
+</template>
+
+<script>
+import { ref } from "vue";
+import useFormValidation from "@/Validation/useFormValidation";
+export default {
+    props:{
+        className:String|Object,
+        placeholder:String,
+        rules:Array,
+        items:Array,
+        empty:String
+
+    },
+    setup(props) {
+        let input = ref("");
+        const name = props.placeholder
+        const { validate, errors} = useFormValidation();
+        const validateInput = () => {
+            validate(props.rules,{},name, input.value);
+        };
+
+        if(props.errormsg){
+            errors[name] = props.errormsg
+        }
+        console.log("errors[name]",errors);
+        return { input,name, errors, validateInput };
+    },
+};
+</script>