<section class="container" style="padding-bottom: 2rem;">

    <div class="card bg-light-transparent">
        <div class="card-header bg-white">
            <nav class="nav nav-pills nav-justified">
                <?php if($is_manager_and_above): ?>
                    <a class="nav-item nav-link active" data-toggle="tab" aria-controls="My claim submission list" aria-selected="true" href="#my_claim_submission" >My claim submission list</a>
                    <a class="nav-item nav-link" data-toggle="tab" aria-controls="Department claim submission list" aria-selected="true" href="#department_claim">Department submitted claim</a>
                <?php else:?>
                    <h4>My claim submission list</h4>
                <?php endif ?>
            </nav>
        </div>
    </div>
    
    <div class="tab-content" id="myTabContent">
        <div class="tab-pane fade show active" id="my_claim_submission" role="tabpanel" aria-labelledby="my claim submission list">
            <?php $this->load->view('hr/claim/page/claimlist/my_claim_list.php'); ?>
        </div>
        <?php if($is_manager_and_above): ?>
        <div class="tab-pane fade" id="department_claim" role="tabpanel" aria-labelledby="profile-tab">
            <?php $this->load->view('hr/claim/page/claimlist/department_claim_list.php'); ?>
        </div>
        <?php endif ?>
    </div>

</section>

<!-- Modal Claim Type -->
<div class="modal fade" id="modal_claim_new" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle">Create a new claim submission : select year and month</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>

            <form class="form" id="newClaimForm" method="post">
                <div class="modal-body">
                    <div class="form-group row">
                        <label class="col-lg-3">
                            Year
                        </label>                           
                        <div class="col-lg-4" >
                            <select class="custom-select" id="claim_year" name="claim_year">
                                <option><?php echo date('Y'); ?></option>
                                <?php 
                                if(date('m') >= 10)
                                {
                                ?>
                                    <option><?php echo date('Y',strtotime("+1 years")); ?></option>
                                <?php
                                }
                                ?>
                            </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-lg-3">
                            Month 
                        </label>                           
                        <div class="col-lg-4" >
                            <select class="custom-select" id="claim_month" name="claim_month">
                                <?php
                                    $first_date     = date('01-m-Y',strtotime("+1 months",strtotime(date('01-m-Y'))));
                                    $second_date    = date('01-m-Y',strtotime("+2 months",strtotime(date('01-m-Y'))));
                                    
                                    if(date('d') >= 15)
                                    {
                                        echo '<option value="'.(int)date('m',strtotime($first_date)).'">'.date("F",strtotime($first_date)).'</option>';
                                    }else{
                                        echo '<option value="'.(int)date('m').'" >'.date('F').'</option>';
                                    }

                                    //echo '<option value="'.(int)date('m',strtotime($first_date)).'">'.date("F",strtotime($first_date)).'</option>';
                                    //echo '<option value="'.(int)date('m',strtotime($second_date)).'">'.date("F",strtotime($second_date)).'</option>';
                                    
                                    // echo '<option value="'.str_replace('0','',date('m')).'" >'.date('F').'</option>';
                                    // echo '<option value="'.str_replace('0', '', date('m',strtotime($first_date))).'">'.date("F",strtotime($first_date)).'</option>';
                                    // echo '<option value="'.str_replace('0', '', date('m',strtotime($second_date))).'">'.date("F",strtotime($second_date)).'</option>';
                                ?>
                            </select>
                        </div>
                        <div class="col-lg-2">
                            <div class="btn-group float-right">
                                <button type="submit" class="btn btn-primary"> Create </button>
                            </div>
                        </div>
                    </div>            
                </div>
            </form> 

        </div>
    </div>
</div>
<!-- Modal Claim Type -->

<script type="text/javascript">

    $(document).ready(function(){

        $('#newClaimForm').submit(function(event){
            event.preventDefault();
            if(isPass()){
                var url = '<?php echo base_url('hr/claim/claimMonthSave'); ?>';
                data = {
                    year  : $('#claim_year').val(),
                    month : $('#claim_month').val()
                }
                redirect = '<?php echo base_url('hr/claim/myClaimlist'); ?>';
                // redirect = null;
                ajxRequest(url, 'POST', data, redirect);
            } 
        });
    });

    function isPass() 
    {
        return true;//TODO: remove this before going live
        var flag = true; 
        var claim_month    = $('#claim_month').val();
        var claim_year     = $('#claim_year').val();  

        var err_message = [
            'New claim submission need to be bigger than current date',
            'You are not allowed to create this claim',
            'Claim submission only allowed if current date is less than 08/'+claim_month+'/'+claim_year
        ];

        var current_date         = moment();
        var current_month        = current_date.format('M');
        var claim_date           = moment(claim_year+'-'+claim_month+'-08');

        if(claim_month == 12 && current_month == 1)
        {
            prev_year = claim_year-1;
            december = moment(prev_year+'-'+claim_month+'-08');
            if(moment().isAfter(december))
            {
                flag = false;
                iziToast.error({
                    position:'center',
                    message:err_message[2]
                });
            }
        }

        if(claim_month < current_month)
        {
            flag = false;
        }

        if(claim_month == current_month)
        {
            if(moment().isAfter(claim_date))
            {
                flag = false;
                iziToast.error({
                    position:'center',
                    message:err_message[2]
                });
            }
        }

        const monthDifference =  moment(new Date(claim_date)).diff(new Date(current_date), 'months', true);
        if(monthDifference > 2){
            flag = false;
            iziToast.error({
                position:'center',
                message:err_message[1],
            });
        }
        return flag;
    }
    
</script>