release v2.0.0 #4
|
@ -3,29 +3,9 @@
|
|||
<q-card>
|
||||
<q-form @submit="save" @reset="reset">
|
||||
<q-card-section class="fit row justify-start content-center items-center">
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
label="Veranstaltungsname"
|
||||
v-model="eventname"
|
||||
filled
|
||||
:rules="[notEmpty]"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
label="Beschreibung"
|
||||
type="textarea"
|
||||
v-model="event.description"
|
||||
filled
|
||||
/>
|
||||
|
||||
<IsoDateInput
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
v-model="event.start"
|
||||
label="Veranstaltungstermin"
|
||||
:rules="[noValidDate, notEmpty]"
|
||||
/>
|
||||
|
||||
<q-card-section class="fit ">
|
||||
<div class="text-h6">Veranstaltung erstellen</div>
|
||||
</q-card-section>
|
||||
<q-select
|
||||
filled
|
||||
use-input
|
||||
|
@ -40,6 +20,21 @@
|
|||
clearable
|
||||
:rules="[notEmpty]"
|
||||
/>
|
||||
<IsoDateInput
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
v-model="event.start"
|
||||
label="Veranstaltungsbeginn"
|
||||
:rules="[noValidDate, notEmpty]"
|
||||
/>
|
||||
<q-card-section class="fit justify-start content-center items-center">
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
label="Beschreibung"
|
||||
type="textarea"
|
||||
v-model="event.description"
|
||||
filled
|
||||
/>
|
||||
</q-card-section>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<q-btn color="primary" label="Schicht hinzufügen" @click="addJob()" />
|
||||
|
@ -52,21 +47,21 @@
|
|||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
v-model="job.start"
|
||||
label="Beginn"
|
||||
type="time"
|
||||
type="datetime"
|
||||
:rules="[noValidDate, notEmpty]"
|
||||
/>
|
||||
<IsoDateInput
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
v-model="job.end"
|
||||
label="Ende"
|
||||
type="time"
|
||||
:rules="[noValidDate, notEmpty]"
|
||||
type="datetime"
|
||||
:rules="[noValidDate, isAfterDate, notEmpty]"
|
||||
/>
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
label="Beschreibung"
|
||||
type="textarea"
|
||||
v-model="job.description"
|
||||
v-model="job.comment"
|
||||
filled
|
||||
:rules="[notEmpty]"
|
||||
/>
|
||||
|
@ -85,7 +80,12 @@
|
|||
:rules="[notEmpty]"
|
||||
/>
|
||||
<q-input label="Dienstanzahl" type="number" v-model="job.required_services" filled />
|
||||
<q-btn label="Schicht löschen" color="negative" @click="removeJob(job.id)" />
|
||||
<q-btn
|
||||
label="Schicht löschen"
|
||||
color="negative"
|
||||
@click="removeJob(job.id)"
|
||||
:disabled="jobDeleteDisabled"
|
||||
/>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-card-section>
|
||||
|
@ -112,61 +112,43 @@ export default defineComponent({
|
|||
setup(_, { root }) {
|
||||
const store = <Store<StateInterface>>root.$store;
|
||||
const state = <ScheduleInterface>store.state.schedule;
|
||||
const eventname = ref('');
|
||||
const eventdescription = ref('');
|
||||
const eventdate = ref<Date>();
|
||||
// const eventtype = ref<FG.EventType | null>('');
|
||||
const eventtypes = computed(() => state.eventTypes);
|
||||
const jobtypes = computed(() => state.jobTypes);
|
||||
let jobnum = 1;
|
||||
const newJob: FG.Job = {
|
||||
id: jobnum,
|
||||
start: new Date(),
|
||||
end: new Date(),
|
||||
const jobDeleteDisabled = computed(() => event.value.jobs.length < 2);
|
||||
|
||||
const newJob = ref<FG.Job>(({
|
||||
id: NaN,
|
||||
start: undefined,
|
||||
end: undefined,
|
||||
comment: '',
|
||||
type: { id: NaN, name: '' },
|
||||
services: [],
|
||||
required_services: 2
|
||||
};
|
||||
// interface EventTypeToPost {
|
||||
// name: string;
|
||||
// }
|
||||
// interface EventToPost {
|
||||
// id: number;
|
||||
// start: Date;
|
||||
// description?: string;
|
||||
// type: EventTypeToPost;
|
||||
// jobs: Array<FG.Job>;
|
||||
// }
|
||||
} as unknown) as FG.Job);
|
||||
|
||||
const event = ref<FG.Event>({
|
||||
id: NaN,
|
||||
start: new Date(),
|
||||
description: '',
|
||||
type: { id: NaN, name: '' },
|
||||
jobs: [newJob]
|
||||
});
|
||||
|
||||
const jobs = ref<FG.Job[]>([newJob]);
|
||||
jobs: [Object.assign({}, newJob.value)]
|
||||
} as FG.Event);
|
||||
|
||||
onBeforeMount(() => {
|
||||
void store.dispatch('schedule/getEventTypes');
|
||||
void store.dispatch('schedule/getJobTypes');
|
||||
});
|
||||
|
||||
function addJob() {
|
||||
console.log('Jobs: ', jobs);
|
||||
event.value.jobs.unshift(newJob);
|
||||
jobnum++;
|
||||
const addJob = Object.assign({}, newJob.value);
|
||||
event.value.jobs.unshift(addJob);
|
||||
}
|
||||
|
||||
function removeJob(id: number) {
|
||||
let jobtoremove = event.value.jobs.findIndex(job => job.id == id);
|
||||
if (jobtoremove != undefined) {
|
||||
jobs.value.splice(jobtoremove, 1);
|
||||
event.value.jobs.splice(jobtoremove, 1);
|
||||
}
|
||||
}
|
||||
function save() {
|
||||
// console.log('Eventtype:', eventtype);
|
||||
console.log('Event:', event);
|
||||
store.dispatch('schedule/addEvent', event.value).catch(error => {
|
||||
console.warn(error);
|
||||
|
@ -174,9 +156,11 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
function reset() {
|
||||
let nothing = 2;
|
||||
nothing++;
|
||||
nothing = 3;
|
||||
event.value.id = NaN;
|
||||
event.value.start = new Date();
|
||||
event.value.description = '';
|
||||
delete event.value['type'];
|
||||
event.value.jobs = [Object.assign({}, newJob.value)];
|
||||
}
|
||||
function notEmpty(val: string) {
|
||||
return !!val || 'Feld darf nicht leer sein!';
|
||||
|
@ -184,11 +168,12 @@ export default defineComponent({
|
|||
function noValidDate(val: string) {
|
||||
return !!date.isValid(val) || 'Datum/Zeit muss gesetzt sein!';
|
||||
}
|
||||
|
||||
function isAfterDate(val: Date) {
|
||||
// return event.value.jobsstart.getTime() > val.getTime() || 'Ende muss hinter dem Start liegen';
|
||||
}
|
||||
return {
|
||||
eventname,
|
||||
eventdescription,
|
||||
eventdate,
|
||||
jobs,
|
||||
jobDeleteDisabled,
|
||||
addJob,
|
||||
eventtypes,
|
||||
removeJob,
|
||||
|
@ -197,7 +182,8 @@ export default defineComponent({
|
|||
noValidDate,
|
||||
save,
|
||||
reset,
|
||||
event
|
||||
event,
|
||||
isAfterDate
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue