@extends('layouts.admin_template')
@section('content')
<!-- container Start -->
<section class="content">
	<div class="container-fluid">
		<div class="flash-message mrgn-top15">
			@foreach (['danger', 'warning', 'success', 'info'] as $msg)
			@if(Session::has('alert-' . $msg))
			<div class="alert alert-{{ $msg }} alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button><h4>{{ ucfirst(($msg == 'danger') ? "Error" : $msg) }}!</h4> {{ Session::get('alert-' . $msg) }}</div>
			@endif
			@endforeach
		</div>
	</div>
	<div class="justify-content-end d-flex mb-3">
		<a href="{{ url('/admin/setting/promotionlist') }}" class="btn btn-primary">View Promotion List</a>
	</div>


	<div class="container-fluid">
    	<div class="row">
    	    <div class="col-md-12">
                <div class="card  rounded-3 box-shadow">
                    <div class="card-header bg-card-dark-blue">
        	            <h3 class="card-title">Create New Promotion</h3>
		            </div>

					<div class="card-body">
						<form role="form" method="post" action="{{ url('/admin/setting/promotionstore') }}" enctype="multipart/form-data">
							@csrf
							<div class="row gx-4 gx-xl-5">
								<div class="col-sm-12 col-md-6 col-lg-6">
									<div class="mb-4">
										<label for="type" class="form-label">Type <span class="required-mark">*</span></label>
										<select name="type" class="form-control form-control-lg bg-secondary @error('type') is-invalid @enderror" id="promotiontype">
											<option value="image" {{ (old("type") == "image" ? "selected":"") }}>Image</option>
											<option value="text" {{ (old("type") == "text" ? "selected":"") }}>Text</option>
										</select>
										@error('type')
										<div class="invalid-feedback">
											{{ $message }}
										</div>
										@enderror
									</div>
								</div>
							</div>
							<div class="row gx-4 gx-xl-5">
								<div class="col-sm-12 col-md-6 col-lg-6" id="promotionimage">
									<div class="mb-4">
										<label for="image" class="form-label">Image <span class="required-mark">*</span></label>
										<input type="file" name="image" class="form-control form-control-lg bg-secondary @error('image') is-invalid @enderror" id="image" accept="image/jpg, image/jpeg, image/png">
										@error('image')
										<div class="invalid-feedback">
											{{ $message }}
										</div>
										@enderror
									</div>
								</div>
							</div>
							<div class="row gx-4 gx-xl-5">
								<div class="col-sm-12 col-md-6 col-lg-6" id="promotiondescription">
									<div class="mb-4">
										<label for="description" class="form-label">Description <span class="required-mark">*</span></label>
										<textarea name="description" class="form-control ckeditor form-control-lg @error('description') is-invalid @enderror" id="description" placeholder="Enter Description">{{ old('description') }}</textarea>
										@error('description')
										<div class="invalid-feedback">
											{{ $message }}
										</div>
										@enderror
									</div>
								</div>
							</div>
							<div class="row gx-4 gx-xl-5">
								<div class="col-sm-12 col-md-6 col-lg-6">
									<div class="mb-4">
										<label for="status" class="form-label">Status <span class="required-mark">*</span></label>
										<select name="status" class="form-control form-control-lg bg-secondary @error('status') is-invalid @enderror" id="status">
											<option value="1">Active</option>
											<option value="0">Inactive</option>
										</select>
										@error('status')
										<div class="invalid-feedback">
											{{ $message }}
										</div>
										@enderror
									</div>
								</div>
							</div>
							<div class="row gx-4 gx-xl-5">
								<div class="col-md-12 pt-2">
									<button class="btn btn-primary font-15" type="submit" onclick="this.disabled=true;this.value='Sending, please wait...';this.form.submit();">Submit</button>
								</div>
							</div>
						</form>

					</div>

				</div>
			</div>
		</div>
	</div>


	

	

</section>
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
	$(function() {
		$('#promotiondescription').hide();
		var type = $('#promotiontype').val();
		if(type == 'text'){
			$('#promotiondescription').show();
			$('#promotionimage').hide();
		}else{
			$('#promotionimage').show();
			$('#promotiondescription').hide();
		}
		$("#promotiontype").change(function() {
			if($(this).val() == 'text'){
				$('#promotiondescription').show();
				$('#promotionimage').hide();
			}
			else{
				$('#promotionimage').show();
				$('#promotiondescription').hide();
			}
		});
		window.addEventListener("load", (e)=>{
			ClassicEditor.create( document.querySelector( '#description' ) )
			.then( editor => {
				//console.log( editor );
			} )
			.catch( error => {
				//console.error( error );
			} );
		});
	});
</script>
@endsection