You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airavata.apache.org by ma...@apache.org on 2021/10/05 19:47:33 UTC

[airavata-django-portal] 22/24: AIRAVATA-3477 Support setting queue name via web component attribute

This is an automated email from the ASF dual-hosted git repository.

machristie pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git

commit e88131069d8b10a55297765afc783faa4d8e3acc
Author: Marcus Christie <ma...@apache.org>
AuthorDate: Mon Oct 4 12:34:44 2021 -0400

    AIRAVATA-3477 Support setting queue name via web component attribute
---
 .../js/web-components/QueueSettingsEditor.vue      | 51 +++++++++++++++-------
 .../js/web-components/store.js                     | 21 +++++++--
 2 files changed, 52 insertions(+), 20 deletions(-)

diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/QueueSettingsEditor.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/QueueSettingsEditor.vue
index 5c69076..3c2a83d 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/QueueSettingsEditor.vue
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/QueueSettingsEditor.vue
@@ -1,12 +1,14 @@
 <template>
-  <div v-if="queue">
+  <div>
     <div class="card border-default">
       <b-link
         @click="showConfiguration = !showConfiguration"
         class="card-link text-dark"
       >
         <div class="card-body">
-          <h5 class="card-title mb-4">Settings for queue {{ queueName }}</h5>
+          <h5 class="card-title mb-4">
+            Settings for queue {{ selectedQueueName }}
+          </h5>
           <div class="row">
             <div class="col">
               <h3 class="h5 mb-0">
@@ -36,7 +38,7 @@
       <b-form-group label="Select a Queue" label-for="queue">
         <b-form-select
           id="queue"
-          :value="queueName"
+          :value="selectedQueueName"
           :options="queueOptions"
           required
           @change="queueChanged"
@@ -135,25 +137,35 @@ Vue.use(BootstrapVue);
 
 export default {
   store: store,
+  props: {
+    queueName: {
+      type: String,
+    },
+  },
+  created() {
+    if (this.queueName && this.selectedQueueName !== this.queueName) {
+      this.queueChanged(this.queueName);
+    }
+  },
   data() {
     return {
       showConfiguration: false,
     };
   },
   computed: {
-    ...mapGetters([
-      "queue",
-      "queues",
-      "maxAllowedCores",
-      "maxAllowedNodes",
-      "maxAllowedWalltime",
-      "maxMemory",
-      "queueName",
-      "totalCPUCount",
-      "nodeCount",
-      "wallTimeLimit",
-      "totalPhysicalMemory",
-    ]),
+    ...mapGetters({
+      queue: "queue",
+      queues: "queues",
+      maxAllowedCores: "maxAllowedCores",
+      maxAllowedNodes: "maxAllowedNodes",
+      maxAllowedWalltime: "maxAllowedWalltime",
+      maxMemory: "maxMemory",
+      selectedQueueName: "queueName",
+      totalCPUCount: "totalCPUCount",
+      nodeCount: "nodeCount",
+      wallTimeLimit: "wallTimeLimit",
+      totalPhysicalMemory: "totalPhysicalMemory",
+    }),
     queueOptions() {
       if (!this.queues) {
         return [];
@@ -196,6 +208,13 @@ export default {
       });
     },
   },
+  watch: {
+    queueName(value) {
+      if (value && this.selectedQueueName !== value) {
+        this.queueChanged(value);
+      }
+    },
+  },
 };
 </script>
 
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/store.js b/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/store.js
index a0e7e4d..3ebdf43 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/store.js
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/store.js
@@ -32,6 +32,9 @@ export const mutations = {
   updateQueueName(state, { queueName }) {
     state.experiment.userConfigurationData.computationalResourceScheduling.queueName = queueName;
   },
+  setLazyQueueName(state, { queueName }) {
+    state.queueName = queueName;
+  },
   updateTotalCPUCount(state, { totalCPUCount }) {
     state.experiment.userConfigurationData.computationalResourceScheduling.totalCPUCount = totalCPUCount;
   },
@@ -97,9 +100,13 @@ export const actions = {
     });
     await dispatch("setExperiment", { experiment });
   },
-  async setExperiment({ commit, dispatch }, { experiment }) {
+  async setExperiment({ commit, dispatch, state }, { experiment }) {
     commit("setExperiment", { experiment });
     await dispatch("loadExperimentData");
+    // Check lazy experiment state properties and apply them
+    if (state.queueName) {
+      dispatch("updateQueueName", { queueName: state.queueName });
+    }
   },
   async loadExperimentData({ commit, dispatch, state }) {
     await Promise.all([
@@ -183,9 +190,13 @@ export const actions = {
       await dispatch("setDefaultQueue");
     }
   },
-  updateQueueName({ commit, dispatch }, { queueName }) {
-    commit("updateQueueName", { queueName });
-    dispatch("initializeQueue");
+  updateQueueName({ commit, dispatch, state }, { queueName }) {
+    if (state.experiment) {
+      commit("updateQueueName", { queueName });
+      dispatch("initializeQueue");
+    } else {
+      commit("setLazyQueueName", { queueName });
+    }
   },
   updateTotalCPUCount({ commit }, { totalCPUCount }) {
     commit("updateTotalCPUCount", { totalCPUCount });
@@ -634,6 +645,8 @@ export default new Vuex.Store({
     groupResourceProfiles: null,
     applicationModuleId: null,
     appDeploymentQueues: [],
+    // Lazy state fields that will be copied to the experiment once it is loaded
+    queueName: null,
   },
   mutations,
   actions,