@extends('layouts.app_discussion')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-3">
            @include('includes/dashboard/left_menu')
        </div>
      
        <div class="col-md-9 h-100">
            <div class="wrapper wrapper-content animated fadeInRight" style="min-height: 625px">
                <div class="ibox-content forum-container h-100">
                    <div class="col-lg-12">
                        <div class="forum-title">
                            <h3 class="text-primary">{{ config('tools.A5')}}</h3>
                            {{ Breadcrumbs::render('tools.seniorLeaderShipAlignment.index' ) }}
                            @include('tools.senior_leadership_alignment.tab')
                            @if(collect(request()->segments())->last() == 'level-2' && $data->count() !== 0 )
                                @include('tools.senior_leadership_alignment.level2_list')
                            @endif
                            @if(collect(request()->segments())->last() == 'add-ogsm' || $data->count() == 0)
                                @include('tools.senior_leadership_alignment.level2_add_form')
                            @endif
                            @if(collect(request()->segments())->last() == 'edit-ogsm')
                                @include('tools.senior_leadership_alignment.level2_edit_form')
                            @endif 
                        </div>
                    </div>  
                </div>
            </div>                 
        </div>
    </div>
</div>
{{-- MODAL POPUP OBJECTIVES --}}
<div class="modal" id="hrBusinessAlignmentOgsmModal" tabindex="-1" aria-labelledby="hrBusinessAlignmentOgsmModal" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered  modal-lg">
        <div class="modal-content">
            <div class="modal-body" id="hrBusinessAlignmentOgsmModalBody">
               
            </div>
        </div>
    </div>
</div>
{{-- MODAL POPUP STRATEGIES --}}
<div class="modal" id="strategiesModal" tabindex="-1" aria-labelledby="strategiesModal" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-body" id="strategiesModalBody">
                <div class="modal-header px-0">
                    <h5 class="modal-title text-primary">Objectives/Goals</h5>
                    <button type="button" class="btn-close" onclick="location.reload()" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body" id="strategiesModalFormBody">
                   
                </div>
            </div>
        </div>
    </div>
</div>
@include('includes.confirmation_popup')
@endsection

<script src="{{ asset('assets/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('assets/js/jquery.min.js') }}"></script>

