diff --git a/src/assets/icons/locked.svg b/src/assets/icons/locked.svg
new file mode 100644
index 0000000..6bbe3cc
--- /dev/null
+++ b/src/assets/icons/locked.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/components/base/BaseInput.vue b/src/components/base/BaseInput.vue
index fbd8b25..6bac6b4 100644
--- a/src/components/base/BaseInput.vue
+++ b/src/components/base/BaseInput.vue
@@ -1,9 +1,9 @@
- base-input-container.gap-y-2(:label="label", :style="{width: width + 'px' }")
+ base-input-container.gap-y-2(:important="important", :label="label", :style="{width: width + 'px' }")
q-input(
v-model="value",
:name="name",
- :multiple="multiple"
+ :multiple="multiple",
:class="{'circle': circle, 'font-input': true, 'doc': doc}",
:input-style="{ color: textColor, borderColor: borderColor, resize: resize, fontSize: fontSize, fontWeight: fontWeight, lineHeight: lineHeight}",
:borderless="borderless",
@@ -26,7 +26,7 @@
:standout="standout"
:accept="accept",
:debounce="debounce",
- :shadow-text="shadowText"
+ :shadow-text="shadowText",
hide-bottom-space
)
template(v-slot:prepend, v-if="iconLeft")
@@ -116,6 +116,7 @@ export default {
iconLeft: Boolean,
iconRight: Boolean,
name: String,
+ important: Boolean,
},
emits: ["update:modelValue"],
computed: {
diff --git a/src/components/base/BaseInputContainer.vue b/src/components/base/BaseInputContainer.vue
index 36c1f51..f2875ef 100644
--- a/src/components/base/BaseInputContainer.vue
+++ b/src/components/base/BaseInputContainer.vue
@@ -1,6 +1,7 @@
.flex.flex-col.gap-y-2
.label.font-semibold.text-sm.opacity-40(v-if="label") {{ label }}
+ span.-mt-2(v-if="important", :style="{color: 'var(--font-obligatory-color)'}") *
slot
@@ -9,6 +10,7 @@ export default {
name: "BaseInputContainer",
props: {
label: String,
+ important: Boolean,
},
};
diff --git a/src/components/base/BaseInputFullName.vue b/src/components/base/BaseInputFullName.vue
new file mode 100644
index 0000000..d531812
--- /dev/null
+++ b/src/components/base/BaseInputFullName.vue
@@ -0,0 +1,94 @@
+
+ .flex.gap-x-3.w-full.py-6
+ q-btn(
+ color="secondary",
+ text-color="primary",
+ style="width: 40px; height: 40px",
+ rounded,
+ no-caps,
+ padding="0 16px"
+ )
+ q-icon(v-if="image === defaultIcon", name="app:icon-download")
+ q-avatar(v-else, size="40px", round)
+ img(:src="image")
+ q-menu(anchor="bottom middle", self="top right", v-model="showPopup")
+ .flex.flex-col.p-4.gap-y-3
+ .flex.items-center.gap-x-2.cursor-pointer(@click="changeOpenModal")
+ q-icon(name="app:computer", size="18px", color="primary")
+ span.text-smm.title Загрузить с компьютера
+ .flex.items-center.gap-x-2.cursor-pointer
+ q-icon(name="app:camera", size="18px", color="primary")
+ span.text-smm.title Сделать фото
+ base-modal(v-model="showModal", title="Загрузить изображение")
+ .flex.flex-col.items-center.justify-center(
+ :style="{padding: '153px 370px'}"
+ )
+ .avatar-wrapper.flex.relative
+ base-input(
+ circle,
+ type="file",
+ id="image-upload",
+ accept="image/*",
+ @change="(e) => previewImage(e)"
+ )
+ .avatar.flex.absolute.items-center.gap-x-6
+ img.avatar.object-cover(for="image-upload", :src="image", v-if="image")
+ q-btn(round, color="primary", @click="closeAddImage", icon="app:icon-ok")
+ base-input.w-full(v-model="infoClient.basic.full_name", placeholder="ФИО пациента*", outlined)
+
+
+
+
+
diff --git a/src/components/base/BaseModal.vue b/src/components/base/BaseModal.vue
index e95635a..1c1fcfc 100644
--- a/src/components/base/BaseModal.vue
+++ b/src/components/base/BaseModal.vue
@@ -6,7 +6,7 @@
ref="dialog"
)
.base-content(
- :class="{'draggable': draggable, 'base-content-default': !defaultPadding}",
+ :class="{'draggable': draggable, 'base-content-default': !defaultPadding, 'base-modal-default': modalPadding}",
ref="contentRef",
:style="{...contentStyles, height}"
)
@@ -30,6 +30,7 @@ export default {
draggable: Boolean,
hideOverlay: Boolean,
defaultPadding: Boolean,
+ modalPadding: Boolean,
hideHeader: Boolean,
height: {
type: String,
@@ -135,6 +136,9 @@ export default {
.base-content-default
padding: 32px 40px
+.base-modal-default
+ padding: 28px 32px
+
.base-content
width: auto
background-color: var(--default-white)
diff --git a/src/components/base/BaseTimeModal.vue b/src/components/base/BaseTimeModal.vue
new file mode 100644
index 0000000..559ae43
--- /dev/null
+++ b/src/components/base/BaseTimeModal.vue
@@ -0,0 +1,91 @@
+
+ .flex.flex-col.gap-y-6.pt-6
+ .table-time.flex.p-4
+ .flex.flex-col.gap-1(v-for="time in timeCoil")
+ .flex {{ time }}
+ .side.flex.p-1.h-9(:style="{columnGap: '2px'}")
+ q-btn.left-side(size="9px", padding="0 8px", color="primary")
+ q-icon(name="app:icon-ok")
+ q-btn.right-side(size="4px", padding="0 4px")
+ img(:src="lockIcon")
+ .flex.justify-between.items-center
+ .flex.gap-2
+ q-btn(
+ color="primary",
+ outline,
+ size="16px",
+ no-caps,
+ label="Отмена",
+ :style="{width: '108px', height: '40px'}",
+ padding="0",
+ @click="closeModalTime"
+ )
+ q-btn(
+ color="primary",
+ size="16px",
+ no-caps,
+ label="Сохранить"
+ :style="{width: '132px', height: '40px'}",
+ padding="0",
+ @click="closeModalTime"
+ )
+ .text.font-bold.text-6xl {{`${times.from} - ${times.to}`}}
+
+
+
+
+
diff --git a/src/pages/clients/components/FormCreateBasicInfo.vue b/src/pages/clients/components/FormCreateBasicInfo.vue
index 92afdc2..8ec87e3 100644
--- a/src/pages/clients/components/FormCreateBasicInfo.vue
+++ b/src/pages/clients/components/FormCreateBasicInfo.vue
@@ -11,20 +11,23 @@
type="date"
v-model="basicInfo.birth_date",
label="Дата рождения",
- outlined
+ outlined,
+ important
)
base-input(
v-model="phone.username",
placeholder="+7 (915) 644–92–23",
mask="+7 (###) ###-##-##",
label="Номер телефона",
- outlined
+ outlined,
+ important
)
base-input(
v-model="email.username",
placeholder="user@yandex.ru",
label="Email",
- outlined
+ outlined,
+ important
)
.flex.flex-col.col-start-1.col-end-3.w-100(class="gap-y-1.5")
span.text-sm.font-semibold.opacity-40.input-info Ссылки на соцсети
diff --git a/src/pages/newCalendar/TheCalendar.vue b/src/pages/newCalendar/TheCalendar.vue
index b3ac0e4..add8028 100644
--- a/src/pages/newCalendar/TheCalendar.vue
+++ b/src/pages/newCalendar/TheCalendar.vue
@@ -3,7 +3,8 @@
calendar-sidebar(v-if="!isOpen", :open-sidebar="openSidebar", :create-form="createForm")
calendar-open-sidebar(v-else, :open-sidebar="openSidebar", :create-form="createForm")
calendar-wrapper.ml-2(:open-sidebar="isOpen")
- record-creation-form(:is-show-form="isShowForm")
+ base-modal(v-model="isShowForm", title="Создание записи", modal-padding)
+ record-creation-form(v-model="isShowForm", :close-form="closeForm")
diff --git a/src/pages/newCalendar/components/RecordCreationForm.vue b/src/pages/newCalendar/components/RecordCreationForm.vue
index 72e21c8..7671b7c 100644
--- a/src/pages/newCalendar/components/RecordCreationForm.vue
+++ b/src/pages/newCalendar/components/RecordCreationForm.vue
@@ -1,66 +1,215 @@
- base-modal(v-model="isShowForm", title="Создание записи")
- .flex.flex-col.pt-6.gap-y-4(:style="{maxWidth: '682px'}")
- .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
- .text-input.font-medium Не принят
- q-btn.change.flex.w-7.h-7(dense, padding="4px 4px")
- img(:src="folder")
- .flex.gap-x-3.items-center
- .text.font-semibold Дата:
- .flex.gap-x-1
- .input.flex.items-center.pl-4
- .text-input.font-medium 24 мая 2020
- q-btn.change.flex.w-7.h-7(dense, padding="4px 4px")
- img(:src="calendar")
- .flex.gap-x-3.items-center
- .text.font-semibold Время:
- .flex.gap-x-1
- .input.flex.items-center.pl-4
- .text-input.font-medium 13:00 - 14:00
- q-btn.change.flex.w-7.h-7(dense, padding="4px 4px")
- img(:src="time")
- .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
- .photo.flex.h-10.w-10.items-center.justify-center
- img(:src="noname")
- .flex.flex-col.font-medium
- .text-input Имя Фамилия
- .name-date.text-xsx Дата
- .change.flex.items-center
- q-btn(dense, padding="24px 8px")
- q-icon(name="app:icon-plus", size="12px")
- .flex.items-center.gap-x-3
- .text.font-semibold.text-smm Услуги
- .flex.gap-x-1
- .services.flex
- .change.flex.w-7.h-7
+ .flex.flex-col.pt-6.gap-y-4(:style="{maxWidth: '682px'}")
+ .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
+ img(:src="currentStatus.icon")
+ .text-input.font-medium {{currentStatus.name}}
+ q-btn.change.flex.w-7.h-7(dense, padding="4px 4px")
+ img(:src="folder")
+ q-menu
+ .status.flex.items-center.gap-x-1.font-medium.text-smm(
+ v-for="status in patientData.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
+ .text-input.font-medium {{currentDate.format("DD MMMM YYYY")}}
+ q-btn.change.flex.w-7.h-7(dense, padding="4px 4px")
+ img(:src="calendar")
+ 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
+ .text-input.font-medium 13:00 - 14:00
+ q-btn.change.flex.w-7.h-7(@click="isShowTime = true", dense, padding="4px 4px")
+ img(:src="time")
+ 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
+ .photo.flex.h-10.w-10.items-center.justify-center
+ img(:src="noname")
+ .flex.flex-col.font-medium
+ .text-input Имя Фамилия
+ .name-date.text-xsx Дата
+ .change.flex.items-center
+ q-btn(dense, padding="24px 8px")
+ q-icon(name="app:icon-plus", size="12px")
+ .flex.items-center.gap-x-3.text-smm
+ .text.font-semibold Услуги:
+ .flex.gap-x-1
+ .services.flex.items-center.px-4.font-medium.text
+ span Выберите услуги
+ q-btn.change.flex.w-7.h-7(dense, padding="4px 4px")
+ img(:src="folder")
+ base-input-full-name(:info-client="patientData")
+ .flex.flex-col.flex-auto.l.gap-y-8
+ .flex
+ button.title-info.px-6.py-2.cursor-pointer.w-full.text-sm(
+ v-for="form in forms",
+ @click="selectForm(form.component)",
+ :class="{active: form.component === currentForm}",
+ :key="form.id",
+ :id="form.id"
+ ) {{form.title}}
+ component(
+ v-bind:is="currentForm",
+ :basic-info="patientData.basic",
+ :phone="patientData.phone",
+ :email="patientData.email",
+ :add-network="addNewNetwork",
+ :priority-list="patientData.priorityList",
+ :identity-document="patientData.identity_document",
+ :addresses="patientData.addresses",
+ :save-file="saveDocFile",
+ :networks-list="getNetworksList",
+ )
+ .footer.flex.gap-2
+ q-btn(
+ color="primary",
+ outline,
+ size="16px",
+ no-caps,
+ label="Отменить"
+ :style="{width: '126px', height: '40px'}",
+ padding="0",
+ @click="closeForm"
+ )
+ q-btn(
+ color="primary",
+ size="16px",
+ no-caps,
+ label="Создать запись"
+ :style="{width: '174px', height: '40px'}",
+ padding="0",
+ @click="closeForm"
+ )
@@ -102,4 +251,27 @@ export default {
border-radius: 6px
height: 28px
width: 560px
+
+.title-info
+ color: var(--font-grey-color)
+ border-bottom: 1.5px solid var(--font-grey-color)
+ &:hover
+ color: var(--btn-blue-color)
+ border-bottom: 1.5px solid var(--btn-blue-color)
+ &.active
+ color: var(--btn-blue-color)
+ border-bottom: 1.5px solid var(--btn-blue-color)
+
+.footer
+ border-top: 1px solid var(--border-light-grey-color)
+ margin: 40px -32px 0px
+ padding: 16px 32px 0px 32px
+
+.status
+ border-radius: 4px
+ height: 28px
+ padding: 8px 8px 8px 5px
+ &:hover
+ background: var(--bg-light-grey)
+ cursor: pointer
diff --git a/src/pages/newCalendar/utils/calendarConfig.js b/src/pages/newCalendar/utils/calendarConfig.js
index ce35b3d..fa2c1e7 100644
--- a/src/pages/newCalendar/utils/calendarConfig.js
+++ b/src/pages/newCalendar/utils/calendarConfig.js
@@ -136,3 +136,65 @@ export const patientList = [
choice: false,
},
];
+export const patientData = {
+ basic: {
+ full_name: "",
+ birth_date: null,
+ priority: {
+ id: null,
+ label: "",
+ },
+ contacts: [
+ {
+ kind: {
+ id: "TELEGRAM",
+ icon: "app:icon-tg",
+ },
+ username: "",
+ },
+ ],
+ },
+ identity_document: {
+ pass: {
+ series_number: "",
+ issued_by_org: "",
+ issued_by_date: null,
+ issued_by_org_code: "",
+ },
+ snils: {
+ kind: "СНИЛС",
+ number: "",
+ },
+ inn: {
+ kind: "ИНН",
+ number: "",
+ },
+ },
+ phone: { username: "" },
+ email: { username: "" },
+ addresses: {},
+ priorityList: [
+ {
+ id: 1,
+ label: "Высокий",
+ },
+ {
+ id: 2,
+ label: "Средний",
+ },
+ {
+ id: 3,
+ label: "Низкий",
+ },
+ {
+ id: 4,
+ label: "-",
+ },
+ ],
+ statuses: [
+ { name: "Отказ", icon: rejected, check: false },
+ { name: "Не принят", icon: not_accepted, check: true },
+ { name: "На приеме", icon: reception, check: false },
+ { name: "Принят", icon: accepted, check: false },
+ ],
+};