WIP: set current condition

src/plugins/condition/components/ConditionCollection.vue

@@ -28,13 +28,17 @@
                 <span class="c-cs-button__label">Add Condition</span>
             </button>
         </div>
-        <div class="condition-collection">
+        <div class="condition-collection"
+        >
             <div v-for="conditionIdentifier in conditionCollection"
                  :key="conditionIdentifier.key"
                  class="conditionArea"
             >
                 <div v-if="isEditing">
-                    <ConditionEdit :conditionIdentifier="conditionIdentifier" />
+                    <ConditionEdit :conditionIdentifier="conditionIdentifier"
+                                   @update-current-condition="updateCurrentCondition"
+                                   :is-current="currentConditionIdentifier"
+                    />
                 </div>
                 <div v-else>
                     <Condition :conditionIdentifier="conditionIdentifier" />
@@ -65,7 +69,8 @@ export default {
             expanded: true,
             parentKeyString: this.openmct.objects.makeKeyString(this.domainObject.identifier),
             conditionCollection: [],
-            conditions: []
+            conditions: [],
+            currentConditionIdentifier: this.currentConditionIdentifier || {}
         };
     },
     destroyed() {
@@ -78,7 +83,10 @@ export default {
         this.composition.on('add', this.addTelemetry);
         this.composition.load();
         this.conditionCollection = this.domainObject.configuration ? this.domainObject.configuration.conditionCollection : [];
-        if (!this.conditionCollection.length) {this.addCondition(null, true)}
+        if (!this.conditionCollection.length) {
+            this.addCondition(null, true);
+        }
+        
     },
     methods: {
         addTelemetry(telemetryDomainObject) {
@@ -89,11 +97,29 @@ export default {
             //persist the condition DO so that we can do an openmct.objects.get on it and only persist the identifier in the conditionCollection of conditionSet
             this.openmct.objects.mutate(conditionDO, 'created', new Date());
 
+            this.currentConditionIdentifier = conditionDO.identifier;
             this.conditionCollection.unshift(conditionDO.identifier);
 
             let condition = new ConditionClass(conditionDO, this.openmct);
             this.conditions.push(condition);
         },
+        updateCurrentCondition(identifier) {
+            console.log('updateCurrentCondition from ConditionCollection', identifier);
+            this.currentConditionIdentifier = identifier;
+              // this.openmct.objects.get(identifier).then((obj) => {
+            //     if (this.conditionCollection.length > 1) {
+            //         console.log(this.conditionCollection.length)
+            //         this.conditionCollection.forEach((condition, index) => {
+            //             index === 0 ? condition.isCurrent = true : condition.isCurrent = false
+            //             console.log('conditionEdit', condition)
+            //         });
+            //     } else {
+            //         this.conditionCollection[0].isCurrent = true;
+            //     }
+ //         });
+            // this.conditionCollection = collection;
+            // this.$set(this.conditionCollection, , post)
+        },
         getConditionDomainObject(isDefault) {
             let conditionObj = {
                 isDefault: isDefault,

src/plugins/condition/components/ConditionEdit.vue

@@ -1,7 +1,7 @@
 <template>
 <div class="c-cs-editui__conditions"
      v-if="condition"
-     :class="['widget-condition', { 'widget-condition--current': condition.isCurrent }]"
+     :class="['widget-condition', { 'widget-condition--current': isCurrent && (isCurrent.key === conditionIdentifier.key) }]"
 >
     <div class="title-bar">
         <span
@@ -131,19 +131,24 @@
 
 <script>
 import { OPERATIONS } from '../utils/operations';
+// import { EventBus } from '../utils/eventbus.js';
+
 export default {
     inject: ['openmct', 'domainObject'],
     props: {
         conditionIdentifier: {
             type: Object,
             required: true
+        },
+        isCurrent: {
+            type: Object,
+            required: true
         }
     },
     data() {
         return {
             condition: this.condition,
             expanded: true,
-            conditionCollection: this.conditionCollection,
             telemetryObject: this.telemetryObject,
             telemetryMetadata: this.telemetryMetadata,
             operations: OPERATIONS,
@@ -154,9 +159,8 @@ export default {
         };
     },
     mounted() {
-        this.conditionCollection = this.domainObject.configuration.conditionCollection;
         this.openmct.objects.get(this.conditionIdentifier).then((obj => {
-            console.log('ConditionEdit obj', obj);
+            // console.log('ConditionEdit obj', obj);
             this.condition = obj;
             if (this.condition.output !== 'false' && this.condition.output !== 'true') {
                 this.$refs.outputSelect.value = 'string';
@@ -164,18 +168,23 @@ export default {
             }
             this.updateTelemetry();
         }));
+        this.updateCurrentCondition();
     },
     updated() {
-        this.updateCurrentCondition();
+        console.log('updated');
+        if (this.isCurrent && this.isCurrent.key === this.condition.key) {
+            this.updateCurrentCondition();
+        }
         this.persist();
     },
     methods: {
         removeCondition(ev) {
-            const conditionDiv = ev.target.closest('.conditionArea');
+            // const conditionDiv = ev.target.closest('.conditionArea');
-            const conditionCollectionDiv = conditionDiv.closest('.condition-collection');
+            // const conditionCollectionDiv = conditionDiv.closest('.condition-collection');
-            const index = Array.from(conditionCollectionDiv.children).indexOf(conditionDiv);
+            // const index = Array.from(conditionCollectionDiv.children).indexOf(conditionDiv);
 
-            this.domainObject.configuration.conditionCollection.splice(index, 1);
+            // this.domainObject.configuration.conditionCollection.splice(index, 1);
+            // this.updateCurrentCondition();
         },
         updateTelemetry() {
             if (this.hasTelemetry()) {
@@ -183,7 +192,7 @@ export default {
                     this.telemetryObject = obj;
                     this.telemetryMetadata = this.openmct.telemetry.getMetadata(this.telemetryObject).values();
                     this.selectedMetaDataKey = this.telemetryMetadata[0].key;
-                    console.log('ConditionEdit', this.telemetryObject, this.telemetryMetadata);
+                    // console.log('ConditionEdit', this.telemetryObject, this.telemetryMetadata);
                 });
             } else {
                 this.telemetryObject = null;
@@ -192,27 +201,32 @@ export default {
         hasTelemetry() {
             return this.condition.criteria.length && this.condition.criteria[0].key;
         },
-        persist(index) {
+        persist() {
-            if (index) {
+            this.openmct.objects.mutate(this.domainObject, 'isCurrent', this.condition.isCurrent);
-                this.openmct.objects.mutate(this.domainObject, `configuration.conditionCollection[${index}]`, this.domainObject.configuration.conditionCollection[index]);
-            } else {
-                this.openmct.objects.mutate(this.domainObject, 'configuration.conditionCollection', this.domainObject.configuration.conditionCollection);
-            }
         },
         updateCurrentCondition() {
+            // console.log('updateCurrentCondition called')
             //mutate / persist the condition domainObject
             //persist the condition DO so that we can do an openmct.objects.get on it and only persist the identifier in the conditionCollection of conditionSet
-            this.openmct.objects.mutate(this.condition, 'created', new Date());
+            // console.log('before mutate output',this.condition.output)
+            // this.openmct.objects.mutate(this.condition, "output", this.condition.output);
+            // console.log('after mutate output',this.condition.output)
             //
             // // TODO: replace based on telemetry
             // if (this.conditionCollection.length > 1) {
+            //     console.log(this.conditionCollection.length)
             //     this.conditionCollection.forEach((condition, index) => {
             //         index === 0 ? condition.isCurrent = true : condition.isCurrent = false
+            //         console.log('conditionEdit', condition)
             //     });
             // } else {
             //     this.conditionCollection[0].isCurrent = true;
             // }
-            // console.log(this.condition);
+            //console.log('this.conditionCollection', this.conditionCollection);
+            // console.log('this.conditionIdentifier', this.conditionIdentifier);
+            this.$emit('update-current-condition', this.conditionIdentifier);
+            // this.openmct.objects.mutate(this.condition, "isCurrent", this.condition.isCurrent);
+            // console.log('this.conditionCollection', this.conditionCollection);
             // console.log(this.conditionCollection);
         },
         getOutputBinary(ev) {
@@ -220,14 +234,15 @@ export default {
                 this.condition.output = ev.target.value;
                 this.stringOutputField = false;
             } else {
-                this.stringOutputField = true;
+                this.stringOutputField = true
             }
+            this.updateCurrentCondition();
         },
         getOutputString(ev) {
             this.condition.output = ev.target.value;
         },
         getOperationKey(ev) {
-            console.log(ev.target.value)
+            // console.log(ev.target.value)
             if (ev.target.value !== 'isUndefined' && ev.target.value !== 'isDefined') {
                 this.comparisonValueField = true;
             } else {

src/plugins/condition/components/ConditionSet.vue

@@ -2,9 +2,11 @@
 <div class="c-object-view u-contents">
     <div class="c-cs-edit w-condition-set">
         <div class="c-sw-edit__ui holder">
-            <CurrentOutput :condition="currentCondition" />
+            <CurrentOutput :condition="currentCondition"/>
             <TestData :is-editing="isEditing" />
-            <ConditionCollection :is-editing="isEditing"/>
+            <ConditionCollection :is-editing="isEditing"
+                                 @update-current-condition="updateCurrentcondition"
+            />
         </div>
     </div>
 </div>
@@ -15,6 +17,7 @@ import CurrentOutput from './CurrentOutput.vue';
 import TestData from './TestData.vue';
 import ConditionCollection from './ConditionCollection.vue';
 
+
 export default {
     inject: ["openmct", "domainObject"],
     components: {
@@ -32,12 +35,18 @@ export default {
         }
     },
     mounted() {
-        let conditionCollection = this.domainObject.configuration.conditionCollection;
+    },
-        this.currentConditionIdentifier = conditionCollection.length ? conditionCollection[0] : null;
+    methods: {
-        if (this.currentConditionIdentifier) {
+        updateCurrentcondition(identifier) {
+            this.currentConditionIdentifier = identifier;
+            console.log('identifier', identifier)
             this.openmct.objects.get(this.currentConditionIdentifier).then((obj) => {
                 this.currentCondition = obj;
+                console.log(`this.currentCondition`, this.currentCondition);
             });
+            // console.log('updateCurrentCondition from ConditionCollection', name);
+            // this.conditionCollection = collection;
+            // this.$set(this.conditionCollection, , post)
         }
     }
 };

src/plugins/condition/components/CurrentOutput.vue

@@ -36,7 +36,7 @@ export default {
         }
     },
     mounted() {
-
+        console.log('this.condition', this.condition);
     },
     methods: {
 

src/plugins/condition/utils/eventbus.js

@@ -0,0 +1,2 @@
+import Vue from 'vue';
+export const EventBus = new Vue();