@extends('layouts/acc_layout')
@section('title', '| Vehicle Allowance Auto Voucher Approval Steps')
@section('content')
@include('successMsg')


<div class="row add-data-form">
    <div class="col-md-12">
        <div class="col-md-1"></div>
        <div class="col-md-10 fullbody">
            <div class="viewTitle" style="border-bottom: 1px solid white;">
                {{-- <a href="{{url('bankAcRegister/bankAcRegisterListFiltering/')}}" class="btn btn-info pull-right addViewBtn"><i class="glyphicon glyphicon-th-list viewIcon">
                    </i>View Bnak Account List</a> --}}
            </div>
            <div class="panel panel-default panel-border">
                <div class="panel-heading">
                    <div class="panel-title">Vehicle Allowance Auto Voucher Approval Steps</div>
                </div>
                {!! Form::open(array('url' => '#', 'role' => 'form', 'class'=>'form-horizontal form-groups')) !!}
                
                <div class="panel-body">
                    <div class="row">  

                        <table class="table table-bordered table-striped table-condensed">

                            <thead>
                                <th style="width: 5%;">Step</th>
                                <th>Designation</th>
                                <th style="width: 11%;">Action</th>
                            </thead>

                            <tbody class="appendStepsTr" id="dynamic_field">
                                <tr class="toClone">
                                    
                                    @if(!$approvalSteps->isEmpty())
                                    
                                        @foreach ($approvalSteps as $step)
                                            <tr class="toClone">
                                                <td class="tdSl">
                                                    {{ ++$no }}
                                                </td>
                                                <td>
                                                    <select class="form-control signatory" name="signatory[]">
                                                        <option value="">Select Designation</option>
                                                        @foreach ($designations as $designation)
                                                            <option value="{{ $designation->id }}" {{ $step->designationId == $designation->id ? 'selected' : '' }}> {{ $designation->name }} </option>
                                                        @endforeach
                                                    </select>
                                                </td>
                                                <td>
                                                    <button type="button" name="add" class="btn btn-success btn_add" style="background-color: #28A745;">+</button>
                                                    <button type="button" name="remove" class="btn btn-danger btn_remove" style="background-color: #AB2D32">x</button>
                                                </td>
                                            </tr>
                                        @endforeach

                                    @else

                                        <tr class="toClone">
                                                                                        <td class="tdSl">
                                                {{ ++$no }}
                                            </td>
        
                                            <td>
                                                <select class="form-control signatory" name="signatory[]">
                                                    <option value="">Select Designation</option>
                                                    @foreach ($designations as $designation)
                                                        <option value="{{ $designation->id }}">{{ $designation->name }}</option>
                                                    @endforeach
                                                </select>                                        
                                            </td>
        
                                            <td>
                                                <button type="button" name="add" class="btn btn-success btn_add" style="background-color: #28A745;">+</button>
                                                <button type="button" name="remove" class="btn btn-danger btn_remove" style="background-color: #AB2D32">x</button>
                                            </td>
                                        </tr>

                                    @endif


                                </tr>
                                
                            </tbody>

                        </table><br><br>


                        <div class="form-group">
                            {!! Form::label('submit', ' ', ['class' => 'col-sm-5 control-label']) !!}
                            <div class="col-sm-5">
                                {!! Form::submit('Save', ['id' => 'submit', 'class' => 'btn btn-info']) !!}
                                <a href="{{ url('bankAcRegister/bankAcRegisterListFiltering') }}"
                                    class="btn btn-danger closeBtn">Close</a>
                                <span id="success" style="color:green; font-size:20px;" class="pull-right"></span>
                            </div>
                        </div> 
                        
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
    <div class="col-md-2"></div>
</div>
</div>
</div>



<script>

    $(document).ready(function(){

        $("#effectiveDate").datepicker({
            changeMonth: true,
            changeYear: true,
            dateFormat: 'dd-mm-yy',
        });


        var i = 0;
        var abc = $('.toClone');

        $('#dynamic_field').on('click', '.btn_add', function(){
            var clonedRow = $('.toClone:last').clone();
            clonedRow.find("input[type='text']").val("");
            clonedRow.find('select.signatory').val(''); // Clear the selected signatory
            clonedRow.insertAfter($(this).closest('.toClone'));
            setSerialNumber();
        }); 

        $('#dynamic_field').on('click', '.btn_remove', function(){
            var rows = $('.toClone');
            if (rows.length > 2) {
                $(this).closest('.toClone').remove();
                setSerialNumber();
            } else {
                // Clear the data in the last row
                $(this).closest('.toClone').find("input[type='text']").val("");
                $(this).closest('.toClone').find('select.signatory').val('');
            }
        }); 

        function setSerialNumber() {
            $('.toClone').each(function(index) {
                var $i = index;
                $(this).find('.tdSl').text($i);
            });
        }

        // Get all selected employee IDs in the 'signatory[]' array format
        function getSelectedEmployeeIds() {
            var employeeIds = [];
            $('select.signatory').each(function() {
                var selectedId = $(this).val();
                if (selectedId != '' && selectedId != 'Select Signatory') {
                    employeeIds.push(selectedId);
                }
            });
            return employeeIds;
        }


        $('form').submit(function(event) {
            event.preventDefault();
            $.ajax({
                type: 'post',
                url: "{{ url('storeVehicleAllowanceApprovalStepConfig/') }}",
                data: $('form').serialize(),
                dataType: 'json',
                success: function(data) {
                    if (data.errors) {
                        
                    } else {
                        if(data.responseTitle == "Success!"){
                            toastr.success(data.responseText, data.responseTitle, opts);
                            setTimeout(function(){
                                // window.location.href ="{{ url('bankAcRegister/bankAcRegisterListFiltering/') }}";
                                location.reload();
                            }, 2000);
                        }else{
                            toastr.warning(data.responseText, data.responseTitle, opts);
                        }
                    }
                },
                error: function( _response ){
                    // Handle error
                    alert(_response.errors);
                }
            });
        });

        
    });

    

</script>


@endsection