WIP: separating criterion level logic to its own component

This commit is contained in:
Joel McKinnon 2020-02-11 10:28:59 -08:00
parent 8db6f8f633
commit 1f2b5ec5c8
2 changed files with 102 additions and 140 deletions

View File

@ -89,61 +89,14 @@
<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" <Criterion v-for="(criterion, index) in domainObject.configuration.criteria"
:key="criteria.identifier.key" :key="index"
:telemetry="telemetry" :telemetry="telemetry"
:criteria="criteria" :criterion="criterion"
:condition="domainObject"
:index="index" :index="index"
/> />
</ul> </ul>
<!-- <ul v-if="telemetry.length"
class="t-widget-condition-config"
>
<li v-for="(criteria, index) in domainObject.configuration.criteria"
:key="criteria.identifier.key"
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>
</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
@ -187,13 +140,13 @@
<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 Criterion from '../../condition/components/Criterion.vue';
import uuid from 'uuid'; import uuid from 'uuid';
export default { export default {
inject: ['openmct', 'domainObject'], inject: ['openmct', 'domainObject'],
components: { components: {
Criteria Criterion
}, },
props: { props: {
conditionIdentifier: { conditionIdentifier: {
@ -243,6 +196,13 @@ export default {
this.persist(); this.persist();
}, },
methods: { methods: {
initialize() {
if (!this.domainObject.isDefault) {
this.setOutput();
this.conditionClass = new ConditionClass(this.domainObject, this.openmct);
this.conditionClass.on('conditionResultUpdated', this.handleConditionResult.bind(this));
}
},
addCriteria() { addCriteria() {
const criteriaObject = { const criteriaObject = {
operation: '', operation: '',
@ -260,13 +220,6 @@ export default {
dragStart(e) { dragStart(e) {
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() {
if (!this.domainObject.isDefault) {
this.setOutput();
this.conditionClass = new ConditionClass(this.domainObject, this.openmct);
this.conditionClass.on('conditionResultUpdated', this.handleConditionResult.bind(this));
}
},
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') {
@ -310,58 +263,38 @@ export default {
} }
} }
}, },
// setOperationObject(criteriaId) { updateTelemetryObjects(criteriaId) {
// if (this.selectedFieldObject[criteriaId] !== undefined) { if (this.hasTelemetry(criteriaId)) {
// if (this.operationValue[criteriaId] !== undefined) { this.openmct.objects.get(criteriaId).then((obj) => {
// for (let i=0, ii=this.operations.length; i < ii; i++) { this.telemetryMetadata[criteriaId] = this.openmct.telemetry.getMetadata(obj).values();
// if (this.currentCriteria.operation === this.operations[i].name) { this.selectedFieldObject[criteriaId] = this.getTelemetryMetadataKey(criteriaId);
// this.selectedFieldObject[criteriaId] = this.operations[i].name; this.selectedTelemetryObject[criteriaId] = this.getTelemetryObject(criteriaId);
// console.log('this.telemetryMetadata[criteriaId]', this.telemetryMetadata[criteriaId])
// this.comparisonInputValue[criteriaId] = this.operations[i].inputCount > 0; // console.log('this.selectedMetadataKey[criteriaId]', this.selectedMetadataKey[criteriaId])
// if (this.comparisonInputValue[criteriaId]) { console.log('this.selectedTelemetryObject[criteriaId]', this.selectedTelemetryObject[criteriaId])
// this.operationValue[criteriaId] = this.currentCriteria.input[0]; });
// } }
// } },
// } getTelemetryMetadataKey(criteriaId) {
// } let index = -1;
// } if (criteriaId) {
// }, index = _.findIndex(this.telemetryMetadata[criteriaId], (metadata) => {
// updateTelemetryObjects(criteriaId) { return metadata.key === this.currentCriteria.metadataKey;
// if (this.hasTelemetry(criteriaId)) { });
// this.openmct.objects.get(criteriaId).then((obj) => { }
// this.telemetryMetadata[criteriaId] = this.openmct.telemetry.getMetadata(obj).values(); return this.telemetryMetadata[criteriaId].length && index > -1 ? this.telemetryMetadata[criteriaId][index].key : '- Select Telemetry -';
// this.selectedFieldObject[criteriaId] = this.getTelemetryMetadataKey(criteriaId); },
// this.selectedTelemetryObject[criteriaId] = this.getTelemetryObject(criteriaId); getTelemetryObject(criteriaId) {
// // console.log('this.telemetryMetadata[criteriaId]', this.telemetryMetadata[criteriaId]) let index = -1;
// // console.log('this.selectedMetadataKey[criteriaId]', this.selectedMetadataKey[criteriaId]) if (this.currentCriteria && criteriaId) {
// console.log('this.selectedTelemetryObject[criteriaId]', this.selectedTelemetryObject[criteriaId]) let conditionKey = this.openmct.objects.makeKeyString(criteriaId);
// }); index = _.findIndex(this.telemetry, (obj) => {
// } let key = this.openmct.objects.makeKeyString(obj.identifier)
// }, return key === conditionKey
// getTelemetryMetadataKey(criteriaId) { });
// let index = -1; }
// if (criteriaId) { return this.telemetry.length && index > -1 ? this.telemetry[index] : '';
// index = _.findIndex(this.telemetryMetadata[criteriaId], (metadata) => { },
// return metadata.key === this.currentCriteria.metadataKey;
// });
// }
// return this.telemetryMetadata[criteriaId].length && index > -1 ? this.telemetryMetadata[criteriaId][index].key : '- Select Telemetry -';
// },
// getTelemetryObject(criteriaId) {
// let index = -1;
// if (this.currentCriteria && criteriaId) {
// let conditionKey = this.openmct.objects.makeKeyString(criteriaId);
// 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] : '';
// },
// hasTelemetry(criteriaId) {
// // TODO: check parent domainObject.composition.hasTelemetry
// 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];
@ -427,6 +360,10 @@ export default {
updateCurrentCondition() { updateCurrentCondition() {
this.$emit('updateCurrentCondition', this.conditionIdentifier); this.$emit('updateCurrentCondition', this.conditionIdentifier);
},
hasTelemetry(identifier) {
// TODO: check parent domainObject.composition.hasTelemetry
return this.currentCriteria && identifier;
} }
} }
} }

View File

@ -5,7 +5,7 @@
<span class="controls"> <span class="controls">
<select v-model="selectedTelemetryObject"> <select v-model="selectedTelemetryObject">
<option value="">- Select Telemetry -</option> <option value="">- Select Telemetry -</option>
<option v-for="telemetryOption in telemetryObj" <option v-for="telemetryOption in telemetry"
:key="telemetryOption.identifier.key" :key="telemetryOption.identifier.key"
:value="telemetryOption.identifier" :value="telemetryOption.identifier"
> >
@ -16,7 +16,7 @@
<span class="controls"> <span class="controls">
<select v-model="selectedFieldObject"> <select v-model="selectedFieldObject">
<option value="">- Select Field -</option> <option value="">- Select Field -</option>
<option v-for="option in telemetryMetadata[currentCriteria.identifier]" <option v-for="option in telemetryMetadata"
:key="option.key" :key="option.key"
:value="option.key" :value="option.key"
> >
@ -47,17 +47,28 @@
import { OPERATIONS } from '../utils/operations'; import { OPERATIONS } from '../utils/operations';
export default { export default {
inject: ["openmct", "domainObject"], inject: ['openmct'],
props: { props: {
criterion: {
type: Object,
required: true
},
telemetry: { telemetry: {
type: Array, type: Array,
required: true, required: true,
default: () => [] default: () => []
},
index: {
type: Number,
required: true
},
condition: {
type: Object,
required: true
} }
}, },
data() { data() {
return { return {
telemetryObj: this.telemetry,
telemetryMetadata: {}, telemetryMetadata: {},
operations: OPERATIONS, operations: OPERATIONS,
selectedTelemetryObject: {}, selectedTelemetryObject: {},
@ -68,51 +79,65 @@ export default {
} }
}, },
mounted() { mounted() {
this.openmct.objects.get(this.conditionIdentifier).then((domainObject => { console.log('criterion', this.criterion);
this.domainObject = domainObject; console.log('condition', this.condition);
this.initialize(); this.initialize();
}));
}, },
updated() { updated() {
this.validate(); // this.validate();
},
computed: {
}, },
methods: { methods: {
initialize() { initialize() {
// 1. need to get values to appear in select menus and determine what should be selected
this.setTelemetrySelects()
// 2. for operation menu, show input unless isDefined, isUndefined are selected
// this.setOperationInput()
}, },
setOperationObject(identifier) { setTelemetrySelects() {
if (this.selectedFieldObject[identifier] !== undefined) { console.log('this.domainObject', this.domainObject);
if (this.operationValue[identifier] !== undefined) {
if (this.criterion.telemetryName) {
this.selectedTelemetryObject.name = this.criterion.telemetryName;
} else {
this.telemetryObj[0].name = '- Select Telemetry -';
this.selectedTelemetryObject.name = '- Select Telemetry -';
}
this.openmct.objects.get(this.domainObject.identifier).then((condition) => {
// this.telemetryMetadata = this.openmct.telemetry.getMetadata(condition).values();
console.log('condition', condition);
});
// this.selectedFieldObject = this.getTelemetryMetadataKey();
// this.selectedTelemetryObject = this.getTelemetryObject();
// console.log('this.telemetryMetadata', this.telemetryMetadata)
// console.log('this.selectedMetadataKey', this.selectedMetadataKey)
// console.log('this.selectedTelemetryObject', this.selectedTelemetryObject)
},
setOperationInput() {
if (this.selectedFieldObject !== undefined) {
if (this.operationValue !== 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[identifier] = this.operations[i].name; this.selectedFieldObject = this.operations[i].name;
this.comparisonInputValue[identifier] = this.operations[i].inputCount > 0; this.comparisonInputValue = this.operations[i].inputCount > 0;
if (this.comparisonInputValue[identifier]) { if (this.comparisonInputValue) {
this.operationValue[identifier] = this.currentCriteria.input[0]; this.operationValue = 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) { hasTelemetry(identifier) {
// TODO: check parent domainObject.composition.hasTelemetry // TODO: check parent domainObject.composition.hasTelemetry
return this.currentCriteria && identifier; return this.currentCriteria && identifier;
} }
// validate(criteriaId) { // validate(criteriaId) {
// if (this.hasTelemetry(criteriaId) && !this.getTelemetryKey(criteriaId)) { // if (this.hasTelemetry(criteriaId) && !this.getTelemetryKey(criteriaId)) {
// this.reset(); // this.reset();