@use('Carbon\Carbon')

<div class="table-responsive">
    <table id="{{ $tableId }}" class="display">
        <thead>
            <tr>
                <th>Title</th>
                <th>Start Date</th>
                <th>End Date</th>
                <th>Reminder</th>
                <th>Description</th>
                <th>Status</th>
                <th>Progress</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            @forelse ($tasks as $index => $task)
            <tr>
                <td title="{{ $task['task_name'] }}"> {{ isset($task['task_name']) ? Str::limit($task['task_name'], 15) : '' }} </td>
                <td> {{ isset($task['start_date']) ? \Carbon\Carbon::parse($task['start_date'])->format('m/d/Y') : '' }}
                </td>
                <td>
                    {{ !empty($task['deadline_date']) ? \Carbon\Carbon::parse($task['deadline_date'])->format('m/d/Y') : '' }}
                </td>

                <td>{{ $task['task_reminder'] ?? ""}} {{ $task['task_reminder_interval'] ?? "" }}</td>
                <td title="{{ strip_tags($task['task_description']) }}">
                    {{ isset($task['task_description']) ? Str::limit(strip_tags($task['task_description']), 25) : '' }}
                </td>

                @php

                $taskStartDate = Carbon::parse($task['start_date'])->setTimezone('Asia/Karachi');
                $taskDeadlineDate = $task['deadline_date'] ? Carbon::parse($task['deadline_date'])->setTimezone('Asia/Karachi') : null;
                $currentStatus = $task['task_status'];

                // Automatically update the task status based on dates
                if ($currentStatus == "To be Started" || $currentStatus == "On Hold") {
                if ($taskStartDate->isToday()) {
                $currentStatus = "Today";
                } elseif ($taskStartDate->isFuture()) {
                $currentStatus = "Upcoming";
                } elseif ($taskStartDate->isPast() && ($task['deadline_date'] == null || $taskDeadlineDate->isFuture())) {
                $currentStatus = "Delayed";
                } elseif ($taskStartDate->isPast() && $taskDeadlineDate && $taskDeadlineDate->isPast()) {
                $currentStatus = "Over Due";
                }
                }
                @endphp

                <td>
                    <span class="task_status_{{$task['id']}} badge rounded-pill 
                    @if($currentStatus == 'Completed') text-bg-success
                    @elseif($currentStatus == 'To be Started') text-bg-info
                    @elseif($currentStatus == 'In Progress') text-bg-primary
                    @elseif($currentStatus == 'On Hold') text-bg-warning
                    @elseif($currentStatus == 'Cancelled') text-bg-secondary
                    @elseif($currentStatus == 'Under Review') text-bg-dark
                    @elseif($currentStatus == 'Today') text-bg-primary
                    @elseif($currentStatus == 'Upcoming') text-bg-warning
                    @elseif($currentStatus == 'Delayed') bg-primary
                    @elseif($currentStatus == 'Over Due') text-bg-danger
                    @else text-bg-danger
                    @endif text-white"
                        data-startdate="{{ $task['start_date'] }}"
                        data-enddate="{{ $task['deadline_date'] }}">
                        {{ $currentStatus }}
                    </span>
                </td>
                <td>
                    <select id="task_status_{{$task['id']}}"
                        data-taskid="{{$task['id']}}"
                        onchange="changeStatus(this)"
                        name="task_status"
                        class="form-select select_status_{{ $task['id']}}"
                        @if($task['task_status']=='Completed' ) disabled @endif>
                        <option value="To be Started" {{ $task['task_status'] == 'To be Started' ? 'selected' : '' }}>To be Started</option>
                        <option value="In Progress" {{ $task['task_status'] == "In Progress" ? 'selected' : '' }}
                            @if($task['task_status']=='Cancelled' ) disabled @endif>In Progress</option>
                        <option value="Under Review" {{ $task['task_status'] == "Under Review" ? 'selected' : '' }}
                            @if($task['task_status']=='Cancelled' ) disabled @endif>Under Review</option>
                        <option value="Completed" {{ $task['task_status'] == "Completed" ? 'selected' : '' }}
                            @if($task['task_status']=='Cancelled' ) disabled @endif>Completed</option>
                        <option value="On Hold" {{ $task['task_status'] == "On Hold" ? 'selected' : '' }}
                            @if($task['task_status']=='Cancelled' ) disabled @endif>On Hold</option>
                        <option value="Cancelled" {{ $task['task_status'] == "Cancelled" ? 'selected' : '' }}>Cancelled</option>
                    </select>

                </td>
                <td class="d-flex justify-content-center">
                    <div class="d-flex">
                        <a href="{{ route('tasks.show', $task['id']) }}" class="btn btn-warning shadow btn-xs sharp me-1">
                            <i class="fa fa-eye"></i>
                        </a>
                        <!-- EDIT BUTTON CONTAINER (Updated for JS modification) -->
                        <div class="edit-button-container-{{$task['id']}}">
                            @if($task['task_status'] == "To be Started" || $task['task_status'] == "On Hold")
                            <a href="{{ route('tasks.edit', $task['id']) }}" class="btn btn-primary shadow btn-xs sharp me-1">
                                <i class="fa fa-pencil"></i>
                            </a>
                            @else
                            <button type="button" class="btn btn-dark btn-xs me-1 shadow sharp" disabled>
                                <i class="fa fa-pencil text-light"></i>
                            </button>
                            @endif
                        </div>
                        <!-- DELETE BUTTON -->
                        <button data-url="{{ route('tasks.destroy', ['task' => $task['id']]) }}"
                            class="btn btn-danger shadow btn-xs sharp taskDeleteButton">
                            <i class="fa fa-trash"></i>
                        </button>
                    </div>
                </td>

            </tr>
            @empty
            {{-- <tr>
                    <td colspan="7">No tasks available.</td>
                </tr> --}}
            @endforelse
        </tbody>
    </table>
</div>