@extends('layouts.app')

@section('title', '出勤工時統計')

@push('styles')
<link rel="stylesheet" href="/vendor/datatables/css/dataTables.bootstrap5.min.css">
<style>
.anomaly-late  { color: #dc3545; font-weight: 600; }
.anomaly-early { color: #dc3545; font-weight: 600; }
.anomaly-miss  { color: #856404; font-weight: 600; }
.day-row-late     td { background: #fff5f5 !important; }
.day-row-miss     td { background: #fff9e6 !important; }
.day-row-noshow   td { background: #ffe8e8 !important; color: #b30000; }
.day-row-weekend  td { color: #bbb; background: #f8f8f8 !important; }
.day-row-future   td { color: #ccc; background: #fafafa !important; }
.day-row-progress td { background: #f0f7ff !important; }

[data-bs-theme="dark"] .day-row-late     td { background: #2d1a1a !important; }
[data-bs-theme="dark"] .day-row-miss     td { background: #2a2510 !important; }
[data-bs-theme="dark"] .day-row-noshow   td { background: #3a1414 !important; color: #ff6b6b; }
[data-bs-theme="dark"] .day-row-weekend  td { color: #6b7280; background: #1c1f26 !important; }
[data-bs-theme="dark"] .day-row-future   td { color: #4b5563; background: #161b22 !important; }
[data-bs-theme="dark"] .day-row-progress td { background: #1a2f4a !important; }
</style>
@endpush

@section('content')
<div class="container-fluid py-4">
  <div class="d-flex align-items-center justify-content-between mb-3 flex-wrap gap-2">
    <h4 class="mb-0"><i class="bi bi-bar-chart-line me-2"></i>出勤工時統計</h4>
    <a href="{{ route('attendance.admin') }}" class="btn btn-sm btn-outline-secondary">
      <i class="bi bi-arrow-left me-1"></i>返回簽到退紀錄
    </a>
  </div>

  {{-- 篩選 --}}
  <form method="GET" class="card shadow-sm mb-4">
    <div class="card-body">
      <div class="row g-2 align-items-end">
        <div class="col-sm-6 col-md-2">
          <label class="form-label small mb-1" for="month">月份</label>
          <input type="month" name="month" id="month" class="form-control form-control-sm"
                 value="{{ $month }}" max="{{ now()->format('Y-m') }}">
        </div>
        <div class="col-sm-6 col-md-2">
          <label class="form-label small mb-1" for="department">部門</label>
          <select name="department" class="form-select form-select-sm" id="department">
            <option value="">全部</option>
            @foreach($departments as $d)
            <option value="{{ $d }}" {{ $dept==$d?'selected':'' }}>{{ $d }}</option>
            @endforeach
          </select>
        </div>
        <div class="col-sm-6 col-md-3">
          <label class="form-label small mb-1" for="user_id">人員</label>
          <select name="user_id" class="form-select form-select-sm" id="user_id">
            <option value="">全部</option>
            @foreach($allUsers as $u)
            <option value="{{ $u->id }}" {{ $userId==$u->id?'selected':'' }}>
              {{ $u->name }}@if($u->department)（{{ $u->department }}）@endif
            </option>
            @endforeach
          </select>
        </div>
        <div class="col-sm-6 col-md-1">
          <button class="btn btn-primary btn-sm w-100">
            <i class="bi bi-search me-1"></i>查詢
          </button>
        </div>
        <div class="col-md-2 text-end">
          <a href="{{ route('attendance.stats.export', array_filter(['month'=>$month,'user_id'=>$userId,'department'=>$dept])) }}"
             class="btn btn-sm btn-outline-secondary w-100">
            <i class="bi bi-download me-1"></i>匯出 CSV
          </a>
        </div>
      </div>
    </div>
  </form>

  {{-- 班制說明 --}}
  <div class="alert alert-light border small py-2 mb-3">
    <i class="bi bi-info-circle me-1"></i>
    @foreach($groupSettings as $gid => $gcfg)
      @if($gid === 'friday_early_enabled') @continue @endif
      <strong>{{ $gid }} 組</strong>：上班 {{ $gcfg['start'] }}，下班 {{ $gcfg['end'] }}@if($groupSettings['friday_early_enabled'])（週五 {{ $gcfg['friday_end'] }}）@endif
      @if(!$loop->last)　@endif
    @endforeach
    工時計算為當日第一次上班簽到至最後一次下班簽退之差。
    <a href="{{ route('attendance.settings') }}" class="ms-2">⚙ 修改設定</a>
  </div>

  @if($statsRows->isEmpty())
    <div class="alert alert-info">查無資料</div>
  @elseif($userId && $statsRows->count() === 1)
    {{-- ── 個人詳細檢視 ── --}}
    @php $row = $statsRows->first(); $u = $row['user']; @endphp
    <div class="card shadow-sm mb-3">
      <div class="card-header py-2 d-flex align-items-center justify-content-between flex-wrap gap-2">
        <span class="fw-semibold">
          <i class="bi bi-person-circle me-1"></i>{{ $u->name }}
          <span class="badge bg-secondary-subtle text-secondary-emphasis ms-1">
            {{ $u->work_schedule_group ?? 'A' }} 組
          </span>
          <span class="text-muted fw-normal small ms-2">{{ $u->department }}</span>
        </span>
        <span class="d-flex flex-wrap gap-1 align-items-center">
          @if($row['late_count'] > 0)
            <span class="badge bg-danger">遲到 {{ $row['late_count'] }} 次</span>
          @endif
          @if($row['early_count'] > 0)
            <span class="badge bg-danger">早退 {{ $row['early_count'] }} 次</span>
          @endif
          @if($row['missing_in'] > 0)
            <span class="badge bg-warning text-dark">未簽到 {{ $row['missing_in'] }} 次</span>
          @endif
          @if($row['missing_out'] > 0)
            <span class="badge bg-warning text-dark">未退卡 {{ $row['missing_out'] }} 次</span>
          @endif
          @if($row['no_show_count'] > 0)
            <span class="badge bg-secondary">未出勤 {{ $row['no_show_count'] }} 天</span>
          @endif
          @if($row['late_count'] == 0 && $row['early_count'] == 0 && $row['missing_in'] == 0 && $row['missing_out'] == 0 && $row['no_show_count'] == 0)
            <span class="badge bg-success">出勤正常</span>
          @endif
        </span>
      </div>
      <div class="card-body p-0">
        <div class="table-responsive">
          <table class="table table-sm table-hover align-middle mb-0" style="font-size:.875rem;">
            <thead class="table-light">
              <tr>
                <th style="width:110px;">日期</th>
                <th style="width:44px;" class="text-center">星期</th>
                <th style="width:90px;" class="text-center">上班打卡</th>
                <th style="width:90px;" class="text-center">下班打卡</th>
                <th style="width:90px;" class="text-center">工時</th>
                <th>狀態</th>
              </tr>
            </thead>
            <tbody>
              @foreach($row['day_details'] as $date => $dd)
              @php
                $rowClass = 'day-row-weekend';
                if (!$dd['is_weekend']) {
                    if ($dd['is_future'])           $rowClass = 'day-row-future';
                    elseif ($dd['in_progress'])     $rowClass = 'day-row-progress';
                    elseif ($dd['no_show'])         $rowClass = 'day-row-noshow';
                    elseif ($dd['missing_in'] || $dd['missing_out']) $rowClass = 'day-row-miss';
                    elseif ($dd['late'] || $dd['early'])             $rowClass = 'day-row-late';
                    else                            $rowClass = '';
                }
              @endphp
              <tr class="{{ $rowClass }}">
                <td class="text-nowrap">{{ $date }}</td>
                <td class="text-center text-muted small">{{ $dd['weekday'] }}</td>
                <td class="text-center">
                  @if($dd['in'])
                    <span class="{{ $dd['late'] ? 'anomaly-late' : 'text-success' }}">{{ $dd['in'] }}</span>
                  @elseif($dd['missing_in'])
                    <span class="anomaly-miss">未簽到</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center">
                  @if($dd['out'])
                    <span class="{{ $dd['early'] ? 'anomaly-early' : '' }}">{{ $dd['out'] }}</span>
                  @elseif($dd['in_progress'])
                    <span class="text-info small">上班中…</span>
                  @elseif($dd['missing_out'])
                    <span class="anomaly-miss">未退卡</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center text-muted small">
                  @if($dd['minutes'] !== null)
                    {{ intdiv($dd['minutes'],60) }}h {{ $dd['minutes']%60 }}m
                  @else —
                  @endif
                </td>
                <td>
                  @if($dd['no_show'])
                    <span class="badge bg-danger text-white">未出勤</span>
                  @elseif($dd['is_future'])
                    <span class="text-muted small">—</span>
                  @elseif($dd['is_weekend'])
                    <span class="text-muted small">假日</span>
                  @else
                    @if($dd['late'])
                      <span class="badge bg-danger-subtle text-danger-emphasis me-1">遲到</span>
                    @endif
                    @if($dd['early'])
                      <span class="badge bg-danger-subtle text-danger-emphasis me-1">早退</span>
                    @endif
                    @if($dd['missing_in'])
                      <span class="badge bg-warning-subtle text-warning-emphasis me-1">未簽到</span>
                    @endif
                    @if($dd['missing_out'])
                      <span class="badge bg-warning-subtle text-warning-emphasis me-1">未退卡</span>
                    @endif
                    @if($dd['biz'] > 0)
                      <span class="badge bg-primary-subtle text-primary-emphasis me-1">公出 {{ $dd['biz'] }} 次</span>
                    @endif
                    @if(!$dd['late'] && !$dd['early'] && !$dd['missing_in'] && !$dd['missing_out'] && $dd['in'])
                      <span class="text-success small"><i class="bi bi-check-circle"></i> 正常</span>
                    @endif
                  @endif
                </td>
              </tr>
              @endforeach
            </tbody>
          </table>
        </div>
      </div>
      {{-- 摘要 footer --}}
      <div class="card-footer py-2 small d-flex flex-wrap gap-4 align-items-center">
        <span>
          出勤 <strong>{{ $row['work_days'] }}</strong> 天
          <span class="text-muted mx-1">/</span>
          應出勤 <strong>{{ $row['expected_days'] }}</strong> 天
        </span>
        <span>
          累計工時 <strong>{{ $row['total_time'] }}</strong>
          <span class="text-muted mx-1">/</span>
          應出勤工時 <strong>{{ $row['expected_time'] }}</strong>
        </span>
        @if($row['business_days'] > 0)
          <span class="text-muted">公出 {{ $row['business_days'] }} 天</span>
        @endif
      </div>
    </div>

  @else
    {{-- ── 多人摘要表 ── --}}
    <div class="card shadow-sm">
      <div class="card-header py-2 small fw-semibold">
        {{ $month }} 月份出勤摘要　共 {{ $statsRows->count() }} 人
      </div>
      <div class="card-body p-0">
        <div class="table-responsive">
          <table id="statsTable" class="table table-sm table-hover align-middle mb-0">
            <thead class="table-light">
              <tr>
                <th>姓名</th>
                <th>部門</th>
                <th class="text-center">班制</th>
                <th class="text-center">出勤天數</th>
                <th class="text-center">累計工時</th>
                <th class="text-center">遲到</th>
                <th class="text-center">早退</th>
                <th class="text-center">未簽到</th>
                <th class="text-center">未退卡</th>
                <th class="text-center">公出天數</th>
                <th></th>
              </tr>
            </thead>
            <tbody>
              @foreach($statsRows as $row)
              @php $u = $row['user']; @endphp
              <tr>
                <td class="text-nowrap fw-semibold">
                  <a href="{{ route('attendance.stats', ['month'=>$month,'user_id'=>$u->id]) }}"
                     class="text-decoration-none text-reset">{{ $u->name }}</a>
                </td>
                <td class="text-muted small">{{ $u->department ?? '—' }}</td>
                <td class="text-center">
                  <span class="badge bg-secondary-subtle text-secondary-emphasis">
                    {{ $u->work_schedule_group ?? 'A' }} 組
                  </span>
                </td>
                <td class="text-center">
                  <span class="badge bg-success-subtle text-success-emphasis">{{ $row['work_days'] }} 天</span>
                </td>
                <td class="text-center fw-semibold">{{ $row['total_time'] }}</td>
                <td class="text-center">
                  @if($row['late_count'] > 0)
                    <span class="badge bg-danger">{{ $row['late_count'] }} 次</span>
                  @elseif($row['work_days'] > 0)
                    <span class="text-success fw-bold">O</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center">
                  @if($row['early_count'] > 0)
                    <span class="badge bg-danger">{{ $row['early_count'] }} 次</span>
                  @elseif($row['work_days'] > 0)
                    <span class="text-success fw-bold">O</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center">
                  @if($row['missing_in'] > 0)
                    <span class="badge bg-warning text-dark">{{ $row['missing_in'] }} 次</span>
                  @elseif($row['work_days'] > 0)
                    <span class="text-success fw-bold">O</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center">
                  @if($row['missing_out'] > 0)
                    <span class="badge bg-warning text-dark">{{ $row['missing_out'] }} 次</span>
                  @elseif($row['work_days'] > 0)
                    <span class="text-success fw-bold">O</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center">
                  @if($row['business_days'] > 0)
                    <span class="badge bg-primary-subtle text-primary-emphasis">{{ $row['business_days'] }} 天</span>
                  @else
                    <span class="text-muted">—</span>
                  @endif
                </td>
                <td class="text-center text-nowrap">
                  <a href="{{ route('attendance.stats', ['month'=>$month,'user_id'=>$u->id]) }}"
                     class="btn btn-sm btn-outline-secondary py-0 px-2">
                    <i class="bi bi-eye me-1"></i>詳細
                  </a>
                </td>
              </tr>
              @endforeach
            </tbody>
          </table>
        </div>
      </div>
    </div>
  @endif

</div>
@endsection

@push('scripts')
<script src="/vendor/datatables/js/jquery.dataTables.min.js"></script>
<script src="/vendor/datatables/js/dataTables.bootstrap5.min.js"></script>
<script>
$(function () {
    @if(!$userId && $statsRows->count() > 0)
    $('#statsTable').DataTable({
        order: [[0,'asc']],
        pageLength: 50,
        language: { url: '/vendor/datatables/i18n/zh-HANT.json' },
        columnDefs: [{ targets: [5,6,7,8], orderable: true }]
    });
    @endif
});
</script>
@endpush