Новый экранчик для обзора дашей
This commit is contained in:
@@ -41,7 +41,7 @@
|
||||
|
||||
<Toast />
|
||||
|
||||
<main class="bg-gray-50 min-h-screen">
|
||||
<main class="min-h-screen bg-slate-50">
|
||||
{#if isLoginPage}
|
||||
<div class="p-4">
|
||||
<slot />
|
||||
@@ -61,7 +61,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Page content -->
|
||||
<div class="p-4 flex-grow">
|
||||
<div class="flex-grow px-4 pb-6 pt-2 md:px-6">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
|
||||
@@ -110,14 +110,14 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="container mx-auto max-w-6xl p-4">
|
||||
<div class="mx-auto w-full max-w-7xl space-y-4">
|
||||
<PageHeader
|
||||
title={$t.reports?.title || 'Reports'}
|
||||
subtitle={() => null}
|
||||
actions={() => null}
|
||||
/>
|
||||
|
||||
<div class="mb-4 rounded-lg border border-slate-200 bg-white p-3">
|
||||
<div class="rounded-xl border border-slate-200 bg-white p-4 shadow-sm">
|
||||
<div class="grid grid-cols-1 gap-2 md:grid-cols-4">
|
||||
<select
|
||||
bind:value={taskType}
|
||||
@@ -140,14 +140,14 @@
|
||||
</select>
|
||||
|
||||
<button
|
||||
class="rounded-md border border-slate-200 px-3 py-1.5 text-sm hover:bg-slate-50"
|
||||
class="inline-flex items-center justify-center rounded-lg border border-slate-300 px-3 py-1.5 text-sm font-medium text-slate-700 transition-colors hover:bg-slate-50"
|
||||
on:click={() => loadReports()}
|
||||
>
|
||||
{$t.common?.refresh || 'Refresh'}
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="rounded-md border border-slate-200 px-3 py-1.5 text-sm hover:bg-slate-50"
|
||||
class="inline-flex items-center justify-center rounded-lg border border-slate-300 px-3 py-1.5 text-sm font-medium text-slate-700 transition-colors hover:bg-slate-50"
|
||||
on:click={clearFilters}
|
||||
>
|
||||
{$t.reports?.clear_filters || 'Clear filters'}
|
||||
@@ -156,24 +156,24 @@
|
||||
</div>
|
||||
|
||||
{#if loading}
|
||||
<div class="rounded-lg border border-slate-200 bg-white p-6 text-slate-500">
|
||||
{$t.common?.loading || 'Loading...'}
|
||||
<div class="rounded-xl border border-slate-200 bg-white p-6 text-sm text-slate-500 shadow-sm">
|
||||
{$t.reports?.loading || 'Loading reports...'}
|
||||
</div>
|
||||
{:else if error}
|
||||
<div class="rounded-lg border border-red-200 bg-red-50 p-4 text-red-700">
|
||||
<div class="rounded-xl border border-red-200 bg-red-50 p-4 text-red-700 shadow-sm">
|
||||
<p>{error}</p>
|
||||
<button class="mt-2 rounded border border-red-300 px-3 py-1 text-sm" on:click={() => loadReports()}>
|
||||
{$t.common?.retry || 'Retry'}
|
||||
<button class="mt-2 inline-flex items-center justify-center rounded-lg border border-red-300 px-3 py-1 text-sm font-medium text-red-700 transition-colors hover:bg-red-100" on:click={() => loadReports()}>
|
||||
{$t.reports?.retry_load || $t.common?.retry || 'Retry'}
|
||||
</button>
|
||||
</div>
|
||||
{:else if !collection || collection.total === 0}
|
||||
<div class="rounded-lg border border-slate-200 bg-white p-6 text-slate-500">
|
||||
<div class="rounded-xl border border-slate-200 bg-white p-6 text-sm text-slate-500 shadow-sm">
|
||||
{$t.reports?.empty || 'No reports available.'}
|
||||
</div>
|
||||
{:else if collection.items.length === 0 && hasActiveFilters()}
|
||||
<div class="rounded-lg border border-slate-200 bg-white p-6 text-slate-500">
|
||||
<div class="rounded-xl border border-slate-200 bg-white p-6 text-sm text-slate-500 shadow-sm">
|
||||
<p>{$t.reports?.filtered_empty || 'No reports match your filters.'}</p>
|
||||
<button class="mt-2 rounded border border-slate-200 px-3 py-1 text-sm hover:bg-slate-50" on:click={clearFilters}>
|
||||
<button class="mt-2 inline-flex items-center justify-center rounded-lg border border-slate-300 px-3 py-1 text-sm font-medium text-slate-700 transition-colors hover:bg-slate-50" on:click={clearFilters}>
|
||||
{$t.reports?.clear_filters || 'Clear filters'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -187,14 +187,14 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 py-6">
|
||||
<div class="mx-auto w-full max-w-7xl space-y-6">
|
||||
<!-- Header -->
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<h1 class="text-2xl font-bold text-gray-900">
|
||||
{$t.settings?.title || "Settings"}
|
||||
</h1>
|
||||
<button
|
||||
class="px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary-hover transition-colors"
|
||||
class="inline-flex items-center justify-center rounded-lg bg-primary px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-primary-hover"
|
||||
on:click={loadSettings}
|
||||
>
|
||||
{$t.common?.refresh || "Refresh"}
|
||||
@@ -218,12 +218,14 @@
|
||||
|
||||
<!-- Loading State -->
|
||||
{#if isLoading}
|
||||
<div class="bg-white rounded-lg p-6 border border-gray-200">
|
||||
<div class="animate-pulse bg-gray-200 rounded h-8"></div>
|
||||
<div class="animate-pulse bg-gray-200 rounded h-8"></div>
|
||||
<div class="animate-pulse bg-gray-200 rounded h-8"></div>
|
||||
<div class="animate-pulse bg-gray-200 rounded h-8"></div>
|
||||
<div class="animate-pulse bg-gray-200 rounded h-8"></div>
|
||||
<div class="rounded-xl border border-slate-200 bg-white p-6 shadow-sm">
|
||||
<div class="space-y-3">
|
||||
<div class="h-8 animate-pulse rounded bg-slate-200"></div>
|
||||
<div class="h-8 animate-pulse rounded bg-slate-200"></div>
|
||||
<div class="h-8 animate-pulse rounded bg-slate-200"></div>
|
||||
<div class="h-8 animate-pulse rounded bg-slate-200"></div>
|
||||
<div class="h-8 animate-pulse rounded bg-slate-200"></div>
|
||||
</div>
|
||||
</div>
|
||||
{:else if settings}
|
||||
<!-- Tabs -->
|
||||
@@ -271,7 +273,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Tab Content -->
|
||||
<div class="bg-white rounded-lg p-6 border border-gray-200">
|
||||
<div class="rounded-xl border border-slate-200 bg-white p-6 shadow-sm">
|
||||
{#if activeTab === "environments"}
|
||||
<!-- Environments Tab -->
|
||||
<div class="text-lg font-medium mb-4">
|
||||
|
||||
Reference in New Issue
Block a user