.wrapper.flex.flex-col.pt-6.dark-blue.font-medium
.flex.flex-col.gap-y-4
.flex.justify-between.w-full
base-input.search(
placeholder="Поиск",
:width="422",
iconLeft,
size="M"
)
template(v-slot:iconLeft)
q-icon(name="app:search", size="20px", style="color: var(--font-grey-color)")
q-btn.ml-2(
@click="sortPerson(patients)",
:style="{width: '45px', height: '40px', border: '1px solid var(--gray-secondary)'}",
padding="0px",
:class="sortingClass"
)
calendar-sidebar-svg(name-svg="sort", :active="sort")
.medcards-wrapper.flex.flex-col.overflow-auto.w-full
.medcard.flex.items-center.cursor-pointer(
v-for="patient in patients",
@click="selectMedcard(patient)"
)
.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")
.footer.flex.gap-2
base-button(type="secondary", label="Отменить", width="125px", @click="closeMedcards")
base-button(
width="132px",
label="Сохранить",
@click="saveMedcard(selectedMedcard)",
:disabled="!selectedMedcard"
)