Commit e81de501 authored by Joel Collins's avatar Joel Collins
Browse files

Made microscope settings component stateless

parent a2024956

src/components/controlComponents/settingsComponents/microscopeSettings.vue

+29 −27
Original line number Diff line number Diff line 
<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: {}

      };



      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;

        name: this.settings.name,

        stage_settings: {

          backlash: this.settings.stage_settings.backlash

        }

      };



      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 => {