@extends('layouts.app')

@section('title')
    Update Hasil Kerja
@endsection

@section('content')
<div class="col-sm-12 col-md-9">
  <div class="card card-box card-primary">
      <div class="card-header">
        Update Hasil Kerja
      </div>
      <div class="card-body">

        <form method="POST" action="{{ route('staf:result.update', $result->id) }}" enctype="multipart/form-data">
            @csrf
            @method('PUT')
                <div class="form-group row">

                    <label class="col-sm-12 col-md-2 col-form-label">Jenis pekerjaan</label>
                    <div class="col-sm-12 col-md-10">
                        <select id="assignment_id" name="assignment_id" class="form-control @error('assignment_id') is-invalid @enderror">
                            <option value="">Pilih jenis pekerjaan</option>
                                @foreach($assignments as $assignment)
                                  {{-- <option value="{{$user->id}}">{{$user->name}}</option> --}}
                                    @if (old('assignment_id', $result->assignment_id) == $assignment->id)
                                        <option value="{{ $assignment->id }}" selected>{{ $assignment->complaints->complaint }} ... di ... {{ $assignment->complaints->location }}</option>
                                    @else
                                        <option value="{{ $assignment->id }}">{{ $assignment->complaints->complaint }} ... di ... {{ $assignment->complaints->location }}</option>
                                    @endif
                                @endforeach
                        </select>
                            <div class="form-group has-danger">
                                @error('assignment_id')
                                    <div class="form-control-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                    </div>

                    <label for="" class="col-sm-12 col-md-2 col-form-label">Foto hasil</label>
                    <div class="col-sm-12 col-md-10">
                            <input type="hidden" name="oldImage" value="{{ $result->photo_after }}">
                            @if ($result->photo_after)
                                <img src="{{ asset('storage/'.$result->photo_after) }}" class="img-preview img-fluid mb-3 col-md-6 d-block">
                            @else
                                <img class="img-preview img-fluid mb-3 col-md-6">
                            @endif
                            <br>
                            <input id="photo_after" name="photo_after" class="form-control-input @error('photo_after') is-invalid @enderror" type="file" accept="image/jpeg" onchange="previewImage()">
                            <div class="form-group has-danger">
                                @error('photo_after')
                                    <div class="form-control-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                    </div>
    

                    <label class="col-sm-12 col-md-2 col-form-label">Staf</label>
                    <div class="col-sm-12 col-md-10">
                        <select id="user_id" name="user_id" class="form-control @error('user_id') is-invalid @enderror">
                            <option value="">Staf yang bertugas</option>
                                @foreach($users as $user)
                                  {{-- <option value="{{$user->id}}">{{$user->name}}</option> --}}
                                    @if (old('user_id', $result->user_id) == $user->id)
                                        <option value="{{ $user->id }}" selected>{{ $user->name }}</option>
                                    @else
                                        <option value="{{ $user->id }}">{{ $user->name }}</option>
                                    @endif
                                @endforeach
                        </select>
                            <div class="form-group has-danger">
                                @error('user_id')
                                    <div class="form-control-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                    </div>

                    <label class="col-sm-12 col-md-2 col-form-label">Status pekerjaan</label>
                    <div class="col-sm-12 col-md-10">
                        <select id="status_id" name="status_id" class="form-control @error('status_id') is-invalid @enderror">
                            <option value="">Status pekerjaan</option>
                                @foreach($statuses as $status)
                                  {{-- <option value="{{$user->id}}">{{$user->name}}</option> --}}
                                    @if (old('status_id', $result->status_id) == $status->id)
                                        <option value="{{ $status->id }}" selected>{{ $status->expl }}</option>
                                    @else
                                        <option value="{{ $status->id }}">{{ $status->expl }}</option>
                                    @endif
                                @endforeach
                        </select>
                            <div class="form-group has-danger">
                                @error('status_id')
                                    <div class="form-control-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                    </div>
                </div>
                    <div class="text-right">
                        <button type="submit" class="btn btn-primary pull-right">Submit</button>
                    </div>
        </form>
      </div>
  </div>
</div>

<script>
    function previewImage()
    {
        const image = document.querySelector('#photo_after');
        const imgPreview = document.querySelector('.img-preview');

        imgPreview.style.dsiplay = 'block';

        const oFReader = new FileReader();
        oFReader.readAsDataURL(image.files[0]);

        oFReader.onload = function(oFREvent)
        {
            imgPreview.src = oFREvent.target.result;
        }
    }
</script>

@endsection