Update Angular 18, ng-select, quill editor, ngx-currency, Umbau business-detail, edit-business, commercial-lsitings, remove ng-prime
This commit is contained in:
@@ -1,11 +1,13 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { Component } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
||||
import { initFlowbite } from 'flowbite';
|
||||
import { SidebarModule } from 'primeng/sidebar';
|
||||
import { SharedModule } from '../../shared/shared/shared.module';
|
||||
@Component({
|
||||
selector: 'app-footer',
|
||||
standalone: true,
|
||||
imports: [SharedModule, SidebarModule],
|
||||
imports: [CommonModule, FormsModule, RouterModule, FontAwesomeModule],
|
||||
templateUrl: './footer.component.html',
|
||||
styleUrl: './footer.component.scss',
|
||||
})
|
||||
|
||||
@@ -87,18 +87,30 @@
|
||||
class="flex flex-col font-medium p-4 md:p-0 mt-4 border border-gray-100 rounded-lg bg-gray-50 md:space-x-8 rtl:space-x-reverse md:flex-row md:mt-0 md:border-0 md:bg-white dark:bg-gray-800 md:dark:bg-gray-900 dark:border-gray-700"
|
||||
>
|
||||
<li>
|
||||
<a class="block py-2 px-3 text-white bg-blue-700 rounded md:bg-transparent md:text-blue-700 md:p-0 md:dark:text-blue-500" aria-current="page">Businesses</a>
|
||||
<a
|
||||
routerLinkActive="active-link"
|
||||
routerLink="/businessListings"
|
||||
[ngClass]="{ 'bg-blue-700 text-white md:text-blue-700 md:bg-transparent md:dark:text-blue-500': isActive('/businessListings') }"
|
||||
class="block py-2 px-3 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 dark:text-white md:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700"
|
||||
aria-current="page"
|
||||
>Businesses</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 dark:text-white md:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700"
|
||||
routerLinkActive="active-link"
|
||||
routerLink="/commercialPropertyListings"
|
||||
[ngClass]="{ 'bg-blue-700 text-white md:text-blue-700 md:bg-transparent md:dark:text-blue-500': isActive('/commercialPropertyListings') }"
|
||||
class="block py-2 px-3 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 dark:text-white md:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700"
|
||||
>Properties</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="#"
|
||||
class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 dark:text-white md:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700"
|
||||
routerLinkActive="active-link"
|
||||
routerLink="/brokerListings"
|
||||
[ngClass]="{ 'bg-blue-700 text-white md:text-blue-700 md:bg-transparent md:dark:text-blue-500': isActive('/brokerListings') }"
|
||||
class="block py-2 px-3 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 dark:text-white md:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700"
|
||||
>Professionals</a
|
||||
>
|
||||
</li>
|
||||
|
||||
@@ -1,14 +1,9 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { Component } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
import { Router, RouterModule } from '@angular/router';
|
||||
import { faUserGear } from '@fortawesome/free-solid-svg-icons';
|
||||
import { initFlowbite } from 'flowbite';
|
||||
import { KeycloakService } from 'keycloak-angular';
|
||||
import { MenuItem } from 'primeng/api';
|
||||
import { ButtonModule } from 'primeng/button';
|
||||
import { MenubarModule } from 'primeng/menubar';
|
||||
import { OverlayPanelModule } from 'primeng/overlaypanel';
|
||||
import { TabMenuModule } from 'primeng/tabmenu';
|
||||
import { Observable } from 'rxjs';
|
||||
import { KeycloakUser } from '../../../../../bizmatch-server/src/models/main.model';
|
||||
import { environment } from '../../../environments/environment';
|
||||
@@ -16,7 +11,7 @@ import { map2User } from '../../utils/utils';
|
||||
@Component({
|
||||
selector: 'header',
|
||||
standalone: true,
|
||||
imports: [CommonModule, MenubarModule, ButtonModule, OverlayPanelModule, TabMenuModule],
|
||||
imports: [CommonModule, RouterModule],
|
||||
templateUrl: './header.component.html',
|
||||
styleUrl: './header.component.scss',
|
||||
})
|
||||
@@ -24,9 +19,6 @@ export class HeaderComponent {
|
||||
public buildVersion = environment.buildVersion;
|
||||
user$: Observable<KeycloakUser>;
|
||||
user: KeycloakUser;
|
||||
public tabItems: MenuItem[];
|
||||
public loginItems: MenuItem[];
|
||||
public menuItems: MenuItem[];
|
||||
activeItem;
|
||||
faUserGear = faUserGear;
|
||||
constructor(public keycloakService: KeycloakService, private router: Router) {}
|
||||
@@ -52,4 +44,7 @@ export class HeaderComponent {
|
||||
register() {
|
||||
this.keycloakService.register({ redirectUri: `${window.location.origin}/account` });
|
||||
}
|
||||
isActive(route: string): boolean {
|
||||
return this.router.url === route;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
<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>
|
||||
<!-- <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>
|
||||
<!-- <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>
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
import { Component, ViewChild } from '@angular/core';
|
||||
import { AngularCropperjsModule, CropperComponent } from 'angular-cropperjs';
|
||||
import { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog';
|
||||
import { FileUpload, FileUploadModule } from 'primeng/fileupload';
|
||||
import { SelectButtonModule } from 'primeng/selectbutton';
|
||||
import { KeyValueRatio } from '../../../../../bizmatch-server/src/models/main.model';
|
||||
import { ImageService } from '../../services/image.service';
|
||||
import { LoadingService } from '../../services/loading.service';
|
||||
@@ -15,36 +12,35 @@ export const stateOptions: KeyValueRatio[] = [
|
||||
@Component({
|
||||
selector: 'app-image-cropper',
|
||||
standalone: true,
|
||||
imports: [SharedModule, FileUploadModule, AngularCropperjsModule, SelectButtonModule],
|
||||
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
|
||||
fileUpload: FileUpload;
|
||||
value: number = stateOptions[0].value;
|
||||
cropperConfig = { aspectRatio: this.value };
|
||||
ratioVariable: boolean;
|
||||
stateOptions = stateOptions;
|
||||
constructor(private loadingService: LoadingService, private imageUploadService: ImageService, public config: DynamicDialogConfig, public ref: DynamicDialogRef) {}
|
||||
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);
|
||||
}
|
||||
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();
|
||||
}
|
||||
// cancelUpload() {
|
||||
// this.fileUpload.clear();
|
||||
// this.ref.close();
|
||||
// }
|
||||
changeAspectRation(ratio: number) {
|
||||
this.cropperConfig = { aspectRatio: ratio };
|
||||
this.angularCropper.cropper.setAspectRatio(ratio);
|
||||
|
||||
@@ -1,115 +0,0 @@
|
||||
// @layer primeng {
|
||||
app-inputnumber,
|
||||
.p-inputnumber {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.p-inputnumber-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,
|
||||
.p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-stacked .p-inputnumber-input {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-stacked .p-inputnumber-button-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {
|
||||
order: 3;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-horizontal .p-inputnumber-input {
|
||||
order: 2;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {
|
||||
order: 1;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-vertical {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {
|
||||
order: 1;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-vertical .p-inputnumber-input {
|
||||
order: 2;
|
||||
border-radius: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {
|
||||
order: 3;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.p-inputnumber-input {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.p-fluid app-inputnumber,
|
||||
.p-fluid .p-inputnumber {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.p-fluid .p-inputnumber .p-inputnumber-input {
|
||||
width: 1%;
|
||||
}
|
||||
|
||||
.p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.p-inputnumber-clear-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -0.5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.p-inputnumber-clearable {
|
||||
position: relative;
|
||||
}
|
||||
// }
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user