aknuth/bizmatch-project
1
0
Fork 0
Code Issues 9 Pull Requests Packages Projects 5 Releases Wiki Activity

account Komponente

Browse Source
This commit is contained in:
Andreas Knuth
2024-07-09 21:19:51 +02:00
parent 7f67b81242
commit 08c179fa09
9 changed files with 306 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
bizmatch/src/app/components/image-cropper/image-cropper.component.html
View File

@@ -1,14 +0,0 @@
<angular-cropper #cropper [imageUrl]="imageUrl" [cropperOptions]="cropperConfig"></angular-cropper>
<div class="flex justify-content-between mt-3">
@if(ratioVariable){
<div>
<!-- <p-selectButton [options]="stateOptions" [ngModel]="value" (ngModelChange)="changeAspectRation($event)" optionLabel="label" optionValue="value" class="small"></p-selectButton> -->
</div>
} @else {
<div></div>
}
<div class="flex justify-content-between">
<!-- <p-button icon="pi" (click)="cancelUpload()" label="Cancel" [outlined]="true" size="small" class="mr-2"></p-button>
<p-button icon="pi pi-check" (click)="sendImage()" label="Finish" pAutoFocus [autofocus]="true" size="small"></p-button> -->
</div>
</div>

4
bizmatch/src/app/components/image-cropper/image-cropper.component.scss
View File

@@ -1,4 +0,0 @@
::ng-deep p-selectbutton.small .p-button {
font-size: 0.875rem;
padding: 0.65625rem 1.09375rem;
}

48
bizmatch/src/app/components/image-cropper/image-cropper.component.ts
View File

@@ -1,48 +0,0 @@
import { Component, ViewChild } from '@angular/core';
import { AngularCropperjsModule, CropperComponent } from 'angular-cropperjs';
import { KeyValueRatio } from '../../../../../bizmatch-server/src/models/main.model';
import { ImageService } from '../../services/image.service';
import { LoadingService } from '../../services/loading.service';
import { SharedModule } from '../../shared/shared/shared.module';
export const stateOptions: KeyValueRatio[] = [
{ label: '16/9', value: 16 / 9 },
{ label: '1/1', value: 1 },
{ label: 'Free', value: NaN },
];
@Component({
selector: 'app-image-cropper',
standalone: true,
imports: [SharedModule, AngularCropperjsModule],
templateUrl: './image-cropper.component.html',
styleUrl: './image-cropper.component.scss',
})
export class ImageCropperComponent {
@ViewChild(CropperComponent) public angularCropper: CropperComponent;
imageUrl: string; //wird im Template verwendet
value: number = stateOptions[0].value;
cropperConfig = { aspectRatio: this.value };
ratioVariable: boolean;
stateOptions = stateOptions;
constructor(private loadingService: LoadingService, private imageUploadService: ImageService) {}
// ngOnInit(): void {
// if (this.config.data) {
// this.imageUrl = this.config.data.imageUrl;
// this.fileUpload = this.config.data.fileUpload;
// this.cropperConfig = this.config.data.config ? this.config.data.config : this.cropperConfig;
// this.ratioVariable = this.config.data.ratioVariable;
// }
// }
// sendImage() {
// this.fileUpload.clear();
// this.ref.close(this.angularCropper.cropper);
// }
// cancelUpload() {
// this.fileUpload.clear();
// this.ref.close();
// }
changeAspectRation(ratio: number) {
this.cropperConfig = { aspectRatio: ratio };
this.angularCropper.cropper.setAspectRatio(ratio);
}
}