[WIP] Фикс процента заполнения медкарты
This commit is contained in:
@@ -96,4 +96,5 @@
|
||||
--system-color-red: #f34549
|
||||
--system-color-green: #21ba72
|
||||
--gray-background: #e9e9ed
|
||||
--aqua-color: #2cc3e5
|
||||
|
||||
|
||||
@@ -39,13 +39,16 @@
|
||||
.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
|
||||
.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%'}")
|
||||
.change.flex.items-center.rounded-md
|
||||
q-btn(dense, padding="18px 4px", @click="isShowMedcards = true")
|
||||
q-icon.icon(name="app:folder", size="20px")
|
||||
@@ -119,6 +122,9 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
fixedFill(fill) {
|
||||
return 100 - fill.slice(0, -1) + "%";
|
||||
},
|
||||
closeModalMedcards() {
|
||||
this.isShowMedcards = false;
|
||||
},
|
||||
@@ -167,6 +173,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 +187,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>
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -121,6 +121,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "90%",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
@@ -139,6 +140,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "20%",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@@ -157,6 +159,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
@@ -175,6 +178,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
@@ -193,6 +197,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
@@ -211,6 +216,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
@@ -229,6 +235,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
@@ -247,6 +254,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
@@ -265,6 +273,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
@@ -283,6 +292,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
@@ -301,6 +311,7 @@ export const patientList = [
|
||||
email: "gaevaia@yandex.ru",
|
||||
company: "ООО «АльфаСтрахование»",
|
||||
policy: "№ 2131-1331-4142",
|
||||
fill: "50%",
|
||||
},
|
||||
],
|
||||
choice: false,
|
||||
|
||||
Reference in New Issue
Block a user