@extends('layouts/contentNavbarLayout')

@section('title', 'Challenges')

@section('content')

    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h5>NOTIFICATIONS {{ strtoupper($type) }} </h5>
        </div>
        <div class="card-body">
            @if(!empty(Session::get('success')))
                <div class="alert alert-success" role="alert">
                    {{  Session::get('success') }}
                </div>
            @endif
            @if(!empty(Session::get('error')))
                <div class="alert alert-danger" role="alert">
                    {{  Session::get('error') }}
                </div>
            @endif
            @include('content/notifications/edit/'.$type)
        </div>
    </div>
@endsection

@section('page-script')
    <script>
        $('#blockListDepartment').show();
        $('#blockListEmployees').show();
        $(document).ready(function() {
            selectDepartmentsEmployees();

            $('#birthday').on('change', function() {

                if ($('#birthday').val() == 'Family') {
                    $('#block_date_birthday').hide();
                    $('#date_birthday').val('');
                }
                if ($('#birthday').val() == 'Birthday') {
                    $('#block_date_birthday').show();
                }
            });
        });

        function selectDepartmentsEmployees() {
            var arrayDepartmentsSelected = $('#arrayDepartmentsSelected').val();
            var arrayEmployessSelected = $('#arrayEmployessSelected').val();
            //$('#select_company, #type').change(function() {
            var companyId = $('#company_id').val();
            var type = $('#type_dep_empl').val();
            if (companyId != '' && type != '') {
                // List Departments by Company
                if (type == 'Department') {
                    $('#selectDepartment').empty();
                    $('#selectEmployees').empty();
                    $.ajax({
                        url: "{{ route('list-department') }}",
                        data: { 'id': companyId },
                        type: 'GET',
                        dataType: 'json',
                        success: function(result) {
                            result.forEach((item) => {
                                var select = '';
                                if (arrayDepartmentsSelected.includes(item.id)) {
                                    select = 'selected';
                                }
                                var html = '<option value=' + item.id + ' ' + select + '>' + item.name + '</option>';
                                $('#selectDepartment').append(html);
                            });
                            $('#blockListDepartment').show();
                            $('#blockListEmployees').hide();
                        }
                    });
                }
                // List Employees by Company
                if (type == 'Employees') {
                    $('#selectDepartment').empty();
                    $('#selectEmployees').empty();
                    $.ajax({
                        url: "{{ route('list-employees') }}",
                        data: { 'id': companyId },
                        type: 'GET',
                        dataType: 'json',
                        success: function(result) {
                            result.forEach((item) => {
                                var select = '';
                                if (arrayEmployessSelected.includes(item.id)) {
                                    select = 'selected';
                                }
                                var html = '<option value=' + item.id + ' ' + select + '>' + item.name + ' ' + item.username + '</option>';
                                $('#selectEmployees').append(html);
                            });
                            $('#blockListDepartment').hide();
                            $('#blockListEmployees').show();
                        }
                    });
                }
            }
        }


        // });
        // $('#blockListDepartment').hide();
        // $('#blockListEmployees').hide();
    </script>
@endsection