disabling button and adding tool tips, and simplifying logic in invoc…

…ationStateSuccess function
assuntad23 · Dec 8, 2023 · 9c54781 · 9c54781
1 parent e298855
commit 9c54781
Showing 1 changed file with 15 additions and 5 deletions.
diff --git a/client/src/components/WorkflowInvocationState/WorkflowInvocationSummary.vue b/client/src/components/WorkflowInvocationState/WorkflowInvocationSummary.vue
@@ -3,16 +3,18 @@
         <div v-if="invocationAndJobTerminal">
             <span>
                 <b-button
-                    v-if="invocationStateSuccess"
                     v-b-tooltip.hover
+                    :title="invocationStateSuccess ? reportTooltip : disabledReportTooltip"
+                    :disabled="!invocationStateSuccess"
                     size="sm"
                     class="invocation-report-link"
                     :href="invocationLink">
                     View Report
                 </b-button>
                 <b-button
-                    v-if="invocationStateSuccess"
                     v-b-tooltip.hover
+                    :title="invocationStateSuccess ? generatePdfTooltip : disabledPdfTooltip"
+                    :disabled="!invocationStateSuccess"
                     size="sm"
                     class="invocation-pdf-link"
                     :href="invocationPdfLink"
@@ -115,6 +117,12 @@ export default {
         return {
             stepStatesInterval: null,
             jobStatesInterval: null,
+            reportTooltip: "View report for this workflow invocation",
+            generatePdfTooltip: "Generate PDF report for this workflow invocation",
+            disabledReportTooltip:
+                "Unable to create report because this workflow invocation is not complete or was not successful.",
+            disabledPdfTooltip:
+                "Unable to generate PDF because this workflow invocation is not complete or was not successful.",
         };
     },
     computed: {
@@ -134,13 +142,15 @@ export default {
         },
         invocationStateSuccess: function () {
             return (
-                this.invocationState !== "failed" &&
-                this.invocationState !== "cancelled" &&
+                this.invocationState == "scheduled" &&
                 this.errorCount === 0 &&
                 this.runningCount === 0 &&
-                this.stepStates.scheduled === this.stepCount
+                this.invocationAndJobTerminal
             );
         },
+        displayTooltip: function () {
+            return this.invocationStateSuccess ? "" : this.disabledTooltip;
+        },
         stepCount: function () {
             return this.invocation?.steps.length;
         },