@extends('layouts.main')
@section('title', 'View Attendance')

@section('breadcrumb')
  <li class="breadcrumb-item"><a href="/">Home</a></li>
  <li class="breadcrumb-item"><a href="javascript:void(0);">Contribution</a></li>
  <li class="breadcrumb-item active">View Attendance</li>
@endsection

@section('content')

  <script src="{{ env('APP_PREFIX') }}/js/contribution.js"></script>

  <div class="row">
    <div class="col-lg-12">
      <div class="card">
        <div class="card-body mt-2">

          <div class="col-lg-10 offset-1">

            <form action="{{ route('view.attendance') }}" method="post">
              @csrf

              <div class="form-row">
                <div class="form-group col-md-12">
                  <label for="user_id">Member</label>
                  <select class="form-control" id="user_id" name="user_id">
                    <option value="0">All Members</option>
                    @foreach($users as $user)
                      <option value="{{ $user->id }}" {{ $user->id == $user_id? 'selected':''  }}>{{ $user->name }} - {{ $user->phone }} ({{ $user->role }})</option>
                    @endforeach
                  </select>
                </div>
              </div>

              <div class="form-row">

                <div class="form-group col-md-6">
                  <label for="start_date">Start Date</label>
                  <input type="text" class="form-control" id="start_date" name="start_date" data-provide="datepicker" data-date-autoclose="true" value="{{ date("m/d/Y", strtotime($start_date)) }}">
                </div>

                <div class="form-group col-md-6">
                  <label for="end_date">End Date</label>
                  <input type="text" class="form-control" id="end_date" name="end_date" data-provide="datepicker" data-date-autoclose="true" value="{{ date("m/d/Y", strtotime($end_date)) }}">
                </div>

              </div>

              <div class="form-group">
                <div class="button-list">
                  <button type="submit" class="btn btn-block btn-lg btn-blue waves-effect waves-light">
                    View Attendance
                  </button>
                </div>
              </div>

            </form>

          </div>

        </div>
      </div>
    </div>
  </div>

  <div class="row">
    <div class="col-lg-12">
      <div class="card-box">
        <h4 class="header-title">Member List</h4>
        <div class="table-responsive" style="overflow-x: hidden">
          <table class="table table-bordered mb-0 mt-3" id="contribution_table" >
            <thead>
            <tr>
              <th>Attendance Date</th>
              <th>Name</th>
              <th>Email</th>
              <th>Phone</th>
              <th>Contribution Amount</th>
            </tr>
            </thead>
            <tbody>

            @foreach($attendances as $attendance)
              <tr>
                <td>{{ formatDate($attendance->created_at) }}</td>
                <td>{{ $attendance->name }}<br>({{ $attendance->role }})</td>
                <td>{{ $attendance->email }}</td>
                <td>{{ $attendance->phone }}</td>
                <td>{{ $attendance->contribution_amount }}</td>
              </tr>
            @endforeach

            </tbody>

            <tfoot>

              <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <th>{{ $attendances->sum('contribution_amount') }}</th>
              </tr>

            </tfoot>

          </table>
        </div>
      </div>
    </div>
  </div>

@endsection