@extends('task.layout')
@section('content')
<div class="container mt-4">
  <div class="mb-4">
    <p class="text-muted small mb-1">ルーブリック名 / 項目名</p>
    <h4 class="fw-bold">
      {{ $task->context_title }} {{ $task->title }} <span class="fs-5 ms-3">評価活動概要</span>
    </h4>
  </div>

  @if (session('success'))
    <div class="alert alert-success">
      {{ session('success') }}
    </div>
  @endif

  {{-- エラーメッセージ --}}
  @if ($errors->any())
    <div class="alert alert-danger">
      <ul class="mb-0">
        @foreach ($errors->all() as $error)
          <li>{{ $error }}</li>
        @endforeach
      </ul>
    </div>
  @endif

  <div class="d-flex align-items-center gap-3 flex-wrap mb-3">
    <p class="mb-0 me-4"><strong>発表形式：</strong>
      {{ $task->separate_locations == '0' ? 'クラス全体で' : 'ブースに分かれて' }}{{ $task->group_presentation == '0' ? '個人発表' : 'グループ発表' }}
    </p>
  </div>

  {{-- ステータスと操作ボタン --}}
  <div class="d-flex justify-content-between align-items-center flex-wrap mb-3">

    {{-- ステータス表示 + 切替ボタン --}}
    <div class="d-flex align-items-center gap-3 flex-wrap">
      <p class="mb-0 me-4"><strong>相互評価ステータス：</strong>
        <span class="badge bg-primary fs-6 px-3 py-2">{{ $statusOptions[$task->status] ?? '未設定' }}</span>
      </p>

      <form action="{{ route('task.status.update', $task->id) }}" method="POST" class="d-flex flex-wrap gap-3 mb-0">
        @csrf
        @method('PUT')
        @foreach ($statusOptions as $value => $label)
          @php
            $current = (int) $task->status;
            $target = (int) $value;
            $allowed = in_array($target, [$current - 1, $current, $current + 1]);
            $disabled = !$allowed || $target === $current;
          @endphp
          <button type="submit" name="status" value="{{ $value }}"
            class="btn btn-outline-primary {{ $disabled ? 'disabled' : '' }}">
            {{ $label }}
          </button>
        @endforeach
      </form>
    </div>

    {{-- 編集・削除ボタン --}}
    <div class="d-flex gap-4 mt-2 mt-md-0">
      <a href="{{ route('task.edit', $task->id) }}" class="btn btn-outline-primary">
        <i class="fas fa-edit"></i> 活動の編集
      </a>

      <form action="{{ route('task.destroy', $task->id) }}" method="POST" onsubmit="return confirm('本当に削除しますか？')">
        @csrf
        @method('DELETE')
        <button type="submit" class="btn btn-outline-danger">
          <i class="fas fa-trash-alt"></i> 活動の削除
        </button>
      </form>
    </div>
  </div>

  {{-- 集計情報と 評価者一覧 --}}
  <div class="d-flex justify-content-between align-items-start mb-4 flex-wrap">
    <div class="text-danger">
      <p>集計情報（集計情報として何を表示するか検討要）</p>
      <ul>
        <li>登録数：{{ $booths->sum('target_count') }} 人</li>
        <li>実施数合計：{{ $booths->sum('implementation_count') }} 件</li>
      </ul>
    </div>

    <a href="{{ route('reviewer.list', ['taskid' => $task->id, 'from' => 'task-overview']) }}" class="btn btn-outline-info mt-2 mt-md-0">評価者一覧</a>
  </div>


  {{-- ブース一覧 --}}
  <div class="card mb-4">
    <div class="card-header d-flex justify-content-between fs-5">
      <strong>ブース一覧</strong>
      <button class="btn btn-sm btn-outline-dark">コメント確認</button>
    </div>
    <div class="card-body">
      @if ($task->separate_locations)
        @if ($booths->isEmpty())
          <p>ブースは登録されていません。</p>
        @else
          <table class="table table-bordered text-center">
            <thead class="table-light">
              <tr>
                <th>No.</th>
                <th>名称</th>
                <th>実施数</th>
                <th>対象数</th>
                <th>更新日時</th>
              </tr>
            </thead>
            <tbody>
              @foreach ($booths as $index => $booth)
                <tr>
                  <td>{{ $index + 1 }}</td>
                  <td><a href="{{ route('booth.show', [$task->id, $booth->id]) }}">{{ $booth->name }}</a></td>
                  <td>{{ $booth->implementation_count }}</td>
                  <td>{{ $booth->target_count }}</td>
                  <td>{{ \Carbon\Carbon::parse($booth->updated_at)->format('Y/m/d H:i') }}</td>
                </tr>
              @endforeach
            </tbody>
          </table>
        @endif
      @else
        {{-- クラス発表形式の場合 --}}
        <table class="table table-bordered text-center">
          <thead class="table-light">
            <tr>
              <th>名称</th>
              <th>実施数</th>
              <th>対象数</th>
              <th>更新日時</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td><a href="{{ route('booth.show', [$task->id]) }}">クラス</a></td>
              <td>{{ $booths[0]->implementation_count }}</td>
              <td>{{ $booths[0]->target_count }}</td>
              <td>{{ \Carbon\Carbon::parse($booths[0]->updated_at)->format('Y/m/d H:i') }}</td>
            </tr>
          </tbody>
        </table>
      @endif
    </div>
  </div>

  <div class="d-flex justify-content-between align-items-center mt-3 mb-3">
    {{-- 備考 --}}
    <div class="small text-muted">
      ※ クラスで発表・評価を行う場合、ブース編成が完了していても「クラス」という名称で表示されます。<br>
      ※ 相互評価ステータスによって無効化されるボタンもあります。
    </div>
    {{-- 戻るボタン --}}
    <div>
      <a href="{{ route('task.index') }}" class="btn btn-secondary">
        <i class="fas fa-arrow-left"></i> 戻る
      </a>
    </div>

</div>
@endsection