<div class="container-fluid">
    <div class="card bg-light-transparent">  
        <div class="card-header bg-white">
            <div class="float-left">
                <h4>Meeting Report List</h4>

                <a href="<?php echo base_url('hr/serviceform/meeting_crm_form'); ?>" class="btn btn-outline-dark btn-sm" title="Add New Meeting report"><i class="fa fa-plus"></i> Add New report</a>

                <a href="<?php echo base_url('hr/Serviceform_report/meeting_crm_print')?>" target="_blank" class="btn btn-outline-dark btn-sm" title="Print"><i class="fa fa-print"></i>Print</a>

                <a id="btnShowFilters" type="button" class="btn btn-outline-dark btn-sm collapsed" data-trigger="hover" title="Show Filters Box" data-toggle="collapse" data-target="#collapseFilter" aria-expanded="false">
                    <i class="fas fa-filter"></i>Show Filters</a> 
            </div>
        </div>

        <div class="collapse" id="collapseFilter">
            <div class="card-header">
                <div class="row">
                    <div class="col">
                        <div class="card no-shadow">
                            <div class="card-body">
                                <input type="hidden" name="user_id" id="user_id" value="<?php echo $_SESSION['user']['id']; ?>">
                                <div class="form-group row">
                                    <label for="sv_meetingcrm_filter_dept" class="col-lg-3">
                                        Department
                                    </label>                 
                                    <div class="col-lg-4" >
                                        <select class="custom-select" name="sv_meetingcrm_filter_dept" id="sv_meetingcrm_filter_dept">
                                            <option value="-1">[All]</option>
                                            <?php if($department) foreach($department as $row){ ?>
                                                <option value="<?php echo $row['id']; ?>"><?php echo $row['name'].' ['.$row['branch_name'].']'; ?></option> 
                                            <?php } ?>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="filterCompany" class="col-lg-3">
                                        Company Name
                                    </label>
                                    <div class="col-lg-4">    
                                        <select class='custom-select' id="sv_meetingcrm_filter_company" name="sv_meetingcrm_filter_company">
                                            <option value="-1">[All]</option>
                                            <?php if($companyList) foreach($companyList as $type){ ?>
                                                <option value="<?php echo $type['id'];?>"><?php echo $type['name'];?></option>
                                            <?php } ?>
                                        </select>
                                    </div>                                         
                                </div>
                                <div class="form-group row">
                                    <label for="sv_meetingcrm_filter_year" class="col-lg-3">
                                        Year
                                    </label>                           
                                    <div class="col-lg-4" >
                                        <input type="text" name="sv_meetingcrm_filter_year" id="sv_meetingcrm_filter_year" class="form-control datepicker-yyyy">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="sv_meetingcrm_filter_month" class="col-lg-3">
                                        Requested Month
                                    </label>                           
                                    <div class="col-lg-4" >
                                        <input type="text" name="sv_meetingcrm_filter_month" id="sv_meetingcrm_filter_month" class="form-control datepicker-mm">
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col d-print-none">
                                        <button class="btn btn-info" id="searchBtn">Search</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> 
        <div class="tab-content">
            <div class="tab-pane fade active show" id="tableView" role="tabpanel" aria-labelledby="nav-table-tab">
                <div class="card-body">
                    <div class="card no-shadow">
                        <div class="card-body">
                            <div class="table-responsive">
                                <table id="filter_table_meetingcrm" class="table table-bordered p-0 m-0" width="100%">
                                    <thead>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="#: activate to sort column ascending" style="width: 0px;">
                                            #
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Company
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Director(s) brief info
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Prepared By
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Attended by
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Principle Business
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Objective of Meeting
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Potential Services
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" style="width: 0px;">
                                            Action required
                                        </th>
                                        <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="" colspan="1" style="width: 0px;">
                                            Action
                                        </th>           
                                    </thead>
                                    <tbody>
                                        <?php if(!empty($meetingCrmList)){ ?>
                                            <?php foreach ($meetingCrmList as $key => $row) { //debug($row); ?>
                                                <?php// debug($row)?>
                                                <tr>
                                                    <td><?php echo $key+1; ?></td>
                                                    <td><?php echo $row['company_name']; ?><br>
                                                        <?php echo $row['contact_person']; ?><br>
                                                    </td>
                                                    <td><?php echo $row['director_info']; ?></td>
                                                    <td><?php echo $row['preparedByName']; ?></td>
                                                    <td>
                                                        <input type="hidden" id="attendListNameID" name="attendListNameID" value="<?php echo $row['ID']; ?>">
                                                        <?php $i=0; $i++; ?>
                                                        <?php if(!empty($attendListName)){ ?>
                                                            <?php foreach ($attendListName as $key => $rowItem) { //debug($key); ?>
                                                                <?php if($rowItem['meeting_crm_report_id'] == $row['ID']) { ?>
                                                                    <?php echo ($i++).' - '; echo $rowItem['attendedListName']; ?><br>
                                                                <?php } ?>
                                                            <?php }?>
                                                        <?php } ?>
                                                    </td>
                                                    <td><?php echo $row['principle_business']; ?></td>
                                                    <td><?php echo $row['objective_meeting']; ?></td>
                                                    <td><?php if(!empty($row['potentialServiceName'])){ echo $row['potentialServiceName']; }else{ echo $row['potential_services'];} ?>
                                                    </td>
                                                    <!--<td><?php //echo number_format($row['fee'],2); ?></td>-->
                                                    <td><?php echo $row['action_required']; ?></td>

                                                    <td class="text-center"> 
                                                        <div class="btn-group btn-group-sm" role="group">
                                                            <button type="button" class="btn btn-outline-dark" data-toggle="modal" data-target="#viewDetails" data-trigger="hover" data-tooltip="tooltip" 
                                                            title="View Detail" 
                                                            data-name="<?php echo $row['requestor']; ?>" 
                                                            data-dept="<?php echo $row['dept_name'].'/'.$row['branchName']; ?>" 
                                                            data-datereq="<?php echo date('d-m-Y',strtotime($row['createdTS'])); ?>" 
                                                            data-company="<?php echo $row['company_name']; ?>" 
                                                            data-contact="<?php echo $row['contact_person']; ?>" 
                                                            data-info="<?php echo $row['director_info']; ?>" 
                                                            data-prepared="<?php echo $row['preparedByName']; ?>" 
                                                            data-principle="<?php echo $row['principle_business']; ?>" 
                                                            data-obj="<?php echo $row['objective_meeting']; ?>" 
                                                            data-result="<?php echo $row['meeting_result']; ?>" 
                                                            data-recommended="<?php echo $row['recommended_direction']; ?>" 
                                                            data-engagement="<?php echo $row['engagementName']; ?>" 
                                                            data-potential="<?php echo $row['potentialServiceName']; ?>" 
                                                            data-fee="<?php echo $row['fee']; ?>" 
                                                            data-action="<?php echo $row['action_required']; ?>" 
                                                            onclick="open_view_modal(this)">
                                                            <i class="far fa-eye"></i></button>
                                                            <button type="button" class="btn btn-outline-dark" onclick="" data-trigger="hover" data-tooltip="tooltip" title="Edit" data-row="<?php echo $row['ID']; ?>"><a href="<?php echo base_url('hr/serviceform/meeting_crm_form/'.$row['ID']); ?>" class="btn-outline-dark"><i class="far fa-edit"></i></a></button>
                                                            <a type="button" class="btn btn-outline-dark" href="<?php echo base_url('hr/serviceform_report/meeting_crm_print/').$row['ID']; ?>" target="_blank" data-trigger="hover" data-tooltip="tooltip" title="Print Detail"><i class="fa fa-print"></i></a>
                                                            <button type="button" id="deleteButton" class="btn btn-outline-dark" onclick="deleteData(<?php echo $row['ID']; ?>);" data-trigger="hover" data-tooltip="tooltip" title="Delete"><i class="far fa-trash-alt"></i></button>
                                                        </div>
                                                    </td>
                                                </tr>   
                                            <?php } ?>
                                        <?php } ?>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>      
    </div>
