Rewrite endpoints + bar cards

This commit is contained in:
Emily
2024-10-03 15:07:16 +02:00
parent 314660d8a3
commit e1953f2f9f
28 changed files with 667 additions and 434 deletions

View File

@@ -2,6 +2,10 @@
definePageMeta({ layout: 'dashboard' });
const { project } = useProject();
const { data: projects } = useProjectsList();
const activeProject = useActiveProject();
@@ -33,14 +37,14 @@ onMounted(async () => {
});
});
const firstInteractionUrl = computed(() => {
return `/api/metrics/${activeProject.value?._id}/first_interaction`
const firstInteraction = useFetch<boolean>('/api/project/first_interaction', {
lazy: true, headers: useComputedHeaders({ useSnapshotDates: false })
});
const firstInteraction = useFetch<boolean>(firstInteractionUrl, {
...signHeaders(),
lazy: true
const showDashboard = computed(() => {
return project.value && firstInteraction.data.value
});
const selectLabels = [
@@ -68,9 +72,97 @@ function goToUpgrade() {
<div class="dashboard w-full h-full overflow-y-auto pb-20 md:pt-4 lg:pt-0">
<div>
<DashboardTopSection :key="refreshKey"></DashboardTopSection>
<DashboardTopCards :key="refreshKey"></DashboardTopCards>
<div v-if="showDashboard">
<div class="w-full px-4 py-2 gap-2 flex flex-col">
<!-- <div v-if="limitsInfo && limitsInfo.limited"
class="w-full bg-[#fbbf2422] p-4 rounded-lg text-[.9rem] flex items-center">
<div class="flex flex-col grow">
<div class="poppins font-semibold text-[#fbbf24]">
Limit reached
</div>
<div class="poppins text-[#fbbf24]">
Litlyx cannot receive new data as you reached your plan's limit. Resume all the great
features and collect even more data with a higher plan.
</div>
</div>
<div>
<LyxUiButton type="outline" @click="goToUpgrade()"> Upgrade </LyxUiButton>
</div>
</div> -->
<!-- <div v-if="!isPremium" class="w-full bg-[#5680f822] p-4 rounded-lg text-[.9rem] flex items-center">
<div class="flex flex-col grow">
<div class="poppins font-semibold text-lyx-primary">
Launch offer: 25% off
</div>
<div class="poppins text-lyx-primary">
We're offering an exclusive 25% discount forever on all plans starting from the Acceleration
Plan for our first 100 users who believe in our project.
<br>
Redeem Code: <span class="text-white font-bold text-[1rem]">LIT25</span> at checkout to
claim your discount.
</div>
</div>
<div>
<LyxUiButton type="outline" @click="goToUpgrade()"> Upgrade </LyxUiButton>
</div>
</div> -->
</div>
<div>
<DashboardTopSection :key="refreshKey"></DashboardTopSection>
<DashboardTopCards :key="refreshKey"></DashboardTopCards>
</div>
<div class="mt-6 px-6 flex gap-6 flex-col 2xl:flex-row w-full">
<DashboardActionableChart :key="refreshKey"></DashboardActionableChart>
</div>
<div class="flex w-full justify-center mt-6 px-6">
<div class="flex w-full gap-6 flex-col xl:flex-row">
<div class="flex-1">
<BarCardWebsites :key="refreshKey"></BarCardWebsites>
</div>
<div class="flex-1">
<BarCardEvents :key="refreshKey"></BarCardEvents>
</div>
</div>
</div>
<div class="flex w-full justify-center mt-6 px-6">
<div class="flex w-full gap-6 flex-col xl:flex-row">
<div class="flex-1">
<BarCardReferrers :key="refreshKey"></BarCardReferrers>
</div>
<div class="flex-1">
<BarCardBrowsers :key="refreshKey"></BarCardBrowsers>
</div>
</div>
</div>
<div class="flex w-full justify-center mt-6 px-6">
<div class="flex w-full gap-6 flex-col xl:flex-row">
<div class="flex-1">
<BarCardOperatingSystems :key="refreshKey"></BarCardOperatingSystems>
</div>
<div class="flex-1">
<BarCardGeolocations :key="refreshKey"></BarCardGeolocations>
</div>
</div>
</div>
<div class="flex w-full justify-center mt-6 px-6">
<div class="flex w-full gap-6 flex-col xl:flex-row">
<div class="flex-1">
<BarCardDevices :key="refreshKey"></BarCardDevices>
</div>
<div class="flex-1">
</div>
</div>
</div>
</div>
<!-- <div :key="'home-' + isLiveDemo()"