6e866b83e4
feat: add global proxy config upgrade: upgrade front(angular) to 19 chore: deployment staff 1. Dockerfile: build frontend, backend, and run in nginx base image
95 lines
3.6 KiB
HTML
95 lines
3.6 KiB
HTML
<div>
|
|
<mat-toolbar color="primary">
|
|
<button mat-icon-button class="favorite-icon" aria-label="icon-button with heart icon">
|
|
<mat-icon>favorite</mat-icon>
|
|
</button>
|
|
<span>repo.me</span>
|
|
|
|
<div style="margin-left:auto;">
|
|
<button mat-icon-button matTooltip="帮我下载镜像" (click)="downloadImage()">
|
|
<mat-icon>cloud_download</mat-icon>
|
|
</button>
|
|
</div>
|
|
</mat-toolbar>
|
|
</div>
|
|
<div>
|
|
|
|
<mat-form-field class="search-field" appearance="outline" subscriptSizing="dynamic">
|
|
<mat-label>搜索镜像</mat-label>
|
|
<input matInput type="text" [formControl]="keyword" (change)="search()">
|
|
<button matSuffix mat-icon-button matTooltip="搜索" (click)="search()">
|
|
<mat-icon>search</mat-icon>
|
|
</button>
|
|
</mat-form-field>
|
|
|
|
<table mat-table [dataSource]="repo_svc.catalog().list" multiTemplateDataRows>
|
|
|
|
<ng-container matColumnDef="expand">
|
|
<th mat-header-cell *matHeaderCellDef aria-label="row actions"> </th>
|
|
<td mat-cell *matCellDef="let element">
|
|
<button mat-icon-button aria-label="expand row" (click)="showTags($event, element)">
|
|
@if (expandedElement === element) {
|
|
<mat-icon>keyboard_arrow_up</mat-icon>
|
|
} @else {
|
|
<mat-icon>keyboard_arrow_down</mat-icon>
|
|
}
|
|
</button>
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="id">
|
|
<th mat-header-cell *matHeaderCellDef>ID</th>
|
|
<td mat-cell *matCellDef="let element"> {{ element.id }}</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="updated_at">
|
|
<th mat-header-cell *matHeaderCellDef>更新时间</th>
|
|
<td mat-cell *matCellDef="let element"> {{ element.updated_at | date:'yy-MM-dd HH:mm:ss' }}</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="repo">
|
|
<th mat-header-cell *matHeaderCellDef>镜像</th>
|
|
<td mat-cell *matCellDef="let element"> {{ element.repo }}</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="tag">
|
|
<th mat-header-cell *matHeaderCellDef>标签</th>
|
|
<td mat-cell *matCellDef="let element"> {{ element.tag }}</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="size">
|
|
<th mat-header-cell *matHeaderCellDef>占用</th>
|
|
<td mat-cell *matCellDef="let element"> {{ element.size | capacity }}</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="operation">
|
|
<th mat-header-cell *matHeaderCellDef>操作</th>
|
|
<td mat-cell *matCellDef="let element" style="padding-left: 4px !important;">
|
|
<button mat-icon-button matTooltip="复制镜像地址" (click)="copyImageCommand(element)">
|
|
<mat-icon>file_copy</mat-icon>
|
|
</button>
|
|
</td>
|
|
</ng-container>
|
|
|
|
|
|
<ng-container matColumnDef="expandedDetail">
|
|
<td mat-cell *matCellDef="let element" [attr.colspan]="columnsToDisplayWithExpand.length">
|
|
<div class="repo-element-detail" [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'">
|
|
@if (element.Tags) {
|
|
@for (tag of element.Tags.list; track tag) {
|
|
<mat-chip-option color="primary">{{ tag.tag }}</mat-chip-option>
|
|
}
|
|
}
|
|
</div>
|
|
</td>
|
|
</ng-container>
|
|
|
|
|
|
<tr mat-header-row *matHeaderRowDef="columnsToDisplayWithExpand"></tr>
|
|
<tr mat-row *matRowDef="let element; columns: columnsToDisplayWithExpand;" class="repo-element-row"
|
|
[class.repo-expanded-row]="expandedElement === element"
|
|
(click)="expandedElement = expandedElement === element ? null : element">
|
|
</tr>
|
|
<tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="repo-detail-row"></tr>
|
|
</table>
|
|
</div> |