@extends('admin.layout.page-app')
@section('page_title', __('label.edit_vacancy'))
@section('tab_title', __('label.edit_vacancy'))

@section('content')
	@include('admin.layout.sidebar')

	<!-- Select2 -->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" />
	<!-- Summer notes -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.css">

	<div class="right-content">
		@include('admin.layout.header')

  		<div class="body-content">
  			<!-- mobile title -->
  			<h1 class="page-title-sm">{{__('label.edit_vacancy')}}</h1>

  			<div class="border-bottom row">
  				<div class="col-sm-10">
  					<ol class="breadcrumb">
  						<li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">{{__('label.dashboard')}}</a></li>
  						<li class="breadcrumb-item"><a href="{{ route('vacancy.index') }}">{{__('label.vacancy')}}</a></li>
  						<li class="breadcrumb-item active" aria-current="page">{{__('label.edit_vacancy')}}</li>
  					</ol>
  				</div>
  				<div class="col-sm-2 d-flex align-items-center justify-content-end">
  					<a href="{{ route('vacancy.index') }}" class="btn btn-default mw-120" style="margin-top:-14px">{{__('label.vacancy')}}</a>
  				</div>
  			</div>

			<div class="card custom-border-card mt-3">
				<form id="edit_vacancy" enctype="multipart/form-data">
					<div class="card-body">
						<input type="hidden" name="id" value="{{$result->id}}">
                        <input type="hidden" name="country_name" value="BZ">
						<div class="form-row">
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.citizen')}}<span class="text-danger">*</span></label>
									<select class="form-control" name="user_id" id="user_id">
										<option value="">{{__('label.select_citizen')}}</option>
										@foreach ($user as $key => $value)
										<option value="{{$value->id}}" {{ $result->user_id == $value->id ? 'selected' : ""}}>
											{{ $value->full_name }}
										</option>
										@endforeach
									</select>
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.company')}}<span class="text-danger">*</span></label>
									<select class="form-control" name="company_id" id="company_id">
										<option value="">{{__('label.select_company')}}</option>
										@foreach ($company as $key => $value)
										<option value="{{$value->id}}" {{ $result->company_id == $value->id ? 'selected' : "" }}>
											{{ $value->name }}
										</option>
										@endforeach
									</select>
								</div>
							</div>
						</div>
						<div class="form-row">
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.position')}}<span class="text-danger">*</span></label>
									<input name="position" type="text" value="{{$result->position}}" class="form-control" placeholder="{{__('label.position_here')}}" autofocus>
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.type')}}<span class="text-danger">*</span></label>
									<select class="form-control" name=type>
										<option value="">{{__('label.select_type')}}</option>
										<option value="1" {{ $result->type == 1 ? 'selected' : "" }}>{{__('label.in_person')}}</option>
										<option value="2" {{ $result->type == 2 ? 'selected' : "" }}>{{__('label.home_office')}}</option>
										<option value="3" {{ $result->type == 3 ? 'selected' : "" }}>{{__('label.hybrid')}}</option>
									</select>
								</div>
							</div>
						</div>
						<div class="form-row">
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.salary')}}</label>
									<input name="salary" type="text" value="{{$result->salary}}" class="form-control" placeholder="{{__('label.salary_here')}}">
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.weekly_workload')}}<span class="text-danger">*</span></label>
									<input name="weekly_workload" type="text" value="{{$result->weekly_workload}}" class="form-control" placeholder="{{__('label.weekly_workload_here')}}">
								</div>
							</div>
						</div>
						<div class="form-row">
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.work_days')}}<span class="text-danger">*</span></label>
									<input name="work_days" type="text" value="{{$result->work_days}}" class="form-control" placeholder="{{__('label.work_days_here')}}">
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label>{{__('label.schedule')}}<span class="text-danger">*</span></label>
									<input name="schedule" type="text" value="{{$result->schedule}}" class="form-control" placeholder="{{__('label.schedule_here')}}">
								</div>
							</div>
						</div>
						<div class="form-row">
							<div class="col-md-12">
								<div class="form-group">
									<label>{{__('label.job_description')}}<span class="text-danger">*</span></label>
									<textarea name="job_description" type="text" class="form-control" placeholder="{{__('label.job_description_here')}}">{{$result->job_description}}</textarea>
								</div>
							</div>
							<div class="col-md-12">
								<div class="form-group">
									<label>{{__('label.requirements')}}<span class="text-danger">*</span></label>
									<textarea name="requirements" type="text" class="form-control" id="summernote" placeholder="{{__('label.requirements_here')}}">{{$result->requirements}}</textarea>
								</div>
							</div>
						</div>
					</div>

					<div class="border-top pt-3 text-right">
						<button type="button" class="btn btn-default mw-120" onclick="edit_vacancy()">{{__('label.update')}}</button>
						<a href="{{route('vacancy.index')}}" class="btn btn-cancel mw-120 ml-2">{{__('label.cancel')}}</a>
						<input type="hidden" name="_method" value="PATCH">
					</div>
				</form>
			</div>
		</div>
  	</div>		