<script>
    var APP_URL  = "{{ url('')}}";
    $(document).ready(function() {

        $(document).on("click", "#edit-ogsm-title", function (e) {
            var id = $(this).attr('data-id');
            getOgsmTitleForm(id);
        });

        $(document).on("click", "#edit-ogsm-leader", function (e) {
            var id = $(this).attr('data-id');
            getOgsmLeaderForm(id);
        });
        
        $(document).on("click", "#saveDepartmentData", function (e) {
            var _this = $(this)
            $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden"></span> Save')
            let formData =$('#departmentForm').serialize();
            console.log(formData);
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: APP_URL + "/tools/senior-leadership-alignment/save-department",
                data: formData,
                type: "post",
                dataType: 'json',
                success: function(result) {
                    window.location.href = APP_URL+'/tools/senior-leadership-alignment/level-2/edit-ogsm?id='+result.data.id
                },
                error:function (response){
                    $(_this).html('Save');
                    $('.is-invalid').removeClass('is-invalid');
                    $('.invalid-feedback').remove();
                    var obj = response.responseJSON.json;
                    $.each(obj, function(key,value) {
                        var key = key.split('.').join("");
                        $('#'+key).addClass('is-invalid');
                        $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                    });
                },
            }); 
        });

        $(document).on("click", "#ogsmTitleUpdate", function (e) {
            $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden"></span>Save')
            var title = $('#title').val();         
            var id = $(this).attr('data-id');         
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: APP_URL + "/tools/senior-leadership-alignment/update-ogsm-title",
                data: {title: title, id:id},
                type: "post",
                dataType: 'json',
                success: function(result) {
                    location.reload();
                },
                error:function (response){
                    $('.is-invalid').removeClass('is-invalid');
                    $('.invalid-feedback').remove();
                    var obj = response.responseJSON.json;
                    $.each(obj, function(key,value) {
                        var key = key.split('.').join("");
                        $('#'+key).addClass('is-invalid');
                        $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                    });
                },
            });  
        });

        $(document).on("click", "#ogsmLeaderUpdate", function (e) {
            $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden"></span>Save')
            var leader = $('#leader').val();         
            var id = $(this).attr('data-id');     
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: APP_URL + "/tools/senior-leadership-alignment/update-ogsm-leader",
                data: {leader: leader, id:id},
                type: "post",
                dataType: 'json',
                success: function(result) {
                    location.reload();
                },
                error:function (response){
                    $('.is-invalid').removeClass('is-invalid');
                    $('.invalid-feedback').remove();
                    var obj = response.responseJSON.json;
                    $.each(obj, function(key,value) {
                        var key = key.split('.').join("");
                        $('#'+key).addClass('is-invalid');
                        $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                    });
                },
            });  
        });


        $(document).on("click", ".addObjectives", function (e) {
            var senior_leadership_alignment_id = $(this).attr('senior_leadership_alignment_id');
            getObjectiveForm(senior_leadership_alignment_id);
        });

        $(document).on("click", ".addStrategy", function (e) {
            var objectives_id = $(this).attr('objectives-id');
            getStrategyeForm(objectives_id);
        });

        $(document).on("click", ".updateObjectives", function (e) {
            var objectives_id = $(this).attr('objectives-id');
            getUpdateObjectivesForm(objectives_id);
        });
        $(document).on("click", ".updateStrategy", function (e) {
            var strategy_id = $(this).attr('strategy-id');
            getUpdateStrategyeForm(strategy_id);
        });
        
        function getOgsmTitleForm(id) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                data:{id: id},
                url: APP_URL + "/tools/senior-leadership-alignment/get-ogsm-title-form",
                type: "post",
                dataType: 'html',
                success: function(result) {
                    $('#hrBusinessAlignmentOgsmModal').modal('show');
                    $('#hrBusinessAlignmentOgsmModalBody').html(result);
                },
            });  
        }

        function getOgsmLeaderForm(id) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                data: {id:id},
                url: APP_URL + "/tools/senior-leadership-alignment/get-ogsm-leader-form",
                type: "post",
                dataType: 'html',
                success: function(result) {
                    $('#hrBusinessAlignmentOgsmModal').modal('show');
                    $('#hrBusinessAlignmentOgsmModalBody').html(result);
                },
            });  
        }

        function getObjectiveForm(senior_leadership_alignment_id) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                data: {senior_leadership_alignment_id : senior_leadership_alignment_id},
                url: APP_URL + "/tools/senior-leadership-alignment/get-objectives-form",
                type: "post",
                dataType: 'html',
                success: function(result) {
                    $('#hrBusinessAlignmentOgsmModal').modal('show');
                    $('#hrBusinessAlignmentOgsmModalBody').html(result);
                },
            });  
        }

        function getUpdateObjectivesForm(objectives_id) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                data:{objectives_id: objectives_id},
                url: APP_URL + "/tools/senior-leadership-alignment/get-update-objectives-form",
                type: "post",
                dataType: 'html',
                success: function(result) {
                    $('#hrBusinessAlignmentOgsmModal').modal('show');
                    $('#hrBusinessAlignmentOgsmModalBody').html(result);
                },
            });  
        }

        function getStrategyeForm(objectives_id) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                data:{objectives_id: objectives_id},
                url: APP_URL + "/tools/senior-leadership-alignment/get-strategy-form",
                type: "post",
                dataType: 'html',
                success: function(result) {
                    $('#hrBusinessAlignmentOgsmModal').modal('show');
                    $('#hrBusinessAlignmentOgsmModalBody').html(result);
                },
            });  
        }

        function getUpdateStrategyeForm(strategy_id) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                data:{strategy_id: strategy_id},
                url: APP_URL + "/tools/senior-leadership-alignment/get-update-strategy-form",
                type: "post",
                dataType: 'html',
                success: function(result) {
                    $('#hrBusinessAlignmentOgsmModal').modal('show');
                    $('#hrBusinessAlignmentOgsmModalBody').html(result);
                },
            });  
        }

        $(document).on("click", "#saveObjectivesBtn", function (e) {
            $('.is-invalid').removeClass('is-invalid');
            $('.invalid-feedback').remove();
            e.preventDefault();
            let formData =$('#objectivesForm').serialize();
            var myEditor_objectives = document.querySelector('#objectives')
            var myEditor_goals = document.querySelector('#goals')
            var objectives = myEditor_objectives.children[0].innerHTML
            var goals = myEditor_goals.children[0].innerHTML
            if(objectives == "<p><br></p>") {
                objectives = '';
            }
            if(goals == "<p><br></p>") {
                goals = '';
            }
            var data = new FormData();
            data.append('objectives', objectives);
            data.append('goals', goals);
            data.append('senior_leadership_alignment_id', $('#senior_leadership_alignment_id').val());
            $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    data:data,
                    url: APP_URL + "/tools/senior-leadership-alignment/save-objectives",
                    type: "POST",
                    dataType: 'json',
                    processData: false,
                    contentType: false,
                    success: function(result) {
                      location.reload();
                    },
                    error:function (response){
                        $('.is-invalid').removeClass('is-invalid');
                        $('.invalid-feedback').remove();
                        var obj = response.responseJSON.json;
                        $.each(obj, function(key,value) {
                            var key = key.split('.').join("");
                            $('#'+key).addClass('is-invalid');
                            $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                        });
                    },
                    complete:function(data){
                        
                    }
                });  
        });
        

        $(document).on("click", "#updateObjectivesBtn", function (e) {
            $('.is-invalid').removeClass('is-invalid');
            $('.invalid-feedback').remove();
            e.preventDefault();
            var myEditor_objectives = document.querySelector('#objectives')
            var myEditor_goals = document.querySelector('#goals')
            var objectives = myEditor_objectives.children[0].innerHTML
            var goals = myEditor_goals.children[0].innerHTML
            if(objectives == "<p><br></p>") {
                objectives = '';
            }
            if(goals == "<p><br></p>") {
                goals = '';
            }
            var data = new FormData();
            data.append('objectives_id', $('#objectives_id').val());
            data.append('objectives', objectives);
            data.append('goals', goals);
            $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    data:data,
                    url: APP_URL + "/tools/senior-leadership-alignment/update-objectives",
                    type: "POST",
                    dataType: 'json',
                    processData: false,
                    contentType: false,
                    success: function(result) {
                      location.reload();
                    },
                    error:function (response){
                        $('.is-invalid').removeClass('is-invalid');
                        $('.invalid-feedback').remove();
                        var obj = response.responseJSON.json;
                        $.each(obj, function(key,value) {
                            var key = key.split('.').join("");
                            $('#'+key).addClass('is-invalid');
                            $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                        });
                    },
                    complete:function(data){
                        
                    }
                });  
        });

        $(document).on("click", "#saveStrategyBtn", function (e) {
            $('.is-invalid').removeClass('is-invalid');
            $('.invalid-feedback').remove();
            e.preventDefault();
            // let formData =$('#strategyForm').serialize();
            var myEditor_strategy = document.querySelector('#strategy')
            var myEditor_measures = document.querySelector('#measures')
            var strategy = myEditor_measures.children[0].innerHTML
            var measures = myEditor_measures.children[0].innerHTML
            if(strategy == "<p><br></p>") {
                strategy = '';
            }
            if(measures == "<p><br></p>") {
                measures = '';
            }
            var data = new FormData();
            data.append('objectives_id', $('#objectives_id').val());
            data.append('strategy', strategy);
            data.append('measures', measures);
            $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    data:data,
                    url: APP_URL + "/tools/senior-leadership-alignment/save-strategy",
                    type: "POST",
                    dataType: 'json',
                    processData: false,
                    contentType: false,
                    success: function(result) {
                      location.reload();
                    },
                    error:function (response){
                        $('.is-invalid').removeClass('is-invalid');
                        $('.invalid-feedback').remove();
                        var obj = response.responseJSON.json;
                        $.each(obj, function(key,value) {
                            var key = key.split('.').join("");
                            $('#'+key).addClass('is-invalid');
                            $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                        });
                    },
                    complete:function(data){
                        
                    }
                });  
        });

        $(document).on("click", "#updateStrategyBtn", function (e) {
            $('.is-invalid').removeClass('is-invalid');
            $('.invalid-feedback').remove();
            e.preventDefault();
            //  let formData =$('#strategyForm').serialize();
            var myEditor_strategy = document.querySelector('#strategy')
            var myEditor_measures = document.querySelector('#measures')
            var strategy = myEditor_strategy.children[0].innerHTML
            var measures = myEditor_measures.children[0].innerHTML
            if(strategy == "<p><br></p>") {
                strategy = '';
            }
            if(measures == "<p><br></p>") {
                measures = '';
            }
            var data = new FormData();
            data.append('strategy_id', $('#strategy_id').val());
            data.append('strategy', strategy);
            data.append('measures', measures);
            $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    data:data,
                    url: APP_URL + "/tools/senior-leadership-alignment/update-strategy",
                    type: "POST",
                    dataType: 'json',
                    processData: false,
                    contentType: false,
                    success: function(result) {
                      location.reload();
                    },
                    error:function (response){
                        $('.is-invalid').removeClass('is-invalid');
                        $('.invalid-feedback').remove();
                        var obj = response.responseJSON.json;
                        $.each(obj, function(key,value) {
                            var key = key.split('.').join("");
                            $('#'+key).addClass('is-invalid');
                            $('#'+key).after('<div class="invalid-feedback">'+value+'</div>')
                        });
                    },
                    complete:function(data){
                        
                    }
                });  
        });
        
        $(document).on("click", ".deleteStrategyBtn", function (e) {
            var strategy_id = $(this).attr('strategy-id');
            $('.confirmation-modal').modal('show');
            $(document).on("click", ".delete-confirmation", function (e) {
                $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden"></span> Deleting...')
                
                e.preventDefault();
                $.ajaxSetup({
                        headers: {
                            'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                        }
                    });
                    $.ajax({
                        data:{strategy_id: strategy_id},
                        url: APP_URL + "/tools/senior-leadership-alignment/delete-strategy",
                        type: "POST",
                        dataType: 'json',
                        success: function(result) {
                            location.reload();
                        }
                });  
            });
          
        });


        
        $(document).on("click", ".deleteObjectivesBtn", function (e) {
            var objectives_id = $(this).attr('objectives-id');
            $('.confirmation-modal').modal('show');
            $(document).on("click", ".delete-confirmation", function (e) {
                $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden"></span> Deleting...')
                
                e.preventDefault();
                $.ajaxSetup({
                        headers: {
                            'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                        }
                    });
                    $.ajax({
                        data:{objectives_id: objectives_id},
                        url: APP_URL + "/tools/senior-leadership-alignment/delete-objectives",
                        type: "POST",
                        dataType: 'json',
                        success: function(result) {
                            location.reload();
                        }
                });  
            });
          
        });

        $(document).on("click", ".submitBtn", function (e) {
            var senior_leadership_alignment_id = $(this).attr('senior_leadership_alignment_id');
            $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden"></span> Submit...')
            
            e.preventDefault();
            $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    data:{senior_leadership_alignment_id: senior_leadership_alignment_id},
                    url: APP_URL + "/tools/senior-leadership-alignment/submit-senior-leadership-alignment",
                    type: "POST",
                    dataType: 'json',
                    success: function(result) {
                        location.reload();
                    }
            });  
        });




    });
</script>

<style>
    p{
        margin: 0px !important
    }
</style>