@extends ("layouts.admin", ['page'=>"news_edit"])

@section('content')
  <div id="news__edit">
    <div class="content">
      <h1>Éditer une news</h1>
    </div>

    <div class="columns">
      <form class="column is-12" id="saveNews" action="{{route('news.update',['news'=>$news->id])}}" method="POST" @submit.prevent="submit">

        <div class="columns">
          <div class="column is-6">
            <label class="label">Type de news</label>
            <p class="control">
              <span class="select is-fullwidth">
                <select class="is-fullwidth" v-model="form.type_id">
                  @foreach($types as $type)
                    <option value="{{$type->id}}">{{$type->name}}</option>
                  @endforeach
                </select>
              </span>
            </p>      
          </div>

          <div class="column is-6">
            <label class="label">Langue de la news</label>
            <p class="control">
              <span class="select is-fullwidth">
                <select class="is-fullwidth" v-model="form.lang" @change="fetchDataByLang">
                  @foreach($langues as $langue)
                    <option value="{{$langue->code}}">{{$langue->nom}}</option>
                  @endforeach              
                </select>
              </span>
            </p>
          </div>
        </div>

        <upload
          id="newsImage"
          filter=".jpg, .gif, .png"
          action="{{route('news.image.upload', ['news'=>$news->id])}}"
          v-show="!hasImage">
        </upload>

        <div class="news__content">
          <div class="news__content__text">
            <label class="label">Titre</label>
            <p class="control">
              <input class="input" type="text" v-model="form.titre" id="titre" name="titre">
              <span class="help is-danger" v-if="form.errors.has('titre')" v-text="form.errors.get('titre')"></span>
            </p>
            
            <label class="label">Contenu</label>
            <p class="control">
              <textarea class="textarea" id="body" name="body" v-model="form.body"></textarea>
              <span class="help is-danger" v-if="form.errors.has('body')" v-text="form.errors.get('body')"></span>              
            </p>
          </div>

          <div class="news__content__image" v-show="hasImage">
            <img :src="newsImage" class="newsImage" alt="">
            <div class="close" @click="removeImage">
              <span class="icon">
                <i class="fa fa-remove"></i>
              </span>
            </div>
          </div>
        </div>


        <a href="#" class="button is-primary is-outlined is-fullwidth submit" @click.prevent="submit">
          <span class="icon">
            <i class="fa fa-download" :class="{'fa-circle-o-notch fa-spin fa-3x fa-fw': isLoading}"></i>
          </span>
          <span>Sauvegarder la news</span>          
        </a>
      </form>
    </div>
  </div>
@endsection