stream/stream.ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix color

Browse Source
This commit is contained in:
Mr.Dat
2026-01-26 16:26:58 +07:00
parent 820aa7a597
commit 6c4015f8c4
29 changed files with 867 additions and 306 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/routes/overview/Overview.vue
View File

@@ -1,13 +1,13 @@
<script setup lang="ts">
import { client, type ModelVideo } from '@/api/client';
import PageHeader from '@/components/dashboard/PageHeader.vue';
import { useAuthStore } from '@/stores/auth';
import { onMounted, ref } from 'vue';
import QuickActions from './components/QuickActions.vue';
import RecentVideos from './components/RecentVideos.vue';
import StatsOverview from './components/StatsOverview.vue';
import StorageUsage from './components/StorageUsage.vue';
import WelcomeBanner from './components/WelcomeBanner.vue';
const auth = useAuthStore()
const loading = ref(true);
const recentVideos = ref<ModelVideo[]>([]);
@@ -57,13 +57,11 @@ onMounted(() => {
<template>
<div class="dashboard-overview">
<PageHeader title="Dashboard" description="Welcome back! Here's what's happening with your videos."
<PageHeader :title="`Welcome back, ${auth.user?.username}! 👋`" description="Here's what's happening with your videos."
:breadcrumbs="[
{ label: 'Dashboard' }
]" />
<WelcomeBanner />
<!-- Stats Grid -->
<StatsOverview :loading="loading" :stats="stats" />

2
src/routes/overview/components/QuickActions.vue
View File

@@ -60,7 +60,7 @@ const quickActions = [
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
<button v-for="action in quickActions" :key="action.title" @click="action.onClick" :class="[
'p-6 rounded-xl text-left transition-all duration-200 flex flex-col',
'p-6 rounded-xl text-left transition-all duration-200 flex flex-col bg-white',
'border border-gray-300 hover:border-primary hover:shadow-lg',
'group press-animated',

2
src/routes/overview/components/Referral.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="rounded-xl border border-gray-300 hover:border-primary hover:shadow-lg text-card-foreground">
<div class="rounded-xl border border-gray-300 hover:border-primary hover:shadow-lg text-card-foreground bg-white">
<div class="flex flex-col space-y-1.5 p-6">
<h3 class="text-2xl font-semibold leading-none tracking-tight">Referral Link</h3>
</div>

8
src/routes/overview/components/StatsOverview.vue
View File

@@ -32,17 +32,17 @@ defineProps<Props>();
</div>
<div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
<StatsCard title="Total Videos" :value="stats.totalVideos" icon="i-heroicons-film" color="primary"
<StatsCard title="Total Videos" :value="stats.totalVideos"
:trend="{ value: 12, isPositive: true }" />
<StatsCard title="Total Views" :value="stats.totalViews.toLocaleString()" icon="i-heroicons-eye" color="info"
<StatsCard title="Total Views" :value="stats.totalViews.toLocaleString()"
:trend="{ value: 8, isPositive: true }" />
<StatsCard title="Storage Used"
:value="`${formatBytes(stats.storageUsed)} / ${formatBytes(stats.storageLimit)}`" icon="i-heroicons-server"
:value="`${formatBytes(stats.storageUsed)} / ${formatBytes(stats.storageLimit)}`"
color="warning" />
<StatsCard title="Uploads This Month" :value="stats.uploadsThisMonth" icon="i-heroicons-arrow-up-tray"
<StatsCard title="Uploads This Month" :value="stats.uploadsThisMonth"
color="success" :trend="{ value: 25, isPositive: true }" />
</div>
</template>