</div>

<!-- modal view detail -->

<div class="modal fade d-print-none" id="viewDetails" 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">Meeting Report Form Detail</h5>&emsp;
                <!-- <a href="javascript:window.print()" class="btn btn-outline-dark btn-sm" title="Print"><i class="fa fa-print"></i>Print</a> -->
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
            </div>

            <div class="modal-body">
                <div class="row">
                    <div class="col-4">
                        <label>Borrower Name</label>
                        <input type="text" class="form-control" name="modal_view_name" id="modal_view_name" disabled>
                    </div>
                    <div class="col-4">
                        <label>Department</label>
                        <input type="text" class="form-control" name="modal_view_dept" id="modal_view_dept" disabled>
                    </div>
                    <div class="col-4">
                        <label>Date Request</label>
                        <input type="text" class="form-control" name="modal_view_date_req" id="modal_view_date_req" disabled>
                    </div>
                </div>
                <div class="row">
                    <div class="col-6">
                        <label>Company Name</label>
                        <input type="text" class="form-control" name="modal_view_company" id="modal_view_company" disabled>
                    </div>
                    <div class="col-6">
                        <label>Contact Person</label>
                        <input type="text" class="form-control" name="modal_view_contact" id="modal_view_contact" disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="col-6">
                        <label>Contact Number</label>
                        <input type="text" class="form-control" name="modal_view_number" id="modal_view_number" disabled>
                    </div>
                    <div class="col-6">
                        <label>Contact Email</label>
                        <input type="text" class="form-control" name="modal_view_email" id="modal_view_email" disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="col-6">
                        <label>Director(s) brief info</label>
                        <input type="text" class="form-control" name="modal_view_info" id="modal_view_info" disabled>
                    </div>
                    <div class="col-6">
                        <label>Objective of Meeting</label>
                        <input type="text" class="form-control" name="modal_view_obj" id="modal_view_obj" disabled>
                    </div>

                </div>
                <div class="row">
                    <!-- <div class="col-6">
                        <label>Attended by</label>
                        <input type="text" class="form-control" name="modal_view_attended" id="modal_view_attended" disabled>
                    </div> -->
                    <div class="col-6">
                        <label>Prepared by</label>
                        <input type="text" class="form-control" name="modal_view_prepared" id="modal_view_prepared" disabled>
                    </div>
                    <div class="col-6">
                        <label>Principle Business</label>
                        <input type="text" class="form-control" name="modal_view_principle" id="modal_view_principle" disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="col-6">
                        <label>Meeting Result</label>
                        <input type="text" class="form-control" name="modal_view_result" id="modal_view_result" disabled>
                    </div>
                    <div class="col-6">
                        <label>Recommended Direction in Response to the Meeting</label>
                        <input type="text" class="form-control" name="modal_view_recommended" id="modal_view_recommended" disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="col-6">
                        <label>Engagement</label>
                        <input type="text" class="form-control" name="modal_view_engagement" id="modal_view_engagement" disabled>
                    </div>
                    <div class="col-6">
                        <label>Potential Service</label>
                        <input type="text" class="form-control" name="modal_view_potential" id="modal_view_potential" disabled>
                    </div>
                </div>
                <div class="row"> 
                    <div class="col-6">
                        <label>Current/Expected Fee</label>
                        <input type="text" class="form-control" name="modal_view_fee" id="modal_view_fee" disabled>
                    </div>
                    <div class="col-6">
                        <label>Action Required</label>
                        <input type="text" class="form-control" name="modal_view_action" id="modal_view_action" disabled>
                    </div>
                </div>
                <br>
                <div class="float-right">
                </div>
            </div>
        </div>
    </div>
