@extends('layout.layout')

{{-- Style --}}
@push('links')
<link href="{{ asset('js/jquery-ui-1.10.2/themes/base/jquery-ui.css') }}" rel="stylesheet" type="text/css">
<link href="{{ asset('js/jquery-timepicker-addon/jquery-ui-timepicker-addon.min.css') }}" rel="stylesheet" type="text/css">
<style type="text/css">
  #schedule {
    overflow-x: auto;
    white-space: nowrap;
  }
  .row table {
    word-break:break-all;
    border: 1px solid;
    border-collapse: collapse;
  }
  .row th, .row td {
    border: 1px solid;
    vertical-align: middle;
  }
  .row th {
    text-align: center;
  }
</style>
@endpush

@php
  if (Request::is('admin/rent/create')) {
    $sHour = 0;
    $eHour = 25;
  } else {
    $sHour = 8;
    $eHour = 23;
  }
@endphp

{{-- Content --}}
@section('content')

@include('custom::component.reply-btn', ['url' => $return_url])

<div class="col-md">
  <div class="text-center h3">{{$site->name}}</div>
  @if ($image)
    <div class="row text-center">
      <div class="col-md-8 mx-auto">
          <a href="{{route('site.upload.getImage', ['id' => $image->id])}}" target="_blank" title="{{$site->name}}平面圖">
            <img src="{{route('site.upload.getImage', ['id' => $image->id])}}" width="100%">
          </a>
      </div>
    </div>
  @endif
  <form method="POST" enctype="multipart/form-data">
    {{csrf_field()}}
    {!! $form->render() !!}

    {{-- 起始日期 --}}
    <div class="form-group row">
      <label class="col-form-label col-md-3 text-md-right" for="sdate">
        <span class="align-middle">※<b>起始日期</b></span>
      </label>
      <div class="input-group col-md-6">
        <input type="text" name="sdate" class="form-control datepicker" id="sdate" value="{{old('sdate', $sdate)}}" placeholder="起始日期" required="required">
      </div>
    </div>

    {{-- 起始日期 --}}
    <div class="form-group row">
      <label class="col-form-label col-md-3 text-md-right" for="edate">
        <span class="align-middle">※<b>結束日期</b></span>
      </label>
      <div class="input-group col-md-6">
        <input type="text" name="edate" class="form-control datepicker" id="edate" value="{{old('edate', $edate)}}" placeholder="結束日期" required="required">
      </div>
    </div>

    {{-- 申請/借用單位 --}}
    <div class="form-group row">
      <label class="col-form-label col-md-3 text-md-right" for="rent_unit">
        <span class="align-middle">※<b>申請/借用單位</b></span>
      </label>
      <div class="input-group col-md-6">
        <input type="text" name="rent_unit" id="rent_unit" class="form-control" value="{{old('rent_unit', $rent_unit)}}" placeholder= 
          @if (\Auth::user()->role == 'student' || \Auth::user()->role == 'teacher')
            系所/行政單位
          @else
            公司行號
          @endif>
        @if($errors->has('rent_unit'))
          @foreach ($errors->get('rent_unit') as $error)
            <div class="invalid-feedback" style="display:block;">{{$error}}</div>
          @endforeach
        @endif
      </div>
    </div>

    {{-- 附件 --}}
    <div class="form-group row">
      <label class="col-form-label col-md-3 text-md-right" for="file">
        <span class="align-middle"><b>附件</b></span>
      </label>
      <div class="input-group col-md-6">
        <input type="file" name="file" class="form-control h-auto" id="file" placeholder="附件">
        @if ($site->charge_type == 'period')
          <small class="form-text text-muted" style="width:100%;">勾選體育性質請檢附體育賽事文件</small>
        @endif
        @if($errors->has('file'))
          @foreach ($errors->get('file') as $error)
            <div class="invalid-feedback" style="display:block;">{{$error}}</div>
          @endforeach
        @endif
      </div>
    </div>

    @php
      $use = (isset($data['types']['use']) ? $data['types']['use'] : null);
    @endphp
    @if (in_array($use, ['course', 'club']))
      @php
        $weeks = $data['course']['weeks'];
        $stime = $data['course']['stime'];
        $etime = $data['course']['etime'];
      @endphp
    @else
      @php
        $weeks = [];
        $stime = '';
        $etime = '';
      @endphp
    @endif
    @if (Request::is('admin/rent/create') || \Auth::user()->auth == 'ldap')
      <div class="form-group row">
        <label class="col-form-label col-md-3 text-md-right">
          <span class="align-middle">※<b>用途</b></span>
        </label>
        <div class="input-group col-md-6 d-flex align-items-center">
          @foreach (config('rent.intramural_use') as $key => $text)
            <div class="custom-control custom-radio custom-control-inline">
              <input type="radio" class="custom-control-input" id="use-{{$key}}" name="use" value="{{$key}}" @if (old('use', $use) === $key) checked @endif>
              <label class="custom-control-label" for="use-{{$key}}">{{$text}}</label>
            </div>
          @endforeach
          @if($errors->has('use'))
            @foreach ($errors->get('use') as $error)
              <div class="invalid-feedback" style="display:block;">{{$error}}</div>
            @endforeach
          @endif
        </div>
      </div>
    @endif

    @if ($site->charge_type == 'period')
      @foreach (config('rent.rent_type') as $key => $text)
        @php
          $value = (isset($data['types'][$key]) ? $data['types'][$key] : null);
        @endphp
        <div class="form-group row">
          <label class="col-form-label col-md-3 text-md-right">
            <span class="align-middle">※<b>{{$text}}</b></span>
          </label>
          <div class="input-group col-md-6 d-flex align-items-center">
            <div class="custom-control custom-radio custom-control-inline">
              <input type="radio" class="custom-control-input" id="{{$key}}1" name="{{$key}}" value="1" @if (old($key, $value) === '1') checked @endif>
              <label class="custom-control-label" for="{{$key}}1">是</label>
            </div>
            <div class="custom-control custom-radio custom-control-inline">
              <input type="radio" class="custom-control-input" id="{{$key}}0" name="{{$key}}" value="0" @if (old($key, $value) === '0') checked @endif>
              <label class="custom-control-label" for="{{$key}}0">否</label>
            </div>
            @if($errors->has($key))
              @foreach ($errors->get($key) as $error)
                <div class="invalid-feedback" style="display:block;">{{$error}}</div>
              @endforeach
            @endif
          </div>
        </div>
      @endforeach
    @endif

    @if (Request::is('admin/rent/create') || \Auth::user()->auth == 'ldap')
      <div id="courses">
        <div class="form-group row">
          <label class="col-form-label col-md-3 text-md-right">
            <span class="align-middle">※<b>星期</b></span>
          </label>
          <div class="input-group col-md-6 d-flex align-items-center">
            @foreach (config('rent.rent_week') as $key => $text)
              <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" class="custom-control-input" id="weeks-{{$key}}" name="weeks[]" value="{{$key}}" @if (in_array($key, old('weeks', $weeks))) checked @endif>
                <label class="custom-control-label" for="weeks-{{$key}}">{{$text}}</label>
              </div>
            @endforeach
            @if($errors->has('weeks'))
              @foreach ($errors->get('weeks') as $error)
                <div class="invalid-feedback" style="display:block;">{{$error}}</div>
              @endforeach
            @endif
          </div>
        </div>
        <div class="form-group row">
          <label class="col-form-label col-md-3 text-md-right">
            <span class="align-middle">※<b>起始時間</b></span>
          </label>
          <div class="input-group col-md-6">
            <input type="text" name="stime" class="form-control timepicker" value="{{old('stime', $stime)}}" placeholder="課程/社團起始時間" id="stime">
            @if($errors->has('stime'))
              @foreach ($errors->get('stime') as $error)
                <div class="invalid-feedback" style="display:block;">{{$error}}</div>
              @endforeach
            @endif
          </div>
        </div>
        <div class="form-group row">
          <label class="col-form-label col-md-3 text-md-right">
            <span class="align-middle">※<b>結束時間</b></span>
          </label>
          <div class="input-group col-md-6">
            <input type="text" name="etime" class="form-control timepicker" value="{{old('etime', $etime)}}" placeholder="課程/社團結束時間" id="etime">
            @if($errors->has('etime'))
              @foreach ($errors->get('etime') as $error)
                <div class="invalid-feedback" style="display:block;">{{$error}}</div>
              @endforeach
            @endif
          </div>
        </div>
      </div>
    @endif
    <div id="schedules">
      <div class="form-group text-center">
        <button class="btn btn-primary" title="按下日期規劃會顯示每日規劃表">日期規劃</button>
      </div>
      <div id="schedule">
        @if ($site->charge_type == 'period')
          <table width="100%" class="form-group" summary="租借日期規劃" @if (!count($dates)) style="display: none;" @endif>
            <tr>
              <th scope="col">借用日期</th>
              <th scope="col">用途</th>
              <th scope="col">基本時段</th>
              <th scope="col">加租時段</th>
            </tr>
            @if (in_array($use, ['course', 'club']))
              @php
                $weeks = $data['course']['weeks'];
                $stime = $data['course']['stime'];
                $etime = $data['course']['etime'];
              @endphp
            @else
              @php
                $weeks = [];
                $stime = '';
                $etime = '';
              @endphp
              @foreach ($dates as $date)
                @php
                  $uses = [];
                  $items = [
                    'before' => [
                      'Y' => 0,
                      's' => 0,
                      'e' => 8,
                    ],
                    'period' => [],
                    'after' => [
                      'Y' => 0,
                      's' => 22,
                      'e' => 24,
                    ],
                  ];
                @endphp
                @foreach (config('rent.rent_use') as $type => $text)
                  @php
                    $values = [];
                    if (!empty($data['basic']['date'][$date][$type])) {
                      $uses = $data['basic']['date'][$date]['use'];
                      $items = $data['basic']['date'][$date][$type];
                      $values = (!empty($items['period'])) ? $items['period'] : [];
                    }
                  @endphp
                  <tr>
                    @if ($type == 1)
                    <td rowspan="4">{{$date}}</td>
                    @endif
                    <td>
                      <div>
                        <label>
                          <input type="checkbox" name="date[{{$date}}][use][]" value="{{$type}}" title="{{$date}}{{$text}}" @if (in_array($type, old('date.'.$date.'.use', $uses))) checked @endif>
                          {{$text}}
                        </label>
                      </div>
                    </td>
                    <td>
                      @foreach (config('rent.rent_period') as $key => $period)
                        <div>
                          <label>
                            <input type="checkbox" name="date[{{$date}}][{{$type}}][period][]" value="{{$key}}" title="{{$date}}{{$text}}基本時段{{$period}}" @if (in_array($key, old('date.'.$date.'.'.$type.'.period', $values))) checked @endif>
                            {{$period}}
                          </label>
                        </div>
                      @endforeach
                    </td>
                    <td>
                      <div>
                        <input type="hidden" name="date[{{$date}}][{{$type}}][before][Y]" value="0">
                        <input type="checkbox" name="date[{{$date}}][{{$type}}][before][Y]" value="1" title="{{$date}}{{$text}}加租基本時段前" @if (old('date.'.$date.'.'.$type.'.before.Y', !empty($items['before']['Y']))) checked @endif>
                        <select name="date[{{$date}}][{{$type}}][before][s]" title="{{$date}}{{$text}}加租基本時段前起始小時">
                          @for ($i = 0;$i < 9;$i++)
                            <option value="{{$i}}" @if (old('date.'.$date.'.'.$type.'.before.s', $items['before']['s']) == $i) selected @endif>{{$i}}</option>
                          @endfor
                        </select>
                        時至~
                        <select name="date[{{$date}}][{{$type}}][before][e]" title="{{$date}}{{$text}}加租基本時段前結束小時">
                          @for ($i = 0;$i < 9;$i++)
                            <option value="{{$i}}" @if (old('date.'.$date.'.'.$type.'.before.e', $items['before']['e']) == $i) selected @endif>{{$i}}</option>
                          @endfor
                        </select>
                        時
                      </div>
                      <div>
                        <input type="hidden" name="date[{{$date}}][{{$type}}][after][Y]" value="0">
                        <input type="checkbox" name="date[{{$date}}][{{$type}}][after][Y]" value="1" title="{{$date}}{{$text}}加租基本時段後" @if (old('date.'.$date.'.'.$type.'.after.Y', !empty($items['after']['Y']))) checked @endif>
                        <select name="date[{{$date}}][{{$type}}][after][s]" title="{{$date}}{{$text}}加租基本時段後起始小時">
                          @for ($i = 22;$i < 25;$i++)
                            <option value="{{$i}}" @if (old('date.'.$date.'.'.$type.'.after.s', $items['after']['s']) == $i) selected @endif>{{$i}}</option>
                          @endfor
                        </select>
                        時至~
                        <select name="date[{{$date}}][{{$type}}][after][e]" title="{{$date}}{{$text}}加租基本時段後結束小時">>
                          @for ($i = 22;$i < 25;$i++)
                            <option value="{{$i}}" @if (old('date.'.$date.'.'.$type.'.after.e', $items['after']['e']) == $i) selected @endif>{{$i}}</option>
                          @endfor
                        </select>
                        時
                      </div>
                    </td>
                  </tr>
                @endforeach
              @endforeach
            @endif
          </table>
        @elseif ($site->charge_type == 'hour')
          <table width="100%" class="form-group" summary="租借日期規劃" @if (!count($dates)) style="display: none;" @endif>
            <tr>
              <th scope="col">借用日期</th>
              <th scope="col">借用時間</th>
            </tr>
            @foreach ($dates as $date)
              <tr>
                <td>{{$date}}</td>
                <td>
                  @foreach (old('date.'.$date.'.s', $data['basic']['date'][$date]['s'] ?? []) as $n => $s)
                    <div class="px-1">
                      <select name="date[{{$date}}][s][]" title="{{$date}}借用時間起始小時">
                        @for ($i = $sHour;$i < $eHour;$i++)
                          <option value="{{$i}}" @if (old('date.'.$date.'.s.'.$n, $s) == $i) selected @endif>{{$i}}</option>
                        @endfor
                      </select>
                      時至~
                      <select name="date[{{$date}}][e][]" title="{{$date}}借用時間結束小時">
                        @for ($i = $sHour;$i < $eHour;$i++)
                          <option value="{{$i}}" @if (old('date.'.$date.'.e.'.$n, $data['basic']['date'][$date]['e'][$n] ?? null) == $i) selected @endif>{{$i}}</option>
                        @endfor
                      </select>
                      時
                      <button type="button" class="btn btn-link removeBtn">
                        <span class="fas fa-minus-circle fa-2x text-danger">&ensp;</span>
                      </button>
                    </div>
                  @endforeach
                  <button type="button" class="btn btn-link addBtn">
                    <span class="fas fa-plus-circle fa-2x"></span>
                  </button>
                </td>
              </tr>
            @endforeach
          </table>
        @endif
      </div>
    </div>
    <div class="form-group text-center">
      @php if(($user->role == 'firm' || $user->role == 'normal') && ($site->id ==env('SITE_ID'))) $btn_name='送審'; else $btn_name='下一步'; @endphp
      <input type="submit" name="submit" class="btn btn-success" value="{{ $btn_name }}" @if (!count($dates)) disabled @endif title="{{ $btn_name }}">
    </div>
  </form>
