75 lines
2.4 KiB
HTML
75 lines
2.4 KiB
HTML
<div class="page-content">
|
|
@if (loading()) {
|
|
<div class="loading-container">
|
|
<nz-spin nzSimple nzSize="large"></nz-spin>
|
|
</div>
|
|
} @else if (client()) {
|
|
<div class="detail-header">
|
|
<button nz-button (click)="goBack()">
|
|
<span nz-icon nzType="arrow-left" nzTheme="outline"></span>
|
|
Back to Clients
|
|
</button>
|
|
@if (expertMode()) {
|
|
<div class="header-actions">
|
|
<button
|
|
nz-button
|
|
nzDanger
|
|
nz-popconfirm
|
|
nzPopconfirmTitle="Are you sure you want to delete this client?"
|
|
(nzOnConfirm)="deleteClient()"
|
|
>
|
|
<span nz-icon nzType="delete"></span>
|
|
Delete
|
|
</button>
|
|
</div>
|
|
}
|
|
</div>
|
|
|
|
<nz-card>
|
|
<div class="client-header">
|
|
<span
|
|
nz-icon
|
|
[nzType]="getClientIcon(client()!.type)"
|
|
nzTheme="outline"
|
|
class="client-type-icon"
|
|
></span>
|
|
<h2 class="client-title">{{ client()!.name || 'Unnamed Client' }}</h2>
|
|
<nz-tag>{{ getClientTypeLabel(client()!.type) }}</nz-tag>
|
|
</div>
|
|
|
|
<scn-metadata-grid>
|
|
<scn-metadata-value label="Client ID">
|
|
<span class="mono">{{ client()!.client_id }}</span>
|
|
</scn-metadata-value>
|
|
<scn-metadata-value label="Type">
|
|
<nz-tag>{{ getClientTypeLabel(client()!.type) }}</nz-tag>
|
|
</scn-metadata-value>
|
|
<scn-metadata-value label="Agent">
|
|
<div class="agent-info">
|
|
<span>{{ client()!.agent_model }}</span>
|
|
<span class="agent-version">v{{ client()!.agent_version }}</span>
|
|
</div>
|
|
</scn-metadata-value>
|
|
<scn-metadata-value label="Created">
|
|
<div class="timestamp-absolute">{{ client()!.timestamp_created | date:'yyyy-MM-dd HH:mm:ss' }}</div>
|
|
<div class="timestamp-relative">{{ client()!.timestamp_created | relativeTime }}</div>
|
|
</scn-metadata-value>
|
|
<scn-metadata-value label="FCM Token">
|
|
<span class="mono fcm-token" nz-tooltip [nzTooltipTitle]="client()!.fcm_token">
|
|
{{ client()!.fcm_token }}
|
|
</span>
|
|
</scn-metadata-value>
|
|
</scn-metadata-grid>
|
|
</nz-card>
|
|
} @else {
|
|
<nz-card>
|
|
<div class="not-found">
|
|
<p>Client not found</p>
|
|
<button nz-button nzType="primary" (click)="goBack()">
|
|
Back to Clients
|
|
</button>
|
|
</div>
|
|
</nz-card>
|
|
}
|
|
</div>
|