103 lines
2.6 KiB
Vue
103 lines
2.6 KiB
Vue
<template lang="pug">
|
|
.wrapper.flex.flex-col.gap-y-6.justify-between
|
|
.flex.flex.flex-col.gap-y-6
|
|
span.text-center.font-bold.text-xl Создание медицинской карты стоматологического пациента
|
|
.flex.self-center
|
|
base-stepper(
|
|
:steps="steps",
|
|
:currentStep="currentStep"
|
|
)
|
|
component(v-bind:is="currentTabComponent")
|
|
.flex.justify-between
|
|
.flex
|
|
base-button.font-semibold(
|
|
:size="40",
|
|
@click="prevStep",
|
|
v-if="currentStep !== 0",
|
|
outlined,
|
|
) Назад
|
|
.flex
|
|
base-button.font-semibold(
|
|
:size="40",
|
|
@click="nextStep",
|
|
v-if="currentStep < steps.length-1",
|
|
) Далее
|
|
base-button.font-semibold(
|
|
:size="40",
|
|
@click="finish",
|
|
v-if="currentStep === steps.length-1"
|
|
) Создать медицинскую карту
|
|
</template>
|
|
|
|
<script>
|
|
import BaseInput from "@/components/base/BaseInput";
|
|
import BaseButton from "@/components/base/BaseButton";
|
|
import BaseInputDate from "@/components/base/BaseInputDate";
|
|
import BaseSelect from "@/components/base/BaseSelect";
|
|
import MedicalBaseData from "@/pages/medicalCard/components/MedicalBaseData";
|
|
import MedicalIdentityDocuments from "@/pages/medicalCard/components/MedicalIdentityDocuments";
|
|
import MedicalPolicyDocuments from "@/pages/medicalCard/components/MedicalPolicyDocuments";
|
|
import BaseStepper from "@/components/base/BaseStepper.vue";
|
|
|
|
export default {
|
|
name: "FormCreateMedicalCard",
|
|
components: {
|
|
BaseInput,
|
|
BaseButton,
|
|
BaseInputDate,
|
|
BaseSelect,
|
|
MedicalBaseData,
|
|
MedicalIdentityDocuments,
|
|
MedicalPolicyDocuments,
|
|
BaseStepper,
|
|
},
|
|
data() {
|
|
return {
|
|
isBaseData: true,
|
|
isIdentityDoc: false,
|
|
isPolicyDoc: false,
|
|
currentStep: 0,
|
|
steps: [
|
|
{
|
|
id: 0,
|
|
label: "1",
|
|
value: "Основное",
|
|
component: "medical-base-data",
|
|
},
|
|
{
|
|
id: 1,
|
|
label: "2",
|
|
value: "ДУЛ",
|
|
component: "medical-identity-documents",
|
|
},
|
|
{
|
|
id: 2,
|
|
label: "3",
|
|
value: "Полис",
|
|
component: "medical-policy-documents",
|
|
},
|
|
],
|
|
};
|
|
},
|
|
computed: {
|
|
currentTabComponent: function () {
|
|
return this.steps[this.currentStep]?.component;
|
|
},
|
|
},
|
|
methods: {
|
|
nextStep() {
|
|
this.currentStep += 1;
|
|
},
|
|
prevStep() {
|
|
this.currentStep -= 1;
|
|
},
|
|
finish() {},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="sass" scoped>
|
|
.wrapper
|
|
width: 570px
|
|
</style>
|