perf: remove required logic for some inputs

src/components/VnTable/VnTable.vue

@@ -58,7 +58,7 @@ const $props = defineProps({
         default: 'flex-one',
     },
     searchUrl: {
-        type: [String, Boolean],
+        type: String,
         default: 'table',
     },
     isEditable: {

src/components/common/VnInput.vue

@@ -2,7 +2,6 @@
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useValidator } from 'src/composables/useValidator';
-import { useAttrs } from 'vue';
 
 const emit = defineEmits([
     'update:modelValue',
@@ -30,11 +29,10 @@ const $props = defineProps({
     },
 });
 const { validations } = useValidator();
-const $attrs = useAttrs();
 
 const { t } = useI18n();
-const requiredFieldRule = (val) => validations().required(isRequired.value, val);
-const isRequired = computed(() => Object.keys($attrs).includes('required'));
+const requiredFieldRule = (val) => validations().required($attrs.required, val);
+
 const vnInputRef = ref(null);
 const value = computed({
     get() {
@@ -59,6 +57,12 @@ const focus = () => {
     vnInputRef.value.focus();
 };
 
+defineExpose({
+    focus,
+});
+import { useAttrs } from 'vue';
+const $attrs = useAttrs();
+
 const mixinRules = [
     requiredFieldRule,
     ...($attrs.rules ?? []),
@@ -72,9 +76,6 @@ const mixinRules = [
         }
     },
 ];
-defineExpose({
-    focus,
-});
 </script>
 
 <template>
@@ -84,7 +85,7 @@ defineExpose({
             v-model="value"
             v-bind="{ ...$attrs, ...styleAttrs }"
             :type="$attrs.type"
-            :class="{ required: isRequired }"
+            :class="{ required: $attrs.required }"
             @keyup.enter="emit('keyup.enter')"
             :clearable="false"
             :rules="mixinRules"

src/components/common/VnInputNumber.vue

@@ -1,13 +1,8 @@
 <script setup>
 import VnInput from 'src/components/common/VnInput.vue';
-import { ref } from 'vue';
-import { useAttrs } from 'vue';
-
 const model = defineModel({ type: [Number, String] });
-const $attrs = useAttrs();
-const step = ref($attrs.step || 0.01);
 </script>
 
 <template>
-    <VnInput v-bind="$attrs" v-model.number="model" type="number" :step="step" />
+    <VnInput v-bind="$attrs" v-model.number="model" type="number" />
 </template>

src/components/common/VnLocation.vue

@@ -2,24 +2,16 @@
 import CreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
 import VnSelectDialog from 'components/common/VnSelectDialog.vue';
 import { useI18n } from 'vue-i18n';
-import { computed, ref } from 'vue';
+import { ref } from 'vue';
 const { t } = useI18n();
 const emit = defineEmits(['update:model-value', 'update:options']);
-const { validations } = useValidator();
 
-import { useAttrs } from 'vue';
-import { useValidator } from 'src/composables/useValidator';
-const $attrs = useAttrs();
 const props = defineProps({
     location: {
         type: Object,
         default: null,
     },
 });
-const isRequired = computed(() => Object.keys($attrs).includes('required'));
-const requiredFieldRule = (val) => validations().required(isRequired.value, val);
-
-const mixinRules = [requiredFieldRule];
 const formatLocation = (obj, properties) => {
     const parts = properties.map((prop) => {
         if (typeof prop === 'string') {
@@ -76,12 +68,10 @@ function showLabel(data) {
         :label="t('Location')"
         :placeholder="t('search_by_postalcode')"
         :input-debounce="300"
-        :class="{ required: isRequired }"
+        :class="{ required: $attrs.required }"
         v-bind="$attrs"
         clearable
         :emit-value="false"
-        :rules="mixinRules"
-        :lazy-rules="true"
     >
         <template #form>
             <CreateNewPostcode

src/pages/Customer/Card/CustomerDescriptor.vue

@@ -12,7 +12,6 @@ import VnLv from 'src/components/ui/VnLv.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import CustomerDescriptorMenu from './CustomerDescriptorMenu.vue';
 import { useState } from 'src/composables/useState';
-import { QIcon } from 'quasar';
 const state = useState();
 
 const customer = computed(() => state.get('customer'));