@extends('layouts/pos_layout')
@section('title', '| Special Incentive Date Configuration List')
@section('content')
@include('successMsg')

<div class="row">
<div class="col-md-12">
<div class="" style="">
    <div class="">
      <div class="panel panel-default" style="background-color:#708090;">
        <div class="panel-heading" style="padding-bottom:0px">
          <h1 align="center" style="font-family: Antiqua;letter-spacing: 2px"><font color="white">SPECIAL INCENTIVE DATE CONFIGURATION LIST</font></h1>
        </div>
        <div class="panel-body panelBodyView">
        <div>
          <script type="text/javascript">
          jQuery(document).ready(function($)
          {

            $("#proGroupView").dataTable().yadcf([

            ]);
          });
          </script>
        </div>
          <table class="table table-striped table-bordered" id="proGroupView">
            <thead>
                <tr>
                    <th width="30">SL#</th>
                    <th>Title</th>
                    <th>Valid Month</th>
                    <th>Action</th>
                </tr>
                  {{ csrf_field() }}
                </thead>
                <tbody id="tableBodySection">
                                    @if(!empty($isSpecialIncentiveMonthConfig))
                    @foreach($isSpecialIncentiveMonthConfig as $incentiveConfig)
                      <tr class="item{{$incentiveConfig->id}}">
                        <td class="text-center slNo">{{++$no}}</td>
                        <td class="text-center">{{$incentiveConfig->title}}</td>
                        <td class="text-center">{{ date('F Y', strtotime($incentiveConfig->content)) }}</td>
                        <td class="text-center" width="80">
                            <a id="editIcone" href="javascript:;" class="edit-modal" data-target="#edit-modal"
                                data-id="{{ $incentiveConfig->id }}" data-title="{{ $incentiveConfig->title }}"
                                data-validmonth="{{ date('Y-m-01',strtotime($incentiveConfig->content)) }}"
                                data-validmonthreplica="{{ date('F Y',strtotime($incentiveConfig->content)) }}">
                                <span class="glyphicon glyphicon-edit"></span>
                            </a>&nbsp;
                        </td>
                      </tr>
                    @endforeach
                  @endif
                </tbody>
          </table>
        </div>
      </div>
  </div>
  </div>
</div>
</div>

{{-- Modal Start --}}
    <div id="myModal" class="modal fade" style="margin-top:3%">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header">
                    <h4 class="modal-title" style="clear:both"></h4>
                </div>

                {{-- Modal Body Start --}}
                <div class="modal-body">

                    {!! Form::open([
                        'url' => 'editSpecialIncentiveDateItem',
                        'enctype' => 'multipart/form-data',
                        'role' => 'form',
                        'class' => 'form-horizontal form-groups',
                    ]) !!}

                    <div class="form-group hidden">
                        {!! Form::label('id', 'ID:', ['class' => 'col-sm-2 control-label']) !!}
                        <div class="col-sm-10">
                            {!! Form::text('id', $value = null, ['class' => 'form-control', 'id' => 'id', 'type' => 'text', 'readonly']) !!}
                            {!! Form::text('slno', $value = null, ['class' => 'form-control', 'id' => 'slno', 'type' => 'text', 'readonly']) !!}
                        </div>
                    </div>

                    <div class="form-group">
                        {!! Form::label('title', 'Title:', ['class' => 'col-sm-2 control-label']) !!}
                        <div class="col-sm-10">
                            {!! Form::text('title', $value = null, [
                                'class' => 'form-control',
                                'id' => 'title',
                                'type' => 'text',
                                'placeholder' => 'Enter Company title',
                            ]) !!}
                            <p id='titlee' style="max-height:3px;"></p>
                        </div>
                    </div>

                    {{-- company type --}}
                    <div class="form-group">
                        {!! Form::label('validMonth', 'Valid Month:', ['class' => 'col-sm-2 control-label']) !!}
                        <div class="col-sm-10">
                            {!! Form::text('validMonthReplica',null,['id'=>'validMonthReplica','placeholder'=>'From','class'=>'form-control input-sm','readonly','style'=>'cursor:pointer']) !!}
                            {!! Form::hidden('validMonth',null,['id'=>'validMonth']) !!}
                            {{-- {!! Form::text('validMonth', $value = null, ['class' => 'form-control', 'id' => 'validMonth', 'type' => 'text', 'placeholder' => 'Enter Valid Month:']) !!} --}}
                            <p id='validMonthe' style="max-height:3px;"></p>
                        </div>
                    </div>

                    <div class="Updatesuccessmsg" style="clear:both" id="forSubmit">
                        <p id="MSGE" class="pull-left" style="color:red"></p>
                        <p id="MSGS" class="pull-left" style="color:green"></p>
                        <p class="pull-right">
                            {!! Form::submit('Update', ['class' => 'btn actionBtn']) !!}
                            {!! Form::button('<span id=""> Close</span>', [
                                'class' => 'btn btn-warning',
                                'data-dismiss' => 'modal',
                                'id' => 'footer_action_button_dismis',
                            ]) !!}
                        </p>
                    </div>

                    {!! Form::close() !!}
                </div>
                {{-- Modal Body End --}}


            </div>
        </div>
    </div>
    {{-- Modal End --}}

