TurTaskProject/TurTaskWeb
1
0
Fork 0
mirror of https://github.com/TurTaskProject/TurTaskWeb.git synced 2025-12-19 05:54:07 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'feature/dashboard' into feature/kanban-board

Browse Source
This commit is contained in:
Pattadon 2023-11-26 00:37:17 +07:00
commit 2070692c6a
8 changed files with 301 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
backend/dashboard/serializers.py
View File

@ -1,7 +1,7 @@
from rest_framework import serializers
from .models import UserStats
# from rest_framework import serializers
# from .models import UserStats
class UserStatsSerializer(serializers.ModelSerializer):
class Meta:
model = UserStats
fields = ['health', 'gold', 'experience', 'strength', 'intelligence', 'endurance', 'perception', 'luck', 'level']
# class UserStatsSerializer(serializers.ModelSerializer):
# class Meta:
# model = UserStats
# fields = ['health', 'gold', 'experience', 'strength', 'intelligence', 'endurance', 'perception', 'luck', 'level']

5
backend/dashboard/urls.py
View File

@ -1,11 +1,12 @@
from django.urls import path, include
from rest_framework.routers import DefaultRouter
from .views import DashboardStatsViewSet, DashboardWeeklyViewSet
from .views import DashboardStatsTodoViewSet, DashboardWeeklyViewSet
router = DefaultRouter()
router.register(r'dashboard/stats', DashboardStatsViewSet, basename='stats')
router.register(r'dashboard/todostats', DashboardStatsTodoViewSet, basename='statstodo')
router.register(r'dashboard/weekly', DashboardWeeklyViewSet, basename='weekly')
router.register(r'dashboard/recstats', DashboardStatsTodoViewSet, basename='statsrec')
urlpatterns = [
path('', include(router.urls)),
]

167
backend/dashboard/views.py
View File

