airavata-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From machris...@apache.org
Subject [airavata-django-portal] 01/03: AIRAVATA-2614 Color coded experiment status badge
Date Thu, 05 Apr 2018 14:35:52 GMT
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 18fead63cf8352f4a962d9163473b49a3c68caf5
Author: Marcus Christie <machrist@iu.edu>
AuthorDate: Thu Apr 5 09:48:48 2018 -0400

    AIRAVATA-2614 Color coded experiment status badge
---
 .../api/static/django_airavata_api/js/index.js     |  2 ++
 .../django_airavata_api/js/models/Experiment.js    |  6 +---
 .../js/models/ExperimentState.js                   |  7 +++++
 .../experiment/ExperimentStatusBadge.vue           | 33 ++++++++++++++++++++++
 .../js/containers/ExperimentListContainer.vue      |  5 +++-
 5 files changed, 47 insertions(+), 6 deletions(-)

diff --git a/django_airavata/apps/api/static/django_airavata_api/js/index.js b/django_airavata/apps/api/static/django_airavata_api/js/index.js
index 36b9725..afe7afb 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/index.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/index.js
@@ -3,6 +3,7 @@ import ApplicationInterfaceDefinition from './models/ApplicationInterfaceDefinit
 import ApplicationModule from './models/ApplicationModule'
 import DataType from './models/DataType'
 import Experiment from './models/Experiment'
+import ExperimentState from './models/ExperimentState'
 import InputDataObjectType from './models/InputDataObjectType'
 import OutputDataObjectType from './models/OutputDataObjectType'
 import Project from './models/Project'
@@ -29,6 +30,7 @@ exports.models = {
     ApplicationModule,
     DataType,
     Experiment,
+    ExperimentState,
     FullExperiment,
     InputDataObjectType,
     OutputDataObjectType,
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/Experiment.js b/django_airavata/apps/api/static/django_airavata_api/js/models/Experiment.js
index 6f5ad6d..90e6637 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/Experiment.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/Experiment.js
@@ -101,13 +101,9 @@ export default class Experiment extends BaseModel {
     }
 
     get isProgressing() {
-        const progressingStates = [ExperimentState.SCHEDULED,
-                                   ExperimentState.LAUNCHED,
-                                   ExperimentState.EXECUTING,
-                                   ExperimentState.CANCELING];
         return this.experimentStatus
             && this.experimentStatus.length > 0
-            && progressingStates.indexOf(this.experimentStatus[0].state) >= 0;
+            && this.experimentStatus[0].state.isProgressing;
     }
 
     get hasLaunched() {
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentState.js
b/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentState.js
index ab3a626..3181b87 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentState.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentState.js
@@ -1,6 +1,13 @@
 import BaseEnum from './BaseEnum'
 
 export default class ExperimentState extends BaseEnum {
+    get isProgressing() {
+        const progressingStates = [ExperimentState.SCHEDULED,
+                                   ExperimentState.LAUNCHED,
+                                   ExperimentState.EXECUTING,
+                                   ExperimentState.CANCELING];
+        return progressingStates.indexOf(this) >= 0;
+    }
 }
 ExperimentState.init([
     'CREATED',
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentStatusBadge.vue
b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentStatusBadge.vue
new file mode 100644
index 0000000..b8bfcdd
--- /dev/null
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentStatusBadge.vue
@@ -0,0 +1,33 @@
+<template>
+    <b-badge :variant="badgeVariant">{{ statusName }}</b-badge>
+</template>
+
+<script>
+import { models, services } from 'django-airavata-api'
+
+export default {
+    name: 'experiment-status-badge',
+    props: {
+        statusName: {
+            type: String,
+            required: true
+        }
+    },
+    computed: {
+        experimentState: function() {
+            return models.ExperimentState.byName(this.statusName);
+        },
+        badgeVariant: function() {
+            if (this.experimentState.isProgressing) {
+                return "secondary";
+            } else if (this.experimentState === models.ExperimentState.COMPLETED) {
+                return "success";
+            } else if (this.experimentState === models.ExperimentState.FAILED) {
+                return "danger";
+            } else {
+                return "info";
+            }
+        }
+    }
+}
+</script>
\ No newline at end of file
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ExperimentListContainer.vue
b/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ExperimentListContainer.vue
index 854f0f4..8879781 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ExperimentListContainer.vue
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ExperimentListContainer.vue
@@ -22,7 +22,7 @@
                                 <tr v-for="experiment in experiments" :key="experiment.experimentId">
                                     <td><a :href="'/workspace/experiments/' + encodeURIComponent(experiment.experimentId)
+ '/'">{{experiment.name}}</a></td>
                                     <td><span :title="experiment.creationTime">{{
fromNow(experiment.creationTime) }}</span></td>
-                                    <td>{{experiment.experimentStatus}}</td>
+                                    <td><experiment-status-badge :statusName="experiment.experimentStatus"
/></td>
                                     <td></td>
                                 </tr>
                             </tbody>
@@ -41,6 +41,8 @@
 import { models, services } from 'django-airavata-api'
 import { components as comps } from 'django-airavata-common-ui'
 
+import ExperimentStatusBadge from '../components/experiment/ExperimentStatusBadge.vue'
+
 import moment from 'moment';
 
 export default {
@@ -53,6 +55,7 @@ export default {
     },
     components: {
         'pager': comps.Pager,
+        'experiment-status-badge': ExperimentStatusBadge,
     },
     methods: {
         nextExperiments: function(event) {

-- 
To stop receiving notification emails like this one, please contact
machristie@apache.org.

Mime
View raw message