@extends('layouts.admin')

@section('content')
<div class="row">
  <div class="col-md-6">
     <div class="card shadow-lg">
      <div class="card-body pt-5">
        <div class="text-center">
          <h1 class="h4 text-gray-900 mb-4">Add File or Text</h1>
        </div>
        <form class="user" action="{{ route('qc.task.save') }}" method="post">
          @csrf
          <input type="hidden" name="task_id" value="{{ $task->task_id }}">
          <input type="hidden" name="id" value="{{ $task->id }}">
          <div class="row justify-content-md-center">
            @if ($errors->any())
              <div class="col-md-8 mt-3">
                <div class="alert alert-danger bg-gradient-danger">
                  <ul style="list-style: none;margin-bottom: 0;color: #fff;">
                      @foreach ($errors->all() as $error)
                          <li>{{ $error }}</li>
                      @endforeach
                  </ul>
                </div>
              </div>
            @endif
            
            <div class="col-md-8 mt-3">
              <label>Job name</label>
              <input type="text" class="form-control form-control-user" readonly value="{{ $task->job_name }}">
            </div>

            <div class="col-md-8 mt-3">
              <div class="form-group bmd-form-group">
                <textarea class="form-control" name="text" placeholder="Add text" rows="5" cols="3">{{ old('text') }}</textarea>
              </div>
            </div>
            @if( !is_null($task->file_part) || !empty($task->file_part))
            <div class="col-md-8 mt-3">
                <a href="{{ pathFile($task->file_part) }}">Open file</a>
            </div>
            @endif
            <div class="col-md-8 mt-3">
              <div class="form-group bmd-form-group">
                <input type="file" name="files" id="addfile" class="form-control form-control-user" style="display: none;" onchange="checkFiles()">
                <span id="file_name"></span>
                <button type="button" class="btn btn-secondary btn-block" onclick="$('#addfile').trigger('click')">Upload file</button>
              </div>
            </div>

            <div class="col-md-8 mt-5">
                <button type="submit" class="btn btn-primary btn-block btn-user">Save</button>
            </div>
          </div>          
          <div class="clearfix"></div>
        </form>
      </div>
    </div>
  </div>
</div>
@endsection

@section('style')
<style type="text/css">

</style>
@endsection

@section('script')
<script type="text/javascript">
  function checkFiles(){
      var fileInput = document.getElementById('addfile');  
      var filename = fileInput.files[0].name;
      var filetype = fileInput.files[0].type;

      if(filetype.indexOf("zip") == '-1' && filetype.indexOf("rar") == '-1'){
        $('#addfile').val('');
        $('#file_name').text('Upload file .zip or .rar only.');
        $('#file_name').css('color','red');
      }else{
        $('#file_name').text(filename);
        $('#file_name').css('color','#858796');
      }
  }
</script>
@endsection