@include('dataTableScript')
@endsection

<script src="{{asset('js/jquery-1.11.1.min.js')}}"></script>
  <script type="text/javascript">
  $( document ).ready(function() {

    $("#validMonthReplica").datepicker({
        dateFormat: 'MM yy',
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
         onClose: function() {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            $(this).val($.datepicker.formatDate('MM yy', new Date(year, month, 1)));
            $("#validMonth").val($.datepicker.formatDate('dd-mm-yy', new Date(year, month, 1)));
            $("#validMonthe").hide();
        }
    });

    $("#validMonthReplica").focus(function () {
        $(".ui-datepicker-calendar").hide();
        $("#ui-datepicker-div").position({
            my: "center top",
            at: "center bottom",
            of: $(this)
        });
    });
    /////////////

    $(document).on('click', '.edit-modal', function() {
        //alert($(this).data('branchcode'));
        $('.errormsg').empty();
        $('#MSGE').empty();
        $('#MSGS').empty();
        $('#footer_action_button').text(" Update");
        $('#footer_action_button').addClass('glyphicon glyphicon-check');
        $('#footer_action_button_dismis').text(" Close");
        $('#footer_action_button_dismis').addClass('glyphicon glyphicon-remove');
        $('.actionBtn').addClass('btn-success');
        $('.actionBtn').removeClass('btn-danger');
        $('.actionBtn').addClass('edit');
        $('.modal-title').text('Update Data');
        $('.modal-header').css({"background-color":"black", "color":"white", "padding":"10px"});
        $('.modal-dialog').css('width','70%');
        $('.deleteContent').hide();
        $('.form-horizontal').show();
        $('#id').val($(this).data('id'));
        $('#slno').val($(this).data('slno'));
        $('#title').val($(this).data('title'));
        $('#validMonthReplica').val($(this).data('validmonthreplica'));
        $('#validMonth').val($(this).data('validmonth'));
        $('#footer_action_button2').hide();
        $('#footer_action_button').show();
        $('.actionBtn').removeClass('delete');
        $('#myModal').modal('show');
    });

    $('form').submit(function(event) {
            event.preventDefault();
            var formData = new FormData($(this)[0]);
            $.ajax({
                type: 'post',
                url: './editSpecialIncentiveDateItem',
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                dataType: 'json',
                success: function(data) {
                    if (data.errors) {
                        if (data.errors['title']) {
                            $('#titlee').empty();
                            $('#titlee').append(
                                '<span class="errormsg" style="color:red;">' + data
                                .errors.title + '</span>');
                            return false;
                        }
                        if (data.errors['validMonth']) {
                            $('#validMonthe').empty();
                            $('#validMonthe').append(
                                '<span class="errormsg" style="color:red;">' + data
                                .errors.validMonth + '</span>');
                            return false;
                        }
                    } else {
                        $('#MSGE').addClass("hidden");
                        $('#MSGS').text('Data successfully updated!');
                        $('#myModal').modal('hide');
                        $('.succsMsg').removeClass('hidden');
                        $('.succsMsg').show();
                        setTimeout(function() {
                            location.reload();
                            $('.succsMsg').hide();
                        }, 1500);
                    }

                    $("#title").val('');
                    $("#validMonth").val('');
                    $("#validMonthReplica").val('');
                },
                error: function(data) {
                    //alert('error');
                }
            });

        });

});//ready function end
</script>