87 lines
2.4 KiB
Vue
87 lines
2.4 KiB
Vue
<template lang="pug">
|
||
.base.flex.flex-col.gap-y-6
|
||
.flex.flex-col.gap-y-6
|
||
span.font-bold Основное
|
||
.flex.flex-col.gap-y-6
|
||
base-input.w-full(
|
||
placeholder="ФИО*",
|
||
v-model="clientDetail.fullName",
|
||
)
|
||
base-radio-buttons-group(
|
||
:items="gendersList",
|
||
radioButtonsLabel="Пол",
|
||
v-model="clientDetail.gender",
|
||
)
|
||
.flex.gap-x-4
|
||
.input
|
||
base-input-date(
|
||
label="Дата рождения",
|
||
v-model="clientDetail.birth_date",
|
||
)
|
||
.input
|
||
base-input(
|
||
placeholder="000–000–000 00",
|
||
v-mask="'###-###-### ##'",
|
||
label="СНИЛС",
|
||
v-model="clientDetail.insurance_number",
|
||
)
|
||
.flex.flex-col.gap-y-6
|
||
base-input(
|
||
label="Адрес регистрации",
|
||
placeholder="Введите полный адрес"
|
||
)
|
||
base-input(
|
||
label="Фактический адрес места жительства",
|
||
placeholder="Введите полный адрес"
|
||
)
|
||
.flex.gap-x-4
|
||
.input
|
||
base-input(
|
||
label="Номер телефона",
|
||
placeholder="+7 (915) 644–92–23",
|
||
v-mask="'+7 (###) ###-##-##'",
|
||
v-model="clientDetail.phone",
|
||
)
|
||
.input
|
||
base-input(
|
||
label="Email",
|
||
placeholder="user@yandex.ru"
|
||
v-model="clientDetail.email",
|
||
)
|
||
</template>
|
||
|
||
<script>
|
||
import BaseInput from "@/components/base/BaseInput";
|
||
import BaseInputDate from "@/components/base/BaseInputDate";
|
||
import BaseSelect from "@/components/base/BaseSelect";
|
||
import BaseButton from "@/components/base/BaseButton";
|
||
import { mask } from "vue-the-mask";
|
||
import BaseRadioButtonsGroup from "@/components/base/BaseRadioButtonsGroup.vue";
|
||
import { medicalDetailConfig } from "@/pages/medicalCard/utils/medicalConfig.js";
|
||
|
||
export default {
|
||
name: "MedicalBaseData",
|
||
components: {
|
||
BaseInput,
|
||
BaseInputDate,
|
||
BaseSelect,
|
||
BaseButton,
|
||
BaseRadioButtonsGroup,
|
||
},
|
||
directives: { mask },
|
||
props: {
|
||
clientDetail: Object,
|
||
},
|
||
computed: {
|
||
gendersList() {
|
||
return medicalDetailConfig.gendersList;
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="sass" scoped>
|
||
.input
|
||
width: 277px
|
||
</style>
|