</div>

  @if ($site->charge_type == 'period')
    <div id="clone-sample" class="d-none">
      <table>
        @foreach (config('rent.rent_use') as $type => $text)
        <tr>
          @if ($type == 1)
          <td rowspan="4"></td>
          @endif
          <td>
            <label>
              <input type="checkbox" name="date[_DATE_][use][]" value="{{$type}}" title="_DATE_{{$text}}">
              {{$text}}
            </label>
          </td>
          <td>
            @foreach (config('rent.rent_period') as $key => $period)
              <div>
                <label>
                  <input type="checkbox" name="date[_DATE_][{{$type}}][period][]" value="{{$key}}" title="_DATE_{{$text}}基本時段{{$period}}">
                  {{$period}}
                </label>
              </div>
            @endforeach
          </td>
          <td>
            <div>
              <input type="checkbox" name="date[_DATE_][{{$type}}][before][Y]" title="_DATE_{{$text}}加租基本時段前">
              <select name="date[_DATE_][{{$type}}][before][s]" title="_DATE_{{$text}}加租基本時段前起始小時">
                @for ($i = 0;$i < 9;$i++)
                  <option value="{{$i}}">{{$i}}</option>
                @endfor
              </select>
              時至~
              <select name="date[_DATE_][{{$type}}][before][e]" title="_DATE_{{$text}}加租基本時段結束小時">
                @for ($i = 0;$i < 9;$i++)
                  <option value="{{$i}}" @if ($i == 8) selected @endif>{{$i}}</option>
                @endfor
              </select>
              時
            </div>
            <div>
              <input type="checkbox" name="date[_DATE_][{{$type}}][after][Y]" title="_DATE_{{$text}}加租基本時段後">
              <select name="date[_DATE_][{{$type}}][after][s]" title="_DATE_{{$text}}加租基本時段後起始小時">
                @for ($i = 22;$i < 25;$i++)
                  <option value="{{$i}}">{{$i}}</option>
                @endfor
              </select>
              時至~
              <select name="date[_DATE_][{{$type}}][after][e]" title="_DATE_{{$text}}加租基本時段後結束小時">
                @for ($i = 22;$i < 25;$i++)
                  <option value="{{$i}}" @if ($i == 24) selected @endif>{{$i}}</option>
                @endfor
              </select>
              時
            </div>
          </td>
        </tr>
        @endforeach
      </table>
    </div>
  @elseif ($site->charge_type == 'hour')
    <div id="clone-sample" class="d-none">
      <table>
        <tr>
          <td></td>
          <td>
            <div class="px-1">
              <select name="date[_DATE_][s][]" title="_DATE_借用時間起始小時">
                @for ($i = $sHour;$i < $eHour;$i++)
                  <option value="{{$i}}">{{$i}}</option>
                @endfor
              </select>
              時至~
              <select name="date[_DATE_][e][]" title="_DATE_借用時間結束小時">
                @for ($i = $sHour;$i < $eHour;$i++)
                  <option value="{{$i}}">{{$i}}</option>
                @endfor
              </select>
              時
              <button type="button" class="btn btn-link removeBtn">
                <span class="fas fa-minus-circle fa-2x text-danger">&ensp;</span>
              </button>
            </div>
            <button type="button" class="btn btn-link addBtn">
              <span class="fas fa-plus-circle fa-2x"></span>
            </button>
          </td>
        </tr>
      </table>
    </div>
    <div id="clone-sample-hour" class="d-none">
      <div class="px-1">
        <select name="date[_DATE_][s][]" title="_DATE_借用時間起始小時">
          @for ($i = $sHour;$i < $eHour;$i++)
            <option value="{{$i}}">{{$i}}</option>
          @endfor
        </select>
        時至~
        <select name="date[_DATE_][e][]" title="_DATE_借用時間結束小時">
          @for ($i = $sHour;$i < $eHour;$i++)
            <option value="{{$i}}">{{$i}}</option>
          @endfor
        </select>
        時
        <button type="button" class="btn btn-link removeBtn">
          <span class="fas fa-minus-circle fa-2x text-danger">&ensp;</span>
        </button>
      </div>
    </div>
  @endif
