Ограничение календаря для года

src/components/base/BaseClientFormCreate.vue

@@ -21,13 +21,27 @@
           :choose-option="chooseOptionNetworks"
           :choose-priority="choosePriority"
           :priority-list="getPriorityList"
+          :current-year="currentYear"
           )
       .flex(:style="{display :'none'}" ref="doc")
-        form-create-identity-documents(:identity-document="infoClient.identity_document" :save-client="saveClient")
+        form-create-identity-documents(
+          :identity-document="infoClient.identity_document",
+          :save-client="saveClient",
+          :current-year="currentYear"
+        )
       .flex(:style="{display :'none'}" ref="address")
-        form-create-addresses(:addresses="infoClient.addresses" :save-file="saveDocFile" :save-client="saveClient")
+        form-create-addresses(
+          :addresses="infoClient.addresses",
+          :save-file="saveDocFile",
+          :save-client="saveClient"
+        )
       .flex(:style="{display :'none'}" ref="additional")
-        form-create-additional(:additional-info="infoClient.additional" :add-new-additional="addNewAdditionalInfo" :save-file="saveAdditionalFiles" :save-client="saveClient")
+        form-create-additional(
+          :additional-info="infoClient.additional",
+          :add-new-additional="addNewAdditionalInfo",
+          :save-file="saveAdditionalFiles",
+          :save-client="saveClient"
+        )
 </template>
 
 <script>
@@ -148,6 +162,7 @@ export default {
           label: "-",
         },
       ],
+      currentYear: 2022,
     };
   },
   computed: {
@@ -269,6 +284,12 @@ export default {
       }
       return true;
     },
+    printCurrentYear() {
+      return new Date().getFullYear();
+    },
+  },
+  mounted: function () {
+    this.currentYear = this.printCurrentYear();
   },
 };
 </script>

src/components/base/BaseInput.vue

@@ -1,15 +1,16 @@
 <template lang="pug">
   .input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
-    :class="{'border-none': borderNone}"
+    :class="{'border-none': borderNone}",
     :style="{ minWidth: widthInput + 'px' }"
   )
     input.input.w-full.outline-0.not-italic(
-      :class="{date:type === 'date'}"
+      :class="{date:type === 'date'}",
-      :value="value"
+      :value="value",
-      :type="type"
+      :type="type",
-      @input="$emit('update:value', $event.target.value)"
+      @input="$emit('update:value', $event.target.value)",
-      :placeholder="placeholder"
+      :placeholder="placeholder",
-      :maxlength="maxLength"
+      :maxlength="maxLength",
+      :max="maxDate",
       :disabled="disabled"
     )
     .slot(v-if="withIcon", :class="iconPosition")
@@ -37,6 +38,7 @@ export default {
     widthInput: Number,
     borderNone: Boolean,
     disabled: Boolean,
+    maxDate: String,
   },
 };
 </script>

src/pages/clients/components/FormCreateBasicInfo.vue

@@ -14,7 +14,8 @@
           v-model:value="basicInfo.birth_date",
           type="date",
           placeholder="00.00.0000",
-          :width-input="277"
+          :width-input="277",
+          :max-date="`${ currentYear }-12-31`"
         )
       .flex.flex-col(class="gap-y-1.5")
         span.text-sm Номер телефона
@@ -73,6 +74,7 @@ export default {
     basicInfo: Object,
     saveClient: Function,
     addNetwork: Function,
+    currentYear: Number,
   },
   data() {
     return {

src/pages/clients/components/FormCreateIdentityDocuments.vue

@@ -5,25 +5,55 @@
       .grid.grid-cols-2.gap-x-4.gap-y-6
         .flex.flex-col(class="gap-y-1.5")
           span.text-sm Серия и номер
-          base-input.input-info(v-mask="'#### ######'" v-model:value="identityDocument.pass.series_number" placeholder="0000 000000" :width-input="277")
+          base-input.input-info(
+            v-mask="'#### ######'",
+            v-model:value="identityDocument.pass.series_number",
+            placeholder="0000 000000",
+            :width-input="277"
+          )
         .flex.flex-col(class="gap-y-1.5")
           span.text-sm Кем и когда выдан
-          base-input.input-info(v-model:value="identityDocument.pass.issued_by_org" placeholder="Точно как в паспорте" :width-input="277")
+          base-input.input-info(
+            v-model:value="identityDocument.pass.issued_by_org",
+            placeholder="Точно как в паспорте",
+            :width-input="277"
+          )
         .flex.flex-col(class="gap-y-1.5")
           span.text-sm Код подразделения
-          base-input.input-info(v-mask="'###-###'" v-model:value="identityDocument.pass.issued_by_org_code" placeholder="000–000" :width-input="277")
+          base-input.input-info(
+            v-mask="'###-###'",
+            v-model:value="identityDocument.pass.issued_by_org_code",
+            placeholder="000–000",
+            :width-input="277"
+          )
         .flex.flex-col(class="gap-y-1.5")
           span.text-sm Дата выдачи
-          base-input.input-info( type="date" v-model:value="identityDocument.pass.issued_by_date" placeholder="Дата" :width-input="277")
+          base-input.input-info(
+            type="date",
+            v-model:value="identityDocument.pass.issued_by_date",
+            placeholder="Дата",
+            :width-input="277",
+            :max-date="`${currentYear}-12-31`"
+          )
     .flex.flex-col.gap-y-6.px-4
       span.title-info.text-base.font-bold СНИЛС и ИНН
       .grid.grid-cols-2.gap-x-4.gap-y-6
         .flex.flex-col(class="gap-y-1.5")
           span.text-sm Номер СНИЛС
-          base-input.input-info(v-mask="'###-###-### ##'" v-model:value="identityDocument.snils.numba" placeholder="000–000–000 00" :width-input="277")
+          base-input.input-info(
+            v-mask="'###-###-### ##'",
+            v-model:value="identityDocument.snils.numba",
+            placeholder="000–000–000 00",
+            :width-input="277"
+          )
         .flex.flex-col(class="gap-y-1.5")
           span.text-sm Номер ИНН
-          base-input.input-info(v-mask="'##########'" v-model:value="identityDocument.inn.numba" placeholder="000000000000" :width-input="277")
+          base-input.input-info(
+            v-mask="'##########'",
+            v-model:value="identityDocument.inn.numba",
+            placeholder="000000000000",
+            :width-input="277"
+          )
     .px-4
       base-button(@click="saveClient" :size="40")
         span.font-semibold Создать клиента
@@ -39,6 +69,7 @@ export default {
   props: {
     identityDocument: Object,
     saveClient: Function,
+    currentYear: Number,
   },
   directives: { mask },
 };