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 2018/01/04 17:48:42 UTC
[airavata-django-portal] 02/02: AIRAVATA-2598 Separated out queue
settings into separate component
This is an automated email from the ASF dual-hosted git repository.
machristie pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git
commit cde96c2626b36d929d0adf80868c41e457ea1bd0
Author: Marcus Christie <ma...@iu.edu>
AuthorDate: Thu Jan 4 12:47:44 2018 -0500
AIRAVATA-2598 Separated out queue settings into separate component
---
.../django_airavata_api/js/models/BaseModel.js | 4 +
.../js/models/InputDataObjectType.js | 4 -
.../js/components/experiment/ExperimentEditor.vue | 91 ++++----------
.../components/experiment/QueueSettingsEditor.vue | 131 +++++++++++++++++++++
4 files changed, 155 insertions(+), 75 deletions(-)
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js b/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js
index 119ebd0..c5ef43a 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js
@@ -74,4 +74,8 @@ export default class BaseModel {
validate() {
return null;
}
+
+ clone() {
+ return new this.constructor(this);
+ }
}
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js b/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
index 56bb108..601fdd0 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
@@ -21,8 +21,4 @@ export default class InputDataObjectType extends BaseModel {
constructor(data = {}) {
super(FIELDS, data);
}
-
- clone() {
- return new InputDataObjectType(this);
- }
}
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue
index 6a66601..1e9db4e 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue
@@ -56,9 +56,12 @@
Resource Selection
</h2>
<b-form novalidate>
+ <!-- TODO: combine compute resource selector with
+ queue-settings-editor to create a
+ ComputationalResourceSchedulingModelEditor component -->
<b-form-group label="Compute Resource" label-for="compute-resource">
<b-form-select id="compute-resource"
- v-model="experiment.userConfigurationData.computationalResourceScheduling.resourceHostId"
+ v-model="resourceHostId"
:options="computeResourceOptions" required
@change="computeResourceChanged">
<template slot="first">
@@ -67,33 +70,12 @@
</b-form-select>
</b-form-group>
- <div class="card border-default">
- <div class="card-body">
- <h4 class="card-title">Current Settings</h4>
- </div>
- </div>
- <b-form-group label="Select a Queue" label-for="queue">
- <b-form-select id="queue"
- v-model="experiment.userConfigurationData.computationalResourceScheduling.queueName"
- :options="queueOptions" required
- @change="queueChanged">
- </b-form-select>
- </b-form-group>
- <b-form-group label="Node Count" label-for="node-count">
- <b-form-input id="node-count" type="number" min="1"
- v-model="experiment.userConfigurationData.computationalResourceScheduling.nodeCount" required>
- </b-form-input>
- </b-form-group>
- <b-form-group label="Total Core Count" label-for="core-count">
- <b-form-input id="core-count" type="number" min="1"
- v-model="experiment.userConfigurationData.computationalResourceScheduling.totalCPUCount" required>
- </b-form-input>
- </b-form-group>
- <b-form-group label="Wall Time Limit" label-for="walltime-limit">
- <b-form-input id="walltime-limit" type="number" min="1"
- v-model="experiment.userConfigurationData.computationalResourceScheduling.wallTimeLimit" required>
- </b-form-input>
- </b-form-group>
+ <queue-settings-editor
+ v-model="experiment.userConfigurationData.computationalResourceScheduling"
+ v-if="appDeploymentId && resourceHostId"
+ :app-deployment-id="appDeploymentId"
+ :resource-host-id="resourceHostId">
+ </queue-settings-editor>
</b-form>
</div>
</div>
@@ -103,19 +85,25 @@
</template>
<script>
+import QueueSettingsEditor from './QueueSettingsEditor.vue'
import {models, services} from 'django-airavata-api'
export default {
name: 'edit-experiment',
+ // TODO: clone experiment instead of editing it directly
props: ['experiment', 'appModule', 'appInterface'],
data () {
return {
projects: [],
computeResources: {},
applicationDeployments: [],
- queueDefaults: [],
+ appDeploymentId: null,
+ resourceHostId: null,
}
},
+ components: {
+ QueueSettingsEditor,
+ },
mounted: function () {
services.ProjectService.listAll()
.then(projects => this.projects = projects);
@@ -146,55 +134,16 @@ export default {
computeResourceOptions.sort((a, b) => a.text.localeCompare(b.text));
return computeResourceOptions;
},
- queueOptions: function() {
- const queueOptions = this.queueDefaults.map(queueDefault => {
- return {
- value: queueDefault.queueName,
- text: `${queueDefault.queueName}: ${queueDefault.queueDescription}`,
- }
- });
- return queueOptions;
- },
},
methods: {
computeResourceChanged: function(selectedComputeResourceId) {
// Find application deployment that corresponds to this compute resource
- // TODO: switch to find()
- let selectedApplicationDeployments = this.applicationDeployments.filter(dep => dep.computeHostId === selectedComputeResourceId);
- if (selectedApplicationDeployments.length === 0) {
+ let selectedApplicationDeployment = this.applicationDeployments.find(dep => dep.computeHostId === selectedComputeResourceId);
+ if (!selectedApplicationDeployment) {
throw new Error("Failed to find application deployment!");
}
- let selectedApplicationDeployment = selectedApplicationDeployments[0];
- services.ApplicationDeploymentService.getQueues(selectedApplicationDeployment.appDeploymentId)
- .then(queueDefaults => {
- // Sort queue defaults
- this.queueDefaults = queueDefaults.sort((a, b) => {
- // Sort default first, then by alphabetically by name
- if (a.isDefaultQueue) {
- return -1;
- } else if (b.isDefaultQueue) {
- return 1;
- } else {
- return a.queueName.localeCompare(b.queueName);
- }
- });
- // Find the default queue and apply it's settings
- const defaultQueue = this.queueDefaults[0];
-
- // TODO: we really shouldn't be modifying the props right?
- this.experiment.userConfigurationData.computationalResourceScheduling.queueName = defaultQueue.queueName;
- this.experiment.userConfigurationData.computationalResourceScheduling.totalCPUCount = defaultQueue.defaultCPUCount;
- this.experiment.userConfigurationData.computationalResourceScheduling.nodeCount = defaultQueue.defaultNodeCount;
- this.experiment.userConfigurationData.computationalResourceScheduling.wallTimeLimit = defaultQueue.defaultWalltime;
- });
+ this.appDeploymentId = selectedApplicationDeployment.appDeploymentId;
},
- queueChanged: function(queueName) {
-
- const queueDefault = this.queueDefaults.find(queue => queue.queueName === queueName);
- this.experiment.userConfigurationData.computationalResourceScheduling.totalCPUCount = queueDefault.defaultCPUCount;
- this.experiment.userConfigurationData.computationalResourceScheduling.nodeCount = queueDefault.defaultNodeCount;
- this.experiment.userConfigurationData.computationalResourceScheduling.wallTimeLimit = queueDefault.defaultWalltime;
- }
},
watch: {
appInterface: function() {
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/QueueSettingsEditor.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/QueueSettingsEditor.vue
new file mode 100644
index 0000000..b590da3
--- /dev/null
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/QueueSettingsEditor.vue
@@ -0,0 +1,131 @@
+<template>
+ <b-form novalidate>
+
+ <div class="card border-default">
+ <div class="card-body">
+ <h4 class="card-title">Current Settings</h4>
+ </div>
+ </div>
+ <b-form-group label="Select a Queue" label-for="queue">
+ <b-form-select id="queue"
+ v-model="localComputationalResourceScheduling.queueName"
+ :options="queueOptions" required
+ @change="queueChanged">
+ </b-form-select>
+ </b-form-group>
+ <b-form-group label="Node Count" label-for="node-count">
+ <b-form-input id="node-count" type="number" min="1"
+ v-model="localComputationalResourceScheduling.nodeCount" required
+ @change="emitValueChanged">
+ </b-form-input>
+ </b-form-group>
+ <b-form-group label="Total Core Count" label-for="core-count">
+ <b-form-input id="core-count" type="number" min="1"
+ v-model="localComputationalResourceScheduling.totalCPUCount" required
+ @change="emitValueChanged">
+ </b-form-input>
+ </b-form-group>
+ <b-form-group label="Wall Time Limit" label-for="walltime-limit">
+ <b-form-input id="walltime-limit" type="number" min="1"
+ v-model="localComputationalResourceScheduling.wallTimeLimit" required
+ @change="emitValueChanged">
+ </b-form-input>
+ </b-form-group>
+ </b-form>
+</template>
+
+<script>
+import {models, services} from 'django-airavata-api'
+
+export default {
+ name: 'queue-settings-editor',
+ props: {
+ value: {
+ type: models.ComputationalResourceSchedulingModel,
+ required: true
+ },
+ appDeploymentId: {
+ type: String,
+ required: true
+ },
+ resourceHostId: {
+ type: String,
+ required: true
+ }
+ },
+ data () {
+ const localComputationalResourceScheduling = this.value.clone();
+ localComputationalResourceScheduling.resourceHostId = this.resourceHostId;
+ return {
+ localComputationalResourceScheduling: localComputationalResourceScheduling,
+ queueDefaults: [],
+ }
+ },
+ computed: {
+ queueOptions: function() {
+ const queueOptions = this.queueDefaults.map(queueDefault => {
+ return {
+ value: queueDefault.queueName,
+ text: `${queueDefault.queueName}: ${queueDefault.queueDescription}`,
+ }
+ });
+ return queueOptions;
+ },
+ },
+ methods: {
+ queueChanged: function(queueName) {
+
+ const queueDefault = this.queueDefaults.find(queue => queue.queueName === queueName);
+ this.localComputationalResourceScheduling.totalCPUCount = queueDefault.defaultCPUCount;
+ this.localComputationalResourceScheduling.nodeCount = queueDefault.defaultNodeCount;
+ this.localComputationalResourceScheduling.wallTimeLimit = queueDefault.defaultWalltime;
+ this.emitValueChanged();
+ },
+ emitValueChanged: function() {
+ this.$emit('input', this.localComputationalResourceScheduling);
+ },
+ loadQueueDefaults: function() {
+ services.ApplicationDeploymentService.getQueues(this.appDeploymentId)
+ .then(queueDefaults => {
+ // Sort queue defaults
+ this.queueDefaults = queueDefaults.sort((a, b) => {
+ // Sort default first, then by alphabetically by name
+ if (a.isDefaultQueue) {
+ return -1;
+ } else if (b.isDefaultQueue) {
+ return 1;
+ } else {
+ return a.queueName.localeCompare(b.queueName);
+ }
+ });
+ // Find the default queue and apply it's settings
+ const defaultQueue = this.queueDefaults[0];
+
+ this.localComputationalResourceScheduling.queueName = defaultQueue.queueName;
+ this.localComputationalResourceScheduling.totalCPUCount = defaultQueue.defaultCPUCount;
+ this.localComputationalResourceScheduling.nodeCount = defaultQueue.defaultNodeCount;
+ this.localComputationalResourceScheduling.wallTimeLimit = defaultQueue.defaultWalltime;
+ this.emitValueChanged();
+ });
+ }
+ },
+ watch: {
+ value: function(newValue) {
+ this.localComputationalResourceScheduling = newValue.clone();
+ },
+ appDeploymentId: function(appDeploymentId) {
+ this.loadQueueDefaults();
+ },
+ resourceHostId: function(resourceHostId) {
+ this.localComputationalResourceScheduling.resourceHostId = resourceHostId;
+ this.emitValueChanged();
+ }
+ },
+ mounted: function() {
+ this.loadQueueDefaults();
+ }
+}
+</script>
+
+<style>
+</style>
\ No newline at end of file
--
To stop receiving notification emails like this one, please contact
"commits@airavata.apache.org" <co...@airavata.apache.org>.