@endsection

@section('pagescript')
	<!-- Select2 -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>
	<!-- Summernote -->
	<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script>
	<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
	
	<script>
		$('#user_id').select2();
		$('#company_id').select2();

		$(document).ready(function() {
            $('#summernote').summernote({
                placeholder: "{{__('label.requirements_here')}}",
                height: 500,
                toolbar: [
                    // Style Formatting
                    ['style', ['bold', 'italic', 'underline', 'clear']],
                    // Font Options
                    ['font', ['fontname', 'fontsize']],
                    ['color', ['forecolor']],
                    // Paragraph Formatting
                    ['para', ['ul', 'ol', 'paragraph']],
                    ['height', ['height']],
                    // Insert Options
                    ['insert', ['link', 'picture', 'video']],
                    // Additional Formatting
                    ['table', ['table']],
                    // View Options
                    ['view', ['fullscreen', 'codeview', 'help']],
                ],
                fontSizes: ['8', '10', '12', '14', '16', '18', '20', '22', '24', '26', '28', '30', '32', '34', '36', '38', '40', '44', '48', '52', '56', '60', '64', '68', '72', '78', '82', '86', '90', '94', '100'],
                lineHeights: ['0.2', '0.3', '0.4', '0.5', '0.6', '0.8', '1.0', '1.2', '1.4', '1.5', '1.8', '2.0', '3.0'],   
            });
            // Remove tooltip attributes from toolbar buttons
            $('.note-toolbar button').removeAttr('title data-original-title');
        });

		function edit_vacancy(){

			var Demo_Mode = '<?php echo Demo_Mode(); ?>';
            if(Demo_Mode == 1){

				$("#dvloader").show();
				var formData = new FormData($("#edit_vacancy")[0]);
				$.ajax({
					type:'POST',
					url:'{{ route("vacancy.update", [$result->id]) }}',
					data:formData,
					cache:false,
					contentType: false,
					processData: false,
					success:function(resp){
						$("#dvloader").hide();
						get_responce_message(resp, 'edit_vacancy', '{{ route("vacancy.index") }}');
					},
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        $("#dvloader").hide();
                        toastr.error(errorThrown, textStatus);
                    }
				});
			} else {
                showError();
            }
		}

		// get company
        $('#user_id').change(function() {
            var user_id = $(this).val();
            $.ajax({
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url: '{{ route("get_comapny") }}',
                data: {
                    userId: user_id
                },
                success: function(response) {
                    $('#company_id').empty();
                    $('#company_id').append('<option value=""> {{__("label.select_company")}}</option>');
                    response.forEach(function(item) {

                        $('#company_id').append(`<option value="${item.id}">${item.name}</option>`);
                    });
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    toastr.error(errorThrown, textStatus);
                }
            });
        });
	</script>
@endsection