@extends('backend.layouts.app')

@section('content')

 <style type="text/css">

  .showhide {  
   display:none;
 }
 .row{margin-top:10px;}
</style>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

  
  <div class="row new_member" id="ajaxmaterialdisplayform">
<div class="col-md-12">
<div class="box">

  <div class="container">
    <h2>Add New Coupon</h2>
    <form class="form-horizontal" method="POST" action="">
      {{ csrf_field() }}

      <div class="row">
       
      <div class="col-md-12{{ $errors->has('coupon_name') ? ' has-error' : '' }}">
        <label class="control-label" for="coupon_name" ><p>Coupon Name *</p></label>

       
          <input type="text" class="form-control" value="{{ old('coupon_name') }}" id="coupon_name" name="coupon_name" required autofocus >

          @if ($errors->has('coupon_name'))
          <span class="help-block">
            <strong>{{ $errors->first('coupon_name') }}</strong>
          </span>
          @endif
       
     
    </div>
    </div>
   <div class="row">
      <div class="col-md-12">
        <label class="control-label" for="code"><p>Code *</p></label>
                 
          <input type="text" class="form-control" id="coupon_code" name="coupon_code" required autofocus>
           @if ($errors->has('coupon_code'))
          <span class="help-block">
            <strong>{{ $errors->first('coupon_code') }}</strong>
          </span>
          @endif
        </div>
      </div>
    <br />
    
<div class="row">
     <div class="col-md-12">        
       
         
             <input type="checkbox" name="one_time" checked="checked" class="checkbox">&nbsp;One Time Use
         
        </div>
      </div>
  
<div class="row">
  
        <div class="col-md-12">
        <label class="control-label" for="code">Eligible Programs...</label>
        </div>

</div><br />

<div class="row">
      <div class="col-md-12">
        
          <label><input type="radio" name="all_programs" value="1" onclick="show1();" />All Programs</label>
          <label><input type="radio" name="all_programs" value="0"  onclick="show2();" checked />Select Programs </label>
          
        </div>
      </div>
      

      <div class="row">
     
      <div class="col-md-12{{ $errors->has('coupon_eligible_program[]') ? ' has-error' : '' }}" id="autoUpdate"  >

          <select name="coupon_eligible_program[]" id="classes" class="form-control" multiple="multiple"  autofocus>
            @foreach($classes as $key => $class)
            <option value="{{ $class }}">{{ $class }}</option>
            @endforeach
          </select>

          @if ($errors->has('coupon_eligible_program[]'))
          <span class="help-block">
            <strong>{{ $errors->first('coupon_eligible_program[]') }}</strong>
          </span>
          @endif
        
      </div>
    </div>
 

<div class="row">
  <div class="col-md-12">
  <label class="control-label" for="code">Amount *</label>  
  </div>
</div><br />
<div class="row">

  <div class="col-md-3">
          
     
           <label> <input type="radio" class="radiobtn" name="Radio" id="Radio" value="1" checked>  Fixed</label>
            <label><input class="radiobtn" type="radio" name="Radio" id="Radio" value="2" >  Percentage</label>

             
        
  

  </div>
<div class="row">
    <div class="col-md-4{{ $errors->has('coupon_amount') ? ' has-error' : '' }}"">

    <div id="Amount"  style="display:none">
    <div class="input-group">
 <span class="input-group-addon">$</span>
  <input type="text" class="form-control" value="{{ old('coupon_amount') }}" id="coupon_amount" name="coupon_amount" placeholder="Amount" autofocus aria-label="Amount (to the nearest dollar)">
  <span class="input-group-addon">.00</span>
   @if ($errors->has('coupon_amount'))
            <span class="help-block">
              <strong>{{ $errors->first('coupon_amount') }}</strong>
            </span>
            @endif
</div>
</div>


<div id="Percentage" style="display:none">
<div class="input-group">
  <span class="input-group-addon">%</span>
  <input type="text" class="form-control" value="{{ old('coupon_amount') }}" id="coupon_amount" name="coupon_amount" placeholder="Amount"  aria-label="Percentage (to the nearest Percentage)">
  <span class="input-group-addon"></span>
   @if ($errors->has('coupon_amount'))
            <span class="help-block">
              <strong>{{ $errors->first('coupon_amount') }}</strong>
            </span>
            @endif
</div>
</div>
</div> 
<div class="col-md-5">
</div>
</div>
      &nbsp;

 <div class="row">
      <div class="col-md-12">
        <label class="control-label" for="code">Applies to</label>        

            <select class="dropdown-toggle" name="applies" type="select" data-toggle="dropdown">
              @foreach($applies_to as $applies)
              <option value="{{$applies->apply}}" >{{$applies->apply}}</option>
              @endforeach

              <span class="caret"></span></select>
        </div>
      </div>
      
    <div class="row">
  <div class="col-md-12">
       
          <label class="control-label" for="code">Usage</label>        
         
              <select class="dropdown-toggle" type="select" name="usage" data-toggle="dropdown">
                @foreach($usage as $usages)
                <option value="{{ $usages->usage}}" >{{ $usages->usage}}</option>
                @endforeach
                <span class="caret"></span></select>
         
        </div>
      </div>

           <div class="row">
              
          <div class="col-md-6{{ $errors->has('start_date') ? ' has-error' : '' }}">
        <label for="start_date" class="control-label">Start Date *</label>

       
          <input type="date" class="form-control" value="{{ old('start_date') }}" id="start_date" name="start_date" required autofocus>

          @if ($errors->has('start_date'))
          <span class="help-block">
            <strong>{{ $errors->first('start_date') }}</strong>
          </span>
          @endif
       
      </div>
    
       <div class="col-md-6{{ $errors->has('end_date') ? ' has-error' : '' }}">
        <label for="end_date" class="control-label">Expiry Date *</label>

       
          <input type="date" class="form-control" value="{{ old('end_date') }}" id="end_date" name="end_date" required autofocus>
       
          @if ($errors->has('end_date'))
          <span class="help-block">
            <strong>{{ $errors->first('end_date') }}</strong>
          </span>
          @endif
        </div>
      
       
</div>

 <br />

         <div class="row">

<div class="col-md-6">
      
            
 <a href="{{ url('coupons')}}" type="button"  style="color:#50A4D7;" class="cancle-btn">Cancel</a>
            
          </div>


<div class="col-md-6">
        
            
              <button type="submit" class="btn btn-primary">Save</button>
           
          </div>
    
      
    
    </div>
        </form>
</div>

 </div>
</div>
</div>
    
     
      <script>
        $(document).ready(function(){
          $('#classes').select2({
            placeholder : 'Select Programms',
            tags: true
          });
        });
      </script>


      <script>

        function show1(){
          document.getElementById('autoUpdate').style.display ='none';
        }
        function show2(){
          document.getElementById('autoUpdate').style.display = 'block';
        }

      </script>

      <script>

        function showOne(){
          document.getElementById('autoOne').style.display ='none';
        }
        function showTwo(){
          document.getElementById('autoTwo').style.display = 'none';
        }

      </script>

    

      <script type="text/javascript">
        $('input[type="radio"]').click(function(){
          if($(this).attr("value")=="1"){
            $("#Amount").show('slow');
            $("#Percentage").hide('slow');
          }
          if($(this).attr("value")=="2"){
            $("#Amount").hide('slow');
            $("#Percentage").show('slow');

          }        
        });
        $('input[type="radio"]').trigger('click');
      </script>

@stop