change vue to use a task submitter for setting stage (e886e9db) · Commits · OpenFlexure / openflexure-microscope-server

openflexure_microscope/api/static/src/components/viewComponents/settingsComponents/stageSettings.vue

+33 −22

Original line number	Diff line number	Diff line
		@@ -6,11 +6,25 @@
		<label>
		Stage Type
		<div v-if="this.stageType != 'MissingStage'">
		<form>
		<div>
		<select v-model="stageType" class="uk-select">
		<option value="SangaStage">SangaStage (Standard)</option>
		<option value= "SangaDeltaStage"> SangaStage (Delta)</option>
		</select>
		</div>
		<div>
		<taskSubmitter
		:can-terminate="false"
		:submit-url= "this.stageTypeUri"
		:submit-data="{'stage_type' : this.stageType}"
		:submit-label="'Change stage type'"
		@response="onStageTypeResponse"
		@error="onStageTypeError"
		>
		</div>
		</form>
		</div>
		<div v-else class="uk-text-danger"><b>No stage connected</b></div>
		</label>
		</p>
		@@ -21,10 +35,15 @@
		<script>

		import axios from "axios";
		import taskSubmitter from "../../genericComponents/taskSubmitter";

		export default {
		name: "StageSettings",

		components:{
		taskSubmitter
		},

		data: function(){
		return {
		stageType: "MissingStage",
		@@ -41,35 +60,27 @@ export default {
		this.getStageType();
		},

		watch:{
		stageType: function(){
		this.setStageType();
		}
		},

		methods: {
		getStageType: function(){
		console.log("Getting stage type")
		axios
		.get(this.stageTypeUri)
		.then(response => {
		console.log("Stage type is " + response.data)
		this.stageType = response.data;
		console.log("Stage type is " + response.data.stage_type)
		this.stageType = response.data.stage_type;
		})
		.catch(error => {
		this.modalError(error);
		});
		},
		setStageType: function(){
		console.log("Changing stage type")
		axios
		.post(this.stageTypeUri,{"stage_type" : this.stageType})
		.then(response => {
		console.log("Stage type changed")
		})
		.catch(error => {
		this.modalError(error);
		});
		onStageTypeResponse: function(response) {
		this.modalNotify("Stage type changed.");
		console.log("Stage type changed to " + response.output.stage_type)
		this.stageType = response.output.stage_type
		},

		onStageTypeError: function(error) {
		this.modalError(error); // Let mixin handle error
		}
		}
		}