Skip to content

Commit

Permalink
Merge pull request #6 from guildso/feature/tasks-status
Browse files Browse the repository at this point in the history 
Task status management and tasks data table
  • Loading branch information
@bobbyiliev
bobbyiliev authored Dec 28, 2020
2 parents 87a24fb + ae9c469 commit ed415ba
Show file tree
Hide file tree
Showing 4 changed files with 129 additions and 11 deletions.
49 changes: 45 additions & 4 deletions app/Http/Livewire/Tasks.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,13 @@

class Tasks extends Component
{
public $tasks, $name, $description, $status, $task_id;
public $name, $description, $status, $task_id;
public $updateMode = false;
public $numResults = 10;
public $sortField = 'created_at';
public $sortAsc = true;
public $taskStatus = ['To Do', 'Completed', 'In Progress'];
public $search = '';

protected $rules = [
'name' => 'required|min:6',
Expand All @@ -23,10 +28,29 @@ class Tasks extends Component
*/
public function render()
{
$this->tasks = Task::where('team_id', auth()->user()->currentTeam->id)->get();
return view('livewire.tasks');
$tasks = Task::query()
->where('name', 'like', '%'.$this->search.'%')
->where('team_id', auth()->user()->currentTeam->id)
->whereIn('status', $this->taskStatus )
->orderBy($this->sortField, $this->sortAsc ? 'asc' : 'desc')
->paginate($this->numResults);
return view('livewire.tasks', compact('tasks'));
}


public function loadMore(){
$this->numResults += 10;
}

public function sortBy($field)
{
if ($this->sortField === $field) {
$this->sortAsc = ! $this->sortAsc;
} else {
$this->sortAsc = true;
}
$this->sortField = $field;
}

/**
* The attributes that are mass assignable.
*
Expand Down Expand Up @@ -166,4 +190,21 @@ public function assign($id)
}
$task->save();
}

public function inProgressTask($id)
{
if (auth()->user()->hasTeamPermission(auth()->user()->currentTeam, 'read')) {
Task::find($id)->update(['status' => 'In Progress']);
$this->dispatchBrowserEvent('notification', ['type' => 'success', 'message' => 'The task is now in progress!']);
}
}

public function completeTask($id)
{
if (auth()->user()->hasTeamPermission(auth()->user()->currentTeam, 'read')) {
Task::find($id)->update(['status' => 'Completed']);
$this->dispatchBrowserEvent('notification', ['type' => 'success', 'message' => 'The task is now in progress!']);
}
}

}
2 changes: 1 addition & 1 deletion app/Models/User.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ public function removeBadge($badge){
}

public function completedTasks(){
return $this->tasks()->where('status', 'completed')->get();
return $this->tasks()->where('status', 'Completed')->get();
}

public function startShift()
Expand Down
2 changes: 1 addition & 1 deletion database/migrations/2020_12_18_163513_create_tasks_table.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ public function up()
$table->foreignId('user_id')->nullable();
$table->string('name');
$table->text('description');
$table->string('status')->nullable();
$table->string('status')->default('To Do');
$table->timestamps();
});
}
Expand Down
87 changes: 82 additions & 5 deletions resources/views/livewire/tasks.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,65 @@
</div>
</div>
<div class="flex flex-col mt-10">
<div class="flex items-center justify-between mb-4">
<div class="flex-1 pr-4">
<div class="relative md:w-1/3">
<input type="search" wire:model="search" class="w-full py-2 pl-10 pr-4 font-medium text-gray-600 border-b border-gray-200 rounded-lg shadow focus:outline-none focus:shadow-outline" placeholder="Search task by title...">
<div class="absolute top-0 left-0 inline-flex items-center p-2">
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 text-gray-400" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<rect x="0" y="0" width="24" height="24" stroke="none"></rect>
<circle cx="10" cy="10" r="7"></circle>
<line x1="21" y1="21" x2="15" y2="15"></line>
</svg>
</div>
</div>
</div>
<div>
<div class="flex rounded-lg shadow">
<div class="relative" x-data="{ open: false }">
<button @click.prevent="open = !open"
class="inline-flex items-center px-2 py-2 font-semibold text-gray-500 bg-white rounded-lg hover:text-blue-500 focus:outline-none focus:shadow-outline md:px-4">
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 md:hidden" viewBox="0 0 24 24"
stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
stroke-linejoin="round">
<rect x="0" y="0" width="24" height="24" stroke="none"></rect>
<path
d="M5.5 5h13a1 1 0 0 1 0.5 1.5L14 12L14 19L10 16L10 12L5 6.5a1 1 0 0 1 0.5 -1.5" />
</svg>
<span class="hidden md:block">Display</span>
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 ml-1" width="24" height="24"
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
stroke-linecap="round" stroke-linejoin="round">
<rect x="0" y="0" width="24" height="24" stroke="none"></rect>
<polyline points="6 9 12 15 18 9" />
</svg>
</button>

<div x-show="open" @click.away="open = false"
class="absolute top-0 right-0 z-40 block w-40 py-1 mt-12 -mr-1 overflow-hidden bg-white rounded-lg shadow-lg">
<label class="flex items-center justify-start px-4 py-2 text-truncate hover:bg-gray-100">
<div class="mr-3 text-teal-600">
<input type="checkbox" wire:model="taskStatus" value="To Do" class="form-checkbox focus:outline-none focus:shadow-outline" checked="">
</div>
<div class="text-gray-700 select-none" >To Do </div>
</label>
<label class="flex items-center justify-start px-4 py-2 text-truncate hover:bg-gray-100">
<div class="mr-3 text-teal-600">
<input type="checkbox" wire:model="taskStatus" value="In Progress" class="form-checkbox focus:outline-none focus:shadow-outline" checked="">
</div>
<div class="text-gray-700 select-none" >In Progress </div>
</label>
<label class="flex items-center justify-start px-4 py-2 text-truncate hover:bg-gray-100">
<div class="mr-3 text-teal-600">
<input type="checkbox" wire:model="taskStatus" value="Completed" class="form-checkbox focus:outline-none focus:shadow-outline" checked="">
</div>
<div class="text-gray-700 select-none" >Completed</div>
</label>
</div>
</div>
</div>
</div>
</div>
<div class="-my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
<div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
<div class="overflow-hidden border-b border-gray-200 shadow sm:rounded-lg">
Expand All @@ -41,14 +100,19 @@ class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppe
</th>
<th scope="col"
class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
Status
<a wire:click.prevent="sortBy('status')" role="button" href="#" class="underline">Status</a>
</th>
<th scope="col"
class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
Role
</th>
<th scope="col" class="relative px-6 py-3">
<span class="sr-only">Edit</span>
<th scope="col"
class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
Change Status
</th>
<th scope="col"
class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
Manage
</th>
</tr>
</thead>
Expand Down Expand Up @@ -90,14 +154,22 @@ class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppe
<td class="px-6 py-4 whitespace-nowrap">
<span
class="inline-flex px-2 text-xs font-semibold leading-5 text-green-800 bg-green-100 rounded-full">
Active
{{ $task->status }}
</span>
</td>
<td class="px-6 py-4 text-sm text-gray-500 whitespace-nowrap">
@if($task->user)
{{ $task->user->teamRole($task->user->currentTeam)->name }}
@endif
</td>
<td class="px-6 py-4 text-sm text-gray-500 whitespace-nowrap">
@if($task->status == 'To Do')
<button wire:click="inProgressTask({{ $task->id }})" class="text-indigo-600 hover:text-indigo-900">Set in progress</button>
@endif
@if($task->status == "In Progress")
<button wire:click="completeTask({{ $task->id }})" class="text-indigo-600 hover:text-indigo-900">Complete Task</button>
@endif
</td>
<td class="px-6 py-4 text-sm font-medium text-right whitespace-nowrap">
<button wire:click="assign({{ $task->id }})" class="text-indigo-600 hover:text-indigo-900">
@if($task->user_id == auth()->user()->id)
Expand All @@ -108,7 +180,7 @@ class="inline-flex px-2 text-xs font-semibold leading-5 text-green-800 bg-green-
</button>
<button wire:click="edit({{ $task->id }})" class="text-indigo-600 hover:text-indigo-900">Edit</button>
@if(auth()->user()->hasTeamPermission(auth()->user()->currentTeam, 'delete'))
<button wire:click="delete({{ $task->id }})" class="text-indigo-600 hover:text-indigo-900">Delete</button>
<button wire:click="delete({{ $task->id }})" class="text-indigo-600 hover:text-indigo-900">Delete</button>
@endif
</td>
</tr>
Expand All @@ -117,6 +189,11 @@ class="inline-flex px-2 text-xs font-semibold leading-5 text-green-800 bg-green-

</tbody>
</table>
@if( count($tasks) > 0 )
<div wire:click="loadMore()" class="flex items-center justify-start w-full py-2 pl-8 text-xs font-medium text-gray-500 duration-200 ease-out bg-gray-200 cursor-pointer hover:text-gray-600 hover:bg-gray-300 transition-color md:pl-0 md:justify-center">Load More</div>
@else
<div class="flex items-center justify-start w-full py-2 pl-8 text-xs font-medium text-gray-500 duration-200 ease-out bg-gray-100 transition-color md:pl-0 md:justify-center">No more entries</div>
@endif
</div>
</div>
</div>
Expand Down

0 comments on commit ed415ba

Please sign in to comment.