second commit

cuzinxyz · Jul 8, 2023 · f57e2da · f57e2da
1 parent 6e179ec
commit f57e2da
Show file tree

Hide file tree

Showing 9 changed files with 135 additions and 16 deletions.
diff --git a/app/Http/Controllers/TaskController.php b/app/Http/Controllers/TaskController.php
@@ -4,6 +4,8 @@
 
 use Exception;
 use App\Models\Task;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\DB;
 use Illuminate\Support\Facades\Log;
 use App\Http\Requests\StoreTaskRequest;
 use App\Http\Requests\UpdateTaskRequest;
@@ -15,8 +17,12 @@ class TaskController extends Controller
      */
     public function index()
     {
-        $tasks = Task::all();
-//dd($tasks);
+        $tasks = Task::orderBy('id', 'desc')
+                ->get();
+        // $tasks = DB::table('tasks')
+        //         ->orderBy('updated_at', 'desc')
+        //         ->get();
+// dd($tasks);
         return view('todo', compact('tasks'));
     }
 
@@ -51,7 +57,10 @@ public function edit(Task $task)
      */
     public function update(UpdateTaskRequest $request, Task $task)
     {
-        //
+        $task->fill($request->validated());
+        $task->save();
+
+        return redirect()->route('homepage');
     }
 
     /**
@@ -69,4 +78,13 @@ public function destroy(Task $task)
             Log::error($e->getMessage());
         }
     }
+
+    public function filter(String $type, Request $request)
+    {
+        if ($request->is('task/*')) {
+            $task = Task::where('is_completed', $type)->get();
+
+            return response()->json($task);
+        }
+    }
 }
diff --git a/app/Http/Requests/StoreTaskRequest.php b/app/Http/Requests/StoreTaskRequest.php
@@ -25,4 +25,11 @@ public function rules(): array
             'name' => 'required|max:250'
         ];
     }
+
+    public function messages(): array
+    {
+        return [
+            'required' => 'The :attribute field is required.',
+        ];
+    }
 }
diff --git a/app/Http/Requests/UpdateTaskRequest.php b/app/Http/Requests/UpdateTaskRequest.php
@@ -11,7 +11,7 @@ class UpdateTaskRequest extends FormRequest
      */
     public function authorize(): bool
     {
-        return false;
+        return true;
     }
 
     /**
@@ -22,7 +22,8 @@ public function authorize(): bool
     public function rules(): array
     {
         return [
-            //
+            'name' => 'required|string|max:255',
+            'is_completed' => 'boolean|required'
         ];
     }
 }
diff --git a/app/Models/Task.php b/app/Models/Task.php
@@ -9,5 +9,5 @@ class Task extends Model
 {
     use HasFactory;
 
-    protected $fillable = ['name'];
+    protected $fillable = ['name', 'is_completed'];
 }
diff --git a/public/assets/css/style.css b/public/assets/css/style.css
@@ -8,7 +8,7 @@
 }
 body{
     width: 100%;
-    height: 100vh;
+    min-height: 100vh;
     overflow: hidden;
     background: linear-gradient(135deg, #4AB1FF, #2D5CFE);
 }
@@ -97,7 +97,23 @@ body{
     margin-top: 20px;
     margin-right: 5px;
     padding: 0 20px 10px 25px;
+    overflow:hidden; overflow-y:scroll;
+    max-height: 340px;
 }
+
+@keyframes circle-in-bottom-left {
+    from {
+        clip-path: circle(0%);
+    }
+    to {
+        clip-path: circle(150% at bottom left);
+    }
+}
+
+[transition-style="in:circle:bottom-left"] {
+    animation: 2.5s cubic-bezier(.25, 1, .30, 1) circle-in-bottom-left both;
+}
+
 .task-box.overflow{
     overflow-y: auto;
     max-height: 300px;
@@ -202,6 +218,7 @@ body{
     }
     .wrapper {
         padding: 20px 0;
+        margin: 20px auto;
     }
     .filters span{
         margin: 0 5px;
@@ -296,4 +313,4 @@ body{
     margin: 10px 0 0 0;
     display: flex;
     column-gap: 16px;
-  }
+  }
diff --git a/resources/views/edit.blade.php b/resources/views/edit.blade.php
@@ -2,11 +2,12 @@
 
 @section('content')
 
-<form class="task-input" action="{{ route('storeTask') }}" method="POST">
+<form class="task-input" action="{{ route('updateTask', $task) }}" method="POST">
     @csrf
+    @method('PUT')
     <svg class="icon-task" xmlns="http://www.w3.org/2000/svg" width="16" height="16" id="tasks"><path fill="#444" d="M6 0h10v4H6V0zM6 6h10v4H6V6zM6 12h10v4H6v-4zM3 1v2H1V1h2zm1-1H0v4h4V0zM3 13v2H1v-2h2zm1-1H0v4h4v-4zM5.3 5.9l-.6-.8-.9.9H0v4h4V7.2l1.3-1.3zM2.7 7l-.7.7-.8-.7h1.5zM1 8.2l.9.8H1v-.8zM3 9h-.9l.9-.9V9z"></path></svg>
     <input type="text" name="name" title="Press Enter to Save" autofocus placeholder="Edit your task" value="{{ ($task) ? $task->name : '' }}">
-    
+
     <div class="select-status">
         <input type="radio" name="is_completed" value="1" id="option-1" checked>
         <input type="radio" name="is_completed" value="0" id="option-2">
@@ -23,4 +24,4 @@
     <input type="submit" value="" hidden>
 </form>
 
-@endsection
+@endsection
diff --git a/resources/views/layout.blade.php b/resources/views/layout.blade.php
@@ -17,6 +17,7 @@
 </div>
 
 <script src="/assets/js/script.js"></script>
+@yield('js')
 
 </body>
-</html>
+</html>
diff --git a/resources/views/todo.blade.php b/resources/views/todo.blade.php
@@ -2,6 +2,17 @@
 @extends('layout')
 
 @section('content')
+
+@if ($errors->any())
+    <div class="alert alert-danger">
+        <ul>
+            @foreach ($errors->all() as $error)
+                <li>{{ $error }}</li>
+            @endforeach
+        </ul>
+    </div>
+@endif
+
     <div>
         <form class="task-input" action="{{ route('storeTask') }}" method="POST">
             @csrf
@@ -19,14 +30,14 @@
         </div>
         <button class="clear-btn">Clear All</button>
     </div>
-    <ul class="task-box">
+    <ul class="task-box" transition-style="circle:in:bottom:left">
         @if($tasks->isEmpty())
             <span>You don't have any task here</span>
         @else
             @foreach($tasks as $task)
             <li class="task">
                 <label for="{{$task->id}}">
-                    <input type="checkbox" id="{{$task->id}}">
+{{--                    <input type="checkbox" id="{{$task->id}}">--}}
                     <p class="@if( $task->is_completed == 1 ) checked @else hi @endif">{{$task->name}}</p>
                 </label>
                 <div class="settings">
@@ -47,4 +58,64 @@
             @endforeach
         @endif
     </ul>
-@endsection
+@endsection
+
+@section('js')
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
+    <script>
+        $('#pending').click(function() {
+            $.ajax({
+                        url: '/task/0',
+                        type: 'GET',
+                        success: function(data) {
+                            // Xử lý kết quả trả về từ server
+                            console.log(data);
+                            const listTask = data.map((task, index) => {
+                                return `
+            <li class="task">
+                <label for="${task.id}">
+                    <p class="${task.is_completed == 1 ? ' checked' : 'hi'}">${task.name}</p>
+                </label>
+                <div class="settings">
+                    <i onclick="showMenu(this)" class="uil uil-ellipsis-h"></i>
+                    <ul class="task-menu">
+                        <li onclick='window.location.href="/edit/${task.id}"'><i class="uil uil-pen"></i>Edit</li>
+                        <li>
+                            <i class="uil uil-trash"></i>
+                            <form action="/delete/${task.id}" method="POST">
+                                <button class="reset-button" type="submit" onclick="return confirm('Are you sure?');" title="Delete" class="btn btn-sm btn-danger"> Delete </button>
+                            </form>
+                        </li>
+                    </ul>
+                </div>
+            </li>
+                                `;
+                            }).join("");
+                            $('.task-box').html(listTask);
+                        }
+                    });
+        });
+        $('#completed').click(function() {
+            $.ajax({
+                url: '/task/1',
+                type: 'GET',
+                success: function(data) {
+                    // Xử lý kết quả trả về từ server
+                    console.log(data);
+                }
+            });
+        });
+        // $('#filter-button').click(function() {
+        //     var status = $('select[name=status]').val(); // Lấy giá trị của trường status
+        //     $.ajax({
+        //         url: '/items',
+        //         type: 'GET',
+        //         data: { status: status },
+        //         success: function(data) {
+        //             // Xử lý kết quả trả về từ server
+        //             console.log(data);
+        //         }
+        //     });
+        // });
+    </script>
+@endsection
diff --git a/routes/web.php b/routes/web.php
@@ -23,5 +23,8 @@
 )->name('storeTask');
 
 Route::get('/edit/{task}', [TaskController::class, 'edit'])->name('editTask');
+Route::put('/edit/{task}', [TaskController::class, 'update'])->name('updateTask');
 
-Route::delete('/delete/{task}', [TaskController::class, 'destroy'])->name('destroyTask');
+Route::delete('/delete/{task}', [TaskController::class, 'destroy'])->name('destroyTask');
+
+Route::get('/task/{type}', [TaskController::class, 'filter'])->name('filterTask');
-Original file line number
+Diff line change
@@ Expand Up / @@ -17,6 +17,7 @@ @@
     </div>
     <script src="/assets/js/script.js"></script>
+    @yield('js')
     </body>
-    </html>
+    </html>