<script setup lang="ts">
import {useServerStore} from "../../store/modules/server";
import {EnumServerStatus, ServerRecord} from "../../types/Server";
import {computed, onBeforeUnmount, onMounted, ref} from "vue";
import {TimeUtil} from "../../lib/util";

const serverStore = useServerStore();

const props = defineProps<{
    record: ServerRecord;
}>();
const nowMS = ref(TimeUtil.timestampMS());
let nowMsTimer = null as any;
onMounted(() => {
    nowMsTimer = setInterval(() => {
        nowMS.value = TimeUtil.timestampMS();
    }, 1000);
});
onBeforeUnmount(() => {
    clearInterval(nowMsTimer);
});

const startTime = computed(() => {
    const record = props.record;
    if (record.status === EnumServerStatus.STARTING || record.status === EnumServerStatus.RUNNING) {
        if (record.runtime?.startTimestampMS) {
            const time = nowMS.value - record.runtime?.startTimestampMS;
            return TimeUtil.secondsToTime(time / 1000);
        }
    }
    return null;
});
</script>

<template>
    <div v-if="startTime" class="text-sm text-gray-400">
        {{ $t("已启动 {time}", {time: startTime}) }}
    </div>
</template>
