.flex.gap-x-10
.flex.flex-col.gap-y-4.text-smm
.flex.gap-x-3.items-center
.text.font-semibold Статус:
.flex.gap-x-1
.input.flex.items-center.pl-4.gap-x-1.rounded-md
img(:src="currentStatus.icon")
.dark-blue.font-medium {{currentStatus.name}}
q-btn.change.flex.w-7.h-7.rounded-md(dense, padding="4px 4px")
q-icon.icon(name="app:folder", size="20px")
q-menu(:offset="[140, 8]")
.flex.p-2.flex-col
.status.flex.items-center.gap-x-1.font-medium.text-smm.rounded.h-7(
v-for="status in statuses",
@click="choiceStatus(status)",
v-close-popup
)
img(:src="status.icon")
span {{status.name}}
.flex.gap-x-3.items-center
.text.font-semibold Дата:
.flex.gap-x-1
.input.flex.items-center.pl-4.rounded-md
.dark-blue.font-medium {{currentDate.format("DD MMMM YYYY")}}
q-btn.change.flex.w-7.h-7.rounded-md(dense, padding="4px 4px")
q-icon.icon(name="app:calendar", size="20px")
q-menu(
transition-show="scale",
transition-hide="scale",
self="top middle",
:offset="[118, 14]",
)
base-calendar(v-model="currentDate")
.flex.gap-x-3.items-center
.text.font-semibold Время:
.flex.gap-x-1
.input.flex.items-center.pl-4.rounded-md
.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-icon.icon(name="app:time", size="20px")
base-modal(v-model="isShowTime", title="Время", modal-padding)
base-time-modal(:times="times", :close-modal-time="closeModalTime")
.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
q-icon.icon(name="app:noname", size="24px")
.flex.flex-col.font-medium
.dark-blue Имя Фамилия
.grey-color.text-xsx.rounded-md Дата
.change.flex.items-center.rounded-md
q-btn(dense, padding="18px 4px")
q-icon.icon(name="app:folder", size="20px")