chg: [front:user-activity] Improved color ranges

This commit is contained in:
Sami Mokaddem 2024-07-09 15:27:31 +02:00
parent e41627ffc7
commit f4a3a3d86a
4 changed files with 17 additions and 16 deletions

File diff suppressed because one or more lines are too long

2
dist/index.html vendored
View file

@ -5,7 +5,7 @@
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App</title> <title>Vite App</title>
<script type="module" crossorigin src="/assets/index--3Y49HmA.js"></script> <script type="module" crossorigin src="/assets/index-DYjX_zK2.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-XAPeN3Gs.css"> <link rel="stylesheet" crossorigin href="/assets/index-XAPeN3Gs.css">
</head> </head>
<body> <body>

View file

@ -8,18 +8,19 @@
const theChart = ref(null) const theChart = ref(null)
const bufferSize = computed(() => userActivityConfig.value.activity_buffer_size) const bufferSize = computed(() => userActivityConfig.value.activity_buffer_size)
const bufferSizeMin = computed(() => userActivityConfig.value.timestamp_min) const bufferSizeMin = computed(() => userActivityConfig.value.timestamp_min)
const chartInitSeries = Array.from(Array(bufferSize.value)).map(() => 0) const chartInitSeries = computed(() => Array.from(Array(bufferSize.value)).map(() => 0))
const hasActivity = computed(() => userActivity.value.length != 0) const hasActivity = computed(() => userActivity.value.length != 0)
const chartSeries = computed(() => { const chartSeries = computed(() => {
return !hasActivity.value ? chartInitSeries : activitySeries.value return !hasActivity.value ? chartInitSeries.value : activitySeries.value
}) })
const activitySeries = computed(() => { const activitySeries = computed(() => {
const data = userActivity.value[props.user_id] === undefined ? chartInitSeries : userActivity.value[props.user_id] const data = userActivity.value[props.user_id] === undefined ? chartInitSeries.value : userActivity.value[props.user_id]
return [{data: Array.from(data)}] return [{data: Array.from(data)}]
}) })
const colorRanges = [1, 3, 5, 7, 9, 1000]
const colorRanges = [1, 2, 3, 4, 5, 1000]
const chartOptions = computed(() => { const chartOptions = computed(() => {
return { return {

View file

@ -97,12 +97,12 @@
<tr v-for="(progress) in sortedProgress" :key="progress.user_id" class="bg-slate-100 dark:bg-slate-900"> <tr v-for="(progress) in sortedProgress" :key="progress.user_id" class="bg-slate-100 dark:bg-slate-900">
<td class="border-b border-slate-200 dark:border-slate-700 text-slate-600 dark:text-slate-400 p-0 pl-2 relative"> <td class="border-b border-slate-200 dark:border-slate-700 text-slate-600 dark:text-slate-400 p-0 pl-2 relative">
<span class="flex flex-col max-w-60"> <span class="flex flex-col max-w-60">
<span :title="user_id" class="text-nowrap inline-block leading-5 truncate"> <span :title="progress.user_id" class="text-nowrap inline-block leading-5 truncate">
<FontAwesomeIcon v-if="progress.exercises[exercise.uuid].score / progress.exercises[exercise.uuid].max_score == 1" :icon="faMedal" class="mr-1 text-amber-300"></FontAwesomeIcon> <FontAwesomeIcon v-if="progress.exercises[exercise.uuid].score / progress.exercises[exercise.uuid].max_score == 1" :icon="faMedal" class="mr-1 text-amber-300"></FontAwesomeIcon>
<span class="text-lg font-bold font-mono leading-5 tracking-tight">{{ progress.email.split('@')[0] }}</span> <span class="text-lg font-bold font-mono leading-5 tracking-tight">{{ progress.email.split('@')[0] }}</span>
<span class="text-xs font-mono tracking-tight">@{{ progress.email.split('@')[1] }}</span> <span class="text-xs font-mono tracking-tight">@{{ progress.email.split('@')[1] }}</span>
</span> </span>
<LiveLogsUserActivityGraph :user_id="user_id"></LiveLogsUserActivityGraph> <LiveLogsUserActivityGraph :user_id="progress.user_id"></LiveLogsUserActivityGraph>
</span> </span>
</td> </td>
<td <td
@ -112,7 +112,7 @@
> >
<span <span
class="select-none cursor-pointer flex justify-center content-center flex-wrap h-9" class="select-none cursor-pointer flex justify-center content-center flex-wrap h-9"
@click="toggleCompleted(progress.exercises[exercise.uuid].tasks_completion[task.uuid], user_id, exercise.uuid, task.uuid)" @click="toggleCompleted(progress.exercises[exercise.uuid].tasks_completion[task.uuid], progress.user_id, exercise.uuid, task.uuid)"
> >
<span class="flex flex-col"> <span class="flex flex-col">
<span class="text-nowrap"> <span class="text-nowrap">