portal/resources/assets/vue/components/general/forms/ValidationWrapperComponent.vue

<template>
    <div class="animate__animated" :class="[{'animate__shake': validator.$error}]">
        <div class="row">
            <div class="col">
                <div class="form-group no-margin form-group-default" :class="[{' has-error': validator.$error}, {'form-group-default-select2': selecatable}, {'p-b-5': selecatable}]">
                    <slot></slot>
                </div>
            </div>
        </div>
        <div class="row m-t-5" v-show="validator.$error">
            <div class="col">
                <validation-error-component :validator="validator"></validation-error-component>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        props: {
            validator: {
                required: true
            },
            selecatable: {
                type: Boolean,
                default: false
            }
        }
    }
</script>