<?php echo $this->profileheader($this->customer);?>

<div class="resp-tabs-container tab_identifier_parent no-padding">
    <div>
        <div class="client-contact-wrapper" id="profile-fields">

            <div class="cm-holder dt-info">
                <div class="head padding-bottom">
                    <div class="dt-header">
                        <div class="dt-header-left">
                            <?php if ($this->canAddButton) { ?>
                            <button id="add-button" class="action-buttons blue">
                                <i class="icon-ic-21 me-2"></i>
                                <?php echo $this->user->lang('Add Note'); ?>
                            </button>
                            <?php } ?>

                            <div class="dt-filters">
                                <div class="filter-group">
                                    <label><?php echo $this->user->lang("Show");?></label>
                                    <select class="dropdown-select" style="width:140px;" id='profileNotes-grid-filterbystatus'>
                                        <option value='1'><?php echo $this->user->lang("Archived"); ?></option>
                                        <option value='0' selected><?php echo $this->user->lang("Un-Archived"); ?></option>
                                    </select>
                                </div>

                            </div>
                        </div>

                        <div class="dt-header-right">
                            <div class="filter-group dt-length"></div>
                        </div>
                    </div>
                </div>
                <div class="dt-wrapper pull-top">
                    <div class="table-responsive">
                        <table id="table-list" class="display" style="width:100%">
                            <thead>
                                <tr>
                                    <th></th>
                                    <th style="text-align: center">
                                        <input type="checkbox" id="checkAll">
                                    </th>
                                    <th class=""><?php echo $this->user->lang('Subject'); ?></th>
                                    <th class=""><?php echo $this->user->lang('Date Submitted'); ?></th>
                                    <th class=""><?php echo $this->user->lang('Entered By'); ?></th>
                                    <th class=""><?php echo $this->user->lang('Viewable By Client'); ?></th>
                                    <th class=""><?php echo $this->user->lang('Ticket Type'); ?></th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                    <div class="table-actions">
                        <div class="dropdown" id="archiveDeleteActions" data-open="false">
                            <button
                                class="pill"
                                type="button"
                                aria-haspopup="menu"
                                aria-expanded="false"
                                aria-controls="archiveDeleteActionsMenu"
                                disabled="disabled"
                            >
                                <i class="fas fa-archive"></i>
                                <?php echo $this->user->lang('Actions'); ?>
                                <i class="fas fa-chevron-down caret"></i>
                            </button>

                            <div
                                class="menu"
                                id="archiveDeleteActionsMenu"
                                role="menu"
                                aria-labelledby="archiveDeleteActions"
                            >
                                <button
                                    class="menu-item"
                                    role="menuitem"
                                    type="button"
                                    id="archive-button"
                                >
                                    <i class="fas fa-archive mi-icon"></i>
                                    <?php echo $this->user->lang('Archive'); ?>
                                </button>

                                <button
                                    class="menu-item danger"
                                    role="menuitem"
                                    type="button"
                                    id="delete-button"
                                >
                                    <i class="fas fa-trash mi-icon"></i>
                                    <?php echo $this->user->lang('Delete'); ?>
                                </button>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

<script>
    $(document).ready(function() {
        var ajaxUrl = 'index.php?fuse=clients&action=clientnotes&controller=notes';
        profilenotes.table = $('#table-list').DataTable({
            columnDefs: [{
                targets: 1,
                orderable: false,
                className: 'select-checkbox',
                checkboxes: {
                    selectRow: true
                },
                width: '5%'
            }],

            select: {
                style: 'multi',
                selector: 'td:nth-child(2)'
            },
            "searching": false,
            "ajax": {
                url: ajaxUrl,
                dataSrc: 'results',
            },
            "columns": [
                {
                    "className": 'details-control',
                    "orderable": false,
                    "data": null,
                    "defaultContent": ''
                },
                { data: null, defaultContent: '', orderable: false, },
                {
                    "data": "subject",
                    render: function (data, type, row) {
                        return '<a class="edit-link" data-id="' + row.id + '">' + row.subject + '</a>';
                    }
                },
                {
                    "data": "datesubmitted",
                },
                {
                    "data": "staff",
                },
                {
                    "data": "visablebycustomer",
                    render: function(data, type, row) {
                        if (row.visablebycustomer == true){
                            return clientexec.lang("Yes");
                        } else {
                            return clientexec.lang("No");
                        }
                    }
                },
                {
                    "data": "tickettype",
                },
            ]
            ,
            "order": [[2, 'asc']]
        });

        $('#checkAll').on('click', function () {
            if (this.checked) {
                profilenotes.table.rows({page: 'current'}).every(function () {
                    var rowNode = this.node();
                    if ($(rowNode).find('td.select-checkbox').length) {
                        this.select();
                    }
                });
            } else {
                profilenotes.table.rows().deselect();
            }
        });

        profilenotes.table.on('select.dt deselect.dt', function () {
            const hasSelection = profilenotes.table.rows({ selected: true }).count() > 0;

            $('#archiveDeleteActions .pill').prop('disabled', !hasSelection);

            if (!hasSelection) {
                clientexec.tableActions.closeAllDropdowns();
            }
        });


        $('#delete-button').on('click',function() {
            if ($(this).attr('disabled')) {
                return false;
            }

            RichHTML.msgBox(clientexec.lang('Are you sure you want to delete the selected notes(s)?'), { type:"yesno" }, function(result) {
                if (result.btn === clientexec.lang("Yes")) {
                    $.post("index.php?fuse=clients&action=deleteclientnote&controller=notes", {
                        ids: profilenotes.table.getSelectedRows()
                    },
                    function(data){
                        clientexec.parseResponse(data);
                        profilenotes.table.ajax.reload();
                    });
                }
            });
        });

        $('#add-button').on('click', function(){
            clientexec.addNote();
        });

        $('#table-list').on('click', '.edit-link', function(e) {
            profilenotes.window.show({
                params: {
                    id: $(this).data('id'),
                }
            });
        });

        $('#table-list tbody').on('click', 'td.details-control', function () {
            var tr = $(this).closest('tr');
            var row = profilenotes.table.row(tr);
            var data = row.data();

            if (row.child.isShown()) {
                row.child.hide();
                tr.removeClass('shown');
            }
            else {
                var expanderBody = '<br/><b>'+clientexec.lang('Associated to Ticket Type')+':</b><b>&nbsp;' + data.tickettype + '&nbsp;&nbsp;</b><br/><br/><b>'+clientexec.lang('Note')+':&nbsp;</b>' + clientexec.nl2br(clientexec.htmlspecialchars(data.desc)) + '</p>';
                row.child(expanderBody).show();
                tr.addClass('shown');
            }
        });
    });
</script>