<!-- unread -->
<div class="wr-hidden-operation" data-operation="unread" style="display: block">
    <div class="panel panel-default">
        <div id="unread-body" class="panel-collapse panel-body" role="tabpanel">
            <div id="error-msg" class="alert alert-danger hidden" role="alert">
                <i class="icon fw fw-error"></i><span></span>
            </div>

            <table class="table table-striped table-hover table-bordered display data-table" id="unread-notifications">
                <thead style="display: none;">
                <tr class="sort-row">
                    <th>Description</th>
                    <th>Action</th>
                </tr>
                </thead>
                <tbody>
                {{#each notifications}}
                    {{#equal "NEW" status }}
                        <tr data-type="selectable" data-id="{{id}}">
                            <td data-display="{{description}}" data-grid-label="Description">{{description}}</td>
                            <td style="text-align: center;">
                                <a href="device/{{deviceType}}?id={{deviceIdentifier}}" data-id="{{id}}" data-url="device/{{deviceType}}?id={{deviceIdentifier}}" class="new-notification" data-click-event="remove-form">
                                     <span class="fw-stack">
                                        <i class="fw fw-circle-outline fw-stack-2x"></i>
                                        <i class="fw fw-view fw-stack-1x"></i>
                                    </span>
                                </a>
                            </td>
                        </tr>
                    {{/equal}}
                {{/each}}
                <br class="c-both" />
                </tbody>
            </table>
        </div>
    </div>
</div>
<!-- unread-->

<!-- all -->
<div class="wr-hidden-operation" data-operation="all">
    <div class="panel panel-default">
        <div id="all-body" class="panel-collapse panel-body" role="tabpanel">
            <div id="error-msg" class="alert alert-danger hidden" role="alert">
                <i class="icon fw fw-error"></i><span></span>
            </div>

            <table class="table table-striped table-hover table-bordered display data-table" id="all-notifications">
                <thead style="display: none;">
                <tr class="sort-row">
                    <th>Description</th>
                    <th>Action</th>
                </tr>
                </thead>
                <tbody>
                {{#each notifications}}
                    <tr data-type="selectable" data-id="{{id}}">
                        <td  data-display="{{description}}" data-grid-label="Description">{{description}}</td>
                        <td style="text-align: center;">
                            <a href="device/{{deviceType}}?id={{deviceIdentifier}}" data-click-event="remove-form">
                                 <span class="fw-stack">
                                    <i class="fw fw-circle-outline fw-stack-2x"></i>
                                    <i class="fw fw-view fw-stack-1x"></i>
                                </span>
                            </a>
                        </td>
                    </tr>
                {{/each}}
                <br class="c-both" />
                </tbody>
            </table>
        </div>
    </div>
</div>
<!-- /all -->