<?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 settings-wrapper dt-info">
                <div class="head d-flex align-items-center flex-wrap gap-3">
                    <?php if ($this->canAddButton) { ?>
                        <button id="add-button" class="action-buttons blue d-flex align-items-center">
                            <i class="icon-ic-21 me-2"></i>
                            <?php echo $this->user->lang('Add Note'); ?>
                        </button>
                    <?php } ?>
                    <?php echo $this->user->lang("Show");?>
                    <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 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">
                        <button class="action-buttons" id="delete-button" disabled="disabled"><i class="icon-ic-25"></i><?php echo $this->user->lang('Delete'); ?>
                        <button class="action-buttons" id="archive-button" disabled="disabled"><i class="icon-ic-25"></i><?php echo $this->user->lang('Archive'); ?>
                    </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() {
            var selectedRows = profilenotes.table.rows({ selected: true }).count();
            if (selectedRows > 0) {
                $('.table-actions .action-buttons').prop('disabled', false);
            } else {
                $('.table-actions .action-buttons').prop('disabled', true);
            }
        });

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

            RichHTML.msgBox(clientexec.lang('Are you sure you want to delete the selected accounts(s)?'), { type:"yesno" }, function(result) {
                if (result.btn === clientexec.lang("Yes")) {
                    $.post("index.php?fuse=clients&action=deleteprofileaccount&controller=userprofile", {
                        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>