[Pinia] Use pinia for schedule
This commit is contained in:
parent
e347129ba9
commit
76978e8883
|
@ -67,17 +67,15 @@
|
||||||
import { defineComponent, ref, onBeforeMount, computed } from 'vue';
|
import { defineComponent, ref, onBeforeMount, computed } from 'vue';
|
||||||
import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
|
import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
|
||||||
import Job from './Job.vue';
|
import Job from './Job.vue';
|
||||||
import { mapGetters, useStore } from 'vuex';
|
|
||||||
import { StateInterface } from 'src/store';
|
|
||||||
import { date } from 'quasar';
|
import { date } from 'quasar';
|
||||||
|
import { useScheduleStore } from '../../store';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'CreateEvent',
|
name: 'CreateEvent',
|
||||||
components: { IsoDateInput, Job },
|
components: { IsoDateInput, Job },
|
||||||
setup() {
|
setup() {
|
||||||
const store = useStore<StateInterface>();
|
const store = useScheduleStore();
|
||||||
const scheduleGetters = mapGetters('schedule', ['eventTypes']);
|
const eventtypes = computed(() => store.eventTypes);
|
||||||
const eventtypes = computed(() => <FG.EventType[]>scheduleGetters.eventTypes());
|
|
||||||
const jobDeleteDisabled = computed(() => event.value.jobs.length < 2);
|
const jobDeleteDisabled = computed(() => event.value.jobs.length < 2);
|
||||||
|
|
||||||
const newJob = ref<FG.Job>(({
|
const newJob = ref<FG.Job>(({
|
||||||
|
@ -97,8 +95,8 @@ export default defineComponent({
|
||||||
} as FG.Event);
|
} as FG.Event);
|
||||||
|
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => {
|
||||||
void store.dispatch('schedule/getEventTypes');
|
void store.getEventTypes();
|
||||||
void store.dispatch('schedule/getJobTypes');
|
void store.getJobTypes();
|
||||||
});
|
});
|
||||||
|
|
||||||
function setStart(data: { job: FG.Job; value: Date }) {
|
function setStart(data: { job: FG.Job; value: Date }) {
|
||||||
|
@ -137,11 +135,14 @@ export default defineComponent({
|
||||||
event.value.jobs.splice(index, 1);
|
event.value.jobs.splice(index, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
function save() {
|
async function save() {
|
||||||
console.log('Event:', event);
|
console.log('Event:', event);
|
||||||
store.dispatch('schedule/addEvent', event.value).catch((error) => {
|
try {
|
||||||
console.warn(error);
|
await store.addEvent(event.value);
|
||||||
});
|
reset();
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function reset() {
|
function reset() {
|
||||||
|
|
|
@ -46,30 +46,22 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, ref, computed, onBeforeMount } from 'vue';
|
import { defineComponent, ref, computed, onBeforeMount } from 'vue';
|
||||||
import { mapGetters, Store, useStore } from 'vuex';
|
import { useScheduleStore } from '../../store';
|
||||||
import { StateInterface } from 'src/store';
|
|
||||||
import { EventType } from '../../store/schedule';
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'EventTypes',
|
name: 'EventTypes',
|
||||||
components: {},
|
components: {},
|
||||||
setup() {
|
setup() {
|
||||||
//const store = <Store<StateInterface>>root.$store;
|
const store = useScheduleStore();
|
||||||
const store = useStore<Store<StateInterface>>();
|
|
||||||
const scheduleGetters = mapGetters('schedule', ['eventTypes']);
|
|
||||||
const newEventType = ref('');
|
const newEventType = ref('');
|
||||||
const edittype = ref(false);
|
const edittype = ref(false);
|
||||||
const emptyEvent: EventType = { id: -1, name: '' };
|
const emptyEvent: FG.EventType = { id: -1, name: '' };
|
||||||
const actualEvent = ref(emptyEvent);
|
const actualEvent = ref(emptyEvent);
|
||||||
const newEventName = ref('');
|
const newEventName = ref('');
|
||||||
|
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => store.getEventTypes());
|
||||||
void store.dispatch('schedule/getEventTypes').then(() => {
|
|
||||||
console.log('eventTypes:', rows);
|
|
||||||
});
|
|
||||||
console.log(store);
|
|
||||||
});
|
|
||||||
|
|
||||||
const rows = computed(() => <FG.EventType[]>scheduleGetters.eventTypes());
|
const rows = computed(() => store.eventTypes);
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{
|
{
|
||||||
|
@ -87,26 +79,23 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
function addType() {
|
async function addType() {
|
||||||
void store.dispatch('schedule/addEventType', { name: newEventType.value });
|
await store.addEventType(newEventType.value);
|
||||||
|
// if null then conflict with name
|
||||||
newEventType.value = '';
|
newEventType.value = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
function editType(event: EventType) {
|
function editType(event: FG.EventType) {
|
||||||
edittype.value = true;
|
edittype.value = true;
|
||||||
actualEvent.value = event;
|
actualEvent.value = event;
|
||||||
}
|
}
|
||||||
|
|
||||||
function saveChanges() {
|
async function saveChanges() {
|
||||||
void store
|
try {
|
||||||
.dispatch('schedule/changeEventTypeName', {
|
await store.renameEventType(actualEvent.value.id, newEventName.value);
|
||||||
id: actualEvent.value.id,
|
} finally {
|
||||||
name: newEventName.value,
|
|
||||||
oldname: actualEvent.value.name,
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
discardChanges();
|
discardChanges();
|
||||||
});
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function discardChanges() {
|
function discardChanges() {
|
||||||
|
@ -115,9 +104,10 @@ export default defineComponent({
|
||||||
edittype.value = false;
|
edittype.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
function deleteType(id: number) {
|
async function deleteType(id: number) {
|
||||||
void store.dispatch('schedule/removeEventType', id);
|
await store.removeEventType(id);
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
columns,
|
columns,
|
||||||
rows,
|
rows,
|
||||||
|
|
|
@ -62,9 +62,9 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, computed, ref, PropType } from 'vue';
|
|
||||||
import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
|
import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
|
||||||
import { mapGetters } from 'vuex';
|
import { defineComponent, computed, ref, onBeforeMount, PropType } from 'vue';
|
||||||
|
import { useScheduleStore } from '../../store';
|
||||||
import { date } from 'quasar';
|
import { date } from 'quasar';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
@ -86,8 +86,12 @@ export default defineComponent({
|
||||||
'set-required': (r: number) => isFinite(r),
|
'set-required': (r: number) => isFinite(r),
|
||||||
},
|
},
|
||||||
setup(props, { emit }) {
|
setup(props, { emit }) {
|
||||||
const scheduleGetters = mapGetters('schedule', ['jobTypes']);
|
const store = useScheduleStore();
|
||||||
const jobtypes = computed(() => <FG.JobType[]>scheduleGetters.jobTypes());
|
|
||||||
|
onBeforeMount(() => store.getJobTypes());
|
||||||
|
|
||||||
|
const jobtypes = computed(() => store.jobTypes);
|
||||||
|
const refreshKey = ref<number>(0);
|
||||||
|
|
||||||
function setStart(value: Date) {
|
function setStart(value: Date) {
|
||||||
emit('set-start', value);
|
emit('set-start', value);
|
||||||
|
@ -126,8 +130,6 @@ export default defineComponent({
|
||||||
return props.job.start < new Date(val) || 'Ende muss hinter dem Start liegen';
|
return props.job.start < new Date(val) || 'Ende muss hinter dem Start liegen';
|
||||||
}
|
}
|
||||||
|
|
||||||
const refreshKey = ref(0);
|
|
||||||
|
|
||||||
function refresh() {
|
function refresh() {
|
||||||
refreshKey.value += 1;
|
refreshKey.value += 1;
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,27 +46,22 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, ref, computed, onBeforeMount } from 'vue';
|
import { defineComponent, ref, computed, onBeforeMount } from 'vue';
|
||||||
import { mapGetters, Store, useStore } from 'vuex';
|
import { useScheduleStore } from '../../store';
|
||||||
import { StateInterface } from 'src/store';
|
|
||||||
import { JobType } from '../../store/schedule';
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'JobTypes',
|
name: 'JobTypes',
|
||||||
components: {},
|
components: {},
|
||||||
setup() {
|
setup() {
|
||||||
//const store = <Store<StateInterface>>root.$store;
|
const store = useScheduleStore();
|
||||||
const store = useStore<Store<StateInterface>>();
|
|
||||||
const scheduleGetters = mapGetters('schedule', ['jobTypes']);
|
|
||||||
const newJob = ref('');
|
const newJob = ref('');
|
||||||
const edittype = ref(false);
|
const edittype = ref(false);
|
||||||
const emptyJob: JobType = { id: -1, name: '' };
|
const emptyJob: FG.JobType = { id: -1, name: '' };
|
||||||
const actualJob = ref(emptyJob);
|
const actualJob = ref(emptyJob);
|
||||||
const newJobName = ref('');
|
const newJobName = ref('');
|
||||||
|
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => store.getJobTypes());
|
||||||
void store.dispatch('schedule/getJobTypes');
|
|
||||||
});
|
|
||||||
|
|
||||||
const rows = computed(() => <FG.JobType[]>scheduleGetters.jobTypes());
|
const rows = computed(() => store.jobTypes);
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{
|
{
|
||||||
|
@ -84,22 +79,22 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
function addType() {
|
async function addType() {
|
||||||
void store.dispatch('schedule/addJobType', { name: newJob.value });
|
await store.addJobType(newJob.value);
|
||||||
newJob.value = '';
|
newJob.value = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
function editType(job: JobType) {
|
function editType(job: FG.JobType) {
|
||||||
edittype.value = true;
|
edittype.value = true;
|
||||||
actualJob.value = job;
|
actualJob.value = job;
|
||||||
}
|
}
|
||||||
|
|
||||||
function saveChanges() {
|
async function saveChanges() {
|
||||||
void store
|
try {
|
||||||
.dispatch('schedule/changeJobTypeName', { id: actualJob.value.id, name: newJobName.value })
|
await store.renameJobType(actualJob.value.id, newJobName.value);
|
||||||
.finally(() => {
|
} finally {
|
||||||
discardChanges();
|
discardChanges();
|
||||||
});
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function discardChanges() {
|
function discardChanges() {
|
||||||
|
@ -109,8 +104,9 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
|
|
||||||
function deleteType(id: number) {
|
function deleteType(id: number) {
|
||||||
void store.dispatch('schedule/removeJobType', id);
|
void store.removeJobType(id);
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
columns,
|
columns,
|
||||||
rows,
|
rows,
|
||||||
|
|
|
@ -65,9 +65,8 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, onBeforeMount, ref } from 'vue';
|
import { defineComponent, onBeforeMount, ref } from 'vue';
|
||||||
import { useStore } from 'vuex';
|
import { useScheduleStore } from '../../store';
|
||||||
import { ScheduleInterface } from '../../store/schedule';
|
|
||||||
import Eventslot from './slots/EventSlot.vue';
|
import Eventslot from './slots/EventSlot.vue';
|
||||||
import { date } from 'quasar';
|
import { date } from 'quasar';
|
||||||
|
|
||||||
|
@ -76,25 +75,23 @@ export default defineComponent({
|
||||||
components: { Eventslot },
|
components: { Eventslot },
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
const store = useStore();
|
const store = useScheduleStore();
|
||||||
// That looks evil
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
||||||
const state = computed(() => <ScheduleInterface>store.state.schedule);
|
|
||||||
const selectedDate = ref(date.formatDate(new Date(), 'YYYY-MM-DD'));
|
const selectedDate = ref(date.formatDate(new Date(), 'YYYY-MM-DD'));
|
||||||
const proxyDate = ref('');
|
const proxyDate = ref('');
|
||||||
const calendar = ref();
|
const calendar = ref();
|
||||||
const calendarView = 'week-agenda';
|
const calendarView = 'week-agenda';
|
||||||
const events2 = computed(() => {
|
const events = ref<Agendas>({});
|
||||||
|
|
||||||
|
interface Agendas {
|
||||||
|
[index: number]: FG.Event[];
|
||||||
|
}
|
||||||
|
|
||||||
|
onBeforeMount(async () => {
|
||||||
let agenda: Agendas = {};
|
let agenda: Agendas = {};
|
||||||
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
|
|
||||||
console.log('Hier Passiert was');
|
console.log('Hier Passiert was');
|
||||||
state.value.events
|
const list = await store.getEvents({ from: new Date(selectedDate.value) });
|
||||||
.filter(event => {
|
if (list)
|
||||||
const thisWeek = date.formatDate(new Date(selectedDate.value), 'w');
|
list.forEach((event) => {
|
||||||
console.log(thisWeek, date.formatDate(event.start, 'w'));
|
|
||||||
return date.formatDate(event.start, 'w') == thisWeek;
|
|
||||||
})
|
|
||||||
.forEach(event => {
|
|
||||||
let day = event.start.getDay();
|
let day = event.start.getDay();
|
||||||
console.log('event', event, day, !agenda[day]);
|
console.log('event', event, day, !agenda[day]);
|
||||||
if (!agenda[day]) {
|
if (!agenda[day]) {
|
||||||
|
@ -103,18 +100,11 @@ export default defineComponent({
|
||||||
agenda[day].push(event);
|
agenda[day].push(event);
|
||||||
});
|
});
|
||||||
console.log('finish agenda:', agenda);
|
console.log('finish agenda:', agenda);
|
||||||
return agenda;
|
events.value = agenda;
|
||||||
});
|
});
|
||||||
|
|
||||||
interface Agendas {
|
|
||||||
[index: number]: FG.Event[];
|
|
||||||
}
|
|
||||||
|
|
||||||
onBeforeMount(() => {
|
|
||||||
void store.dispatch('schedule/getEvents');
|
|
||||||
});
|
|
||||||
function getAgenda(day: { weekday: string }) {
|
function getAgenda(day: { weekday: string }) {
|
||||||
return events2.value[parseInt(day.weekday, 10)];
|
return events.value[parseInt(day.weekday, 10)];
|
||||||
}
|
}
|
||||||
|
|
||||||
function calendarNext() {
|
function calendarNext() {
|
||||||
|
@ -148,8 +138,8 @@ export default defineComponent({
|
||||||
'September',
|
'September',
|
||||||
'Oktober',
|
'Oktober',
|
||||||
'November',
|
'November',
|
||||||
'Dezember'
|
'Dezember',
|
||||||
]
|
],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -164,16 +154,16 @@ export default defineComponent({
|
||||||
asMonth,
|
asMonth,
|
||||||
calendar,
|
calendar,
|
||||||
selectedDate,
|
selectedDate,
|
||||||
events2,
|
events,
|
||||||
getAgenda,
|
getAgenda,
|
||||||
calendarNext,
|
calendarNext,
|
||||||
calendarPrev,
|
calendarPrev,
|
||||||
updateProxy,
|
updateProxy,
|
||||||
saveNewSelectedDate,
|
saveNewSelectedDate,
|
||||||
proxyDate,
|
proxyDate,
|
||||||
calendarView
|
calendarView,
|
||||||
};
|
};
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -68,10 +68,11 @@
|
||||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||||
import { defineComponent, ref, onBeforeMount, PropType } from 'vue';
|
import { defineComponent, ref, onBeforeMount, PropType } from 'vue';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { useStore } from 'vuex';
|
import { date, Notify } from 'quasar';
|
||||||
import { StateInterface } from 'src/store';
|
import { asHour } from 'src/utils/datetime';
|
||||||
import { date } from 'quasar';
|
import { useUserStore } from 'src/plugins/user/store';
|
||||||
import { asHour } from '../../../../../utils/datetime';
|
import { useMainStore } from 'src/store';
|
||||||
|
import { useScheduleStore } from 'src/plugins/schedule/store';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'Eventslot',
|
name: 'Eventslot',
|
||||||
|
@ -91,72 +92,72 @@ export default defineComponent({
|
||||||
},
|
},
|
||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
const store = useStore<StateInterface>();
|
const store = useScheduleStore();
|
||||||
const state = store.state.users;
|
const mainStore = useMainStore();
|
||||||
|
const userStore = useUserStore();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const availableUsers = null;
|
const availableUsers = null;
|
||||||
const refreshKey = ref<number>(0);
|
const refreshKey = ref<number>(0);
|
||||||
|
|
||||||
const users = ref(state.users);
|
onBeforeMount(async () => userStore.getUsers());
|
||||||
|
|
||||||
function refresh() {
|
function refresh() {
|
||||||
router.go(0);
|
router.go(0);
|
||||||
refreshKey.value += 1;
|
refreshKey.value += 1;
|
||||||
}
|
}
|
||||||
onBeforeMount(() => {
|
|
||||||
store.dispatch('user/getUsers').catch((error) => {
|
|
||||||
console.warn(error);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
function isUserEnrolled(job: FG.Job) {
|
function isUserEnrolled(job: FG.Job) {
|
||||||
return (
|
return (
|
||||||
job.services.filter((service) => service.userid == state.currentUser?.userid).length >= 1
|
job.services.findIndex((service) => service.userid == mainStore.currentUser.userid) >= 0
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function jobFull(job: FG.Job) {
|
function jobFull(job: FG.Job) {
|
||||||
console.log('jobFull', job.services.length >= job.required_services);
|
console.log('jobFull', job.services.length >= job.required_services);
|
||||||
return job.services.length >= job.required_services;
|
return job.services.length >= job.required_services;
|
||||||
}
|
}
|
||||||
|
|
||||||
function userDisplay(userid: string) {
|
function userDisplay(userid: string) {
|
||||||
return state.users.find((user) => (user.userid = userid))?.display_name;
|
return userStore.users.find((user) => (user.userid = userid))?.display_name;
|
||||||
}
|
}
|
||||||
|
|
||||||
function enrollForJob(job: FG.Job) {
|
async function enrollForJob(job: FG.Job) {
|
||||||
console.log(job.services);
|
|
||||||
if (state.currentUser) {
|
|
||||||
const newService: FG.Service = {
|
const newService: FG.Service = {
|
||||||
userid: state.currentUser?.userid,
|
userid: mainStore.currentUser.userid,
|
||||||
value: 1,
|
value: 1,
|
||||||
};
|
};
|
||||||
|
try {
|
||||||
const newUserService = { user: newService };
|
await store.updateEvent(props.event.id, job.id, { user: newService });
|
||||||
const UpdateInformation = {
|
} catch (error) {
|
||||||
eventId: props.event.id,
|
|
||||||
JobId: job.id,
|
|
||||||
service: newUserService,
|
|
||||||
};
|
|
||||||
void store.dispatch('schedule/updateEvent', UpdateInformation).catch((error) => {
|
|
||||||
console.warn(error);
|
console.warn(error);
|
||||||
|
Notify.create({
|
||||||
|
group: false,
|
||||||
|
type: 'negative',
|
||||||
|
message: 'Fehler beim Eintragen als Dienst',
|
||||||
|
timeout: 10000,
|
||||||
|
progress: true,
|
||||||
|
actions: [{ icon: 'mdi-close', color: 'white' }],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
refresh();
|
refresh();
|
||||||
}
|
}
|
||||||
function signOutFromJob(job: FG.Job) {
|
async function signOutFromJob(job: FG.Job) {
|
||||||
console.log(job.services);
|
|
||||||
if (state.currentUser) {
|
|
||||||
const newService: FG.Service = {
|
const newService: FG.Service = {
|
||||||
userid: state.currentUser?.userid,
|
userid: mainStore.currentUser.userid,
|
||||||
value: -1,
|
value: -1,
|
||||||
};
|
};
|
||||||
|
|
||||||
const newUserService = { user: newService };
|
try {
|
||||||
const UpdateInformation = {
|
await store.updateEvent(props.event.id, job.id, { user: newService });
|
||||||
eventId: props.event.id,
|
} catch (error) {
|
||||||
JobId: job.id,
|
|
||||||
service: newUserService,
|
|
||||||
};
|
|
||||||
void store.dispatch('schedule/updateEvent', UpdateInformation).catch((error) => {
|
|
||||||
console.warn(error);
|
console.warn(error);
|
||||||
|
Notify.create({
|
||||||
|
group: false,
|
||||||
|
type: 'negative',
|
||||||
|
message: 'Fehler beim Austragen als Dienst',
|
||||||
|
timeout: 10000,
|
||||||
|
progress: true,
|
||||||
|
actions: [{ icon: 'mdi-close', color: 'white' }],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
refresh();
|
refresh();
|
||||||
|
@ -166,8 +167,6 @@ export default defineComponent({
|
||||||
refreshKey,
|
refreshKey,
|
||||||
availableUsers,
|
availableUsers,
|
||||||
enrollForJob,
|
enrollForJob,
|
||||||
state,
|
|
||||||
users,
|
|
||||||
isUserEnrolled,
|
isUserEnrolled,
|
||||||
signOutFromJob,
|
signOutFromJob,
|
||||||
jobFull,
|
jobFull,
|
||||||
|
|
|
@ -24,24 +24,17 @@
|
||||||
import { computed, defineComponent } from 'vue';
|
import { computed, defineComponent } from 'vue';
|
||||||
import EssentialLink from 'src/components/navigation/EssentialLink.vue';
|
import EssentialLink from 'src/components/navigation/EssentialLink.vue';
|
||||||
import mainRoutes from 'src/plugins/schedule/routes';
|
import mainRoutes from 'src/plugins/schedule/routes';
|
||||||
import { mapGetters } from 'vuex';
|
|
||||||
import setLoadingBar from 'src/utils/loading';
|
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
// name: 'PageName'
|
// name: 'PageName'
|
||||||
components: { EssentialLink },
|
components: { EssentialLink },
|
||||||
setup() {
|
setup() {
|
||||||
const balanceGetters = mapGetters('balance', ['loading']);
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const loading = computed(() => {
|
|
||||||
return balanceGetters.loading() > 0;
|
|
||||||
});
|
|
||||||
const checkMain = computed(() => {
|
const checkMain = computed(() => {
|
||||||
return route.matched.length == 2;
|
return route.matched.length == 2;
|
||||||
});
|
});
|
||||||
|
|
||||||
setLoadingBar(loading);
|
|
||||||
|
|
||||||
return { checkMain, mainRoutes };
|
return { checkMain, mainRoutes };
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,9 +1,6 @@
|
||||||
import { Module } from 'vuex';
|
|
||||||
import { defineAsyncComponent } from 'vue';
|
import { defineAsyncComponent } from 'vue';
|
||||||
import mainRoutes from './routes';
|
import mainRoutes from './routes';
|
||||||
import { FG_Plugin } from 'src/plugins';
|
import { FG_Plugin } from 'src/plugins';
|
||||||
import { StateInterface } from 'src/store';
|
|
||||||
import store, { ScheduleInterface } from './store/schedule';
|
|
||||||
|
|
||||||
const plugin: FG_Plugin.Plugin = {
|
const plugin: FG_Plugin.Plugin = {
|
||||||
name: 'Schedule',
|
name: 'Schedule',
|
||||||
|
@ -11,7 +8,6 @@ const plugin: FG_Plugin.Plugin = {
|
||||||
requiredModules: ['User'],
|
requiredModules: ['User'],
|
||||||
requiredBackendModules: ['schedule'],
|
requiredBackendModules: ['schedule'],
|
||||||
version: '0.0.1',
|
version: '0.0.1',
|
||||||
store: new Map<string, Module<ScheduleInterface, StateInterface>>([['schedule', store]]),
|
|
||||||
widgets: [
|
widgets: [
|
||||||
{
|
{
|
||||||
priority: 0,
|
priority: 0,
|
||||||
|
|
|
@ -0,0 +1,125 @@
|
||||||
|
import { api } from 'src/boot/axios';
|
||||||
|
import { AxiosError } from 'axios';
|
||||||
|
import { defineStore } from 'pinia';
|
||||||
|
|
||||||
|
interface UserService {
|
||||||
|
user: FG.Service;
|
||||||
|
}
|
||||||
|
|
||||||
|
function fixEvent(event: FG.Event) {
|
||||||
|
event.start = new Date(event.start);
|
||||||
|
event.end = new Date(event.end);
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useScheduleStore = defineStore({
|
||||||
|
id: 'schedule',
|
||||||
|
|
||||||
|
state: () => ({
|
||||||
|
jobTypes: [] as FG.JobType[],
|
||||||
|
eventTypes: [] as FG.EventType[],
|
||||||
|
}),
|
||||||
|
|
||||||
|
getters: {},
|
||||||
|
|
||||||
|
actions: {
|
||||||
|
async getJobTypes() {
|
||||||
|
try {
|
||||||
|
const { data } = await api.get<FG.JobType[]>('/schedule/job-types');
|
||||||
|
this.jobTypes = data;
|
||||||
|
return this.jobTypes;
|
||||||
|
} catch (error) {
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async addJobType(name: string) {
|
||||||
|
await api.post<FG.JobType>('/schedule/job-types', { name: name });
|
||||||
|
//TODO: HAndle new JT
|
||||||
|
},
|
||||||
|
|
||||||
|
async removeJobType(id: number) {
|
||||||
|
await api.delete(`/schedule/job-types/${id}`);
|
||||||
|
//Todo Handle delete JT
|
||||||
|
},
|
||||||
|
|
||||||
|
async renameJobType(id: number, newName: string) {
|
||||||
|
await api.put(`/schedule/job-types/${id}`, { name: newName });
|
||||||
|
// TODO handle rename
|
||||||
|
},
|
||||||
|
|
||||||
|
async getEventTypes() {
|
||||||
|
try {
|
||||||
|
const { data } = await api.get<FG.EventType[]>('/schedule/event-types');
|
||||||
|
this.eventTypes = data;
|
||||||
|
} catch (error) {
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/** Add new EventType
|
||||||
|
*
|
||||||
|
* @param name Name of new EventType
|
||||||
|
* @returns EventType object or null if name already exists
|
||||||
|
* @throws Exception if requests fails because of an other reason
|
||||||
|
*/
|
||||||
|
async addEventType(name: string) {
|
||||||
|
try {
|
||||||
|
const { data } = await api.post<FG.EventType>('/schedule/event-types', { name: name });
|
||||||
|
return data;
|
||||||
|
} catch (error) {
|
||||||
|
if ('response' in error) {
|
||||||
|
const ae = <AxiosError>error;
|
||||||
|
if (ae.response && ae.response.status == 409 /* CONFLICT */) return null;
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async removeEventType(id: number) {
|
||||||
|
await api.delete(`/schedule/event-types/${id}`);
|
||||||
|
// TODO handle delete
|
||||||
|
},
|
||||||
|
|
||||||
|
async renameEventType(id: number, newName: string) {
|
||||||
|
try {
|
||||||
|
await api.put(`/schedule/event-types/${id}`, { name: newName });
|
||||||
|
// TODO handle rename
|
||||||
|
return true;
|
||||||
|
} catch (error) {
|
||||||
|
if ('response' in error) {
|
||||||
|
const ae = <AxiosError>error;
|
||||||
|
if (ae.response && ae.response.status == 409 /* CONFLICT */) return false;
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async getEvents(filter: { from?: Date; to?: Date } | undefined = undefined) {
|
||||||
|
try {
|
||||||
|
const { data } = await api.get<FG.Event[]>('/schedule/events', { params: filter });
|
||||||
|
data.forEach((element) => fixEvent(element));
|
||||||
|
return data;
|
||||||
|
} catch (error) {
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async updateEvent(eventId: number, jobId: number, service: FG.Service | UserService) {
|
||||||
|
try {
|
||||||
|
const { data } = await api.put<FG.Event>(
|
||||||
|
`/schedule/events/${eventId}/jobs/${jobId}`,
|
||||||
|
service
|
||||||
|
);
|
||||||
|
fixEvent(data);
|
||||||
|
return data;
|
||||||
|
} catch (error) {
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async addEvent(event: FG.Event) {
|
||||||
|
const { data } = await api.post<FG.Event>('/schedule/events', event);
|
||||||
|
return data;
|
||||||
|
//TODO: Handle add event}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
|
@ -1,245 +0,0 @@
|
||||||
import { Module, MutationTree, ActionTree, GetterTree } from 'vuex';
|
|
||||||
import { StateInterface } from 'src/store';
|
|
||||||
import { axios } from 'src/boot/axios';
|
|
||||||
import { AxiosResponse } from 'axios';
|
|
||||||
|
|
||||||
export interface JobType {
|
|
||||||
id: number;
|
|
||||||
name: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface EventType {
|
|
||||||
id: number;
|
|
||||||
name: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ScheduleInterface {
|
|
||||||
jobTypes: JobType[];
|
|
||||||
eventTypes: EventType[];
|
|
||||||
events: FG.Event[];
|
|
||||||
}
|
|
||||||
|
|
||||||
const state: ScheduleInterface = {
|
|
||||||
jobTypes: [],
|
|
||||||
eventTypes: [],
|
|
||||||
events: [],
|
|
||||||
};
|
|
||||||
|
|
||||||
interface Event {
|
|
||||||
start: Date;
|
|
||||||
end?: Date;
|
|
||||||
description: string;
|
|
||||||
type: EventType;
|
|
||||||
jobs: Job[];
|
|
||||||
}
|
|
||||||
|
|
||||||
interface Job {
|
|
||||||
id: number;
|
|
||||||
start: Date | null;
|
|
||||||
end?: Date | null;
|
|
||||||
comment: string;
|
|
||||||
type: FG.JobType | null;
|
|
||||||
services: Array<FG.Service>;
|
|
||||||
required_services: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
const mutations: MutationTree<ScheduleInterface> = {
|
|
||||||
setJobTypes(state, jobTypes: JobType[]) {
|
|
||||||
state.jobTypes = jobTypes;
|
|
||||||
},
|
|
||||||
addJobType(state, jobType: JobType) {
|
|
||||||
state.jobTypes.unshift(jobType);
|
|
||||||
},
|
|
||||||
removeJobType(state, id: number) {
|
|
||||||
const index = state.jobTypes.findIndex((item) => item.id == id);
|
|
||||||
state.jobTypes.splice(index, 1);
|
|
||||||
},
|
|
||||||
setJobType(state, jobType: JobType) {
|
|
||||||
const _jobtype = state.jobTypes.find((item) => item.id == jobType.id);
|
|
||||||
if (_jobtype) {
|
|
||||||
_jobtype.name = jobType.name;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
setEventTypes(state, eventTypes: EventType[]) {
|
|
||||||
state.eventTypes = eventTypes;
|
|
||||||
},
|
|
||||||
addEventType(state, eventType: EventType) {
|
|
||||||
state.eventTypes.unshift(eventType);
|
|
||||||
},
|
|
||||||
removeEventType(state, id: number) {
|
|
||||||
const index = state.eventTypes.findIndex((item) => item.id == id);
|
|
||||||
state.eventTypes.splice(index, 1);
|
|
||||||
},
|
|
||||||
setEventType(state, eventType: EventType) {
|
|
||||||
const _eventtype = state.eventTypes.find((item) => item.id == eventType.id);
|
|
||||||
if (_eventtype) {
|
|
||||||
_eventtype.name = eventType.name;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
addEvent(state, event: FG.Event) {
|
|
||||||
state.events.unshift(event);
|
|
||||||
},
|
|
||||||
setEvents(state, events: FG.Event[]) {
|
|
||||||
state.events = events;
|
|
||||||
},
|
|
||||||
updateEvent(state, event: FG.Event) {
|
|
||||||
/*let eventToChange = state.events.find(ev => ev.id == event.id);
|
|
||||||
eventToChange = event; */
|
|
||||||
const index = state.events.findIndex((ev) => ev.id == event.id);
|
|
||||||
if (index > -1) {
|
|
||||||
state.events[index] = event;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
const actions: ActionTree<ScheduleInterface, StateInterface> = {
|
|
||||||
getJobTypes({ commit }) {
|
|
||||||
axios
|
|
||||||
.get('/schedule/job-types')
|
|
||||||
.then((response: AxiosResponse<JobType[]>) => {
|
|
||||||
console.log('action:', response.data);
|
|
||||||
commit('setJobTypes', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
addJobType({ commit }, data) {
|
|
||||||
axios
|
|
||||||
.post('/schedule/job-types', data)
|
|
||||||
.then((response: AxiosResponse<JobType>) => {
|
|
||||||
commit('addJobType', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
removeJobType({ commit }, data: number) {
|
|
||||||
axios
|
|
||||||
.delete(`/schedule/job-types/${data}`)
|
|
||||||
.then(() => {
|
|
||||||
commit('removeJobType', data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
changeJobTypeName({ commit }, jobtype: JobType) {
|
|
||||||
axios
|
|
||||||
.put(`/schedule/job-types/${jobtype.id}`, jobtype)
|
|
||||||
.then(() => {
|
|
||||||
commit('setJobType', jobtype);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
getEventTypes({ commit }) {
|
|
||||||
axios
|
|
||||||
.get('/schedule/event-types')
|
|
||||||
.then((response: AxiosResponse<EventType[]>) => {
|
|
||||||
console.log('action:', response.data);
|
|
||||||
commit('setEventTypes', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
addEventType({ commit }, data) {
|
|
||||||
console.log(data);
|
|
||||||
axios
|
|
||||||
.post('/schedule/event-types', data)
|
|
||||||
.then((response: AxiosResponse<EventType>) => {
|
|
||||||
commit('addEventType', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
removeEventType({ commit }, data: number) {
|
|
||||||
axios
|
|
||||||
.delete(`/schedule/event-types/${data}`)
|
|
||||||
.then(() => {
|
|
||||||
commit('removeEventType', data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
changeEventTypeName({ commit }, eventtype: { id: number; name: string; oldname: string }) {
|
|
||||||
axios
|
|
||||||
.put(`/schedule/event-types/${eventtype.id}`, eventtype)
|
|
||||||
.then(() => {
|
|
||||||
commit('setEventType', eventtype);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
addEvent({ commit }, event: Event) {
|
|
||||||
axios
|
|
||||||
.post('/schedule/events', event)
|
|
||||||
.then((response: AxiosResponse<Event>) => {
|
|
||||||
commit('addEvent', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
console.log('Events: ', state.events);
|
|
||||||
},
|
|
||||||
updateEvent(
|
|
||||||
{ commit },
|
|
||||||
updateInformation: { eventId: number; JobId: number; service: FG.Service }
|
|
||||||
) {
|
|
||||||
axios
|
|
||||||
.put(
|
|
||||||
`/schedule/events/${updateInformation.eventId}/jobs/${updateInformation.JobId}`,
|
|
||||||
updateInformation.service
|
|
||||||
)
|
|
||||||
.then((response: AxiosResponse<FG.Event>) => {
|
|
||||||
response.data.start = new Date(response.data.start);
|
|
||||||
commit('updateEvent', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
getEvents({ commit }) {
|
|
||||||
axios
|
|
||||||
.get('/schedule/events')
|
|
||||||
.then((response: AxiosResponse<Event[]>) => {
|
|
||||||
console.log('action:', response.data);
|
|
||||||
response.data.forEach((event) => {
|
|
||||||
event.start = new Date(event.start);
|
|
||||||
});
|
|
||||||
commit('setEvents', response.data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.warn(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
};
|
|
||||||
const getters: GetterTree<ScheduleInterface, StateInterface> = {
|
|
||||||
jobTypes(state) {
|
|
||||||
return state.jobTypes;
|
|
||||||
},
|
|
||||||
events(state) {
|
|
||||||
return state.events;
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
const schedule: Module<ScheduleInterface, StateInterface> = {
|
|
||||||
namespaced: true,
|
|
||||||
state,
|
|
||||||
mutations,
|
|
||||||
actions,
|
|
||||||
getters,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default schedule;
|
|
Loading…
Reference in New Issue