@ -5,10 +5,13 @@ from rest_framework.response import Response
from rest_framework.permissions import IsAuthenticated
from rest_framework import viewsets, mixins
from tasks.models import Todo
from tasks.models import Todo, RecurrenceTask
class DashboardStatsViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
class DashboardStatsTodoViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
"""
A viewset for retrieving statistics related to user tasks for the last 7 days.
"""
permission_classes = (IsAuthenticated,)
def get_queryset(self):
@ -66,6 +69,27 @@ class DashboardStatsViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
# Overall completion rate
total_tasks = Todo.objects.filter(user=user).count()
overall_completion_rate = (completed_last_7_days / total_tasks) * 100 if total_tasks > 0 else 0
total_completed_tasks = Todo.objects.filter(user=user, completed=True).count()
total_tasks = Todo.objects.filter(user=user).count()
today_start = timezone.now().replace(hour=0, minute=0, second=0, microsecond=0)
today_end = timezone.now().replace(hour=23, minute=59, second=59, microsecond=999999)
tasks_completed_today = Todo.objects.filter(
user=user,
completed=True,
completion_date__gte=today_start,
completion_date__lte=today_end
).count()
total_tasks_today = Todo.objects.filter(
user=user,
completion_date__gte=today_start,
completion_date__lte=today_end
).count()
data = {
"completed_last_7_days": completed_last_7_days,
@ -75,6 +99,10 @@ class DashboardStatsViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
"completed_this_week": completed_this_week,
"overdue_tasks": overdue_tasks,
"overall_completion_rate": overall_completion_rate,
"total_completed_tasks": total_completed_tasks,
"total_tasks" : total_tasks,
"total_tasks_today": total_tasks_today,
"tasks_completed_today": tasks_completed_today,
}
return Response(data, status=status.HTTP_200_OK)
@ -145,7 +173,142 @@ class DashboardWeeklyViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
return Response(weekly_stats, status=status.HTTP_200_OK)
class DashboardStatsReccurenceViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
"""
A viewset for retrieving statistics related to user tasks for the last 7 days.
"""
permission_classes = (IsAuthenticated,)
def get_queryset(self):
return RecurrenceTask.objects.all()
def list(self, request, *args, **kwargs):
user = self.request.user
# Calculate the start and end date for the last 7 days
end_date = timezone.now()
start_date = end_date - timedelta(days=7)
# How many tasks were completed in the last 7 days
completed_last_7_days = RecurrenceTask.objects.filter(
user=user,
completed=True,
completion_date__gte=start_date,
completion_date__lte=end_date
).count()
# Task assign last week compared with this week
tasks_assigned_last_week = RecurrenceTask.objects.filter(
user=user,
completion_date__gte=start_date - timedelta(days=7),
completion_date__lte=start_date
).count()
tasks_assigned_this_week = RecurrenceTask.objects.filter(
user=user,
completion_date__gte=start_date,
completion_date__lte=end_date
).count()
# Completed tasks from last week compared with this week
completed_last_week = RecurrenceTask.objects.filter(
user=user,
completed=True,
completion_date__gte=start_date - timedelta(days=7),
completion_date__lte=start_date
).count()
completed_this_week = RecurrenceTask.objects.filter(
user=user,
completed=True,
completion_date__gte=start_date,
completion_date__lte=end_date
).count()
overdue_tasks = RecurrenceTask.objects.filter(
user=user,
completed=False,
end_event__lt=timezone.now()
).count()
# Overall completion rate
total_tasks = RecurrenceTask.objects.filter(user=user).count()
overall_completion_rate = (completed_last_7_days / total_tasks) * 100 if total_tasks > 0 else 0
total_completed_tasks = RecurrenceTask.objects.filter(
user=user,
completed=True
).count()
total_tasks = RecurrenceTask.objects.filter(user=user).count()
tasks_completed_today = RecurrenceTask.objects.filter(
user=user,
completed=True,
completion_date__gte=timezone.now().replace(hour=0, minute=0, second=0, microsecond=0)
).count()
data = {
"completed_last_7_days": completed_last_7_days,
"tasks_assigned_last_week": tasks_assigned_last_week,
"tasks_assigned_this_week": tasks_assigned_this_week,
"completed_last_week": completed_last_week,
"completed_this_week": completed_this_week,
"overdue_tasks": overdue_tasks,
"overall_completion_rate": overall_completion_rate,
"total_completed_tasks": total_completed_tasks,
"total_tasks" : total_tasks,
"tasks_completed_today": tasks_completed_today,
}
return Response(data, status=status.HTTP_200_OK)
# class DashboardStatsAllViewSet(viewsets.GenericViewSet, mixins.ListModelMixin):
# permission_classes = [IsAuthenticated]
# def get_queryset(self):
# return Todo.objects.filter(user=self.request.user)
# def list(self, request, *args, **kwargs):
# user = request.user
# # Calculate task usage statistics
# todo_count = self.get_queryset().count()
# recurrence_task_count = RecurrenceTask.objects.filter(user=user).count()
# # Calculate how many tasks were completed in the last 7 days
# completed_todo_count_last_week = Todo.objects.filter(user=user, completed=True, last_update__gte=timezone.now() - timezone.timedelta(days=7)).count()
# completed_recurrence_task_count_last_week = RecurrenceTask.objects.filter(user=user, completed=True, last_update__gte=timezone.now() - timezone.timedelta(days=7)).count()
# # Calculate subtask completion rate
# total_subtasks = Todo.objects.filter(user=user).aggregate(total=Count('subtask__id'))['total']
# completed_subtasks = Todo.objects.filter(user=user, subtask__completed=True).aggregate(total=Count('subtask__id'))['total']
# # Calculate overall completion rate
# total_tasks = todo_count + recurrence_task_count
# completed_tasks = completed_todo_count_last_week + completed_recurrence_task_count_last_week
# overall_completion_rate = (completed_tasks / total_tasks) * 100 if total_tasks > 0 else 0
# # pie chart show
# complete_todo_percent_last_week = (completed_todo_count_last_week / todo_count) * 100 if todo_count > 0 else 0
# complete_recurrence_percent_last_week = (completed_recurrence_task_count_last_week / recurrence_task_count) * 100 if recurrence_task_count > 0 else 0
# incomplete_task_percent_last_week = 100 - complete_recurrence_percent_last_week - complete_todo_percent_last_week
# data = {
# 'todo_count': todo_count,
# 'recurrence_task_count': recurrence_task_count,
# 'completed_todo_count_last_week': completed_todo_count_last_week,
# 'completed_recurrence_task_count_last_week': completed_recurrence_task_count_last_week,
# 'total_subtasks': total_subtasks,
# 'completed_subtasks': completed_subtasks,
# 'overall_completion_rate': overall_completion_rate,
# 'complete_todo_percent_last_week': complete_todo_percent_last_week,
# 'complete_recurrence_percent_last_week' : complete_recurrence_percent_last_week,
# 'incomplete_task_percent_last_week': incomplete_task_percent_last_week,
# }
# return Response(data, status=status.HTTP_200_OK)
# class DashboardStatsAPIView(APIView):
# permission_classes = [IsAuthenticated]

