Files
ntspi-app/resources/js/Pages/Dashboard/Components/shared/AnalyticsSections.vue
T
F4ilji d6c0f48d48 feat(analytics): add site analytics with grouped navigation sections
- Add Analytics container: models, tasks, jobs, controllers, routes, services
- Add analytics config with section groups (structure, institute, content, services)
- Add database tables: analytics_sessions, analytics_hits, analytics_daily_stats
- Add frontend: Analytics page, section detail, chart, overview, navigation components
- Add consent banner and JS tracking service (sendBeacon + Inertia listener)
- Add permission sync for view_analytics, view_any_analytic
- Fix trailing slash URL matching in GetNavigationSectionsTask
- Fix event propagation on expand arrows in navigation sections
- Fix RecordVisitJob to not depend on dropped analytics_geo_cache table
- Replace plain text views/visitors with badge-style icons
- Group navigation sections by category with separate blocks
- Add config-driven non-CMS sections (faculties, divisions, DPO, journals)
- Remove Events, TV, Sveden from analytics sections
2026-09-18 22:18:04 +05:00

52 lines
1.8 KiB
Vue

<template>
<div>
<div v-if="items.length === 0" class="text-xs text-muted-foreground-1 py-4 text-center">Нет данных</div>
<div v-else class="space-y-1">
<a
v-for="item in items"
:key="item.prefix"
:href="sectionUrl(item.prefix)"
class="relative flex items-center justify-between py-2 px-2 rounded-md overflow-hidden hover:bg-muted-hover transition-colors group"
>
<div
class="absolute inset-y-0 left-0 bg-primary/5 rounded-md"
:style="{ width: getWidth(item.views) + '%' }"
></div>
<div class="flex items-center gap-2 min-w-0 flex-1 relative">
<span class="text-xs font-medium text-foreground">{{ item.label }}</span>
<svg class="w-3 h-3 text-muted-foreground-2 opacity-0 group-hover:opacity-100 transition-opacity flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7" />
</svg>
</div>
<div class="flex items-center gap-3 flex-shrink-0 relative">
<span class="text-[11px] text-muted-foreground-1">{{ item.views }}</span>
<span class="text-[10px] text-muted-foreground-2">{{ item.visitors }} uniq</span>
</div>
</a>
</div>
</div>
</template>
<script>
export default {
name: 'AnalyticsSections',
props: {
items: { type: Array, required: true },
period: { type: Number, default: 30 },
},
computed: {
maxViews() {
return Math.max(...this.items.map(i => i.views), 1);
},
},
methods: {
getWidth(views) {
return Math.max((views / this.maxViews) * 100, 2);
},
sectionUrl(prefix) {
return route('dashboard.analytics.section', { prefix, days: this.period });
},
},
};
</script>