rahix/openflexure-microscope-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Made microscope settings component stateless

Browse source
This commit is contained in:
Joel Collins 2019-11-20 16:57:53 +00:00
parent a202495692
commit e81de50189
1 changed files with 29 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

56
src/components/controlComponents/settingsComponents/microscopeSettings.vue
View file

@ -1,5 +1,5 @@
<template>
<div id="microscopeSettings">
<div v-if="settings" id="microscopeSettings">
<form @submit.prevent="applyConfigRequest">
<h4>Stage</h4>
@ -11,7 +11,7 @@
<label class="uk-form-label" for="form-stacked-text">x</label>
<div class="uk-form-controls">
<input
v-model="stageBacklash.x"
v-model="settings.stage_settings.backlash.x"
class="uk-input uk-form-small"
type="number"
/>
@ -22,7 +22,7 @@
<label class="uk-form-label" for="form-stacked-text">y</label>
<div class="uk-form-controls">
<input
v-model="stageBacklash.y"
v-model="settings.stage_settings.backlash.y"
class="uk-input uk-form-small"
type="number"
/>
@ -33,7 +33,7 @@
<label class="uk-form-label" for="form-stacked-text">z</label>
<div class="uk-form-controls">
<input
v-model="stageBacklash.z"
v-model="settings.stage_settings.backlash.z"
class="uk-input uk-form-small"
type="number"
/>
@ -48,7 +48,7 @@
>Microscope name</label
>
<input
v-model="microscopeName"
v-model="settings.name"
class="uk-input uk-width-1-1 uk-form-small"
name="inputFilename"
placeholder="Leave blank for default"
@ -74,47 +74,49 @@ export default {
data: function() {
return {
microscopeName: this.$store.state.apiConfig.name,
stageBacklash: this.$store.state.apiConfig.stage_settings.backlash
settings: null
};
},
computed: {
configApiUri: function() {
return this.$store.getters.uri + "/config";
settingsUri: function() {
return `http://${this.$store.state.host}:${
this.$store.state.port
}/api/v2/settings`;
}
},
mounted() {
this.updateSettings();
},
methods: {
updateInputValues: function() {
this.microscopeName = this.$store.state.apiConfig.name;
this.stageBacklash = this.$store.state.apiConfig.stage_settings.backlash;
updateSettings: function() {
axios
.get(this.settingsUri)
.then(response => {
this.settings = response.data;
})
.catch(error => {
this.modalError(error); // Let mixin handle error
});
},
applyConfigRequest: function() {
var payload = {
stage_settings: {}
name: this.settings.name,
stage_settings: {
backlash: this.settings.stage_settings.backlash
}
};
if (this.microscopeName != this.$store.state.apiConfig.name) {
payload.name = this.microscopeName;
}
if (
this.stageBacklash !=
this.$store.state.apiConfig.stage_settings.backlash
) {
payload.stage_settings.backlash = this.stageBacklash;
}
console.log(payload);
// Send request to update config
axios
.post(this.configApiUri, payload)
.put(this.settingsUri, payload)
.then(() => {
this.$store.dispatch("updateConfig");
this.updateInputValues;
this.updateSettings();
this.modalNotify("Microscope config applied.");
})
.catch(error => {