mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-08 17:06:15 -08:00
180 lines
7.7 KiB
HTML
180 lines
7.7 KiB
HTML
@if (isVisible()) {
|
|
<div
|
|
class="epg-progress-panel"
|
|
[class.epg-progress-panel--minimized]="minimized()"
|
|
>
|
|
<div class="panel-header">
|
|
<span class="header-title">
|
|
<mat-icon>live_tv</mat-icon>
|
|
@if (!minimized()) {
|
|
{{ 'EPG.IMPORT_PROGRESS' | translate }}
|
|
} @else {
|
|
<span class="minimized-summary">
|
|
{{
|
|
'EPG.IMPORT_SUMMARY_LOADING'
|
|
| translate: { count: loadingCount() }
|
|
}}
|
|
@if (queuedCount() > 0) {
|
|
,
|
|
{{
|
|
'EPG.IMPORT_SUMMARY_QUEUED'
|
|
| translate: { count: queuedCount() }
|
|
}}
|
|
}
|
|
</span>
|
|
}
|
|
</span>
|
|
<div class="header-actions">
|
|
<button
|
|
mat-icon-button
|
|
class="minimize-btn"
|
|
(click)="toggleMinimize()"
|
|
[attr.aria-label]="
|
|
(minimized()
|
|
? 'EPG.IMPORT_PANEL_EXPAND'
|
|
: 'EPG.IMPORT_PANEL_MINIMIZE'
|
|
) | translate
|
|
"
|
|
[matTooltip]="
|
|
(minimized()
|
|
? 'EPG.IMPORT_PANEL_EXPAND'
|
|
: 'EPG.IMPORT_PANEL_MINIMIZE'
|
|
) | translate
|
|
"
|
|
>
|
|
<mat-icon>
|
|
{{ minimized() ? 'unfold_more' : 'unfold_less' }}
|
|
</mat-icon>
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
class="dismiss-all-btn"
|
|
(click)="dismissAll()"
|
|
[attr.aria-label]="'CLOSE' | translate"
|
|
>
|
|
<mat-icon>close</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
@if (!minimized()) {
|
|
<div class="imports-list">
|
|
@for (item of activeImports; track item.url) {
|
|
<div
|
|
class="import-item"
|
|
[class]="getStatusClass(item.status)"
|
|
>
|
|
<div class="item-header">
|
|
<mat-icon
|
|
[class.spinning]="item.status === 'loading'"
|
|
>
|
|
{{ getStatusIcon(item.status) }}
|
|
</mat-icon>
|
|
<span class="item-url" [title]="item.url">
|
|
{{ getDisplayUrl(item.url) }}
|
|
</span>
|
|
@if (item.status === 'error') {
|
|
@if (isActionableSecurityError(item)) {
|
|
<button
|
|
mat-stroked-button
|
|
class="trust-btn"
|
|
type="button"
|
|
(click)="confirmTrust(item)"
|
|
>
|
|
{{ getActionLabel(item) }}
|
|
</button>
|
|
}
|
|
<button
|
|
mat-icon-button
|
|
class="retry-btn"
|
|
(click)="retry(item.url)"
|
|
[attr.aria-label]="'EPG.RETRY' | translate"
|
|
[matTooltip]="'EPG.RETRY' | translate"
|
|
>
|
|
<mat-icon>refresh</mat-icon>
|
|
</button>
|
|
}
|
|
<button
|
|
mat-icon-button
|
|
class="dismiss-btn"
|
|
(click)="dismiss(item.url)"
|
|
[attr.aria-label]="'CLOSE' | translate"
|
|
>
|
|
<mat-icon>close</mat-icon>
|
|
</button>
|
|
</div>
|
|
|
|
@if (item.status === 'loading') {
|
|
<mat-progress-bar mode="indeterminate" />
|
|
}
|
|
|
|
<div class="item-stats">
|
|
@if (item.stats) {
|
|
<span
|
|
class="stat-badge"
|
|
matTooltip="{{
|
|
'EPG.TOTAL_CHANNELS' | translate
|
|
}}"
|
|
>
|
|
<mat-icon>tv</mat-icon>
|
|
{{ formatCount(item.stats.totalChannels) }}
|
|
</span>
|
|
<span
|
|
class="stat-badge"
|
|
matTooltip="{{
|
|
'EPG.TOTAL_PROGRAMS' | translate
|
|
}}"
|
|
>
|
|
<mat-icon>event</mat-icon>
|
|
{{ formatCount(item.stats.totalPrograms) }}
|
|
</span>
|
|
} @else if (item.error) {
|
|
<span class="error-text">{{ item.error }}</span>
|
|
} @else if (item.status === 'loading') {
|
|
<span>{{ 'EPG.LOADING' | translate }}...</span>
|
|
}
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
@if (queuedImports.length > 0) {
|
|
<div class="queue-section">
|
|
<div class="queue-header">
|
|
<mat-icon>queue</mat-icon>
|
|
<span
|
|
>{{ 'EPG.QUEUED' | translate }} ({{
|
|
queuedImports.length
|
|
}})</span
|
|
>
|
|
</div>
|
|
<div class="queue-list">
|
|
@for (
|
|
item of queuedImports;
|
|
track item.url;
|
|
let i = $index
|
|
) {
|
|
<div class="queue-item">
|
|
<span class="queue-position">{{
|
|
i + 1
|
|
}}</span>
|
|
<span class="queue-url" [title]="item.url">
|
|
{{ getDisplayUrl(item.url) }}
|
|
</span>
|
|
<button
|
|
mat-icon-button
|
|
class="dismiss-btn"
|
|
(click)="dismiss(item.url)"
|
|
[attr.aria-label]="'CLOSE' | translate"
|
|
>
|
|
<mat-icon>close</mat-icon>
|
|
</button>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|