Flaschengeist/flaschengeist-frontend
Flaschengeist
/
flaschengeist-frontend
7
0
Fork 1
Code Issues Pull Requests Projects Releases Activity

release v2.0.0 #4

Merged
crimsen merged 481 commits from develop into master 2024-01-18 15:15:08 +00:00
Conversation 0 Commits 481 Files Changed 156 +248 -401
10 changed files with 248 additions and 401 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 76978e8883 - Show all commits

23
src/plugins/schedule/components/management/CreateEvent.vue
View File

@ -67,17 +67,15 @@
import { defineComponent, ref, onBeforeMount, computed } from 'vue';
import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
import Job from './Job.vue';
import { mapGetters, useStore } from 'vuex';
import { StateInterface } from 'src/store';
import { date } from 'quasar';
import { useScheduleStore } from '../../store';
export default defineComponent({
name: 'CreateEvent',
components: { IsoDateInput, Job },
setup() {
const store = useStore<StateInterface>();
const scheduleGetters = mapGetters('schedule', ['eventTypes']);
const eventtypes = computed(() => <FG.EventType[]>scheduleGetters.eventTypes());
const store = useScheduleStore();
const eventtypes = computed(() => store.eventTypes);
const jobDeleteDisabled = computed(() => event.value.jobs.length < 2);
const newJob = ref<FG.Job>(({
@ -97,8 +95,8 @@ export default defineComponent({
} as FG.Event);
onBeforeMount(() => {
void store.dispatch('schedule/getEventTypes');
void store.dispatch('schedule/getJobTypes');
void store.getEventTypes();
void store.getJobTypes();
});
function setStart(data: { job: FG.Job; value: Date }) {
@ -137,11 +135,14 @@ export default defineComponent({
event.value.jobs.splice(index, 1);
}
function save() {
async function save() {
console.log('Event:', event);
store.dispatch('schedule/addEvent', event.value).catch((error) => {
console.warn(error);
});
try {
await store.addEvent(event.value);
reset();
} catch (error) {
console.error(error);
}
}
function reset() {

48
src/plugins/schedule/components/management/Eventtypes.vue
View File

@ -46,30 +46,22 @@
<script lang="ts">
import { defineComponent, ref, computed, onBeforeMount } from 'vue';
import { mapGetters, Store, useStore } from 'vuex';
import { StateInterface } from 'src/store';
import { EventType } from '../../store/schedule';
import { useScheduleStore } from '../../store';
export default defineComponent({
name: 'EventTypes',
components: {},
setup() {
//const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterface>>();
const scheduleGetters = mapGetters('schedule', ['eventTypes']);
const store = useScheduleStore();
const newEventType = ref('');
const edittype = ref(false);
const emptyEvent: EventType = { id: -1, name: '' };
const emptyEvent: FG.EventType = { id: -1, name: '' };
const actualEvent = ref(emptyEvent);
const newEventName = ref('');
onBeforeMount(() => {
void store.dispatch('schedule/getEventTypes').then(() => {
console.log('eventTypes:', rows);
});
console.log(store);
});
onBeforeMount(() => store.getEventTypes());
const rows = computed(() => <FG.EventType[]>scheduleGetters.eventTypes());
const rows = computed(() => store.eventTypes);
const columns = [
{
@ -87,26 +79,23 @@ export default defineComponent({
},
];
function addType() {
void store.dispatch('schedule/addEventType', { name: newEventType.value });
async function addType() {
await store.addEventType(newEventType.value);
// if null then conflict with name
newEventType.value = '';
}
function editType(event: EventType) {
function editType(event: FG.EventType) {
edittype.value = true;
actualEvent.value = event;
}
function saveChanges() {
void store
.dispatch('schedule/changeEventTypeName', {
id: actualEvent.value.id,
name: newEventName.value,
oldname: actualEvent.value.name,
})
.finally(() => {
discardChanges();
});
async function saveChanges() {
try {
await store.renameEventType(actualEvent.value.id, newEventName.value);
} finally {
discardChanges();
}
}
function discardChanges() {
@ -115,9 +104,10 @@ export default defineComponent({
edittype.value = false;
}
function deleteType(id: number) {
void store.dispatch('schedule/removeEventType', id);
async function deleteType(id: number) {
await store.removeEventType(id);
}
return {
columns,
rows,

14
src/plugins/schedule/components/management/Job.vue
View File

@ -62,9 +62,9 @@
</template>
<script lang="ts">
import { defineComponent, computed, ref, PropType } from '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';
export default defineComponent({
@ -86,8 +86,12 @@ export default defineComponent({
'set-required': (r: number) => isFinite(r),
},
setup(props, { emit }) {
const scheduleGetters = mapGetters('schedule', ['jobTypes']);
const jobtypes = computed(() => <FG.JobType[]>scheduleGetters.jobTypes());
const store = useScheduleStore();
onBeforeMount(() => store.getJobTypes());
const jobtypes = computed(() => store.jobTypes);
const refreshKey = ref<number>(0);
function setStart(value: Date) {
emit('set-start', value);
@ -126,8 +130,6 @@ export default defineComponent({
return props.job.start < new Date(val) || 'Ende muss hinter dem Start liegen';
}
const refreshKey = ref(0);
function refresh() {
refreshKey.value += 1;
}

38
src/plugins/schedule/components/management/JobTypes.vue
View File

@ -46,27 +46,22 @@
<script lang="ts">
import { defineComponent, ref, computed, onBeforeMount } from 'vue';
import { mapGetters, Store, useStore } from 'vuex';
import { StateInterface } from 'src/store';
import { JobType } from '../../store/schedule';
import { useScheduleStore } from '../../store';
export default defineComponent({
name: 'JobTypes',
components: {},
setup() {
//const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterface>>();
const scheduleGetters = mapGetters('schedule', ['jobTypes']);
const store = useScheduleStore();
const newJob = ref('');
const edittype = ref(false);
const emptyJob: JobType = { id: -1, name: '' };
const emptyJob: FG.JobType = { id: -1, name: '' };
const actualJob = ref(emptyJob);
const newJobName = ref('');
onBeforeMount(() => {
void store.dispatch('schedule/getJobTypes');
});
onBeforeMount(() => store.getJobTypes());
const rows = computed(() => <FG.JobType[]>scheduleGetters.jobTypes());
const rows = computed(() => store.jobTypes);
const columns = [
{
@ -84,22 +79,22 @@ export default defineComponent({
},
];
function addType() {
void store.dispatch('schedule/addJobType', { name: newJob.value });
async function addType() {
await store.addJobType(newJob.value);
newJob.value = '';
}
function editType(job: JobType) {
function editType(job: FG.JobType) {
edittype.value = true;
actualJob.value = job;
}
function saveChanges() {
void store
.dispatch('schedule/changeJobTypeName', { id: actualJob.value.id, name: newJobName.value })
.finally(() => {
discardChanges();
});
async function saveChanges() {
try {
await store.renameJobType(actualJob.value.id, newJobName.value);
} finally {
discardChanges();
}
}
function discardChanges() {
@ -109,8 +104,9 @@ export default defineComponent({
}
function deleteType(id: number) {
void store.dispatch('schedule/removeJobType', id);
void store.removeJobType(id);
}
return {
columns,
rows,

50
src/plugins/schedule/components/overview/AgendaView.vue
View File

@ -65,9 +65,8 @@
</template>
<script lang="ts">
import { computed, defineComponent, onBeforeMount, ref } from 'vue';
import { useStore } from 'vuex';
import { ScheduleInterface } from '../../store/schedule';
import { defineComponent, onBeforeMount, ref } from 'vue';
import { useScheduleStore } from '../../store';
import Eventslot from './slots/EventSlot.vue';
import { date } from 'quasar';
@ -76,25 +75,23 @@ export default defineComponent({
components: { Eventslot },
setup() {
const store = useStore();
// That looks evil
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
const state = computed(() => <ScheduleInterface>store.state.schedule);
const store = useScheduleStore();
const selectedDate = ref(date.formatDate(new Date(), 'YYYY-MM-DD'));
const proxyDate = ref('');
const calendar = ref();
const calendarView = 'week-agenda';
const events2 = computed(() => {
const events = ref<Agendas>({});
interface Agendas {
[index: number]: FG.Event[];
}
onBeforeMount(async () => {
let agenda: Agendas = {};
// 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'));
return date.formatDate(event.start, 'w') == thisWeek;
})
.forEach(event => {
const list = await store.getEvents({ from: new Date(selectedDate.value) });
if (list)
list.forEach((event) => {
let day = event.start.getDay();
console.log('event', event, day, !agenda[day]);
if (!agenda[day]) {
@ -103,18 +100,11 @@ export default defineComponent({
agenda[day].push(event);
});
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 }) {
return events2.value[parseInt(day.weekday, 10)];
return events.value[parseInt(day.weekday, 10)];
}
function calendarNext() {
@ -148,8 +138,8 @@ export default defineComponent({
'September',
'Oktober',
'November',
'Dezember'
]
'Dezember',
],
});
}
}
@ -164,16 +154,16 @@ export default defineComponent({
asMonth,
calendar,
selectedDate,
events2,
events,
getAgenda,
calendarNext,
calendarPrev,
updateProxy,
saveNewSelectedDate,
proxyDate,
calendarView
calendarView,
};
}
},
});
</script>

93
src/plugins/schedule/components/overview/slots/EventSlot.vue
View File

@ -68,10 +68,11 @@
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
import { defineComponent, ref, onBeforeMount, PropType } from 'vue';
import { useRouter } from 'vue-router';
import { useStore } from 'vuex';
import { StateInterface } from 'src/store';
import { date } from 'quasar';
import { asHour } from '../../../../../utils/datetime';
import { date, Notify } from 'quasar';
import { asHour } from 'src/utils/datetime';
import { useUserStore } from 'src/plugins/user/store';
import { useMainStore } from 'src/store';
import { useScheduleStore } from 'src/plugins/schedule/store';
export default defineComponent({
name: 'Eventslot',
@ -91,72 +92,72 @@ export default defineComponent({
},
setup(props) {
const store = useStore<StateInterface>();
const state = store.state.users;
const store = useScheduleStore();
const mainStore = useMainStore();
const userStore = useUserStore();
const router = useRouter();
const availableUsers = null;
const refreshKey = ref<number>(0);
const users = ref(state.users);
onBeforeMount(async () => userStore.getUsers());
function refresh() {
router.go(0);
refreshKey.value += 1;
}
onBeforeMount(() => {
store.dispatch('user/getUsers').catch((error) => {
console.warn(error);
});
});
function isUserEnrolled(job: FG.Job) {
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) {
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;
return userStore.users.find((user) => (user.userid = userid))?.display_name;
}
function enrollForJob(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: props.event.id,
JobId: job.id,
service: newUserService,
};
void store.dispatch('schedule/updateEvent', UpdateInformation).catch((error) => {
console.warn(error);
async function enrollForJob(job: FG.Job) {
const newService: FG.Service = {
userid: mainStore.currentUser.userid,
value: 1,
};
try {
await store.updateEvent(props.event.id, job.id, { user: newService });
} catch (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();
}
function signOutFromJob(job: FG.Job) {
console.log(job.services);
if (state.currentUser) {
const newService: FG.Service = {
userid: state.currentUser?.userid,
value: -1,
};
async function signOutFromJob(job: FG.Job) {
const newService: FG.Service = {
userid: mainStore.currentUser.userid,
value: -1,
};
const newUserService = { user: newService };
const UpdateInformation = {
eventId: props.event.id,
JobId: job.id,
service: newUserService,
};
void store.dispatch('schedule/updateEvent', UpdateInformation).catch((error) => {
console.warn(error);
try {
await store.updateEvent(props.event.id, job.id, { user: newService });
} catch (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();
@ -166,8 +167,6 @@ export default defineComponent({
refreshKey,
availableUsers,
enrollForJob,
state,
users,
isUserEnrolled,
signOutFromJob,
jobFull,

9
src/plugins/schedule/pages/MainPage.vue
View File

@ -24,24 +24,17 @@
import { computed, defineComponent } from 'vue';
import EssentialLink from 'src/components/navigation/EssentialLink.vue';
import mainRoutes from 'src/plugins/schedule/routes';
import { mapGetters } from 'vuex';
import setLoadingBar from 'src/utils/loading';
import { useRoute } from 'vue-router';
export default defineComponent({
// name: 'PageName'
components: { EssentialLink },
setup() {
const balanceGetters = mapGetters('balance', ['loading']);
const route = useRoute();
const loading = computed(() => {
return balanceGetters.loading() > 0;
});
const checkMain = computed(() => {
return route.matched.length == 2;
});
setLoadingBar(loading);
return { checkMain, mainRoutes };
},
});

4
src/plugins/schedule/plugin.ts
View File

@ -1,9 +1,6 @@
import { Module } from 'vuex';
import { defineAsyncComponent } from 'vue';
import mainRoutes from './routes';
import { FG_Plugin } from 'src/plugins';
import { StateInterface } from 'src/store';
import store, { ScheduleInterface } from './store/schedule';
const plugin: FG_Plugin.Plugin = {
name: 'Schedule',
@ -11,7 +8,6 @@ const plugin: FG_Plugin.Plugin = {
requiredModules: ['User'],
requiredBackendModules: ['schedule'],
version: '0.0.1',
store: new Map<string, Module<ScheduleInterface, StateInterface>>([['schedule', store]]),
widgets: [
{
priority: 0,

125
src/plugins/schedule/store.ts Normal file
View File

@ -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}
},
},
});

245
src/plugins/schedule/store/schedule.ts
View File

@ -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;