WIP Подтянула данные в форму мед.карты
This commit is contained in:
Daria Golova
@@ -1,33 +1,39 @@
|
||||
<template lang="pug">
|
||||
.wrapper.flex.w-full.relative.mx-2
|
||||
.schedule-wrapper.relative.flex.flex-col.px-6.py-6.h-full.w-full.gap-y-5
|
||||
schedule-header(
|
||||
:start-month="startMonth",
|
||||
:times-shift="timesShift",
|
||||
:change-show-time="changeShowTime",
|
||||
:show-time="showTime"
|
||||
@switch-previous-month="switchPreviousMonth",
|
||||
@switch-next-month="switchNextMonth"
|
||||
)
|
||||
schedule-table(
|
||||
:schedules-employee="fetchSchedulesEmployee",
|
||||
:schedule-list="scheduleList",
|
||||
:serialized="serialized",
|
||||
:buttons="buttons",
|
||||
:start-month="startMonth",
|
||||
:clear-employee="clearEmployee",
|
||||
:show-time="showTime",
|
||||
:clear-select="clearSelect",
|
||||
:select-employee="selectEmployee",
|
||||
@schedule-employee="createScheduleEmployee",
|
||||
@schedules="distributeRequest"
|
||||
)
|
||||
schedule-bar(
|
||||
:buttons="buttons",
|
||||
:times="times",
|
||||
:create-schedules="postCreateSchedules",
|
||||
:delete-schedule="deleteSchedule"
|
||||
)
|
||||
transition(name="schedule", mode="out-in")
|
||||
.flex.justify-center.items-center.w-full(v-if="schedulesDataPresence")
|
||||
base-loader(
|
||||
:width="60",
|
||||
:height="60"
|
||||
)
|
||||
.relative.flex.flex-col.px-6.py-6.h-full.w-full.gap-y-5(v-else)
|
||||
schedule-header(
|
||||
:start-month="startMonth",
|
||||
:times-shift="timesShift",
|
||||
:change-show-time="changeShowTime",
|
||||
:show-time="showTime"
|
||||
@switch-previous-month="switchPreviousMonth",
|
||||
@switch-next-month="switchNextMonth"
|
||||
)
|
||||
schedule-table(
|
||||
:schedules-employee="fetchSchedulesEmployee",
|
||||
:schedule-list="scheduleList",
|
||||
:serialized="serialized",
|
||||
:buttons="buttons",
|
||||
:start-month="startMonth",
|
||||
:clear-employee="clearEmployee",
|
||||
:show-time="showTime",
|
||||
:clear-select="clearSelect",
|
||||
:select-employee="selectEmployee",
|
||||
@schedule-employee="createScheduleEmployee",
|
||||
@schedules="distributeRequest"
|
||||
)
|
||||
schedule-bar(
|
||||
:buttons="buttons",
|
||||
:times="times",
|
||||
:create-schedules="postCreateSchedules",
|
||||
:delete-schedule="deleteSchedule"
|
||||
)
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -36,13 +42,18 @@ import ScheduleHeader from "@/pages/schedule/components/ScheduleHeader.vue";
|
||||
import ScheduleBar from "@/pages/schedule/components/ScheduleBar.vue";
|
||||
import ScheduleTable from "@/pages/schedule/components/ScheduleTable.vue";
|
||||
import { fetchWrapper } from "@/shared/fetchWrapper.js";
|
||||
import BaseLoader from "@/components/Loader/BaseLoader.vue";
|
||||
|
||||
export default {
|
||||
name: "TheSchedule",
|
||||
components: { ScheduleHeader, ScheduleBar, ScheduleTable },
|
||||
components: { ScheduleHeader, ScheduleBar, ScheduleTable, BaseLoader },
|
||||
data() {
|
||||
return {
|
||||
employeeList: [],
|
||||
employeeList: [
|
||||
{
|
||||
initialization: true,
|
||||
},
|
||||
],
|
||||
scheduleList: [],
|
||||
clearEmployee: [],
|
||||
serialized: [],
|
||||
@@ -87,6 +98,9 @@ export default {
|
||||
endMonth() {
|
||||
return this.startMonth.clone().endOf("month");
|
||||
},
|
||||
schedulesDataPresence() {
|
||||
return this.employeeList[0]?.initialization;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
changeShowTime() {
|
||||
@@ -176,7 +190,7 @@ export default {
|
||||
active_flg: true,
|
||||
start_time: this.times.start_time,
|
||||
end_time: this.times.end_time,
|
||||
status: this.buttons.find((e) => e.active).work,
|
||||
status: this.buttons.find((e) => e.active)?.work,
|
||||
};
|
||||
if (this.insideSchedules?.length > 0) {
|
||||
this.postUpdateSchedule();
|
||||
@@ -221,7 +235,7 @@ export default {
|
||||
},
|
||||
deleteSchedule() {
|
||||
let ids = "";
|
||||
if (this.insideSchedules.length > 0) {
|
||||
if (this.insideSchedules?.length > 0) {
|
||||
this.insideSchedules.forEach((e) => (ids += e.id + ","));
|
||||
ids = ids.slice(0, -1);
|
||||
fetchWrapper
|
||||
@@ -266,7 +280,20 @@ export default {
|
||||
overflow: auto
|
||||
border-top-left-radius: 4px
|
||||
border-top-right-radius: 4px
|
||||
|
||||
.schedule-wrapper
|
||||
background-color: var(--default-white)
|
||||
|
||||
.schedule-enter-from
|
||||
opacity: 0
|
||||
transform: translateY(0px)
|
||||
pointer-events: none
|
||||
.schedule-enter-active
|
||||
transition: 0.3s ease
|
||||
.schedule-leave-to
|
||||
opacity: 0
|
||||
transform: translateY(0px)
|
||||
pointer-events: none
|
||||
.schedule-leave-active
|
||||
transition: 0.3s ease
|
||||
.schedule-move
|
||||
transition: 0.3s ease
|
||||
</style>
|
||||
|
||||
@@ -2,13 +2,14 @@
|
||||
.schedule.flex-col(:style="themeCell")
|
||||
.table-header.flex.w-full.pr-2
|
||||
.flex.items-center.justify-center.pl-11(
|
||||
:style="{width: 'calc(25% + 40px)'}"
|
||||
:style="{width: 'calc(25% + 43px)'}"
|
||||
)
|
||||
.text.font-bold Сотрудник
|
||||
.column-wrapper.flex
|
||||
.schedule-column.flex.flex-col.items-center.justify-center.w-11(
|
||||
v-for="day in result",
|
||||
:class="{'column-color': changelColumnColor(day)}",
|
||||
:style="{width: `calc(100% / ${result.length})`}"
|
||||
)
|
||||
.text.flex.font-bold(
|
||||
:style="{opacity: changeOpacity(day)}"
|
||||
@@ -22,18 +23,19 @@
|
||||
.flex.icon-edit
|
||||
.name-employee.flex.justify-center.items-center.cursor-pointer
|
||||
span {{trimOwnerName(schedule.last_name, schedule.first_name, schedule.patronymic)}}
|
||||
.cell.flex.flex-col.items-center.justify-center.w-11.h-11.cursor-pointer(
|
||||
v-for="day in result",
|
||||
:key="day",
|
||||
:id="schedule.id + day",
|
||||
@click="choiceCell(day, schedule.id, schedule); clearSelect(selectEmployee)",
|
||||
:class="choiceState(day, schedule.id)",
|
||||
:style="{backgroundColor: choiceDay(day, schedule.id) ? choiceColor(day, schedule) : ''}"
|
||||
)
|
||||
.flex(
|
||||
:class="{'cell-work': choiceState(day, schedule.id).status, 'show-time': showTime}"
|
||||
) {{choiceDay(day, schedule.id) ? choiceWorks(day, schedule) : ''}}
|
||||
.schedule-select.flex.w-full.pr-2(v-if="clearEmployee")
|
||||
.row.flex
|
||||
.cell.flex.flex-col.items-center.justify-center.w-11.h-11.cursor-pointer.transition(
|
||||
v-for="day in result",
|
||||
:key="day",
|
||||
:id="schedule.id + day",
|
||||
@click="choiceCell(day, schedule.id, schedule); clearSelect(selectEmployee)",
|
||||
:class="choiceState(day, schedule.id)",
|
||||
:style="{backgroundColor: choiceDay(day, schedule.id) ? choiceColor(day, schedule) : '', width: `calc(100% / ${result.length})`}"
|
||||
)
|
||||
.flex(
|
||||
:class="{'cell-work': choiceState(day, schedule.id).status, 'show-time': showTime}"
|
||||
) {{choiceDay(day, schedule.id) ? choiceWorks(day, schedule) : ''}}
|
||||
.schedule-select.flex.w-full(v-if="clearEmployee")
|
||||
.edit.flex.items-center.justify-center.h-11.w-11(v-if="selectEmployee.label")
|
||||
.flex.icon-edit(v-if="selectEmployee.label")
|
||||
//- base-button(
|
||||
@@ -54,14 +56,16 @@
|
||||
:style="{border: 'none', justifyContent: 'center'}"
|
||||
)
|
||||
.flex.justify-center(v-else) {{selectEmployee.label}}
|
||||
.cell.flex.flex-col.items-center.justify-center.w-11.h-11.cursor-pointer(
|
||||
v-if="selectEmployee.label",
|
||||
v-for="day in result",
|
||||
:key="day",
|
||||
:id="selectEmployee.id + day",
|
||||
@click="choiceCell(day, selectEmployee.id)",
|
||||
:class="choiceState(day, selectEmployee.id)"
|
||||
)
|
||||
.row.flex
|
||||
.cell.flex.flex-col.items-center.justify-center.w-11.h-11.cursor-pointer(
|
||||
v-if="selectEmployee.label",
|
||||
v-for="day in result",
|
||||
:key="day",
|
||||
:id="selectEmployee.id + day",
|
||||
@click="choiceCell(day, selectEmployee.id)",
|
||||
:class="choiceState(day, selectEmployee.id)",
|
||||
:style="{width: `calc(100% / ${result.length})`}"
|
||||
)
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -302,6 +306,8 @@ export default {
|
||||
.schedule-wrapper
|
||||
overflow-y: scroll
|
||||
max-height: 351px
|
||||
&::-webkit-scrollbar-track
|
||||
border-radius: 0
|
||||
|
||||
.schedule-body
|
||||
&:hover
|
||||
@@ -315,12 +321,14 @@ export default {
|
||||
border-top-right-radius: 2px
|
||||
|
||||
.schedule-select
|
||||
border-right: 8px solid var(--bg-ligth-blue-color)
|
||||
&:hover
|
||||
background-color: var(--border-light-grey-color-1)
|
||||
|
||||
.column-wrapper
|
||||
overflow: auto
|
||||
overflow-x: hidden
|
||||
width: calc(75% - 44px)
|
||||
|
||||
.column-color
|
||||
background-color: var(--bg-white-color-1)
|
||||
@@ -332,6 +340,9 @@ export default {
|
||||
border-right: 1.5px solid var(--border-light-grey-color-1)
|
||||
border-bottom: 1.5px solid var(--border-light-grey-color-1)
|
||||
|
||||
.row
|
||||
width: calc(75% - 44px)
|
||||
|
||||
.select-name
|
||||
width: 25%
|
||||
border-right: 1.5px solid var(--border-light-grey-color-1)
|
||||
@@ -346,6 +357,8 @@ export default {
|
||||
.cell
|
||||
border-right: 1.5px solid var(--border-light-grey-color-1)
|
||||
border-bottom: 1.5px solid var(--border-light-grey-color-1)
|
||||
&:last-child
|
||||
border-right: none
|
||||
|
||||
.show-time
|
||||
text-align: center
|
||||
|
||||
Reference in New Issue
Block a user