@rolatech/angular-property 20.0.0-beta.8 → 20.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/{rolatech-angular-property-property-filter-icon.component-DbzGJdxV.mjs → rolatech-angular-property-property-filter-icon.component-CO2B-Na5.mjs} +7 -7
- package/fesm2022/rolatech-angular-property-property-filter-icon.component-CO2B-Na5.mjs.map +1 -0
- package/fesm2022/{rolatech-angular-property-property-index.component-C-eBtys3.mjs → rolatech-angular-property-property-index.component-Birv1xyB.mjs} +6 -6
- package/fesm2022/rolatech-angular-property-property-index.component-Birv1xyB.mjs.map +1 -0
- package/fesm2022/{rolatech-angular-property-property-manage-viewings-index.component-Ae_OA7vE.mjs → rolatech-angular-property-property-manage-viewings-index.component-Dq8My7Sy.mjs} +5 -5
- package/fesm2022/{rolatech-angular-property-property-manage-viewings-index.component-Ae_OA7vE.mjs.map → rolatech-angular-property-property-manage-viewings-index.component-Dq8My7Sy.mjs.map} +1 -1
- package/fesm2022/{rolatech-angular-property-rolatech-angular-property-BcHHSS2T.mjs → rolatech-angular-property-rolatech-angular-property-CH6CKvP2.mjs} +452 -409
- package/fesm2022/rolatech-angular-property-rolatech-angular-property-CH6CKvP2.mjs.map +1 -0
- package/fesm2022/rolatech-angular-property.mjs +1 -1
- package/index.d.ts +4 -2
- package/package.json +5 -5
- package/themes/_default.scss +1 -1
- package/fesm2022/rolatech-angular-property-property-filter-icon.component-DbzGJdxV.mjs.map +0 -1
- package/fesm2022/rolatech-angular-property-property-index.component-C-eBtys3.mjs.map +0 -1
- package/fesm2022/rolatech-angular-property-rolatech-angular-property-BcHHSS2T.mjs.map +0 -1
|
@@ -4,16 +4,17 @@ import * as i1$4 from '@angular/material/button';
|
|
|
4
4
|
import { MatButtonModule } from '@angular/material/button';
|
|
5
5
|
import * as i4 from '@angular/material/menu';
|
|
6
6
|
import { MatMenuModule } from '@angular/material/menu';
|
|
7
|
+
import * as i3$2 from '@angular/material/paginator';
|
|
7
8
|
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
|
8
9
|
import { MatSnackBar } from '@angular/material/snack-bar';
|
|
9
10
|
import { MatTableModule } from '@angular/material/table';
|
|
10
11
|
import * as i1$1 from '@angular/router';
|
|
11
12
|
import { RouterLink, RouterModule, Router, ActivatedRoute, RouterLinkActive, RouterOutlet } from '@angular/router';
|
|
12
|
-
import { ThumbnailComponent, ImagePlaceholderComponent, ToolbarComponent, SpinnerComponent, ImagePreviewDialogComponent, BaseComponent, AcceptDialogComponent, RejectDialogComponent, RichLabelComponent, AngularComponentsModule, ConfirmationDialogComponent, TabsComponent, TabComponent, EmptyComponent, ContainerComponent, ListComponent, MediaListComponent, MediaListItemComponent,
|
|
13
|
-
import { PropertyService, FeatureService
|
|
13
|
+
import { ThumbnailComponent, ImagePlaceholderComponent, ToolbarComponent, SpinnerComponent, ImagePreviewDialogComponent, BaseComponent, AcceptDialogComponent, RejectDialogComponent, RichLabelComponent, AngularComponentsModule, ConfirmationDialogComponent, TabsComponent, TabComponent, EmptyComponent, ContainerComponent, ListComponent, MediaListComponent, MediaListItemComponent, VideoUpload } from '@rolatech/angular-components';
|
|
14
|
+
import { PropertyService, FeatureService } from '@rolatech/angular-services';
|
|
14
15
|
import * as i1 from '@angular/common';
|
|
15
16
|
import { CommonModule, NgClass, isPlatformBrowser, ViewportScroller, KeyValuePipe, Location } from '@angular/common';
|
|
16
|
-
import { FixedPipe, AngularCommonModule, OptionsFormatPipe, APP_CONFIG, DecimalDirective
|
|
17
|
+
import { FixedPipe, AngularCommonModule, OptionsFormatPipe, APP_CONFIG, DecimalDirective } from '@rolatech/angular-common';
|
|
17
18
|
import * as i2 from '@angular/material/icon';
|
|
18
19
|
import { MatIconModule, MatIcon } from '@angular/material/icon';
|
|
19
20
|
import { MatDialog } from '@angular/material/dialog';
|
|
@@ -29,7 +30,7 @@ import * as i5 from '@angular/material/select';
|
|
|
29
30
|
import { MatSelectModule } from '@angular/material/select';
|
|
30
31
|
import * as i1$5 from '@angular/material/chips';
|
|
31
32
|
import { MatChipsModule } from '@angular/material/chips';
|
|
32
|
-
import { startWith, map, defer, forkJoin } from 'rxjs';
|
|
33
|
+
import { startWith, map, defer, forkJoin, from, concatMap, take, Observable } from 'rxjs';
|
|
33
34
|
import { ENTER, COMMA } from '@angular/cdk/keycodes';
|
|
34
35
|
import * as i4$2 from '@angular/material/autocomplete';
|
|
35
36
|
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
|
@@ -44,12 +45,12 @@ import { CommentsComponent } from '@rolatech/angular-comment';
|
|
|
44
45
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
45
46
|
import * as i4$1 from '@angular/cdk/text-field';
|
|
46
47
|
import { TextFieldModule } from '@angular/cdk/text-field';
|
|
47
|
-
import * as
|
|
48
|
+
import * as i7$1 from '@angular/material/radio';
|
|
48
49
|
import { MatRadioModule } from '@angular/material/radio';
|
|
49
50
|
import { MomentDateAdapter } from '@angular/material-moment-adapter';
|
|
50
51
|
import * as i3$1 from '@angular/material/progress-spinner';
|
|
51
52
|
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
52
|
-
import * as i8
|
|
53
|
+
import * as i8 from '@angular/material/progress-bar';
|
|
53
54
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
54
55
|
import * as i1$6 from '@angular/material/checkbox';
|
|
55
56
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
@@ -281,10 +282,10 @@ const ViewingTime = [
|
|
|
281
282
|
class PropertyManageItemComponent {
|
|
282
283
|
hasClass = true;
|
|
283
284
|
el = inject(ElementRef);
|
|
284
|
-
property = input.required();
|
|
285
|
-
thumbnail = input();
|
|
285
|
+
property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
|
|
286
|
+
thumbnail = input(...(ngDevMode ? [undefined, { debugName: "thumbnail" }] : []));
|
|
286
287
|
status = PropertyStatus;
|
|
287
|
-
list = input(false, { transform: booleanAttribute });
|
|
288
|
+
list = input(false, ...(ngDevMode ? [{ debugName: "list", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
288
289
|
constructor() {
|
|
289
290
|
effect(() => {
|
|
290
291
|
if (this.list()) {
|
|
@@ -298,10 +299,10 @@ class PropertyManageItemComponent {
|
|
|
298
299
|
publish() { }
|
|
299
300
|
archived() { }
|
|
300
301
|
delete() { }
|
|
301
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
302
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
302
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
303
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageItemComponent, isStandalone: true, selector: "rolatech-property-manage-item", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-property-manage-item": "this.hasClass" } }, ngImport: i0, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (property().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media ? property().media[0].url : ''\" size=\"medium\" mode=\"full\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">\n {{ property().title }}\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ property().price | fixed }}</div>\n</div>\n", styles: ["rolatech-property-manage-item{--rt-property-view-item-margin: 16px;width:calc(100% / var(--rt-property-view-items-per-row) - var(--rt-property-view-item-margin) - .01px)}rolatech-property-manage-item[list]{--rt-property-view-items-per-row: 1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "pipe", type: FixedPipe, name: "fixed" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
303
304
|
}
|
|
304
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageItemComponent, decorators: [{
|
|
305
306
|
type: Component,
|
|
306
307
|
args: [{ selector: 'rolatech-property-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule, FixedPipe], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (property().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media ? property().media[0].url : ''\" size=\"medium\" mode=\"full\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">\n {{ property().title }}\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ property().price | fixed }}</div>\n</div>\n", styles: ["rolatech-property-manage-item{--rt-property-view-item-margin: 16px;width:calc(100% / var(--rt-property-view-items-per-row) - var(--rt-property-view-item-margin) - .01px)}rolatech-property-manage-item[list]{--rt-property-view-items-per-row: 1}\n"] }]
|
|
307
308
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -311,7 +312,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
311
312
|
|
|
312
313
|
class PropertyReviewIndexComponent {
|
|
313
314
|
hasClass = true;
|
|
314
|
-
paginator = viewChild(MatPaginator);
|
|
315
|
+
paginator = viewChild(MatPaginator, ...(ngDevMode ? [{ debugName: "paginator" }] : []));
|
|
315
316
|
dialog = inject(MatDialog);
|
|
316
317
|
snackBar = inject(MatSnackBar);
|
|
317
318
|
propertyService = inject(PropertyService);
|
|
@@ -328,10 +329,10 @@ class PropertyReviewIndexComponent {
|
|
|
328
329
|
},
|
|
329
330
|
});
|
|
330
331
|
}
|
|
331
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
332
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
332
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyReviewIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
333
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyReviewIndexComponent, isStandalone: true, selector: "rolatech-property-review-index", host: { properties: { "class.rolatech-property-manage-index": "this.hasClass" } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "<rolatech-toolbar title=\"Properties\"> </rolatech-toolbar>\n@if (isLoading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties; track $index) {\n <rolatech-property-manage-item\n list\n [property]=\"item\"\n routerLink=\"./properties/{{ item.id }}\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n\n <!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: PropertyManageItemComponent, selector: "rolatech-property-manage-item", inputs: ["property", "thumbnail", "list"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
333
334
|
}
|
|
334
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
335
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyReviewIndexComponent, decorators: [{
|
|
335
336
|
type: Component,
|
|
336
337
|
args: [{ selector: 'rolatech-property-review-index', imports: [
|
|
337
338
|
MatButtonModule,
|
|
@@ -350,9 +351,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
350
351
|
}] } });
|
|
351
352
|
|
|
352
353
|
class PropertyMediaComponent {
|
|
354
|
+
hasClass = true;
|
|
355
|
+
disableScrollbar = true;
|
|
353
356
|
dialog = inject(MatDialog);
|
|
354
|
-
media = input([]);
|
|
355
|
-
min = input(false);
|
|
357
|
+
media = input([], ...(ngDevMode ? [{ debugName: "media" }] : []));
|
|
358
|
+
min = input(false, ...(ngDevMode ? [{ debugName: "min" }] : []));
|
|
356
359
|
mediaIndex = 0;
|
|
357
360
|
onImageClick(i) {
|
|
358
361
|
const dialogRef = this.dialog.open(ImagePreviewDialogComponent, {
|
|
@@ -368,27 +371,33 @@ class PropertyMediaComponent {
|
|
|
368
371
|
});
|
|
369
372
|
dialogRef.afterClosed().subscribe((result) => { });
|
|
370
373
|
}
|
|
371
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
372
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
374
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
375
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyMediaComponent, isStandalone: true, selector: "rolatech-property-media", inputs: { media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-property-medi": "this.hasClass", "class.scrollbar-hide": "this.disableScrollbar" } }, ngImport: i0, template: "<div>\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media() ? media()[mediaIndex].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"media-container\">\n @for (media of media(); track media; let index = $index) {\n <div\n class=\"flex flex-row mt-3 mr-3 cursor-pointer rounded-md min-w-32\"\n (click)=\"mediaIndex = index\"\n [ngClass]=\"mediaIndex === index ? '' : 'opacity-30'\"\n >\n <rolatech-thumbnail [src]=\"media.url\" size=\"small\"></rolatech-thumbnail>\n </div>\n }\n </div>\n</div>\n", styles: [".media-container{position:relative;display:flex;padding-bottom:16px;overflow-x:scroll}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-rich-item{display:flex;position:relative;cursor:pointer;flex-direction:column}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
373
376
|
}
|
|
374
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
377
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyMediaComponent, decorators: [{
|
|
375
378
|
type: Component,
|
|
376
|
-
args: [{ selector: 'rolatech-property-media', imports: [NgClass, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div>\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media() ? media()[mediaIndex].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n @for (media of media(); track media; let index = $index) {\n
|
|
377
|
-
}]
|
|
379
|
+
args: [{ selector: 'rolatech-property-media', imports: [NgClass, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div>\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media() ? media()[mediaIndex].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"media-container\">\n @for (media of media(); track media; let index = $index) {\n <div\n class=\"flex flex-row mt-3 mr-3 cursor-pointer rounded-md min-w-32\"\n (click)=\"mediaIndex = index\"\n [ngClass]=\"mediaIndex === index ? '' : 'opacity-30'\"\n >\n <rolatech-thumbnail [src]=\"media.url\" size=\"small\"></rolatech-thumbnail>\n </div>\n }\n </div>\n</div>\n", styles: [".media-container{position:relative;display:flex;padding-bottom:16px;overflow-x:scroll}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-rich-item{display:flex;position:relative;cursor:pointer;flex-direction:column}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
|
|
380
|
+
}], propDecorators: { hasClass: [{
|
|
381
|
+
type: HostBinding,
|
|
382
|
+
args: ['class.rolatech-property-medi']
|
|
383
|
+
}], disableScrollbar: [{
|
|
384
|
+
type: HostBinding,
|
|
385
|
+
args: ['class.scrollbar-hide']
|
|
386
|
+
}] } });
|
|
378
387
|
|
|
379
388
|
class PropertyFeaturesComponent {
|
|
380
|
-
features = input.required();
|
|
381
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
382
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
389
|
+
features = input.required(...(ngDevMode ? [{ debugName: "features" }] : []));
|
|
390
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyFeaturesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
391
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyFeaturesComponent, isStandalone: true, selector: "rolatech-property-features", inputs: { features: { classPropertyName: "features", publicName: "features", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Features</div>\n <div class=\"flex flex-row flex-wrap items-center font-thin text-sm\">\n @for (feature of features(); track feature) {\n <div class=\"flex items-center mr-2\">\n <mat-icon>check</mat-icon>\n <span>{{ feature.value.name }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
383
392
|
}
|
|
384
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
393
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyFeaturesComponent, decorators: [{
|
|
385
394
|
type: Component,
|
|
386
395
|
args: [{ selector: 'rolatech-property-features', imports: [CommonModule, MatIconModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Features</div>\n <div class=\"flex flex-row flex-wrap items-center font-thin text-sm\">\n @for (feature of features(); track feature) {\n <div class=\"flex items-center mr-2\">\n <mat-icon>check</mat-icon>\n <span>{{ feature.value.name }}</span>\n </div>\n }\n </div>\n</div>\n" }]
|
|
387
396
|
}] });
|
|
388
397
|
|
|
389
398
|
class PropertyLocationComponent {
|
|
390
399
|
platformId = inject(PLATFORM_ID);
|
|
391
|
-
location = input.required();
|
|
400
|
+
location = input.required(...(ngDevMode ? [{ debugName: "location" }] : []));
|
|
392
401
|
mapElementRef = viewChild.required('mapElement');
|
|
393
402
|
map;
|
|
394
403
|
autocompleteService;
|
|
@@ -435,23 +444,23 @@ class PropertyLocationComponent {
|
|
|
435
444
|
}
|
|
436
445
|
});
|
|
437
446
|
}
|
|
438
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
439
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0
|
|
447
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
448
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: PropertyLocationComponent, isStandalone: true, selector: "rolatech-property-location", inputs: { location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "mapElementRef", first: true, predicate: ["mapElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Location</div>\n <div class=\"bg-[--rt-raised-background]\">\n <div class=\"map-container\">\n <div #mapElement id=\"map\"></div>\n </div>\n <!-- <google-map width=\"100%\" #mapRef [options]=\"options\">\n <map-advanced-marker #marker=\"mapAdvancedMarker\" />\n </google-map> -->\n </div>\n</div>\n", styles: [".aspect-ratio-16-9{position:relative;width:100%;padding-bottom:56.25%;height:0}.map-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden}#map{position:absolute;top:0;left:0;width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: GoogleMapsModule }] });
|
|
440
449
|
}
|
|
441
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
450
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyLocationComponent, decorators: [{
|
|
442
451
|
type: Component,
|
|
443
452
|
args: [{ selector: 'rolatech-property-location', imports: [CommonModule, GoogleMapsModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Location</div>\n <div class=\"bg-[--rt-raised-background]\">\n <div class=\"map-container\">\n <div #mapElement id=\"map\"></div>\n </div>\n <!-- <google-map width=\"100%\" #mapRef [options]=\"options\">\n <map-advanced-marker #marker=\"mapAdvancedMarker\" />\n </google-map> -->\n </div>\n</div>\n", styles: [".aspect-ratio-16-9{position:relative;width:100%;padding-bottom:56.25%;height:0}.map-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden}#map{position:absolute;top:0;left:0;width:100%;height:100%}\n"] }]
|
|
444
453
|
}] });
|
|
445
454
|
|
|
446
455
|
class PropertyOwnerRendererComponent {
|
|
447
|
-
name = input();
|
|
448
|
-
avatar = input();
|
|
449
|
-
username = input();
|
|
450
|
-
subtitle = input();
|
|
451
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
452
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
456
|
+
name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
|
|
457
|
+
avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
|
|
458
|
+
username = input(...(ngDevMode ? [undefined, { debugName: "username" }] : []));
|
|
459
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
460
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOwnerRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
461
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyOwnerRendererComponent, isStandalone: true, selector: "rolatech-property-owner-renderer", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
453
462
|
}
|
|
454
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
463
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOwnerRendererComponent, decorators: [{
|
|
455
464
|
type: Component,
|
|
456
465
|
args: [{ selector: 'rolatech-property-owner-renderer', imports: [AngularCommonModule, MatIconModule], template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"] }]
|
|
457
466
|
}] });
|
|
@@ -476,10 +485,10 @@ class PropertyAgentUpdate {
|
|
|
476
485
|
ngDoCheck() {
|
|
477
486
|
this.output.emit(this.selectedAgentId);
|
|
478
487
|
}
|
|
479
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
480
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
488
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyAgentUpdate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
489
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyAgentUpdate, isStandalone: true, selector: "rolatech-property-agent-update", outputs: { output: "output" }, ngImport: i0, template: "@if (!loading) {\n<mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"selectedAgentId\">\n @for (item of agents; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n</mat-form-field>\n\n}\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }] });
|
|
481
490
|
}
|
|
482
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
491
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyAgentUpdate, decorators: [{
|
|
483
492
|
type: Component,
|
|
484
493
|
args: [{ selector: 'rolatech-property-agent-update', imports: [
|
|
485
494
|
CommonModule,
|
|
@@ -596,10 +605,10 @@ class PropertyReviewDetailComponent extends BaseComponent {
|
|
|
596
605
|
},
|
|
597
606
|
});
|
|
598
607
|
}
|
|
599
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
600
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
608
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyReviewDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
609
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyReviewDetailComponent, isStandalone: true, selector: "rolatech-property-review-detail", usesInheritance: true, ngImport: i0, template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: PropertyOwnerRendererComponent, selector: "rolatech-property-owner-renderer", inputs: ["name", "avatar", "username", "subtitle"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }] });
|
|
601
610
|
}
|
|
602
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
611
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyReviewDetailComponent, decorators: [{
|
|
603
612
|
type: Component,
|
|
604
613
|
args: [{ selector: 'rolatech-property-review-detail', imports: [
|
|
605
614
|
CommonModule,
|
|
@@ -611,7 +620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
611
620
|
PropertyLocationComponent,
|
|
612
621
|
MatButtonModule,
|
|
613
622
|
PropertyOwnerRendererComponent
|
|
614
|
-
], template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n" }]
|
|
623
|
+
], template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n" }]
|
|
615
624
|
}] });
|
|
616
625
|
|
|
617
626
|
const propertyReviewRoutes = [
|
|
@@ -626,7 +635,7 @@ const propertyReviewRoutes = [
|
|
|
626
635
|
];
|
|
627
636
|
|
|
628
637
|
class FeatureManageItemComponent {
|
|
629
|
-
feature = input.required();
|
|
638
|
+
feature = input.required(...(ngDevMode ? [{ debugName: "feature" }] : []));
|
|
630
639
|
addOnBlur = true;
|
|
631
640
|
delete = output();
|
|
632
641
|
save = output();
|
|
@@ -640,10 +649,10 @@ class FeatureManageItemComponent {
|
|
|
640
649
|
onEdit() {
|
|
641
650
|
this.edit.emit(this.feature());
|
|
642
651
|
}
|
|
643
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
644
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
652
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
653
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: FeatureManageItemComponent, isStandalone: true, selector: "rolatech-feature-manage-item", inputs: { feature: { classPropertyName: "feature", publicName: "feature", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { delete: "delete", save: "save", edit: "edit" }, ngImport: i0, template: "<div class=\"group flex justify-between items-center h-14 hover:bg-[--rt-raised-background] cursor-pointer px-2\">\n <div class=\"flex\">\n <div class=\"min-w-[150px] mr-3\">{{ feature().name }}</div>\n <div class=\"overflow-hidden line-clamp-1\">\n {{ feature().values! | options }}\n </div>\n </div>\n <div class=\"flex justify-end max-w-24 w-24 invisible group-hover:visible\">\n <button mat-icon-button (click)=\"onEdit()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete()\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n</div>\n<mat-divider></mat-divider>\n", styles: ["mat-icon{scale:.9}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "pipe", type: OptionsFormatPipe, name: "options" }] });
|
|
645
654
|
}
|
|
646
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
655
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageItemComponent, decorators: [{
|
|
647
656
|
type: Component,
|
|
648
657
|
args: [{ selector: 'rolatech-feature-manage-item', imports: [
|
|
649
658
|
MatChipsModule,
|
|
@@ -691,10 +700,10 @@ class FeatureManageItemAddComponent {
|
|
|
691
700
|
ngDoCheck() {
|
|
692
701
|
this.output.emit(this.feature);
|
|
693
702
|
}
|
|
694
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
695
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
703
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageItemAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
704
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: FeatureManageItemAddComponent, isStandalone: true, selector: "rolatech-feature-manage-item-add", outputs: { cancel: "cancel", save: "save", output: "output" }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"p-1\" i18n>Feature</div>\n <form>\n <mat-form-field appearance=\"fill\">\n <input matInput placeholder=\"Name\" type=\"text\" [(ngModel)]=\"feature.name\" [ngModelOptions]=\"{ standalone: true }\" i18n />\n </mat-form-field>\n <mat-form-field>\n <mat-chip-grid #chipGrid aria-label=\"Enter values\">\n @for (value of feature.values; track value) {\n <mat-chip-row\n (removed)=\"removeValue(value)\"\n [editable]=\"true\"\n [aria-description]=\"'press enter to edit ' + value.name\"\n >\n {{ value.name }}\n <button matChipRemove [attr.aria-label]=\"'remove ' + value.name\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n <input\n placeholder=\"Value\"\n [matChipInputFor]=\"chipGrid\"\n [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n [matChipInputAddOnBlur]=\"addOnBlur\"\n (matChipInputTokenEnd)=\"addFeatureValues($event)\"\n i18n\n />\n </mat-chip-grid>\n </mat-form-field>\n </form>\n</div>\n@if (action) {\n <div class=\"flex items-center justify-end\">\n <button mat-button (click)=\"onCancel()\" i18n>Cancel</button>\n <button mat-flat-button (click)=\"onSave()\" i18n>Save</button>\n </div>\n}\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1$5.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$5.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$5.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$5.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }] });
|
|
696
705
|
}
|
|
697
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
706
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageItemAddComponent, decorators: [{
|
|
698
707
|
type: Component,
|
|
699
708
|
args: [{ selector: 'rolatech-feature-manage-item-add', imports: [MatChipsModule, MatButtonModule, MatFormFieldModule, AngularCommonModule, AngularComponentsModule, MatIconModule], template: "<div class=\"flex flex-col\">\n <div class=\"p-1\" i18n>Feature</div>\n <form>\n <mat-form-field appearance=\"fill\">\n <input matInput placeholder=\"Name\" type=\"text\" [(ngModel)]=\"feature.name\" [ngModelOptions]=\"{ standalone: true }\" i18n />\n </mat-form-field>\n <mat-form-field>\n <mat-chip-grid #chipGrid aria-label=\"Enter values\">\n @for (value of feature.values; track value) {\n <mat-chip-row\n (removed)=\"removeValue(value)\"\n [editable]=\"true\"\n [aria-description]=\"'press enter to edit ' + value.name\"\n >\n {{ value.name }}\n <button matChipRemove [attr.aria-label]=\"'remove ' + value.name\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n <input\n placeholder=\"Value\"\n [matChipInputFor]=\"chipGrid\"\n [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n [matChipInputAddOnBlur]=\"addOnBlur\"\n (matChipInputTokenEnd)=\"addFeatureValues($event)\"\n i18n\n />\n </mat-chip-grid>\n </mat-form-field>\n </form>\n</div>\n@if (action) {\n <div class=\"flex items-center justify-end\">\n <button mat-button (click)=\"onCancel()\" i18n>Cancel</button>\n <button mat-flat-button (click)=\"onSave()\" i18n>Save</button>\n </div>\n}\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
700
709
|
}] });
|
|
@@ -710,7 +719,7 @@ class FeatureManageIndexComponent extends BaseComponent {
|
|
|
710
719
|
featureControl = new FormControl();
|
|
711
720
|
separatorKeysCodes = [ENTER, COMMA];
|
|
712
721
|
featureInput = viewChild.required('featureInput');
|
|
713
|
-
matAutocomplete = viewChild('auto');
|
|
722
|
+
matAutocomplete = viewChild('auto', ...(ngDevMode ? [{ debugName: "matAutocomplete" }] : []));
|
|
714
723
|
ngOnInit() {
|
|
715
724
|
this.findFeatures();
|
|
716
725
|
}
|
|
@@ -821,10 +830,10 @@ class FeatureManageIndexComponent extends BaseComponent {
|
|
|
821
830
|
this.featureInput().nativeElement.value = '';
|
|
822
831
|
this.featureControl.setValue(null);
|
|
823
832
|
}
|
|
824
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
825
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
833
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
834
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: FeatureManageIndexComponent, isStandalone: true, selector: "rolatech-feature-manage-index", viewQueries: [{ propertyName: "featureInput", first: true, predicate: ["featureInput"], descendants: true, isSignal: true }, { propertyName: "matAutocomplete", first: true, predicate: ["auto"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Features\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add Feature</span>\n </button>\n </div>\n</rolatech-toolbar>\n<div class=\"p-3\">\n @for (item of features; track $index) {\n <rolatech-feature-manage-item\n [feature]=\"item\"\n (delete)=\"onDeleteFeature($event)\"\n (edit)=\"onUpdateFeature($event)\"\n ></rolatech-feature-manage-item>\n }\n <div class=\"mt-3\">\n @if (add) {\n <rolatech-feature-manage-item-add (save)=\"saveFeature($event)\" (cancel)=\"add = false\"></rolatech-feature-manage-item-add>\n } @else {\n <button mat-stroked-button (click)=\"add = true\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n }\n </div>\n</div>\n", styles: [".features-chip-list{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: FeatureManageItemComponent, selector: "rolatech-feature-manage-item", inputs: ["feature"], outputs: ["delete", "save", "edit"] }, { kind: "component", type: FeatureManageItemAddComponent, selector: "rolatech-feature-manage-item-add", outputs: ["cancel", "save", "output"] }] });
|
|
826
835
|
}
|
|
827
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
836
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageIndexComponent, decorators: [{
|
|
828
837
|
type: Component,
|
|
829
838
|
args: [{ selector: 'rolatech-feature-manage-index', imports: [
|
|
830
839
|
MatDividerModule,
|
|
@@ -843,10 +852,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
843
852
|
}] });
|
|
844
853
|
|
|
845
854
|
class FeatureManageDetailComponent {
|
|
846
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
847
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
855
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
856
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: FeatureManageDetailComponent, isStandalone: true, selector: "rolatech-feature-manage-detail", ngImport: i0, template: "<p>feature-manage-detail works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
848
857
|
}
|
|
849
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
858
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FeatureManageDetailComponent, decorators: [{
|
|
850
859
|
type: Component,
|
|
851
860
|
args: [{ selector: 'rolatech-feature-manage-detail', imports: [CommonModule], template: "<p>feature-manage-detail works!</p>\n" }]
|
|
852
861
|
}] });
|
|
@@ -863,17 +872,17 @@ const featureManageRoutes = [
|
|
|
863
872
|
];
|
|
864
873
|
|
|
865
874
|
class PropertyOfferItemComponent {
|
|
866
|
-
offer = input.required();
|
|
875
|
+
offer = input.required(...(ngDevMode ? [{ debugName: "offer" }] : []));
|
|
867
876
|
status = PropertyOfferStatus;
|
|
868
877
|
total = computed(() => {
|
|
869
878
|
return (this.offer().amount / 100).toFixed(2);
|
|
870
|
-
});
|
|
871
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
872
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
879
|
+
}, ...(ngDevMode ? [{ debugName: "total" }] : []));
|
|
880
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
881
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyOfferItemComponent, isStandalone: true, selector: "rolatech-property-offer-item", inputs: { offer: { classPropertyName: "offer", publicName: "offer", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (offer().property.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer().property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer().property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer().property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer().property.price | fixed }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
873
882
|
}
|
|
874
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
883
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferItemComponent, decorators: [{
|
|
875
884
|
type: Component,
|
|
876
|
-
args: [{ selector: 'rolatech-property-offer-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (offer().property.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer
|
|
885
|
+
args: [{ selector: 'rolatech-property-offer-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (offer().property.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer().property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer().property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer().property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer().property.price | fixed }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
877
886
|
}] });
|
|
878
887
|
|
|
879
888
|
class PropertyManageOfferIndexComponent extends BaseComponent {
|
|
@@ -944,10 +953,10 @@ class PropertyManageOfferIndexComponent extends BaseComponent {
|
|
|
944
953
|
})
|
|
945
954
|
.join(',');
|
|
946
955
|
}
|
|
947
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
948
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
956
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
957
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageOfferIndexComponent, isStandalone: true, selector: "rolatech-property-manage-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Offers\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n</rolatech-tabs>\n<div>\n @if (offers) {\n @for (item of offers; track $index) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }] });
|
|
949
958
|
}
|
|
950
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
959
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageOfferIndexComponent, decorators: [{
|
|
951
960
|
type: Component,
|
|
952
961
|
args: [{ selector: 'rolatech-property-manage-offer-index', imports: [
|
|
953
962
|
CommonModule,
|
|
@@ -1039,12 +1048,12 @@ class PropertyManageOfferDetailComponent extends BaseComponent {
|
|
|
1039
1048
|
}
|
|
1040
1049
|
});
|
|
1041
1050
|
}
|
|
1042
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1043
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1051
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1052
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageOfferDetailComponent, isStandalone: true, selector: "rolatech-property-manage-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.propertyTitle }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
1044
1053
|
}
|
|
1045
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1054
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageOfferDetailComponent, decorators: [{
|
|
1046
1055
|
type: Component,
|
|
1047
|
-
args: [{ selector: 'rolatech-property-manage-offer-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, FixedPipe, MatButtonModule], template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.propertyTitle }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
|
|
1056
|
+
args: [{ selector: 'rolatech-property-manage-offer-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, FixedPipe, MatButtonModule], template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.propertyTitle }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
|
|
1048
1057
|
}] });
|
|
1049
1058
|
|
|
1050
1059
|
const propertyManageOffersRoutes = [
|
|
@@ -1060,9 +1069,9 @@ const propertyManageOffersRoutes = [
|
|
|
1060
1069
|
|
|
1061
1070
|
class PropertyFilterComponent {
|
|
1062
1071
|
towns = ['London'];
|
|
1063
|
-
filter = model(false);
|
|
1072
|
+
filter = model(false, ...(ngDevMode ? [{ debugName: "filter" }] : []));
|
|
1064
1073
|
minDate = new Date();
|
|
1065
|
-
propertyFilterIconComponent = defer(() => import('./rolatech-angular-property-property-filter-icon.component-
|
|
1074
|
+
propertyFilterIconComponent = defer(() => import('./rolatech-angular-property-property-filter-icon.component-CO2B-Na5.mjs').then((m) => m.PropertyFilterIconComponent));
|
|
1066
1075
|
searchOptions = {
|
|
1067
1076
|
town: '',
|
|
1068
1077
|
startDate: '',
|
|
@@ -1070,8 +1079,8 @@ class PropertyFilterComponent {
|
|
|
1070
1079
|
};
|
|
1071
1080
|
reset() { }
|
|
1072
1081
|
search() { }
|
|
1073
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1074
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1082
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1083
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyFilterComponent, isStandalone: true, selector: "rolatech-property-filter", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filter: "filterChange" }, ngImport: i0, template: "<!-- <div class=\"p-3\">\n <div class=\"bg-white p-3 flex items-center justify-between rounded-md\">\n <div class=\"flex items-center\">\n <mat-form-field subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" i18n-placeholder [(ngModel)]=\"searchOptions.town\">\n @for (Town of towns; track Town) {\n <mat-option [value]=\"Town\">\n {{ Town }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"flex gap-3\">\n <a mat-stroked-button class=\"w-[128px]\" (click)=\"reset()\" i18n>Reset</a>\n <ng-container *ngComponentOutlet=\"propertyFilterIconComponent | async\"></ng-container>\n <a mat-flat-button class=\"w-full\" (click)=\"search()\" i18n>Search</a>\n </div>\n </div>\n</div> -->\n<div\n [ngClass]=\"filter() ? 'transition-height duration-500 ease-in-out' : 'md:h-14 h-0 transition-height duration-500 ease-in-out'\"\n>\n <div\n class=\"min-w-[256px] md:min-w-[320px] h-full m-3 flex flex-row md:flex-col md:h-full items-center md:items-start shadow-inner shadow-light-400 md:shadow-none overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"w-full h-full\">\n <div class=\"flex flex-col md:flex-row h-in justify-center items-center gap-3\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" [(ngModel)]=\"searchOptions.city\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\">\n {{ town }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <input\n matInput\n placeholder=\"Available\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"available\"\n [(ngModel)]=\"searchOptions.available\"\n (dateInput)=\"searchOptions.available = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex w-full gap-3\">\n <a mat-stroked-button class=\"w-[128px]\" (click)=\"reset()\">Reset</a>\n <ng-container *ngComponentOutlet=\"propertyFilterIconComponent | async\"></ng-container>\n <a mat-flat-button class=\"w-full\" (click)=\"search()\">Search</a>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], animations: [
|
|
1075
1084
|
trigger('filter', [
|
|
1076
1085
|
state('collapsed', style({ height: '0px', minHeight: '0' })),
|
|
1077
1086
|
state('expanded', style({ height: '*' })),
|
|
@@ -1079,7 +1088,7 @@ class PropertyFilterComponent {
|
|
|
1079
1088
|
]),
|
|
1080
1089
|
] });
|
|
1081
1090
|
}
|
|
1082
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1091
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyFilterComponent, decorators: [{
|
|
1083
1092
|
type: Component,
|
|
1084
1093
|
args: [{ selector: 'rolatech-property-filter', imports: [
|
|
1085
1094
|
CommonModule,
|
|
@@ -1129,22 +1138,22 @@ class PropertyLayoutComponent extends BaseComponent {
|
|
|
1129
1138
|
// }
|
|
1130
1139
|
}
|
|
1131
1140
|
nextCategory() { }
|
|
1132
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1133
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1141
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1142
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PropertyLayoutComponent, isStandalone: true, selector: "rolatech-property-layout", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col min-w-[320px] max-w-[1280px] m-auto\">\n <rolatech-property-filter [(filter)]=\"filter\"></rolatech-property-filter>\n <div class=\"flex justify-between items-center\">\n <div class=\"p-3 text-2xl font-medium\" i18n>Properties</div>\n <button mat-button class=\"md:invisible\" (click)=\"filter = !filter\">\n <mat-icon>tune</mat-icon>\n <span>Filter</span>\n </button>\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n </div>\n</rolatech-container>\n", styles: [".property-layout-active{border-radius:var(--rt-rounded-base, 8px);background-color:var(-rt-base-background, #fff);color:var(--rt-brand-color, #000)}@media (max-width: 768px){.property-layout-active{background-color:var(--rt-text-primary, #000);color:var(--rt-text-primary-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyFilterComponent, selector: "rolatech-property-filter", inputs: ["filter"], outputs: ["filterChange"] }] });
|
|
1134
1143
|
}
|
|
1135
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyLayoutComponent, decorators: [{
|
|
1136
1145
|
type: Component,
|
|
1137
1146
|
args: [{ selector: 'rolatech-property-layout', imports: [AngularCommonModule, AngularComponentsModule, ContainerComponent, PropertyFilterComponent], template: "<rolatech-container>\n <div class=\"flex flex-col min-w-[320px] max-w-[1280px] m-auto\">\n <rolatech-property-filter [(filter)]=\"filter\"></rolatech-property-filter>\n <div class=\"flex justify-between items-center\">\n <div class=\"p-3 text-2xl font-medium\" i18n>Properties</div>\n <button mat-button class=\"md:invisible\" (click)=\"filter = !filter\">\n <mat-icon>tune</mat-icon>\n <span>Filter</span>\n </button>\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n </div>\n</rolatech-container>\n", styles: [".property-layout-active{border-radius:var(--rt-rounded-base, 8px);background-color:var(-rt-base-background, #fff);color:var(--rt-brand-color, #000)}@media (max-width: 768px){.property-layout-active{background-color:var(--rt-text-primary, #000);color:var(--rt-text-primary-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
|
|
1138
1147
|
}] });
|
|
1139
1148
|
|
|
1140
1149
|
class PropertyActionsComponent {
|
|
1141
|
-
property = input.required();
|
|
1150
|
+
property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
|
|
1142
1151
|
requestViewing = output();
|
|
1143
1152
|
offer = output();
|
|
1144
1153
|
deposit = output();
|
|
1145
1154
|
displayDeposit = computed(() => {
|
|
1146
1155
|
return (this.property().deposit / 100).toFixed(2);
|
|
1147
|
-
});
|
|
1156
|
+
}, ...(ngDevMode ? [{ debugName: "displayDeposit" }] : []));
|
|
1148
1157
|
onRequestViewing(property) {
|
|
1149
1158
|
this.requestViewing.emit(property);
|
|
1150
1159
|
}
|
|
@@ -1154,124 +1163,128 @@ class PropertyActionsComponent {
|
|
|
1154
1163
|
onDeposit(property) {
|
|
1155
1164
|
this.deposit.emit(property);
|
|
1156
1165
|
}
|
|
1157
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1158
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1166
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1167
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyActionsComponent, isStandalone: true, selector: "rolatech-property-actions", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { requestViewing: "requestViewing", offer: "offer", deposit: "deposit" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(property())\" i18n>Request viewing</a>\n @if (property().priceType && property().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(property())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(property())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-property-action-contact\"></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1159
1168
|
}
|
|
1160
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1169
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyActionsComponent, decorators: [{
|
|
1161
1170
|
type: Component,
|
|
1162
1171
|
args: [{ selector: 'rolatech-property-actions', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(property())\" i18n>Request viewing</a>\n @if (property().priceType && property().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(property())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(property())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-property-action-contact\"></ng-content>\n</div>\n" }]
|
|
1163
1172
|
}] });
|
|
1164
1173
|
|
|
1165
1174
|
class PropertyItemComponent {
|
|
1166
|
-
property = input.required();
|
|
1167
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1168
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1175
|
+
property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
|
|
1176
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1177
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyItemComponent, isStandalone: true, selector: "rolatech-property-item", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property().title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property().bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property().price | fixed }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
1169
1178
|
}
|
|
1170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyItemComponent, decorators: [{
|
|
1171
1180
|
type: Component,
|
|
1172
|
-
args: [{ selector: 'rolatech-property-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer
|
|
1181
|
+
args: [{ selector: 'rolatech-property-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property().title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property().bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property().price | fixed }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
1173
1182
|
}] });
|
|
1174
1183
|
|
|
1175
1184
|
class PropertyPricingComponent {
|
|
1176
1185
|
ngOnInit() {
|
|
1177
1186
|
this.calculateDeposit();
|
|
1178
1187
|
}
|
|
1179
|
-
property = input.required();
|
|
1180
|
-
price = input();
|
|
1188
|
+
property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
|
|
1189
|
+
price = input(...(ngDevMode ? [undefined, { debugName: "price" }] : []));
|
|
1181
1190
|
holdingDeposit;
|
|
1182
1191
|
securityDeposit;
|
|
1183
1192
|
displayPrice = computed(() => {
|
|
1184
1193
|
return (this.property().price / 100).toFixed(2);
|
|
1185
|
-
});
|
|
1194
|
+
}, ...(ngDevMode ? [{ debugName: "displayPrice" }] : []));
|
|
1186
1195
|
calculateDeposit() {
|
|
1187
1196
|
const price = this.property().price;
|
|
1188
1197
|
this.holdingDeposit = ((price * 12) / 52 / 100).toFixed(2);
|
|
1189
1198
|
this.securityDeposit = (((price * 12) / 52 / 100) * 5).toFixed(2);
|
|
1190
1199
|
}
|
|
1191
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1192
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
1200
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyPricingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1201
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: PropertyPricingComponent, isStandalone: true, selector: "rolatech-property-pricing", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"py-3\">\n <div class=\"flex justify-between items-center\">\n <div class=\"text-lg font-bold\" i18n>Rent per month</div>\n <div class=\"text-xl font-bold py-3\">\u00A3{{ displayPrice() }}</div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"py-3\">\n <div class=\"flex justify-between items-center py-2\">\n <span i18n>Holding Deposit</span>\n <span>\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex justify-between items-center py-2 font-bold\">\n <span i18n>Security Deposit</span>\n <span>\u00A3{{ securityDeposit }}</span>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1193
1202
|
}
|
|
1194
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1203
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyPricingComponent, decorators: [{
|
|
1195
1204
|
type: Component,
|
|
1196
1205
|
args: [{ selector: 'rolatech-property-pricing', imports: [CommonModule, MatButtonModule, MatDivider], encapsulation: ViewEncapsulation.None, template: "<div class=\"py-3\">\n <div class=\"flex justify-between items-center\">\n <div class=\"text-lg font-bold\" i18n>Rent per month</div>\n <div class=\"text-xl font-bold py-3\">\u00A3{{ displayPrice() }}</div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"py-3\">\n <div class=\"flex justify-between items-center py-2\">\n <span i18n>Holding Deposit</span>\n <span>\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex justify-between items-center py-2 font-bold\">\n <span i18n>Security Deposit</span>\n <span>\u00A3{{ securityDeposit }}</span>\n </div>\n </div>\n</div>\n" }]
|
|
1197
1206
|
}] });
|
|
1198
1207
|
|
|
1199
1208
|
class PropertyInfoComponent {
|
|
1200
|
-
property = input.required();
|
|
1209
|
+
property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
|
|
1201
1210
|
wish = output();
|
|
1202
|
-
inWishList = input(false);
|
|
1211
|
+
inWishList = input(false, ...(ngDevMode ? [{ debugName: "inWishList" }] : []));
|
|
1203
1212
|
onWish(property) {
|
|
1204
1213
|
this.wish.emit(property);
|
|
1205
1214
|
}
|
|
1206
1215
|
onShare() { }
|
|
1207
1216
|
onMore() { }
|
|
1208
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1209
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1217
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1218
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyInfoComponent, isStandalone: true, selector: "rolatech-property-info", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, inWishList: { classPropertyName: "inWishList", publicName: "inWishList", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { wish: "wish" }, host: { attributes: { "id": "rolatech-property-info" } }, ngImport: i0, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n <div [innerHTML]=\"property().description\">\n <!-- {{ property().description }} -->\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: RouterModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1210
1219
|
}
|
|
1211
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyInfoComponent, decorators: [{
|
|
1212
1221
|
type: Component,
|
|
1213
1222
|
args: [{ selector: 'rolatech-property-info', imports: [MatButtonModule, MatIconModule, RouterModule], encapsulation: ViewEncapsulation.None, host: {
|
|
1214
1223
|
id: 'rolatech-property-info',
|
|
1215
|
-
}, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n <div>\n {{ property().description }}
|
|
1224
|
+
}, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n <div [innerHTML]=\"property().description\">\n <!-- {{ property().description }} -->\n </div>\n</div>\n" }]
|
|
1216
1225
|
}] });
|
|
1217
1226
|
|
|
1218
1227
|
class PropertySectionComponent {
|
|
1219
|
-
section = input.required();
|
|
1220
|
-
user = input();
|
|
1221
|
-
username = input();
|
|
1228
|
+
section = input.required(...(ngDevMode ? [{ debugName: "section" }] : []));
|
|
1229
|
+
user = input(...(ngDevMode ? [undefined, { debugName: "user" }] : []));
|
|
1230
|
+
username = input(...(ngDevMode ? [undefined, { debugName: "username" }] : []));
|
|
1222
1231
|
viewportScroller = inject(ViewportScroller);
|
|
1223
1232
|
onClickScroller(id) {
|
|
1224
1233
|
this.viewportScroller.scrollToAnchor(id);
|
|
1225
1234
|
}
|
|
1226
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1227
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1235
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertySectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1236
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertySectionComponent, isStandalone: true, selector: "rolatech-property-section", inputs: { section: { classPropertyName: "section", publicName: "section", isSignal: true, isRequired: true, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (section(); as section) {\n <div>\n @if (section.title) {\n <div class=\"py-3 flex items-center gap-3\">\n <span class=\"h-4 w-1 bg-[--rt-brand-color] inline-block\"></span>\n <span class=\"text-lg font-medium py-1\"> {{ section.title }}</span>\n </div>\n }\n @if (section.description) {\n <div>\n {{ section.description }}\n </div>\n }\n @if (section.media) {\n <div class=\"w-80%\">\n @for (item of section.media; track item) {\n <div class=\"py-3\">\n <rolatech-thumbnail\n [src]=\"item.url\"\n size=\"small\"\n mode=\"full\"\n [width]=\"item.width\"\n [height]=\"item.height\"\n ></rolatech-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1228
1237
|
}
|
|
1229
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertySectionComponent, decorators: [{
|
|
1230
1239
|
type: Component,
|
|
1231
1240
|
args: [{ selector: 'rolatech-property-section', imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "@if (section(); as section) {\n <div>\n @if (section.title) {\n <div class=\"py-3 flex items-center gap-3\">\n <span class=\"h-4 w-1 bg-[--rt-brand-color] inline-block\"></span>\n <span class=\"text-lg font-medium py-1\"> {{ section.title }}</span>\n </div>\n }\n @if (section.description) {\n <div>\n {{ section.description }}\n </div>\n }\n @if (section.media) {\n <div class=\"w-80%\">\n @for (item of section.media; track item) {\n <div class=\"py-3\">\n <rolatech-thumbnail\n [src]=\"item.url\"\n size=\"small\"\n mode=\"full\"\n [width]=\"item.width\"\n [height]=\"item.height\"\n ></rolatech-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n}\n" }]
|
|
1232
1241
|
}] });
|
|
1233
1242
|
|
|
1234
1243
|
class PropertyVideoTourComponent {
|
|
1235
1244
|
sanitizer = inject(DomSanitizer);
|
|
1236
|
-
videoTour = input.required();
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1245
|
+
videoTour = input.required(...(ngDevMode ? [{ debugName: "videoTour" }] : []));
|
|
1246
|
+
videoUrl = computed(() => {
|
|
1247
|
+
const match = this.videoTour().url.match(/(?:youtu\.be\/|youtube\.com\/watch\?v=)([\w-]+)/);
|
|
1248
|
+
if (match && match[1]) {
|
|
1249
|
+
return this.sanitizer.bypassSecurityTrustResourceUrl(`https://www.youtube.com/embed/${match[1]}`);
|
|
1250
|
+
}
|
|
1251
|
+
return null; // Not a valid YouTube URL
|
|
1252
|
+
}, ...(ngDevMode ? [{ debugName: "videoUrl" }] : []));
|
|
1253
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyVideoTourComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1254
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: PropertyVideoTourComponent, isStandalone: true, selector: "rolatech-property-video-tour", inputs: { videoTour: { classPropertyName: "videoTour", publicName: "videoTour", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Video tour</div>\n <iframe [src]=\"videoUrl()\" frameborder=\"0\" allowfullscreen class=\"w-full aspect-video\"></iframe>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1242
1255
|
}
|
|
1243
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1256
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyVideoTourComponent, decorators: [{
|
|
1244
1257
|
type: Component,
|
|
1245
|
-
args: [{ selector: 'rolatech-property-video-tour', imports: [CommonModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Video tour</div>\n <iframe [src]=\"
|
|
1258
|
+
args: [{ selector: 'rolatech-property-video-tour', imports: [CommonModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Video tour</div>\n <iframe [src]=\"videoUrl()\" frameborder=\"0\" allowfullscreen class=\"w-full aspect-video\"></iframe>\n</div>\n" }]
|
|
1246
1259
|
}] });
|
|
1247
1260
|
|
|
1248
1261
|
class PropertyActionContactComponent {
|
|
1249
|
-
btnRef = viewChild('btnEl', { read: ElementRef });
|
|
1250
|
-
email = input();
|
|
1251
|
-
phone = input();
|
|
1262
|
+
btnRef = viewChild('btnEl', ...(ngDevMode ? [{ debugName: "btnRef", read: ElementRef }] : [{ read: ElementRef }]));
|
|
1263
|
+
email = input(...(ngDevMode ? [undefined, { debugName: "email" }] : []));
|
|
1264
|
+
phone = input(...(ngDevMode ? [undefined, { debugName: "phone" }] : []));
|
|
1252
1265
|
callAgent = output();
|
|
1253
1266
|
emailAgent = output();
|
|
1254
1267
|
onCallAgent() { }
|
|
1255
1268
|
onEmailAgent(property) {
|
|
1256
1269
|
this.emailAgent.emit(property);
|
|
1257
1270
|
}
|
|
1258
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1259
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0
|
|
1271
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyActionContactComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1272
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: PropertyActionContactComponent, isStandalone: true, selector: "rolatech-property-action-contact", inputs: { email: { classPropertyName: "email", publicName: "email", isSignal: true, isRequired: false, transformFunction: null }, phone: { classPropertyName: "phone", publicName: "phone", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callAgent: "callAgent", emailAgent: "emailAgent" }, viewQueries: [{ propertyName: "btnRef", first: true, predicate: ["btnEl"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<a\n mat-stroked-button\n class=\"w-full\"\n #btnEl\n [matMenuTriggerFor]=\"callMenu\"\n [matMenuTriggerData]=\"{ width: btnRef()?.nativeElement.offsetWidth }\"\n (click)=\"onCallAgent()\"\n>\n <span i18n>Ask a question</span>\n</a>\n<mat-menu #callMenu=\"matMenu\" [overlapTrigger]=\"false\" class=\"custom-menu-panel\">\n <ng-template matMenuContent let-width=\"width\">\n <div class=\"menu-content\" [ngStyle]=\"{ width: width + 'px' }\">\n <a mat-menu-item href=\"mailto:hello@gmail.com\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">email</mat-icon>\n </span>\n <span i18n>Email</span>\n </span>\n <span class=\"pl-9\" i18n>{{ email() }}</span>\n </a>\n <hr />\n <a mat-menu-item [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">call</mat-icon>\n </span>\n <span i18n>WhatsApp</span>\n </span>\n <span class=\"pl-9\" i18n>{{ phone() }}</span>\n </a>\n </div>\n </ng-template>\n</mat-menu>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1260
1273
|
}
|
|
1261
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1274
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyActionContactComponent, decorators: [{
|
|
1262
1275
|
type: Component,
|
|
1263
1276
|
args: [{ selector: 'rolatech-property-action-contact', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<a\n mat-stroked-button\n class=\"w-full\"\n #btnEl\n [matMenuTriggerFor]=\"callMenu\"\n [matMenuTriggerData]=\"{ width: btnRef()?.nativeElement.offsetWidth }\"\n (click)=\"onCallAgent()\"\n>\n <span i18n>Ask a question</span>\n</a>\n<mat-menu #callMenu=\"matMenu\" [overlapTrigger]=\"false\" class=\"custom-menu-panel\">\n <ng-template matMenuContent let-width=\"width\">\n <div class=\"menu-content\" [ngStyle]=\"{ width: width + 'px' }\">\n <a mat-menu-item href=\"mailto:hello@gmail.com\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">email</mat-icon>\n </span>\n <span i18n>Email</span>\n </span>\n <span class=\"pl-9\" i18n>{{ email() }}</span>\n </a>\n <hr />\n <a mat-menu-item [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">call</mat-icon>\n </span>\n <span i18n>WhatsApp</span>\n </span>\n <span class=\"pl-9\" i18n>{{ phone() }}</span>\n </a>\n </div>\n </ng-template>\n</mat-menu>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"] }]
|
|
1264
1277
|
}] });
|
|
1265
1278
|
|
|
1266
1279
|
class PropertyAgentRenderer {
|
|
1267
|
-
name = input();
|
|
1268
|
-
avatar = input();
|
|
1269
|
-
username = input();
|
|
1270
|
-
subtitle = input();
|
|
1271
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1272
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1280
|
+
name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
|
|
1281
|
+
avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
|
|
1282
|
+
username = input(...(ngDevMode ? [undefined, { debugName: "username" }] : []));
|
|
1283
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
1284
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyAgentRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1285
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyAgentRenderer, isStandalone: true, selector: "rolatech-property-agent-renderer", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n <div class=\"text-sm opacity-70\">This listing is verified and managed by an Primecase agent</div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
1273
1286
|
}
|
|
1274
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyAgentRenderer, decorators: [{
|
|
1275
1288
|
type: Component,
|
|
1276
1289
|
args: [{ selector: 'rolatech-property-agent-renderer', imports: [AngularCommonModule, MatIconModule], template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n <div class=\"text-sm opacity-70\">This listing is verified and managed by an Primecase agent</div>\n</div>\n" }]
|
|
1277
1290
|
}] });
|
|
@@ -1289,11 +1302,12 @@ class PropertyDetailsComponent extends BaseComponent {
|
|
|
1289
1302
|
purchased = false;
|
|
1290
1303
|
selectedOption;
|
|
1291
1304
|
variants = [];
|
|
1305
|
+
features = [];
|
|
1292
1306
|
selectedVariant;
|
|
1293
|
-
variantOption = signal(undefined);
|
|
1307
|
+
variantOption = signal(undefined, ...(ngDevMode ? [{ debugName: "variantOption" }] : []));
|
|
1294
1308
|
variantOptionChanged = computed(() => {
|
|
1295
1309
|
return this.variantOption();
|
|
1296
|
-
});
|
|
1310
|
+
}, ...(ngDevMode ? [{ debugName: "variantOptionChanged" }] : []));
|
|
1297
1311
|
// results: any[] = [];
|
|
1298
1312
|
constructor() {
|
|
1299
1313
|
super();
|
|
@@ -1305,6 +1319,7 @@ class PropertyDetailsComponent extends BaseComponent {
|
|
|
1305
1319
|
}
|
|
1306
1320
|
ngOnInit() {
|
|
1307
1321
|
this.getProperty();
|
|
1322
|
+
this.findFeatures();
|
|
1308
1323
|
}
|
|
1309
1324
|
getProperty() {
|
|
1310
1325
|
this.propertyService.get(this.id).subscribe({
|
|
@@ -1340,6 +1355,14 @@ class PropertyDetailsComponent extends BaseComponent {
|
|
|
1340
1355
|
},
|
|
1341
1356
|
});
|
|
1342
1357
|
}
|
|
1358
|
+
findFeatures() {
|
|
1359
|
+
console.log(this.id);
|
|
1360
|
+
this.propertyService.findFeatures(this.id).subscribe({
|
|
1361
|
+
next: (res) => {
|
|
1362
|
+
this.features = res.data;
|
|
1363
|
+
}
|
|
1364
|
+
});
|
|
1365
|
+
}
|
|
1343
1366
|
wishListCheck() {
|
|
1344
1367
|
this.propertyService.wishListCheck(this.id).subscribe({
|
|
1345
1368
|
next: (res) => {
|
|
@@ -1417,10 +1440,10 @@ class PropertyDetailsComponent extends BaseComponent {
|
|
|
1417
1440
|
this.selectedVariant = matchingVariant;
|
|
1418
1441
|
// const updatedCriteria = matchingVariant ? updateCriteriaFromVariant(matchingVariant) : [];
|
|
1419
1442
|
}
|
|
1420
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1421
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1443
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1444
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyDetailsComponent, isStandalone: true, selector: "rolatech-property-details", usesInheritance: true, ngImport: i0, template: "@if (property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n <mat-divider></mat-divider>\n <rolatech-property-features [features]=\"features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videoTours) {\n @for (item of property.videoTours; track $index) {\n <rolatech-property-video-tour [videoTour]=\"item\"></rolatech-property-video-tour>\n }\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n <rolatech-comments [itemId]=\"property.id\"></rolatech-comments>\n </div>\n </div>\n <div class=\"w-full md:w-1/3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-property-actions\n [property]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-property-action-contact [email]=\"user.email\" [phone]=\"user.phone\"></rolatech-property-action-contact>\n }\n </rolatech-property-actions>\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyInfoComponent, selector: "rolatech-property-info", inputs: ["property", "inWishList"], outputs: ["wish"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }, { kind: "component", type: PropertySectionComponent, selector: "rolatech-property-section", inputs: ["section", "user", "username"] }, { kind: "component", type: PropertyActionsComponent, selector: "rolatech-property-actions", inputs: ["property"], outputs: ["requestViewing", "offer", "deposit"] }, { kind: "component", type: CommentsComponent, selector: "rolatech-comments", inputs: ["itemId"] }, { kind: "component", type: PropertyAgentRenderer, selector: "rolatech-property-agent-renderer", inputs: ["name", "avatar", "username", "subtitle"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyVideoTourComponent, selector: "rolatech-property-video-tour", inputs: ["videoTour"] }, { kind: "component", type: PropertyActionContactComponent, selector: "rolatech-property-action-contact", inputs: ["email", "phone"], outputs: ["callAgent", "emailAgent"] }] });
|
|
1422
1445
|
}
|
|
1423
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1446
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyDetailsComponent, decorators: [{
|
|
1424
1447
|
type: Component,
|
|
1425
1448
|
args: [{ selector: 'rolatech-property-details', imports: [
|
|
1426
1449
|
AngularCommonModule,
|
|
@@ -1437,7 +1460,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1437
1460
|
PropertyFeaturesComponent,
|
|
1438
1461
|
PropertyVideoTourComponent,
|
|
1439
1462
|
PropertyActionContactComponent,
|
|
1440
|
-
], template: "@if (property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n <mat-divider></mat-divider>\n <rolatech-property-features [features]=\"
|
|
1463
|
+
], template: "@if (property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n <mat-divider></mat-divider>\n <rolatech-property-features [features]=\"features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videoTours) {\n @for (item of property.videoTours; track $index) {\n <rolatech-property-video-tour [videoTour]=\"item\"></rolatech-property-video-tour>\n }\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n <rolatech-comments [itemId]=\"property.id\"></rolatech-comments>\n </div>\n </div>\n <div class=\"w-full md:w-1/3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-property-actions\n [property]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-property-action-contact [email]=\"user.email\" [phone]=\"user.phone\"></rolatech-property-action-contact>\n }\n </rolatech-property-actions>\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n" }]
|
|
1441
1464
|
}], ctorParameters: () => [] });
|
|
1442
1465
|
|
|
1443
1466
|
const MY_FORMATS$5 = {
|
|
@@ -1459,7 +1482,7 @@ class PropertyViewingTimeComponent {
|
|
|
1459
1482
|
proposedTime = input({
|
|
1460
1483
|
date: '',
|
|
1461
1484
|
time: '',
|
|
1462
|
-
});
|
|
1485
|
+
}, ...(ngDevMode ? [{ debugName: "proposedTime" }] : []));
|
|
1463
1486
|
time = ViewingTime;
|
|
1464
1487
|
ngOnInit() {
|
|
1465
1488
|
this.minDate.setDate(this.minDate.getDate() + 1);
|
|
@@ -1468,8 +1491,8 @@ class PropertyViewingTimeComponent {
|
|
|
1468
1491
|
ngDoCheck() {
|
|
1469
1492
|
this.output.emit(this.proposedTime());
|
|
1470
1493
|
}
|
|
1471
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1472
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1494
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1495
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyViewingTimeComponent, isStandalone: true, selector: "rolatech-property-viewing-time", inputs: { proposedTime: { classPropertyName: "proposedTime", publicName: "proposedTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", select: "select" }, providers: [
|
|
1473
1496
|
{
|
|
1474
1497
|
provide: DateAdapter,
|
|
1475
1498
|
useClass: MomentDateAdapter,
|
|
@@ -1478,7 +1501,7 @@ class PropertyViewingTimeComponent {
|
|
|
1478
1501
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$5 },
|
|
1479
1502
|
], ngImport: i0, template: "<div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing Date</mat-label>\n <input\n matInput\n placeholder=\"Viewing date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"viewingDate\"\n [(ngModel)]=\"proposedTime()!.date\"\n (dateInput)=\"proposedTime()!.date = $event.value.format('YYYY-MM-DD')\"\n required\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing time</mat-label>\n <mat-icon matIconPrefix>schedule</mat-icon>\n <mat-select [(ngModel)]=\"proposedTime()!.time\" required readonly>\n @for (d of time; track d) {\n <mat-option [value]=\"d\">\n {{ d }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }] });
|
|
1480
1503
|
}
|
|
1481
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1504
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingTimeComponent, decorators: [{
|
|
1482
1505
|
type: Component,
|
|
1483
1506
|
args: [{ selector: 'rolatech-property-viewing-time', imports: [
|
|
1484
1507
|
MatFormFieldModule,
|
|
@@ -1539,7 +1562,7 @@ class PropertyViewingRequestComponent extends BaseComponent {
|
|
|
1539
1562
|
selectedCountry;
|
|
1540
1563
|
displayPrice = computed(() => {
|
|
1541
1564
|
return this.property ? (this.property.price / 100).toFixed(2) : 0;
|
|
1542
|
-
});
|
|
1565
|
+
}, ...(ngDevMode ? [{ debugName: "displayPrice" }] : []));
|
|
1543
1566
|
ngOnInit() {
|
|
1544
1567
|
this.getProperty();
|
|
1545
1568
|
// this.viewing['country'] = this.countries[0];
|
|
@@ -1568,17 +1591,17 @@ class PropertyViewingRequestComponent extends BaseComponent {
|
|
|
1568
1591
|
},
|
|
1569
1592
|
});
|
|
1570
1593
|
}
|
|
1571
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1572
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1594
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingRequestComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1595
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyViewingRequestComponent, isStandalone: true, selector: "rolatech-property-viewing-request", providers: [
|
|
1573
1596
|
{
|
|
1574
1597
|
provide: DateAdapter,
|
|
1575
1598
|
useClass: MomentDateAdapter,
|
|
1576
1599
|
deps: [MAT_DATE_LOCALE],
|
|
1577
1600
|
},
|
|
1578
1601
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$4 },
|
|
1579
|
-
], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <div class=\"mb-3\">\n <mat-radio-group\n aria-label=\"Select an option\"\n [(ngModel)]=\"viewing.viewerCategory\"\n (change)=\"onViewerSelectionChange($event)\"\n >\n <mat-radio-button [value]=\"viewerCategory.TENANT\" i18n>I'm a tenant</mat-radio-button>\n <mat-radio-button [value]=\"viewerCategory.AGENT\" i18n>I'm an agent</mat-radio-button>\n </mat-radio-group>\n </div>\n @if (selectedViewerCategory === 'TENANT') {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.firstName\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.lastName\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.phone\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant type</mat-label>\n <mat-select placeholder=\"Tenant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n } @else {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Your email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number of tenants</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.numberOfTenants\" />\n </mat-form-field>\n </div>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3 </span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"viewing.income\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"viewing.employmentStatus\">\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"viewing.adverseCreditStatus\">\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ displayPrice() }}</div>\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: PropertyViewingTimeComponent, selector: "rolatech-property-viewing-time", inputs: ["proposedTime"], outputs: ["output", "select"] }] });
|
|
1602
|
+
], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <div class=\"mb-3\">\n <mat-radio-group\n aria-label=\"Select an option\"\n [(ngModel)]=\"viewing.viewerCategory\"\n (change)=\"onViewerSelectionChange($event)\"\n >\n <mat-radio-button [value]=\"viewerCategory.TENANT\" i18n>I'm a tenant</mat-radio-button>\n <mat-radio-button [value]=\"viewerCategory.AGENT\" i18n>I'm an agent</mat-radio-button>\n </mat-radio-group>\n </div>\n @if (selectedViewerCategory === 'TENANT') {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.firstName\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.lastName\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.phone\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant type</mat-label>\n <mat-select placeholder=\"Tenant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n } @else {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Your email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number of tenants</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.numberOfTenants\" />\n </mat-form-field>\n </div>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3 </span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"viewing.income\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"viewing.employmentStatus\">\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"viewing.adverseCreditStatus\">\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ displayPrice() }}</div>\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i7$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i7$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: PropertyViewingTimeComponent, selector: "rolatech-property-viewing-time", inputs: ["proposedTime"], outputs: ["output", "select"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
|
|
1580
1603
|
}
|
|
1581
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1604
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingRequestComponent, decorators: [{
|
|
1582
1605
|
type: Component,
|
|
1583
1606
|
args: [{ selector: 'rolatech-property-viewing-request', imports: [
|
|
1584
1607
|
CommonModule,
|
|
@@ -1644,15 +1667,15 @@ class PropertyOfferComponent extends BaseComponent {
|
|
|
1644
1667
|
// displayPrice = computed(() => {
|
|
1645
1668
|
// return (this.property?.price / 100).toFixed(2);
|
|
1646
1669
|
// });
|
|
1647
|
-
property = signal(null);
|
|
1670
|
+
property = signal(null, ...(ngDevMode ? [{ debugName: "property" }] : []));
|
|
1648
1671
|
displayPrice = computed(() => {
|
|
1649
1672
|
const p = this.property();
|
|
1650
1673
|
return p ? (p.price / 100).toFixed(2) : '0.00';
|
|
1651
|
-
});
|
|
1674
|
+
}, ...(ngDevMode ? [{ debugName: "displayPrice" }] : []));
|
|
1652
1675
|
firstImageUrl = computed(() => {
|
|
1653
1676
|
const p = this.property();
|
|
1654
1677
|
return p?.media?.[0]?.url || '';
|
|
1655
|
-
});
|
|
1678
|
+
}, ...(ngDevMode ? [{ debugName: "firstImageUrl" }] : []));
|
|
1656
1679
|
minDate = new Date();
|
|
1657
1680
|
sending = false;
|
|
1658
1681
|
constructor() {
|
|
@@ -1701,17 +1724,17 @@ class PropertyOfferComponent extends BaseComponent {
|
|
|
1701
1724
|
},
|
|
1702
1725
|
});
|
|
1703
1726
|
}
|
|
1704
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1705
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1727
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1728
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyOfferComponent, isStandalone: true, selector: "rolatech-property-offer", providers: [
|
|
1706
1729
|
{
|
|
1707
1730
|
provide: DateAdapter,
|
|
1708
1731
|
useClass: MomentDateAdapter,
|
|
1709
1732
|
deps: [MAT_DATE_LOCALE],
|
|
1710
1733
|
},
|
|
1711
1734
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$3 },
|
|
1712
|
-
], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n <span i18n=\"@@offerFor\">Offer for {{ property()?.title }}</span>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.lastName\" required />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.phone\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.email\" required />\n </mat-form-field>\n\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3 </span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"offer.applicantType\" required>\n @for (key of applicantTypes; track key) {\n <mat-option [value]=\"key\">\n {{ PropertyApplicantType[key] }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- subscriptSizing=\"dynamic\" -->\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"offer.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\">\n {{ status.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"offer.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"offer.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"firstImageUrl()\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ displayPrice() }}</div>\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] });
|
|
1735
|
+
], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n <span i18n=\"@@offerFor\">Offer for {{ property()?.title }}</span>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.lastName\" required />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.phone\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.email\" required />\n </mat-form-field>\n\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3 </span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"offer.applicantType\" required>\n @for (key of applicantTypes; track key) {\n <mat-option [value]=\"key\">\n {{ PropertyApplicantType[key] }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- subscriptSizing=\"dynamic\" -->\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"offer.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\">\n {{ status.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"offer.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"offer.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"firstImageUrl()\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ displayPrice() }}</div>\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
|
|
1713
1736
|
}
|
|
1714
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1737
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferComponent, decorators: [{
|
|
1715
1738
|
type: Component,
|
|
1716
1739
|
args: [{ selector: 'rolatech-property-offer', imports: [
|
|
1717
1740
|
CommonModule,
|
|
@@ -1819,8 +1842,8 @@ class PropertyOfferIndexComponent extends BaseComponent {
|
|
|
1819
1842
|
})
|
|
1820
1843
|
.join(',');
|
|
1821
1844
|
}
|
|
1822
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1823
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1845
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1846
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyOfferIndexComponent, isStandalone: true, selector: "rolatech-property-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Offers\" large> </rolatech-toolbar>\n <rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n </rolatech-tabs>\n <rolatech-list>\n @if (offers) {\n @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }], animations: [
|
|
1824
1847
|
trigger('filter', [
|
|
1825
1848
|
state('collapsed', style({ height: '0px', minHeight: '0' })),
|
|
1826
1849
|
state('expanded', style({ height: '*' })),
|
|
@@ -1828,7 +1851,7 @@ class PropertyOfferIndexComponent extends BaseComponent {
|
|
|
1828
1851
|
]),
|
|
1829
1852
|
], encapsulation: i0.ViewEncapsulation.None });
|
|
1830
1853
|
}
|
|
1831
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1854
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferIndexComponent, decorators: [{
|
|
1832
1855
|
type: Component,
|
|
1833
1856
|
args: [{ selector: 'rolatech-property-offer-index', imports: [
|
|
1834
1857
|
CommonModule,
|
|
@@ -1859,14 +1882,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1859
1882
|
}] });
|
|
1860
1883
|
|
|
1861
1884
|
class PropertyViewingItemComponent {
|
|
1862
|
-
viewing = input.required();
|
|
1885
|
+
viewing = input.required(...(ngDevMode ? [{ debugName: "viewing" }] : []));
|
|
1863
1886
|
status = PropertyViewingStatus;
|
|
1864
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1865
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1887
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1888
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyViewingItemComponent, isStandalone: true, selector: "rolatech-property-viewing-item", inputs: { viewing: { classPropertyName: "viewing", publicName: "viewing", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().property.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"viewing().property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ viewing().property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ viewing().property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ viewing().property.price | fixed }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
1866
1889
|
}
|
|
1867
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1890
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingItemComponent, decorators: [{
|
|
1868
1891
|
type: Component,
|
|
1869
|
-
args: [{ selector: 'rolatech-property-viewing-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().property.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer
|
|
1892
|
+
args: [{ selector: 'rolatech-property-viewing-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().property.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"viewing().property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ viewing().property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ viewing().property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ viewing().property.price | fixed }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
1870
1893
|
}] });
|
|
1871
1894
|
|
|
1872
1895
|
class PropertyViewingIndexComponent extends BaseComponent {
|
|
@@ -1943,10 +1966,10 @@ class PropertyViewingIndexComponent extends BaseComponent {
|
|
|
1943
1966
|
})
|
|
1944
1967
|
.join(',');
|
|
1945
1968
|
}
|
|
1946
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1947
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1969
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1970
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyViewingIndexComponent, isStandalone: true, selector: "rolatech-property-viewing-index", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Viewings\" large> </rolatech-toolbar>\n <rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n </rolatech-tabs>\n <rolatech-list>\n @if (viewings) {\n @for (item of viewings; track item) {\n <rolatech-property-viewing-item [routerLink]=\"['./', item.id]\" [viewing]=\"item\"></rolatech-property-viewing-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyViewingItemComponent, selector: "rolatech-property-viewing-item", inputs: ["viewing"] }] });
|
|
1948
1971
|
}
|
|
1949
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1972
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingIndexComponent, decorators: [{
|
|
1950
1973
|
type: Component,
|
|
1951
1974
|
args: [{ selector: 'rolatech-property-viewing-index', imports: [
|
|
1952
1975
|
CommonModule,
|
|
@@ -1981,10 +2004,10 @@ class DuePipe {
|
|
|
1981
2004
|
return '';
|
|
1982
2005
|
}
|
|
1983
2006
|
}
|
|
1984
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1985
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.0
|
|
2007
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: DuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2008
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.0", ngImport: i0, type: DuePipe, isStandalone: true, name: "due" });
|
|
1986
2009
|
}
|
|
1987
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2010
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: DuePipe, decorators: [{
|
|
1988
2011
|
type: Pipe,
|
|
1989
2012
|
args: [{
|
|
1990
2013
|
name: 'due',
|
|
@@ -2113,10 +2136,10 @@ class PropertyOfferDetailComponent extends BaseComponent {
|
|
|
2113
2136
|
},
|
|
2114
2137
|
});
|
|
2115
2138
|
}
|
|
2116
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2117
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: PropertyOfferDetailComponent, isStandalone: true, selector: "rolatech-property-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.propertyTitle }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>\u00A3{{ offer.amount | fixed }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">\u00A3{{ securityDeposit }}</span>\n </div>\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n <div id=\"payment-element\"></div>\n @if (offer.status.toString() === 'CREATED' || offer.status.toString() === 'PAID') {\n <div class=\"mt-6\">\n <div class=\"text-lg pb-3 font-medium\" i18n>Payment method</div>\n\n <div class=\"flex items-center\">\n <svg\n class=\"svg-icon\"\n style=\"width: 2rem; height: 2rem\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n fill=\"#09BB07\"\n />\n </svg>\n <span class=\"ml-1\" i18n>Stripe</span>\n </div>\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'PENDING') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n }\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: DuePipe, name: "due" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
2139
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2140
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyOfferDetailComponent, isStandalone: true, selector: "rolatech-property-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.propertyTitle }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>\u00A3{{ offer.amount | fixed }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">\u00A3{{ securityDeposit }}</span>\n </div>\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n <div id=\"payment-element\"></div>\n @if (offer.status.toString() === 'CREATED' || offer.status.toString() === 'PAID') {\n <div class=\"mt-6\">\n <div class=\"text-lg pb-3 font-medium\" i18n>Payment method</div>\n\n <div class=\"flex items-center\">\n <svg\n class=\"svg-icon\"\n style=\"width: 2rem; height: 2rem\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n fill=\"#09BB07\"\n />\n </svg>\n <span class=\"ml-1\" i18n>Stripe</span>\n </div>\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'PENDING') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n }\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }, { kind: "pipe", type: DuePipe, name: "due" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
2118
2141
|
}
|
|
2119
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyOfferDetailComponent, decorators: [{
|
|
2120
2143
|
type: Component,
|
|
2121
2144
|
args: [{ selector: 'rolatech-property-offer-detail', imports: [
|
|
2122
2145
|
MatButtonModule,
|
|
@@ -2130,7 +2153,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2130
2153
|
MatProgressSpinnerModule,
|
|
2131
2154
|
RouterLink,
|
|
2132
2155
|
DuePipe,
|
|
2133
|
-
], template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer
|
|
2156
|
+
], template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.propertyTitle }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>\u00A3{{ offer.amount | fixed }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">\u00A3{{ securityDeposit }}</span>\n </div>\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n <div id=\"payment-element\"></div>\n @if (offer.status.toString() === 'CREATED' || offer.status.toString() === 'PAID') {\n <div class=\"mt-6\">\n <div class=\"text-lg pb-3 font-medium\" i18n>Payment method</div>\n\n <div class=\"flex items-center\">\n <svg\n class=\"svg-icon\"\n style=\"width: 2rem; height: 2rem\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n fill=\"#09BB07\"\n />\n </svg>\n <span class=\"ml-1\" i18n>Stripe</span>\n </div>\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'PENDING') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n }\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
|
|
2134
2157
|
}] });
|
|
2135
2158
|
|
|
2136
2159
|
class PropertyViewingDetailComponent extends BaseComponent {
|
|
@@ -2184,10 +2207,10 @@ class PropertyViewingDetailComponent extends BaseComponent {
|
|
|
2184
2207
|
},
|
|
2185
2208
|
});
|
|
2186
2209
|
}
|
|
2187
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2188
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2210
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2211
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyViewingDetailComponent, isStandalone: true, selector: "rolatech-property-viewing-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
2189
2212
|
}
|
|
2190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2213
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingDetailComponent, decorators: [{
|
|
2191
2214
|
type: Component,
|
|
2192
2215
|
args: [{ selector: 'rolatech-property-viewing-detail', imports: [
|
|
2193
2216
|
MatButtonModule,
|
|
@@ -2199,7 +2222,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2199
2222
|
ToolbarComponent,
|
|
2200
2223
|
FixedPipe,
|
|
2201
2224
|
RouterLink,
|
|
2202
|
-
], template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
|
|
2225
|
+
], template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
|
|
2203
2226
|
}] });
|
|
2204
2227
|
|
|
2205
2228
|
class PropertyWishlistComponent extends BaseComponent {
|
|
@@ -2215,10 +2238,10 @@ class PropertyWishlistComponent extends BaseComponent {
|
|
|
2215
2238
|
},
|
|
2216
2239
|
});
|
|
2217
2240
|
}
|
|
2218
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2219
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2241
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyWishlistComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2242
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyWishlistComponent, isStandalone: true, selector: "rolatech-property-wishlist", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Wishlist\" large> </rolatech-toolbar>\n <rolatech-list>\n @if (wishlist) {\n @for (item of wishlist; track item) {\n <rolatech-property-item [routerLink]=\"['../', item.id]\" [property]=\"item\"></rolatech-property-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyItemComponent, selector: "rolatech-property-item", inputs: ["property"] }] });
|
|
2220
2243
|
}
|
|
2221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2244
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyWishlistComponent, decorators: [{
|
|
2222
2245
|
type: Component,
|
|
2223
2246
|
args: [{ selector: 'rolatech-property-wishlist', imports: [
|
|
2224
2247
|
CommonModule,
|
|
@@ -2247,7 +2270,7 @@ const propertyRoutes = [
|
|
|
2247
2270
|
children: [
|
|
2248
2271
|
{
|
|
2249
2272
|
path: '',
|
|
2250
|
-
loadComponent: () => import('./rolatech-angular-property-property-index.component-
|
|
2273
|
+
loadComponent: () => import('./rolatech-angular-property-property-index.component-Birv1xyB.mjs').then((x) => x.PropertyIndexComponent),
|
|
2251
2274
|
},
|
|
2252
2275
|
],
|
|
2253
2276
|
},
|
|
@@ -2302,37 +2325,71 @@ class PropertyManageFilterComponent {
|
|
|
2302
2325
|
};
|
|
2303
2326
|
reset() { }
|
|
2304
2327
|
search() { }
|
|
2305
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2306
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2328
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2329
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageFilterComponent, isStandalone: true, selector: "rolatech-property-manage-filter", ngImport: i0, template: "<div class=\"p-3\">\n <div class=\"bg-[--rt-raised-background] p-3 flex items-center justify-between rounded-md\">\n <div class=\"flex items-center\">\n <mat-form-field subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" i18n-placeholder [(ngModel)]=\"searchOptions.town\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\">\n {{ town }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field>\n <input />\n </mat-form-field> -->\n </div>\n <div class=\"flex gap-3\">\n <a mat-stroked-button class=\"w-[128px]\" (click)=\"reset()\" i18n>Reset</a>\n <a mat-flat-button class=\"w-full\" (click)=\"search()\" i18n>Search</a>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
2307
2330
|
}
|
|
2308
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2331
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageFilterComponent, decorators: [{
|
|
2309
2332
|
type: Component,
|
|
2310
2333
|
args: [{ selector: 'rolatech-property-manage-filter', imports: [CommonModule, MatButtonModule, MatFormFieldModule, MatSelectModule, MatOptionModule, FormsModule], template: "<div class=\"p-3\">\n <div class=\"bg-[--rt-raised-background] p-3 flex items-center justify-between rounded-md\">\n <div class=\"flex items-center\">\n <mat-form-field subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" i18n-placeholder [(ngModel)]=\"searchOptions.town\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\">\n {{ town }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field>\n <input />\n </mat-form-field> -->\n </div>\n <div class=\"flex gap-3\">\n <a mat-stroked-button class=\"w-[128px]\" (click)=\"reset()\" i18n>Reset</a>\n <a mat-flat-button class=\"w-full\" (click)=\"search()\" i18n>Search</a>\n </div>\n </div>\n</div>\n" }]
|
|
2311
2334
|
}] });
|
|
2312
2335
|
|
|
2313
2336
|
class PropertyManageIndexComponent {
|
|
2314
2337
|
hasClass = true;
|
|
2315
|
-
paginator = viewChild(MatPaginator);
|
|
2338
|
+
paginator = viewChild(MatPaginator, ...(ngDevMode ? [{ debugName: "paginator" }] : []));
|
|
2316
2339
|
dialog = inject(MatDialog);
|
|
2317
2340
|
snackBar = inject(MatSnackBar);
|
|
2318
2341
|
propertyService = inject(PropertyService);
|
|
2319
2342
|
isLoading = false;
|
|
2320
2343
|
isSearch = false;
|
|
2321
2344
|
properties = [];
|
|
2345
|
+
exporting = false;
|
|
2346
|
+
pageEvent;
|
|
2347
|
+
length = 100;
|
|
2348
|
+
pageSize = 15;
|
|
2349
|
+
pageSizeOptions = [5, 10, 25, 100];
|
|
2322
2350
|
ngOnInit() {
|
|
2323
2351
|
this.findProperties();
|
|
2324
2352
|
}
|
|
2325
|
-
findProperties() {
|
|
2326
|
-
|
|
2353
|
+
findProperties(event) {
|
|
2354
|
+
const page = event ? event.pageIndex + 1 : 1;
|
|
2355
|
+
const limit = event ? event.pageSize : 15;
|
|
2356
|
+
const options = {
|
|
2357
|
+
page,
|
|
2358
|
+
limit,
|
|
2359
|
+
sort: 'updatedAt desc',
|
|
2360
|
+
// filter: 'published:true',
|
|
2361
|
+
};
|
|
2362
|
+
this.propertyService.find(options).subscribe({
|
|
2327
2363
|
next: (res) => {
|
|
2328
2364
|
this.properties = res.data;
|
|
2365
|
+
this.length = res.meta.pagination.count;
|
|
2366
|
+
},
|
|
2367
|
+
});
|
|
2368
|
+
}
|
|
2369
|
+
export() {
|
|
2370
|
+
this.exporting = true;
|
|
2371
|
+
this.propertyService.export().subscribe({
|
|
2372
|
+
next: ({ blob, filename }) => {
|
|
2373
|
+
// Browser-only download
|
|
2374
|
+
const url = URL.createObjectURL(blob);
|
|
2375
|
+
const a = document.createElement('a');
|
|
2376
|
+
a.href = url;
|
|
2377
|
+
a.download = filename || 'properties.csv';
|
|
2378
|
+
document.body.appendChild(a);
|
|
2379
|
+
a.click();
|
|
2380
|
+
a.remove();
|
|
2381
|
+
URL.revokeObjectURL(url);
|
|
2382
|
+
this.exporting = false;
|
|
2329
2383
|
},
|
|
2384
|
+
error: (e) => {
|
|
2385
|
+
this.exporting = false;
|
|
2386
|
+
}
|
|
2330
2387
|
});
|
|
2331
2388
|
}
|
|
2332
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2333
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2389
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2390
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageIndexComponent, isStandalone: true, selector: "rolatech-property-manage-index", host: { properties: { "class.rolatech-property-manage-index": "this.hasClass" } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "<rolatech-toolbar title=\"Properties\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add property</span>\n </button>\n <!-- <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\">\n <mat-icon>download</mat-icon>\n <span i18n>Export</span>\n </button> -->\n <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\" aria-label=\"Export CSV\">\n @if (!exporting) {\n Export CSV\n } @else {\n Exporting\u2026\n }\n </button>\n </div>\n</rolatech-toolbar>\n@if (isLoading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <rolatech-property-manage-filter></rolatech-property-manage-filter>\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties; track $index) {\n <rolatech-property-manage-item\n [property]=\"item\"\n routerLink=\"./{{ item.id }}/manage/info\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n}\n<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = findProperties($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{display:flex;flex-direction:column;--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i3$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: PropertyManageItemComponent, selector: "rolatech-property-manage-item", inputs: ["property", "thumbnail", "list"] }, { kind: "component", type: PropertyManageFilterComponent, selector: "rolatech-property-manage-filter" }], encapsulation: i0.ViewEncapsulation.None });
|
|
2334
2391
|
}
|
|
2335
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2392
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageIndexComponent, decorators: [{
|
|
2336
2393
|
type: Component,
|
|
2337
2394
|
args: [{ selector: 'rolatech-property-manage-index', imports: [
|
|
2338
2395
|
MatButtonModule,
|
|
@@ -2345,7 +2402,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2345
2402
|
SpinnerComponent,
|
|
2346
2403
|
PropertyManageItemComponent,
|
|
2347
2404
|
PropertyManageFilterComponent,
|
|
2348
|
-
], encapsulation: ViewEncapsulation.None, template: "<rolatech-toolbar title=\"Properties\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add property</span>\n </button>\n </div>\n</rolatech-toolbar>\n@if (isLoading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <rolatech-property-manage-filter></rolatech-property-manage-filter>\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties; track $index) {\n <rolatech-property-manage-item\n [property]=\"item\"\n routerLink=\"./{{ item.id }}/manage/info\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n\n
|
|
2405
|
+
], encapsulation: ViewEncapsulation.None, template: "<rolatech-toolbar title=\"Properties\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add property</span>\n </button>\n <!-- <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\">\n <mat-icon>download</mat-icon>\n <span i18n>Export</span>\n </button> -->\n <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\" aria-label=\"Export CSV\">\n @if (!exporting) {\n Export CSV\n } @else {\n Exporting\u2026\n }\n </button>\n </div>\n</rolatech-toolbar>\n@if (isLoading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <rolatech-property-manage-filter></rolatech-property-manage-filter>\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties; track $index) {\n <rolatech-property-manage-item\n [property]=\"item\"\n routerLink=\"./{{ item.id }}/manage/info\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n}\n<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = findProperties($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{display:flex;flex-direction:column;--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"] }]
|
|
2349
2406
|
}], propDecorators: { hasClass: [{
|
|
2350
2407
|
type: HostBinding,
|
|
2351
2408
|
args: ['class.rolatech-property-manage-index']
|
|
@@ -2372,10 +2429,10 @@ class PropertyManageCreateComponent {
|
|
|
2372
2429
|
},
|
|
2373
2430
|
});
|
|
2374
2431
|
}
|
|
2375
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2376
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
2432
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2433
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PropertyManageCreateComponent, isStandalone: true, selector: "rolatech-property-manage-create", ngImport: i0, template: "<rolatech-toolbar title=\"Add property\" link=\"../\"> </rolatech-toolbar>\n<div class=\"p-3\">\n <section>\n <form #productForm=\"ngForm\">\n <div class=\"flex flex-col\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n </div>\n </form>\n </section>\n <div i18n>* items are required</div>\n <div class=\"mt-3\">\n <button mat-flat-button class=\"w-28\" (click)=\"create()\" i18n>Create</button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
|
|
2377
2434
|
}
|
|
2378
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2435
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageCreateComponent, decorators: [{
|
|
2379
2436
|
type: Component,
|
|
2380
2437
|
args: [{ selector: 'rolatech-property-manage-create', imports: [
|
|
2381
2438
|
ToolbarComponent,
|
|
@@ -2434,19 +2491,19 @@ class PropertyManageLayoutComponent extends BaseComponent {
|
|
|
2434
2491
|
},
|
|
2435
2492
|
});
|
|
2436
2493
|
}
|
|
2437
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2438
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2494
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2495
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageLayoutComponent, isStandalone: true, selector: "rolatech-property-manage-layout", usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col md:flex-row m-auto\">\n <div\n class=\"min-w-[256px] px-3 md:px-0 flex flex-row md:flex-col md:h-full items-center md:items-start h-16 overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-1\" i18n>Property</div>\n <a routerLink=\"./info\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Basic info</a>\n <a routerLink=\"./media\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Media</a>\n <a routerLink=\"./video-tour\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Video tour</a>\n <a routerLink=\"./sections\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Details</a>\n <a routerLink=\"./location\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Location</a>\n <a routerLink=\"./features\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Features</a>\n <!-- <a routerLink=\"./amenities\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Amenities</a> -->\n <!-- <a routerLink=\"./tags\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Tags</a> -->\n <!-- <a routerLink=\"./options\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Options</a> -->\n </div>\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Settings</div>\n <!-- <a routerLink=\"./variants\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Variants</a> -->\n <a routerLink=\"./schedule\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Schedule</a>\n <a routerLink=\"./pricing\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Pricing</a>\n </div>\n <!-- <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Others</div>\n </div> -->\n @if (property) {\n @if (property.status.toString() === 'DRAFT') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"submit()\" i18n>Submit for review</button>\n </div>\n }\n @if (property.status.toString() === 'PENDING') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button disabled i18n>Pending</button>\n </div>\n }\n @if (property.status.toString() === 'APPROVED') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"publish()\" i18n>Publish</button>\n </div>\n }\n }\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n</div>\n", styles: [".manage-active{background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .05));box-shadow:4px 0 var(--rt-base-background-inverse, #000) inset;font-weight:600}@media (max-width: 768px){.manage-active{box-shadow:inset 0 -4px 0 0 var(--rt-base-background-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
2439
2496
|
}
|
|
2440
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2497
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageLayoutComponent, decorators: [{
|
|
2441
2498
|
type: Component,
|
|
2442
2499
|
args: [{ selector: 'rolatech-property-manage-layout', imports: [RouterLink, RouterLinkActive, MatButtonModule, RouterOutlet], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col md:flex-row m-auto\">\n <div\n class=\"min-w-[256px] px-3 md:px-0 flex flex-row md:flex-col md:h-full items-center md:items-start h-16 overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-1\" i18n>Property</div>\n <a routerLink=\"./info\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Basic info</a>\n <a routerLink=\"./media\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Media</a>\n <a routerLink=\"./video-tour\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Video tour</a>\n <a routerLink=\"./sections\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Details</a>\n <a routerLink=\"./location\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Location</a>\n <a routerLink=\"./features\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Features</a>\n <!-- <a routerLink=\"./amenities\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Amenities</a> -->\n <!-- <a routerLink=\"./tags\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Tags</a> -->\n <!-- <a routerLink=\"./options\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Options</a> -->\n </div>\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Settings</div>\n <!-- <a routerLink=\"./variants\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Variants</a> -->\n <a routerLink=\"./schedule\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Schedule</a>\n <a routerLink=\"./pricing\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Pricing</a>\n </div>\n <!-- <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Others</div>\n </div> -->\n @if (property) {\n @if (property.status.toString() === 'DRAFT') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"submit()\" i18n>Submit for review</button>\n </div>\n }\n @if (property.status.toString() === 'PENDING') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button disabled i18n>Pending</button>\n </div>\n }\n @if (property.status.toString() === 'APPROVED') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"publish()\" i18n>Publish</button>\n </div>\n }\n }\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n</div>\n", styles: [".manage-active{background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .05));box-shadow:4px 0 var(--rt-base-background-inverse, #000) inset;font-weight:600}@media (max-width: 768px){.manage-active{box-shadow:inset 0 -4px 0 0 var(--rt-base-background-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
|
|
2443
2500
|
}] });
|
|
2444
2501
|
|
|
2445
2502
|
class PropertyManageContentComponent {
|
|
2446
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2447
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
2503
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2504
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PropertyManageContentComponent, isStandalone: true, selector: "rolatech-property-manage-content", ngImport: i0, template: "<ng-content select=\"rolatech-toolbar\"></ng-content>\n<div class=\"p-3\">\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
2448
2505
|
}
|
|
2449
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2506
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageContentComponent, decorators: [{
|
|
2450
2507
|
type: Component,
|
|
2451
2508
|
args: [{ selector: 'rolatech-property-manage-content', imports: [CommonModule], template: "<ng-content select=\"rolatech-toolbar\"></ng-content>\n<div class=\"p-3\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
2452
2509
|
}] });
|
|
@@ -2469,8 +2526,8 @@ class PropertyManageInfoComponent extends BaseComponent {
|
|
|
2469
2526
|
selectedCategoyIds;
|
|
2470
2527
|
propertyType = PropertyType;
|
|
2471
2528
|
priceType = PropertyPriceType;
|
|
2472
|
-
price = model('0.00');
|
|
2473
|
-
deposit = model('');
|
|
2529
|
+
price = model('0.00', ...(ngDevMode ? [{ debugName: "price" }] : []));
|
|
2530
|
+
deposit = model('', ...(ngDevMode ? [{ debugName: "deposit" }] : []));
|
|
2474
2531
|
minDate = new Date();
|
|
2475
2532
|
ngOnInit() {
|
|
2476
2533
|
this.id = this.route.parent?.snapshot.paramMap.get('id');
|
|
@@ -2509,12 +2566,13 @@ class PropertyManageInfoComponent extends BaseComponent {
|
|
|
2509
2566
|
this.selectedCategoyIds = event.value;
|
|
2510
2567
|
}
|
|
2511
2568
|
update() {
|
|
2512
|
-
const { title, description, type, priceType, availableDate, bedrooms, bathrooms, size, floor } = this.property;
|
|
2569
|
+
const { title, description, type, priceType, availableDate, bedrooms, bathrooms, receptions, size, floor } = this.property;
|
|
2513
2570
|
const data = {
|
|
2514
2571
|
title,
|
|
2515
2572
|
description,
|
|
2516
2573
|
bedrooms,
|
|
2517
2574
|
bathrooms,
|
|
2575
|
+
receptions,
|
|
2518
2576
|
size,
|
|
2519
2577
|
floor,
|
|
2520
2578
|
type,
|
|
@@ -2532,17 +2590,17 @@ class PropertyManageInfoComponent extends BaseComponent {
|
|
|
2532
2590
|
},
|
|
2533
2591
|
});
|
|
2534
2592
|
}
|
|
2535
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2536
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2593
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2594
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageInfoComponent, isStandalone: true, selector: "rolatech-property-manage-info", inputs: { price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, deposit: { classPropertyName: "deposit", publicName: "deposit", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { price: "priceChange", deposit: "depositChange" }, providers: [
|
|
2537
2595
|
{
|
|
2538
2596
|
provide: DateAdapter,
|
|
2539
2597
|
useClass: MomentDateAdapter,
|
|
2540
2598
|
deps: [MAT_DATE_LOCALE],
|
|
2541
2599
|
},
|
|
2542
2600
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$2 },
|
|
2543
|
-
], usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Basic info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n @if (property) {\n <div class=\"flex flex-col\">\n <form #propertyForm=\"ngForm\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bedrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bedrooms\" name=\"bedrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bathrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bathrooms\" name=\"bathrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Floor </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.floor\" name=\"floor\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Size(sqft) </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.size\" name=\"size\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Type</mat-label>\n <mat-select\n name=\"type\"\n [compareWith]=\"typeCompareFn\"\n (selectionChange)=\"onTypeChange($event)\"\n [(ngModel)]=\"property.type\"\n >\n @for (type of propertyType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Price type</mat-label>\n <mat-select name=\"priceType\" [compareWith]=\"priceTypeCompareFn\" [(ngModel)]=\"property.priceType\">\n @for (type of priceType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field> -->\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Available date</mat-label>\n <input\n matInput\n placeholder=\"Available date\"\n [matDatepicker]=\"availableDatePicker\"\n [min]=\"minDate\"\n (focus)=\"availableDatePicker.open()\"\n name=\"availableDate\"\n [(ngModel)]=\"property.availableDate\"\n (dateInput)=\"property.availableDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"availableDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #availableDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Price </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"price\" name=\"price\" required rolatechDecimal />\n </mat-form-field>\n @if (property.priceType && property.priceType.toString() === 'PARTIAL') {\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Deposit </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"deposit\" name=\"deposit\" required rolatechDecimal />\n </mat-form-field>\n }\n </form>\n </div>\n <div>\n <button mat-flat-button (click)=\"update()\" i18n>Save</button>\n </div>\n }\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "directive", type: DecimalDirective, selector: "[rolatechDecimal]" }, { kind: "
|
|
2601
|
+
], usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Basic info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n @if (property) {\n <div class=\"flex flex-col\">\n <form #propertyForm=\"ngForm\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bedrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bedrooms\" name=\"bedrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bathrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bathrooms\" name=\"bathrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Receptions </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.receptions\" name=\"receptions\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Floor </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.floor\" name=\"floor\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Size(sqft) </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.size\" name=\"size\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Type</mat-label>\n <mat-select\n name=\"type\"\n [compareWith]=\"typeCompareFn\"\n (selectionChange)=\"onTypeChange($event)\"\n [(ngModel)]=\"property.type\"\n >\n @for (type of propertyType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Price type</mat-label>\n <mat-select name=\"priceType\" [compareWith]=\"priceTypeCompareFn\" [(ngModel)]=\"property.priceType\">\n @for (type of priceType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field> -->\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Available date</mat-label>\n <input\n matInput\n placeholder=\"Available date\"\n [matDatepicker]=\"availableDatePicker\"\n [min]=\"minDate\"\n (focus)=\"availableDatePicker.open()\"\n name=\"availableDate\"\n [(ngModel)]=\"property.availableDate\"\n (dateInput)=\"property.availableDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"availableDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #availableDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Price </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"price\" name=\"price\" required rolatechDecimal />\n </mat-form-field>\n @if (property.priceType && property.priceType.toString() === 'PARTIAL') {\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Deposit </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"deposit\" name=\"deposit\" required rolatechDecimal />\n </mat-form-field>\n }\n </form>\n </div>\n <div>\n <button mat-flat-button (click)=\"update()\" i18n>Save</button>\n </div>\n }\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "directive", type: DecimalDirective, selector: "[rolatechDecimal]" }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }] });
|
|
2544
2602
|
}
|
|
2545
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageInfoComponent, decorators: [{
|
|
2546
2604
|
type: Component,
|
|
2547
2605
|
args: [{ selector: 'rolatech-property-manage-info', imports: [
|
|
2548
2606
|
FormsModule,
|
|
@@ -2565,7 +2623,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2565
2623
|
deps: [MAT_DATE_LOCALE],
|
|
2566
2624
|
},
|
|
2567
2625
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$2 },
|
|
2568
|
-
], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Basic info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n @if (property) {\n <div class=\"flex flex-col\">\n <form #propertyForm=\"ngForm\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bedrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bedrooms\" name=\"bedrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bathrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bathrooms\" name=\"bathrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Floor </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.floor\" name=\"floor\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Size(sqft) </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.size\" name=\"size\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Type</mat-label>\n <mat-select\n name=\"type\"\n [compareWith]=\"typeCompareFn\"\n (selectionChange)=\"onTypeChange($event)\"\n [(ngModel)]=\"property.type\"\n >\n @for (type of propertyType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Price type</mat-label>\n <mat-select name=\"priceType\" [compareWith]=\"priceTypeCompareFn\" [(ngModel)]=\"property.priceType\">\n @for (type of priceType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field> -->\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Available date</mat-label>\n <input\n matInput\n placeholder=\"Available date\"\n [matDatepicker]=\"availableDatePicker\"\n [min]=\"minDate\"\n (focus)=\"availableDatePicker.open()\"\n name=\"availableDate\"\n [(ngModel)]=\"property.availableDate\"\n (dateInput)=\"property.availableDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"availableDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #availableDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Price </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"price\" name=\"price\" required rolatechDecimal />\n </mat-form-field>\n @if (property.priceType && property.priceType.toString() === 'PARTIAL') {\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Deposit </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"deposit\" name=\"deposit\" required rolatechDecimal />\n </mat-form-field>\n }\n </form>\n </div>\n <div>\n <button mat-flat-button (click)=\"update()\" i18n>Save</button>\n </div>\n }\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
2626
|
+
], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Basic info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n @if (property) {\n <div class=\"flex flex-col\">\n <form #propertyForm=\"ngForm\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bedrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bedrooms\" name=\"bedrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bathrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bathrooms\" name=\"bathrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Receptions </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.receptions\" name=\"receptions\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Floor </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.floor\" name=\"floor\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Size(sqft) </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.size\" name=\"size\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Type</mat-label>\n <mat-select\n name=\"type\"\n [compareWith]=\"typeCompareFn\"\n (selectionChange)=\"onTypeChange($event)\"\n [(ngModel)]=\"property.type\"\n >\n @for (type of propertyType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Price type</mat-label>\n <mat-select name=\"priceType\" [compareWith]=\"priceTypeCompareFn\" [(ngModel)]=\"property.priceType\">\n @for (type of priceType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field> -->\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Available date</mat-label>\n <input\n matInput\n placeholder=\"Available date\"\n [matDatepicker]=\"availableDatePicker\"\n [min]=\"minDate\"\n (focus)=\"availableDatePicker.open()\"\n name=\"availableDate\"\n [(ngModel)]=\"property.availableDate\"\n (dateInput)=\"property.availableDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"availableDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #availableDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Price </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"price\" name=\"price\" required rolatechDecimal />\n </mat-form-field>\n @if (property.priceType && property.priceType.toString() === 'PARTIAL') {\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Deposit </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"deposit\" name=\"deposit\" required rolatechDecimal />\n </mat-form-field>\n }\n </form>\n </div>\n <div>\n <button mat-flat-button (click)=\"update()\" i18n>Save</button>\n </div>\n }\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
2569
2627
|
}] });
|
|
2570
2628
|
|
|
2571
2629
|
const SIZE = 10 * 1024 * 1024; // file slice size 10MB
|
|
@@ -2733,19 +2791,19 @@ class PropertyManageMediaComponent {
|
|
|
2733
2791
|
}
|
|
2734
2792
|
});
|
|
2735
2793
|
}
|
|
2736
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2737
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2794
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2795
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageMediaComponent, isStandalone: true, selector: "rolatech-property-manage-media", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Media info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"onMultipleFilesUpload($event)\">\n @for (item of media; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onImageClick(i)\"\n (deleteMedia)=\"onMediaDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: MediaListComponent, selector: "rolatech-media-list", inputs: ["isUploading", "media", "showAdd"], outputs: ["mediaItemClick", "upload"] }, { kind: "component", type: MediaListItemComponent, selector: "rolatech-media-list-item", inputs: ["media", "uploadProgress", "uploading"], outputs: ["mediaItemClick", "deleteMedia"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }] });
|
|
2738
2796
|
}
|
|
2739
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2797
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageMediaComponent, decorators: [{
|
|
2740
2798
|
type: Component,
|
|
2741
2799
|
args: [{ selector: 'rolatech-property-manage-media', imports: [MediaListComponent, MediaListItemComponent, ToolbarComponent, PropertyManageContentComponent], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Media info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"onMultipleFilesUpload($event)\">\n @for (item of media; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onImageClick(i)\"\n (deleteMedia)=\"onMediaDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n" }]
|
|
2742
2800
|
}], ctorParameters: () => [] });
|
|
2743
2801
|
|
|
2744
2802
|
class PropertyManageSectionItemComponent {
|
|
2745
|
-
isUploading = input();
|
|
2746
|
-
section = input.required();
|
|
2747
|
-
actions = input(false);
|
|
2748
|
-
selectMedia = input();
|
|
2803
|
+
isUploading = input(...(ngDevMode ? [undefined, { debugName: "isUploading" }] : []));
|
|
2804
|
+
section = input.required(...(ngDevMode ? [{ debugName: "section" }] : []));
|
|
2805
|
+
actions = input(false, ...(ngDevMode ? [{ debugName: "actions" }] : []));
|
|
2806
|
+
selectMedia = input(...(ngDevMode ? [undefined, { debugName: "selectMedia" }] : []));
|
|
2749
2807
|
upload = output();
|
|
2750
2808
|
delete = output();
|
|
2751
2809
|
save = output();
|
|
@@ -2776,8 +2834,8 @@ class PropertyManageSectionItemComponent {
|
|
|
2776
2834
|
this.deleteMedia.emit({ section: this.section(), media });
|
|
2777
2835
|
this.selectedImg = this.section().media ? first(this.section().media) : null;
|
|
2778
2836
|
}
|
|
2779
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2780
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
2837
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageSectionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2838
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageSectionItemComponent, isStandalone: true, selector: "rolatech-property-manage-section-item", inputs: { isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null }, section: { classPropertyName: "section", publicName: "section", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, selectMedia: { classPropertyName: "selectMedia", publicName: "selectMedia", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { upload: "upload", delete: "delete", save: "save", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div class=\"px-3\">\n <div\n class=\"h-14 py-3 flex items-center justify-between cursor-pointer\"\n (click)=\"expanded = !expanded; $event.stopPropagation()\"\n >\n <div class=\"flex\">\n <div class=\"w-32 line-clamp-1\">{{ section().title }}</div>\n <div class=\"line-clamp-1\">{{ section().description }}</div>\n </div>\n <div>\n <button mat-icon-button aria-label=\"expand row\" (click)=\"expanded = !expanded; $event.stopPropagation()\">\n @if (expanded) {\n <mat-icon>keyboard_arrow_up</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_down</mat-icon>\n }\n </button>\n </div>\n </div>\n <div class=\"flex flex-col gap-3 w-full overflow-hidden\" [@detailExpand]=\"expanded ? 'expanded' : 'collapsed'\">\n <div class=\"flex flex-col lg:flex-row\">\n <div class=\"flex flex-col grow\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Title</mat-label>\n <input matInput placeholder=\"Title\" i18n-placeholder [(ngModel)]=\"section().title\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" [hideRequiredMarker]=\"true\">\n <mat-label i18n>Description</mat-label>\n <textarea\n matInput\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n placeholder=\"Description\"\n [(ngModel)]=\"section().description\"\n i18n-placeholder\n ></textarea>\n </mat-form-field>\n </div>\n <!-- media -->\n <div class=\"lg:basis-1/2 px-0 lg:px-3\">\n @if (selectedImg) {\n <div class=\"flex flex-row justify-center relative aspect-video\">\n <img class=\"object-contain w-full\" [src]=\"selectedImg.url\" [alt]=\"selectedImg.alt\" />\n <div class=\"absolute z-30 right-0\">\n <button\n mat-icon-button\n [matMenuTriggerFor]=\"beforeMenu\"\n class=\"ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1\"\n >\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(selectedImg)\">\n <span i18n>Delete</span>\n </button>\n </mat-menu>\n </div>\n </div>\n }\n\n <!-- media -->\n <div>\n <div class=\"flex flex-row flex-wrap cursor-pointer relative box-border\" fxLayout=\"row\">\n <div class=\"progress-bar\">\n @if (section().isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n @for (media of section().media; track media) {\n <div class=\"media-list-item\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n }\n <input style=\"display: none\" type=\"file\" accept=\"image/*\" (change)=\"onUpload($event)\" #fileInput />\n <div class=\"add-button\">\n <div (click)=\"fileInput.click()\" class=\"tile-media flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"48px\" viewBox=\"0 -960 960 960\" width=\"48px\" fill=\"#5f6368\">\n <path d=\"M444-444H240v-72h204v-204h72v204h204v72H516v204h-72v-204Z\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n @if (actions()) {\n <div class=\"flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onDelete(section())\" i18n>Delete</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(section())\" i18n>Save</button>\n </div>\n }\n </div>\n</div>\n\n<mat-divider></mat-divider>\n", styles: [".media-list{flex-wrap:wrap;box-sizing:border-box}.progress-bar{display:block;min-height:6px;width:100%}.media-list-item{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:64px;width:64px;object-fit:contain;cursor:pointer;border:1px solid grey;position:relative;box-sizing:border-box;border-radius:8px}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], animations: [
|
|
2781
2839
|
trigger('detailExpand', [
|
|
2782
2840
|
state('collapsed', style({ height: '0px' })),
|
|
2783
2841
|
state('expanded', style({ height: '*' })),
|
|
@@ -2785,7 +2843,7 @@ class PropertyManageSectionItemComponent {
|
|
|
2785
2843
|
]),
|
|
2786
2844
|
] });
|
|
2787
2845
|
}
|
|
2788
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2846
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageSectionItemComponent, decorators: [{
|
|
2789
2847
|
type: Component,
|
|
2790
2848
|
args: [{ selector: 'rolatech-property-manage-section-item', imports: [
|
|
2791
2849
|
MatFormFieldModule,
|
|
@@ -2956,10 +3014,10 @@ class PropertyManageSectionsComponent {
|
|
|
2956
3014
|
}
|
|
2957
3015
|
});
|
|
2958
3016
|
}
|
|
2959
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2960
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3017
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3018
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageSectionsComponent, isStandalone: true, selector: "rolatech-property-manage-sections", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Details\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <div>\n <div>\n @for (section of sections; track section) {\n <rolatech-property-manage-section-item\n [section]=\"section\"\n (upload)=\"onUploadSectionMedia($event)\"\n (deleteMedia)=\"onDeleteSectionMedia($event)\"\n (save)=\"onSectionSave($event)\"\n (delete)=\"onSectionDelete($event)\"\n [actions]=\"true\"\n ></rolatech-property-manage-section-item>\n }\n </div>\n <button mat-stroked-button (click)=\"addSection()\" class=\"mt-3\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: PropertyManageSectionItemComponent, selector: "rolatech-property-manage-section-item", inputs: ["isUploading", "section", "actions", "selectMedia"], outputs: ["upload", "delete", "save", "deleteMedia"] }] });
|
|
2961
3019
|
}
|
|
2962
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3020
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageSectionsComponent, decorators: [{
|
|
2963
3021
|
type: Component,
|
|
2964
3022
|
args: [{ selector: 'rolatech-property-manage-sections', imports: [
|
|
2965
3023
|
MatButtonModule,
|
|
@@ -2971,19 +3029,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2971
3029
|
}], ctorParameters: () => [] });
|
|
2972
3030
|
|
|
2973
3031
|
class PropertyManagePricingComponent {
|
|
2974
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2975
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
3032
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManagePricingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3033
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PropertyManagePricingComponent, isStandalone: true, selector: "rolatech-property-manage-pricing", ngImport: i0, template: "<p>property-manage-pricing works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
2976
3034
|
}
|
|
2977
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3035
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManagePricingComponent, decorators: [{
|
|
2978
3036
|
type: Component,
|
|
2979
3037
|
args: [{ selector: 'rolatech-property-manage-pricing', imports: [CommonModule], template: "<p>property-manage-pricing works!</p>\n" }]
|
|
2980
3038
|
}] });
|
|
2981
3039
|
|
|
2982
3040
|
class PropertyManageScheduleComponent {
|
|
2983
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2984
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
3041
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageScheduleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3042
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PropertyManageScheduleComponent, isStandalone: true, selector: "rolatech-property-manage-schedule", ngImport: i0, template: "<p>property-manage-schedule works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
2985
3043
|
}
|
|
2986
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3044
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageScheduleComponent, decorators: [{
|
|
2987
3045
|
type: Component,
|
|
2988
3046
|
args: [{ selector: 'rolatech-property-manage-schedule', imports: [CommonModule], template: "<p>property-manage-schedule works!</p>\n" }]
|
|
2989
3047
|
}] });
|
|
@@ -3011,6 +3069,7 @@ class PropertyManageFeaturesComponent extends BaseComponent {
|
|
|
3011
3069
|
features: this.featureService.find({}),
|
|
3012
3070
|
options: this.propertyService.findFeatures(this.id),
|
|
3013
3071
|
}).subscribe(({ features, options }) => {
|
|
3072
|
+
console.log(options);
|
|
3014
3073
|
this.features = features.data;
|
|
3015
3074
|
if (options.data) {
|
|
3016
3075
|
this.selected = this.convertToBinding(options.data);
|
|
@@ -3070,10 +3129,10 @@ class PropertyManageFeaturesComponent extends BaseComponent {
|
|
|
3070
3129
|
}
|
|
3071
3130
|
return binding;
|
|
3072
3131
|
}
|
|
3073
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3074
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3132
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageFeaturesComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3133
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageFeaturesComponent, isStandalone: true, selector: "rolatech-property-manage-features", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Features\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n @for (feature of features; track $index) {\n <div>\n <h4>{{ feature.name }}</h4>\n @for (value of feature.values; track $index) {\n <mat-checkbox\n [checked]=\"selected[feature.id] ? selected[feature.id].includes(value.id) : false\"\n (change)=\"toggleValue(feature.id, value.id, $event.checked)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n }\n </div>\n\n <!-- @for (item of features; track item) {\n <section class=\"example-section\">\n <span class=\"example-list-section\">\n <h4>{{ item.name }}</h4>\n <mat-checkbox\n class=\"example-margin\"\n [checked]=\"item.selected\"\n [indeterminate]=\"partiallyComplete(item)()\"\n (change)=\"sectionChange(item, $event.checked)\"\n >\n {{ item.name }}\n </mat-checkbox>\n </span>\n <div class=\"example-list-section\">\n <div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox [checked]=\"value.selected\" (change)=\"sectionChange(item, $event.checked, i)\">\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n </div>\n </section>\n } -->\n <!-- <div class=\"px-3 mb-3\">\n @for (item of features; track $index) {\n <div class=\"text-xl font-bold py-2\">{{ item.name }}</div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox\n class=\"text-lg font-medium\"\n (click)=\"$event.stopPropagation()\"\n [checked]=\"value.selected\"\n (change)=\"sectionChange($event.checked, i)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n }\n </div> -->\n <button mat-flat-button (click)=\"save()\" i18n>Save</button>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$6.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
|
|
3075
3134
|
}
|
|
3076
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3135
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageFeaturesComponent, decorators: [{
|
|
3077
3136
|
type: Component,
|
|
3078
3137
|
args: [{ selector: 'rolatech-property-manage-features', imports: [CommonModule, PropertyManageContentComponent, ToolbarComponent, MatCheckboxModule, MatButtonModule], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Features\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n @for (feature of features; track $index) {\n <div>\n <h4>{{ feature.name }}</h4>\n @for (value of feature.values; track $index) {\n <mat-checkbox\n [checked]=\"selected[feature.id] ? selected[feature.id].includes(value.id) : false\"\n (change)=\"toggleValue(feature.id, value.id, $event.checked)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n }\n </div>\n\n <!-- @for (item of features; track item) {\n <section class=\"example-section\">\n <span class=\"example-list-section\">\n <h4>{{ item.name }}</h4>\n <mat-checkbox\n class=\"example-margin\"\n [checked]=\"item.selected\"\n [indeterminate]=\"partiallyComplete(item)()\"\n (change)=\"sectionChange(item, $event.checked)\"\n >\n {{ item.name }}\n </mat-checkbox>\n </span>\n <div class=\"example-list-section\">\n <div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox [checked]=\"value.selected\" (change)=\"sectionChange(item, $event.checked, i)\">\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n </div>\n </section>\n } -->\n <!-- <div class=\"px-3 mb-3\">\n @for (item of features; track $index) {\n <div class=\"text-xl font-bold py-2\">{{ item.name }}</div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox\n class=\"text-lg font-medium\"\n (click)=\"$event.stopPropagation()\"\n [checked]=\"value.selected\"\n (change)=\"sectionChange($event.checked, i)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n }\n </div> -->\n <button mat-flat-button (click)=\"save()\" i18n>Save</button>\n</rolatech-property-manage-content>\n" }]
|
|
3079
3138
|
}] });
|
|
@@ -3100,14 +3159,14 @@ class PropertyManageLocationComponent extends BaseComponent {
|
|
|
3100
3159
|
location = model({
|
|
3101
3160
|
flatNumber: '',
|
|
3102
3161
|
streetNumber: '',
|
|
3103
|
-
|
|
3162
|
+
name: '',
|
|
3104
3163
|
street: '',
|
|
3105
3164
|
town: '',
|
|
3106
3165
|
postCode: '',
|
|
3107
3166
|
country: '',
|
|
3108
3167
|
longitude: '',
|
|
3109
3168
|
latitude: '',
|
|
3110
|
-
});
|
|
3169
|
+
}, ...(ngDevMode ? [{ debugName: "location" }] : []));
|
|
3111
3170
|
platformId = inject(PLATFORM_ID);
|
|
3112
3171
|
placeAutocompleteElement;
|
|
3113
3172
|
autocompleteInput;
|
|
@@ -3226,8 +3285,10 @@ class PropertyManageLocationComponent extends BaseComponent {
|
|
|
3226
3285
|
},
|
|
3227
3286
|
});
|
|
3228
3287
|
}
|
|
3229
|
-
|
|
3230
|
-
|
|
3288
|
+
searchSchools(lat, lng, radius = 2000) {
|
|
3289
|
+
}
|
|
3290
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageLocationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3291
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageLocationComponent, isStandalone: true, selector: "rolatech-property-manage-location", inputs: { location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { location: "locationChange" }, viewQueries: [{ propertyName: "autocompleteInput", first: true, predicate: ["autocompleteInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Location\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <mat-form-field position=\"left\">\n <input\n type=\"text\"\n placeholder=\"Search for a location\"\n #searchInput\n (input)=\"onInputChange($event)\"\n matInput\n [matAutocomplete]=\"auto\"\n />\n <mat-autocomplete\n class=\"single-autocomplete\"\n #auto=\"matAutocomplete\"\n (optionSelected)=\"onOptionSelected($event)\"\n [displayWith]=\"displayFn\"\n >\n @for (prediction of predictions; track $index) {\n <mat-option [value]=\"prediction\">\n {{ prediction.description }}\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n <div class=\"border px-3 rounded-md\">\n <div class=\"flex justify-between items-center py-3 cursor-pointer select-none\" i18n (click)=\"expand = !expand\">\n <span> Enter the address manually </span>\n <mat-icon>{{ expand ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n <div [@contentAnimation]=\"expand\" [class.hidden]=\"!expand\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Flat number </mat-label>\n <input matInput [(ngModel)]=\"location().flatNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street number </mat-label>\n <input matInput [(ngModel)]=\"location().streetNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Building name </mat-label>\n <input matInput [(ngModel)]=\"location().name\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street </mat-label>\n <input matInput [(ngModel)]=\"location().street\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Town </mat-label>\n <input matInput [(ngModel)]=\"location().town\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Postcode </mat-label>\n <input matInput [(ngModel)]=\"location().postCode\" required />\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex justify-end items-center p-3 gap-3\">\n <button mat-flat-button i18n (click)=\"save()\">Save</button>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], animations: [
|
|
3231
3292
|
trigger('contentAnimation', [
|
|
3232
3293
|
state('hidden', style({
|
|
3233
3294
|
height: '0',
|
|
@@ -3241,7 +3302,7 @@ class PropertyManageLocationComponent extends BaseComponent {
|
|
|
3241
3302
|
]),
|
|
3242
3303
|
] });
|
|
3243
3304
|
}
|
|
3244
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageLocationComponent, decorators: [{
|
|
3245
3306
|
type: Component,
|
|
3246
3307
|
args: [{ selector: 'rolatech-property-manage-location', imports: [
|
|
3247
3308
|
PropertyManageContentComponent,
|
|
@@ -3267,7 +3328,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
3267
3328
|
})),
|
|
3268
3329
|
transition('hidden <=> visible', animate('300ms ease-in-out')),
|
|
3269
3330
|
]),
|
|
3270
|
-
], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Location\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <mat-form-field position=\"left\">\n <input\n type=\"text\"\n placeholder=\"Search for a location\"\n #searchInput\n (input)=\"onInputChange($event)\"\n matInput\n [matAutocomplete]=\"auto\"\n />\n <mat-autocomplete\n class=\"single-autocomplete\"\n #auto=\"matAutocomplete\"\n (optionSelected)=\"onOptionSelected($event)\"\n [displayWith]=\"displayFn\"\n >\n @for (prediction of predictions; track $index) {\n <mat-option [value]=\"prediction\">\n {{ prediction.description }}\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n <div class=\"border px-3 rounded-md\">\n <div class=\"flex justify-between items-center py-3 cursor-pointer select-none\" i18n (click)=\"expand = !expand\">\n <span> Enter the address manually </span>\n <mat-icon>{{ expand ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n <div [@contentAnimation]=\"expand\" [class.hidden]=\"!expand\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Flat number </mat-label>\n <input matInput [(ngModel)]=\"location().flatNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street number </mat-label>\n <input matInput [(ngModel)]=\"location().streetNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Building name </mat-label>\n <input matInput [(ngModel)]=\"location().
|
|
3331
|
+
], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Location\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <mat-form-field position=\"left\">\n <input\n type=\"text\"\n placeholder=\"Search for a location\"\n #searchInput\n (input)=\"onInputChange($event)\"\n matInput\n [matAutocomplete]=\"auto\"\n />\n <mat-autocomplete\n class=\"single-autocomplete\"\n #auto=\"matAutocomplete\"\n (optionSelected)=\"onOptionSelected($event)\"\n [displayWith]=\"displayFn\"\n >\n @for (prediction of predictions; track $index) {\n <mat-option [value]=\"prediction\">\n {{ prediction.description }}\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n <div class=\"border px-3 rounded-md\">\n <div class=\"flex justify-between items-center py-3 cursor-pointer select-none\" i18n (click)=\"expand = !expand\">\n <span> Enter the address manually </span>\n <mat-icon>{{ expand ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n <div [@contentAnimation]=\"expand\" [class.hidden]=\"!expand\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Flat number </mat-label>\n <input matInput [(ngModel)]=\"location().flatNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street number </mat-label>\n <input matInput [(ngModel)]=\"location().streetNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Building name </mat-label>\n <input matInput [(ngModel)]=\"location().name\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street </mat-label>\n <input matInput [(ngModel)]=\"location().street\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Town </mat-label>\n <input matInput [(ngModel)]=\"location().town\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Postcode </mat-label>\n <input matInput [(ngModel)]=\"location().postCode\" required />\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex justify-end items-center p-3 gap-3\">\n <button mat-flat-button i18n (click)=\"save()\">Save</button>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
3271
3332
|
}], propDecorators: { autocompleteInput: [{
|
|
3272
3333
|
type: ViewChild,
|
|
3273
3334
|
args: ['autocompleteInput', { static: false }]
|
|
@@ -3286,119 +3347,14 @@ class PropertyVideoTourAddComponent {
|
|
|
3286
3347
|
this.videoId = this.getYouTubeVideoId(this.videoUrl);
|
|
3287
3348
|
this.output.emit(this.videoId);
|
|
3288
3349
|
}
|
|
3289
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3290
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
3350
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyVideoTourAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3351
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PropertyVideoTourAddComponent, isStandalone: true, selector: "rolatech-property-video-tour-add", outputs: { output: "output" }, ngImport: i0, template: "<mat-form-field appearance=\"fill\">\n <mat-label>Youtube Video URL</mat-label>\n <input matInput placeholder=\"Youtube Video URL\" type=\"text\" [(ngModel)]=\"videoUrl\" i18n />\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
3291
3352
|
}
|
|
3292
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3353
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyVideoTourAddComponent, decorators: [{
|
|
3293
3354
|
type: Component,
|
|
3294
3355
|
args: [{ selector: 'rolatech-property-video-tour-add', imports: [CommonModule, MatFormFieldModule, MatInputModule, FormsModule], template: "<mat-form-field appearance=\"fill\">\n <mat-label>Youtube Video URL</mat-label>\n <input matInput placeholder=\"Youtube Video URL\" type=\"text\" [(ngModel)]=\"videoUrl\" i18n />\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
3295
3356
|
}] });
|
|
3296
3357
|
|
|
3297
|
-
class PropertyVideoTourDialog {
|
|
3298
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyVideoTourDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3299
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: PropertyVideoTourDialog, isStandalone: true, selector: "rolatech-property-video-tour-dialog", ngImport: i0, template: "<p>property-video-tour-dialog works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
3300
|
-
}
|
|
3301
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyVideoTourDialog, decorators: [{
|
|
3302
|
-
type: Component,
|
|
3303
|
-
args: [{ selector: 'rolatech-property-video-tour-dialog', imports: [CommonModule], template: "<p>property-video-tour-dialog works!</p>\n" }]
|
|
3304
|
-
}] });
|
|
3305
|
-
|
|
3306
|
-
class PropertyVideoTourItem {
|
|
3307
|
-
platformId = inject(PLATFORM_ID);
|
|
3308
|
-
el = inject(ElementRef);
|
|
3309
|
-
dialogService = inject(DialogService);
|
|
3310
|
-
myVideo = viewChild('video');
|
|
3311
|
-
progress = input(0);
|
|
3312
|
-
property = input.required();
|
|
3313
|
-
actions = input(true);
|
|
3314
|
-
hasUnsaved = input(false);
|
|
3315
|
-
editId = model();
|
|
3316
|
-
save = output();
|
|
3317
|
-
cancel = output();
|
|
3318
|
-
delete = output();
|
|
3319
|
-
edit = output();
|
|
3320
|
-
mediaEdit = output();
|
|
3321
|
-
thumbnailUpload = output();
|
|
3322
|
-
upload = output();
|
|
3323
|
-
deleteMedia = output();
|
|
3324
|
-
editing = false;
|
|
3325
|
-
onSave(property) {
|
|
3326
|
-
this.editing = false;
|
|
3327
|
-
this.editId.set(null);
|
|
3328
|
-
this.save.emit(property);
|
|
3329
|
-
}
|
|
3330
|
-
onCancel(property) {
|
|
3331
|
-
this.editing = false;
|
|
3332
|
-
this.editId.set(null);
|
|
3333
|
-
this.cancel.emit(property);
|
|
3334
|
-
}
|
|
3335
|
-
onDelete(property) {
|
|
3336
|
-
this.delete.emit(property);
|
|
3337
|
-
}
|
|
3338
|
-
onEdit(property) {
|
|
3339
|
-
this.editId.set(property.id);
|
|
3340
|
-
this.editing = true;
|
|
3341
|
-
this.edit.emit(property);
|
|
3342
|
-
}
|
|
3343
|
-
onMediaEdit(property) {
|
|
3344
|
-
this.editId.set(property.id);
|
|
3345
|
-
this.editing = true;
|
|
3346
|
-
// this.mediaEdit.emit(property);
|
|
3347
|
-
const options = {
|
|
3348
|
-
title: '编辑视频',
|
|
3349
|
-
cancelText: 'Cancel',
|
|
3350
|
-
confirmText: '确定',
|
|
3351
|
-
data: this.property(),
|
|
3352
|
-
width: '80vw',
|
|
3353
|
-
maxWidth: '80vw',
|
|
3354
|
-
height: '100%',
|
|
3355
|
-
component: PropertyVideoTourDialog,
|
|
3356
|
-
};
|
|
3357
|
-
this.dialogService.open(options);
|
|
3358
|
-
this.dialogService.confirmed().subscribe({
|
|
3359
|
-
next: (res) => {
|
|
3360
|
-
if (res) {
|
|
3361
|
-
const data = {
|
|
3362
|
-
name: res,
|
|
3363
|
-
};
|
|
3364
|
-
}
|
|
3365
|
-
},
|
|
3366
|
-
});
|
|
3367
|
-
}
|
|
3368
|
-
onVideoThumbnailUpload(video) {
|
|
3369
|
-
this.thumbnailUpload.emit(video);
|
|
3370
|
-
}
|
|
3371
|
-
onUpload(id, data) {
|
|
3372
|
-
this.property().videoTour.uploading = true;
|
|
3373
|
-
this.upload.emit({ id, data });
|
|
3374
|
-
}
|
|
3375
|
-
onDeleteMedia(data) {
|
|
3376
|
-
this.deleteMedia.emit(data);
|
|
3377
|
-
}
|
|
3378
|
-
onLoadedMetadata(event) {
|
|
3379
|
-
if (this.property().videoTour.duration) {
|
|
3380
|
-
return;
|
|
3381
|
-
}
|
|
3382
|
-
const videoElement = event.target;
|
|
3383
|
-
this.property().videoTour.duration = videoElement.duration;
|
|
3384
|
-
}
|
|
3385
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyVideoTourItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3386
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: PropertyVideoTourItem, isStandalone: true, selector: "rolatech-property-video-tour-item", inputs: { progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, hasUnsaved: { classPropertyName: "hasUnsaved", publicName: "hasUnsaved", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editId: "editIdChange", save: "save", cancel: "cancel", delete: "delete", edit: "edit", mediaEdit: "mediaEdit", thumbnailUpload: "thumbnailUpload", upload: "upload", deleteMedia: "deleteMedia" }, viewQueries: [{ propertyName: "myVideo", first: true, predicate: ["video"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col grow p-2\">\n @if (property().id !== editId()) {\n <div class=\"w-full flex gap-3 p-3 items-center\">\n <span>{{ property().title }}</span>\n <button mat-icon-button (click)=\"onEdit(property()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete(property()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n } @else {\n <div class=\"flex flex-col justify-between items-center\">\n <rolatech-input [(title)]=\"property().title\" placeholder=\"Title\"></rolatech-input>\n <div class=\"w-full flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onCancel(property())\" i18n>Cancel</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(property())\" i18n>Save</button>\n </div>\n </div>\n }\n\n <div>\n @if (property().videoTour) {\n <div class=\"flex flex-row p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n id=\"video\"\n #video\n [src]=\"property().videoTour.url\"\n class=\"w-32 aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"property().videoTour.thumbnail\"\n ></video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-between items-center w-full px-2\">\n <span i18n>Video</span>\n </div>\n @if (property().videoTour.uploading) {\n <div>\n <span> {{ property().videoTour.progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <button mat-button class=\"max-h-8\" (click)=\"onMediaEdit(property().videoTour); $event.stopPropagation()\">\n <mat-icon>edit</mat-icon>\n <span i18n>Edit</span>\n </button>\n <button mat-button class=\"max-h-8\" (click)=\"onDeleteMedia(property().videoTour); $event.stopPropagation()\">\n <mat-icon>delete</mat-icon>\n <span i18n>Delete</span>\n </button>\n </div>\n <div>\n <span>{{ property().videoTour.duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (property().videoTour.uploading) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"property().videoTour.progress\"> </mat-progress-bar>\n </div>\n } } @else { @if (property().id !== editId()) {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload(property().id, $event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n } }\n </div>\n @if (!hasUnsaved) {\n <ng-content></ng-content>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i8$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: DurationPipe, name: "duration" }, { kind: "component", type: InputComponent, selector: "rolatech-input", inputs: ["title", "placeholder"], outputs: ["titleChange"] }] });
|
|
3387
|
-
}
|
|
3388
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyVideoTourItem, decorators: [{
|
|
3389
|
-
type: Component,
|
|
3390
|
-
args: [{ selector: 'rolatech-property-video-tour-item', imports: [
|
|
3391
|
-
MatIconModule,
|
|
3392
|
-
AngularCommonModule,
|
|
3393
|
-
FormsModule,
|
|
3394
|
-
MatButtonModule,
|
|
3395
|
-
MatDividerModule,
|
|
3396
|
-
AngularComponentsModule,
|
|
3397
|
-
DurationPipe,
|
|
3398
|
-
InputComponent,
|
|
3399
|
-
], template: "<div class=\"flex flex-col grow p-2\">\n @if (property().id !== editId()) {\n <div class=\"w-full flex gap-3 p-3 items-center\">\n <span>{{ property().title }}</span>\n <button mat-icon-button (click)=\"onEdit(property()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete(property()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n } @else {\n <div class=\"flex flex-col justify-between items-center\">\n <rolatech-input [(title)]=\"property().title\" placeholder=\"Title\"></rolatech-input>\n <div class=\"w-full flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onCancel(property())\" i18n>Cancel</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(property())\" i18n>Save</button>\n </div>\n </div>\n }\n\n <div>\n @if (property().videoTour) {\n <div class=\"flex flex-row p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n id=\"video\"\n #video\n [src]=\"property().videoTour.url\"\n class=\"w-32 aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"property().videoTour.thumbnail\"\n ></video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-between items-center w-full px-2\">\n <span i18n>Video</span>\n </div>\n @if (property().videoTour.uploading) {\n <div>\n <span> {{ property().videoTour.progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <button mat-button class=\"max-h-8\" (click)=\"onMediaEdit(property().videoTour); $event.stopPropagation()\">\n <mat-icon>edit</mat-icon>\n <span i18n>Edit</span>\n </button>\n <button mat-button class=\"max-h-8\" (click)=\"onDeleteMedia(property().videoTour); $event.stopPropagation()\">\n <mat-icon>delete</mat-icon>\n <span i18n>Delete</span>\n </button>\n </div>\n <div>\n <span>{{ property().videoTour.duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (property().videoTour.uploading) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"property().videoTour.progress\"> </mat-progress-bar>\n </div>\n } } @else { @if (property().id !== editId()) {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload(property().id, $event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n } }\n </div>\n @if (!hasUnsaved) {\n <ng-content></ng-content>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"] }]
|
|
3400
|
-
}] });
|
|
3401
|
-
|
|
3402
3358
|
class PropertyManageVideoTourComponent extends BaseComponent {
|
|
3403
3359
|
propertyService = inject(PropertyService);
|
|
3404
3360
|
sanitizer = inject(DomSanitizer);
|
|
@@ -3409,6 +3365,7 @@ class PropertyManageVideoTourComponent extends BaseComponent {
|
|
|
3409
3365
|
safeURL = this.sanitizer.bypassSecurityTrustResourceUrl('');
|
|
3410
3366
|
thumbnailUrl;
|
|
3411
3367
|
type = PropertyVideoTourType;
|
|
3368
|
+
chunkSize = 5 * 1024 * 1024; // 切片大小
|
|
3412
3369
|
ngOnInit() {
|
|
3413
3370
|
this.id = this.route.parent?.snapshot.paramMap.get('id');
|
|
3414
3371
|
this.getVideoTour();
|
|
@@ -3484,12 +3441,108 @@ class PropertyManageVideoTourComponent extends BaseComponent {
|
|
|
3484
3441
|
},
|
|
3485
3442
|
});
|
|
3486
3443
|
}
|
|
3487
|
-
|
|
3488
|
-
|
|
3444
|
+
onUploadToCOS(event) {
|
|
3445
|
+
const file = event.data.target.files[0];
|
|
3446
|
+
if (!file) {
|
|
3447
|
+
return;
|
|
3448
|
+
}
|
|
3449
|
+
const item = {
|
|
3450
|
+
url: URL.createObjectURL(file),
|
|
3451
|
+
};
|
|
3452
|
+
const reader = new FileReader();
|
|
3453
|
+
if (reader.readyState === FileReader.EMPTY) {
|
|
3454
|
+
reader.onload = async (e) => {
|
|
3455
|
+
const fileBuffer = e.target.result;
|
|
3456
|
+
crypto.subtle.digest('SHA-256', fileBuffer).then((res) => {
|
|
3457
|
+
const hashArray = Array.from(new Uint8Array(res));
|
|
3458
|
+
const hashHex = hashArray.map((byte) => byte.toString(16).padStart(2, '0')).join('');
|
|
3459
|
+
const data = { hash: hashHex, filename: file.name, fileType: file.type };
|
|
3460
|
+
this.propertyService.uploadVideoTourInit(this.id, data).subscribe({
|
|
3461
|
+
next: (res) => {
|
|
3462
|
+
this.uploadPart(null, res.data.uploadId, file);
|
|
3463
|
+
},
|
|
3464
|
+
error: (e) => { },
|
|
3465
|
+
});
|
|
3466
|
+
});
|
|
3467
|
+
};
|
|
3468
|
+
reader.onerror = (error) => { };
|
|
3469
|
+
reader.readAsArrayBuffer(file);
|
|
3470
|
+
}
|
|
3471
|
+
}
|
|
3472
|
+
uploadPart(lecture, uploadId, file) {
|
|
3473
|
+
let uploadedCount = 0;
|
|
3474
|
+
const fileChunkList = this.createFileChunk(file);
|
|
3475
|
+
const numberOfChunks = fileChunkList.length;
|
|
3476
|
+
from(fileChunkList)
|
|
3477
|
+
.pipe(concatMap((val, index) => this.uploadFile(lecture, val.file, index, uploadId)), take(numberOfChunks))
|
|
3478
|
+
.subscribe((res) => {
|
|
3479
|
+
uploadedCount++;
|
|
3480
|
+
const p = ((uploadedCount / numberOfChunks) * 100).toFixed(0);
|
|
3481
|
+
lecture.item.progress = parseFloat(p);
|
|
3482
|
+
if (uploadedCount === numberOfChunks) {
|
|
3483
|
+
this.completePartUpload(lecture, { uploadId });
|
|
3484
|
+
}
|
|
3485
|
+
});
|
|
3486
|
+
}
|
|
3487
|
+
completePartUpload(lecture, data) {
|
|
3488
|
+
data.duration = lecture.item.duration;
|
|
3489
|
+
this.propertyService.completePartUpload(lecture.id, data).subscribe({
|
|
3490
|
+
next: (res) => {
|
|
3491
|
+
lecture.isUploading = false;
|
|
3492
|
+
lecture.item.id = res.data.id;
|
|
3493
|
+
},
|
|
3494
|
+
error: (e) => {
|
|
3495
|
+
this.snackBarService.open('Upload failed: ' + e.message);
|
|
3496
|
+
},
|
|
3497
|
+
});
|
|
3498
|
+
}
|
|
3499
|
+
uploadFile(lecture, file, index, uploadId) {
|
|
3500
|
+
const reader = new FileReader();
|
|
3501
|
+
return new Observable((observer) => {
|
|
3502
|
+
reader.readAsArrayBuffer(file);
|
|
3503
|
+
reader.onload = (e) => {
|
|
3504
|
+
const fileBuffer = e.target.result;
|
|
3505
|
+
crypto.subtle.digest('SHA-256', fileBuffer).then((res) => {
|
|
3506
|
+
const hashArray = Array.from(new Uint8Array(res));
|
|
3507
|
+
const hashHex = hashArray.map((byte) => byte.toString(16).padStart(2, '0')).join('');
|
|
3508
|
+
const formData = new FormData();
|
|
3509
|
+
formData.append('file', file);
|
|
3510
|
+
formData.append('uploadId', uploadId);
|
|
3511
|
+
formData.append('number', index + 1);
|
|
3512
|
+
formData.append('hash', hashHex);
|
|
3513
|
+
this.propertyService.uploadVideoTourPartsToProperty(lecture.id, formData).subscribe({
|
|
3514
|
+
next: (res) => {
|
|
3515
|
+
observer.next(res);
|
|
3516
|
+
observer.complete();
|
|
3517
|
+
},
|
|
3518
|
+
error: (e) => {
|
|
3519
|
+
this.snackBarService.open('Upload failed: ' + e.message);
|
|
3520
|
+
},
|
|
3521
|
+
});
|
|
3522
|
+
});
|
|
3523
|
+
};
|
|
3524
|
+
reader.onerror = (error) => {
|
|
3525
|
+
this.snackBarService.open('Upload failed: ' + error);
|
|
3526
|
+
};
|
|
3527
|
+
});
|
|
3528
|
+
}
|
|
3529
|
+
createFileChunk(file, size = this.chunkSize) {
|
|
3530
|
+
const fileChunkList = [];
|
|
3531
|
+
let count = 0;
|
|
3532
|
+
while (count < file.size) {
|
|
3533
|
+
fileChunkList.push({
|
|
3534
|
+
file: file.slice(count, count + size),
|
|
3535
|
+
});
|
|
3536
|
+
count += size;
|
|
3537
|
+
}
|
|
3538
|
+
return fileChunkList;
|
|
3539
|
+
}
|
|
3540
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageVideoTourComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3541
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageVideoTourComponent, isStandalone: true, selector: "rolatech-property-manage-video-tour", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Video tour\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <!-- <rolatech-property-video-tour-item [property]=\"\"></rolatech-property-video-tour-item> -->\n <div class=\"flex flex-col\">\n <div>\n <div>Youtube</div>\n <div></div>\n </div>\n <div>\n <div>COS</div>\n <div></div>\n </div>\n </div>\n <rolatech-video-upload (upload)=\"onUploadToCOS($event)\"></rolatech-video-upload>\n @for (item of propertyVideoTour; track $index) {\n <div>{{ type[item.type] === 'Youtube' }}</div>\n @if (type[item.type] === 'Youtube') {\n <div class=\"relative w-full aspect-video\">\n @if (!iframeLoaded) {\n <div class=\"absolute inset-0 flex items-center justify-center bg-black/10\">\n <span>Loading...</span>\n </div>\n }\n <iframe [src]=\"safeURL\" frameborder=\"0\" allowfullscreen class=\"w-full h-full\" (load)=\"iframeLoaded = true\"></iframe>\n </div>\n <button mat-flat-button (click)=\"updateVideoTour()\" class=\"mt-3\">Update video tour</button>\n }\n @if (type[item.type] === 'COS') {}\n }\n <!-- @if (propertyVideoTour) {\n\n } @else {\n <button mat-flat-button (click)=\"addVideoTour()\">Add video tour</button>\n } -->\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: VideoUpload, selector: "rolatech-video-upload", inputs: ["item", "uploading", "editing", "progress", "editId", "hasUnsaved"], outputs: ["uploadingChange", "editingChange", "mediaEdit", "thumbnailUpload", "upload", "deleteMedia", "editIdChange"] }] });
|
|
3489
3542
|
}
|
|
3490
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3543
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageVideoTourComponent, decorators: [{
|
|
3491
3544
|
type: Component,
|
|
3492
|
-
args: [{ selector: 'rolatech-property-manage-video-tour', imports: [ToolbarComponent, PropertyManageContentComponent, MatButtonModule,
|
|
3545
|
+
args: [{ selector: 'rolatech-property-manage-video-tour', imports: [ToolbarComponent, PropertyManageContentComponent, MatButtonModule, VideoUpload], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Video tour\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <!-- <rolatech-property-video-tour-item [property]=\"\"></rolatech-property-video-tour-item> -->\n <div class=\"flex flex-col\">\n <div>\n <div>Youtube</div>\n <div></div>\n </div>\n <div>\n <div>COS</div>\n <div></div>\n </div>\n </div>\n <rolatech-video-upload (upload)=\"onUploadToCOS($event)\"></rolatech-video-upload>\n @for (item of propertyVideoTour; track $index) {\n <div>{{ type[item.type] === 'Youtube' }}</div>\n @if (type[item.type] === 'Youtube') {\n <div class=\"relative w-full aspect-video\">\n @if (!iframeLoaded) {\n <div class=\"absolute inset-0 flex items-center justify-center bg-black/10\">\n <span>Loading...</span>\n </div>\n }\n <iframe [src]=\"safeURL\" frameborder=\"0\" allowfullscreen class=\"w-full h-full\" (load)=\"iframeLoaded = true\"></iframe>\n </div>\n <button mat-flat-button (click)=\"updateVideoTour()\" class=\"mt-3\">Update video tour</button>\n }\n @if (type[item.type] === 'COS') {}\n }\n <!-- @if (propertyVideoTour) {\n\n } @else {\n <button mat-flat-button (click)=\"addVideoTour()\">Add video tour</button>\n } -->\n</rolatech-property-manage-content>\n" }]
|
|
3493
3546
|
}] });
|
|
3494
3547
|
|
|
3495
3548
|
const propertyManageRoutes = [
|
|
@@ -3551,15 +3604,15 @@ const propertyManageRoutes = [
|
|
|
3551
3604
|
|
|
3552
3605
|
class PropertyViewingConfirmationComponent {
|
|
3553
3606
|
output = output();
|
|
3554
|
-
proposedTime = model();
|
|
3555
|
-
selectedTime = model();
|
|
3607
|
+
proposedTime = model(...(ngDevMode ? [undefined, { debugName: "proposedTime" }] : []));
|
|
3608
|
+
selectedTime = model(...(ngDevMode ? [undefined, { debugName: "selectedTime" }] : []));
|
|
3556
3609
|
ngDoCheck() {
|
|
3557
3610
|
this.output.emit(true);
|
|
3558
3611
|
}
|
|
3559
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3560
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3612
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3613
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyViewingConfirmationComponent, isStandalone: true, selector: "rolatech-property-viewing-confirmation", inputs: { proposedTime: { classPropertyName: "proposedTime", publicName: "proposedTime", isSignal: true, isRequired: false, transformFunction: null }, selectedTime: { classPropertyName: "selectedTime", publicName: "selectedTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", proposedTime: "proposedTimeChange", selectedTime: "selectedTimeChange" }, ngImport: i0, template: "<div>\n @if (proposedTime()) {\n <div>\n <span> {{ proposedTime().date }} </span><span>{{ proposedTime().time }}</span>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
3561
3614
|
}
|
|
3562
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3615
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyViewingConfirmationComponent, decorators: [{
|
|
3563
3616
|
type: Component,
|
|
3564
3617
|
args: [{ selector: 'rolatech-property-viewing-confirmation', imports: [CommonModule], template: "<div>\n @if (proposedTime()) {\n <div>\n <span> {{ proposedTime().date }} </span><span>{{ proposedTime().time }}</span>\n </div>\n }\n</div>\n" }]
|
|
3565
3618
|
}] });
|
|
@@ -3632,18 +3685,18 @@ class PropertyManageViewingsDetailComponent extends BaseComponent {
|
|
|
3632
3685
|
},
|
|
3633
3686
|
});
|
|
3634
3687
|
}
|
|
3635
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3636
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3688
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageViewingsDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3689
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: PropertyManageViewingsDetailComponent, isStandalone: true, selector: "rolatech-property-manage-viewings-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
3637
3690
|
}
|
|
3638
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3691
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PropertyManageViewingsDetailComponent, decorators: [{
|
|
3639
3692
|
type: Component,
|
|
3640
|
-
args: [{ selector: 'rolatech-property-manage-viewings-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, FixedPipe, MatButtonModule], template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer
|
|
3693
|
+
args: [{ selector: 'rolatech-property-manage-viewings-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, FixedPipe, MatButtonModule], template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price | fixed }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
|
|
3641
3694
|
}] });
|
|
3642
3695
|
|
|
3643
3696
|
const propertyManageViewingsRoutes = [
|
|
3644
3697
|
{
|
|
3645
3698
|
path: '',
|
|
3646
|
-
loadComponent: () => import('./rolatech-angular-property-property-manage-viewings-index.component-
|
|
3699
|
+
loadComponent: () => import('./rolatech-angular-property-property-manage-viewings-index.component-Dq8My7Sy.mjs').then((x) => x.PropertyManageViewingsIndexComponent),
|
|
3647
3700
|
},
|
|
3648
3701
|
{
|
|
3649
3702
|
path: ':id',
|
|
@@ -3654,10 +3707,10 @@ const propertyManageViewingsRoutes = [
|
|
|
3654
3707
|
class LettingManageItem {
|
|
3655
3708
|
hasClass = true;
|
|
3656
3709
|
el = inject(ElementRef);
|
|
3657
|
-
letting = input.required();
|
|
3658
|
-
thumbnail = input();
|
|
3710
|
+
letting = input.required(...(ngDevMode ? [{ debugName: "letting" }] : []));
|
|
3711
|
+
thumbnail = input(...(ngDevMode ? [undefined, { debugName: "thumbnail" }] : []));
|
|
3659
3712
|
status = PropertyStatus;
|
|
3660
|
-
list = input(false, { transform: booleanAttribute });
|
|
3713
|
+
list = input(false, ...(ngDevMode ? [{ debugName: "list", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
3661
3714
|
constructor() {
|
|
3662
3715
|
effect(() => {
|
|
3663
3716
|
if (this.list()) {
|
|
@@ -3668,10 +3721,10 @@ class LettingManageItem {
|
|
|
3668
3721
|
}
|
|
3669
3722
|
});
|
|
3670
3723
|
}
|
|
3671
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3672
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3724
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3725
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LettingManageItem, isStandalone: true, selector: "rolatech-letting-manage-item", inputs: { letting: { classPropertyName: "letting", publicName: "letting", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-letting-manage-item": "this.hasClass" } }, ngImport: i0, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (letting().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"letting().media ? letting().media[0].url : ''\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">{{ letting().title }}</div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ letting().price | fixed }}</div>\n</div>\n", styles: ["rolatech-letting-manage-item{--rt-letting-view-item-margin: 16px;width:calc(100% / var(--rt-letting-view-items-per-row) - var(--rt-letting-view-item-margin) - .01px)}rolatech-letting-manage-item[list]{--rt-letting-view-items-per-row: 1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "pipe", type: FixedPipe, name: "fixed" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
3673
3726
|
}
|
|
3674
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3727
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageItem, decorators: [{
|
|
3675
3728
|
type: Component,
|
|
3676
3729
|
args: [{ selector: 'rolatech-letting-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule, FixedPipe], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (letting().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"letting().media ? letting().media[0].url : ''\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">{{ letting().title }}</div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ letting().price | fixed }}</div>\n</div>\n", styles: ["rolatech-letting-manage-item{--rt-letting-view-item-margin: 16px;width:calc(100% / var(--rt-letting-view-items-per-row) - var(--rt-letting-view-item-margin) - .01px)}rolatech-letting-manage-item[list]{--rt-letting-view-items-per-row: 1}\n"] }]
|
|
3677
3730
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -3698,22 +3751,22 @@ class LettingManageIndex {
|
|
|
3698
3751
|
}
|
|
3699
3752
|
});
|
|
3700
3753
|
}
|
|
3701
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3702
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3754
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3755
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LettingManageIndex, isStandalone: true, selector: "rolatech-letting-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"Lettings\"> </rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of lettings; track $index) {\n <rolatech-letting-manage-item [letting]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-letting-manage-item>\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: ["rolatech-letting-manage-index{--rt-letting-view-items-per-row: 1}@media (min-width: 600px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 2}}@media (min-width: 768px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: LettingManageItem, selector: "rolatech-letting-manage-item", inputs: ["letting", "thumbnail", "list"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3703
3756
|
}
|
|
3704
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3757
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageIndex, decorators: [{
|
|
3705
3758
|
type: Component,
|
|
3706
3759
|
args: [{ selector: 'rolatech-letting-manage-index', imports: [CommonModule, ToolbarComponent, SpinnerComponent, MatButtonModule, RouterLink, LettingManageItem], encapsulation: ViewEncapsulation.None, template: "<rolatech-toolbar title=\"Lettings\"> </rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of lettings; track $index) {\n <rolatech-letting-manage-item [letting]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-letting-manage-item>\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: ["rolatech-letting-manage-index{--rt-letting-view-items-per-row: 1}@media (min-width: 600px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 2}}@media (min-width: 768px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 5}}\n"] }]
|
|
3707
3760
|
}] });
|
|
3708
3761
|
|
|
3709
3762
|
class LettingActions {
|
|
3710
|
-
letting = input.required();
|
|
3763
|
+
letting = input.required(...(ngDevMode ? [{ debugName: "letting" }] : []));
|
|
3711
3764
|
requestViewing = output();
|
|
3712
3765
|
offer = output();
|
|
3713
3766
|
deposit = output();
|
|
3714
3767
|
displayDeposit = computed(() => {
|
|
3715
3768
|
return (this.letting().deposit / 100).toFixed(2);
|
|
3716
|
-
});
|
|
3769
|
+
}, ...(ngDevMode ? [{ debugName: "displayDeposit" }] : []));
|
|
3717
3770
|
onRequestViewing(letting) {
|
|
3718
3771
|
this.requestViewing.emit(letting);
|
|
3719
3772
|
}
|
|
@@ -3723,26 +3776,26 @@ class LettingActions {
|
|
|
3723
3776
|
onDeposit(letting) {
|
|
3724
3777
|
this.deposit.emit(letting);
|
|
3725
3778
|
}
|
|
3726
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3727
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3779
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3780
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LettingActions, isStandalone: true, selector: "rolatech-letting-actions", inputs: { letting: { classPropertyName: "letting", publicName: "letting", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { requestViewing: "requestViewing", offer: "offer", deposit: "deposit" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(letting())\" i18n>Request viewing</a>\n @if (letting().priceType && letting().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(letting())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(letting())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-letting-action-contact\"></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
3728
3781
|
}
|
|
3729
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3782
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingActions, decorators: [{
|
|
3730
3783
|
type: Component,
|
|
3731
3784
|
args: [{ selector: 'rolatech-letting-actions', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(letting())\" i18n>Request viewing</a>\n @if (letting().priceType && letting().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(letting())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(letting())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-letting-action-contact\"></ng-content>\n</div>\n" }]
|
|
3732
3785
|
}] });
|
|
3733
3786
|
|
|
3734
3787
|
class LettingActionContact {
|
|
3735
|
-
phone = input();
|
|
3788
|
+
phone = input(...(ngDevMode ? [undefined, { debugName: "phone" }] : []));
|
|
3736
3789
|
callAgent = output();
|
|
3737
3790
|
emailAgent = output();
|
|
3738
3791
|
onCallAgent() { }
|
|
3739
3792
|
onEmailAgent(property) {
|
|
3740
3793
|
this.emailAgent.emit(property);
|
|
3741
3794
|
}
|
|
3742
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3743
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
3795
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingActionContact, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3796
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: LettingActionContact, isStandalone: true, selector: "rolatech-letting-action-contact", inputs: { phone: { classPropertyName: "phone", publicName: "phone", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callAgent: "callAgent", emailAgent: "emailAgent" }, ngImport: i0, template: "<a mat-stroked-button class=\"w-full\" [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span i18n>Chat With Agent</span>\n</a>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
3744
3797
|
}
|
|
3745
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3798
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingActionContact, decorators: [{
|
|
3746
3799
|
type: Component,
|
|
3747
3800
|
args: [{ selector: 'rolatech-letting-action-contact', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<a mat-stroked-button class=\"w-full\" [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span i18n>Chat With Agent</span>\n</a>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"] }]
|
|
3748
3801
|
}] });
|
|
@@ -3761,10 +3814,10 @@ class LettingManageDetail extends BaseComponent {
|
|
|
3761
3814
|
selectedOption;
|
|
3762
3815
|
variants = [];
|
|
3763
3816
|
selectedVariant;
|
|
3764
|
-
variantOption = signal(undefined);
|
|
3817
|
+
variantOption = signal(undefined, ...(ngDevMode ? [{ debugName: "variantOption" }] : []));
|
|
3765
3818
|
variantOptionChanged = computed(() => {
|
|
3766
3819
|
return this.variantOption();
|
|
3767
|
-
});
|
|
3820
|
+
}, ...(ngDevMode ? [{ debugName: "variantOptionChanged" }] : []));
|
|
3768
3821
|
// results: any[] = [];
|
|
3769
3822
|
constructor() {
|
|
3770
3823
|
super();
|
|
@@ -3888,10 +3941,10 @@ class LettingManageDetail extends BaseComponent {
|
|
|
3888
3941
|
this.selectedVariant = matchingVariant;
|
|
3889
3942
|
// const updatedCriteria = matchingVariant ? updateCriteriaFromVariant(matchingVariant) : [];
|
|
3890
3943
|
}
|
|
3891
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3892
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
3944
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageDetail, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3945
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LettingManageDetail, isStandalone: true, selector: "rolatech-letting-manage-detail", usesInheritance: true, ngImport: i0, template: "@if (property) {\n<rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videoTours) {\n <rolatech-property-video-tour [videoTour]=\"property.videoTours[0]\"></rolatech-property-video-tour>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n </div>\n </div>\n <div class=\"w-full h-fit md:w-1/3 rounded-md border shadow p-3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n subtitle=\"PrimeCase Agent\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-letting-actions\n [letting]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-letting-action-contact [phone]=\"user.phone\"></rolatech-letting-action-contact>\n }\n </rolatech-letting-actions>\n </div>\n </div>\n </div>\n</rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyInfoComponent, selector: "rolatech-property-info", inputs: ["property", "inWishList"], outputs: ["wish"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }, { kind: "component", type: PropertySectionComponent, selector: "rolatech-property-section", inputs: ["section", "user", "username"] }, { kind: "component", type: LettingActions, selector: "rolatech-letting-actions", inputs: ["letting"], outputs: ["requestViewing", "offer", "deposit"] }, { kind: "component", type: LettingActionContact, selector: "rolatech-letting-action-contact", inputs: ["phone"], outputs: ["callAgent", "emailAgent"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyVideoTourComponent, selector: "rolatech-property-video-tour", inputs: ["videoTour"] }, { kind: "component", type: PropertyAgentRenderer, selector: "rolatech-property-agent-renderer", inputs: ["name", "avatar", "username", "subtitle"] }] });
|
|
3893
3946
|
}
|
|
3894
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
3947
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageDetail, decorators: [{
|
|
3895
3948
|
type: Component,
|
|
3896
3949
|
args: [{ selector: 'rolatech-letting-manage-detail', imports: [
|
|
3897
3950
|
AngularCommonModule,
|
|
@@ -3903,12 +3956,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
3903
3956
|
PropertySectionComponent,
|
|
3904
3957
|
LettingActions,
|
|
3905
3958
|
LettingActionContact,
|
|
3906
|
-
PropertyOwnerRendererComponent,
|
|
3907
3959
|
PropertyLocationComponent,
|
|
3908
3960
|
PropertyFeaturesComponent,
|
|
3909
3961
|
PropertyVideoTourComponent,
|
|
3910
3962
|
PropertyAgentRenderer
|
|
3911
|
-
], template: "@if (property) {\n<rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.
|
|
3963
|
+
], template: "@if (property) {\n<rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videoTours) {\n <rolatech-property-video-tour [videoTour]=\"property.videoTours[0]\"></rolatech-property-video-tour>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n </div>\n </div>\n <div class=\"w-full h-fit md:w-1/3 rounded-md border shadow p-3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n subtitle=\"PrimeCase Agent\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-letting-actions\n [letting]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-letting-action-contact [phone]=\"user.phone\"></rolatech-letting-action-contact>\n }\n </rolatech-letting-actions>\n </div>\n </div>\n </div>\n</rolatech-container>\n}\n" }]
|
|
3912
3964
|
}], ctorParameters: () => [] });
|
|
3913
3965
|
|
|
3914
3966
|
const MY_FORMATS$1 = {
|
|
@@ -3970,8 +4022,8 @@ class LettingManageViewingRequest extends BaseComponent {
|
|
|
3970
4022
|
},
|
|
3971
4023
|
});
|
|
3972
4024
|
}
|
|
3973
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
3974
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
4025
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageViewingRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4026
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LettingManageViewingRequest, isStandalone: true, selector: "rolatech-letting-viewing-request", providers: [
|
|
3975
4027
|
{
|
|
3976
4028
|
provide: DateAdapter,
|
|
3977
4029
|
useClass: MomentDateAdapter,
|
|
@@ -3980,7 +4032,7 @@ class LettingManageViewingRequest extends BaseComponent {
|
|
|
3980
4032
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$1 },
|
|
3981
4033
|
], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"viewing.tenantId\">\n @for (item of tenants; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n @if (property) {\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <rolatech-property-pricing [property]=\"property\"></rolatech-property-pricing>\n </div>\n }\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "component", type: PropertyViewingTimeComponent, selector: "rolatech-property-viewing-time", inputs: ["proposedTime"], outputs: ["output", "select"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }] });
|
|
3982
4034
|
}
|
|
3983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
4035
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageViewingRequest, decorators: [{
|
|
3984
4036
|
type: Component,
|
|
3985
4037
|
args: [{ selector: 'rolatech-letting-viewing-request', imports: [
|
|
3986
4038
|
CommonModule,
|
|
@@ -4079,8 +4131,8 @@ class LettingManageOfferRequest extends BaseComponent {
|
|
|
4079
4131
|
},
|
|
4080
4132
|
});
|
|
4081
4133
|
}
|
|
4082
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
4083
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
4134
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageOfferRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4135
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LettingManageOfferRequest, isStandalone: true, selector: "rolatech-letting-manage-offer-request", providers: [
|
|
4084
4136
|
{
|
|
4085
4137
|
provide: DateAdapter,
|
|
4086
4138
|
useClass: MomentDateAdapter,
|
|
@@ -4089,7 +4141,7 @@ class LettingManageOfferRequest extends BaseComponent {
|
|
|
4089
4141
|
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
|
|
4090
4142
|
], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n @if (property) {\n <span i18n=\"@@offerFor\">Offer for {{ property.title }}</span>\n\n }\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"offer.tenantId\">\n @for (item of tenants; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3 </span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n } {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n @if (property) {\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <rolatech-property-pricing [property]=\"property\"></rolatech-property-pricing>\n </div>\n }\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }] });
|
|
4091
4143
|
}
|
|
4092
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
4144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LettingManageOfferRequest, decorators: [{
|
|
4093
4145
|
type: Component,
|
|
4094
4146
|
args: [{ selector: 'rolatech-letting-manage-offer-request', imports: [
|
|
4095
4147
|
CommonModule,
|
|
@@ -4133,21 +4185,12 @@ const lettingManageRoutes = [
|
|
|
4133
4185
|
},
|
|
4134
4186
|
];
|
|
4135
4187
|
|
|
4136
|
-
class TenantManageItem {
|
|
4137
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4138
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: TenantManageItem, isStandalone: true, selector: "rolatech-tenant-manage-item", ngImport: i0, template: "<p>tenant-manage-item works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
4139
|
-
}
|
|
4140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageItem, decorators: [{
|
|
4141
|
-
type: Component,
|
|
4142
|
-
args: [{ selector: 'rolatech-tenant-manage-item', imports: [CommonModule], template: "<p>tenant-manage-item works!</p>\n" }]
|
|
4143
|
-
}] });
|
|
4144
|
-
|
|
4145
4188
|
class TenantItem {
|
|
4146
|
-
tenant = input.required();
|
|
4147
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
4148
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
4189
|
+
tenant = input.required(...(ngDevMode ? [{ debugName: "tenant" }] : []));
|
|
4190
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4191
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: TenantItem, isStandalone: true, selector: "rolatech-tenant-item", inputs: { tenant: { classPropertyName: "tenant", publicName: "tenant", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex items-center justify-between px-2 h-11 cursor-pointer hover:bg-[--rt-raised-background]\">\n <div>{{tenant().firstName}}, {{tenant().lastName}}</div>\n <div class=\"flex flex-row items-center\">\n <div>{{tenant().email}}</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
4149
4192
|
}
|
|
4150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
4193
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantItem, decorators: [{
|
|
4151
4194
|
type: Component,
|
|
4152
4195
|
args: [{ selector: 'rolatech-tenant-item', imports: [CommonModule], template: "<div class=\"flex items-center justify-between px-2 h-11 cursor-pointer hover:bg-[--rt-raised-background]\">\n <div>{{tenant().firstName}}, {{tenant().lastName}}</div>\n <div class=\"flex flex-row items-center\">\n <div>{{tenant().email}}</div>\n </div>\n</div>\n" }]
|
|
4153
4196
|
}] });
|
|
@@ -4171,12 +4214,12 @@ class TenantManageIndex {
|
|
|
4171
4214
|
}
|
|
4172
4215
|
});
|
|
4173
4216
|
}
|
|
4174
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
4175
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
4217
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4218
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TenantManageIndex, isStandalone: true, selector: "rolatech-tenant-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"Tenants\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add tenant</span>\n </button>\n </div>\n</rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-col p-2\">\n <div class=\"flex px-2 h-11 items-center justify-between\">\n <div class=\"text-lg font-bold\">Name</div>\n <div class=\"text-lg font-bold\">Email</div>\n </div>\n @for (item of tenants; track $index) {\n <rolatech-tenant-item [tenant]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-tenant-item>\n <hr />\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TenantItem, selector: "rolatech-tenant-item", inputs: ["tenant"] }] });
|
|
4176
4219
|
}
|
|
4177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
4220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantManageIndex, decorators: [{
|
|
4178
4221
|
type: Component,
|
|
4179
|
-
args: [{ selector: 'rolatech-tenant-manage-index', imports: [CommonModule, ToolbarComponent, SpinnerComponent, MatButtonModule, MatIcon, RouterLink,
|
|
4222
|
+
args: [{ selector: 'rolatech-tenant-manage-index', imports: [CommonModule, ToolbarComponent, SpinnerComponent, MatButtonModule, MatIcon, RouterLink, TenantItem], template: "<rolatech-toolbar title=\"Tenants\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add tenant</span>\n </button>\n </div>\n</rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-col p-2\">\n <div class=\"flex px-2 h-11 items-center justify-between\">\n <div class=\"text-lg font-bold\">Name</div>\n <div class=\"text-lg font-bold\">Email</div>\n </div>\n @for (item of tenants; track $index) {\n <rolatech-tenant-item [tenant]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-tenant-item>\n <hr />\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n" }]
|
|
4180
4223
|
}] });
|
|
4181
4224
|
|
|
4182
4225
|
class TenantManageDetail extends BaseComponent {
|
|
@@ -4196,10 +4239,10 @@ class TenantManageDetail extends BaseComponent {
|
|
|
4196
4239
|
}
|
|
4197
4240
|
});
|
|
4198
4241
|
}
|
|
4199
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
4200
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
4242
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantManageDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4243
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TenantManageDetail, isStandalone: true, selector: "rolatech-tenant-manage-detail", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Tenant details\" large link=\"../\"> </rolatech-toolbar>\n@if (tenant) {\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Tenant</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"First Name\" [title]=\"tenant.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"tenant.lastName\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Email\" [title]=\"tenant.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"tenant.phone\"></rolatech-rich-label>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <rolatech-rich-label label=\"Annual income\" [title]=\"tenant.income\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"tenant.numberOfTenants\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenant category\" [title]=\"tenantCategory[tenant.tenantCategory]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[tenant.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label\n label=\"AdverseCredit Status\"\n [title]=\"adverseCreditStatus[tenant.adverseCreditStatus]\"\n ></rolatech-rich-label>\n <rolatech-rich-label label=\"Residency status\" [title]=\"residencyStatus[tenant.residencyStatus]\"></rolatech-rich-label>\n </div>\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }] });
|
|
4201
4244
|
}
|
|
4202
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
4245
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantManageDetail, decorators: [{
|
|
4203
4246
|
type: Component,
|
|
4204
4247
|
args: [{ selector: 'rolatech-tenant-manage-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ToolbarComponent], template: "<rolatech-toolbar title=\"Tenant details\" large link=\"../\"> </rolatech-toolbar>\n@if (tenant) {\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Tenant</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"First Name\" [title]=\"tenant.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"tenant.lastName\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Email\" [title]=\"tenant.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"tenant.phone\"></rolatech-rich-label>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <rolatech-rich-label label=\"Annual income\" [title]=\"tenant.income\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"tenant.numberOfTenants\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenant category\" [title]=\"tenantCategory[tenant.tenantCategory]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[tenant.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label\n label=\"AdverseCredit Status\"\n [title]=\"adverseCreditStatus[tenant.adverseCreditStatus]\"\n ></rolatech-rich-label>\n <rolatech-rich-label label=\"Residency status\" [title]=\"residencyStatus[tenant.residencyStatus]\"></rolatech-rich-label>\n </div>\n </div>\n</div>\n}\n" }]
|
|
4205
4248
|
}] });
|
|
@@ -4229,10 +4272,10 @@ class TenantManageCreate {
|
|
|
4229
4272
|
},
|
|
4230
4273
|
});
|
|
4231
4274
|
}
|
|
4232
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
4233
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
4275
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantManageCreate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4276
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TenantManageCreate, isStandalone: true, selector: "rolatech-tenant-manage-create", ngImport: i0, template: "<rolatech-toolbar title=\"Add tenant\" link=\"../\"> </rolatech-toolbar>\n<div class=\"p-3\">\n <div class=\"flex flex-col md:w-2/3\">\n <div class=\"flex w-full gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.lastName\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.email\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.phone\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3 </span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"tenant.income\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant category</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"tenant.tenantCategory\" required>\n @for (tenantCategory of tenantCategory | keyvalue; track tenantCategory) {\n <mat-option [value]=\"tenantCategory.key\"> {{ tenantCategory.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"tenant.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\"> {{ item.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"tenant.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\"> {{ item.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"tenant.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\"> {{ status.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div i18n>* items are required</div>\n <div class=\"mt-3\">\n <button mat-flat-button class=\"w-28\" (click)=\"create()\" i18n>Save</button>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
|
|
4234
4277
|
}
|
|
4235
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
4278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TenantManageCreate, decorators: [{
|
|
4236
4279
|
type: Component,
|
|
4237
4280
|
args: [{ selector: 'rolatech-tenant-manage-create', imports: [
|
|
4238
4281
|
CommonModule,
|
|
@@ -4267,4 +4310,4 @@ const tenantManageRoutes = [
|
|
|
4267
4310
|
*/
|
|
4268
4311
|
|
|
4269
4312
|
export { AdverseCreditStatus as A, EmploymentStatus as E, PropertyViewingItemComponent as P, ResidencyStatus as R, ViewingTime as V, propertyManageOffersRoutes as a, propertyRoutes as b, propertyManageRoutes as c, propertyManageViewingsRoutes as d, PropertyActionsComponent as e, featureManageRoutes as f, PropertyItemComponent as g, PropertyPricingComponent as h, PropertyPriceType as i, PropertyVideoTourType as j, PropertyStatus as k, lettingManageRoutes as l, PropertyType as m, PropertyInventoryStatus as n, PropertyScope as o, propertyReviewRoutes as p, PropertyViewingStatus as q, PropertyViewerCategory as r, PropertyOfferTimelineStatus as s, tenantManageRoutes as t, PropertyOfferType as u, PropertyOfferStatus as v, PropertyApplicantType as w };
|
|
4270
|
-
//# sourceMappingURL=rolatech-angular-property-rolatech-angular-property-
|
|
4313
|
+
//# sourceMappingURL=rolatech-angular-property-rolatech-angular-property-CH6CKvP2.mjs.map
|