<?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">
                        <?php if ($this->canDeleteButton) { ?>
                            <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>
                                        <span><?php echo $this->user->lang('Archive'); ?></span>
                                    </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>
                        <?php } ?>
                    </div>

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

<script data-cfasync="false">
    const canEdit = <?php echo json_encode($this->canAddButton); ?>;
    const canDelete = <?php echo json_encode($this->canDeleteButton); ?>;

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

            select: canDelete ? {
                style: 'multi',
                selector: 'td:nth-child(2)'
            } : false,
            "searching": false,
            "ajax": {
                url: ajaxUrl,
                dataSrc: 'results',
                data: function(d) {
                    d.archived = $('#profileNotes-grid-filterbystatus').val();
                }
            },
            "initComplete": function() {
                if (!canDelete) {
                    $('#checkAll').hide();
                }
            },
            "columns": [
                {
                    "className": 'details-control',
                    "orderable": false,
                    "data": null,
                    "defaultContent": ''
                },
                { data: null, defaultContent: '', orderable: false, },
                {
                    "data": "subject",
                    render: function (data, type, row) {
                        if (canEdit) {
                            return '<a class="edit-link" data-id="' + row.id + '">' + row.subject + '</a>';
                        }
                        return row.subject;
                    }
                },
                {
                    "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();
                        });
                }
            });
        });

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

            $.post("index.php?fuse=clients&action=archiveclientnotes&controller=notes", {
                ids: profilenotes.table.getSelectedRows(),
                isviewingarchived: profilenotes.isViewingArchived
            },
            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');
            }
        });

        $('#profileNotes-grid-filterbystatus').change(function() {
            profilenotes.isViewingArchived = $(this).val() == 1 ? 1 : 0;

            $('#archive-button span').text(
                profilenotes.isViewingArchived ? clientexec.lang('Un-Archive') : clientexec.lang('Archive')
            );

            profilenotes.table.ajax.reload();
        });
    });
</script>