2
frontend/src/App.jsx
View File

@ -11,7 +11,7 @@ import { SideNav } from "./components/navigations/IconSideNav";
import { Eisenhower } from "./components/EisenhowerMatrix/Eisenhower";
import { PrivateRoute } from "./PrivateRoute";
import { ProfileUpdatePage } from "./components/profile/profilePage";
import { Dashboard } from "./components/dashboard/dashboard";
import { Dashboard } from "./components/dashboard/Dashboard";
import { LandingPage } from "./components/landingPage/LandingPage";
import { PublicRoute } from "./PublicRoute";
import { useAuth } from "./hooks/AuthHooks";

2
frontend/src/components/dashboard/KpiCard.jsx
View File

@ -13,7 +13,7 @@ export function KpiCard() {
useEffect(() => {
const fetchKpiCardData = async () => {
try {
const response = await axiosInstance.get("/dashboard/stats/");
const response = await axiosInstance.get("/dashboard/todostats/");
const completedThisWeek = response.data.completed_this_week || 0;
const completedLastWeek = response.data.completed_last_week || 0;
const percentage = (completedThisWeek / completedLastWeek) * 100;

13
frontend/src/components/dashboard/DonutChart.jsx → frontend/src/components/dashboard/PieChart.jsx
View File

@ -8,13 +8,13 @@ export function DonutChartGraph() {
useEffect(() => {
const fetchDonutData = async () => {
try {
const response = await axiosInstance.get("/dashboard/stats/");
const todoCount = response.data.todo_count || 0;
const recurrenceCount = response.data.recurrence_count || 0;
const response = await axiosInstance.get("/dashboard/todostats/");
const totalTask = response.data.total_tasks || 0;
const completedTask = response.data.total_completed_tasks || 0;
const donutData = [
{ name: "Todo", count: todoCount },
{ name: "Recurrence", count: recurrenceCount },
{ name: "Completed task", count: totalTask },
{ name: "Total task", count: completedTask },
];
setDonutData(donutData);
@ -31,9 +31,10 @@ export function DonutChartGraph() {
data={donutData}
category="count"
index="name"
colors={["rose", "yellow", "orange"]}
colors={["rose", "yellow"]}
showAnimation
radius={25}
variant="pie"
/>
);
}

2
frontend/src/components/dashboard/ProgressCircle.jsx
View File

@ -8,7 +8,7 @@ export function ProgressCircleChart() {
useEffect(() => {
const fetchProgressData = async () => {
try {
const response = await axiosInstance.get("/dashboard/stats/");
const response = await axiosInstance.get("/dashboard/todostats/");
let completedLastWeek = response.data.completed_last_week || 0;
let assignLastWeek = response.data.tasks_assigned_last_week || 0;

131
frontend/src/components/dashboard/dashboard.jsx
View File

@ -1,22 +1,66 @@
import { Card, Grid, Tab, TabGroup, TabList, TabPanel, TabPanels, Text, Title, Legend } from "@tremor/react";
import {
Card,
Grid,
Tab,
TabGroup,
TabList,
TabPanel,
TabPanels,
Text,
Title,
Legend,
Metric,
ProgressCircle,
Flex,
} from "@tremor/react";
import { KpiCard } from "./KpiCard";
import { BarChartGraph } from "./Barchart";
import { DonutChartGraph } from "./DonutChart";
import { AreaChartGraph } from "./Areachart";
import { DonutChartGraph } from "./PieChart";
import { ProgressCircleChart } from "./ProgressCircle";
import { useState } from "react";
import { axiosInstance } from "src/api/AxiosConfig";
import { useEffect, useState } from "react";
const valueFormatter = (number) =>
`$ ${new Intl.NumberFormat("us").format(number).toString()}`;
export function Dashboard() {
const [value, setValue] = useState({
from: new Date(2021, 0, 1),
to: new Date(2023, 0, 7),
});
const [totalTask, setTotalTask] = useState(0);
const [totalCompletedTasks, settotalCompletedTasks] = useState(0);
const [totalCompletedTasksToday, setTotalCompletedTasksToday] = useState(0);
const [progressData, setProgressData] = useState(0);
const [overdueTask, setOverdueTask] = useState(0);
useEffect(() => {
const fetchData = async () => {
const response = await axiosInstance.get("/dashboard/todostats/");
const totalTaskValue = response.data.total_tasks || 0;
const totalCompletedTasksValue = response.data.total_completed_tasks || 0;
const totalCompletedTasksTodayValue =
response.data.total_completed_tasks_today || 0;
const totalTaskToday = response.data.total_task_today || 0;
const totalCompletedTasksToday = response.data.tasks_completed_today || 0;
const overdueTasks = response.data.overdue_tasks || 0;
const progress =
(totalCompletedTasksToday / totalCompletedTasksToday) * 100;
setTotalTask(totalTaskValue);
settotalCompletedTasks(totalCompletedTasksValue);
setTotalCompletedTasksToday(totalCompletedTasksTodayValue);
setTotalTaskToday(totalTaskToday);
setProgressData(progress);
setOverdueTask(overdueTasks);
};
fetchData();
}, []);
return (
<div className="flex flex-col p-12">
<div>
<Title>Dashboard</Title>
<Text>All of your progress will be shown right here.</Text>
<br />
</div>
<div>
@ -39,8 +83,9 @@ export function Dashboard() {
<ProgressCircleChart />
<Legend
className="mt-3 mx-auto w-1/2"
categories={["Completed Tasks", "Assigned Tasks"]}
colors={["indigo"]}></Legend>
categories={["Completed Tasks"]}
colors={["indigo"]}
></Legend>
</Card>
<Card>
<BarChartGraph />
@ -50,19 +95,77 @@ export function Dashboard() {
</Card>
</Grid>
</TabPanel>
{/*Overview Tab*/}
<TabPanel>
<div className="h-31">
<Grid numItemsMd={2} numItemsLg={3} className="gap-6 mt-6">
<Card>
<Title className="mx-auto">Overview</Title>
<Card
className="max-w-xs mx-auto"
decoration="top"
decorationColor="yellow"
>
<Text>Total tasks</Text>
<Metric>{totalTask}</Metric>
</Card>
<br></br>
<Card
className="max-w-xs mx-auto"
decoration="top"
decorationColor="rose"
>
<Text>Total completed tasks</Text>
<Metric>{totalCompletedTasks}</Metric>
</Card>
<br></br>
<Card
className="max-w-xs mx-auto"
decoration="top"
decorationColor="pink"
>
<Text>Overdue tasks</Text>
<Metric>{overdueTask}</Metric>
</Card>
<br></br>
</Card>
{/*Pie chart graph*/}
<Card className="mx-auto h-full">
<Title>Tasks</Title>
<Title>Overall completion rate</Title>
<DonutChartGraph />
<br />
<Legend
className="mt-3 mx-auto w-1/2"
categories={["Todo Task", "Recurrence Task"]}
categories={["Completed Task", "Total Task"]}
colors={["rose", "yellow"]}
/>
</Card>
</div>
{/*Progress circle graph*/}
<Card className="max-w-lg mx-auto">
<Title>Today's progress</Title>
<br />
<Flex className="flex-col items-center">
<ProgressCircle
className="mt-6"
value={progressData}
size={200}
strokeWidth={10}
radius={60}
color="rose"
>
<span className="h-12 w-12 rounded-full bg-rose-100 flex items-center justify-center text-sm text-rose-500 font-medium">
{progressData.toFixed(0)} %
</span>
</ProgressCircle>
<br></br>
<Legend
className="mt-3 mx-auto w-1/2"
categories={["Completed Tasks"]}
colors={["rose"]}
></Legend>
</Flex>
</Card>
</Grid>
</TabPanel>
</TabPanels>
</TabGroup>