mirror of https://github.com/Devoalda/LaDo.git
feature(Dashboard):
Added: - Dashboard Functionality to display stats and todos - Common template for todo listing for project and todo pages
This commit is contained in:
parent
c3f4ad8f6d
commit
0603b56602
|
|
@ -0,0 +1,114 @@
|
|||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\DB;
|
||||
|
||||
class DashboardController extends Controller
|
||||
{
|
||||
public function index()
|
||||
{
|
||||
$data = $this->all_incomplete_todos();
|
||||
|
||||
$todos = $data['todos'];
|
||||
$incomplete_count = $data['incomplete_count'];
|
||||
// Convert all todo to Todo model
|
||||
$todos->transform(function ($todo) {
|
||||
return \App\Models\Todo::find($todo->id);
|
||||
});
|
||||
|
||||
$projects = $this->projects();
|
||||
$project_count = $projects['project_count'];
|
||||
$ave_todo_count = $projects['ave_todo_count'];
|
||||
|
||||
$todo_completed_count = $this->all_completed_todos()['completed_count'];
|
||||
|
||||
return view('dashboard', compact(
|
||||
'todos',
|
||||
'incomplete_count',
|
||||
'project_count',
|
||||
'ave_todo_count',
|
||||
'todo_completed_count'
|
||||
));
|
||||
}
|
||||
|
||||
public function all_incomplete_todos(): array
|
||||
{
|
||||
$user = auth()->user();
|
||||
// Join project_todo first and project_user tables, paginate the results
|
||||
$todos = DB::table('todos')
|
||||
->join('project_todo', 'todos.id', '=', 'project_todo.todo_id')
|
||||
->join('project_user', 'project_todo.project_id', '=', 'project_user.project_id')
|
||||
->where('project_user.user_id', '=', $user->id)
|
||||
->whereDate('due_end', '<=', strtotime('today midnight'))
|
||||
->whereNull('completed_at')
|
||||
->orderBy('due_end', 'asc')
|
||||
->paginate(5);
|
||||
|
||||
$all_incomplete_count = DB::table('todos')
|
||||
->join('project_todo', 'todos.id', '=', 'project_todo.todo_id')
|
||||
->join('project_user', 'project_todo.project_id', '=', 'project_user.project_id')
|
||||
->where('project_user.user_id', '=', $user->id)
|
||||
->whereDate('due_end', '<=', strtotime('today midnight'))
|
||||
->whereNull('completed_at')
|
||||
->count();
|
||||
|
||||
$all_incomplete_count = max($all_incomplete_count, 0);
|
||||
|
||||
return [
|
||||
'todos' => $todos,
|
||||
'incomplete_count' => $all_incomplete_count,
|
||||
];
|
||||
}
|
||||
|
||||
public function projects(): array
|
||||
{
|
||||
$user = auth()->user();
|
||||
$projects = $user->projects;
|
||||
$project_count = $projects->count();
|
||||
|
||||
// Average number of todos per project
|
||||
$ave_todo_count = function ($projects) {
|
||||
$todo_count = 0;
|
||||
foreach ($projects as $project) {
|
||||
$todo_count += $project->todos->count();
|
||||
}
|
||||
return $todo_count / $projects->count();
|
||||
};
|
||||
|
||||
return [
|
||||
'projects' => $projects,
|
||||
'project_count' => $project_count,
|
||||
'ave_todo_count' => $ave_todo_count($projects),
|
||||
];
|
||||
}
|
||||
|
||||
public function all_completed_todos(): array
|
||||
{
|
||||
$user = auth()->user();
|
||||
// Join project_todo first and project_user tables, paginate the results
|
||||
$todos = DB::table('todos')
|
||||
->join('project_todo', 'todos.id', '=', 'project_todo.todo_id')
|
||||
->join('project_user', 'project_todo.project_id', '=', 'project_user.project_id')
|
||||
->where('project_user.user_id', '=', $user->id)
|
||||
->whereDate('due_end', '<=', strtotime('today midnight'))
|
||||
->whereNotNull('completed_at')
|
||||
->paginate(5);
|
||||
|
||||
$all_completed_count = DB::table('todos')
|
||||
->join('project_todo', 'todos.id', '=', 'project_todo.todo_id')
|
||||
->join('project_user', 'project_todo.project_id', '=', 'project_user.project_id')
|
||||
->where('project_user.user_id', '=', $user->id)
|
||||
->whereDate('due_end', '<=', strtotime('today midnight'))
|
||||
->whereNotNull('completed_at')
|
||||
->count();
|
||||
|
||||
$all_completed_count = max($all_completed_count, 0);
|
||||
|
||||
return [
|
||||
'todos' => $todos,
|
||||
'completed_count' => $all_completed_count,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
|
@ -28,8 +28,7 @@ class ProjectTodoController extends Controller
|
|||
|
||||
if (!$project || $project->user->id !== auth()->user()->id)
|
||||
return back()
|
||||
->with('error', 'Project not found')
|
||||
->setStatusCode(404);
|
||||
->with('error', 'Project not found');
|
||||
|
||||
$todos = $project->todos;
|
||||
|
||||
|
|
|
|||
|
|
@ -5,14 +5,185 @@
|
|||
</h2>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6 text-gray-900 dark:text-gray-100">
|
||||
{{ __("You're logged in!") }}
|
||||
<!-- Display Statistics of Todo Completion -->
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-indigo-500 dark:text-indigo-400">
|
||||
<!-- Icon for Target board -->
|
||||
<svg class="inline-block h-6 w-6 text-indigo-500 dark:text-indigo-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M9 9v6m0 0v6m0-6h6m-6 0H3"/>
|
||||
</svg>
|
||||
Your Stats
|
||||
</h2>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
|
||||
<div class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6">
|
||||
<h3 class="text-xl font-semibold mb-4 text-red-500 dark:text-red-400">
|
||||
<!-- SVG for Incomplete Todos -->
|
||||
<svg class="inline-block h-6 w-6 text-red-500 dark:text-red-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M6 18L18 6M6 6l12 12"/>
|
||||
</svg>
|
||||
Total incomplete Todos
|
||||
</h3>
|
||||
<p class="text-3xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $incomplete_count }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Todo Completed Count -->
|
||||
<div class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6">
|
||||
<h3 class="text-xl font-semibold mb-4 text-green-500 dark:text-green-400">
|
||||
<!-- SVG for Completed Todos -->
|
||||
<svg class="inline-block h-6 w-6 text-green-500 dark:text-green-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"/>
|
||||
</svg>
|
||||
Total Completed Todos
|
||||
</h3>
|
||||
<p class="text-3xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $todo_completed_count }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Average Todo Count per Project -->
|
||||
<div class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6">
|
||||
<h3 class="text-xl font-semibold mb-4 text-yellow-500 dark:text-yellow-400">
|
||||
<!-- SVG for Average Todos -->
|
||||
<svg class="inline-block h-6 w-6 text-yellow-500 dark:text-yellow-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
|
||||
</svg>
|
||||
Average Todos per Project
|
||||
</h3>
|
||||
<p class="text-3xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $ave_todo_count }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Project Count -->
|
||||
<div class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6">
|
||||
<h3 class="text-xl font-semibold mb-4 text-blue-500 dark:text-blue-400">
|
||||
<!-- SVG for Project Count -->
|
||||
<svg class="inline-block h-6 w-6 text-blue-500 dark:text-blue-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
|
||||
</svg>
|
||||
Total Projects
|
||||
</h3>
|
||||
<p class="text-3xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $project_count }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- List out Todos and their details (time left/ago) + checkbox in form to toggle completed -->
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-green-500 dark:text-green-400">
|
||||
Today's Todos
|
||||
({{ $incomplete_count }})
|
||||
</h2>
|
||||
<div class="space-y-4">
|
||||
@foreach ($todos as $todo)
|
||||
<a href="{{ route('project.todo.edit', [$todo->project->id, $todo->id]) }}" class="block">
|
||||
<div
|
||||
class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 flex items-center justify-between">
|
||||
<div class="flex items-center">
|
||||
<form action="{{ route('project.todo.update', [$todo->project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<input type="checkbox" name="completed_at" id="completed_at_{{ $todo->id }}"
|
||||
class="w-4 h-4 text-green-600 bg-gray-100 border-gray-300 rounded focus:ring-green-500 dark:focus:ring-green-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onchange="this.form.submit()" {{ $todo->completed_at ? 'checked' : ''
|
||||
}}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span
|
||||
class="ml-2 text-2xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $todo->title }}
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
@php
|
||||
if ($todo->due_start && $todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_start) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_start);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} else {
|
||||
// If there is no due_start or due_end, set $timeRemaining to null
|
||||
$timeRemaining = null;
|
||||
}
|
||||
@endphp
|
||||
|
||||
@if ($timeRemaining !== null)
|
||||
@if ($due->isFuture())
|
||||
<p class="text-sm text-green-600">{{ $timeRemaining }} remaining</p>
|
||||
@else
|
||||
<p class="text-sm text-red-600">{{ $timeRemaining }} ago</p>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Pagination with CSS -->
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4 pb-4">
|
||||
{{ $todos->links() }}
|
||||
</div>
|
||||
|
||||
</x-app-layout>
|
||||
|
|
|
|||
|
|
@ -74,116 +74,7 @@
|
|||
});
|
||||
</script>
|
||||
|
||||
@include('todo.todo_list')
|
||||
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-red-500 dark:text-red-400">
|
||||
Not Completed ({{ $todos->count() }})
|
||||
</h2>
|
||||
<div class="space-y-4">
|
||||
@foreach ($todos as $todo)
|
||||
@if (!$todo->completed_at)
|
||||
<a href="{{ route('project.todo.edit', [$todo->project->id, $todo->id]) }}" class="block">
|
||||
<div
|
||||
class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 flex items-center justify-between">
|
||||
<div class="flex items-center">
|
||||
<!-- Checkbox to toggle completed at -->
|
||||
<form action="{{ route('project.todo.update', [$todo->project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<input type="checkbox" name="completed_at"
|
||||
class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onclick="this.form.submit()" {{ $todo->completed_at ? 'checked' : ''
|
||||
}}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span
|
||||
class="ml-2 text-xl font-bold text-gray-800 dark:text-gray-100">{{ $todo->title }}
|
||||
<!-- Project name and link to project beside todo title as a badge with a blue background -->
|
||||
<span
|
||||
class="ml-2 text-sm font-semibold text-blue-600 bg-blue-100 rounded-full px-2 py-1">{{ $todo->project->name }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
@php
|
||||
if ($todo->due_start && $todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_start) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_start);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} else {
|
||||
// If there is no due_start or due_end, set $timeRemaining to null
|
||||
$timeRemaining = null;
|
||||
}
|
||||
@endphp
|
||||
|
||||
@if ($timeRemaining !== null)
|
||||
@if ($due->isFuture())
|
||||
<p class="text-sm text-green-600">{{ $timeRemaining }} remaining</p>
|
||||
@else
|
||||
<p class="text-sm text-red-600">{{ $timeRemaining }} ago</p>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-green-500 dark:text-green-400">
|
||||
Completed Today
|
||||
({{ $completed->count() }})
|
||||
</h2>
|
||||
<div class="space-y-4">
|
||||
@foreach ($completed as $todo)
|
||||
<a href="{{ route('project.todo.edit', [$todo->project->id, $todo->id]) }}"
|
||||
class="block">
|
||||
<div
|
||||
class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 flex items-center justify-between">
|
||||
<div class="flex items-center">
|
||||
<form action="{{ route('project.todo.update', [$todo->project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<input type="checkbox" name="completed_at" id="completed_at_{{ $todo->id }}"
|
||||
class="w-4 h-4 text-green-600 bg-gray-100 border-gray-300 rounded focus:ring-green-500 dark:focus:ring-green-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onchange="this.form.submit()" {{ $todo->completed_at ? 'checked' : ''
|
||||
}}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span
|
||||
class="ml-2 text-2xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $todo->title }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</x-app-layout>
|
||||
|
|
|
|||
|
|
@ -41,105 +41,6 @@
|
|||
</form>
|
||||
</div>
|
||||
|
||||
@include('todo.todo_list')
|
||||
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-red-500 dark:text-red-400">
|
||||
Not Completed ({{ $todos->count() }})
|
||||
</h2>
|
||||
<div class="space-y-4">
|
||||
@foreach ($todos as $todo)
|
||||
@if (!$todo->completed_at)
|
||||
<a href="{{ route('project.todo.edit', [$project->id, $todo->id]) }}" class="block">:
|
||||
<div
|
||||
class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 flex items-center justify-between">
|
||||
<div class="flex items-center">
|
||||
<!-- Checkbox to toggle completed at -->
|
||||
<form action="{{ route('project.todo.update', [$project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<input type="checkbox" name="completed_at"
|
||||
class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onclick="this.form.submit()" {{ $todo->completed_at ? 'checked' : '' }}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span class="ml-2 text-xl font-bold text-gray-800 dark:text-gray-100">{{ $todo->title }}</span>
|
||||
</div>
|
||||
<div>
|
||||
@php
|
||||
if ($todo->due_start && $todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) : $due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_start) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_start);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) : $due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) : $due->diffForHumans($now,
|
||||
true);
|
||||
} else {
|
||||
// If there is no due_start or due_end, set $timeRemaining to null
|
||||
$timeRemaining = null;
|
||||
}
|
||||
@endphp
|
||||
|
||||
@if ($timeRemaining !== null)
|
||||
@if ($due->isFuture())
|
||||
<p class="text-sm text-green-600">{{ $timeRemaining }} remaining</p>
|
||||
@else
|
||||
<p class="text-sm text-red-600">{{ $timeRemaining }} ago</p>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 mt-4">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-green-500 dark:text-green-400">
|
||||
Completed Today
|
||||
({{ $completed->count() }})
|
||||
</h2>
|
||||
<div class="space-y-4">
|
||||
@foreach ($completed as $todo)
|
||||
<a href="{{ route('project.todo.edit', [$project->id, $todo->id]) }}" class="block">
|
||||
<div
|
||||
class="bg-white dark:bg-gray-800 shadow-sm rounded-lg p-6 flex items-center justify-between">
|
||||
<div class="flex items-center">
|
||||
<form action="{{ route('project.todo.update', [$project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<input type="checkbox" name="completed_at" id="completed_at_{{ $todo->id }}"
|
||||
class="w-4 h-4 text-green-600 bg-gray-100 border-gray-300 rounded focus:ring-green-500 dark:focus:ring-green-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onchange="this.form.submit()" {{ $todo->completed_at ? 'checked' : ''
|
||||
}}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span
|
||||
class="ml-2 text-2xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $todo->title }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,150 @@
|
|||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 mt-4">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 py-4">
|
||||
<!-- Incomplete Todos Section -->
|
||||
<div class="bg-white dark:bg-gray-800 shadow-sm rounded-lg">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-red-500 dark:text-red-400 px-6 pt-6">
|
||||
Not Completed ({{ $todos->count() }})
|
||||
</h2>
|
||||
<div class="space-y-4 mb-4">
|
||||
@foreach ($todos as $todo)
|
||||
@if (!$todo->completed_at)
|
||||
<a href="{{ route('project.todo.edit', [$todo->project->id, $todo->id]) }}" class="block">
|
||||
<div class="p-6 bg-white dark:bg-gray-800 shadow-sm rounded-lg flex items-center">
|
||||
<!-- Checkbox to toggle completed at -->
|
||||
<form action="{{ route('project.todo.update', [$todo->project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<!-- Larger Checkbox -->
|
||||
<input type="checkbox" name="completed_at"
|
||||
class="w-6 h-6 text-green-600 bg-gray-100 border-gray-300 rounded focus:ring-green-500 dark:focus:ring-green-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onclick="this.form.submit()" {{ $todo->completed_at ? 'checked' : '' }}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span
|
||||
class="ml-2 text-xl font-bold text-gray-800 dark:text-gray-100">{{ $todo->title }}</span>
|
||||
<!-- Badge smaller width, below the title -->
|
||||
<div
|
||||
class="ml-8 mt-2 py-1 px-2 text-sm font-semibold text-blue-600 bg-blue-100 rounded-full w-64 truncate">
|
||||
{{ $todo->project->name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Date -->
|
||||
<div class="relative px-6 pb-6">
|
||||
@php
|
||||
if ($todo->due_start && $todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_start) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_start);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} else {
|
||||
// If there is no due_start or due_end, set $timeRemaining to null
|
||||
$timeRemaining = null;
|
||||
}
|
||||
@endphp
|
||||
|
||||
@if ($timeRemaining !== null)
|
||||
@if ($due->isFuture())
|
||||
<p class="text-sm text-green-600">{{ $timeRemaining }} remaining</p>
|
||||
@else
|
||||
<p class="text-sm text-red-600">{{ $timeRemaining }} ago</p>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Completed Todos Section -->
|
||||
<div class="bg-white dark:bg-gray-800 shadow-sm rounded-lg">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-green-500 dark:text-green-400 px-6 pt-6">
|
||||
Completed Today ({{ $completed->count() }})
|
||||
</h2>
|
||||
<div class="space-y-4">
|
||||
@foreach ($completed as $todo)
|
||||
<a href="{{ route('project.todo.edit', [$todo->project->id, $todo->id]) }}" class="block">
|
||||
<div class="p-6 bg-white dark:bg-gray-800 shadow-sm rounded-lg flex items-center">
|
||||
<form action="{{ route('project.todo.update', [$todo->project->id, $todo->id]) }}"
|
||||
method="POST"
|
||||
class="toggle-completed-form">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<label class="flex items-center cursor-pointer">
|
||||
<!-- Larger checkbox for completed -->
|
||||
<input type="checkbox" name="completed_at" id="completed_at_{{ $todo->id }}"
|
||||
class="w-6 h-6 text-green-600 bg-gray-100 border-gray-300 rounded focus:ring-green-500 dark:focus:ring-green-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
onchange="this.form.submit()" {{ $todo->completed_at ? 'checked' : '' }}>
|
||||
<span class="ml-2 text-sm text-gray-700"></span>
|
||||
</label>
|
||||
</form>
|
||||
<span class="ml-2 text-xl font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $todo->title }}
|
||||
</span>
|
||||
<!-- Badge -->
|
||||
<div
|
||||
class="ml-8 mt-2 py-1 px-2 text-sm font-semibold text-green-600 bg-green-100 rounded-full w-64 truncate">
|
||||
{{ $todo->project->name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Date all Green -->
|
||||
<div class="relative px-6 pb-6">
|
||||
@php
|
||||
if ($todo->due_start && $todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_start) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_start);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} elseif ($todo->due_end) {
|
||||
$due = \Carbon\Carbon::parse($todo->due_end);
|
||||
$now = now();
|
||||
$timeRemaining = $due->isFuture() ? $now->diffForHumans($due, true) :
|
||||
$due->diffForHumans($now,
|
||||
true);
|
||||
} else {
|
||||
// If there is no due_start or due_end, set $timeRemaining to null
|
||||
$timeRemaining = null;
|
||||
}
|
||||
@endphp
|
||||
|
||||
@if ($timeRemaining !== null)
|
||||
@if ($due->isFuture())
|
||||
<p class="text-sm text-green-600">{{ $timeRemaining }} remaining</p>
|
||||
@else
|
||||
<p class="text-sm text-green-600">{{ $timeRemaining }} ago</p>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
<?php
|
||||
|
||||
use App\Http\Controllers\DashboardController;
|
||||
use App\Http\Controllers\ProfileController;
|
||||
use App\Http\Controllers\ProjectController;
|
||||
use App\Http\Controllers\ProjectTodoController;
|
||||
|
|
@ -20,9 +21,8 @@ Route::get('/', function () {
|
|||
return redirect(route('project.index'));
|
||||
});
|
||||
|
||||
Route::get('/dashboard', function () {
|
||||
return view('dashboard');
|
||||
})->middleware(['auth', 'verified'])
|
||||
Route::get('/dashboard', [DashboardController::class, 'index'])
|
||||
->middleware(['auth', 'verified'])
|
||||
->name('dashboard');
|
||||
|
||||
Route::resource('project.todo', ProjectTodoController::class)
|
||||
|
|
|
|||
Loading…
Reference in New Issue