diff --git a/web/app/src/components/TasksTable.vue b/web/app/src/components/TasksTable.vue
index 334cc784..f87ee6d8 100644
--- a/web/app/src/components/TasksTable.vue
+++ b/web/app/src/components/TasksTable.vue
@@ -5,7 +5,7 @@
:activeStatuses="shownStatuses"
@click="toggleStatusFilter"
/>
-
+
@@ -74,7 +74,8 @@ export default {
initialSort: [
{ column: "updated", dir: "desc" },
],
- height: "300px", // Must be set in order for the virtual DOM to function correctly.
+ height: "100%", // Must be set in order for the virtual DOM to function correctly.
+ maxHeight: "100%",
data: [], // Will be filled via a Flamenco API request.
selectable: false, // The active task is tracked by click events.
};
@@ -124,6 +125,8 @@ export default {
// let tasks = data.tasks.map((j) => API.TaskUpdate.constructFromObject(j));
this.tabulator.setData(data.tasks);
this._refreshAvailableStatuses();
+
+ this._setTableHeight();
},
processTaskUpdate(taskUpdate) {
// updateData() will only overwrite properties that are actually set on
@@ -171,7 +174,26 @@ export default {
if (!row) return
if (row.reformat) row.reformat();
else if (row.reinitialize) row.reinitialize(true);
+ },
+ _setTableHeight() {
+ let jobDetailsColumn = document.getElementById('col-job-details');
+ let taskListTable = document.getElementById('task-list-container');
+
+ if (!jobDetailsColumn || !taskListTable) {
+ return;
+ }
+
+ let tableHeight = jobDetailsColumn.clientHeight - taskListTable.offsetTop;
+ this.tabulator.setHeight(tableHeight);
}
}
};
+
+function resizeTasksListTable() {
+ if (window.tasksTableVue) {
+ window.tasksTableVue._setTableHeight();
+ }
+}
+
+window.addEventListener('resize', resizeTasksListTable);
diff --git a/web/app/src/views/JobsView.vue b/web/app/src/views/JobsView.vue
index 5dfc4665..7f3fd730 100644
--- a/web/app/src/views/JobsView.vue
+++ b/web/app/src/views/JobsView.vue
@@ -2,7 +2,7 @@
-