Show workers with their status, and allow clicking on a worker to activate
it and show its details (which currently is limited to just its ID). Does
include Vue Router handling of the active worker ID and CSS classes for
worker statuses.
This basically copies the `JobsTable` component to `workers/WorkersTable`.
The intention is that all the jobs-specific components will move into a
`jobs` subdirectory at some point.
The "fix" is just setting the height to 50% instead of 100%, as the latter
will make it as big as the entire column; that causes the scrollbar to
show, as the column title isn't taken into account.
Do not use pink for queued/requeueing. Pink in Blender is used to indicate
something going wrong (missing textures, broken shaders). Use a shade of
blue instead which is closer in hue to green which means completed.
Force a visible scroll bar, so that the notification history table
always has the same available width. Without this, Tabulator won't
properly act on the reduction in width when the scrollbar appears, and
will show a horizontal scrollbar as well.
Status indicators are used in Tabulator cells, and it's unknown whether
we can use Vue components there. Moving the code to a central place makes
it a bit easier to reuse the function in various places.
I didn't like how "queued", "paused", and "cancelled" had the same colour,
as they represent rather different statuses (may run in future, vs. won't
run at all).
The selection mechanism of Tabulator was getting in the way of having nice
navigation, as it would deselect (i.e. nav to "/") before selecting the
next job (i.e. nav to "/jobs/{job-id}").
The active job is now determined by the URL and thus handled by Vue Router.
Clicking on a job simply navigates to its URL, which causes the reactive
system to load & display it.
It is still intended to get job selection for "mass actions", but that's
only possible after normal navigation is working well.
Replace the Vue v2 webapp with a Vue v3 one, and embed the OpenAPI
client in the webapp itself (instead of being its own npm project).
- Vue v2.x -> v3.x
- Tabulator v4.x -> v5.1
- Moment JS -> replaced with Luxon JS
- Vue CLI/UI -> replaced with Vite