Refactor configuration GUI.

Another refactoring. What we're doing now is eliminating the
need to save individually on each section. Configuration changes
are done directly on the local configuration and then the local
configuration is saved, downloaded or discarded in one go.
This commit is contained in:
D. Berge
2023-11-15 16:19:09 +01:00
parent c7270febfc
commit 62ab06b4a7
18 changed files with 707 additions and 626 deletions

View File

@@ -8,19 +8,20 @@
label="ID"
hint="Short survey ID"
persistent-hint
v-model="id_"
v-model="cwo.id"
>
</v-text-field>
<v-text-field
label="Name"
hint="Survey name"
persistent-hint
v-model="name_"
v-model="cwo.name"
>
</v-text-field>
</v-form>
</v-card-text>
<v-card-actions>
<!--
<v-btn
color="primary"
@click="save"
@@ -30,6 +31,7 @@
color="warning"
@click="reset"
>Reset</v-btn>
-->
<v-spacer></v-spacer>
<v-btn
color="secondary"
@@ -45,40 +47,43 @@ export default {
name: "DougalProjectSettingsNameId",
props: {
id: String,
name: String
value: Object
},
data () {
return {
id_: "",
name_: ""
}
},
watch: {
id () {
if (this.id != this.id_) {
this.id_ = this.id;
}
},
computed: {
// Current working object.
// A shortcut so we don't have to specify the full path
// on every input control. It also makes it easier to
// change that path if necessary. Finally, it ensures that
// the properties being modified are always available.
cwo: {
name () {
if (this.name != this.name_) {
this.name_ = this.name;
get () {
if (this.value) {
return this.value;
} else {
return {};
}
},
set (v) {
this.value = v;
}
}
},
methods: {
reset () {
this.id_ = this.id;
this.name_ = this.name;
},
save () {
this.$emit('input', {id: this.id_, name: this.name_});
},
back () {