ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-18 20:57:53 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'activity-state-display' of https://github.com/nasa/openmct into activity-states-and-compact-view

Browse Source
This commit is contained in:
Shefali 2024-01-19 11:02:56 -08:00
commit 9fbd4a519d
6 changed files with 119 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/plugins/plan/components/ActivityTimeline.vue
View File

@ -135,6 +135,7 @@ export default {
default: 22
}
},
emits: ['activitySelected'],
data() {
return {
lineHeight: 10
@ -142,30 +143,11 @@ export default {
},
methods: {
setSelectionForActivity(activity, event) {
const element = event.currentTarget;
const multiSelect = event.metaKey;
event.stopPropagation();
this.openmct.selection.select(
[
{
element: element,
context: {
type: 'activity',
activity: activity
}
},
{
element: this.openmct.layout.$refs.browseObject.$el,
context: {
item: this.domainObject,
supportsMultiSelect: true
}
}
],
multiSelect
);
this.$emit('activitySelected', {
event,
selection: activity.selection
});
}
}
};

56
src/plugins/plan/components/PlanView.vue
View File

@ -47,6 +47,7 @@
:width="group.width"
:is-nested="options.isChildObject"
:status="status"
@activity-selected="selectActivity"
/>
</div>
</div>
@ -134,7 +135,7 @@ export default {
this.swimlaneVisibility = this.configuration.swimlaneVisibility;
this.clipActivityNames = this.configuration.clipActivityNames;
if (this.domainObject.type === 'plan') {
this.planData = getValidatedData(this.domainObject);
this.getPlanData(this.domainObject);
}
const canvas = document.createElement('canvas');
@ -177,6 +178,9 @@ export default {
this.planViewConfiguration.destroy();
},
methods: {
getPlanData(object) {
this.planData = getValidatedData(object);
},
activityNameFitsRect(activityName, rectWidth) {
return this.getTextWidth(activityName) + TEXT_LEFT_PADDING < rectWidth;
},
@ -215,9 +219,7 @@ export default {
callback: () => {
this.removeFromComposition(this.planObject);
this.planObject = domainObject;
this.planData = getValidatedData(domainObject);
this.setStatus(this.openmct.status.get(domainObject.identifier));
this.setScaleAndGenerateActivities();
this.handleSelectFileChange();
dialog.dismiss();
}
},
@ -237,9 +239,7 @@ export default {
} else {
this.planObject = domainObject;
this.swimlaneVisibility = this.configuration.swimlaneVisibility;
this.planData = getValidatedData(domainObject);
this.setStatus(this.openmct.status.get(domainObject.identifier));
this.setScaleAndGenerateActivities();
this.handleSelectFileChange(domainObject);
}
},
handleConfigurationChange(newConfiguration) {
@ -259,8 +259,10 @@ export default {
this.setScaleAndGenerateActivities();
},
handleSelectFileChange() {
this.planData = getValidatedData(this.domainObject);
handleSelectFileChange(domainObject) {
const object = domainObject || this.domainObject;
this.getPlanData(object);
this.setStatus(this.openmct.status.get(object.identifier));
this.setScaleAndGenerateActivities();
},
removeFromComposition(domainObject) {
@ -434,7 +436,7 @@ export default {
return;
}
rawActivities.forEach((rawActivity) => {
rawActivities.forEach((rawActivity, index) => {
if (!this.isActivityInBounds(rawActivity)) {
return;
}
@ -481,14 +483,10 @@ export default {
const activity = {
color: color,
textColor: textColor,
name: rawActivity.name,
exceeds: {
start: this.xScale(this.viewBounds.start) > this.xScale(rawActivity.start),
end: this.xScale(this.viewBounds.end) < this.xScale(rawActivity.end)
},
start: rawActivity.start,
end: rawActivity.end,
description: rawActivity.description,
row: currentRow,
textLines: textLines,
textStart: textStart,
@ -498,7 +496,10 @@ export default {
rectEnd: showTextInsideRect ? rectX2 : textStart + textWidth,
rectWidth: rectWidth,
clipPathId: this.getClipPathId(groupName, rawActivity, currentRow),
id: rawActivity.id
selection: {
groupName,
index
}
};
activitiesByRow[currentRow].push(activity);
});
@ -575,6 +576,31 @@ export default {
const activityName = activity.name.toLowerCase().replace(/ /g, '-');
return `${groupName}-${activityName}-${activity.start}-${activity.end}-${row}`;
},
selectActivity({ event, selection }) {
const element = event.currentTarget;
const multiSelect = event.metaKey;
const { groupName, index } = selection;
const rawActivity = this.planData[groupName][index];
this.openmct.selection.select(
[
{
element: element,
context: {
type: 'activity',
activity: rawActivity
}
},
{
element: this.openmct.layout.$refs.browseObject.$el,
context: {
item: this.domainObject,
supportsMultiSelect: true
}
}
],
multiSelect
);
}
}
};

17
src/plugins/plan/inspector/components/PlanActivitiesView.vue
View File

@ -50,6 +50,7 @@
<script>
import { getPreciseDuration } from 'utils/duration';
import { getDisplayProperties } from '../../util.js';
import PlanActivityPropertiesView from './PlanActivityPropertiesView.vue';
import PlanActivityStatusView from './PlanActivityStatusView.vue';
import PlanActivityTimeView from './PlanActivityTimeView.vue';
@ -166,14 +167,20 @@ export default {
}
}
};
activity.metadata = {};
if (selectedActivity.description) {
activity.metadata = {
description: {
label: propertyLabels.description,
value: selectedActivity.description
}
activity.metadata.description = {
label: propertyLabels.description,
value: selectedActivity.description
};
}
const displayProperties = getDisplayProperties(selectedActivity);
activity.metadata = {
...activity.metadata,
...displayProperties
};
this.activities[index] = activity;
});
},

21
src/plugins/plan/inspector/components/PlanActivityStatusView.vue
View File

@ -24,9 +24,13 @@
<div>
<div class="u-contents">
<div class="c-inspect-properties__header">{{ heading }}</div>
<form name="activityStatus">
<div class="c-inspect-properties__row">
<div class="c-inspect-properties__label" title="Status">Status</div>
<div class="c-inspect-properties__value">{{ statusLabel }}</div>
</div>
<form name="activityStatus" class="span-all">
<select v-model="currentStatusKey" name="setActivityStatus" @change="changeActivityStatus">
<option v-for="status in activityStates" :key="status.key" :value="status.label">
<option v-for="status in activityStates" :key="status.key" :value="status.key">
{{ status.label }}
</option>
</select>
@ -39,7 +43,7 @@
const activityStates = [
{
key: '',
label: '- Select Activity Status -'
label: '- Set Status -'
},
{
key: 'active',
@ -87,6 +91,15 @@ export default {
currentStatusKey: activityStates[0].key
};
},
computed: {
statusLabel() {
let defaultStatus = activityStates.find((state) => state.key === 'notStarted');
let currentStatus = activityStates.find(
(state) => this.currentStatusKey !== '' && state.key === this.currentStatusKey
);
return currentStatus?.label || defaultStatus.label;
}
},
watch: {
executionState() {
this.setActivityStatus();
@ -97,7 +110,7 @@ export default {
},
methods: {
setActivityStatus() {
this.currentStatusKey = this.executionState;
this.currentStatusKey = this.executionState ?? this.activityStates[0].key;
},
changeActivityStatus() {
if (this.currentStatusKey === '') {

39
src/plugins/plan/util.js
View File

@ -60,6 +60,10 @@ export function getValidatedData(domainObject) {
});
}
if (sourceMap.displayProperties) {
groupActivity.displayProperties = sourceMap.displayProperties;
}
if (!mappedJson[groupIdKey]) {
mappedJson[groupIdKey] = [];
}
@ -125,6 +129,41 @@ export function getFilteredValues(activity) {
return values;
}
export function getDisplayProperties(activity) {
let displayProperties = {};
if (activity?.displayProperties) {
const keys = Object.keys(activity.displayProperties);
if (keys.length) {
keys.forEach((key) => {
const displayPropertyLabel = activity.displayProperties[key];
const value = _.get(activity, key);
if (value) {
displayProperties[key] = {
label: displayPropertyLabel,
value
};
}
});
}
} else if (activity?.properties) {
const keys = Object.keys(activity?.properties);
if (keys.length) {
keys.forEach((key) => {
const displayPropertyLabel = key;
const value = activity.properties[key];
if (value) {
displayProperties[key] = {
label: displayPropertyLabel,
value
};
}
});
}
}
return displayProperties;
}
export function getContrastingColor(hexColor) {
function cutHex(h, start, end) {
const hStr = h.charAt(0) === '#' ? h.substring(1, 7) : h;

8
src/plugins/timelist/TimelistComponent.vue
View File

@ -438,9 +438,11 @@ export default {
this.pastActivitiesCount = this.pastActivitiesCount + 1;
}
if (!activity.key) {
activity.key = uuid();
}
if (activity.id) {
activity.key = activity.id;
} else if (!activity.key) {
activity.key = uuid();
}
activity.duration = activity.end - activity.start;