Replace event edit dialogue.

The old <dougal-event-edit-dialog/> gets replaced by
<dougal-event-edit/> which handles the new events schema.
This commit is contained in:
D. Berge
2022-02-27 19:06:36 +01:00
parent 1e5be9c655
commit 9aa9ce979b

View File

@@ -33,17 +33,17 @@
</span> </span>
</v-toolbar-title> </v-toolbar-title>
<dougal-event-edit-dialog v-if="writeaccess" <dougal-event-edit v-if="writeaccess"
v-model="eventDialog" v-model="eventDialog"
:allowed-labels="userLabels" v-bind="editedEvent"
:loading="loading"
:available-labels="userLabels"
:preset-remarks="presetRemarks" :preset-remarks="presetRemarks"
:default-timestamp="defaultEventTimestamp" @new="newEvent"
:default-sequence="defaultSequence" @changed="saveEvent"
:default-shotpoint="point" >
:event-mode="online?'seq':'timed'" </dougal-event-edit>
@save="saveEvent"
></dougal-event-edit-dialog>
<v-menu v-if="$route.params.sequence"> <v-menu v-if="$route.params.sequence">
<template v-slot:activator="{on, attrs}"> <template v-slot:activator="{on, attrs}">
<v-btn class="ml-5" small v-on="on" v-bind="attrs"> <v-btn class="ml-5" small v-on="on" v-bind="attrs">
@@ -288,7 +288,7 @@
<script> <script>
import { mapActions, mapGetters, mapState } from 'vuex'; import { mapActions, mapGetters, mapState } from 'vuex';
import DougalContextMenu from '@/components/context-menu'; import DougalContextMenu from '@/components/context-menu';
import DougalEventEditDialog from '@/components/event-edit-dialog' import DougalEventEdit from '@/components/event-edit'
function ArraysEqual (a, b) { function ArraysEqual (a, b) {
return a.every(i => b.includes(i)) && b.every(i => a.includes(i)); return a.every(i => b.includes(i)) && b.every(i => a.includes(i));
@@ -298,11 +298,15 @@ function EventKey (e) {
return e.type+e.id; return e.type+e.id;
} }
function clone (obj) {
return JSON.parse(JSON.stringify(obj));
}
export default { export default {
name: "Log", name: "Log",
components: { components: {
DougalEventEditDialog, DougalEventEdit,
DougalContextMenu DougalContextMenu
}, },
@@ -359,6 +363,7 @@ export default {
items: [] items: []
}, },
selectedLabels: [], selectedLabels: [],
editedEvent: {},
labelSearch: null, labelSearch: null,
queuedReload: false, queuedReload: false,
itemsPerPage: 25 itemsPerPage: 25
@@ -405,7 +410,7 @@ export default {
} }
}, },
...mapGetters(['user', 'writeaccess', 'loading', 'online', 'sequence', 'line', 'point', 'lineName', 'serverEvent']), ...mapGetters(['user', 'writeaccess', 'loading', 'online', 'sequence', 'line', 'point', 'position', 'timestamp', 'lineName', 'serverEvent']),
...mapState({projectSchema: state => state.project.projectSchema}) ...mapState({projectSchema: state => state.project.projectSchema})
}, },
@@ -531,15 +536,71 @@ export default {
}; };
}, },
async saveEvent (event) { /** Add a brand new event.
*
* Used when adding a new event to the database,
* assumed to have occurred in the immediate past,
* so we populate it with the last received real-time
* information (timestamp, shotpoint, position, etc.)
*/
newEvent () {
this.editedEvent = {
tstamp: this.timestamp,
sequence: this.sequence,
point: this.point,
longitude: (this.position??[])[0],
latitude: (this.position??[])[1]
}
},
async patchEvent (id, data) {
const callback = (err, res) => { const callback = (err, res) => {
if (!err && res.ok) { if (!err && res.ok) {
this.showSnack(["New event saved", "success"]); this.showSnack(["Event saved", "success"]);
this.queuedReload = true; this.queuedReload = true;
this.getEvents({cache: "reload"}); this.getEvents({cache: "reload"});
} }
} }
const url = `/project/${this.$route.params.project}/event/${id}`;
await this.api([url, {
method: "PATCH",
body: data
}, callback]);
},
// TODO POST or PATCH depending on whether this is a new event
// (no id) or an edit (id present)
async saveEvent (event) {
const callback = (err, res) => {
if (!err && res.ok) {
this.showSnack(["Event saved", "success"]);
this.queuedReload = true;
this.getEvents({cache: "reload"});
}
}
if (event) {
if (event.id) {
const id = event.id;
delete event.id;
this.putEvent(id, event, callback); // No await
} else {
this.postEvent(event, callback); // No await
}
}
},
async putEvent (id, event, callback) {
const url = `/project/${this.$route.params.project}/event/${id}`;
await this.api([url, {
method: "PATCH",
body: event
}, callback]);
},
async postEvent (event, callback) {
const url = `/project/${this.$route.params.project}/event`; const url = `/project/${this.$route.params.project}/event`;
await this.api([url, { await this.api([url, {
method: "POST", method: "POST",