@extends('layouts.backend')
@section('title', '| coupons Edit')

@section('content')
<div class="col-md-12">
	@if($errors->any())
		<div class="alert alert-danger">
			@foreach ($errors->all() as $error)
				{{ $error }} <br>
			@endforeach
		</div>
	@endif
</div>
<div class="col-md-12 margin-tb">
  <div class="card">
      <div class="card-header">
      <h3 class="card-title">Edit Coupons</h3>
          <div class="card-tools">
              <div class="pull-right">
                <a class="btn-sm btn-success mx-1" href="{{ route('coupons.index') }}"> Back </a>
				<a class="btn-sm btn-success" href="{{ route('coupons.create') }}"> New </a>
              </div>
          </div>
      </div>
	  <div class="card-body table-responsive">

	{{ Form::model($coupon, array('route' => array('coupons.update', $coupon->id), 'method' => 'PUT')) }}


    <div class="form-group">
        {!! Form::label('code', 'Coupon Code') !!}
        {!! Form::text('code', null, ['class' => 'form-control', 'readonly' => 'readonly']) !!}
    </div>
    <div class="form-group">
        {!! Form::label('start_date', 'Start Date') !!}
		{!! Form::date('start_date', null, ['class' => 'form-control', 'required' => 'required', 'min' => now()->toDateString()]) !!}
    </div>
    <div class="form-group">
        {!! Form::label('expiry_date', 'Expiry Date') !!}
        {!! Form::date('expiry_date', null, ['class' => 'form-control', 'required' => 'required', 'min' => now()->toDateString()]) !!}
    </div>

    {{-- <div class="form-group">
        {!! Form::label('user_limit', 'User Limit') !!}
        <span style="font-size: 0.85em; color: #6c757d;">(Maximum number of users allowed)</span>
        {!! Form::number('user_limit', null, ['class' => 'form-control', 'required' => 'required', 'min' => '1']) !!}
    </div> --}}

    <div class="form-group">
        {!! Form::label('user_limit', 'User Limit') !!}
        <span style="font-size: 0.85em; color: #6c757d;">(Maximum number of users allowed)</span>
    
        <!-- Dropdown for user limit selection -->
        {!! Form::select('user_limit_type', ['limited' => 'Limited', 'unlimited' => 'Unlimited'],  $coupon->user_limit_type ?? 'limited', ['class' => 'form-control', 'id' => 'user_limit_type']) !!}
    
        <!-- User limit input field -->
        <div id="user_limit_input_div" class="mt-3">
            {!! Form::number('user_limit', null, ['class' => 'form-control', 'min' => '1', 'id' => 'user_limit', 'required' => 'required', 'placeholder' => 'Enter maximum user limit']) !!}
        </div>
    </div>
    

    <div class="form-group">
        {!! Form::label('usage_limit', 'Usage Limit') !!}
        <span style="font-size: 0.85em; color: #6c757d;">(How many times a single user can use this code)</span>
        {!! Form::number('usage_limit', null, ['class' => 'form-control', 'required' => 'required', 'min' => '1','readonly' => 'readonly']) !!}
    </div>


    <div class="mt-3">
        {!! Form::label('discount_amount', 'Discount Amount') !!}
        <div class="input-group mb-3">
            <div class="input-group-prepend">
            <span class="input-group-text">$</span>
            </div>
            {!! Form::number('discount_amount', null, ['class' => 'form-control', 'required' => 'required', 'step' => '0.01', 'readonly' => 'readonly']) !!}
            <div class="input-group-append">
            </div>
        </div>
    </div>

    <div class="form-group">
        {!! Form::label('status', 'Status') !!}
        {!! Form::select('status', ['active' => 'Active', 'inactive' => 'Inactive'], null, ['class' => 'form-control']) !!}
    </div>


		{{ Form::submit('Update', array('class' => 'btn btn-primary')) }}

	{{ Form::close() }}
	    </div>
      <!-- /.card-body -->
  </div>
</div>
<script>
    document.addEventListener('DOMContentLoaded', function () {
        // Get elements
        const userLimitTypeSelect = document.getElementById('user_limit_type');
        const userLimitInputDiv = document.getElementById('user_limit_input_div');
        const userLimitInput = document.getElementById('user_limit');
        
        // Function to toggle input visibility based on selected limit type
        function toggleUserLimitInput() {
            if (userLimitTypeSelect.value === 'unlimited') {
                userLimitInputDiv.style.display = 'none';  // Hide the input
                userLimitInput.removeAttribute('required'); // Remove required attribute
                if (userLimitInput.value === '999999') {
                    userLimitInput.value = '';
                }
            } else {
                userLimitInputDiv.style.display = 'block'; // Show the input
                userLimitInput.setAttribute('required', 'required'); // Ensure it's required again
            }
        }

        // Initial toggle on page load
        toggleUserLimitInput();

        // Add change event listener to the dropdown
        userLimitTypeSelect.addEventListener('change', toggleUserLimitInput);
    });
</script>
@stop