TEST UPD
- front works
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="min-h-screen bg-gray-50 p-6">
|
||||
<div class="min-h-screen p-6">
|
||||
<!-- Заголовок -->
|
||||
<div class="text-center mb-8">
|
||||
<h1 class="text-3xl font-bold text-gray-800 mb-2">Таблица лидеров</h1>
|
||||
@@ -7,9 +7,9 @@
|
||||
</div>
|
||||
|
||||
<!-- Карточка текущего пользователя и лучшего в группе -->
|
||||
<div class="max-w-6xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
|
||||
<div class="max-w-5xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
|
||||
<!-- Карточка текущего пользователя -->
|
||||
<div class="bg-white rounded-xl shadow-lg p-6 border-l-4 border-blue-500">
|
||||
<div class="bg-white rounded-xl shadow-lg p-6 border-l-4 border-teal-800">
|
||||
<h3 class="text-lg font-semibold text-gray-800 mb-4">Ваша позиция</h3>
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center space-x-4">
|
||||
@@ -104,7 +104,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Таблица лидеров -->
|
||||
<div class="max-w-4xl mx-auto bg-white rounded-xl shadow-lg overflow-hidden">
|
||||
<div class="max-w-5xl mx-auto bg-white rounded-xl shadow-lg overflow-hidden">
|
||||
<!-- Заголовок таблицы -->
|
||||
<div :class="['px-6 py-4 bg-gradient-to-r', getGroupGradientClass(activeGroup)]">
|
||||
<h2 class="text-xl font-bold text-white">
|
||||
@@ -185,7 +185,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Статистика -->
|
||||
<div class="max-w-4xl mx-auto mt-6 grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div class="max-w-5xl mx-auto mt-6 grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div
|
||||
v-for="group in roleGroups"
|
||||
:key="group.role"
|
||||
@@ -336,27 +336,27 @@ const nextPositionPoints = computed(() => {
|
||||
// Классы для групп
|
||||
function getGroupButtonClass(role) {
|
||||
const classes = {
|
||||
'LMS Student': 'bg-blue-500 text-white shadow-md',
|
||||
'Course Creator': 'bg-green-500 text-white shadow-md',
|
||||
'LMS Schoolchild': 'bg-purple-500 text-white shadow-md'
|
||||
'LMS Student': 'bg-teal-400 text-white shadow-md',
|
||||
'Course Creator': 'bg-teal-600 text-white shadow-md',
|
||||
'LMS Schoolchild': 'bg-teal-200 text-white shadow-md'
|
||||
}
|
||||
return classes[role] || 'bg-blue-500 text-white shadow-md'
|
||||
}
|
||||
|
||||
function getGroupGradientClass(role) {
|
||||
const classes = {
|
||||
'LMS Student': 'from-blue-500 to-blue-600',
|
||||
'Course Creator': 'from-green-500 to-green-600',
|
||||
'LMS Schoolchild': 'from-purple-500 to-purple-600'
|
||||
'LMS Student': 'from-teal-300 to-teal-400',
|
||||
'Course Creator': 'from-teal-500 to-teal-600',
|
||||
'LMS Schoolchild': 'from-teal-100 to-teal-200'
|
||||
}
|
||||
return classes[role] || 'from-blue-500 to-blue-600'
|
||||
}
|
||||
|
||||
function getGroupBorderClass(role) {
|
||||
const classes = {
|
||||
'LMS Student': 'border-blue-400',
|
||||
'Course Creator': 'border-green-400',
|
||||
'LMS Schoolchild': 'border-purple-400'
|
||||
'LMS Student': 'border-teal-400',
|
||||
'Course Creator': 'border-teal-600',
|
||||
'LMS Schoolchild': 'border-teal-200'
|
||||
}
|
||||
return classes[role] || 'border-blue-400'
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user