</div>

<!-- modal view detail -->

<script>

    function open_view_modal(elem) 
    {
        let name            = $(elem).data('name');
        let dept            = $(elem).data('dept');
        let datereq         = $(elem).data('datereq');
        let company         = $(elem).data('company');
        let contact         = $(elem).data('contact');
        let number          = $(elem).data('number');
        let email           = $(elem).data('email');
        let info            = $(elem).data('info');
        let prepared        = $(elem).data('prepared');
        // let attended        = $(elem).data('attended');
        let principle       = $(elem).data('principle');
        let obj             = $(elem).data('obj');
        let result          = $(elem).data('result');
        let recommended     = $(elem).data('recommended');
        let engagement      = $(elem).data('engagement');
        let potential       = $(elem).data('potential');
        let fee             = $(elem).data('fee');
        let action          = $(elem).data('action');
        
        // console.log(dept);
        
        /* view modal */
        $('#modal_view_name').val(name);
        $('#modal_view_dept').val(dept);
        $('#modal_view_date_req').val(datereq);
        $('#modal_view_company').val(company);
        $('#modal_view_contact').val(contact);
        $('#modal_view_number').val(number);
        $('#modal_view_email').val(email);
        $('#modal_view_info').val(info);
        $('#modal_view_prepared').val(prepared);
        // $('#modal_view_attended').val(attended);
        $('#modal_view_principle').val(principle);
        $('#modal_view_obj').val(obj);
        $('#modal_view_result').val(result);
        $('#modal_view_recommended').val(recommended);
        $('#modal_view_engagement').val(engagement);
        $('#modal_view_potential').val(potential);
        $('#modal_view_fee').val(fee);
        $('#modal_view_action').val(action);
    }

    function deleteData(ID) 
    {
        validateForm("#deleteButton", "Delete this meeting report list?", function() {
            $.ajax({
                url:'<?php echo base_url('hr/serviceform/deleteMeetingCRMList') ?>',
                data: {
                    meetingCrmID : ID,
                },
                type: 'post',
                dataType: 'json',
                success: (data) => {
                    if(data.status == "Success") {

                        localStorage.setItem("status", data.status);
                        localStorage.setItem("msg", data.msg);

                        location.reload();

                        // redirect(base_url('hr/serviceform/hotel_list'));
                    }
                }
            });
        });
    }

    $(document).ready(function(){

        //getData();

        $('#searchBtn').click(function(){
            getData();
        });

    });

    function getData() {
        var table = $('#filter_table_meetingcrm').DataTable();
        table.clear().draw();
        var frmData = new FormData();

        frmData.append('sv_meetingcrm_filter_dept',$('#sv_meetingcrm_filter_dept').val());
        frmData.append('sv_meetingcrm_filter_company',$('#sv_meetingcrm_filter_company').val());
        frmData.append('sv_meetingcrm_filter_year',$('#sv_meetingcrm_filter_year').val());
        frmData.append('sv_meetingcrm_filter_month',$('#sv_meetingcrm_filter_month').val());
        frmData.append('user_id',$('#user_id').val());

        $.ajax({
            url:"<?php echo base_url('/hr/api/serviceform/get_meeting_crm_filter'); ?>",
            type:'post',
            dataType:'json',
            data:frmData,
            processData: false,
            contentType: false,
            success:function(data){

                iziToast.success({
                    position: 'bottomRight',
                    message: 'filtering data',
                });

                let meetingcrm = data.table;

                if(meetingcrm != null){
                    $.each(meetingcrm,function(key,content)
                    {
                        var i = key + 1;

                        var btn_view = '<button type="button" class="btn btn-outline-dark" data-toggle="modal" data-target="#viewDetails" data-trigger="hover" data-tooltip="tooltip" title="View Detail" data-name="'+content.requestor+'" data-dept="'+content.dept_name+'/'+content.branchName+'" data-datereq="'+moment(content.createdTS).format('DD-MM-YYYY')+'" data-company="'+content.company_name+'" data-contact="'+content.contact_person+'" data-number="'+content.contact_number+'" data-email="'+content.contact_email+'" data-info="'+content.director_info+'" data-prepared="'+content.preparedByName+'" data-principle="'+content.principle_business+'" data-obj="'+content.objective_meeting+'" data-result="'+content.meeting_result+'" data-recommended="'+content.recommended_direction+'" data-engagement="'+content.engagementName+'" data-potential="'+content.potentialServiceName+'" data-fee="'+content.fee+'" data-action="'+content.action_required+'" onclick="open_view_modal(this)"> <i class="far fa-eye"></i> </button>';

                        var btn_edit = '<a type="button" class="btn btn-outline-dark" href="<?php echo base_url();?>hr/serviceform/meeting_crm_form/'+content.ID+'" data-trigger="hover" data-tooltip="tooltip" title="Edit"><i class="far fa-edit"></i></a>';

                        var btn_print = '<a type="button" class="btn btn-outline-dark" href="<?php echo base_url();?>hr/serviceform_report/meeting_crm_print/'+content.ID+'" data-trigger="hover" data-tooltip="tooltip" title="Print Detail"><i class="fa fa-print"></i></a>';

                        var btn_delete = '<button type="button" class="btn btn-outline-dark" onclick="deleteButton('+content.ID+')" data-trigger="hover" data-tooltip="tooltip" title="Delete"><i class="far fa-trash-alt"></i></button>';

                        table.row.add({
                            0   : i,
                            1   : content.company_name,
                            2   : content.contact_person+'<br>'+content.contact_number+'<br>'+content.contact_email,
                            3   : content.director_info,
                            4	: content.preparedByName,
                            5	: content.attendedListName,
                            6   : content.principle_business,
                            7   : content.objective_meeting,
                            8   : content.meeting_result,
                            9   : content.recommended_direction,
                            10  : content.engagementName,
                            11  : content.potentialServiceName,
                            12  : content.fee,
                            13  : content.action_required,
                            14	: '<div class="btn-group btn-group-sm" role="group">'+btn_view+btn_edit+btn_print+btn_delete+'</div>',
                        }).draw();
                        console.log(data);

                    });                        
                }

            },
            error:function(){
                iziToast.warning({
                    position: 'bottomRight',
                    message: '500 Internal Server Error.'
                });
            }
        });
    }
</script>