ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-03-12 23:44:08 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

working prototype for custom resizing swimlane height

Browse Source
This commit is contained in:
David Tsay 2025-02-27 10:01:53 -08:00
parent 4345722fe0
commit af912db7aa
3 changed files with 9 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/plugins/timeline/TimelineObjectView.vue
View File

@ -82,7 +82,7 @@ export default {
},
computed: {
sizeString() {
return `${this.size}px`;
return `${this.size}%`;
}
},
watch: {

14
src/plugins/timeline/TimelineViewLayout.vue
View File

@ -72,10 +72,9 @@
<script>
import _ from 'lodash';
import { identifierEquals } from 'objectUtils';
import { useDragResizer } from 'utils/vue/useDragResizer.js';
import { useFlexContainers } from 'utils/vue/useFlexContainers.js';
import { inject, onMounted, provide, ref } from 'vue';
import { inject, provide, ref } from 'vue';
import SwimLane from '@/ui/components/swim-lane/SwimLane.vue';
import ResizeHandle from '@/ui/layout/ResizeHandle/ResizeHandle.vue';
@ -132,9 +131,6 @@ export default {
// Flex containers - Swimlane height
const timelineHolder = ref(null);
onMounted(() => {
console.log(timelineHolder.value);
});
const {
addContainer,
@ -149,10 +145,10 @@ export default {
function getContainerSize(item) {
const containerforItem = containers.value.find((container) =>
identifierEquals(container.domainObjectIdentifier, item.identifier)
openmct.objects.areIdsEqual(container.domainObjectIdentifier, item.domainObject.identifier)
);
return containerforItem.size;
return containerforItem?.size;
}
return {
@ -246,7 +242,9 @@ export default {
};
this.items.push(item);
this.addContainer(item);
const container = new Container(domainObject);
this.addContainer(container);
},
removeItem(identifier) {
let index = this.items.findIndex((item) =>

3
src/utils/vue/useFlexContainers.js
View File

@ -1,3 +1,4 @@
import _ from 'lodash';
import { ref } from 'vue';
export function useFlexContainers(element, { rowsLayout, minContainerSize = 5, callback }) {
@ -72,7 +73,7 @@ export function useFlexContainers(element, { rowsLayout, minContainerSize = 5, c
}
// Resize oldItems to fit inside remaining space;
const oldItems = items.filter((item) => item !== newItem);
const oldItems = items.filter((item) => !_.isEqual(item, newItem));
const remainingSize = 100 - newItem.size;
oldItems.forEach((item) => {