goc_daniel/b2b
1
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

timetracker update

Browse Source
This commit is contained in:
Daniel Goc
2026-03-11 09:33:36 +01:00
parent bbf8a2c133
commit 9ef4bb219b
121 changed files with 4328 additions and 2231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
bo/src/views/RepoChartView.vue
View File

@@ -12,7 +12,8 @@ import {
} from 'chart.js'
import { getRepos, getYears, getQuarters, getIssues, type QuarterData, type IssueTimeSummary } from '@/composable/useRepoApi'
import { useAuthStore } from '@/stores/auth'
import { i18n } from '@/plugins/i18n'
import { i18n } from '@/plugins/02_i18n'
import type { TableColumn } from '@nuxt/ui'
ChartJS.register(Title, Tooltip, Legend, BarElement, CategoryScale, LinearScale)
@@ -86,7 +87,7 @@ async function loadIssues(repoID: number, year: number, quarterStr: string) {
loading.value = true
error.value = null
try {
const response = await getIssues(repoID, year, parseInt(quarterPart), page.value, 50)
const response = await getIssues(repoID, year, parseInt(quarterPart), page.value, 10)
issues.value = response.items || []
totalItems.value = response.items_count || 0
} catch (e: any) {
@@ -136,23 +137,64 @@ const quarterItems = computed(() => [
label: `${q.quarter} (${q.time.toFixed(1)}h)`
}))
])
const columns: TableColumn<IssueTimeSummary>[] = [
{
accessorKey: 'IssueID',
header: 'ID',
},
{
accessorKey: 'IssueName',
header: i18n.t('repo_chart.issue_name'),
},
// {
// accessorKey: 'Initials',
// header: i18n.t('repo_chart.user_initials'),
// },
{
accessorKey: 'CreatedDate',
header: i18n.t('repo_chart.created_on'),
cell: ({ row }) => {
const date = new Date(row.getValue('CreatedDate'))
return date.toLocaleDateString(i18n.locale.value)
}
},
{
accessorKey: 'CreatedDate',
header: i18n.t('repo_chart.created_on'),
cell: ({ row }) => {
const date = new Date(row.getValue('CreatedDate'))
return date.toLocaleTimeString(i18n.locale.value)
}
},
{
accessorKey: 'TotalHoursSpent',
header: i18n.t('repo_chart.hours_spent'),
meta: {
class: {
th: 'text-right',
td: 'text-right font-medium'
}
},
cell: ({ row }) => {
const hours = row.getValue('TotalHoursSpent')
return `${hours}h`
}
},
]
</script>
<template>
<div class="container">
<div class="p-6 bg-white dark:bg-(--black) min-h-screen font-sans">
<h1 class="text-2xl font-bold mb-6 text-black">{{ $t('repo_chart.repository_work_chart') }}</h1>
<h1 class="text-2xl font-bold mb-6 text-black dark:text-white">{{ $t('repo_chart.repository_work_chart') }}
</h1>
<div v-if="error" class="mb-4 p-3 bg-red-100 text-red-700 rounded">{{ error }}</div>
<div v-if="error" class="mb-4 p-3 bg-red-100 text-red-700 rounded">
{{ error }}
</div>
<div v-if="loading" class="mb-4 p-3 bg-blue-100 text-blue-700 rounded">
{{ $t('repo_chart.loading') }}...
<div v-if="loading" class="mb-4 p-3 bg-blue-100 text-blue-700 rounded">{{ $t('repo_chart.loading') }}...
</div>
<div v-if="!authStore.isAuthenticated" class="mb-4 p-3 bg-yellow-100 text-yellow-700 rounded">
<!-- Please log in to view repository work charts. -->
{{ $t('repo_chart.login_to_view_charts') }}
</div>
@@ -161,24 +203,22 @@ const quarterItems = computed(() => [
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ $t('repo_chart.repository')
}}</label>
<USelect v-model="selectedRepo" :items="items" :disabled="loading"
:placeholder="$t('repo_chart.select_a_repository')" class="dark:text-white text-black "/>
:placeholder="$t('repo_chart.select_a_repository')" class="dark:text-white text-black " />
<!-- Select a repository -->
</div>
<div class="flex flex-col min-w-[160px]">
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ $t('repo_chart.year')
}}</label>
<USelect v-model="selectedYear" :items="yearItems"
:disabled="loading || !selectedRepo || years.length === 0"
:placeholder="$t('repo_chart.select_a_year')" class="dark:text-white text-black "/>
:placeholder="$t('repo_chart.select_a_year')" class="dark:text-white text-black placeholder:text-(--placeholder)" />
</div>
<div class="flex flex-col min-w-[192px]">
<label class="mb-1 text-sm font-medium text-black dark:text-white">{{ $t('repo_chart.quarter')
}}</label>
<USelect v-model="selectedQuarter" :items="quarterItems"
:disabled="loading || !selectedYear || quarters.length === 0"
:placeholder="$t('repo_chart.all_quarters')" class="dark:text-white text-black "/>
:placeholder="$t('repo_chart.all_quarters')" class="dark:text-white text-black placeholder:text-(--placeholder)" />
</div>
</div>
@@ -196,50 +236,19 @@ const quarterItems = computed(() => [
<h2 class="text-xl font-medium mb-4 text-black dark:text-white">{{ $t('repo_chart.issues_for') }} {{
selectedQuarter }}
</h2>
<table class="w-full border border-(--border-light) dark:border-(--border-dark)">
<thead>
<tr class="bg-gray-100 dark:bg-(--black)">
<th
class="p-3 text-left text-xs font-bold text-gray-600 dark:text-white uppercase border border-(--border-light) dark:border-(--border-dark)">
ID</th>
<th
class="p-3 text-left text-xs font-bold text-gray-600 dark:text-white uppercase border border-(--border-light) dark:border-(--border-dark)">
{{ $t('repo_chart.issue_name') }}</th>
<th
class="p-3 text-left text-xs font-bold text-gray-600 dark:text-white uppercase border border-(--border-light) dark:border-(--border-dark)">
{{ $t('repo_chart.user_initials') }}</th>
<th
class="p-3 text-left text-xs font-bold text-gray-600 dark:text-white uppercase border border-(--border-light) dark:border-(--border-dark)">
{{ $t('repo_chart.created_on') }}</th>
<th
class="p-3 text-left text-xs font-bold text-gray-600 dark:text-white uppercase border border-(--border-light) dark:border-(--border-dark)">
{{ $t('repo_chart.hours_spent') }}</th>
</tr>
</thead>
<tbody>
<tr v-for="issue in issues" :key="issue.IssueID"
class=" border-b border-(--border-light) dark:border-(--border-dark)">
<td class="p-3 text-black dark:text-white">{{ issue.IssueID }}</td>
<td class="p-3 text-black dark:text-white">{{ issue.IssueName }}</td>
<td class="p-3 text-black dark:text-white">{{ issue.Initials }}</td>
<td class="p-3 text-black dark:text-white">{{ issue.CreatedDate }}</td>
<td class="p-3 text-black dark:text-white">{{ issue.TotalHoursSpent }}h</td>
</tr>
</tbody>
</table>
<div class="pt-4 flex justify-center items-center dark:text-white!">
<UTable :data="issues" :columns="columns" class="flex-1 dark:text-white! text-dark" />
<div class="pt-4 flex justify-center items-center dark:text-white! text-dark">
<UPagination v-model:page="page" :total="totalItems" />
</div>
</div>
<div v-else-if="selectedQuarter && !loading && authStore.isAuthenticated && !hasIssues"
class="mt-4 p-3 dark:bg-(--black) bg-white border border-(--border-light) dark:border-(--border-dark) dark:text-white text-black rounded">
class="mt-4 p-3 dark:bg-(--black) bg-white border border-(--border-light) dark:border-(--border-dark) dark:text-white! text-black rounded">
{{ $t('validate_error.no_issues_for_quarter') }}.
</div>
<div v-else-if="!loading && authStore.isAuthenticated" class="p-3 dark:bg-(--black) bg-white border border-(--border-light) dark:border-(--border-dark) rounded">
<div v-else-if="!loading && authStore.isAuthenticated"
class="p-3 dark:bg-(--black) bg-white border border-(--border-light) dark:border-(--border-dark) rounded dark:text-white! text-black">
<span v-if="!selectedRepo">{{ $t('repo_chart.select_repo_to_view_data') }}</span>
<span v-else-if="!selectedYear">{{ $t('repo_chart.select_year_to_view_data') }}</span>
<span v-else-if="!selectedQuarter">{{ $t('repo_chart.select_quarter_to_view_issues') }}</span>