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

Merge branch 'ASTRA-143' into 'master'

Browse Source 
Resolve ASTRA-143

See merge request andrusyakka/urban-couscous!497
This commit is contained in:
Vasiliy Gavrilin
2023-08-02 13:50:15 +00:00
parent ec4cbe35de 897cb06b85
commit 4def8adf85
7 changed files with 465 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/sass/variables.sass
View File

@@ -96,4 +96,6 @@
--system-color-red: #f34549
--system-color-green: #21ba72
--gray-background: #e9e9ed
--aqua-color: #2cc3e5
--system-color-yellow: #ffB931

6
src/components/base/BaseModal.vue
View File

@@ -6,7 +6,7 @@
ref="dialog"
)
.base-content(
:class="{'draggable': draggable, 'base-content-default': !defaultPadding, 'base-modal-default': modalPadding}",
:class="{'draggable': draggable, 'none-padding': nonePadding, 'base-content-default': !defaultPadding, 'base-modal-default': modalPadding}",
ref="contentRef",
:style="{...contentStyles, height}"
)
@@ -29,6 +29,7 @@ export default {
showCloseIcon: Boolean,
draggable: Boolean,
hideOverlay: Boolean,
nonePadding: Boolean,
defaultPadding: Boolean,
modalPadding: Boolean,
hideHeader: Boolean,
@@ -139,6 +140,9 @@ export default {
.base-modal-default
padding: 28px 32px
.none-padding
padding: 0px
.base-content
overflow: hidden
width: auto

47
src/pages/newCalendar/components/HeaderRecordForm.vue
View File

@@ -39,13 +39,18 @@
.flex.h-14.gap-x-3.items-center.text-smm
.text.font-semibold Медкарта:
.flex.gap-x-1
.name.flex.items-center.px-4.pt-2.pb-1.gap-x-2.rounded-md
.photo.flex.h-10.w-10.items-center.justify-center
img.w-10.h-10.rounded-full(v-if="patient", :src="patient.avatar")
q-icon.icon(v-else, name="app:noname", size="24px")
.flex.flex-col.font-medium
.dark-blue {{patient ? trimPatientName(patient.last_name, patient.first_name, patient.patronymic) : "Имя Фамилия"}}
.grey-color.text-xsx.rounded-md {{patient ? patient.birthday : "Дата"}}
.name.flex.rounded-md.flex-col(@click="showMedcard")
.flex.items-center.px-4.py-2.gap-x-2(:class="{'medcard': patient}")
.photo.flex.h-10.w-10.items-center.justify-center
img.w-10.h-10.rounded-full(v-if="patient", :src="patient.avatar")
q-icon.icon(v-else, name="app:noname", size="24px")
.flex.flex-col.font-medium.gap-y-2px
.dark-blue {{patient ? trimPatientName(patient.last_name, patient.first_name, patient.patronymic) : "Имя Фамилия"}}
.grey-color.text-xsx.rounded-md {{patient ? patient.birthday : "Дата"}}
.indicator-default.flex.w-full.h-1
.indicator.flex.h-1(:style="{width: patient ? patient.fill : '0%'}")
base-modal(v-model="isShowMedcard", none-padding)
medcard-modal(:data="patient")
.change.flex.items-center.rounded-md
q-btn(dense, padding="18px 4px", @click="isShowMedcards = true")
q-icon.icon(name="app:folder", size="20px")
@@ -68,6 +73,7 @@ import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js";
import * as moment from "moment/moment";
import BaseInput from "@/components/base/BaseInput.vue";
import { v_model } from "@/shared/mixins/v-model";
import MedcardModal from "./MedcardModal.vue";
export default {
name: "HeaderRecordForm",
@@ -77,6 +83,7 @@ export default {
BaseModal,
BaseTimeModal,
MedcardsModal,
MedcardModal,
},
mixins: [v_model],
props: { currentStatus: Object, statuses: Array, choiceStatus: Function },
@@ -86,6 +93,7 @@ export default {
currentDate: moment().clone(),
isShowTime: false,
isShowMedcards: false,
isShowMedcard: false,
patients: patientList.find(({ id }) => id === 2).data,
times: "",
data: [
@@ -119,6 +127,9 @@ export default {
},
},
methods: {
fixedFill(fill) {
return 100 - fill.slice(0, -1) + "%";
},
closeModalMedcards() {
this.isShowMedcards = false;
},
@@ -126,6 +137,9 @@ export default {
this.isShowMedcards = false;
this.patient = medcard;
},
showMedcard() {
if (this.patient) this.isShowMedcard = true;
},
validateTimeString(value = "") {
const [start = "", end = ""] = value.split(" - ");
this.validateTime(start);
@@ -167,6 +181,7 @@ export default {
.change
background: var(--bg-light-grey)
color: var(--font-grey-color)
border: 1px solid var(--gray-secondary)
.status
width: 160px
@@ -180,16 +195,28 @@ export default {
color: var(--font-grey-color)
width: 76px
.medcard
cursor: pointer
&:hover
background: var(--gray-secondary)
.name
background: var(--bg-light-grey)
border-bottom-color: var(--border-light-grey-color)
border-bottom-width: 4px
background: var(--default-white)
width: 200px
border: 1px solid var(--gray-secondary)
.photo
background: var(--border-light-grey-color)
border-radius: 50%
.indicator-default
background: var(--gray-secondary)
border-end-end-radius: 4px
.indicator
background: var(--aqua-color)
border-end-start-radius: 4px
.grey-color
color: var(--font-grey-color)
</style>

156
src/pages/newCalendar/components/MedcardModal.vue Normal file
View File

@@ -0,0 +1,156 @@
<template lang="pug">
.wrapper.flex.font-medium.flex-col.text-smm
.header.flex.flex-col.gap-y-6
.grey-color.text-smm.font-semibol {{"Медицинская карта: " + data.medicalNumber}}
.flex.gap-x-4.w-full
img.h-20.w-20.rounded-full(:src="data?.avatar")
.flex.items-center.justify-between.w-full
.info.flex.flex-col.gap-y-2
.text-5xl.font-bold {{data.last_name + " " + data.first_name + " " + data.patronymic}}
.flex.flex-col.text-m
span {{data.birthday}}
.flex.gap-x-2.items-center
span Приоритет:
.white-color.flex.grey-color.rounded.items-center.px-3.h-6.w-fit(
:class="selectedPriority"
) {{selectedPriorityName}}
.circle.flex.rounded-full.items-center.justify-center(
:style="{background: choiceFill(data.fill)}"
)
.flex.flex-col.items-center
.text-5xl.font-bold {{data.fill}}
.grey-color.text-xsx Заполнено
.body.flex.px-8.py-6.flex-col.gap-y-4
.flex.gap-x-4.items-center
.title.flex.text-m.grey-color Соцсети:
.wrap.flex.gap-1
.network.flex.h-7.items-center.gap-x-2.cursor-pointer(
v-for="network in data.networks"
)
q-icon.blue-fill(:name="network.icon", size="24px")
span {{network.name}}
.flex.gap-x-4.items-center
.title.flex.text-m.grey-color Телефон:
.flex {{data?.phone}}
.flex.gap-x-4.items-center
.title.flex.text-m.grey-color Email:
.flex {{data?.email}}
.flex.gap-x-4.items-center
.title.flex.text-m.grey-color Страхование:
.flex.gap-x-2.items-center
span {{data?.company}}
.policy.flex.items-center.gap-x-2.pl-3.pr-2.h-7
span {{data?.policy}}
q-icon.cursor-pointer.grey-fill(
@click="copyValue(data.policy)",
name="app:copy", size="18px"
)
.flex.gap-x-4.items-center
.title.flex.text-m.grey-color Особые отметки:
.wrap.flex.gap-x-1.gap-y-1
.flex.h-7.w-fit.items-center.px-3.rounded(
v-for="mark in data.marks", :style="{background: mark.color}"
) {{mark.name}}
.footer.flex
</template>
<script>
export default {
name: "MedcardModal",
props: {
data: Object,
},
data() {
return {
priorities: [
{ id: 0, color: "none-priority", name: "Без приоритета" },
{ id: 1, color: "red-color", name: "Высокий" },
{ id: 2, color: "yellow-color", name: "Средний" },
{ id: 3, color: "green-color", name: "Низкий" },
],
information: [
{ title: "Соцсети: ", data: [] },
{ title: "Телефон: ", data: [] },
{ title: "Email: ", data: [] },
{ title: "Страхование: ", data: [] },
{ title: "Особые отметки: ", data: [] },
],
};
},
computed: {
selectedPriority() {
return this.priorities.find((e) => e.id === this.data.priority).color;
},
selectedPriorityName() {
return this.priorities.find((e) => e.id === this.data.priority).name;
},
},
methods: {
choiceFill(fill) {
return `radial-gradient(closest-side, white 45px, transparent 80% 100%), conic-gradient(var(--aqua-color) ${fill}, var(--gray-secondary) 0%)`;
},
copyValue(policy) {
navigator.clipboard.writeText(policy);
},
},
};
</script>
<style lang="sass" scoped>
.wrapper
width: 744px
color: var(--font-dark-blue-color)
.header
border-bottom: 1px solid var(--gray-secondary)
padding: 16px 32px 25px 33px
.info
max-width: 424px
.circle
width: 100px
height: 100px
.title
width: 132px
.policy
border-radius: 4px
border: 1px solid var(--gray-scondary)
background: var(--gray-thirdly)
.network
padding: 8px 8px 8px 2px
border-radius: 28px
border: 1px solid var(--gray-secondary)
&:hover
background: var(--gray-secondary)
.wrap
flex-wrap: wrap !important
.none-priority
background: var(--font-grey-color)
.red-color
background: var(--system-color-red)
.yellow-color
background: var(--system-color-yellow)
.green-color
background: var(--system-color-green)
.grey-color
color: var(--font-grey-color)
.white-color
color: var(--default-white)
.grey-fill :deep(path)
fill: var(--font-grey-color)
.blue-fill :deep(path)
fill: var(--btn-blue-color)
</style>

17
src/pages/newCalendar/components/MedcardsModal.vue
View File

@@ -17,18 +17,18 @@
:class="sortingClass"
)
calendar-sidebar-svg(name-svg="sort", :active="sort")
.medcards-wrapper.flex.flex-col.overflow-auto
.medcards-wrapper.flex.flex-col.overflow-auto.w-full
.medcard.flex.items-center.cursor-pointer(
v-for="patient in patients",
@click="selectMedcard(patient)"
)
.flex.justify-between.w-full.items-center
.name.flex.justify-between.w-full.items-center.h-14
.info-block.flex.justify-between.gap-x-2
img.h-10.w-10.object-cover.rounded-full(:src="patient.avatar")
.flex.flex-col.gap-y-1
.text-m {{trimPatientName(patient.last_name, patient.first_name, patient.patronymic)}}
.grey-color.text-smm {{patient.birthday}}
q-icon.ok-icon(name="app:ok", v-if="patient.check" size="24px")
q-icon.ok-icon(name="app:ok", v-if="patient.check", size="24px")
.footer.flex.gap-2
base-button(type="secondary", label="Отменить", width="125px", @click="closeMedcards")
base-button(
@@ -98,17 +98,22 @@ export default {
.search :deep(.q-field__prepend)
padding-right: 4px
.name
margin: 4px 0px
&:hover
border-radius: 4px
background: var(--gray-thirdly)
.medcard
height: 64px
margin-right: 14px
border-bottom: 1px solid var(--gray-secondary)
&:last-child
border-bottom: none
&:hover
border-radius: 4px
background: var(--gray-thirdly)
.medcards-wrapper
width: 440px
max-height: 563px
margin-right: -18px
&::-webkit-scrollbar

253
src/pages/newCalendar/utils/calendarConfig.js
View File

@@ -111,6 +111,7 @@ export const patientList = [
patronymic: "Александрович",
birthday: "28.03.1980",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -121,6 +122,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "33%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 1,
@@ -129,6 +152,7 @@ export const patientList = [
patronymic: "Олегович",
birthday: "01.03.1975",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -139,6 +163,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "20%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 2,
@@ -147,6 +193,7 @@ export const patientList = [
patronymic: "Васильевич",
birthday: "13.07.1999",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -157,6 +204,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 3,
@@ -165,6 +234,7 @@ export const patientList = [
patronymic: "Робертович",
birthday: "11.11.1991",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -175,6 +245,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 4,
@@ -183,6 +275,7 @@ export const patientList = [
patronymic: "Алексеевич",
birthday: "12.03.1989",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -193,6 +286,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 5,
@@ -201,6 +316,7 @@ export const patientList = [
patronymic: "Васильевич",
birthday: "31.07.1949",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -211,6 +327,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 6,
@@ -219,6 +357,7 @@ export const patientList = [
patronymic: "Олеговна",
birthday: "12.11.1995",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -229,6 +368,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 7,
@@ -237,6 +398,7 @@ export const patientList = [
patronymic: "Алексеевич",
birthday: "15.05.1989",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -247,6 +409,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 8,
@@ -255,6 +439,7 @@ export const patientList = [
patronymic: "Васильевич",
birthday: "13.07.2000",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -265,6 +450,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 9,
@@ -273,6 +480,7 @@ export const patientList = [
patronymic: "Федорович",
birthday: "12.12.1986",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -283,6 +491,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
{
id: 10,
@@ -291,6 +521,7 @@ export const patientList = [
patronymic: "Алексеевич",
birthday: "13.03.1979",
avatar: personImage,
medicalNumber: "#12314",
check: false,
view: false,
viewDate: "",
@@ -301,6 +532,28 @@ export const patientList = [
email: "gaevaia@yandex.ru",
company: "ООО «АльфаСтрахование»",
policy: "№ 2131-1331-4142",
fill: "50%",
marks: [
{
id: 0,
name: "Неправильный прикус",
color: "#D8E3FF",
},
{
id: 1,
name: "Нервозность",
color: "#CEF1F3",
},
{
id: 2,
name: "Парадантит",
color: "#EBDBFF",
},
],
networks: [
{ id: 0, name: "VK", link: "vk.com/", icon: "app:vk" },
{ id: 1, name: "Telegram", link: "tg.com/", icon: "app:tg" },
],
},
],
choice: false,

1
tailwind.config.js
View File

@@ -58,6 +58,7 @@ module.exports = {
"19px": "19px",
"22px": "22px",
"23px": "23px",
"25px": "25px",
"27px": "27px",
"29_25px": "29.25px",
"30px": "30px",