<?php

$elements = json_decode($job_elements);

$categories = ' <option disabled>Select Category </option> ';
foreach ($elements->categories as $key => $category) {
	$categories .= ' <option value="' . $category->id . '">' . $category->name . ' </option> ';
}

$skills = ' <option disabled>Select Category </option> ';

foreach ($elements->skills as $key => $skill) {
	$skills .= ' <option value="' . $skill->id . '">' . $skill->name . ' </option> ';
}
?>

<div class="container-fluid">
	<div class="container">
		<h3 class="text-center btn-block " style="background-color:#F3920F;color: #fff;padding: 10px 0 3px;margin: 0;border-radius: 5px;text-transform: uppercase;">
			<i> <?= $user->name ?> </i> :
			<small>New Job Post </small>
		</h3>
	</div>
	<br>
	<br>
</div>


<div class="alertMsg">

</div>


<form enctype="multipart/form-data" method="post" action="https://myadmin.mali-mart.com/api/save-merchant-job/<?= $user->id ?>" id="apiProduct">

	<div class="row">
		<div class="col-md-11 col-sm-12 form-group">
			<label for="title">Job Slug:</label>
			<input type="text" class="form-control slug" readonly required name="slug" id='title' placeholder='We-are-hiring'>
		</div>
	</div>

	<div class="row">
		<div class="col-md-11 col-sm-12 form-group">
			<label for="title">Job Title:</label>
			<input type="text" class="form-control title" required name="title" id='title' placeholder='Job Title...'>
		</div>
	</div>


	<div class="row">
		<div class="col-md-4 col-sm-4 form-group">
			<label for="brand">Category:</label>
			<select name="job_category_id" class="form-control">
				<?= $categories ?>
			</select>
		</div>

		<div class="col-md-4 col-sm-4 form-group">
			<label for="brand">Skills:</label>
			<select name="skill_id[]" class="form-control select2" multiple>
				<?= $skills ?>
			</select>
		</div>

		<div class="col-md-4 col-sm-4 form-group">
			<label for="job_files">Attach Files (Image, Doc,Docx, PDF):
				<input type="file" id="job_files" accept="image/x-png,image/gif,image/jpeg,application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" name="job_files[]" multiple class="form-control" />
			</label>
		</div>

		<div class="col-md-4 col-sm-4 form-group">
			<label for="color">Budget :</label>
			<input type="number" name="budget" class="form-control" min="1" value="0" placeholder="5000 Tk">
		</div>

		<div class="col-md-4 col-sm-4 form-group">
			<label for="color">Deadline :</label>
			<input type="date" name="deadline" class="form-control">
		</div>

		<div class="col-md-4 col-sm-4 form-group">
			<div class="oldFiles"></div>
		</div>


	</div>
	<div class="row form-group">
		<div class="col-12">
			<label for="description">Description:</label>
			<textarea class="form-control" name="description" required rows="5"></textarea>
		</div>
	</div>


	<div class="row justify-content-center">
		<div class="col-md-4 col-sm-8">
			<button class="btn btn-success btn-block" type="submit">Save
				<i class="material-icons"></i> </button>
		</div>
	</div>
</form>

<br>


<!-- Script start  -->

<script>
	$("#apiProduct").submit(function(e) {
		e.preventDefault();

		var formData = new FormData(this);
		formData.append('merchant_name', '<?= $user->name ?>');
		formData.append('merchant_code', '<?= $user->own_refer_id ?>');

		$.ajax({
			method: "post",
			url: $(this).attr('action'),
			data: formData,
			contentType: false,
			cache: false,
			processData: false,
			dataType: "json",
			success: function(res) {

				var alertMsg = '<div class="alert alert-success fade in alert-dismissible" style="margin-top:18px;opacity:1 !important"><a href="#" class="close" data-dismiss="alert" aria-label="close" title="close">' + '*' + '</a><strong>Success!</strong> Merchant New Post saved.</div>';
				$(".alertMsg").html(alertMsg);
			}
		})

	});
</script>

<!-- Script End  -->