@endsection

{{-- Script --}}
@push('scripts')
<script type="text/javascript" src="{{ asset('js/jquery-ui-1.10.2/ui/jquery-ui.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/jquery-timepicker-addon/jquery-ui-timepicker-addon.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/jquery-timepicker-addon/i18n/jquery-ui-timepicker-zh-TW.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/datepicker-default-setting.js') }}"></script>
<script type="text/javascript">
  function getMaintenances() {
    $.ajax({
      method: "POST",
      url: "{{route('user.rent.getMaintenances')}}",
      async:false,
      data: {
        _token: $('input[name="_token"]').val(),
        id: {{$site->id}},
        sdate: $('input[name="sdate"]').val(),
        edate: $('input[name="edate"]').val()
      }
    })
    .done(function( json ) {
      let data = JSON.parse(json);
      for (let d in data) {
        let periods = data[d];
        if (periods.length == 3) {
          if ($('#clone-sample-hour').length == 0) {
            $('input[name^="date['+d+']"][name$="[use][]"]:eq(0)').closest('tr').html('<td>'+d+'</td><td colspan="3">維護</td>');
            $('input[name^="date['+d+']"][name$="[use][]"]').closest('tr').remove();
          } else {
            $( "td:contains('"+d+"')").closest('tr').html('<td>'+d+'</td><td colspan="2">維護</td>');
          }
        } else {
          for (let p in periods) {
            $('input[name^="date['+d+']"][name$="[period][]"][value="'+periods[p]+'"]').prop('disabled', true);
          }
        }
      }
    });
  }
  @if (Request::is('admin/rent/create'))
  $( document ).ready(function() {
    setRoleUse($('input[name="role"]:checked').val());
    $('input[name="role"]').on('change', function() {
      setRoleUse($(this).val());
    });
  });
  //@@@
  function setRoleUse(role) {
    let element = $('input[name="use"]').parent().parent().parent();
    if (role == 'ntsu') {
      element.show();
      showUse($('input[name="use"]:checked').val());
      $('input[name="rent_unit"]').attr('placeholder','系所/行政單位');
    } else if (role == 'normal'){
      element.hide();
      showUse('');
    } else {
      element.hide();
      showUse('');
      $('input[name="rent_unit"]').attr('placeholder','公司行號');
    }
  }
  @endif
</script>
<script type="text/javascript" src="{{ Module::asset('rent:js/rent/create.js')}}"></script>
@endpush