@extends('admin.layouts.app')

@section('content')

	<div class="row">
	    <div class="col-12">
	        <div class="page-title-box d-sm-flex align-items-center justify-content-between">
	            <h4 class="mb-sm-0">Editar Codigo de Cupon</h4>
	            <div class="page-title-right">
	                <a href="{{ route('coupon.index') }}" class="btn btn-primary">Volver</a>
	            </div>
	        </div>
	    </div>
	</div>

			<form action="" method="post" id="discountForm" name="discountForm">
				<div class="card">
					<div class="card-body">
						<div class="row">
							<div class="col-md-6">
								<div class="mb-3">
									<label for="name">Código</label>
									<input value="{{ $coupon->code }}" type="text" name="code" id="code" class="form-control" placeholder="Código de Cupón">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="slug">Nombre</label>
									<input value="{{ $coupon->name }}" type="text" name="name" id="name" class="form-control" placeholder="Nombre del Codigo de Cupon">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="max_uses">Usos Maximos</label>
									<input value="{{ $coupon->max_uses }}" type="number" name="max_uses" id="max_uses" class="form-control" placeholder="Usos Maximos">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="max_uses_user">Usos Maximos x Usuario</label>
									<input value="{{ $coupon->max_uses_user }}" type="number" name="max_uses_user" id="max_uses_user" class="form-control" placeholder="Usos Maximos x Usuario">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="type">Tipo</label>
									<select name="type" id="type" class="form-select">
										<option {{ ($coupon->type == "percent") ? 'selected':''}}  value = "percent">Porcentaje</option>
										<option {{ ($coupon->type == "fixed"  ) ? 'selected':''}}  value = "fixed">Importe</option>
									</select>
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="discount_amount">Importe de descuento</label>
									<input value="{{ $coupon->discount_amount }}" type="number" name="discount_amount" id="discount_amount" class="form-control" placeholder="Monto de Descuento">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="min_amount">Importe minimo</label>
									<input value="{{ $coupon->min_amount }}" type="number" name="min_amount" id="min_amount" class="form-control" placeholder="Monto Mínimo">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="field_status">Estado</label>
									<select name="status" id="field_status" class="form-select">
										<option {{ ($coupon->status == 1) ? 'selected':''}}  value = "1">Activo</option>
										<option {{ ($coupon->status == 0) ? 'selected':''}}  value = "0">Inactivo</option>
									</select>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="starts_at">Comienza</label>
									<input value="{{ $coupon->starts_at }}" autocomplete="off" type="text" name="starts_at" id="starts_at" class="form-control" placeholder="Fecha de Inicio">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="expires_at">Finaliza</label>
									<input value="{{ $coupon->expires_at }}" autocomplete="off" type="text" name="expires_at" id="expires_at" class="form-control" placeholder="Fecha de Expiración">
									<p></p>
								</div>
							</div>

							<div class="col-md-6">
								<div class="mb-3">
									<label for="description">Descripcion</label>
									<textarea class="form-control" name="description" id="description" cols="30" rows="5">
										{{ $coupon->description }}
									</textarea>
									<p></p>
								</div>
							</div>

						</div>
					</div>
				</div>
				<div class="pb-5 pt-3">
					<button type="submit" class="btn btn-primary">Actualizar</button>
					<a href="{{ route('coupon.index') }}" class="btn btn-outline-dark ms-3">Cancelar</a>
				</div>
			</form>


		<!-- /.card -->
	
@endsection


@section('customJs')

	<script>

        $(document).ready(function(){
            $('#starts_at').datetimepicker({
                // options here
                format:'Y-m-d H:i:s',
            });

            $('#expires_at').datetimepicker({
                // options here
                format:'Y-m-d H:i:s',
            });

        });

		$("#discountForm").submit(function(event){
			event.preventDefault();
			var element = $(this);
			$("button[type=submit]").prop('disabled', true);
			$.ajax({
				url: '{{ route("coupon.update", $coupon->id) }}',
				type: 'put',
				data: element.serializeArray(),
				dataType: 'json',
				success: function(response){

                    $("button[type=submit]").prop('disabled', false);
					if (response["status"] == true) {

						window.location.href = "{{ route('coupon.index')}}";

						$("#code").removeClass('is-invalid')
							.siblings('p')
							.removeClass('invalid-feedback').html("");

						$("#discount_amount").removeClass('is-invalid')
							.siblings('p')
							.removeClass('invalid-feedback').html("");

						$("#starts_at").removeClass('is-invalid')
							.siblings('p')
							.removeClass('invalid-feedback').html("");

						$("#expires_at").removeClass('is-invalid')
							.siblings('p')
							.removeClass('invalid-feedback').html("");

					} else {

						var errors = response['errors'];

						if(errors["code"]) {
							$("#code").addClass('is-invalid').siblings('p').addClass('invalid-feedback').html(errors['code']);
						} else {
							$("#code").removeClass('is-invalid').siblings('p').removeClass('invalid-feedback').html("");
						}

						if(errors["discount_amount"]){
							$("#discount_amount").addClass('is-invalid').siblings('p').addClass('invalid-feedback').html(errors['discount_amount']);
						} else {
							$("#discount_amount").removeClass('is-invalid').siblings('p').removeClass('invalid-feedback').html("");
						}

						if(errors["starts_at"]){
							$("#starts_at").addClass('is-invalid').siblings('p').addClass('invalid-feedback').html(errors['starts_at']);
						} else {
							$("#starts_at").removeClass('is-invalid').siblings('p').removeClass('invalid-feedback').html("");
						}

						if(errors["expires_at"]){
							$("#expires_at").addClass('is-invalid').siblings('p').addClass('invalid-feedback').html(errors['expires_at']);
						} else {
							$("#expires_at").removeClass('is-invalid').siblings('p').removeClass('invalid-feedback').html("");
						}

					}

				}, error: function(jqXHR, exception){
					console.log("Something Went Wrong");
				}
			});
		});

	</script>

@endsection