@extends('layouts.master')

@section('content')
  <div class="cover-image"></div>
  <div class="page-description">
    @if ($step === 1)
      @lang('descriptions.mitarbeiter-tips.crud')
    @elseif ($step === 2)
      @lang('descriptions.mitarbeiter-tips.request-approval')
    @endif
  </div>
  <div class="page-content">
    @if (Helper::createMode())
      @if (isset($mitarbeiter_tip))
        <form method="POST" action="{{ route('mitarbeiter-tips.store') }}" class="mitarbeiter-tips-form model" enctype="multipart/form-data"
          accept-charset="UTF-8">
        @else
          <form method="POST" action="{{ route('mitarbeiter-tips.store') }}" class="mitarbeiter-tips-form" enctype="multipart/form-data" accept-charset="UTF-8">
      @endif
    @elseif (Helper::editMode())
      <form method="POST" action="{{ route('mitarbeiter-tips.update', $mitarbeiter_tip->id) }}" class="mitarbeiter-tips-form" enctype="multipart/form-data"
        accept-charset="UTF-8">
    @endif
    @csrf
    @php
      $image_URL = '';
      if (isset($mitarbeiter_tip)) {
          $image_URL = asset('images/profile_pictures/' . $mitarbeiter_tip->image);
      } elseif (old('image')) {
          $image_URL = asset('images/profile_pictures/' . old('image'));
      }
    @endphp
    <div class="form-container">
      <div class="mitarbeiter-tips-container">
        @if ($step === 1)
          <input type="hidden" name="step" value="1">
          <input type="checkbox" name="go-to-preview" value="1" id="go-to-preview" class="hidden">
          <input type="hidden" name="image" class="mitarbeiter-tips-image">

          @if ($errors->has('cmyk_error'))
            <div class="form-group event-step-error">
              Das verwendete Bild hat den falschen Farbraum (CMYK). Bitte passen Sie diesen auf "RGB" an, oder wenden Sie sich an den Herausgeber des Bildes mit
              dieser Information.
            </div>
          @endif
          <div class="form-group image-placeholder-area">
            <div class="form-control-title">
              <span>Wählen Sie ein Bild aus:</span>
            </div>
            <div class="form-group image-placeholder @if ($errors->has('image')) has-error @endif" style="background-image: url({{ $image_URL }})">
              <div class="grey-button select-new-image select-mitarbeiter-tips-image">Bestehendes Foto wählen</div>
              <div class="grey-button upload-new-image upload-mitarbeiter-image">Neues Foto hochladen</div>
              <input type="file" name="upload_image" class="upload-mitarbeiter-tips-image hidden" accept="image/*">
            </div>
          </div>
          <div class="form-group @if ($errors->has('first_name')) has-error @endif">
            <div class="form-control-title form-control-first-name">
              <span>Vorname:</span>
            </div>
            <input type="text" name="first_name" class="mitarbeiter-tips-first-name form-control" placeholder="..." maxlength="27" value="{{ !empty($mitarbeiter_tip->first_name) ? $mitarbeiter_tip->first_name : old('first_name') }}">
          </div>
          <div class="form-group @if ($errors->has('last_name')) has-error @endif">
            <div class="form-control-title form-control-last-name">
              <span>Nachname:</span>
            </div>
            <input type="text" name="last_name" class="mitarbeiter-tips-last-name form-control" placeholder="..." maxlength="27" value="{{ !empty($mitarbeiter_tip->last_name) ? $mitarbeiter_tip->last_name : old('last_name') }}">
          </div>
          <div class="form-group @if ($errors->has('tip')) has-error @endif">
            <div class="form-control-title">
              <span>Tipp:</span>
            </div>
            <textarea name="tip" class="mitarbeiter-tips-tip" placeholder="..." maxlength="300"></textarea>
          </div>
        @elseif ($step === 2)
          <input type="hidden" name="step" value="2">
          <input type="checkbox" name="approval" value="1" id="approval" class="hidden">
          @include ('partials.previews')
          <div class="approval-options">
            <div class="form-group touchpoints @if ($errors->has('message_group')) has-error @endif">
              <div class="form-label">Wo soll der Inhalt angezeigt werden?</div>
              <div class="touchpoint-option custom-control custom-checkbox">
                <input type="checkbox" name="sf" value="1" id="sf" class="custom-control-input form-check-input" @if ((!empty($mitarbeiter_tip->sf) && $mitarbeiter_tip->sf == 1) || old('sf')) checked @endif>
                <label class="custom-control-label form-label" for="sf">Schaufenster-Bildschirm:</label>
              </div>
              <div class="touchpoint-option custom-control custom-checkbox">
                <input type="checkbox" name="sb" value="1" id="sb" class="custom-control-input form-check-input" @if ((!empty($mitarbeiter_tip->sb) && $mitarbeiter_tip->sb == 1) || old('sb')) checked @endif>
                <label class="custom-control-label form-label" for="sb">SB-Bereich-Bildschirm:</label>
              </div>
              <div class="touchpoint-option custom-control custom-checkbox">
                <input type="checkbox" name="stw" value="1" id="stw" class="custom-control-input form-check-input" @if ((!empty($mitarbeiter_tip->stw) && $mitarbeiter_tip->stw == 1) || old('stw')) checked @endif>
                <label class="custom-control-label form-label" for="stw">Stadtteilwand-Bildschirm:</label>
              </div>
            </div>
            @include ('partials.validity')
            @include ('partials.approvers')
          </div>
        @endif
      </div>
    </div>
    @include ('partials.action_btns')
    </form>
  </div>
@endsection

@section('back_button')
  @if ($step === 1)
    <a href="{{ route('mitarbeiter-tips.index') }}" class="grey-button">Zurück</a>
  @elseif ($step === 2)
    @if (Helper::createMode())
      <a href="{{ route('mitarbeiter-tips.create.step-1') }}" class="grey-button">Zurück</a>
    @elseif (Helper::editMode())
      <a href="{{ route('mitarbeiter-tips.edit.step-1', $mitarbeiter_tip->id) }}" class="grey-button">Zurück</a>
    @endif
  @endif
@endsection