fix calendar
This commit is contained in:
@@ -18,10 +18,9 @@
|
||||
|
||||
<script>
|
||||
import * as moment from "moment/moment";
|
||||
import { recordList } from "@/pages/newCalendar/utils/calendarConfig.js";
|
||||
import CalendarRecordCard from "@/pages/newCalendar/components/CalendarRecordCard.vue";
|
||||
import { verifyTime } from "@/pages/newCalendar/utils/calendarFunctions.js";
|
||||
import { mapActions } from "vuex";
|
||||
import { mapActions, mapState } from "vuex";
|
||||
export default {
|
||||
name: "CalendarColumn",
|
||||
components: { CalendarRecordCard },
|
||||
@@ -37,8 +36,11 @@ export default {
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
events: (state) => state.calendar.events || [],
|
||||
}),
|
||||
filteredRecords() {
|
||||
return recordList.filter(
|
||||
return this.events.filter(
|
||||
(elem) =>
|
||||
moment.parseZone(elem.start).format("YYYY-MM-DD") ===
|
||||
this.date.format("YYYY-MM-DD")
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
)
|
||||
.color-black.pl-4.flex-1.font-semibold.py-6px.relative(
|
||||
:class="{'pl-6px collapsed-name': expandedTime}"
|
||||
) {{trimPatientName(record?.member?.last_name, record?.member?.first_name, record?.member?.patronymic)}}
|
||||
) {{trimPatientName(record?.person?.last_name, record?.person?.first_name, record?.person?.patronymic)}}
|
||||
.gradient.absolute.w-5.h-full.right-0(v-if="expandedTime")
|
||||
.info-block.justify-center
|
||||
img.w-5.h-5(:src="recordingStatus?.icon")
|
||||
@@ -37,7 +37,6 @@
|
||||
.h-6.w-6.color-black.background-dark-grey.text-xxs.rounded.flex.items-center.justify-center(
|
||||
v-if="collapsedDisplayCondition"
|
||||
) +1
|
||||
span.text-xxs.self-end(v-if="record?.services.length && bodyClass?.['flex-col']") {{`${record?.services.length} услуг`}}
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -9,9 +9,9 @@
|
||||
.flex.items-center.gap-x-3(v-for="field in previewConfig", :key="field?.title")
|
||||
.field.color-grey.flex.items-center.justify-start.font-semibold {{ field?.title }}:
|
||||
.info.flex-1.rounded.h-full.py-2.px-4.flex.items-center.gap-x-1.color-dark-blue(v-if="field?.data")
|
||||
img.h-5.w-5(:src="field?.icon ? this[field?.icon] : ''", v-if="field?.icon")
|
||||
//img.h-5.w-5(:src="field?.icon ? this[field?.icon] : ''", v-if="field?.icon")
|
||||
span {{ field?.data ? this[field?.data] : "" }}
|
||||
.flex.gap-x-1.flex-1(v-if="field?.title === 'Медкарта'")
|
||||
.flex.gap-x-1.flex-1(v-if="field?.title === 'Пациент'")
|
||||
.nameplate.rounded.px-4.pt-2.pb-1.flex.gap-x-2.info.flex-1
|
||||
q-avatar(size="40px")
|
||||
img(:src="memberData?.photo")
|
||||
@@ -21,27 +21,27 @@
|
||||
q-btn.flex-1(
|
||||
color="primary",
|
||||
no-caps,
|
||||
label="Полная медкарта",
|
||||
label="Медкарта",
|
||||
:style="{'font-weight': 500}"
|
||||
size="14px"
|
||||
)
|
||||
q-icon.arrow.ml-1(name="app:long-arrow", size="20px")
|
||||
.flex.gap-x-1.flex-1.h-full(v-if="field?.title === 'Услуги'")
|
||||
.rounded.h-full.services.flex.flex-wrap.gap-1.p-1
|
||||
.py-2.px-4.color-dark-blue.rounded.h-7.relative(
|
||||
v-for="chip in services.list",
|
||||
:key="chip?.title",
|
||||
:id="chip?.title",
|
||||
:class="chipClass(chip?.title)"
|
||||
:style="{'background-color': chip?.color}"
|
||||
)
|
||||
span {{chip?.title}}
|
||||
.gradient.h-7.w-11.absolute.right-0(
|
||||
:id="chip?.title+'gradient'",
|
||||
:style="{background: `linear-gradient(270deg, ${chip?.color} 0%, rgba(255, 255, 255, 0.00) 100%)`}"
|
||||
)
|
||||
.info.color-dark-blue.rounded.h-7.px-4(v-if="services.remains > 0") +{{ services.remains }}
|
||||
.rounded.info.color-grey.h-full.cost.flex.items-center.justify-center {{ services.cost }} ₽
|
||||
//.rounded.h-full.services.flex.flex-wrap.gap-1.p-1
|
||||
// .py-2.px-4.color-dark-blue.rounded.h-7.relative(
|
||||
// v-for="chip in services.list",
|
||||
// :key="chip?.title",
|
||||
// :id="chip?.title",
|
||||
// :class="chipClass(chip?.title)"
|
||||
// :style="{'background-color': chip?.color}"
|
||||
// )
|
||||
// span {{chip?.title}}
|
||||
// .gradient.h-7.w-11.absolute.right-0(
|
||||
// :id="chip?.title+'gradient'",
|
||||
// :style="{background: `linear-gradient(270deg, ${chip?.color} 0%, rgba(255, 255, 255, 0.00) 100%)`}"
|
||||
// )
|
||||
// .info.color-dark-blue.rounded.h-7.px-4(v-if="services.remains > 0") +{{ services.remains }}
|
||||
//.rounded.info.color-grey.h-full.cost.flex.items-center.justify-center {{ services.cost }} ₽
|
||||
|
||||
</template>
|
||||
|
||||
@@ -50,7 +50,6 @@ import * as moment from "moment/moment";
|
||||
import { mapState } from "vuex";
|
||||
import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js";
|
||||
import {
|
||||
recordList,
|
||||
recordPreviewConfig,
|
||||
statuses,
|
||||
} from "@/pages/newCalendar/utils/calendarConfig.js";
|
||||
@@ -76,9 +75,10 @@ export default {
|
||||
},
|
||||
...mapState({
|
||||
selectedRecordId: (state) => state.calendar.selectedRecordId,
|
||||
events: (state) => state.calendar.events || [],
|
||||
}),
|
||||
record() {
|
||||
return recordList?.find((elem) => elem.id === this.selectedRecordId);
|
||||
return this.events?.find((elem) => elem.id === this.selectedRecordId);
|
||||
},
|
||||
start() {
|
||||
return moment.parseZone(this.record?.start);
|
||||
@@ -94,29 +94,29 @@ export default {
|
||||
},
|
||||
statusLabel() {
|
||||
return statuses[0].data.find((elem) => elem.value === this.record?.status)
|
||||
.label;
|
||||
?.label;
|
||||
},
|
||||
statusIcon() {
|
||||
return statuses[0].data.find((elem) => elem.value === this.record?.status)
|
||||
.icon;
|
||||
?.icon;
|
||||
},
|
||||
memberData() {
|
||||
return this.record?.member;
|
||||
return this.record?.person;
|
||||
},
|
||||
birthday() {
|
||||
return moment(this.memberData?.birth_date)?.format("MM.DD.YYYY");
|
||||
},
|
||||
services() {
|
||||
let croppedServices = JSON.parse(JSON.stringify(this.record?.services));
|
||||
let remains = this.record?.services?.length - 3;
|
||||
if (remains > 0) croppedServices.length = 3;
|
||||
else remains = 0;
|
||||
return {
|
||||
list: croppedServices,
|
||||
remains: remains,
|
||||
cost: this.record?.services?.reduce((acc, curr) => acc + curr.cost, 0),
|
||||
};
|
||||
},
|
||||
// services() {
|
||||
// let croppedServices = JSON.parse(JSON.stringify(this.record?.services));
|
||||
// let remains = this.record?.services?.length - 3;
|
||||
// if (remains > 0) croppedServices.length = 3;
|
||||
// else remains = 0;
|
||||
// return {
|
||||
// list: croppedServices,
|
||||
// remains: remains,
|
||||
// cost: this.record?.services?.reduce((acc, curr) => acc + curr.cost, 0),
|
||||
// };
|
||||
// },
|
||||
},
|
||||
methods: {
|
||||
hidePreview() {
|
||||
|
||||
@@ -46,7 +46,7 @@ import {
|
||||
convertTime,
|
||||
verifyTime,
|
||||
} from "@/pages/newCalendar/utils/calendarFunctions.js";
|
||||
import { mapState } from "vuex";
|
||||
import { mapState, mapActions } from "vuex";
|
||||
import * as moment from "moment/moment";
|
||||
export default {
|
||||
name: "CalendarWrapper",
|
||||
@@ -150,6 +150,9 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
getEvents: "getEvents",
|
||||
}),
|
||||
changeCurrentTime() {
|
||||
this.currentTime = moment().format("HH:mm:ss");
|
||||
},
|
||||
@@ -236,6 +239,7 @@ export default {
|
||||
this.changeCurrentTime();
|
||||
this.timeCoilInitialization();
|
||||
this.startTimer();
|
||||
this.getEvents();
|
||||
},
|
||||
beforeUnmount() {
|
||||
this.stopTimer();
|
||||
|
||||
@@ -40,6 +40,7 @@ import BaseButton from "@/components/base/BaseButton.vue";
|
||||
import BaseInput from "@/components/base/BaseInput.vue";
|
||||
import BaseInputDate from "@/components/base/BaseInputDate.vue";
|
||||
import { fetchWrapper } from "@/shared/fetchWrapper";
|
||||
import { mapActions } from "vuex";
|
||||
|
||||
export default {
|
||||
name: "CreateEventForm",
|
||||
@@ -56,14 +57,16 @@ export default {
|
||||
return {
|
||||
patient: {},
|
||||
phone: "",
|
||||
birth_date: "",
|
||||
birth_date: {},
|
||||
time: {},
|
||||
patientData: patientData,
|
||||
currentStatus: patientData.statuses.find((e) => e.name === "Не принят"),
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
...mapActions({
|
||||
getEvents: "getEvents",
|
||||
}),
|
||||
createPerson() {
|
||||
alert("crea");
|
||||
},
|
||||
@@ -80,8 +83,10 @@ export default {
|
||||
},
|
||||
medic_id: "a6195732-ac98-4f07-8916-4881eca69b7d",
|
||||
});
|
||||
|
||||
console.log(event);
|
||||
if (event?.id) {
|
||||
await this.getEvents();
|
||||
this.closeForm();
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {},
|
||||
|
||||
@@ -928,7 +928,7 @@ export const recordPreviewConfig = [
|
||||
data: "time",
|
||||
},
|
||||
{
|
||||
title: "Медкарта",
|
||||
title: "Пациент",
|
||||
data: null,
|
||||
},
|
||||
{
|
||||
|
||||
@@ -3,8 +3,8 @@ export function convertTime(str, startIndex, endIndex) {
|
||||
}
|
||||
|
||||
export function trimName(lastName, firstName, patronymic) {
|
||||
let checkedFirstName = firstName !== null ? firstName[0] + ". " : "";
|
||||
let checkedPatronymic = patronymic !== null ? patronymic[0] + "." : "";
|
||||
let checkedFirstName = firstName !== null ? firstName?.[0] + ". " : "";
|
||||
let checkedPatronymic = patronymic !== null ? patronymic?.[0] + "." : "";
|
||||
return `${lastName} ${checkedFirstName}${checkedPatronymic}`;
|
||||
}
|
||||
|
||||
|
||||
@@ -71,7 +71,7 @@ function request(method, url, headers = {}, body, type = "") {
|
||||
return fetch(prepareUrl(url), requestOptions);
|
||||
}
|
||||
|
||||
function get(url, type, headers, attempts = 3) {
|
||||
function get(url, type = "default", headers = {}, attempts = 3) {
|
||||
return handleRequest("GET", url, headers, attempts, null, type);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import * as moment from "moment/moment";
|
||||
import { fetchWrapper } from "@/shared/fetchWrapper";
|
||||
moment.locale("ru");
|
||||
const state = () => ({
|
||||
currentDate: moment(),
|
||||
@@ -11,6 +12,7 @@ const state = () => ({
|
||||
to: moment().clone().endOf("week"),
|
||||
},
|
||||
selectedRecordId: null,
|
||||
events: [],
|
||||
});
|
||||
|
||||
const getters = {};
|
||||
@@ -22,6 +24,13 @@ const actions = {
|
||||
changeSelectedRecordId({ commit }, id) {
|
||||
commit("setSelectedRecordId", id);
|
||||
},
|
||||
getEvents({ commit }) {
|
||||
fetchWrapper.get("events").then((data) => {
|
||||
if (Array.isArray(data)) {
|
||||
commit("setEvents", data);
|
||||
}
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
const mutations = {
|
||||
@@ -31,6 +40,9 @@ const mutations = {
|
||||
setSelectedRecordId(state, id) {
|
||||
state.selectedRecordId = id;
|
||||
},
|
||||
setEvents(state, events) {
|
||||
state.events = events;
|
||||
},
|
||||
};
|
||||
|
||||
export default {
|
||||
|
||||
Reference in New Issue
Block a user