61 lines
3.0 KiB
HTML
61 lines
3.0 KiB
HTML
<div class="container-fluid" style="background-color: #53709f;">
|
|
<div class="container">
|
|
<div class="row py-5">
|
|
<div *ngIf="app.user" class="ml-auto mr-3 mb-3">
|
|
<button mat-raised-button (click)="createCategory()">
|
|
<mat-icon>playlist_add</mat-icon> Category
|
|
</button>
|
|
<button mat-raised-button class="ml-3" (click)="createProduct()">
|
|
<mat-icon>note_add</mat-icon> Product
|
|
</button>
|
|
</div>
|
|
|
|
<nav class="w-100 mx-3" aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item curs-pointer" [ngClass]="{active: !category}" [routerLink]="['/store']">Store</li>
|
|
<li class="breadcrumb-item curs-pointer active">{{category}}</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<ng-container *ngFor="let c of categories | async">
|
|
<mat-card class="m-3 curs-pointer">
|
|
<div [routerLink]="['/store', c.name]">
|
|
<img *ngIf="c.image" mat-card-image [src]="c.image" [alt]="c.name" style="width: 200px; height: 200px;">
|
|
<mat-divider *ngIf="c.image" class="custom-line"></mat-divider>
|
|
<mat-card-content class="text-center">
|
|
<h5>{{c.name}}</h5>
|
|
</mat-card-content>
|
|
</div>
|
|
<mat-card-actions *ngIf="app.user">
|
|
<button mat-raised-button (click)="createCategory(c)">
|
|
<mat-icon>edit</mat-icon>
|
|
</button>
|
|
<button mat-raised-button class="ml-3" (click)="delete(c)">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|
|
</ng-container>
|
|
|
|
<ng-container *ngFor="let p of products | async">
|
|
<mat-card class="m-3 curs-pointer">
|
|
<div [routerLink]="['/products', p.name]">
|
|
<img *ngIf="p.image" mat-card-image [src]="p.image" [alt]="p.name" style="width: 200px; height: 200px;">
|
|
<mat-divider *ngIf="p.image" class="custom-line"></mat-divider>
|
|
<mat-card-content class="text-center">
|
|
<h5>{{p.name}}</h5>
|
|
</mat-card-content>
|
|
</div>
|
|
<mat-card-actions *ngIf="app.user">
|
|
<button mat-raised-button (click)="createProduct(p)">
|
|
<mat-icon>edit</mat-icon>
|
|
</button>
|
|
<button mat-raised-button class="ml-3" (click)="delete(p)">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|
|
</ng-container>
|
|
</div>
|
|
</div>
|
|
</div> |