Files
SimpleCloudNotifier/webapp/src/app/features/channels/channel-list/channel-list.component.html

73 lines
2.2 KiB
HTML

<div class="page-content">
<div class="page-header">
<h2>Channels</h2>
<div class="header-actions">
<button nz-button (click)="loadChannels()">
<span nz-icon nzType="reload"></span>
Refresh
</button>
</div>
</div>
<nz-card>
<nz-table
#channelTable
[nzData]="channels()"
[nzLoading]="loading()"
[nzShowPagination]="false"
[nzNoResult]="noResultTpl"
nzSize="middle"
>
<ng-template #noResultTpl></ng-template>
<thead>
<tr>
<th nzWidth="20%">Name</th>
<th nzWidth="15%">Internal Name</th>
<th nzWidth="15%">Owner</th>
<th nzWidth="15%">Status</th>
<th nzWidth="15%">Messages</th>
<th nzWidth="20%">Last Sent</th>
</tr>
</thead>
<tbody>
@for (channel of channels(); track channel.channel_id) {
<tr class="clickable-row" (click)="viewChannel(channel)">
<td>
<div class="channel-name">{{ channel.display_name }}</div>
@if (channel.description_name) {
<div class="channel-description">{{ channel.description_name }}</div>
}
</td>
<td>
<span class="mono">{{ channel.internal_name }}</span>
</td>
<td>{{ getOwnerDisplayName(channel.owner_user_id) }}</td>
<td>
<nz-tag [nzColor]="getSubscriptionStatus(channel).color">
{{ getSubscriptionStatus(channel).label }}
</nz-tag>
</td>
<td>{{ channel.messages_sent }}</td>
<td>
@if (channel.timestamp_lastsent) {
<span nz-tooltip [nzTooltipTitle]="channel.timestamp_lastsent">
{{ channel.timestamp_lastsent | relativeTime }}
</span>
} @else {
<span class="text-muted">Never</span>
}
</td>
</tr>
} @empty {
<tr>
<td colspan="6">
<nz-empty nzNotFoundContent="No channels found"></nz-empty>
</td>
</tr>
}
</tbody>
</nz-table>
</nz-card>
</div>