@extends('adminlte::page')

@section('title', 'Edit Campaign')

@section('content_header')
<div class="row">
  <div class="col-6">
    <h1>Edit Campaign</h1>
  </div> <!-- /.col -->
  <div class="col-6">
    <p><a href="{{ URL::to('/') }}/campaign/{{ $campaign->id }}" target="_blank"
        class="btn btn-flat btn-primary float-right"><i class="fa-solid fa-up-right-from-square"></i> View Campaign</a>
    </p>
  </div> <!-- /.col -->
</div> <!-- /.row -->
@stop

@section('content')

@include('notifications')

<!-- form start -->
<form method="POST" action="/admin/campaigns/{{ $campaign->id }}" enctype="multipart/form-data" role="form">
  {{ csrf_field() }}
  {{ method_field('PATCH') }}
  <div class="row">
    <div class="col-md-8">
      <div class="card card-default">
        <div class="card-header">
          <h3 class="card-title">Campaign Details</h3>
        </div> <!-- /.card-header -->
        <div class="card-body">
          <div class="form-group">
            <label for="title">Campaign Title</label>
            <input type="text" name="title" class="form-control" id="title" placeholder="Type campaign title"
              value="{{ $campaign->title }}">
          </div>
          <div class="form-group">
            <label for="content">Campaign Content</label>
            <textarea name="content" class="form-control" id="content">{{ $campaign->content }}</textarea>
          </div>
          <div class="form-group">
            <label for="url">Campaign Link</label>
            <input type="text" name="url" class="form-control" id="url" placeholder="Type campaign url"
              value="{{ $campaign->url }}">
          </div>
        </div> <!-- /.card-body -->
      </div> <!-- /.card -->
    </div> <!-- /.col -->
    <div class="col-md-4">
      <div class="card card-default">
        <div class="card-header">
          <h3 class="card-title">Campaign Image</h3>
        </div> <!-- /.card-header -->
        <div class="card-body">
          @include('backend.components.media-input', ['value' => 'image', 'image' =>
          isset($campaign->getFirstMedia('image')->id) ? $campaign->getFirstMedia('image')->id : null])
        </div> <!-- /.card-body -->
      </div> <!-- /.card -->
      <div class="card card-default">
        <div class="card-body">
          <div class="form-group">
            <label for="categories">Category</label>
            <div class="form-group">
              <select name="categories[]" class="select2" id="categories" multiple="multiple"
                data-placeholder="Select Campaign Categories" style="width: 100%;">
                @foreach( $categories as $categroy )
                <option value="{{ $categroy->id }}" {{ in_array( $categroy->id, $campaignCategories ) ?
                  'selected="selected"' : '' }} >{{ $categroy->name }}</option>
                @endforeach
              </select>
            </div>
          </div>
          <div class="form-group">
            <label for="status">Status</label>
            <select name="status" class="form-control" id="status" placeholder="Select blog status">
              <option value="active" selected="selected">Active</option>
              <option value="inactive">Inactive</option>
            </select>
          </div>
        </div> <!-- /.card-body -->
      </div> <!-- /.card -->

      <div class="card card-default">
        <div class="card-body">
          <button type="submit" name="updateCampaign" class="btn btn-flat btn-primary" id="updateCampaign"><i
              class="far fa-save"></i> Save</button>
          <a class="btn btn-flat btn-secondary float-right" href="/admin/campaigns"><i class="fas fa-share"></i>
            Back</a>
        </div> <!-- /.card-body -->
      </div> <!-- /.card -->
    </div> <!-- /.col -->
  </div> <!-- /.row -->
</form>
@stop
@section('plugins.jQuery-UI', true)
@section('plugins.Select2', true)
@section('plugins.Summernote', true)
@section('plugins.BootstrapSwitch', true)
@section('adminlte_js')
<script>
  // runs when the document is ready --> for media files
  $(document).ready(function() {
    getChosenFilesCount();
    showSelectedFilePreviewOnLoad();
  });

  $(function () {
    //Initialize Select2 Elements
    $('.select2').select2()

  });
</script>
@stop