mirror of
https://github.com/Litlyx/litlyx
synced 2025-12-11 08:18:37 +01:00
65 lines
2.6 KiB
Vue
65 lines
2.6 KiB
Vue
<script lang="ts" setup>
|
|
|
|
|
|
const { project } = useProject();
|
|
|
|
const { onlineUsers, stopWatching, startWatching } = useOnlineUsers();
|
|
onMounted(() => startWatching());
|
|
onUnmounted(() => stopWatching());
|
|
|
|
const selfhosted = useSelfhosted();
|
|
|
|
const { createAlert } = useAlert();
|
|
|
|
function copyProjectId() {
|
|
if (!navigator.clipboard) return alert('You can\'t copy in HTTP');
|
|
if (!project.value) return alert('Project not loaded');
|
|
navigator.clipboard.writeText((project.value._id).toString());
|
|
createAlert('Success', 'Project id copied successfully.', 'far fa-circle-check', 5000);
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
<div class="w-full px-6 pb-2 lg:pb-6 font-bold flex flex-col xl:flex-row text-lg gap-2 xl:gap-12 lg:text-2xl">
|
|
|
|
<div
|
|
class="flex gap-2 items-center text-lyx-lightmode-text/90 dark:text-lyx-text/90 justify-center md:justify-start">
|
|
<div class="animate-pulse w-[.8rem] h-[.8rem] bg-green-400 rounded-full"> </div>
|
|
<div class="poppins font-medium text-[.9rem]"> {{ onlineUsers.data }} Online users</div>
|
|
</div>
|
|
|
|
<div class="grow"></div>
|
|
|
|
<!-- <div class="flex md:gap-2 items-center md:justify-start flex-col md:flex-row">
|
|
<div class="poppins font-medium text-lyx-text-darker text-[.9rem]">Project:</div>
|
|
<div class="text-lyx-text poppins font-medium text-[.9rem]"> {{ project?.name || 'Loading...' }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-col md:flex-row md:gap-2 items-center md:justify-start">
|
|
<div class="poppins font-medium text-lyx-text-darker text-[.9rem]">Project id:</div>
|
|
<div class="flex gap-2">
|
|
<div class="text-lyx-text poppins font-medium text-[.9rem]">
|
|
{{ project?._id || 'Loading...' }}
|
|
</div>
|
|
<div class="flex items-center ml-3">
|
|
<i @click="copyProjectId()"
|
|
class="far fa-copy text-lyx-text hover:text-lyx-primary cursor-pointer text-[.9rem]"></i>
|
|
</div>
|
|
</div>
|
|
</div> -->
|
|
<!--
|
|
<div v-if="!selfhosted"
|
|
class="flex gap-2 items-center text-lyx-lightmode-text/90 dark:text-lyx-text/90 justify-center md:justify-start">
|
|
<div class="animate-pulse w-[1rem] h-[1rem] bg-green-400 rounded-full"> </div>
|
|
<div class="poppins font-regular text-[.9rem]"> AI Anomaly Detector </div>
|
|
<div class="flex items-center">
|
|
<i class="far fa-info-circle text-[.9rem] hover:text-lyx-primary cursor-pointer"
|
|
@click="showAnomalyInfoAlert"></i>
|
|
</div>
|
|
</div> -->
|
|
|
|
</div>
|
|
</template> |