87 lines
2.7 KiB
Vue
87 lines
2.7 KiB
Vue
<template lang="pug">
|
||
.wrapper-documents.flex.flex-col.flex-auto.h-full.gap-y-8.justify-between
|
||
.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
|
||
base-input.input-info(
|
||
v-mask="'#### ######'",
|
||
v-model="identityDocument.pass.series_number",
|
||
placeholder="0000 000000",
|
||
label="Серия и номер"
|
||
)
|
||
base-input.input-info(
|
||
v-model="identityDocument.pass.issued_by_org",
|
||
placeholder="Точно как в паспорте",
|
||
label="Кем выдан"
|
||
)
|
||
base-input.input-info(
|
||
v-mask="'###-###'",
|
||
v-model="identityDocument.pass.issued_by_org_code",
|
||
placeholder="000–000",
|
||
label="Код подразделения"
|
||
)
|
||
base-input-date.input-info.h-10(
|
||
v-model="identityDocument.pass.issued_by_date",
|
||
placeholder="Дата",
|
||
label="Дата выдачи"
|
||
)
|
||
.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
|
||
base-input.input-info(
|
||
disabled,
|
||
v-mask="'###-###-### ##'",
|
||
v-model="identityDocument.snils.number",
|
||
placeholder="000–000–000 00",
|
||
label="Номер СНИЛС"
|
||
)
|
||
base-input.input-info(
|
||
disabled,
|
||
v-mask="'############'",
|
||
v-model="identityDocument.inn.number",
|
||
placeholder="000000000000",
|
||
label="Номер ИНН"
|
||
)
|
||
.px-4
|
||
base-button(@click="saveClient" :size="40")
|
||
span.font-semibold Создать клиента
|
||
</template>
|
||
|
||
<script>
|
||
import BaseButton from "@/components/base/BaseButton";
|
||
import BaseInput from "@/components/base/BaseInput";
|
||
import BaseInputDate from "@/components/base/BaseInputDate";
|
||
import { mask } from "vue-the-mask";
|
||
export default {
|
||
name: "FormCreateIdentityDocuments",
|
||
components: { BaseInput, BaseInputDate, BaseButton },
|
||
props: {
|
||
identityDocument: Object,
|
||
saveClient: Function,
|
||
},
|
||
directives: { mask },
|
||
};
|
||
</script>
|
||
|
||
<style lang="sass" scoped>
|
||
.wrapper-documents
|
||
min-height: 443px
|
||
max-height: 443px
|
||
overflow-y: auto
|
||
color: var(--font-grey-color)
|
||
&::-webkit-scrollbar
|
||
width: 4px
|
||
&::-webkit-scrollbar-track
|
||
background-color: rgba(211, 212, 220, 0.5)
|
||
border-radius: 8px
|
||
&::-webkit-scrollbar-thumb
|
||
border-radius: 8px
|
||
background-color: var(--btn-blue-color)
|
||
.input-info
|
||
color: var(--font-dark-blue-color)
|
||
.title-info
|
||
color: var(--font-dark-blue-color)
|
||
.input-date
|
||
border: 1.5px solid var(--border-light-grey-color)
|
||
</style>
|