@extends('user::layouts/panel')

@push('meta')
<meta name="time-sheet-show-url" content="{{ route('panel.task.time-sheets.show', ['year' => ':year', 'week' => ':week']) }}">
@endpush

@push('module-links')
<link rel="stylesheet" href="{{ Module::asset('task:css/sheet.css') }}">
<link rel="stylesheet" href="{{ Module::asset('task:css/time-sheet/show.css') }}">
<link rel="stylesheet" href="{{ Module::asset('task:css/table.css') }}">
@endpush

@section('module-content')
    <!-- 頂部控制區 -->
    <div class="card shadow-sm border-0 mb-4 rounded-3">
        <div class="card-body p-3">
            <div class="row justify-content-center">
                <div class="col-lg-10">
                    <div class="d-flex flex-wrap gap-3 justify-content-center">
                    <!-- Sprint 切換選擇器 -->
                    <div class="d-flex align-items-center flex-grow-1 mw-28rem">
                        <div class="input-group">
                            <select class="form-select border-start-0 ps-0 select2-sprint" id="sprintSelect">
                                @foreach($sprintOptions as $option)
                                    <option value="{{ $option['value'] }}" {{ $option['selected'] ? 'selected' : '' }}>
                                        {{ $option['label'] }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <!-- 日期查詢輸入框 -->
                    <div class="d-flex align-items-center flex-shrink-0 min-w-15rem">
                        <div class="input-group">
                            <span class="input-group-text bg-light border-end-0">
                                <i class="fas fa-calendar-day text-primary"></i>
                            </span>
                            <input type="text" class="form-control border-start-0 ps-0" id="dateSearch"
                                value="{{ $startDate->format('Y-m-d') }}" placeholder="選擇日期">
                        </div>
                    </div>

                    <!-- 導航按鈕 -->
                    <div class="d-flex align-items-center gap-2">
                        <button type="button" id="previousSprint" class="btn btn-outline-secondary">
                        <i class="fas fa-chevron-left"></i>
                        </button>
                        <button type="button" id="currentSprint" class="btn btn-outline-primary">
                        本週
                        </button>
                        <button type="button" id="nextSprint" class="btn btn-outline-secondary">
                        <i class="fas fa-chevron-right"></i>
                        </button>
                    </div>

                    <!-- 人天/小時切換按鈕 -->
                    <div class="d-flex align-items-center gap-2">
                        <div class="btn-group" role="group" aria-label="工時顯示單位">
                            <input type="radio" class="btn-check" name="timeUnitToggle" id="showHours" value="hours" checked>
                            <label class="btn btn-outline-info" for="showHours">
                                <i class="fas fa-clock me-1"></i>小時
                            </label>
                            <input type="radio" class="btn-check" name="timeUnitToggle" id="showManDays" value="manDays">
                            <label class="btn btn-outline-info" for="showManDays">
                                <i class="fas fa-user-clock me-1"></i>人天
                            </label>
                        </div>
                    </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 篩選區域 -->
    <div class="card shadow-sm border-0 rounded-3 mb-4">
        <div class="card-header bg-white py-3 border-0">
            <h5 class="card-title text-primary fw-bold mb-0">
                <i class="fas fa-filter me-2"></i>進階篩選
            </h5>
        </div>
        <div class="card-body p-3">
            <div class="row g-4">
                <!-- 人員篩選 -->
                <div class="col-md-4">
                    <label for="userFilter" class="form-label d-flex align-items-center">
                        <span>人員篩選</span>
                    </label>
                    <select class="form-select select2" id="userFilter" multiple data-placeholder="選擇人員">
                    @foreach($allUsers as $user)
                        <option value="{{ $user->id }}">{{ $user->name }}</option>
                    @endforeach
                    </select>
                    <div class="form-text">可多選或清除重設</div>
                </div>

                <!-- 專案類型篩選 -->
                <div class="col-md-8">
                    <label class="form-label d-flex align-items-center">
                        <span>專案類型篩選</span>
                    </label>
                    <div class="btn-group w-100 flex-wrap" role="group">
                        <input type="radio" class="btn-check" name="projectTypeFilter" id="all" value="all" checked>
                        <label class="btn btn-outline-primary" for="all">
                            <i class="fas fa-th me-1"></i>全部
                        </label>
                        @foreach($categoryFilters as $filter)
                        <input type="radio" class="btn-check" name="projectTypeFilter" id="{{ $filter['key'] }}" value="{{ $filter['label'] }}">
                        <label class="btn btn-outline-primary" for="{{ $filter['key'] }}">
                            <i class="fas {{ $filter['icon'] }} me-1"></i>{{ $filter['label'] }}
                        </label>
                        @endforeach
                    </div>

                    {{-- 添加顯示控制開關 --}}
                    <div class="form-check mt-2">
                        <input class="form-check-input" type="checkbox" id="hideEmptyProjects" checked>
                        <label class="form-check-label" for="hideEmptyProjects">
                            <i class="fas fa-eye-slash me-1"></i>隱藏未執行案子
                        </label>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="card mb-5 shadow-sm">
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-striped table-hover">
                  <thead class="table-light">
                    <tr>
                        <th class="client text-center">客戶</th>
                        <th class="project-name text-center">專案名稱</th>
                        <th class="due-date text-center">預計結案日</th>
                        <th class="estimated-man-days text-center">評估人天</th>
                        @foreach($allUsers as $user)
                            <th colspan="{{ $user->need_task_record ? 2 : 1 }}" data-user-id="{{ $user->id }}" class="text-center user-name">
                                {{ $user->name }}
                                <br>
                                工時紀錄
                            </th>
                        @endforeach
                        <th class="estimated-man-days-proportion text-center">累積總人天</th>
                        <th class="estimated-man-days-proportion text-center">累計執行人天佔比</th>
                        <th class="comparison-with-previous-week text-center">與前周比較(系統)</th>
                        <th class="actual-completion-percentage text-center">實際完成比</th>
                        <th class="comparison-with-previous-week text-center">與前周比較(實際)</th>
                        <th class="progress-difference text-center">進度差異比</th>
                    </tr>
                </thead>
                    <tbody>
                      @foreach($projectsByType as $type => $categoryData)
                          <tr class="table-secondary project-type-row" data-type="{{ $type }}">
                              <th colspan="{{ 4 + count($allUsers) + count($allUsers->filter(fn($u) => $u->need_task_record)) + 6 }}" class="text-center">
                                  <h5>{{ $type }}</h5>
                              </th>
                          </tr>
                          @if(count($categoryData['projects']) > 0)
                              @foreach($categoryData['projects'] as $data)
                                  <tr>
                                      <td class="text-center align-middle">{{ $data['client'] }}</td>
                                      <td class="text-center align-middle">
                                          <small class="text-muted">{{ $data['serial_number'] ?? '-' }}</small><br>
                                          {{ $data['project_name'] }}
                                      </td>
                                      <td class="text-center align-middle">{{ $data['due_date'] }}</td>
                                      <td class="text-center align-middle">{{ $data['estimated_man_days'] }}</td>
                                      @foreach($allUsers as $user)
                                          <td class="time-record text-center align-middle" data-user-id="{{ $user->id }}">
                                              @if(($data['user_hours'][$user->id] ?? 0) > 0)
                                                  <span class="hours-display">{{ $data['user_hours'][$user->id] }}小時</span>
                                                  <span class="man-days-display d-none">{{ $data['user_man_days'][$user->id] }}人天</span>
                                              @else
                                                  <span class="hours-display">-</span>
                                                  <span class="man-days-display d-none">-</span>
                                              @endif
                                          </td>
                                          @if($user->need_task_record)
                                          <td class="test-time-record text-center align-middle" data-user-id="{{ $user->id }}" data-test-time="true">
                                              @if(($data['test_hours'][$user->id] ?? 0) > 0)
                                                  <span class="hours-display">{{ $data['test_hours'][$user->id] }}小時</span>
                                                  <span class="man-days-display d-none">{{ $data['test_man_days'][$user->id] }}人天</span>
                                              @else
                                                  <span class="hours-display">-</span>
                                                  <span class="man-days-display d-none">-</span>
                                              @endif
                                          </td>
                                          @endif
                                      @endforeach
                                      <td class="text-center align-middle">{{ $data['total_man_days'] }}</td>
                                      <td class="text-center align-middle">{{ $data['man_day_percentage'] }}%</td>
                                      <td class="text-center align-middle">
                                          <span class="{{ $data['man_day_percentage_change']['class'] }}">{{ $data['man_day_percentage_change']['value'] }}</span>
                                      </td>
                                      <td class="text-center align-middle">{{ $data['actual_completion_percentage'] }}%</td>
                                      <td class="text-center align-middle">
                                          <span class="{{ $data['actual_percentage_change']['class'] }}">{{ $data['actual_percentage_change']['value'] }}</span>
                                      </td>
                                      <td class="text-center align-middle">
                                          <span class="{{ $data['progress_difference']['class'] }}">{{ $data['progress_difference']['value'] }}</span>
                                      </td>
                                  </tr>
                              @endforeach

                              {{-- 分類小計 --}}
                              <tr class="table-info">
                                  <td colspan="4" class="text-center"><strong>{{ $type }} 小計</strong></td>
                                  @foreach($allUsers as $user)
                                      <td class="text-center align-middle" data-user-id="{{ $user->id }}">
                                          @if(($categoryData['subtotals']['user_hours'][$user->id] ?? 0) > 0)
                                              <span class="hours-display">{{ $categoryData['subtotals']['user_hours'][$user->id] }}小時</span>
                                              <span class="man-days-display d-none">{{ $categoryData['subtotals']['user_man_days'][$user->id] }}人天</span>
                                          @else
                                              <span class="hours-display">-</span>
                                              <span class="man-days-display d-none">-</span>
                                          @endif
                                      </td>
                                      @if($user->need_task_record)
                                      <td class="text-center align-middle" data-user-id="{{ $user->id }}" data-test-time="true">
                                          @if(($categoryData['subtotals']['test_hours'][$user->id] ?? 0) > 0)
                                              <span class="hours-display">{{ $categoryData['subtotals']['test_hours'][$user->id] }}小時</span>
                                              <span class="man-days-display d-none">{{ $categoryData['subtotals']['test_man_days'][$user->id] }}人天</span>
                                          @else
                                              <span class="hours-display">-</span>
                                              <span class="man-days-display d-none">-</span>
                                          @endif
                                      </td>
                                      @endif
                                  @endforeach
                                  <td colspan="6"></td>
                              </tr>
                          @else
                              <tr>
                                  <td colspan="{{ 4 + count($allUsers) + count($allUsers->filter(fn($u) => $u->need_task_record)) + 6 }}" class="text-center text-muted">
                                      此類別尚無專案資料
                                  </td>
                              </tr>
                          @endif
                      @endforeach

                      {{-- 底部總計 --}}
                      <tr class="table-dark">
                          <td colspan="3" class="text-center align-middle"><strong>實際執行人天</strong></td>
                          <td class="text-center align-middle">{{ $totalManDays }}<br>({{ $totalHours }}小時)</td>
                          @foreach($allUsers as $user)
                              <td class="text-center align-middle" data-user-id="{{ $user->id }}">
                                  {{ $userStats[$user->id]['total_man_days'] }}<br>
                                  ({{ $userStats[$user->id]['total_hours'] }}小時)
                              </td>
                              @if($user->need_task_record)
                              <td class="text-center align-middle" data-user-id="{{ $user->id }}" data-test-time="true">
                                  {{ $userStats[$user->id]['test_man_days'] }}
                                  ({{ $userStats[$user->id]['test_hours'] }}小時)
                              </td>
                              @endif
                          @endforeach
                          <td colspan="6"></td>
                      </tr>
                      <tr class="table-dark">
                          <td colspan="3" class="text-center align-middle"><strong>應執行人天</strong></td>
                          <td class="text-center align-middle">{{ $standardManDays }}</td>
                          @foreach($allUsers as $user)
                              <td class="text-center align-middle" data-user-id="{{ $user->id }}">
                                  {{ $userStats[$user->id]['standard_man_days'] }}
                              </td>
                              @if($user->need_task_record)
                              <td class="text-center align-middle" data-user-id="{{ $user->id }}" data-test-time="true">-</td>
                              @endif
                          @endforeach
                          <td colspan="6"></td>
                      </tr>
                      <tr class="table-dark">
                          <td colspan="3" class="text-center align-middle"><strong>加班時數 (小時)</strong></td>
                          <td class="text-center align-middle">{{ $overtimeHours }}</td>
                          @foreach($allUsers as $user)
                              <td class="text-center align-middle" data-user-id="{{ $user->id }}">{{ $userStats[$user->id]['overtime_hours'] }}</td>
                              @if($user->need_task_record)
                              <td class="text-center align-middle" data-user-id="{{ $user->id }}" data-test-time="true">{{ $userStats[$user->id]['test_overtime_hours'] }}</td>
                              @endif
                          @endforeach
                          <td colspan="6"></td>
                      </tr>
                  </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection

@push('module-scripts')
@vite(['resources/js/flatpickr.js', 'resources/js/moment.js'])
<script src="{{ Module::asset('task:js/toggleTimeDisplayUnit.js') }}" type="module"></script>
<script src="{{ Module::asset('task:js/applyFilters.js') }}" type="module"></script>
<script src="{{ Module::asset('task:js/time-sheet/show.js') }}" type="module"></script>
@endpush