100 lines
5.4 KiB
Handlebars
100 lines
5.4 KiB
Handlebars
<div class="page-header">
|
|
<div>
|
|
<h2>Announcements</h2>
|
|
<p>Send timed or persistent overlays to every connected screen.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card card-outline card-primary" data-table-search-container data-table-pagination-card>
|
|
<div class="card-header">
|
|
<h3 class="card-title">Existing announcements</h3>
|
|
<div class="card-tools d-flex flex-nowrap align-items-center gap-2">
|
|
<div class="input-group input-group-sm flex-shrink-1" style="width: min(16rem, 100%);">
|
|
<span class="input-group-text" aria-hidden="true"><i class="bi bi-search"></i></span>
|
|
<input type="search" class="form-control" placeholder="Search announcements" aria-label="Search announcements" data-table-search />
|
|
</div>
|
|
{{#if (hasPermission currentUser 'announcements.create')}}
|
|
<a class="btn btn-primary btn-sm" href="/announcements/new">Add announcement</a>
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
<div class="card-body table-responsive p-0">
|
|
<table class="table table-striped w-100 mb-0" data-table-searchable>
|
|
<thead>
|
|
<tr>
|
|
<th data-table-sort-key="description">Description</th>
|
|
<th>Screen Groups</th>
|
|
<th data-table-sort-key="type">Type</th>
|
|
<th data-table-sort-key="color">Color</th>
|
|
<th data-table-sort-key="status">Status</th>
|
|
<th data-table-sort-key="expires">Duration</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{{#if announcements.length}}
|
|
{{#each announcements}}
|
|
<tr data-table-search-row>
|
|
<td data-label="Descriptor">
|
|
<div class="d-flex align-items-center gap-2">
|
|
<span class="announcement-list-icon {{#if (eq color_key 'light')}}text-bg-light text-dark{{else}}text-bg-{{color_key}}{{/if}}" aria-hidden="true">
|
|
<i class="bi bi-{{iconKey}}"></i>
|
|
</span>
|
|
<div class="d-flex flex-column gap-0">
|
|
<div class="fw-semibold text-break">{{#if shortLabel}}{{shortLabel}}{{else}}(untitled){{/if}}</div>
|
|
<div class="text-secondary small text-break">{{iconLabel}}</div>
|
|
</div>
|
|
</div>
|
|
{{!-- <div class="text-secondary small text-break">{{#if message}}{{truncateText message 50}}{{else}}No message provided.{{/if}}</div> --}}
|
|
</td>
|
|
<td data-label="Screen Groups" class="text-break">
|
|
<span class="small text-secondary">{{screenTargetsLabel}}</span>
|
|
</td>
|
|
<td data-label="Type">{{announcement_type}}</td>
|
|
<td data-label="Color"><span class="badge {{#if (eq color_key 'light')}}text-bg-light text-dark{{else}}text-bg-{{color_key}}{{/if}}">{{color_key}}</span></td>
|
|
<td data-label="Status">
|
|
<span class="badge {{#if (eq statusLabel 'Active')}}text-bg-success{{else if (eq statusLabel 'Expired')}}text-bg-warning{{else}}text-bg-secondary{{/if}}">{{statusLabel}}</span>
|
|
</td>
|
|
<td data-label="Duration">
|
|
{{#if expires_at}}
|
|
<span>{{durationLabel}}</span>
|
|
<div class="text-secondary small">
|
|
Ends {{expiresAtLabel}}
|
|
</div>
|
|
{{else}}
|
|
<span>{{durationLabel}}</span>
|
|
{{/if}}
|
|
</td>
|
|
<td data-label="Actions">
|
|
{{#if (anyPermission ../currentUser 'announcements.create' 'announcements.update' 'announcements.delete')}}
|
|
<div class="actions">
|
|
{{#if (hasPermission ../currentUser 'announcements.update')}}
|
|
<form class="inline-form" method="post" action="{{actionButtonPath}}" data-confirm-message="{{actionButtonConfirmMessage}}" data-async-command>
|
|
<button class="btn btn-sm {{actionButtonClassName}}" type="submit" {{#if actionButtonDisabled}}disabled title="{{actionButtonDisabledTitle}}"{{/if}}><i class="bi {{actionButtonIcon}} me-1" aria-hidden="true"></i>{{actionButtonLabel}}</button>
|
|
</form>
|
|
<a class="btn btn-sm btn-primary" href="/announcements/{{id}}/edit">Edit</a>
|
|
{{/if}}
|
|
{{#if (hasPermission ../currentUser 'announcements.create')}}
|
|
<a class="btn btn-sm btn-secondary" href="/announcements/{{id}}/duplicate">Dupe</a>
|
|
{{/if}}
|
|
{{#if (hasPermission ../currentUser 'announcements.delete')}}
|
|
<form class="inline-form" method="post" action="/announcements/{{id}}/delete" data-confirm-message="Delete this announcement?">
|
|
<button class="btn btn-sm {{#if deleteDisabled}}btn-outline-danger{{else}}btn-danger{{/if}}" type="submit" {{#if deleteDisabled}}disabled title="{{deleteBlockedMessage}}"{{/if}}>Delete</button>
|
|
</form>
|
|
{{/if}}
|
|
</div>
|
|
{{else}}
|
|
<span class="empty">-</span>
|
|
{{/if}}
|
|
</td>
|
|
</tr>
|
|
{{/each}}
|
|
{{else}}
|
|
<tr data-table-search-empty-default><td colspan="7" class="empty">No announcements yet.</td></tr>
|
|
{{/if}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{{> table-pagination pagination=pagination basePath="/announcements" alwaysShow=true}}
|
|
</div>
|