admin/astra-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #199 from dderbentsov/UC-155

Browse Source 
[WIP] Добавил поля на форму создания мед карты и уведомление на некорректный номер,
This commit is contained in:
frontgavrilin
2022-12-14 18:19:18 +03:00
committed by GitHub
parent 2067b0f429 a20bf2d11f
commit 3559d278ec
9 changed files with 216 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/LoggedInLayout.vue
View File

@@ -1,6 +1,7 @@
<template lang="pug">
.flex.flex-col.w-full.h-full.gap-y-2
the-header(
:url="url",
:is-open-form="isOpenForm",
:close-form="closeForm",
:open-form="openForm",

21
src/components/TheHeader.vue
View File

@@ -23,11 +23,17 @@
button.header-buttons.flex.justify-center.items-center.mr-8.p-0
.icon-bell.text-xxl
.flex.justify-centflexer.items-center.relative
base-avatar.mr-2(:size="32")
img(:src="avatarSrc", alt="Avatar")
base-avatar.mr-2(:size="36", :color="userData.color", v-if="!userData.photo") {{changeName}}
base-avatar.mr-2(:size="32", v-else)
img.h-full.object-cover(:src="url + userData.photo", alt="Avatar")
button.header-buttons(@click="openPopup")
.icon-down-arrow.text-xxs.flex.justify-center.items-center.p-0
base-popup.right-2.top-10(v-if="showPopup", :width="160", v-click-outside="openPopup")
base-popup.right-2.top-10(
corner,
v-if="showPopup",
:width="160",
v-click-outside="openPopup"
)
.text-popup.flex.cursor-pointer.pl-2(@click="logout") Выйти
</template>
@@ -49,6 +55,7 @@ export default {
BaseClientFormCreate,
},
props: {
url: String,
openForm: Function,
closeForm: Function,
isOpenForm: Boolean,
@@ -62,8 +69,16 @@ export default {
name: "Гордеев Николай Степанович",
},
showPopup: false,
userData: JSON.parse(localStorage.getItem("userData")),
};
},
computed: {
changeName() {
return `${this.userData.last_name || ""} ${
this.userData.first_name || ""
} ${this.userData.patronymic || ""}`;
},
},
methods: {
logout() {
localStorage.removeItem("tokenAccess");

3
src/components/base/BasePopup.vue
View File

@@ -1,6 +1,6 @@
<template lang="pug">
.flex.flex-col.items-end.absolute
.corner
.corner(v-if="!corner")
.popup-wrapper.flex.flex-col.gap-y-3.p-4.h-fit(:style="{ width : width + 'px' }")
slot
</template>
@@ -12,6 +12,7 @@ export default {
width: Number,
top: Number,
right: Number,
corner: Boolean,
},
};
</script>

24
src/pages/clients/components/ClientsTableRow.vue
View File

@@ -271,9 +271,22 @@ export default {
contacts.push(this.dataClient.email);
if (
this.dataClient.phone.username &&
this.dataClient.phone.username.length === 18 &&
!contacts.find((el) => el.kind === "PHONE")
)
contacts.push(this.dataClient.phone);
else if (
this.dataClient.phone.username &&
this.dataClient.phone.username.length < 18
) {
this.dataClient.phone.username =
this.client.contacts.find((el) => el.kind === "PHONE")?.username ||
"";
this.addErrorNotification(
"Некорректный номер телефона",
"Введите мобильный номер состоящий из 11 цифр"
);
}
let mapCreateContacts = this.client.contacts.map((el) => el.kind);
let mapDeleteContacts = contacts.map((el) => el.kind);
let createContacts = contacts.filter((el) =>
@@ -288,9 +301,20 @@ export default {
this.client.contacts.forEach((el) => {
if (
el.kind === "PHONE" &&
this.dataClient.phone.username.length === 18 &&
el.username !== this.dataClient.phone.username
)
updateContacts.push(this.dataClient.phone);
else if (this.dataClient.phone.username.length < 18) {
this.dataClient.phone.username =
this.client.contacts.find((el) => el.kind === "PHONE")?.username ||
"";
this.addErrorNotification(
"Некорректный номер телефона",
"Введите мобильный номер состоящий из 11 цифр"
);
}
if (
el.kind === "EMAIL" &&
el.username !== this.dataClient.email.username

83
src/pages/clients/components/FormCreateMedicalCard.vue
View File

@@ -4,57 +4,20 @@
span.text-center.font-bold.text-xl Создание медицинской карты стоматологического пациента
.flex.justify-center.items-center.gap-x-2
base-button.button(:size="32", :rounded="true")
span(v-if="!isServices") 1
span(v-if="isBaseData") 1
.icon-ok.text-xs(v-else)
span(:style="{color: 'var(--btn-blue-color)'}") Основное
.line.flex.mx-2
base-button.button(:class="{'active-button': !isServices}", :size="32", :rounded="true") 2
span(:style="{color: isServices ? 'var(--btn-blue-color)' : 'var(--font-dark-blue-color)' }") Услуги
medical-base-data(v-if="!isServices")
.services.flex.flex-col.gap-y-6(v-else)
.flex.flex-col.gap-y-6
.flex.flex-col.gap-y-2
.font-bold Услуги
.counter.text-smm Выберите подходищие из списка
.services-wrapper.flex.flex-col.pt-4.px-4
.flex.gap-x-2
base-input(
:with-icon="true",
icon-position="left",
:width-input="310",
placeholder="Поиск"
)
.counter.icon-search
base-select.h-10(placeholder="Вид услуги")
.flex.items-center.px-11px.py-9px(
:style="{borderBottom: '1px solid var(--btn-grey-color)'}"
)
.flex.items-center.gap-x-3
input.counter.w-4.h-4.checkbox.cursor-pointer(
type="checkbox",
@click="selectAll",
v-model="isAllServices"
)
.counter.flex.p-2(:style="{width: '358px'}") Название услуги
.counter Вид услуги
.list-services.flex.flex-col.px-11px.py-9px
.flex.items-center(v-for="service in services", :key="service.id")
.flex.items-center.gap-x-3
input.w-4.h-4.checkbox.cursor-pointer(
type="checkbox",
v-model="userIds",
:value="service.id"
)
.flex.p-2(:style="{width: '358px'}") {{service.name}}
.counter {{service.type}}
base-button.custom-button(
v-if="!isServices",
:size="40",
@click="changeServices"
)
span.font-semibold Далее
base-button.custom-button(:size="40", v-else)
span.font-semibold Создать медицинскую карту
base-button.button(:class="{'active-button': !isIdentityDoc && isBaseData}", :size="32", :rounded="true")
span(v-if="isBaseData") 2
.icon-ok.text-xs(v-else)
span(:style="{color: !isBaseData ? 'var(--btn-blue-color)' : 'var(--font-dark-blue-color)' }") ДУЛ
.line.flex.mx-2
base-button.button(:class="{'active-button': !isPolicyDoc }", :size="32", :rounded="true") 3
span(:style="{color: isPolicyDoc ? 'var(--btn-blue-color)' : 'var(--font-dark-blue-color)' }") Полис
medical-base-data(v-if="isBaseData", :change-base-data="changeBaseData")
medical-identity-documents(v-if="isIdentityDoc", :change-identity-doc="changeIdentityDoc")
medical-policy-documents(v-if="isPolicyDoc")
</template>
<script>
@@ -63,6 +26,9 @@ 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";
export default {
name: "FormCreateMedicalCard",
components: {
@@ -71,23 +37,24 @@ export default {
BaseInputDate,
BaseSelect,
MedicalBaseData,
MedicalIdentityDocuments,
MedicalPolicyDocuments,
},
data() {
return {
isServices: false,
isAllServices: false,
userIds: [],
isBaseData: true,
isIdentityDoc: false,
isPolicyDoc: false,
};
},
methods: {
changeServices() {
this.isServices = !this.isServices;
changeBaseData() {
this.isBaseData = !this.isBaseData;
this.isIdentityDoc = !this.isIdentityDoc;
},
selectAll() {
this.userIds = [];
if (!this.isAllServices) {
this.services.forEach((el) => this.userIds.push(el.id));
}
changeIdentityDoc() {
this.isIdentityDoc = !this.isIdentityDoc;
this.isPolicyDoc = !this.isPolicyDoc;
},
},
};

26
src/pages/login/TheLogin.vue
View File

@@ -54,6 +54,7 @@ export default {
authorized: true,
user: { username: "", password: "" },
redColor: "var(--border-red-color)",
userData: {},
};
},
computed: {
@@ -83,6 +84,30 @@ export default {
localStorage.username = this.user.username;
localStorage.password = this.user.password;
},
auth(token) {
fetch("http://45.84.227.122:8080/auth/users/me/", {
headers: {
Authorization: `Bearer ${token}`,
},
})
.then((res) => {
return res.json();
})
.then((data) => {
fetch(`http://45.84.227.122:8080/accounts/users/${data.id}/detail`, {
headers: {
Authorization: `Bearer ${token}`,
},
})
.then((res) => {
return res.json();
})
.then((data) => {
this.userData = data;
localStorage.setItem("userData", JSON.stringify(this.userData));
});
});
},
login() {
const requestOptions = {
method: "POST",
@@ -103,6 +128,7 @@ export default {
if (token) {
localStorage.setItem("tokenAccess", token.access);
this.$router.push("/");
this.auth(token.access);
} else {
this.$router.push("/login");
}

22
src/pages/medicalCard/components/MedicalBaseData.vue
View File

@@ -18,15 +18,35 @@
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Фактический адрес места жительства
base-input(:width-input="277", placeholder="Введите полный адрес")
.flex.gap-x-4
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Номер телефона
base-input(
:width-input="277",
placeholder="+7 (915) 644–92–23",
v-mask="'+7 (###) ###-##-##'"
)
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Email
base-input(:width-input="277", placeholder="user@yandex.ru")
base-button(:size="40", @click="changeBaseData")
span.font-semibold Далее
</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";
export default {
name: "MedicalBaseData",
components: { BaseInput, BaseInputDate, BaseSelect },
components: { BaseInput, BaseInputDate, BaseSelect, BaseButton },
directives: { mask },
props: {
changeBaseData: Function,
},
};
</script>

48
src/pages/medicalCard/components/MedicalIdentityDocuments.vue Normal file
View File

@@ -0,0 +1,48 @@
<template lang="pug">
.base.flex.flex-col.gap-y-6
.flex.flex-col.gap-y-6
span.font-bold Паспортные данные
.flex.flex-col.gap-y-4
.flex.gap-x-4
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Серия и номер
base-input(:width-input="277", placeholder="0000 000000")
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Дата выдачи
base-input-date.input-date.h-10(:width-input="277")
.flex.flex-col.gap-y-4
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Кем выдан
base-input(:width-input="277", placeholder="Точно как в паспорте")
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Страховая оганизация
base-input(:width-input="277", placeholder="Введите название организации")
base-button(:size="40", @click="changeIdentityDoc")
span.font-semibold Далее
</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";
export default {
name: "MedicalIdentityDocuments",
components: { BaseInput, BaseInputDate, BaseSelect, BaseButton },
directives: { mask },
props: {
changeIdentityDoc: Function,
},
};
</script>
<style lang="sass" scoped>
.input-date
border: 1.5px solid var(--border-light-grey-color)
border-radius: 4px
.counter
color: var(--font-grey-color)
</style>

51
src/pages/medicalCard/components/MedicalPolicyDocuments.vue Normal file
View File

@@ -0,0 +1,51 @@
<template lang="pug">
.base.flex.flex-col.gap-y-6
.flex.gap-x-4
.flex.flex-col.gap-y-6
span.font-bold Полис
.flex.gap-x-4
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Серия и номер полиса ОМС
base-input(:width-input="277", placeholder="0000 000000")
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Серия и номер полиса ДМС
base-input(:width-input="277", placeholder="0000 000000")
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Код категории льготы
base-input(:width-input="277", placeholder="000")
.flex.flex-col.gap-y-4
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm К кому обращаться в случае необходимости
base-input.w-full(placeholder="ФИО*")
.flex.flex-col.gap-y-2
.counter.font-semibold.text-smm Номер телефона
base-input(
:width-input="277",
placeholder="+7 (915) 644–92–23"
)
base-button(:size="40")
span.font-semibold Создать медицинскую карту
</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";
export default {
name: "MedicalPolicyDocuments",
components: { BaseInput, BaseInputDate, BaseSelect, BaseButton },
directives: { mask },
};
</script>
<style lang="sass" scoped>
.input-date
border: 1.5px solid var(--border-light-grey-color)
border-radius: 4px
.counter
color: var(--font-grey-color)
</style>