release v2.0.0 #4
|
@ -15,7 +15,7 @@ declare namespace FG {
|
|||
mail: string;
|
||||
birthday?: Date;
|
||||
roles: Array<string>;
|
||||
permissions?: list;
|
||||
permissions?: Array<string>;
|
||||
avatar_url?: string;
|
||||
}
|
||||
type Permission = string;
|
||||
|
|
|
@ -31,10 +31,23 @@
|
|||
<q-separator vertical />
|
||||
<q-btn flat dense label="Next" @click="calendarNext" />
|
||||
</div>
|
||||
<!-- <q-space /> -->
|
||||
|
||||
<q-btn-toggle
|
||||
class="row absolute-right"
|
||||
v-model="calendarView"
|
||||
flat
|
||||
stretch
|
||||
toggle-color=""
|
||||
:options="[
|
||||
{ label: 'Tag', value: 'day-agenda' },
|
||||
{ label: 'Woche', value: 'week-agenda' }
|
||||
]"
|
||||
/>
|
||||
</q-toolbar>
|
||||
<q-calendar
|
||||
v-model="selectedDate"
|
||||
view="week-agenda"
|
||||
:view="calendarView"
|
||||
:weekdays="[1, 2, 3, 4, 5, 6, 0]"
|
||||
locale="de-de"
|
||||
style="height: 100%; min-height: 400px;"
|
||||
|
@ -92,15 +105,18 @@ export default defineComponent({
|
|||
}
|
||||
}
|
||||
},
|
||||
|
||||
setup(_, { root }) {
|
||||
const store = <Store<StateInterface>>root.$store;
|
||||
const state = <ScheduleInterface>store.state.schedule;
|
||||
const state = computed(() => <ScheduleInterface>store.state.schedule);
|
||||
const selectedDate = ref(date.formatDate(new Date(), 'YYYY-MM-DD'));
|
||||
const proxyDate = ref('');
|
||||
const calendarView = 'week-agenda';
|
||||
const events2 = computed(() => {
|
||||
console.log(state.events);
|
||||
let agenda: Agendas = {};
|
||||
state.events
|
||||
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
|
||||
console.log('Hier Passiert was');
|
||||
state.value.events
|
||||
.filter(event => {
|
||||
const thisWeek = date.formatDate(new Date(selectedDate.value), 'w');
|
||||
console.log(thisWeek, date.formatDate(event.start, 'w'));
|
||||
|
@ -124,7 +140,6 @@ export default defineComponent({
|
|||
|
||||
onBeforeMount(() => {
|
||||
void store.dispatch('schedule/getEvents');
|
||||
// void store.dispatch('schedule/getJobTypes');
|
||||
});
|
||||
function getAgenda(this: any, day: { weekday: string }) {
|
||||
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
||||
|
@ -156,7 +171,8 @@ export default defineComponent({
|
|||
calendarPrev,
|
||||
updateProxy,
|
||||
saveNewSelectedDate,
|
||||
proxyDate
|
||||
proxyDate,
|
||||
calendarView
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,49 +1,76 @@
|
|||
<template>
|
||||
<q-card
|
||||
class="background: radial-gradient(circle, #35a2ff 0%, #014a88 100%) justify-start content-center items-center "
|
||||
class="background: radial-gradient(circle, #35a2ff 0%, #014a88 100%) justify-start content-center items-center rounded-borders border-primary shadow-5 q-mb-xs"
|
||||
bordered
|
||||
>
|
||||
<header class="text-primary q-px-xs">
|
||||
<div class="col text-weight-bolder ellipsis">
|
||||
{{ event.type.name }}
|
||||
</div>
|
||||
|
||||
<div v-if="event.description" class=" col-12 q-px-sm" style="font-size: 10px">
|
||||
<div v-if="event.description" class=" col text-weight-medium " style="font-size: 10px">
|
||||
Info
|
||||
{{ event.description }}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-for="(job, index) in event.jobs" v-bind:key="index">
|
||||
<q-separator style="justify-start content-center" />
|
||||
<div>{{ job.start | formatToHour }} - {{ job.end | formatToHour }}</div>
|
||||
<div>
|
||||
<div class="text-weight-medium q-px-xs">
|
||||
{{ job.start | formatToHour }} - {{ job.end | formatToHour }}
|
||||
</div>
|
||||
<div class="q-px-xs">
|
||||
{{ job.type.name }}
|
||||
</div>
|
||||
<div class="col-12 q-px-sm" style="font-size: 10px">
|
||||
<div class="col-auto q-px-xs" style="font-size: 10px">
|
||||
{{ job.comment }}
|
||||
</div>
|
||||
<div>
|
||||
<q-select
|
||||
filled
|
||||
v-model="availableUsers"
|
||||
v-model="job.services"
|
||||
:option-label="opt => userDisplay(opt)"
|
||||
multiple
|
||||
:options="availableUsers"
|
||||
disable
|
||||
use-chips
|
||||
stack-label
|
||||
label="Dienste"
|
||||
class="col-12 q-px-sm"
|
||||
style="font-size: 10px "
|
||||
class="col-auto q-px-xs"
|
||||
style="font-size: 6px "
|
||||
counter
|
||||
:max-values="job.required_services"
|
||||
:key="refreshKey"
|
||||
>
|
||||
</q-select>
|
||||
<div class="row col-12 justify-end">
|
||||
<q-btn v-if="false" />
|
||||
<q-btn
|
||||
v-if="!isUserEnrolled(job) && !jobFull(job)"
|
||||
flat
|
||||
color="primary"
|
||||
label="Eintragen"
|
||||
@click="enrollForJob(job)"
|
||||
:key="refreshKey"
|
||||
/>
|
||||
<q-btn
|
||||
v-if="isUserEnrolled(job)"
|
||||
flat
|
||||
color="negative"
|
||||
label="Austragen"
|
||||
@click="signOutFromJob(job)"
|
||||
:key="refreshKey"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||
import { defineComponent, ref } from '@vue/composition-api';
|
||||
import { Store } from 'vuex';
|
||||
import { StateInterface } from 'src/store';
|
||||
import { ScheduleInterface } from '../../../store/schedule';
|
||||
import { date } from 'quasar';
|
||||
|
||||
interface Props {
|
||||
|
@ -65,18 +92,85 @@ export default defineComponent({
|
|||
}
|
||||
},
|
||||
|
||||
setup(props: Props, { root }) {
|
||||
setup(props: Props, { root, emit }) {
|
||||
const store = <Store<StateInterface>>root.$store;
|
||||
const state = <ScheduleInterface>store.state.schedule;
|
||||
const state = store.state.user;
|
||||
const availableUsers = null;
|
||||
const refreshKey = ref(0);
|
||||
|
||||
const users = ref(state.users);
|
||||
function refresh() {
|
||||
refreshKey.value += 1;
|
||||
}
|
||||
|
||||
function isUserEnrolled(job: FG.Job) {
|
||||
return (
|
||||
job.services.filter(service => service.userid == state.currentUser?.userid).length >= 1
|
||||
);
|
||||
}
|
||||
function jobFull(job: FG.Job) {
|
||||
console.log('jobFull', job.services.length >= job.required_services);
|
||||
return job.services.length >= job.required_services;
|
||||
}
|
||||
function userDisplay(userid: string) {
|
||||
return state.users.find(user => (user.userid = userid))?.display_name;
|
||||
}
|
||||
|
||||
function enrollForJob(this: any, job: FG.Job) {
|
||||
console.log(job.services);
|
||||
if (state.currentUser) {
|
||||
const newService: FG.Service = {
|
||||
userid: state.currentUser?.userid,
|
||||
value: 1
|
||||
};
|
||||
|
||||
const newUserService = { user: newService };
|
||||
const UpdateInformation = {
|
||||
eventId: <number>this.event.id,
|
||||
JobId: job.id,
|
||||
service: newUserService
|
||||
};
|
||||
void store.dispatch('schedule/updateEvent', UpdateInformation).catch(error => {
|
||||
console.warn(error);
|
||||
});
|
||||
}
|
||||
refresh();
|
||||
}
|
||||
function signOutFromJob(this: any, job: FG.Job) {
|
||||
console.log(job.services);
|
||||
if (state.currentUser) {
|
||||
const newService: FG.Service = {
|
||||
userid: state.currentUser?.userid,
|
||||
value: -1
|
||||
};
|
||||
|
||||
const newUserService = { user: newService };
|
||||
const UpdateInformation = {
|
||||
eventId: <number>this.event.id,
|
||||
JobId: job.id,
|
||||
service: newUserService
|
||||
};
|
||||
void store.dispatch('schedule/updateEvent', UpdateInformation).catch(error => {
|
||||
console.warn(error);
|
||||
});
|
||||
}
|
||||
refresh();
|
||||
}
|
||||
|
||||
return {
|
||||
refreshKey,
|
||||
availableUsers
|
||||
availableUsers,
|
||||
enrollForJob,
|
||||
state,
|
||||
users,
|
||||
isUserEnrolled,
|
||||
signOutFromJob,
|
||||
jobFull,
|
||||
userDisplay,
|
||||
refresh
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style scoped></style>
|
||||
|
|
|
@ -70,7 +70,7 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
const tabs: Tab[] = [
|
||||
{ name: 'create', label: 'Veranstantungen' },
|
||||
{ name: 'create', label: 'Veranstaltungen' },
|
||||
{ name: 'eventtypes', label: 'Veranstaltungsarten' },
|
||||
{ name: 'jobtypes', label: 'Dienstarten' }
|
||||
];
|
||||
|
|
|
@ -71,7 +71,7 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
const tabs: Tab[] = [
|
||||
{ name: 'agendaView', label: 'Wochenkalendar' }
|
||||
{ name: 'agendaView', label: 'Kalendar' }
|
||||
// { name: 'eventtypes', label: 'Veranstaltungsarten' },
|
||||
// { name: 'jobtypes', label: 'Dienstarten' }
|
||||
];
|
||||
|
|
|
@ -81,6 +81,10 @@ const mutations: MutationTree<ScheduleInterface> = {
|
|||
},
|
||||
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;
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -165,7 +169,7 @@ const actions: ActionTree<ScheduleInterface, StateInterface> = {
|
|||
},
|
||||
changeEventTypeName({ commit }, eventtype: { id: number; name: string; oldname: string }) {
|
||||
axios
|
||||
.put(`/schedule/event-types/${eventtype.oldname}`, eventtype)
|
||||
.put(`/schedule/event-types/${eventtype.id}`, eventtype)
|
||||
.then(() => {
|
||||
commit('setEventType', eventtype);
|
||||
})
|
||||
|
@ -185,6 +189,22 @@ const actions: ActionTree<ScheduleInterface, StateInterface> = {
|
|||
});
|
||||
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>) => {
|
||||
commit('updateEvent', response.data);
|
||||
})
|
||||
.catch(err => {
|
||||
console.warn(err);
|
||||
});
|
||||
},
|
||||
getEvents({ commit }) {
|
||||
axios
|
||||
.get('/schedule/events')
|
||||
|
@ -203,6 +223,9 @@ const actions: ActionTree<ScheduleInterface, StateInterface> = {
|
|||
const getters: GetterTree<ScheduleInterface, StateInterface> = {
|
||||
jobTypes(state) {
|
||||
return state.jobTypes;
|
||||
},
|
||||
events(state) {
|
||||
return state.events;
|
||||
}
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue