criteria component WIP

This commit is contained in:
Joel McKinnon 2020-02-06 15:22:56 -08:00
parent 79557165a3
commit 8db6f8f633
4 changed files with 244 additions and 97 deletions

View File

@ -88,6 +88,16 @@
</ul> </ul>
<ul v-if="telemetry.length" <ul v-if="telemetry.length"
class="t-widget-condition-config" class="t-widget-condition-config"
>
<Criteria v-for="(criteria, index) in domainObject.configuration.criteria"
:key="criteria.identifier.key"
:telemetry="telemetry"
:criteria="criteria"
:index="index"
/>
</ul>
<!-- <ul v-if="telemetry.length"
class="t-widget-condition-config"
> >
<li v-for="(criteria, index) in domainObject.configuration.criteria" <li v-for="(criteria, index) in domainObject.configuration.criteria"
:key="criteria.identifier.key" :key="criteria.identifier.key"
@ -133,7 +143,7 @@
</span> </span>
</span> </span>
</li> </li>
</ul> </ul> -->
<div class="holder c-c-button-wrapper align-left"> <div class="holder c-c-button-wrapper align-left">
<span class="c-c-label-spacer"></span> <span class="c-c-label-spacer"></span>
<button <button
@ -175,12 +185,16 @@
</template> </template>
<script> <script>
import { OPERATIONS } from '../utils/operations'; // import { OPERATIONS } from '../utils/operations';
import ConditionClass from "@/plugins/condition/Condition"; import ConditionClass from "@/plugins/condition/Condition";
import Criteria from '../../condition/components/Criteria.vue';
import uuid from 'uuid'; import uuid from 'uuid';
export default { export default {
inject: ['openmct'], inject: ['openmct', 'domainObject'],
components: {
Criteria
},
props: { props: {
conditionIdentifier: { conditionIdentifier: {
type: Object, type: Object,
@ -194,14 +208,14 @@ export default {
type: Number, type: Number,
required: true required: true
}, },
isEditing: {
type: Boolean,
required: true
},
telemetry: { telemetry: {
type: Array, type: Array,
required: true, required: true,
default: () => [] default: () => []
},
isEditing: {
type: Boolean,
required: true
} }
}, },
data() { data() {
@ -210,16 +224,8 @@ export default {
currentCriteria: this.currentCriteria, currentCriteria: this.currentCriteria,
expanded: true, expanded: true,
trigger: 'any', trigger: 'any',
telemetryObj: this.telemetry,
telemetryMetadata: {},
operations: OPERATIONS,
selectedTelemetryObject: {},
selectedFieldObject: {},
selectedOperationObject: {},
operationValue: {},
selectedOutputKey: '', selectedOutputKey: '',
stringOutputField: {}, stringOutputField: {},
comparisonInputValue: {},
outputOptions: ['false', 'true', 'string'] outputOptions: ['false', 'true', 'string']
}; };
}, },
@ -234,7 +240,6 @@ export default {
}, },
updated() { updated() {
//validate telemetry exists, update criteria as needed //validate telemetry exists, update criteria as needed
this.validate();
this.persist(); this.persist();
}, },
methods: { methods: {
@ -256,21 +261,12 @@ export default {
this.$emit('set-move-index', Number(e.target.getAttribute('data-condition-index'))); this.$emit('set-move-index', Number(e.target.getAttribute('data-condition-index')));
}, },
initialize() { initialize() {
let criteriaId;
if (!this.domainObject.isDefault) { if (!this.domainObject.isDefault) {
this.setCurrentCriterion(0); this.setOutput();
criteriaId = this.currentCriteria.identifier;
this.setOutput(criteriaId);
this.updateTelemetryObjects(criteriaId);
this.setOperationObject(criteriaId);
this.conditionClass = new ConditionClass(this.domainObject, this.openmct); this.conditionClass = new ConditionClass(this.domainObject, this.openmct);
this.conditionClass.on('conditionResultUpdated', this.handleConditionResult.bind(this)); this.conditionClass.on('conditionResultUpdated', this.handleConditionResult.bind(this));
} }
}, },
setCurrentCriterion(index) {
console.log('this.domainObject.configuration', this.domainObject.configuration);
this.currentCriteria = this.domainObject.configuration.criteria[index];
},
destroy() { destroy() {
// this.conditionClass.off('conditionResultUpdated', this.handleConditionResult.bind(this)); // this.conditionClass.off('conditionResultUpdated', this.handleConditionResult.bind(this));
// if (this.conditionClass && typeof this.conditionClass.destroy === 'function') { // if (this.conditionClass && typeof this.conditionClass.destroy === 'function') {
@ -284,15 +280,6 @@ export default {
this.selectedOperationKey = {}; this.selectedOperationKey = {};
this.operationValue = {}; this.operationValue = {};
}, },
validate(criteriaId) {
if (this.hasTelemetry(criteriaId) && !this.getTelemetryKey(criteriaId)) {
this.reset();
} else {
if (!this.conditionClass) {
this.initialize();
}
}
},
handleConditionResult(args) { handleConditionResult(args) {
this.$emit('conditionResultUpdated', { this.$emit('conditionResultUpdated', {
id: this.conditionIdentifier, id: this.conditionIdentifier,
@ -308,7 +295,7 @@ export default {
index: Number(ev.target.closest('.widget-condition').getAttribute('data-condition-index')) index: Number(ev.target.closest('.widget-condition').getAttribute('data-condition-index'))
}); });
}, },
setOutput(value) { setOutput() {
let conditionOutput = this.domainObject.configuration.output; let conditionOutput = this.domainObject.configuration.output;
if (!conditionOutput) { if (!conditionOutput) {
@ -323,67 +310,67 @@ export default {
} }
} }
}, },
setOperationObject(criteriaId) { // setOperationObject(criteriaId) {
if (this.selectedFieldObject[criteriaId] !== undefined) { // if (this.selectedFieldObject[criteriaId] !== undefined) {
if (this.operationValue[criteriaId] !== undefined) { // if (this.operationValue[criteriaId] !== undefined) {
for (let i=0, ii=this.operations.length; i < ii; i++) { // for (let i=0, ii=this.operations.length; i < ii; i++) {
if (this.currentCriteria.operation === this.operations[i].name) { // if (this.currentCriteria.operation === this.operations[i].name) {
this.selectedFieldObject[criteriaId] = this.operations[i].name; // this.selectedFieldObject[criteriaId] = this.operations[i].name;
this.comparisonInputValue[criteriaId] = this.operations[i].inputCount > 0; // this.comparisonInputValue[criteriaId] = this.operations[i].inputCount > 0;
if (this.comparisonInputValue[criteriaId]) { // if (this.comparisonInputValue[criteriaId]) {
this.operationValue[criteriaId] = this.currentCriteria.input[0]; // this.operationValue[criteriaId] = this.currentCriteria.input[0];
} // }
} // }
} // }
} // }
} // }
}, // },
updateTelemetryObjects(criteriaId) { // updateTelemetryObjects(criteriaId) {
if (this.hasTelemetry(criteriaId)) { // if (this.hasTelemetry(criteriaId)) {
this.openmct.objects.get(criteriaId).then((obj) => { // this.openmct.objects.get(criteriaId).then((obj) => {
this.telemetryMetadata[criteriaId] = this.openmct.telemetry.getMetadata(obj).values(); // this.telemetryMetadata[criteriaId] = this.openmct.telemetry.getMetadata(obj).values();
this.selectedFieldObject[criteriaId] = this.getTelemetryMetadataKey(criteriaId); // this.selectedFieldObject[criteriaId] = this.getTelemetryMetadataKey(criteriaId);
this.selectedTelemetryObject[criteriaId] = this.getTelemetryObject(criteriaId); // this.selectedTelemetryObject[criteriaId] = this.getTelemetryObject(criteriaId);
// console.log('this.telemetryMetadata[criteriaId]', this.telemetryMetadata[criteriaId]) // // console.log('this.telemetryMetadata[criteriaId]', this.telemetryMetadata[criteriaId])
// console.log('this.selectedMetadataKey[criteriaId]', this.selectedMetadataKey[criteriaId]) // // console.log('this.selectedMetadataKey[criteriaId]', this.selectedMetadataKey[criteriaId])
console.log('this.selectedTelemetryObject[criteriaId]', this.selectedTelemetryObject[criteriaId]) // console.log('this.selectedTelemetryObject[criteriaId]', this.selectedTelemetryObject[criteriaId])
}); // });
} // }
}, // },
getTelemetryMetadataKey(criteriaId) { // getTelemetryMetadataKey(criteriaId) {
let index = -1; // let index = -1;
if (criteriaId) { // if (criteriaId) {
index = _.findIndex(this.telemetryMetadata[criteriaId], (metadata) => { // index = _.findIndex(this.telemetryMetadata[criteriaId], (metadata) => {
return metadata.key === this.currentCriteria.metadataKey; // return metadata.key === this.currentCriteria.metadataKey;
}); // });
} // }
return this.telemetryMetadata[criteriaId].length && index > -1 ? this.telemetryMetadata[criteriaId][index].key : '- Select Telemetry -'; // return this.telemetryMetadata[criteriaId].length && index > -1 ? this.telemetryMetadata[criteriaId][index].key : '- Select Telemetry -';
}, // },
getTelemetryObject(criteriaId) { // getTelemetryObject(criteriaId) {
let index = -1; // let index = -1;
if (this.currentCriteria && criteriaId) { // if (this.currentCriteria && criteriaId) {
let conditionKey = this.openmct.objects.makeKeyString(criteriaId); // let conditionKey = this.openmct.objects.makeKeyString(criteriaId);
index = _.findIndex(this.telemetry, (obj) => { // index = _.findIndex(this.telemetry, (obj) => {
let key = this.openmct.objects.makeKeyString(obj.identifier) // let key = this.openmct.objects.makeKeyString(obj.identifier)
return key === conditionKey // return key === conditionKey
}); // });
} // }
return this.telemetry.length && index > -1 ? this.telemetry[index] : ''; // return this.telemetry.length && index > -1 ? this.telemetry[index] : '';
}, // },
hasTelemetry(criteriaId) { // hasTelemetry(criteriaId) {
// TODO: check parent domainObject.composition.hasTelemetry // // TODO: check parent domainObject.composition.hasTelemetry
return this.currentCriteria && criteriaId; // return this.currentCriteria && criteriaId;
}, // },
updateConditionCriteria(criteriaId) { // updateConditionCriteria(criteriaId) {
if (this.domainObject.configuration.criteria.length) { // if (this.domainObject.configuration.criteria.length) {
let criterion = this.domainObject.configuration.criteria[0]; // let criterion = this.domainObject.configuration.criteria[0];
criterion.key = this.selectedTelemetryKey[criteriaId]; // criterion.key = this.selectedTelemetryKey[criteriaId];
criterion.metadataKey = this.selectedMetadataKey[criteriaId]; // criterion.metadataKey = this.selectedMetadataKey[criteriaId];
criterion.operation = this.selectedOperationName[criteriaId]; // criterion.operation = this.selectedOperationName[criteriaId];
criterion.input = this.operationValue; // criterion.input = this.operationValue;
} // }
}, // },
persist() { persist() {
// this.updateConditionCriteria(); // this.updateConditionCriteria();
this.openmct.objects.mutate(this.domainObject, 'configuration', this.domainObject.configuration); this.openmct.objects.mutate(this.domainObject, 'configuration', this.domainObject.configuration);

View File

@ -258,6 +258,39 @@ export default {
}); });
this.persist(); this.persist();
}, },
updateTelemetryObjects(identifier) {
if (this.hasTelemetry(identifier)) {
this.openmct.objects.get(identifier).then((obj) => {
this.telemetryMetadata[identifier] = this.openmct.telemetry.getMetadata(obj).values();
this.selectedFieldObject[identifier] = this.getTelemetryMetadataKey(identifier);
this.selectedTelemetryObject[identifier] = this.getTelemetryObject(identifier);
// console.log('this.telemetryMetadata[identifier]', this.telemetryMetadata[identifier])
// console.log('this.selectedMetadataKey[identifier]', this.selectedMetadataKey[identifier])
console.log('this.selectedTelemetryObject[identifier]', this.selectedTelemetryObject[identifier])
});
}
},
getTelemetryMetadataKey(identifier) {
let index = -1;
if (identifier) {
index = _.findIndex(this.telemetryMetadata[identifier], (metadata) => {
return metadata.key === this.currentCriteria.metadataKey;
});
}
return this.telemetryMetadata[identifier].length && index > -1 ? this.telemetryMetadata[identifier][index].key : '- Select Telemetry -';
},
getTelemetryObject(identifier) {
let index = -1;
if (this.currentCriteria && identifier) {
let conditionKey = this.openmct.objects.makeKeyString(identifier);
index = _.findIndex(this.telemetry, (obj) => {
let key = this.openmct.objects.makeKeyString(obj.identifier)
return key === conditionKey
});
}
return this.telemetry.length && index > -1 ? this.telemetry[index] : '';
},
persist() { persist() {
this.openmct.objects.mutate(this.domainObject, 'configuration.conditionCollection', this.conditionCollection); this.openmct.objects.mutate(this.domainObject, 'configuration.conditionCollection', this.conditionCollection);
} }

View File

@ -34,7 +34,7 @@ export default {
}, },
mounted() { mounted() {
let conditionCollection = this.domainObject.configuration.conditionCollection; let conditionCollection = this.domainObject.configuration.conditionCollection;
// this.currentConditionIdentifier = conditionCollection.length ? this.updateCurrentCondition(conditionCollection[0]) : null; this.currentConditionIdentifier = conditionCollection.length ? this.updateCurrentCondition(conditionCollection[0]) : null;
}, },
methods: { methods: {
setCurrentCondition() { setCurrentCondition() {

View File

@ -0,0 +1,127 @@
<template>
<li class="has-local-controls t-condition">
<label>{{ index === 0 ? 'when' : 'and when' }}</label>
<span class="t-configuration">
<span class="controls">
<select v-model="selectedTelemetryObject">
<option value="">- Select Telemetry -</option>
<option v-for="telemetryOption in telemetryObj"
:key="telemetryOption.identifier.key"
:value="telemetryOption.identifier"
>
{{ telemetryOption.name }}
</option>
</select>
</span>
<span class="controls">
<select v-model="selectedFieldObject">
<option value="">- Select Field -</option>
<option v-for="option in telemetryMetadata[currentCriteria.identifier]"
:key="option.key"
:value="option.key"
>
{{ option.name }}
</option>
</select>
</span>
<span class="controls">
<select v-model="selectedOperationObject">
<option value="">- Select Comparison -</option>
<option v-for="option in operations"
:key="option.name"
:value="option.name"
>
{{ option.text }}
</option>
</select>
<input class="t-condition-name-input"
type="text"
>
</span>
</span>
</li>
</template>
<script>
import { OPERATIONS } from '../utils/operations';
export default {
inject: ["openmct", "domainObject"],
props: {
telemetry: {
type: Array,
required: true,
default: () => []
}
},
data() {
return {
telemetryObj: this.telemetry,
telemetryMetadata: {},
operations: OPERATIONS,
selectedTelemetryObject: {},
selectedFieldObject: {},
selectedOperationObject: {},
operationValue: {},
comparisonInputValue: {}
}
},
mounted() {
this.openmct.objects.get(this.conditionIdentifier).then((domainObject => {
this.domainObject = domainObject;
this.initialize();
}));
},
updated() {
this.validate();
},
computed: {
},
methods: {
initialize() {
},
setOperationObject(identifier) {
if (this.selectedFieldObject[identifier] !== undefined) {
if (this.operationValue[identifier] !== undefined) {
for (let i=0, ii=this.operations.length; i < ii; i++) {
if (this.currentCriteria.operation === this.operations[i].name) {
this.selectedFieldObject[identifier] = this.operations[i].name;
this.comparisonInputValue[identifier] = this.operations[i].inputCount > 0;
if (this.comparisonInputValue[identifier]) {
this.operationValue[identifier] = this.currentCriteria.input[0];
}
}
}
}
}
},
updateConditionCriteria(identifier) {
if (this.domainObject.configuration.criteria.length) {
let criterion = this.domainObject.configuration.criteria[0];
criterion.key = this.selectedTelemetryKey[identifier];
criterion.metadataKey = this.selectedMetadataKey[identifier];
criterion.operation = this.selectedOperationName[identifier];
criterion.input = this.operationValue;
}
},
hasTelemetry(identifier) {
// TODO: check parent domainObject.composition.hasTelemetry
return this.currentCriteria && identifier;
}
// validate(criteriaId) {
// if (this.hasTelemetry(criteriaId) && !this.getTelemetryKey(criteriaId)) {
// this.reset();
// } else {
// if (!this.conditionClass) {
// this.initialize();
// }
// }
// }
}
};
</script>