@extends('layouts.app')

@section('content')
<div class="card">
	<form id="form-edit" action="{{ route('banners.update') }}" method="POST">
		<div class="card-header">
			<h5 class="card-title">Banner</h5>

			<button type="submit" class="btn btn-dark"><i class="fas fa-save"></i> Save</button>
		</div>

		<div class="card-body">
			<div class="container-fluid">
				<h5 class="mb-3">Home</h5>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Web</label>

					<div class="col-md-10">
						<img src="{{ $banner->home_web }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="home_web">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required | at least width of 1920px </small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Mobile</label>

					<div class="col-md-10">
						<img src="{{ $banner->home_mobile }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="home_mobile">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required | at least width off 992px</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">URL</label>

					<div class="col-md-10">
						<input type="text" class="form-control" name="home_url" value="{{ $banner->home_url }}">

						<small class="form-text text-muted">required | example: https://www.google.com</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Active</label>

					<div class="col-md-10">
						<input type="checkbox" id="home_active" name="home_active" value="1" @if($banner->home_active) checked @endif>
					</div>
				</div>

				<h5 class="mt-5 mb-3">Guest Popup</h5>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Web</label>

					<div class="col-md-10">
						<img src="{{ $banner->guest_popup_web }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="guest_popup_web">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Mobile</label>

					<div class="col-md-10">
						<img src="{{ $banner->guest_popup_mobile }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="guest_popup_mobile">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">URL</label>

					<div class="col-md-10">
						<input type="text" class="form-control" name="guest_popup_url" value="{{ $banner->guest_popup_url }}">

						<small class="form-text text-muted">required | example: https://www.google.com</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Active</label>

					<div class="col-md-10">
						<input type="checkbox" id="guest_popup_active" name="guest_popup_active" value="1" @if($banner->guest_popup_active) checked @endif>
					</div>
				</div>

				<h5 class="mt-5 mb-3">Member Popup</h5>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Web</label>

					<div class="col-md-10">
						<img src="{{ $banner->member_popup_web }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="member_popup_web">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Mobile</label>

					<div class="col-md-10">
						<img src="{{ $banner->member_popup_mobile }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="member_popup_mobile">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">URL</label>

					<div class="col-md-10">
						<input type="text" class="form-control" name="member_popup_url" value="{{ $banner->member_popup_url }}">

						<small class="form-text text-muted">required | example: https://www.google.com</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Active</label>

					<div class="col-md-10">
						<input type="checkbox" id="member_popup_active" name="member_popup_active" value="1" @if($banner->member_popup_active) checked @endif>
					</div>
				</div>

				<h5 class="mb-3">Reward</h5>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Web</label>

					<div class="col-md-10">
						<img src="{{ $banner->reward_web }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="reward_web">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required | at least width of 1920px </small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Mobile</label>

					<div class="col-md-10">
						<img src="{{ $banner->reward_mobile }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="reward_mobile">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required | at least width off 992px</small>
					</div>
				</div>

<!-- 				<div class="form-group row">
					<label class="col-md-2 col-form-label">URL</label>

					<div class="col-md-10">
						<input type="text" class="form-control" name="reward_url" value="{{ $banner->reward_url }}">

						<small class="form-text text-muted">required | example: https://www.google.com</small>
					</div>
				</div> -->

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Active</label>

					<div class="col-md-10">
						<input type="checkbox" id="reward_active" name="reward_active" value="1" @if($banner->reward_active) checked @endif>
					</div>
				</div>
			</div>

			<h5 class="mt-5 mb-3">Member Expiry Popup</h5>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Web</label>

					<div class="col-md-10">
						<img src="{{ $banner->member_expiry_popup_web }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="member_expiry_popup_web">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">Mobile</label>

					<div class="col-md-10">
						<img src="{{ $banner->member_expiry_popup_mobile }}" class="img-fluid img-thumbnail mb-2">
						<input type="file" class="d-none" name="member_expiry_popup_mobile">

						<div class="input-group">
							<div class="input-group-prepend">
								<button type="button" class="btn btn-dark btn-browse"><i class="fas fa-folder-open"></i></button>
							</div>

							<input type="text" class="form-control" disabled>
						</div>

						<small class="form-text text-muted">required</small>
					</div>
				</div>

				<div class="form-group row">
					<label class="col-md-2 col-form-label">URL</label>

					<div class="col-md-10">
						<input type="text" class="form-control" name="member_expiry_popup_url" value="{{ $banner->member_expiry_popup_url }}">

						<small class="form-text text-muted">example: https://www.google.com</small>
					</div>
				</div>
		</div>

		<input type="hidden" name="id" value="1">
	</form>
</div>
@endsection

@section('js')
<script>
	$('#form-edit').submit(function(e)
	{
		$.Event(e).preventDefault();

		const form = $(this);
		$.ajax({
			url: $(this).attr('action'),
			type: $(this).attr('method'),
			data: new FormData(this),
			contentType: false,
			processData: false,
			dataType: 'json'

		}).done(function(data)
		{
			showNoty(data);
		});
	});
</script>
@endsection