mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2024-09-25 21:20:12 +00:00
58838f225c
Rewrite of the UI using Typescript, Vue3, Windicss and Vite. The design should be close to the current one with some changes: - latest pipeline in a sidebar on the right - secrets and registry as part of the repo-settings (secrets and registry entries shouldn't be used as much so they can be "hidden" under settings IMO) - start page shows list of active repositories with button to enable / add new ones (currently you see all repositories and in most cases you only add new repositories once in a while)
50 lines
1.2 KiB
TypeScript
50 lines
1.2 KiB
TypeScript
import { computed, onBeforeUnmount, onMounted, Ref, ref, watch } from 'vue';
|
|
|
|
export function useElapsedTime(running: Ref<boolean>, startTime: Ref<number | undefined>) {
|
|
const time = ref<number | undefined>(startTime.value);
|
|
const timer = ref<NodeJS.Timer>();
|
|
|
|
function stopTimer() {
|
|
if (timer.value !== undefined) {
|
|
clearInterval(timer.value);
|
|
timer.value = undefined;
|
|
}
|
|
}
|
|
|
|
function startTimer() {
|
|
stopTimer();
|
|
|
|
if (time.value === undefined || !running.value) {
|
|
return;
|
|
}
|
|
|
|
timer.value = setInterval(() => {
|
|
if (time.value !== undefined) {
|
|
time.value += 1000;
|
|
}
|
|
}, 1000);
|
|
}
|
|
|
|
watch([running, startTime], () => {
|
|
time.value = startTime.value;
|
|
|
|
// should run, has a start-time and is not running atm
|
|
if (running.value && time.value !== undefined && timer.value === undefined) {
|
|
startTimer();
|
|
}
|
|
|
|
// should not run or has no start-time and is running atm
|
|
if ((!running.value || time.value === undefined) && timer.value !== undefined) {
|
|
stopTimer();
|
|
}
|
|
});
|
|
|
|
onMounted(startTimer);
|
|
|
|
onBeforeUnmount(stopTimer);
|
|
|
|
return {
|
|
time: computed(() => time.value),
|
|
running,
|
|
};
|
|
}
|