{% extends app.request.get('instance_id') > 0 and app.request.get('iframe') != 1 ? "::adminBaseAjax.html.twig" : app.request.get('project_setting').instance_theme_path~":AdminTheme:base.html.twig" %}

{% block breadcrumb %}
	<li><a href="{{ path('office_brain_page_admin_promotion_discount_management') }}">{{ 'admin.sidebar_menu.promotiona_n_discount.title'|trans({}, 'admin') }}</a> / </li>
    <li><a href="{{ path('office_brain_servicegroupbundle_promocouponadmin_list') }}">{{ "service_group.admin.list.page.coupon_page_title"|trans }}</a> / </li>
    <li>{{ "service_group.admin.form.page.coupon_page_add_title"|trans }}</li>
{% endblock breadcrumb %}

{% block main_page_title %}
    <i class="fa fa-file-text"></i>
    {% block form_title %}
        {{ "service_group.admin.form.page.coupon_page_add_title"|trans }}
    {% endblock form_title %}
{% endblock main_page_title %}

{% block ajax_body %}
    {% block main_content %}
    
        <div class="ui-table-block col-lg-12 col-md-12 col-xs-12">
            <div class="ui-content-block">
                {% block form_start %}
                    {{ form_start(form, {'action':path('office_brain_servicegroupbundle_promocouponadmin_processpageadd', {'instance_id' : app.request.get('instance_id')}), 'attr':{ 'id':'promo_coupon_add', 'method':'post', 'class': 'promo_coupon_edit data-form js-add-edit-form', 'novalidate' : 'novalidate' }}) }}
                {% endblock form_start %}
                <div class="form-group add-banner-tab-block">
                    {{ form_label(form.couponName, 'promo_coupon.coupon_name'|trans({},'app')) }} <span class="red">*</span>
                    {{ form_widget(form.couponName, { 'attr':{'class':'form-control', 'placeholder':'promo_coupon.coupon_name'|trans({},'app'), 'data-placement':'right'}}) }}
                    {{ form_errors(form.couponName) }}
                </div>
                
                <div class="form-group add-banner-tab-block">
                    {{ form_label(form.couponType, 'promo_coupon.coupon_type'|trans({},'app')) }} <span class="red">*</span>
                    {{ form_widget(form.couponType, { 'attr':{'class':'form-control js-discount-box', 'placeholder':'promo_coupon.coupon_type'|trans({},'app'), 'data-placement':'right'}}) }}
                    {{ form_errors(form.couponType) }}
                </div>
                
                <div class="form-group add-banner-tab-block js-input-discount hidden">
                    {{ form_label(form.discount, 'promo_coupon.discount'|trans) }} <span class="red">*</span>
                    {{ form_widget(form.discount, { 'attr':{'class':'form-control js-discount-input', 'placeholder':'promo_coupon.discount'|trans, 'data-placement':'right'}}) }}
                    {{ form_errors(form.discount) }}
                </div>
                
                <div class="form-group add-banner-tab-block">
                	<div class="row">
                		<div class="col-lg-2 col-md-6 col-xs-6">
                			{{ form_label(form.startDate, 'promo_coupon.start_date'|trans({},'app')) }} <span class="red">*</span>
		                    <div class="input-append date input-group date-block" id="datetimepicker1">
								{{ form_widget(form.startDate, { 'attr':{'class':'form-control',  'data-format':'yyyy-MM-dd', 'placeholder':'promo_coupon.start_date'|trans({},'app'), 'data-placement':'right'}}) }}
		                    	<span class="add-on input-group-addon datepicker-color">
		                        	<i class="fa-calendar fa"></i>
		                        </span>
		                    </div>
		                    {{ form_errors(form.startDate) }}
                		</div>
                		<div class="col-lg-2 col-md-6 col-xs-6">
                			{{ form_label(form.endDate, 'promo_coupon.end_date'|trans({},'app')) }} <span class="red">*</span>
		                    <div class="input-append date input-group date-block" id="datetimepicker2">
		                    	{{ form_widget(form.endDate, { 'attr':{'class':'form-control','data-format':'yyyy-MM-dd', 'placeholder':'promo_coupon.end_date'|trans({},'app'), 'data-placement':'right'}}) }}
		                    	<span class="add-on input-group-addon datepicker-color">
		                        	<i class="fa-calendar fa"></i>
		                        </span>
		                    </div>
		                    {{ form_errors(form.endDate) }}
                		</div>
                	</div>
                    
                </div>
              
                <div class="form-group{% block page_status %}{% endblock page_status %}" style="display: none;">
                    {{ form_label(form.status, 'service_group.admin.form.page.label.status'|trans) }} <span class="red" title='admin.form.field.required'|trans>*</span><em>{{ 'service_group.admin.form.page.label.status_eg'|trans }}</em>
                    {{ form_widget(form.status, { 'attr':{'class':'form-control form-control-tool-tip', 'title':'service_group.admin.form.page.tooltip.status'|trans, 'placeholder':'', 'data-placement':'right'}}) }}
                    {{ form_errors(form.status) }}
                </div>

                {{ form_rest(form, {'attr' :{'class' :'hidden'}})  }}
                {% block form_btn_block %}
                    <div>
                        <div class="btn-block">
                            <button type="{{ app.request.get('instance_id') > 0 ?'button':'submit' }}" data-method="POST" data-routetype="processpageadd" data-route = "office_brain_servicegroupbundle_promocouponadmin_processpageadd" class="customize-btn {{ app.request.get('instance_id') > 0 ?'js-column-action':'' }}">{{ 'service_group.admin.form.page.label.save'|trans }}</button>
                            <input type="reset" class="reset_coupon_errors customize-btn" value="{{ 'service_group.admin.form.page.label.reset'|trans }}"/>
                        </div>
                    </div>
                {% endblock form_btn_block %}
                {{ form_end(form) }}
            </div>
        </div>
    {% endblock main_content %}

{% endblock ajax_body %}

{% block footer_js %}
	{{ parent() }}
	<script type="text/javascript">
		$(document).ready(function () {
			change_discount_box();
			
			var date = new Date();
		    date.setDate(date.getDate());

		    $('#datetimepicker1').datetimepicker({
		        pickTime: false,
		        startDate: date
		    });

		    $('#datetimepicker2').datetimepicker({
		        pickTime: false,
		        startDate: date
		    }); 
		});
	
		$(document).on('change', '.js-discount-box', function () {
			change_discount_box();  
		});
	
		function change_discount_box() {
			var discountTypes = ['eqp_discount_flat','eqp_discount_percent','discount_flat','discount_percent'];
			var couponType = $('.js-discount-box').val();
			var discountVal = $('.js-discount-input').val();
			
			if($.inArray(couponType, discountTypes) !== -1)
			{
				$('.js-input-discount').removeClass('hidden');
				if(discountVal != '')
				{
					$('.js-discount-input').val(discountVal);
				} 
			}
			else
			{
				$('.js-input-discount').addClass('hidden');
				$('.js-discount-input').val(''); 
			}
		}

		$(".reset_coupon_errors").click(function() {
			$(".js-add-edit-form ul").html('');
		});
	</script>
{% endblock footer_js %}