src/components/common/VnInput.vue

@@ -49,15 +49,11 @@ const $props = defineProps({
 });
 
 const vnInputRef = ref(null);
-const showPassword = ref(false);
 const value = computed({
     get() {
         return $props.modelValue;
     },
     set(value) {
-        if ($props.uppercase && typeof value === 'string') {
-            value = value.toUpperCase();
-        }
         if ($props.emptyToNull && value === '') value = null;
         emit('update:modelValue', value);
     },
@@ -124,6 +120,10 @@ const handleInsertMode = (e) => {
         input.setSelectionRange(cursorPos + 1, cursorPos + 1);
     });
 };
+
+const handleUppercase = () => {
+    value.value = value.value?.toUpperCase() || '';
+};
 </script>
 
 <template>
@@ -166,7 +166,16 @@ const handleInsertMode = (e) => {
                             emit('remove');
                         }
                     "
+                ></QIcon>
+                
+                <QIcon
+                    name="match_case"
+                    size="xs"
+                    v-if="!$attrs.disabled && !($attrs.readonly) && $props.uppercase"
+                    @click="handleUppercase"
+                    class="uppercase-icon"
                 />
+                
                 <slot name="append" v-if="$slots.append && !$attrs.disabled" />
                 <QIcon v-if="info" name="info">
                     <QTooltip max-width="350px">
@@ -177,3 +186,14 @@ const handleInsertMode = (e) => {
         </QInput>
     </div>
 </template>
+
+<i18n>
+    en:
+        inputMin: Must be more than {value}
+        maxLength: The value exceeds {value} characters
+        inputMax: Must be less than {value}
+    es:
+        inputMin: Debe ser mayor a {value}
+        maxLength: El valor excede los {value} carácteres
+        inputMax: Debe ser menor a {value}
+</i18n>

src/pages/Customer/Card/CustomerFiscalData.vue

@@ -44,6 +44,7 @@ function handleLocation(data, location) {
                     :required="true"
                     :rules="validate('client.socialName')"
                     clearable
+                    uppercase="true"
                     v-model="data.socialName"
                 >
                     <template #append>

src/pages/Customer/CustomerList.vue

@@ -53,6 +53,11 @@ const columns = computed(() => [
         attrs: {
             uppercase: true,
         },
+        columnFilter: {
+            attrs: {
+                uppercase: false,
+            },
+        },
     },
     {
         align: 'left',

src/pages/Supplier/Card/SupplierFiscalData.vue

@@ -92,6 +92,7 @@ function handleLocation(data, location) {
                 <VnInput
                     v-model="data.name"
                     :label="t('supplier.fiscalData.name')"
+                    uppercase="true"
                     clearable
                 />
                 <VnInput

src/pages/Supplier/SupplierList.vue

@@ -28,9 +28,10 @@ const columns = computed(() => [
             uppercase: true,
         },
         columnFilter: {
-            name: 'search',attrs: {
-            uppercase: false,
-        },
+            name: 'search',
+            attrs: {
+                uppercase: false,
+            },
         },
         isTitle: true,
     },