[WIP] Добавил маску на полисы страховок и скролл модального окна категории

src/components/base/BaseCategorySelection.vue

@@ -9,17 +9,21 @@
             size="18px",
             style="color: var(--font-dark-blue-color)"
           )
-      .flex.flex-col(:style="{height: '457px'}")
+      .field.flex.flex-col.overflow-y-scroll
-        .flex.items-center.h-10.gap-x-1(v-for="benefit in benefitData", :key="benefit.id")
+        .flex.items-center(
+          v-for="benefit in benefitData",
+          :key="benefit.id",
+          :style="{alignItems: benefit.name.length > 28 ? 'start' : 'center'}"
+        )
           q-checkbox(
             v-model="selected"
             :val="benefit",
-            :style="{border: 'none', sidth: '36px'}",
+            :style="{border: 'none', width: '36px'}",
             size="32px"
           )
-          .name.flex.h-10.items-center {{benefit.name}}
+          .name.flex.items-center.font-medium.text-xm {{benefit.name}}
       .buttons-group.flex.py-4.px-8.justify-center
-        base-button.text-base.font-semibold(outlined :size="40" @click="closeModalCategories") Отменить
+        base-button.text-base.font-semibold(outlined, :size="40", @click="closeModalCategories") Отменить
         base-button.text-base.font-semibold(:size="40") Сохранить
     .right-side.flex.px-14.font-bold.relative
       q-icon(name="app:icon-cancel").text-sm.absolute.top-4.right-4.cursor-pointer(@click="closeModalCategories")
@@ -81,6 +85,7 @@ export default {
   },
 };
 </script>
+
 <style lang="sass" scoped>
 .selection-wrapper
   width: 895px
@@ -90,7 +95,16 @@ export default {
   width: 364px
   padding: 32px 28px 0px
 
+.field
+  height: 457px
+  margin-right: -12px
+  &::-webkit-scrollbar
+    width: 4px
+
 .name
+  min-height: 40px
+  padding-top: 4px
+  padding-bottom: 4px
   border-bottom: 1px solid var(--bg-light-grey)
   width: 268px
 

src/pages/newMedicalCard/components/BasicDataForms/InsuranceForm.vue

@@ -62,6 +62,7 @@
             base-input(
               v-model="basic[insurance.insuranceKey][field.key]",
               @update:model-value="checkChangeInput",
+              :mask="field?.inputMask",
               :disabled="!isEdit",
               :standout="!isEdit",
               :outlined="isEdit",

src/pages/newMedicalCard/utils/medicalConfig.js

@@ -246,11 +246,13 @@ export const baseInsuranceForm = [
         key: "series",
         label: "Серия",
         type: "text",
+        inputMask: "######",
       },
       {
         key: "number",
         label: "Номер",
         type: "text",
+        inputMask: "##########",
       },
       {
         key: "photo",
@@ -267,11 +269,13 @@ export const baseInsuranceForm = [
         key: "series",
         label: "Серия",
         type: "text",
+        inputMask: "######",
       },
       {
         key: "number",
         label: "Номер",
         type: "text",
+        inputMask: "##########",
       },
       {
         key: "photo",