Allow editing of remarks in sequence list

This commit is contained in:
D. Berge
2020-09-27 19:25:45 +02:00
parent 371030e61e
commit bf313dd8e5

View File

@@ -41,19 +41,77 @@
<v-card outlined class="flex-grow-1"> <v-card outlined class="flex-grow-1">
<v-card-title> <v-card-title>
Acquisition remarks Acquisition remarks
<v-btn v-if="edit && edit.sequence == item.sequence && edit.key == 'remarks'"
class="ml-3"
icon
small
title="Save edits"
:disabled="loading"
@click="edit = null"
>
<v-icon small>mdi-content-save-edit-outline</v-icon>
</v-btn>
<v-btn v-else-if="edit === null"
class="ml-3"
icon
small
title="Edit"
:disabled="loading"
@click="editItem(item, 'remarks')"
>
<v-icon small>mdi-square-edit-outline</v-icon>
</v-btn>
</v-card-title> </v-card-title>
<v-card-subtitle> <v-card-subtitle>
</v-card-subtitle> </v-card-subtitle>
<v-card-text> <v-card-text v-if="edit && edit.sequence == item.sequence && edit.key == 'remarks'">
<v-textarea
autofocus
placeholder="Enter your text here"
:disabled="loading"
v-model="edit.value"
>
</v-textarea>
</v-card-text>
<v-card-text v-else>
{{ item.remarks }} {{ item.remarks }}
</v-card-text> </v-card-text>
</v-card> </v-card>
<v-card outlined class="flex-grow-1"> <v-card outlined class="flex-grow-1" v-if="item.remarks_final !== null">
<v-card-title> <v-card-title>
Processing remarks Processing remarks
<v-btn v-if="edit && edit.sequence == item.sequence && edit.key == 'remarks_final'"
class="ml-3"
icon
small
title="Save edits"
:disabled="loading"
@click="edit = null"
>
<v-icon small>mdi-content-save-edit-outline</v-icon>
</v-btn>
<v-btn v-else-if="edit === null"
class="ml-3"
icon
small
title="Edit"
:disabled="loading"
@click="editItem(item, 'remarks_final')"
>
<v-icon small>mdi-square-edit-outline</v-icon>
</v-btn>
</v-card-title> </v-card-title>
<v-card-subtitle> <v-card-subtitle>
</v-card-subtitle> </v-card-subtitle>
<v-card-text v-if="edit && edit.sequence == item.sequence && edit.key == 'remarks_final'">
<v-textarea
autofocus
placeholder="Enter your text here"
:disabled="loading"
v-model="edit.value"
>
</v-textarea>
</v-card-text>
<v-card-text> <v-card-text>
{{ item.remarks_final }} {{ item.remarks_final }}
</v-card-text> </v-card-text>
@@ -318,7 +376,8 @@ export default {
filter: "", filter: "",
options: {}, options: {},
num_rows: null, num_rows: null,
activeItem: null activeItem: null,
edit: null // {sequence, key, value}
} }
}, },
@@ -332,10 +391,51 @@ export default {
this.getSequences(); this.getSequences();
}, },
deep: true deep: true
},
async edit (newVal, oldVal) {
if (newVal === null && oldVal !== null) {
const item = this.items.find(i => i.sequence == oldVal.sequence);
if (item && item[oldVal.key] != oldVal.value) {
if (await this.saveItem(oldVal)) {
item[oldVal.key] = oldVal.value;
} else {
this.edit = oldVal;
}
}
}
} }
}, },
methods: { methods: {
editItem (item, key) {
this.edit = {
sequence: item.sequence,
key,
value: item[key]
}
},
async saveItem (edit) {
if (!edit) return;
try {
const url = `/project/${this.$route.params.project}/sequence/${edit.sequence}`;
const init = {
method: "PATCH",
body: {
[edit.key]: edit.value
}
};
let res;
await this.api([url, init, (e, r) => res = r]);
return res && res.ok;
} catch (err) {
return false;
}
},
setActiveItem (item) { setActiveItem (item) {
this.activeItem = this.activeItem == item this.activeItem = this.activeItem == item