Compare commits
2
Commits
71fee1eb11
...
5288d24020
| Author | SHA1 | Date | |
|---|---|---|---|
 C
|
5288d24020 | ||
|
C
|
724939408c |
No files matched your search
+4
-99
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<v-app id="inspire">
|
<v-app id="studspider-dashboard">
|
||||||
<v-navigation-drawer v-model="drawer">
|
<v-navigation-drawer v-model="drawer">
|
||||||
<v-list>
|
<v-list>
|
||||||
<v-list-item
|
<v-list-item
|
||||||
@@ -19,7 +19,6 @@
|
|||||||
title="Demo"
|
title="Demo"
|
||||||
value="demo"
|
value="demo"
|
||||||
to="/demo"
|
to="/demo"
|
||||||
color="primary"
|
|
||||||
/>
|
/>
|
||||||
<v-divider class="my-2"></v-divider>
|
<v-divider class="my-2"></v-divider>
|
||||||
<v-list-item
|
<v-list-item
|
||||||
@@ -27,6 +26,7 @@
|
|||||||
title="Settings"
|
title="Settings"
|
||||||
value="settings"
|
value="settings"
|
||||||
to="/settings"
|
to="/settings"
|
||||||
|
disabled="true"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</v-list>
|
</v-list>
|
||||||
@@ -40,102 +40,7 @@
|
|||||||
</v-app-bar>
|
</v-app-bar>
|
||||||
|
|
||||||
<v-main>
|
<v-main>
|
||||||
<v-container fluid>
|
<router-view />
|
||||||
<v-row>
|
|
||||||
<!-- Column 1: Database Changes List -->
|
|
||||||
<v-col cols="12" md="3">
|
|
||||||
<v-card class="mb-4">
|
|
||||||
<v-card-title>Recent Changes</v-card-title>
|
|
||||||
<v-list>
|
|
||||||
<v-list-item
|
|
||||||
v-for="(change, index) in recentChanges"
|
|
||||||
:key="index"
|
|
||||||
:title="change.title"
|
|
||||||
:subtitle="change.timestamp"
|
|
||||||
:prepend-icon="change.type === 'add' ? 'mdi-plus-circle' : change.type === 'remove' ? 'mdi-minus-circle' : 'mdi-pencil'"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<v-icon :color="change.type === 'add' ? 'success' : change.type === 'remove' ? 'error' : 'info'">
|
|
||||||
{{ change.type === 'add' ? 'mdi-plus-circle' : change.type === 'remove' ? 'mdi-minus-circle' : 'mdi-pencil' }}
|
|
||||||
</v-icon>
|
|
||||||
</template>
|
|
||||||
</v-list-item>
|
|
||||||
</v-list>
|
|
||||||
</v-card>
|
|
||||||
</v-col>
|
|
||||||
|
|
||||||
<!-- Column 2: Graphs and Statistics -->
|
|
||||||
<v-col cols="12" md="6">
|
|
||||||
<v-card class="mb-4">
|
|
||||||
<v-card-title>Changes Over Time</v-card-title>
|
|
||||||
<v-card-text>
|
|
||||||
<v-sheet height="300">
|
|
||||||
<!-- Placeholder for line chart - you can add your preferred charting library here -->
|
|
||||||
<v-responsive class="text-center">
|
|
||||||
Line Chart Coming Soon
|
|
||||||
</v-responsive>
|
|
||||||
</v-sheet>
|
|
||||||
</v-card-text>
|
|
||||||
</v-card>
|
|
||||||
|
|
||||||
<v-card class="mb-4">
|
|
||||||
<v-card-title>Statistics</v-card-title>
|
|
||||||
<v-card-text>
|
|
||||||
<v-row>
|
|
||||||
<v-col cols="12" md="4">
|
|
||||||
<v-card variant="outlined">
|
|
||||||
<v-card-text class="text-center">
|
|
||||||
<div class="text-h3">{{ totalSets }}</div>
|
|
||||||
<div class="text-subtitle-1">Total Sets</div>
|
|
||||||
</v-card-text>
|
|
||||||
</v-card>
|
|
||||||
</v-col>
|
|
||||||
<v-col cols="12" md="4">
|
|
||||||
<v-card variant="outlined">
|
|
||||||
<v-card-text class="text-center">
|
|
||||||
<div class="text-h3">{{ totalThemes }}</div>
|
|
||||||
<div class="text-subtitle-1">Total Themes</div>
|
|
||||||
</v-card-text>
|
|
||||||
</v-card>
|
|
||||||
</v-col>
|
|
||||||
<v-col cols="12" md="4">
|
|
||||||
<v-card variant="outlined">
|
|
||||||
<v-card-text class="text-center">
|
|
||||||
<div class="text-h3">{{ changesThisWeek }}</div>
|
|
||||||
<div class="text-subtitle-1">Changes This Week</div>
|
|
||||||
</v-card-text>
|
|
||||||
</v-card>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
</v-card-text>
|
|
||||||
</v-card>
|
|
||||||
</v-col>
|
|
||||||
|
|
||||||
<!-- Column 3: Pie Chart -->
|
|
||||||
<v-col cols="12" md="3">
|
|
||||||
<v-card>
|
|
||||||
<v-card-title>Theme Distribution</v-card-title>
|
|
||||||
<v-card-text>
|
|
||||||
<v-pie
|
|
||||||
title="Sets by theme"
|
|
||||||
animation
|
|
||||||
legend
|
|
||||||
:palette="['#FF6B6B', '#4ECDC4', '#45B7D1', '#96CEB4', '#FFEEAD',
|
|
||||||
'#D4A5A5', '#9B59B6', '#3498DB', '#E74C3C', '#2ECC71',
|
|
||||||
'#F1C40F', '#1ABC9C', '#D35400', '#C0392B', '#8E44AD',
|
|
||||||
'#2980B9', '#27AE60', '#F39C12', '#16A085', '#E67E22',
|
|
||||||
'#9B59B6', '#2C3E50', '#E84393', '#00B894', '#FD79A8',
|
|
||||||
'#6C5CE7', '#A8E6CF', '#DCEDC1', '#FFD3B6', '#FFAAA5',
|
|
||||||
'#FF8B94', '#A8D8EA']"
|
|
||||||
tooltip
|
|
||||||
reveal
|
|
||||||
:items="items"
|
|
||||||
/>
|
|
||||||
</v-card-text>
|
|
||||||
</v-card>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
</v-container>
|
|
||||||
</v-main>
|
</v-main>
|
||||||
</v-app>
|
</v-app>
|
||||||
</template>
|
</template>
|
||||||
@@ -217,7 +122,7 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data: () => ({ drawer: null }),
|
data: () => ({ drawer: "/" }),
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
@@ -92,6 +92,11 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<route lang="yaml">
|
||||||
|
name: demo
|
||||||
|
layout: default
|
||||||
|
</route>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
const demoItems = [
|
const demoItems = [
|
||||||
{
|
{
|
||||||
|
|||||||
+171
-3
@@ -1,7 +1,175 @@
|
|||||||
<template>
|
<template>
|
||||||
<HelloWorld />
|
<v-main>
|
||||||
|
<v-container fluid>
|
||||||
|
<v-row>
|
||||||
|
<!-- Column 1: Database Changes List -->
|
||||||
|
<v-col cols="12" md="3">
|
||||||
|
<v-card class="mb-4">
|
||||||
|
<v-card-title>Recent Changes</v-card-title>
|
||||||
|
<v-list>
|
||||||
|
<v-list-item
|
||||||
|
v-for="(change, index) in recentChanges"
|
||||||
|
:key="index"
|
||||||
|
:title="change.title"
|
||||||
|
:subtitle="change.timestamp"
|
||||||
|
:prepend-icon="change.type === 'add' ? 'mdi-plus-circle' : change.type === 'remove' ? 'mdi-minus-circle' : 'mdi-pencil'"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<v-icon :color="change.type === 'add' ? 'success' : change.type === 'remove' ? 'error' : 'info'">
|
||||||
|
{{ change.type === 'add' ? 'mdi-plus-circle' : change.type === 'remove' ? 'mdi-minus-circle' : 'mdi-pencil' }}
|
||||||
|
</v-icon>
|
||||||
|
</template>
|
||||||
|
</v-list-item>
|
||||||
|
</v-list>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
|
||||||
|
<!-- Column 2: Graphs and Statistics -->
|
||||||
|
<v-col cols="12" md="6">
|
||||||
|
<v-card class="mb-4">
|
||||||
|
<v-card-title>Changes Over Time</v-card-title>
|
||||||
|
<v-card-text>
|
||||||
|
<v-sheet height="300">
|
||||||
|
<!-- Placeholder for line chart - you can add your preferred charting library here -->
|
||||||
|
<v-responsive class="text-center">
|
||||||
|
Line Chart Coming Soon
|
||||||
|
</v-responsive>
|
||||||
|
</v-sheet>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
|
||||||
|
<v-card class="mb-4">
|
||||||
|
<v-card-title>Statistics</v-card-title>
|
||||||
|
<v-card-text>
|
||||||
|
<v-row>
|
||||||
|
<v-col cols="12" md="4">
|
||||||
|
<v-card variant="outlined">
|
||||||
|
<v-card-text class="text-center">
|
||||||
|
<div class="text-h3">{{ totalSets }}</div>
|
||||||
|
<div class="text-subtitle-1">Total Sets</div>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="12" md="4">
|
||||||
|
<v-card variant="outlined">
|
||||||
|
<v-card-text class="text-center">
|
||||||
|
<div class="text-h3">{{ totalThemes }}</div>
|
||||||
|
<div class="text-subtitle-1">Total Themes</div>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="12" md="4">
|
||||||
|
<v-card variant="outlined">
|
||||||
|
<v-card-text class="text-center">
|
||||||
|
<div class="text-h3">{{ changesThisWeek }}</div>
|
||||||
|
<div class="text-subtitle-1">Changes This Week</div>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
|
||||||
|
<!-- Column 3: Pie Chart -->
|
||||||
|
<v-col cols="12" md="3">
|
||||||
|
<v-card>
|
||||||
|
<v-card-title>Theme Distribution</v-card-title>
|
||||||
|
<v-card-text>
|
||||||
|
<v-pie
|
||||||
|
title="Sets by theme"
|
||||||
|
animation
|
||||||
|
legend
|
||||||
|
:palette="['#FF6B6B', '#4ECDC4', '#45B7D1', '#96CEB4', '#FFEEAD',
|
||||||
|
'#D4A5A5', '#9B59B6', '#3498DB', '#E74C3C', '#2ECC71',
|
||||||
|
'#F1C40F', '#1ABC9C', '#D35400', '#C0392B', '#8E44AD',
|
||||||
|
'#2980B9', '#27AE60', '#F39C12', '#16A085', '#E67E22',
|
||||||
|
'#9B59B6', '#2C3E50', '#E84393', '#00B894', '#FD79A8',
|
||||||
|
'#6C5CE7', '#A8E6CF', '#DCEDC1', '#FFD3B6', '#FFAAA5',
|
||||||
|
'#FF8B94', '#A8D8EA']"
|
||||||
|
tooltip
|
||||||
|
reveal
|
||||||
|
:items="items"
|
||||||
|
/>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-container>
|
||||||
|
</v-main>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
//
|
import { ref, computed } from 'vue'
|
||||||
</script>
|
|
||||||
|
const drawer = ref(false)
|
||||||
|
|
||||||
|
// Statistics
|
||||||
|
const totalSets = computed(() => items.reduce((acc, item) => acc + item.value, 0))
|
||||||
|
const totalThemes = computed(() => items.length)
|
||||||
|
const changesThisWeek = ref(12) // This could be computed from recentChanges if needed
|
||||||
|
|
||||||
|
// Sample recent changes data
|
||||||
|
const recentChanges = [
|
||||||
|
{
|
||||||
|
title: "Added new Marvel set",
|
||||||
|
timestamp: "2 minutes ago",
|
||||||
|
type: "add"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Updated Harry Potter count",
|
||||||
|
timestamp: "15 minutes ago",
|
||||||
|
type: "update"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Removed duplicate Friends set",
|
||||||
|
timestamp: "1 hour ago",
|
||||||
|
type: "remove"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Added Star Wars set",
|
||||||
|
timestamp: "2 hours ago",
|
||||||
|
type: "add"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Updated Technic inventory",
|
||||||
|
timestamp: "3 hours ago",
|
||||||
|
type: "update"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const items = [
|
||||||
|
{ key: 1, title: "Marvel", value: 1 },
|
||||||
|
{ key: 2, title: "Duplo", value: 1 },
|
||||||
|
{ key: 3, title: "Harry Potter", value: 1 },
|
||||||
|
{ key: 4, title: "Friends", value: 2 }, // Listed twice in original list
|
||||||
|
{ key: 5, title: "Sonic", value: 1 },
|
||||||
|
{ key: 6, title: "Mario", value: 1 },
|
||||||
|
{ key: 7, title: "DC", value: 1 },
|
||||||
|
{ key: 8, title: "Avatar", value: 1 },
|
||||||
|
{ key: 9, title: "Classic", value: 1 },
|
||||||
|
{ key: 10, title: "City", value: 1 },
|
||||||
|
{ key: 11, title: "Fortnite", value: 1 },
|
||||||
|
{ key: 12, title: "Wednesday", value: 1 },
|
||||||
|
{ key: 13, title: "Wicked", value: 1 },
|
||||||
|
{ key: 14, title: "Speed Champs", value: 1 },
|
||||||
|
{ key: 15, title: "Animal Crossing", value: 1 },
|
||||||
|
{ key: 16, title: "Creator", value: 1 },
|
||||||
|
{ key: 17, title: "Ideas", value: 2 }, // Listed twice in original list
|
||||||
|
{ key: 18, title: "Ninjago", value: 1 },
|
||||||
|
{ key: 19, title: "JP", value: 1 },
|
||||||
|
{ key: 20, title: "Star Wars", value: 1 },
|
||||||
|
{ key: 21, title: "Architecture", value: 1 },
|
||||||
|
{ key: 22, title: "Icons", value: 1 },
|
||||||
|
{ key: 23, title: "Dots", value: 1 },
|
||||||
|
{ key: 24, title: "Dreamzzz", value: 1 },
|
||||||
|
{ key: 25, title: "One Piece", value: 1 },
|
||||||
|
{ key: 26, title: "Bluey", value: 1 },
|
||||||
|
{ key: 27, title: "Disney", value: 1 },
|
||||||
|
{ key: 28, title: "Technic", value: 1 },
|
||||||
|
{ key: 29, title: "Art", value: 1 },
|
||||||
|
{ key: 30, title: "Botanicals", value: 1 }
|
||||||
|
]
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
<template>
|
||||||
|
<v-container>
|
||||||
|
<v-row>
|
||||||
|
<v-col cols="12">
|
||||||
|
<v-card>
|
||||||
|
<v-card-title>Statistics Page</v-card-title>
|
||||||
|
<v-card-text>
|
||||||
|
This is the statistics page content
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<route lang="yaml">
|
||||||
|
name: stats
|
||||||
|
layout: default
|
||||||
|
</route>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
// Add any statistics page specific logic here
|
||||||
|
</script>
|
||||||
Reference in new issue
Block a user