WIP Сделана выборка по полисам

src/components/base/BaseInput.vue

@@ -6,11 +6,10 @@
     ) {{ label }}
     .input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
       :class="{'border-none': borderNone, 'border-error': borderError }"
-      :style="{'background-color': disabled && 'var(--bg-disable-grey-color)'}"
+      :style="disabledBackgroundStyle"
     )
       input.input.w-full.outline-0.not-italic(
         v-model="value",
-        :style="{'color': disabled && 'var(--font-grey-color-0)'}",
         :class="textClass",
         :placeholder="placeholder",
         :disabled="disabled",
@@ -63,6 +62,13 @@ export default {
             "text-sm": true,
           };
     },
+    disabledBackgroundStyle() {
+      return this.disabled
+        ? {
+            "background-color": "var(--bg-disable-grey-color)",
+          }
+        : false;
+    },
   },
 };
 </script>
@@ -83,6 +89,7 @@ export default {
   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>

src/components/base/BaseRadioButtonsGroup.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
   .container.flex.flex-col.gap-y-2
     .label.font-semibold.text-smm(v-if="radioButtonsLabel") {{ radioButtonsLabel }}
-    .group.flex.gap-x-4.text-base(:class="{'flex-col gap-y-1': direction === 'col'}")
+    .group.flex.text-base(:class="radioGroupClasses")
       .option(v-for="item in items")
         input.mr-2(
           type="radio",
@@ -23,10 +23,9 @@ export default {
       type: Array,
       default: () => [],
     },
-    direction: {
-      type: String,
-      default: "row",
-    },
+    directionColumn: Boolean,
+    columnGap: String,
+    rowGap: String,
   },
   computed: {
     value: {
@@ -37,6 +36,26 @@ export default {
         this.$emit("update:modelValue", value);
       },
     },
+    radioGroupClasses() {
+      if (this.directionColumn) {
+        return this.columnGap
+          ? {
+              "flex-col": true,
+              [this.columnGap]: true,
+            }
+          : {
+              "flex-col": true,
+              "gap-y-1": true,
+            };
+      }
+      if (this.rowGap)
+        return {
+          [this.rowGap]: true,
+        };
+      return {
+        "gap-x-4": true,
+      };
+    },
   },
 };
 </script>