[WIP] Добавил quasar input, стили, заменил маски

src/components/base/BaseInput.vue

@@ -4,31 +4,68 @@
       v-if="label",
       :class="labelClass"
     ) {{ label }}
-    .input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
-      :class="{'border-none': borderNone, 'border-error': borderError }"
-      :style="disabledBackgroundStyle"
+    q-input(
+      v-model="value",
+      :input-class="textClass",
+      :placeholder="placeholder",
+      :outlined="outlined",
+      :dense="dense",
+      :type="type",
+      :filled="filled",
+      :disable="disabled",
+      :rules="rule",
+      :mask="mask",
+      :maxlength="maxLength"
+      hide-bottom-space,
+      autogrow
     )
-      input.input.w-full.outline-0.not-italic(
-        v-model="value",
-        :class="textClass",
-        :placeholder="placeholder",
-        :disabled="disabled",
-        :type="type"
-      )
-      slot(name='icon')
+      .flex.items-center(:v-if="withIcon")
+        slot.cursor-pointer
+   
+    //- slot(name='icon')
+    //- .input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
+    //-   :class="{'border-none': borderNone, 'border-error': borderError }"
+    //-   :style="disabledBackgroundStyle"
+    //- )
+    //-   input.input.w-full.outline-0.not-italic(
+    //-     v-model="value",
+    //-     :class="textClass",
+    //-     :placeholder="placeholder",
+    //-     :disabled="disabled",
+    //-     :type="type"
+    //-   )
+    //-   slot(name='icon')
 </template>
 
 <script>
 export default {
   name: "BaseInput",
   props: {
+    dense: {
+      type: Boolean,
+      default: true,
+    },
+    outlined: {
+      type: Boolean,
+      default: true,
+    },
+    filled: {
+      type: Boolean,
+      default: false,
+    },
     type: {
       default: "text",
     },
+    withIcon: {
+      type: Boolean,
+      default: false,
+    },
+    mask: String,
+    maxLength: String,
+    rule: Array,
     modelValue: String,
     placeholder: String,
     borderNone: Boolean,
-    borderError: Boolean,
     disabled: Boolean,
     label: String,
     textStyle: String,
@@ -81,15 +118,13 @@ export default {
   background-color: var(--default-white)
   color: var(--font-black-color)
   height: 40px
-.border-none
-  border: none
-.border-error
-  border-color: var(--border-red-color)
+
 .input
   background-color: inherit
   &:disabled, &[disabled]
     background-color: var(--bg-disable-grey-color)
     color: var(--font-grey-color-0)
+
 .label
   color: var(--font-black-color)
 </style>