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

[WIP] Поправил хедер модалки создания записи, обновление пациентов медкарточек

Browse Source
This commit is contained in:
megavrilinvv
2023-07-31 11:49:36 +03:00
parent 98c7cc5f64
commit 16f2394eec
3 changed files with 61 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/base/BaseTimeModal.vue
View File

@@ -1,13 +1,13 @@
<template lang="pug"> <template lang="pug">
.flex.flex-col.gap-y-6.pt-6 .flex.flex-col.gap-y-6.pt-6.dark-blue
.table-time.flex.p-4 .table-time.flex.p-4
.flex.flex-col.gap-1(v-for="time in timeCoil") .top-block.flex.flex-col.-mr-4(v-for="time in timeCoil")
.flex {{ time }} .timeline.flex.text-smm.font-medium {{time}}
.side.flex.p-1.h-9(:style="{columnGap: '2px'}") .side.flex.p-1.h-9
q-btn.left-side(size="9px", padding="0 8px", color="primary") q-btn.plus-btn(size="9px", padding="0 8px")
q-icon(name="app:icon-ok") q-icon.icon-grey(name="app:plus", size="20px")
q-btn.right-side(size="4px", padding="0 4px") q-btn.lock-btn(size="4px", padding="0 4px")
img(:src="lockIcon") q-icon.icon(name="app:lock", size="20px")
.flex.justify-between.items-center .flex.justify-between.items-center
.flex.gap-2 .flex.gap-2
base-button( base-button(
@@ -21,11 +21,10 @@
label="Сохранить", label="Сохранить",
@click="closeModalTime" @click="closeModalTime"
) )
.text.font-bold.text-6xl {{`${times.from} - ${times.to}`}} .dark-blue.font-bold.text-6xl {{`${times.from} - ${times.to}`}}
</template> </template>
<script> <script>
import lockIcon from "@/assets/icons/locked.svg";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
export default { export default {
@@ -33,7 +32,7 @@ export default {
props: { times: Object, closeModalTime: Function }, props: { times: Object, closeModalTime: Function },
components: { BaseButton }, components: { BaseButton },
data() { data() {
return { lockIcon, select: false }; return { select: false };
}, },
computed: { computed: {
validateStartTime() { validateStartTime() {
@@ -64,22 +63,29 @@ export default {
.table-time .table-time
width: 463px width: 463px
height: 174px height: 174px
border: 1px solid var(--border-light-grey-color)
border-radius: 6px border-radius: 6px
flex-wrap: wrap !important flex-wrap: wrap !important
border: 1px solid var(--gray-secondary)
.text .dark-blue
color: var(--font-dark-blue-color) color: var(--font-dark-blue-color)
.side .side
border-left: 1px solid var(--border-light-grey-color) border-left: 1px solid var(--font-dark-blue-color)
border-right: 1px solid var(--border-light-grey-color) margin-left: 16px
margin-bottom: 24px
.left-side .plus-btn
border-radius: 6px 1px 1px 6px border-radius: 6px 1px 1px 6px
background: #4772F2 border: 1px solid var(--gray-secondary)
.right-side .lock-btn
border-radius: 1px 6px 6px 1px border-radius: 1px 6px 6px 1px
background: #FF6565 border: 1px solid var(--gray-secondary)
.icon :deep(path)
fill: var(--system-color-red)
.icon-grey :deep(path)
fill: var(--font-grey-color)
</style> </style>

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

@@ -2,14 +2,15 @@
.flex.gap-x-10 .flex.gap-x-10
.flex.flex-col.gap-y-4.text-smm .flex.flex-col.gap-y-4.text-smm
.flex.gap-x-3.items-center .flex.gap-x-3.items-center
.text.font-semibold Статус .text.font-semibold Статус:
.flex.gap-x-1 .flex.gap-x-1
.input.flex.items-center.pl-4.gap-x-1.rounded-md .input.flex.items-center.pl-4.gap-x-1.rounded-md
img(:src="currentStatus.icon") img(:src="currentStatus.icon")
.dark-blue.font-medium {{currentStatus.name}} .dark-blue.font-medium {{currentStatus.name}}
q-btn.change.flex.w-7.h-7.rounded-md(dense, padding="4px 4px") q-btn.change.flex.w-7.h-7.rounded-md(dense, padding="4px 4px")
img(:src="folder") q-icon.icon(name="app:folder", size="20px")
q-menu q-menu(:offset="[140, 8]")
.flex.p-2.flex-col
.status.flex.items-center.gap-x-1.font-medium.text-smm.rounded.h-7( .status.flex.items-center.gap-x-1.font-medium.text-smm.rounded.h-7(
v-for="status in statuses", v-for="status in statuses",
@click="choiceStatus(status)", @click="choiceStatus(status)",
@@ -23,7 +24,7 @@
.input.flex.items-center.pl-4.rounded-md .input.flex.items-center.pl-4.rounded-md
.dark-blue.font-medium {{currentDate.format("DD MMMM YYYY")}} .dark-blue.font-medium {{currentDate.format("DD MMMM YYYY")}}
q-btn.change.flex.w-7.h-7.rounded-md(dense, padding="4px 4px") q-btn.change.flex.w-7.h-7.rounded-md(dense, padding="4px 4px")
img(:src="calendar") q-icon.icon(name="app:calendar", size="20px")
q-menu( q-menu(
transition-show="scale", transition-show="scale",
transition-hide="scale", transition-hide="scale",
@@ -37,7 +38,7 @@
.input.flex.items-center.pl-4.rounded-md .input.flex.items-center.pl-4.rounded-md
.dark-blue.font-medium 13:00 - 14:00 .dark-blue.font-medium 13:00 - 14:00
q-btn.change.flex.w-7.h-7.rounded-md(@click="isShowTime = true", dense, padding="4px 4px") q-btn.change.flex.w-7.h-7.rounded-md(@click="isShowTime = true", dense, padding="4px 4px")
img(:src="time") q-icon.icon(name="app:time", size="20px")
base-modal(v-model="isShowTime", title="Время", modal-padding) base-modal(v-model="isShowTime", title="Время", modal-padding)
base-time-modal(:times="times", :close-modal-time="closeModalTime") base-time-modal(:times="times", :close-modal-time="closeModalTime")
.flex.h-14.gap-x-3.items-center.text-smm .flex.h-14.gap-x-3.items-center.text-smm
@@ -45,20 +46,17 @@
.flex.gap-x-1 .flex.gap-x-1
.name.flex.items-center.px-4.pt-2.pb-1.gap-x-2.rounded-md .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 .photo.flex.h-10.w-10.items-center.justify-center
img(:src="noname") q-icon.icon(name="app:noname", size="24px")
.flex.flex-col.font-medium .flex.flex-col.font-medium
.dark-blue Имя Фамилия .dark-blue Имя Фамилия
.grey-color.text-xsx.rounded-md Дата .grey-color.text-xsx.rounded-md Дата
.change.flex.items-center.rounded-md .change.flex.items-center.rounded-md
q-btn(dense, padding="24px 8px") q-btn(dense, padding="18px 4px")
q-icon(name="app:icon-plus", size="12px") q-icon.icon(name="app:folder", size="20px")
</template> </template>
<script> <script>
import folder from "@/assets/icons/folder.svg";
import time from "@/assets/icons/time.svg";
import noname from "@/assets/icons/noname.svg"; import noname from "@/assets/icons/noname.svg";
import calendar from "@/assets/icons/calendar-grey.svg";
import BaseCalendar from "@/components/base/Calendar/BaseCalendar.vue"; import BaseCalendar from "@/components/base/Calendar/BaseCalendar.vue";
import BaseModal from "@/components/base/BaseModal.vue"; import BaseModal from "@/components/base/BaseModal.vue";
import BaseTimeModal from "@/components/base/BaseTimeModal.vue"; import BaseTimeModal from "@/components/base/BaseTimeModal.vue";
@@ -70,9 +68,6 @@ export default {
props: { currentStatus: Object, statuses: Array, choiceStatus: Function }, props: { currentStatus: Object, statuses: Array, choiceStatus: Function },
data() { data() {
return { return {
folder,
calendar,
time,
noname, noname,
currentDate: moment().clone(), currentDate: moment().clone(),
isShowTime: false, isShowTime: false,
@@ -90,7 +85,10 @@ export default {
<style lang="sass" scoped> <style lang="sass" scoped>
.input .input
width: 200px width: 200px
background: var(--bg-light-grey) border: 1px solid var(--gray-secondary)
.icon :deep(path)
fill: var(--font-grey-color)
.dark-blue .dark-blue
color: var(--font-dark-blue-color) color: var(--font-dark-blue-color)
@@ -101,7 +99,9 @@ export default {
color: var(--font-grey-color) color: var(--font-grey-color)
.status .status
padding: 8px 8px 8px 5px width: 160px
height: 40px
padding: 8px 10px
&:hover &:hover
background: var(--bg-light-grey) background: var(--bg-light-grey)
cursor: pointer cursor: pointer

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

@@ -114,8 +114,8 @@ export const patientList = [
check: false, check: false,
view: false, view: false,
viewDate: "", viewDate: "",
reception: "28.07.2023", reception: "31.07.2023",
time: { from: "11:00", to: "12:00" }, time: { from: "12:00", to: "13:00" },
priority: 1, priority: 1,
phone: "+7 (910) 623–32–23", phone: "+7 (910) 623–32–23",
email: "gaevaia@yandex.ru", email: "gaevaia@yandex.ru",
@@ -132,8 +132,8 @@ export const patientList = [
check: false, check: false,
view: false, view: false,
viewDate: "", viewDate: "",
reception: "28.07.2023", reception: "31.07.2023",
time: { from: "12:00", to: "13:00" }, time: { from: "13:00", to: "14:00" },
priority: 1, priority: 1,
phone: "+7 (910) 623–32–23", phone: "+7 (910) 623–32–23",
email: "gaevaia@yandex.ru", email: "gaevaia@yandex.ru",
@@ -150,8 +150,8 @@ export const patientList = [
check: false, check: false,
view: false, view: false,
viewDate: "", viewDate: "",
reception: "28.07.2023", reception: "31.07.2023",
time: { from: "13:00", to: "14:00" }, time: { from: "14:00", to: "15:00" },
priority: 1, priority: 1,
phone: "+7 (910) 623–32–23", phone: "+7 (910) 623–32–23",
email: "gaevaia@yandex.ru", email: "gaevaia@yandex.ru",
@@ -168,8 +168,8 @@ export const patientList = [
check: false, check: false,
view: false, view: false,
viewDate: "", viewDate: "",
reception: "28.07.2023", reception: "31.07.2023",
time: { from: "14:00", to: "16:00" }, time: { from: "15:00", to: "17:00" },
priority: 1, priority: 1,
phone: "+7 (910) 623–32–23", phone: "+7 (910) 623–32–23",
email: "gaevaia@yandex.ru", email: "gaevaia@yandex.ru",
@@ -186,8 +186,8 @@ export const patientList = [
check: false, check: false,
view: false, view: false,
viewDate: "", viewDate: "",
reception: "28.07.2023", reception: "31.07.2023",
time: { from: "16:00", to: "20:00" }, time: { from: "17:00", to: "20:00" },
priority: 1, priority: 1,
phone: "+7 (910) 623–32–23", phone: "+7 (910) 623–32–23",
email: "gaevaia@yandex.ru", email: "gaevaia@yandex.ru",
@@ -199,13 +199,13 @@ export const patientList = [
first_name: "Анатолий", first_name: "Анатолий",
last_name: "Петров", last_name: "Петров",
patronymic: "Васильевич", patronymic: "Васильевич",
birthday: "23.07.1949", birthday: "31.07.1949",
avatar: personImage, avatar: personImage,
check: false, check: false,
view: false, view: false,
viewDate: "", viewDate: "",
reception: "28.07.2023", reception: "31.07.2023",
time: { from: "18:00", to: "19:00" }, time: { from: "10:00", to: "12:00" },
priority: 1, priority: 1,
phone: "+7 (910) 623–32–23", phone: "+7 (910) 623–32–23",
email: "gaevaia@yandex.ru", email: "gaevaia@yandex.ru",