@rolatech/angular-property 20.0.0-beta.6 → 20.0.0-beta.8
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-manage-viewings-index.component-Clazb8j0.mjs → rolatech-angular-property-property-manage-viewings-index.component-Ae_OA7vE.mjs} +2 -2
- package/fesm2022/{rolatech-angular-property-property-manage-viewings-index.component-Clazb8j0.mjs.map → rolatech-angular-property-property-manage-viewings-index.component-Ae_OA7vE.mjs.map} +1 -1
- package/fesm2022/{rolatech-angular-property-rolatech-angular-property-CO7GI4x7.mjs → rolatech-angular-property-rolatech-angular-property-BcHHSS2T.mjs} +899 -96
- package/fesm2022/rolatech-angular-property-rolatech-angular-property-BcHHSS2T.mjs.map +1 -0
- package/fesm2022/rolatech-angular-property.mjs +1 -1
- package/index.d.ts +40 -15
- package/package.json +5 -5
- package/themes/_default.scss +1 -1
- package/fesm2022/rolatech-angular-property-rolatech-angular-property-CO7GI4x7.mjs.map +0 -1
|
@@ -1,57 +1,57 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { inject, ElementRef, input, booleanAttribute, effect, HostBinding, ViewEncapsulation, Component, viewChild, PLATFORM_ID, output, computed, model, signal, Pipe, ViewChild } from '@angular/core';
|
|
3
|
-
import * as i1$
|
|
3
|
+
import * as i1$4 from '@angular/material/button';
|
|
4
4
|
import { MatButtonModule } from '@angular/material/button';
|
|
5
|
-
import * as i4
|
|
5
|
+
import * as i4 from '@angular/material/menu';
|
|
6
6
|
import { MatMenuModule } from '@angular/material/menu';
|
|
7
7
|
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
|
8
8
|
import { MatSnackBar } from '@angular/material/snack-bar';
|
|
9
9
|
import { MatTableModule } from '@angular/material/table';
|
|
10
|
-
import * as i1$
|
|
10
|
+
import * as i1$1 from '@angular/router';
|
|
11
11
|
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 } from '@rolatech/angular-components';
|
|
13
|
-
import { PropertyService, FeatureService } from '@rolatech/angular-services';
|
|
12
|
+
import { ThumbnailComponent, ImagePlaceholderComponent, ToolbarComponent, SpinnerComponent, ImagePreviewDialogComponent, BaseComponent, AcceptDialogComponent, RejectDialogComponent, RichLabelComponent, AngularComponentsModule, ConfirmationDialogComponent, TabsComponent, TabComponent, EmptyComponent, ContainerComponent, ListComponent, MediaListComponent, MediaListItemComponent, InputComponent } from '@rolatech/angular-components';
|
|
13
|
+
import { PropertyService, FeatureService, DialogService } from '@rolatech/angular-services';
|
|
14
14
|
import * as i1 from '@angular/common';
|
|
15
15
|
import { CommonModule, NgClass, isPlatformBrowser, ViewportScroller, KeyValuePipe, Location } from '@angular/common';
|
|
16
|
-
import { FixedPipe, AngularCommonModule, OptionsFormatPipe, APP_CONFIG, DecimalDirective } from '@rolatech/angular-common';
|
|
16
|
+
import { FixedPipe, AngularCommonModule, OptionsFormatPipe, APP_CONFIG, DecimalDirective, DurationPipe } from '@rolatech/angular-common';
|
|
17
17
|
import * as i2 from '@angular/material/icon';
|
|
18
|
-
import { MatIconModule } from '@angular/material/icon';
|
|
18
|
+
import { MatIconModule, MatIcon } from '@angular/material/icon';
|
|
19
19
|
import { MatDialog } from '@angular/material/dialog';
|
|
20
20
|
import { AuthUserService, AuthService, AuthGuard } from '@rolatech/angular-auth';
|
|
21
21
|
import { GoogleMapsModule } from '@angular/google-maps';
|
|
22
22
|
import * as i1$3 from '@angular/forms';
|
|
23
|
-
import {
|
|
24
|
-
import * as
|
|
23
|
+
import { FormsModule, FormControl, ReactiveFormsModule } from '@angular/forms';
|
|
24
|
+
import * as i1$2 from '@angular/material/form-field';
|
|
25
25
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
26
|
-
import * as
|
|
26
|
+
import * as i3 from '@angular/material/input';
|
|
27
|
+
import { MatInputModule } from '@angular/material/input';
|
|
28
|
+
import * as i5 from '@angular/material/select';
|
|
29
|
+
import { MatSelectModule } from '@angular/material/select';
|
|
30
|
+
import * as i1$5 from '@angular/material/chips';
|
|
27
31
|
import { MatChipsModule } from '@angular/material/chips';
|
|
28
32
|
import { startWith, map, defer, forkJoin } from 'rxjs';
|
|
29
33
|
import { ENTER, COMMA } from '@angular/cdk/keycodes';
|
|
30
|
-
import * as i4$
|
|
34
|
+
import * as i4$2 from '@angular/material/autocomplete';
|
|
31
35
|
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
|
32
36
|
import { MatOptionModule, MAT_DATE_LOCALE, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
|
|
33
37
|
import _, { findIndex, findLastIndex, first, remove } from 'lodash';
|
|
34
38
|
import * as i2$1 from '@angular/material/divider';
|
|
35
39
|
import { MatDividerModule, MatDivider } from '@angular/material/divider';
|
|
36
|
-
import * as
|
|
37
|
-
import { MatInputModule } from '@angular/material/input';
|
|
38
|
-
import * as i5 from '@angular/material/select';
|
|
39
|
-
import { MatSelectModule } from '@angular/material/select';
|
|
40
|
-
import * as i8 from '@angular/material/datepicker';
|
|
40
|
+
import * as i7 from '@angular/material/datepicker';
|
|
41
41
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
42
42
|
import { trigger, state, transition, style, animate } from '@angular/animations';
|
|
43
43
|
import { CommentsComponent } from '@rolatech/angular-comment';
|
|
44
44
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
45
|
-
import * as i4$
|
|
45
|
+
import * as i4$1 from '@angular/cdk/text-field';
|
|
46
46
|
import { TextFieldModule } from '@angular/cdk/text-field';
|
|
47
|
-
import * as
|
|
47
|
+
import * as i8 from '@angular/material/radio';
|
|
48
48
|
import { MatRadioModule } from '@angular/material/radio';
|
|
49
49
|
import { MomentDateAdapter } from '@angular/material-moment-adapter';
|
|
50
|
-
import * as i3 from '@angular/material/progress-spinner';
|
|
50
|
+
import * as i3$1 from '@angular/material/progress-spinner';
|
|
51
51
|
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
52
52
|
import * as i8$1 from '@angular/material/progress-bar';
|
|
53
53
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
54
|
-
import * as i1$
|
|
54
|
+
import * as i1$6 from '@angular/material/checkbox';
|
|
55
55
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
56
56
|
|
|
57
57
|
var PropertyPriceType;
|
|
@@ -65,6 +65,7 @@ var PropertyVideoTourType;
|
|
|
65
65
|
PropertyVideoTourType["YOUTUBE"] = "Youtube";
|
|
66
66
|
PropertyVideoTourType["S3"] = "AWS S3";
|
|
67
67
|
PropertyVideoTourType["LOCAL"] = "Local server";
|
|
68
|
+
PropertyVideoTourType["COS"] = "COS";
|
|
68
69
|
})(PropertyVideoTourType || (PropertyVideoTourType = {}));
|
|
69
70
|
var PropertyStatus;
|
|
70
71
|
(function (PropertyStatus) {
|
|
@@ -298,11 +299,11 @@ class PropertyManageItemComponent {
|
|
|
298
299
|
archived() { }
|
|
299
300
|
delete() { }
|
|
300
301
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
301
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
|
302
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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]] });
|
|
302
303
|
}
|
|
303
304
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageItemComponent, decorators: [{
|
|
304
305
|
type: Component,
|
|
305
|
-
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
|
|
306
|
+
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"] }]
|
|
306
307
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
307
308
|
type: HostBinding,
|
|
308
309
|
args: ['class.rolatech-property-manage-item']
|
|
@@ -442,10 +443,59 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
442
443
|
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"] }]
|
|
443
444
|
}] });
|
|
444
445
|
|
|
446
|
+
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.3", ngImport: i0, type: PropertyOwnerRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
452
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
454
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOwnerRendererComponent, decorators: [{
|
|
455
|
+
type: Component,
|
|
456
|
+
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
|
+
}] });
|
|
458
|
+
|
|
459
|
+
class PropertyAgentUpdate {
|
|
460
|
+
authUserService = inject(AuthUserService);
|
|
461
|
+
loading = true;
|
|
462
|
+
output = output();
|
|
463
|
+
agents;
|
|
464
|
+
selectedAgentId;
|
|
465
|
+
ngOnInit() {
|
|
466
|
+
this.findAgents();
|
|
467
|
+
}
|
|
468
|
+
findAgents() {
|
|
469
|
+
this.authUserService.findAll({}).subscribe({
|
|
470
|
+
next: res => {
|
|
471
|
+
this.agents = res.data;
|
|
472
|
+
this.loading = false;
|
|
473
|
+
}
|
|
474
|
+
});
|
|
475
|
+
}
|
|
476
|
+
ngDoCheck() {
|
|
477
|
+
this.output.emit(this.selectedAgentId);
|
|
478
|
+
}
|
|
479
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyAgentUpdate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
480
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
482
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyAgentUpdate, decorators: [{
|
|
483
|
+
type: Component,
|
|
484
|
+
args: [{ selector: 'rolatech-property-agent-update', imports: [
|
|
485
|
+
CommonModule,
|
|
486
|
+
MatFormFieldModule,
|
|
487
|
+
FormsModule,
|
|
488
|
+
MatInputModule,
|
|
489
|
+
MatSelectModule,
|
|
490
|
+
], 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"] }]
|
|
491
|
+
}] });
|
|
492
|
+
|
|
445
493
|
class PropertyReviewDetailComponent extends BaseComponent {
|
|
446
494
|
propertyService = inject(PropertyService);
|
|
447
495
|
authUserService = inject(AuthUserService);
|
|
496
|
+
userFullName = '';
|
|
448
497
|
property;
|
|
498
|
+
user;
|
|
449
499
|
agent;
|
|
450
500
|
status = PropertyStatus;
|
|
451
501
|
ngOnInit() {
|
|
@@ -455,7 +505,20 @@ class PropertyReviewDetailComponent extends BaseComponent {
|
|
|
455
505
|
this.propertyService.get(this.id).subscribe({
|
|
456
506
|
next: (res) => {
|
|
457
507
|
this.property = res.data;
|
|
458
|
-
|
|
508
|
+
if (this.property.userId) {
|
|
509
|
+
this.getUserPublicInfo(this.property.userId);
|
|
510
|
+
}
|
|
511
|
+
if (this.property.agentId) {
|
|
512
|
+
this.getAgentPublicInfo(this.property.agentId);
|
|
513
|
+
}
|
|
514
|
+
},
|
|
515
|
+
});
|
|
516
|
+
}
|
|
517
|
+
getUserPublicInfo(userId) {
|
|
518
|
+
this.authUserService.getPublicUserInfo(userId).subscribe({
|
|
519
|
+
next: (res) => {
|
|
520
|
+
this.user = res;
|
|
521
|
+
this.userFullName = res.name;
|
|
459
522
|
},
|
|
460
523
|
});
|
|
461
524
|
}
|
|
@@ -463,7 +526,6 @@ class PropertyReviewDetailComponent extends BaseComponent {
|
|
|
463
526
|
this.authUserService.getPublicUserInfo(agentId).subscribe({
|
|
464
527
|
next: (res) => {
|
|
465
528
|
this.agent = res;
|
|
466
|
-
console.log(this.agent);
|
|
467
529
|
},
|
|
468
530
|
});
|
|
469
531
|
}
|
|
@@ -509,22 +571,47 @@ class PropertyReviewDetailComponent extends BaseComponent {
|
|
|
509
571
|
}
|
|
510
572
|
});
|
|
511
573
|
}
|
|
574
|
+
updateAgent() {
|
|
575
|
+
const options = {
|
|
576
|
+
title: 'Update agent',
|
|
577
|
+
cancelText: 'Cancel',
|
|
578
|
+
confirmText: 'Confirm',
|
|
579
|
+
component: PropertyAgentUpdate,
|
|
580
|
+
data: {
|
|
581
|
+
agents: {},
|
|
582
|
+
},
|
|
583
|
+
width: '599px',
|
|
584
|
+
};
|
|
585
|
+
this.dialogService.open(options);
|
|
586
|
+
this.dialogService.confirmed().subscribe({
|
|
587
|
+
next: (res) => {
|
|
588
|
+
if (res) {
|
|
589
|
+
this.propertyService.updateAgent(this.id, { userId: res }).subscribe({
|
|
590
|
+
next: (res) => {
|
|
591
|
+
console.log(res);
|
|
592
|
+
this.getAgentPublicInfo(res.data.agentId);
|
|
593
|
+
}
|
|
594
|
+
});
|
|
595
|
+
}
|
|
596
|
+
},
|
|
597
|
+
});
|
|
598
|
+
}
|
|
512
599
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyReviewDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
513
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
|
600
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 </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: "pipe", type: FixedPipe, name: "fixed" }, { 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"] }] });
|
|
514
601
|
}
|
|
515
602
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyReviewDetailComponent, decorators: [{
|
|
516
603
|
type: Component,
|
|
517
604
|
args: [{ selector: 'rolatech-property-review-detail', imports: [
|
|
518
605
|
CommonModule,
|
|
519
606
|
ToolbarComponent,
|
|
520
|
-
ThumbnailComponent,
|
|
521
607
|
RichLabelComponent,
|
|
522
608
|
FixedPipe,
|
|
523
609
|
PropertyMediaComponent,
|
|
524
610
|
PropertyFeaturesComponent,
|
|
525
611
|
PropertyLocationComponent,
|
|
526
612
|
MatButtonModule,
|
|
527
|
-
|
|
613
|
+
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" }]
|
|
528
615
|
}] });
|
|
529
616
|
|
|
530
617
|
const propertyReviewRoutes = [
|
|
@@ -554,7 +641,7 @@ class FeatureManageItemComponent {
|
|
|
554
641
|
this.edit.emit(this.feature());
|
|
555
642
|
}
|
|
556
643
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FeatureManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
557
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.3", 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$
|
|
644
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.3", 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" }] });
|
|
558
645
|
}
|
|
559
646
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FeatureManageItemComponent, decorators: [{
|
|
560
647
|
type: Component,
|
|
@@ -605,7 +692,7 @@ class FeatureManageItemAddComponent {
|
|
|
605
692
|
this.output.emit(this.feature);
|
|
606
693
|
}
|
|
607
694
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FeatureManageItemAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
608
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
695
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 }] });
|
|
609
696
|
}
|
|
610
697
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FeatureManageItemAddComponent, decorators: [{
|
|
611
698
|
type: Component,
|
|
@@ -735,7 +822,7 @@ class FeatureManageIndexComponent extends BaseComponent {
|
|
|
735
822
|
this.featureControl.setValue(null);
|
|
736
823
|
}
|
|
737
824
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FeatureManageIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
738
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
825
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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"] }] });
|
|
739
826
|
}
|
|
740
827
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FeatureManageIndexComponent, decorators: [{
|
|
741
828
|
type: Component,
|
|
@@ -858,7 +945,7 @@ class PropertyManageOfferIndexComponent extends BaseComponent {
|
|
|
858
945
|
.join(',');
|
|
859
946
|
}
|
|
860
947
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
861
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
948
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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" }] });
|
|
862
949
|
}
|
|
863
950
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageOfferIndexComponent, decorators: [{
|
|
864
951
|
type: Component,
|
|
@@ -906,7 +993,6 @@ class PropertyManageOfferDetailComponent extends BaseComponent {
|
|
|
906
993
|
this.authUserService.getPublicUserInfo(agentId).subscribe({
|
|
907
994
|
next: (res) => {
|
|
908
995
|
this.agent = res;
|
|
909
|
-
console.log(this.agent);
|
|
910
996
|
},
|
|
911
997
|
});
|
|
912
998
|
}
|
|
@@ -954,11 +1040,11 @@ class PropertyManageOfferDetailComponent extends BaseComponent {
|
|
|
954
1040
|
});
|
|
955
1041
|
}
|
|
956
1042
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
957
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
|
1043
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 </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: "pipe", type: FixedPipe, name: "fixed" }, { 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"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
958
1044
|
}
|
|
959
1045
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageOfferDetailComponent, decorators: [{
|
|
960
1046
|
type: Component,
|
|
961
|
-
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
|
|
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" }]
|
|
962
1048
|
}] });
|
|
963
1049
|
|
|
964
1050
|
const propertyManageOffersRoutes = [
|
|
@@ -985,7 +1071,7 @@ class PropertyFilterComponent {
|
|
|
985
1071
|
reset() { }
|
|
986
1072
|
search() { }
|
|
987
1073
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
988
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$
|
|
1074
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { 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"] }], animations: [
|
|
989
1075
|
trigger('filter', [
|
|
990
1076
|
state('collapsed', style({ height: '0px', minHeight: '0' })),
|
|
991
1077
|
state('expanded', style({ height: '*' })),
|
|
@@ -1044,7 +1130,7 @@ class PropertyLayoutComponent extends BaseComponent {
|
|
|
1044
1130
|
}
|
|
1045
1131
|
nextCategory() { }
|
|
1046
1132
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1047
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", 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$
|
|
1133
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", 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"] }] });
|
|
1048
1134
|
}
|
|
1049
1135
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyLayoutComponent, decorators: [{
|
|
1050
1136
|
type: Component,
|
|
@@ -1069,7 +1155,7 @@ class PropertyActionsComponent {
|
|
|
1069
1155
|
this.deposit.emit(property);
|
|
1070
1156
|
}
|
|
1071
1157
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1072
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
1158
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 });
|
|
1073
1159
|
}
|
|
1074
1160
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyActionsComponent, decorators: [{
|
|
1075
1161
|
type: Component,
|
|
@@ -1091,9 +1177,6 @@ class PropertyPricingComponent {
|
|
|
1091
1177
|
this.calculateDeposit();
|
|
1092
1178
|
}
|
|
1093
1179
|
property = input.required();
|
|
1094
|
-
// price = computed(() => {
|
|
1095
|
-
// return (this.property().price / 100).toFixed(2);
|
|
1096
|
-
// });
|
|
1097
1180
|
price = input();
|
|
1098
1181
|
holdingDeposit;
|
|
1099
1182
|
securityDeposit;
|
|
@@ -1123,7 +1206,7 @@ class PropertyInfoComponent {
|
|
|
1123
1206
|
onShare() { }
|
|
1124
1207
|
onMore() { }
|
|
1125
1208
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1126
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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>\n {{ property().description }}\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$
|
|
1209
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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>\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 });
|
|
1127
1210
|
}
|
|
1128
1211
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyInfoComponent, decorators: [{
|
|
1129
1212
|
type: Component,
|
|
@@ -1148,18 +1231,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1148
1231
|
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" }]
|
|
1149
1232
|
}] });
|
|
1150
1233
|
|
|
1151
|
-
class PropertyOwnerRendererComponent {
|
|
1152
|
-
name = input();
|
|
1153
|
-
avatar = input();
|
|
1154
|
-
username = input();
|
|
1155
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOwnerRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1156
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 } }, ngImport: i0, template: "<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-11 h-11 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-11 h-11 rounded-full bg-[--rt-brand-color]\"></div>\n }\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>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$4.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"] }] });
|
|
1157
|
-
}
|
|
1158
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOwnerRendererComponent, decorators: [{
|
|
1159
|
-
type: Component,
|
|
1160
|
-
args: [{ selector: 'rolatech-property-owner-renderer', imports: [AngularCommonModule, MatIconModule], template: "<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-11 h-11 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-11 h-11 rounded-full bg-[--rt-brand-color]\"></div>\n }\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>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"] }]
|
|
1161
|
-
}] });
|
|
1162
|
-
|
|
1163
1234
|
class PropertyVideoTourComponent {
|
|
1164
1235
|
sanitizer = inject(DomSanitizer);
|
|
1165
1236
|
videoTour = input.required();
|
|
@@ -1185,13 +1256,26 @@ class PropertyActionContactComponent {
|
|
|
1185
1256
|
this.emailAgent.emit(property);
|
|
1186
1257
|
}
|
|
1187
1258
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyActionContactComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1188
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.3", 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$
|
|
1259
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.3", 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 });
|
|
1189
1260
|
}
|
|
1190
1261
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyActionContactComponent, decorators: [{
|
|
1191
1262
|
type: Component,
|
|
1192
1263
|
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"] }]
|
|
1193
1264
|
}] });
|
|
1194
1265
|
|
|
1266
|
+
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.3", ngImport: i0, type: PropertyAgentRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1272
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
1274
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyAgentRenderer, decorators: [{
|
|
1275
|
+
type: Component,
|
|
1276
|
+
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
|
+
}] });
|
|
1278
|
+
|
|
1195
1279
|
class PropertyDetailsComponent extends BaseComponent {
|
|
1196
1280
|
authService = inject(AuthService);
|
|
1197
1281
|
authUserService = inject(AuthUserService);
|
|
@@ -1334,7 +1418,7 @@ class PropertyDetailsComponent extends BaseComponent {
|
|
|
1334
1418
|
// const updatedCriteria = matchingVariant ? updateCriteriaFromVariant(matchingVariant) : [];
|
|
1335
1419
|
}
|
|
1336
1420
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1337
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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-
|
|
1421
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videoTour) {\n <rolatech-property-video-tour [videoTour]=\"property.videoTour\"></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 <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"] }] });
|
|
1338
1422
|
}
|
|
1339
1423
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyDetailsComponent, decorators: [{
|
|
1340
1424
|
type: Component,
|
|
@@ -1348,15 +1432,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1348
1432
|
PropertySectionComponent,
|
|
1349
1433
|
PropertyActionsComponent,
|
|
1350
1434
|
CommentsComponent,
|
|
1351
|
-
|
|
1435
|
+
PropertyAgentRenderer,
|
|
1352
1436
|
PropertyLocationComponent,
|
|
1353
1437
|
PropertyFeaturesComponent,
|
|
1354
1438
|
PropertyVideoTourComponent,
|
|
1355
1439
|
PropertyActionContactComponent,
|
|
1356
|
-
], 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-
|
|
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]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videoTour) {\n <rolatech-property-video-tour [videoTour]=\"property.videoTour\"></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 <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" }]
|
|
1357
1441
|
}], ctorParameters: () => [] });
|
|
1358
1442
|
|
|
1359
|
-
const MY_FORMATS$
|
|
1443
|
+
const MY_FORMATS$5 = {
|
|
1360
1444
|
parse: {
|
|
1361
1445
|
dateInput: 'YYYY-MM-DD',
|
|
1362
1446
|
},
|
|
@@ -1391,8 +1475,8 @@ class PropertyViewingTimeComponent {
|
|
|
1391
1475
|
useClass: MomentDateAdapter,
|
|
1392
1476
|
deps: [MAT_DATE_LOCALE],
|
|
1393
1477
|
},
|
|
1394
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$
|
|
1395
|
-
], 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:
|
|
1478
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$5 },
|
|
1479
|
+
], 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 }] });
|
|
1396
1480
|
}
|
|
1397
1481
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyViewingTimeComponent, decorators: [{
|
|
1398
1482
|
type: Component,
|
|
@@ -1411,11 +1495,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1411
1495
|
useClass: MomentDateAdapter,
|
|
1412
1496
|
deps: [MAT_DATE_LOCALE],
|
|
1413
1497
|
},
|
|
1414
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$
|
|
1498
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$5 },
|
|
1415
1499
|
], 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"] }]
|
|
1416
1500
|
}] });
|
|
1417
1501
|
|
|
1418
|
-
const MY_FORMATS$
|
|
1502
|
+
const MY_FORMATS$4 = {
|
|
1419
1503
|
parse: {
|
|
1420
1504
|
dateInput: 'YYYY-MM-DD',
|
|
1421
1505
|
},
|
|
@@ -1491,8 +1575,8 @@ class PropertyViewingRequestComponent extends BaseComponent {
|
|
|
1491
1575
|
useClass: MomentDateAdapter,
|
|
1492
1576
|
deps: [MAT_DATE_LOCALE],
|
|
1493
1577
|
},
|
|
1494
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$
|
|
1495
|
-
], 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: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$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: i4.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$1.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: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i8.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i8.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i8.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i9.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i9.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"] }] });
|
|
1578
|
+
{ 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"] }] });
|
|
1496
1580
|
}
|
|
1497
1581
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyViewingRequestComponent, decorators: [{
|
|
1498
1582
|
type: Component,
|
|
@@ -1515,11 +1599,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1515
1599
|
useClass: MomentDateAdapter,
|
|
1516
1600
|
deps: [MAT_DATE_LOCALE],
|
|
1517
1601
|
},
|
|
1518
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$
|
|
1602
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$4 },
|
|
1519
1603
|
], 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"] }]
|
|
1520
1604
|
}] });
|
|
1521
1605
|
|
|
1522
|
-
const MY_FORMATS$
|
|
1606
|
+
const MY_FORMATS$3 = {
|
|
1523
1607
|
parse: {
|
|
1524
1608
|
dateInput: 'YYYY-MM-DD',
|
|
1525
1609
|
},
|
|
@@ -1624,8 +1708,8 @@ class PropertyOfferComponent extends BaseComponent {
|
|
|
1624
1708
|
useClass: MomentDateAdapter,
|
|
1625
1709
|
deps: [MAT_DATE_LOCALE],
|
|
1626
1710
|
},
|
|
1627
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$
|
|
1628
|
-
], 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: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$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: i4.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$3.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i8.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i8.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i8.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"] }] });
|
|
1711
|
+
{ 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"] }] });
|
|
1629
1713
|
}
|
|
1630
1714
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOfferComponent, decorators: [{
|
|
1631
1715
|
type: Component,
|
|
@@ -1648,7 +1732,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1648
1732
|
useClass: MomentDateAdapter,
|
|
1649
1733
|
deps: [MAT_DATE_LOCALE],
|
|
1650
1734
|
},
|
|
1651
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$
|
|
1735
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$3 },
|
|
1652
1736
|
], 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"] }]
|
|
1653
1737
|
}], ctorParameters: () => [] });
|
|
1654
1738
|
|
|
@@ -1736,7 +1820,7 @@ class PropertyOfferIndexComponent extends BaseComponent {
|
|
|
1736
1820
|
.join(',');
|
|
1737
1821
|
}
|
|
1738
1822
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1739
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
1823
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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: [
|
|
1740
1824
|
trigger('filter', [
|
|
1741
1825
|
state('collapsed', style({ height: '0px', minHeight: '0' })),
|
|
1742
1826
|
state('expanded', style({ height: '*' })),
|
|
@@ -1860,7 +1944,7 @@ class PropertyViewingIndexComponent extends BaseComponent {
|
|
|
1860
1944
|
.join(',');
|
|
1861
1945
|
}
|
|
1862
1946
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyViewingIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1863
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
1947
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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"] }] });
|
|
1864
1948
|
}
|
|
1865
1949
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyViewingIndexComponent, decorators: [{
|
|
1866
1950
|
type: Component,
|
|
@@ -2030,7 +2114,7 @@ class PropertyOfferDetailComponent extends BaseComponent {
|
|
|
2030
2114
|
});
|
|
2031
2115
|
}
|
|
2032
2116
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2033
|
-
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$1.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$1.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.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]] });
|
|
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]] });
|
|
2034
2118
|
}
|
|
2035
2119
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyOfferDetailComponent, decorators: [{
|
|
2036
2120
|
type: Component,
|
|
@@ -2101,7 +2185,7 @@ class PropertyViewingDetailComponent extends BaseComponent {
|
|
|
2101
2185
|
});
|
|
2102
2186
|
}
|
|
2103
2187
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyViewingDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2104
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
|
2188
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 </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: "pipe", type: FixedPipe, name: "fixed" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
2105
2189
|
}
|
|
2106
2190
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyViewingDetailComponent, decorators: [{
|
|
2107
2191
|
type: Component,
|
|
@@ -2115,7 +2199,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2115
2199
|
ToolbarComponent,
|
|
2116
2200
|
FixedPipe,
|
|
2117
2201
|
RouterLink,
|
|
2118
|
-
], 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
|
|
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" }]
|
|
2119
2203
|
}] });
|
|
2120
2204
|
|
|
2121
2205
|
class PropertyWishlistComponent extends BaseComponent {
|
|
@@ -2132,7 +2216,7 @@ class PropertyWishlistComponent extends BaseComponent {
|
|
|
2132
2216
|
});
|
|
2133
2217
|
}
|
|
2134
2218
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyWishlistComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2135
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
2219
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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"] }] });
|
|
2136
2220
|
}
|
|
2137
2221
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyWishlistComponent, decorators: [{
|
|
2138
2222
|
type: Component,
|
|
@@ -2219,7 +2303,7 @@ class PropertyManageFilterComponent {
|
|
|
2219
2303
|
reset() { }
|
|
2220
2304
|
search() { }
|
|
2221
2305
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2222
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
2306
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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"] }] });
|
|
2223
2307
|
}
|
|
2224
2308
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageFilterComponent, decorators: [{
|
|
2225
2309
|
type: Component,
|
|
@@ -2246,7 +2330,7 @@ class PropertyManageIndexComponent {
|
|
|
2246
2330
|
});
|
|
2247
2331
|
}
|
|
2248
2332
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2249
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 </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 = 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: "component", type: i1$
|
|
2333
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 </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 = 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: "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: 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 });
|
|
2250
2334
|
}
|
|
2251
2335
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageIndexComponent, decorators: [{
|
|
2252
2336
|
type: Component,
|
|
@@ -2289,7 +2373,7 @@ class PropertyManageCreateComponent {
|
|
|
2289
2373
|
});
|
|
2290
2374
|
}
|
|
2291
2375
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2292
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", 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:
|
|
2376
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", 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"] }] });
|
|
2293
2377
|
}
|
|
2294
2378
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageCreateComponent, decorators: [{
|
|
2295
2379
|
type: Component,
|
|
@@ -2351,7 +2435,7 @@ class PropertyManageLayoutComponent extends BaseComponent {
|
|
|
2351
2435
|
});
|
|
2352
2436
|
}
|
|
2353
2437
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2354
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
2438
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 });
|
|
2355
2439
|
}
|
|
2356
2440
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageLayoutComponent, decorators: [{
|
|
2357
2441
|
type: Component,
|
|
@@ -2367,7 +2451,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2367
2451
|
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" }]
|
|
2368
2452
|
}] });
|
|
2369
2453
|
|
|
2370
|
-
const MY_FORMATS = {
|
|
2454
|
+
const MY_FORMATS$2 = {
|
|
2371
2455
|
parse: {
|
|
2372
2456
|
dateInput: 'YYYY-MM-DD',
|
|
2373
2457
|
},
|
|
@@ -2455,8 +2539,8 @@ class PropertyManageInfoComponent extends BaseComponent {
|
|
|
2455
2539
|
useClass: MomentDateAdapter,
|
|
2456
2540
|
deps: [MAT_DATE_LOCALE],
|
|
2457
2541
|
},
|
|
2458
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
|
|
2459
|
-
], 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:
|
|
2542
|
+
{ 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: "pipe", type: KeyValuePipe, name: "keyvalue" }, { 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"] }] });
|
|
2460
2544
|
}
|
|
2461
2545
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageInfoComponent, decorators: [{
|
|
2462
2546
|
type: Component,
|
|
@@ -2480,7 +2564,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2480
2564
|
useClass: MomentDateAdapter,
|
|
2481
2565
|
deps: [MAT_DATE_LOCALE],
|
|
2482
2566
|
},
|
|
2483
|
-
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
|
|
2567
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$2 },
|
|
2484
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"] }]
|
|
2485
2569
|
}] });
|
|
2486
2570
|
|
|
@@ -2693,7 +2777,7 @@ class PropertyManageSectionItemComponent {
|
|
|
2693
2777
|
this.selectedImg = this.section().media ? first(this.section().media) : null;
|
|
2694
2778
|
}
|
|
2695
2779
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageSectionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2696
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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:
|
|
2780
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$1.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: [
|
|
2697
2781
|
trigger('detailExpand', [
|
|
2698
2782
|
state('collapsed', style({ height: '0px' })),
|
|
2699
2783
|
state('expanded', style({ height: '*' })),
|
|
@@ -2873,7 +2957,7 @@ class PropertyManageSectionsComponent {
|
|
|
2873
2957
|
});
|
|
2874
2958
|
}
|
|
2875
2959
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2876
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
2960
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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"] }] });
|
|
2877
2961
|
}
|
|
2878
2962
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageSectionsComponent, decorators: [{
|
|
2879
2963
|
type: Component,
|
|
@@ -2987,7 +3071,7 @@ class PropertyManageFeaturesComponent extends BaseComponent {
|
|
|
2987
3071
|
return binding;
|
|
2988
3072
|
}
|
|
2989
3073
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageFeaturesComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2990
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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$
|
|
3074
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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"] }] });
|
|
2991
3075
|
}
|
|
2992
3076
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageFeaturesComponent, decorators: [{
|
|
2993
3077
|
type: Component,
|
|
@@ -3143,7 +3227,7 @@ class PropertyManageLocationComponent extends BaseComponent {
|
|
|
3143
3227
|
});
|
|
3144
3228
|
}
|
|
3145
3229
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageLocationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3146
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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().buildingName\" 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:
|
|
3230
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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().buildingName\" 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: [
|
|
3147
3231
|
trigger('contentAnimation', [
|
|
3148
3232
|
state('hidden', style({
|
|
3149
3233
|
height: '0',
|
|
@@ -3203,13 +3287,118 @@ class PropertyVideoTourAddComponent {
|
|
|
3203
3287
|
this.output.emit(this.videoId);
|
|
3204
3288
|
}
|
|
3205
3289
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyVideoTourAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3206
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", 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:
|
|
3290
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", 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"] }] });
|
|
3207
3291
|
}
|
|
3208
3292
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyVideoTourAddComponent, decorators: [{
|
|
3209
3293
|
type: Component,
|
|
3210
3294
|
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"] }]
|
|
3211
3295
|
}] });
|
|
3212
3296
|
|
|
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
|
+
|
|
3213
3402
|
class PropertyManageVideoTourComponent extends BaseComponent {
|
|
3214
3403
|
propertyService = inject(PropertyService);
|
|
3215
3404
|
sanitizer = inject(DomSanitizer);
|
|
@@ -3219,6 +3408,7 @@ class PropertyManageVideoTourComponent extends BaseComponent {
|
|
|
3219
3408
|
iframeLoaded = false;
|
|
3220
3409
|
safeURL = this.sanitizer.bypassSecurityTrustResourceUrl('');
|
|
3221
3410
|
thumbnailUrl;
|
|
3411
|
+
type = PropertyVideoTourType;
|
|
3222
3412
|
ngOnInit() {
|
|
3223
3413
|
this.id = this.route.parent?.snapshot.paramMap.get('id');
|
|
3224
3414
|
this.getVideoTour();
|
|
@@ -3227,8 +3417,10 @@ class PropertyManageVideoTourComponent extends BaseComponent {
|
|
|
3227
3417
|
this.propertyService.getVideoTour(this.id).subscribe({
|
|
3228
3418
|
next: (res) => {
|
|
3229
3419
|
this.propertyVideoTour = res.data;
|
|
3230
|
-
this.safeURL = this.sanitizer.bypassSecurityTrustResourceUrl(
|
|
3231
|
-
|
|
3420
|
+
// this.safeURL = this.sanitizer.bypassSecurityTrustResourceUrl(
|
|
3421
|
+
// `https://www.youtube.com/embed/${this.propertyVideoTour.videoId}`,
|
|
3422
|
+
// );
|
|
3423
|
+
// this.thumbnailUrl = `https://i.ytimg.com/vi/${this.propertyVideoTour.videoId}/hqdefault.jpg`;
|
|
3232
3424
|
},
|
|
3233
3425
|
});
|
|
3234
3426
|
}
|
|
@@ -3293,11 +3485,11 @@ class PropertyManageVideoTourComponent extends BaseComponent {
|
|
|
3293
3485
|
});
|
|
3294
3486
|
}
|
|
3295
3487
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageVideoTourComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3296
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
|
3488
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 @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"] }] });
|
|
3297
3489
|
}
|
|
3298
3490
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageVideoTourComponent, decorators: [{
|
|
3299
3491
|
type: Component,
|
|
3300
|
-
args: [{ selector: 'rolatech-property-manage-video-tour', imports: [ToolbarComponent, PropertyManageContentComponent, MatButtonModule], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Video tour\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n
|
|
3492
|
+
args: [{ selector: 'rolatech-property-manage-video-tour', imports: [ToolbarComponent, PropertyManageContentComponent, MatButtonModule, PropertyVideoTourItem], 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 @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" }]
|
|
3301
3493
|
}] });
|
|
3302
3494
|
|
|
3303
3495
|
const propertyManageRoutes = [
|
|
@@ -3441,7 +3633,7 @@ class PropertyManageViewingsDetailComponent extends BaseComponent {
|
|
|
3441
3633
|
});
|
|
3442
3634
|
}
|
|
3443
3635
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageViewingsDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3444
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 (on viewport()) {\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>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: "pipe", type: FixedPipe, name: "fixed" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$
|
|
3636
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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 (on viewport()) {\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>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: "pipe", type: FixedPipe, name: "fixed" }, { 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"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
|
|
3445
3637
|
}
|
|
3446
3638
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PropertyManageViewingsDetailComponent, decorators: [{
|
|
3447
3639
|
type: Component,
|
|
@@ -3451,7 +3643,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
3451
3643
|
const propertyManageViewingsRoutes = [
|
|
3452
3644
|
{
|
|
3453
3645
|
path: '',
|
|
3454
|
-
loadComponent: () => import('./rolatech-angular-property-property-manage-viewings-index.component-
|
|
3646
|
+
loadComponent: () => import('./rolatech-angular-property-property-manage-viewings-index.component-Ae_OA7vE.mjs').then((x) => x.PropertyManageViewingsIndexComponent),
|
|
3455
3647
|
},
|
|
3456
3648
|
{
|
|
3457
3649
|
path: ':id',
|
|
@@ -3459,9 +3651,620 @@ const propertyManageViewingsRoutes = [
|
|
|
3459
3651
|
},
|
|
3460
3652
|
];
|
|
3461
3653
|
|
|
3654
|
+
class LettingManageItem {
|
|
3655
|
+
hasClass = true;
|
|
3656
|
+
el = inject(ElementRef);
|
|
3657
|
+
letting = input.required();
|
|
3658
|
+
thumbnail = input();
|
|
3659
|
+
status = PropertyStatus;
|
|
3660
|
+
list = input(false, { transform: booleanAttribute });
|
|
3661
|
+
constructor() {
|
|
3662
|
+
effect(() => {
|
|
3663
|
+
if (this.list()) {
|
|
3664
|
+
this.el.nativeElement.setAttribute('list', '');
|
|
3665
|
+
}
|
|
3666
|
+
else {
|
|
3667
|
+
this.el.nativeElement.removeAttribute('list', '');
|
|
3668
|
+
}
|
|
3669
|
+
});
|
|
3670
|
+
}
|
|
3671
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3672
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
3674
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageItem, decorators: [{
|
|
3675
|
+
type: Component,
|
|
3676
|
+
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
|
+
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
3678
|
+
type: HostBinding,
|
|
3679
|
+
args: ['class.rolatech-letting-manage-item']
|
|
3680
|
+
}] } });
|
|
3681
|
+
|
|
3682
|
+
class LettingManageIndex {
|
|
3683
|
+
propertyService = inject(PropertyService);
|
|
3684
|
+
loading = false;
|
|
3685
|
+
lettings;
|
|
3686
|
+
ngOnInit() {
|
|
3687
|
+
this.find();
|
|
3688
|
+
}
|
|
3689
|
+
find() {
|
|
3690
|
+
this.loading = true;
|
|
3691
|
+
this.propertyService.find({}).subscribe({
|
|
3692
|
+
next: (res) => {
|
|
3693
|
+
this.lettings = res.data;
|
|
3694
|
+
this.loading = false;
|
|
3695
|
+
},
|
|
3696
|
+
error: error => {
|
|
3697
|
+
this.loading = false;
|
|
3698
|
+
}
|
|
3699
|
+
});
|
|
3700
|
+
}
|
|
3701
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3702
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
3704
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageIndex, decorators: [{
|
|
3705
|
+
type: Component,
|
|
3706
|
+
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
|
+
}] });
|
|
3708
|
+
|
|
3709
|
+
class LettingActions {
|
|
3710
|
+
letting = input.required();
|
|
3711
|
+
requestViewing = output();
|
|
3712
|
+
offer = output();
|
|
3713
|
+
deposit = output();
|
|
3714
|
+
displayDeposit = computed(() => {
|
|
3715
|
+
return (this.letting().deposit / 100).toFixed(2);
|
|
3716
|
+
});
|
|
3717
|
+
onRequestViewing(letting) {
|
|
3718
|
+
this.requestViewing.emit(letting);
|
|
3719
|
+
}
|
|
3720
|
+
onOffer(letting) {
|
|
3721
|
+
this.offer.emit(letting);
|
|
3722
|
+
}
|
|
3723
|
+
onDeposit(letting) {
|
|
3724
|
+
this.deposit.emit(letting);
|
|
3725
|
+
}
|
|
3726
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3727
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
3729
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingActions, decorators: [{
|
|
3730
|
+
type: Component,
|
|
3731
|
+
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
|
+
}] });
|
|
3733
|
+
|
|
3734
|
+
class LettingActionContact {
|
|
3735
|
+
phone = input();
|
|
3736
|
+
callAgent = output();
|
|
3737
|
+
emailAgent = output();
|
|
3738
|
+
onCallAgent() { }
|
|
3739
|
+
onEmailAgent(property) {
|
|
3740
|
+
this.emailAgent.emit(property);
|
|
3741
|
+
}
|
|
3742
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingActionContact, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3743
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.3", 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
|
+
}
|
|
3745
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingActionContact, decorators: [{
|
|
3746
|
+
type: Component,
|
|
3747
|
+
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
|
+
}] });
|
|
3749
|
+
|
|
3750
|
+
class LettingManageDetail extends BaseComponent {
|
|
3751
|
+
authService = inject(AuthService);
|
|
3752
|
+
authUserService = inject(AuthUserService);
|
|
3753
|
+
propertyService = inject(PropertyService);
|
|
3754
|
+
authenticated = this.authService.authenticated;
|
|
3755
|
+
property;
|
|
3756
|
+
fullname = '';
|
|
3757
|
+
username = '';
|
|
3758
|
+
user;
|
|
3759
|
+
inWishList = false;
|
|
3760
|
+
purchased = false;
|
|
3761
|
+
selectedOption;
|
|
3762
|
+
variants = [];
|
|
3763
|
+
selectedVariant;
|
|
3764
|
+
variantOption = signal(undefined);
|
|
3765
|
+
variantOptionChanged = computed(() => {
|
|
3766
|
+
return this.variantOption();
|
|
3767
|
+
});
|
|
3768
|
+
// results: any[] = [];
|
|
3769
|
+
constructor() {
|
|
3770
|
+
super();
|
|
3771
|
+
effect(() => {
|
|
3772
|
+
if (this.authenticated()) {
|
|
3773
|
+
this.wishListCheck();
|
|
3774
|
+
}
|
|
3775
|
+
});
|
|
3776
|
+
}
|
|
3777
|
+
ngOnInit() {
|
|
3778
|
+
this.getProperty();
|
|
3779
|
+
}
|
|
3780
|
+
getProperty() {
|
|
3781
|
+
this.propertyService.get(this.id).subscribe({
|
|
3782
|
+
next: (res) => {
|
|
3783
|
+
this.property = res.data;
|
|
3784
|
+
if (this.property.variants) {
|
|
3785
|
+
this.variants = this.property.variants;
|
|
3786
|
+
this.selectedVariant = this.variants[0];
|
|
3787
|
+
// this.selectedVariant.options.forEach((item) => {
|
|
3788
|
+
// this.results.push([item.option.id, item.value.id]);
|
|
3789
|
+
// });
|
|
3790
|
+
}
|
|
3791
|
+
this.findUserBaseInfo(this.property.agentId);
|
|
3792
|
+
this.titleService.setTitle(`${this.property.title}`);
|
|
3793
|
+
},
|
|
3794
|
+
});
|
|
3795
|
+
}
|
|
3796
|
+
findVariant(optionId, valueId) {
|
|
3797
|
+
return this.variants.find((item) => {
|
|
3798
|
+
const exist = item.options.some((i) => i.option.id === optionId && i.value.id === valueId);
|
|
3799
|
+
if (exist) {
|
|
3800
|
+
return item;
|
|
3801
|
+
}
|
|
3802
|
+
return null;
|
|
3803
|
+
});
|
|
3804
|
+
}
|
|
3805
|
+
findUserBaseInfo(userId) {
|
|
3806
|
+
this.authUserService.getPublicUserInfo(userId).subscribe({
|
|
3807
|
+
next: (res) => {
|
|
3808
|
+
this.fullname = res.name;
|
|
3809
|
+
this.username = res.username;
|
|
3810
|
+
this.user = res;
|
|
3811
|
+
},
|
|
3812
|
+
});
|
|
3813
|
+
}
|
|
3814
|
+
wishListCheck() {
|
|
3815
|
+
this.propertyService.wishListCheck(this.id).subscribe({
|
|
3816
|
+
next: (res) => {
|
|
3817
|
+
this.inWishList = res.data;
|
|
3818
|
+
},
|
|
3819
|
+
});
|
|
3820
|
+
}
|
|
3821
|
+
onWish(e) {
|
|
3822
|
+
if (this.authenticated()) {
|
|
3823
|
+
if (this.inWishList) {
|
|
3824
|
+
this.removeFromWishlist();
|
|
3825
|
+
}
|
|
3826
|
+
else {
|
|
3827
|
+
this.addToWishlist();
|
|
3828
|
+
}
|
|
3829
|
+
}
|
|
3830
|
+
else {
|
|
3831
|
+
this.snackBarService.open('Please sign in');
|
|
3832
|
+
}
|
|
3833
|
+
}
|
|
3834
|
+
onRequestViewing(e) {
|
|
3835
|
+
this.router.navigate([`/lettings/${this.id}/viewing/application`]);
|
|
3836
|
+
}
|
|
3837
|
+
removeFromWishlist() {
|
|
3838
|
+
this.propertyService.removeFromWishlist(this.id).subscribe({
|
|
3839
|
+
next: (res) => {
|
|
3840
|
+
this.inWishList = false;
|
|
3841
|
+
this.snackBarService.open('Removed');
|
|
3842
|
+
},
|
|
3843
|
+
});
|
|
3844
|
+
}
|
|
3845
|
+
addToWishlist() {
|
|
3846
|
+
this.propertyService.addToWishlist(this.id).subscribe({
|
|
3847
|
+
next: (res) => {
|
|
3848
|
+
this.inWishList = true;
|
|
3849
|
+
this.snackBarService.open('Added');
|
|
3850
|
+
},
|
|
3851
|
+
});
|
|
3852
|
+
}
|
|
3853
|
+
onOffer(e) {
|
|
3854
|
+
if (this.authenticated()) {
|
|
3855
|
+
this.router.navigate([`/lettings/${this.id}/offer`]);
|
|
3856
|
+
}
|
|
3857
|
+
else {
|
|
3858
|
+
this.snackBarService.open('Please sign in');
|
|
3859
|
+
}
|
|
3860
|
+
}
|
|
3861
|
+
onOptionChange(e) {
|
|
3862
|
+
const criteria = [];
|
|
3863
|
+
this.selectedVariant.options.map((item) => {
|
|
3864
|
+
criteria.push({
|
|
3865
|
+
optionId: item.option.id === e.option.id ? e.option.id : item.option.id,
|
|
3866
|
+
valueId: item.option.id === e.option.id ? e.value.id : item.value.id,
|
|
3867
|
+
});
|
|
3868
|
+
});
|
|
3869
|
+
// const criteria = [
|
|
3870
|
+
// { optionId: '249008855294545920', valueId: '249008855298740224' }, // color: red
|
|
3871
|
+
// { optionId: '248661715955355648', valueId: '249001130061860865' }, // size: 256GB
|
|
3872
|
+
// ];
|
|
3873
|
+
// Function to check if a variant matches all the criteria
|
|
3874
|
+
const matchesAllCriteria = (variant, criteria) => {
|
|
3875
|
+
return _.every(criteria, (criterion) => {
|
|
3876
|
+
return _.some(variant.options, (o) => o.option.id === criterion.optionId && o.value.id === criterion.valueId);
|
|
3877
|
+
});
|
|
3878
|
+
};
|
|
3879
|
+
// Function to update the criteria based on a matching variant
|
|
3880
|
+
const updateCriteriaFromVariant = (variant) => {
|
|
3881
|
+
return _.map(variant.options, (o) => ({
|
|
3882
|
+
optionId: o.option.id,
|
|
3883
|
+
valueId: o.value.id,
|
|
3884
|
+
}));
|
|
3885
|
+
};
|
|
3886
|
+
// Find the variant that matches all the criteria
|
|
3887
|
+
const matchingVariant = _.find(this.variants, (variant) => matchesAllCriteria(variant, criteria));
|
|
3888
|
+
this.selectedVariant = matchingVariant;
|
|
3889
|
+
// const updatedCriteria = matchingVariant ? updateCriteriaFromVariant(matchingVariant) : [];
|
|
3890
|
+
}
|
|
3891
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageDetail, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3892
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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.videoTour) {\n <rolatech-property-video-tour [videoTour]=\"property.videoTour\"></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
|
+
}
|
|
3894
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageDetail, decorators: [{
|
|
3895
|
+
type: Component,
|
|
3896
|
+
args: [{ selector: 'rolatech-letting-manage-detail', imports: [
|
|
3897
|
+
AngularCommonModule,
|
|
3898
|
+
AngularComponentsModule,
|
|
3899
|
+
ContainerComponent,
|
|
3900
|
+
PropertyInfoComponent,
|
|
3901
|
+
PropertyMediaComponent,
|
|
3902
|
+
PropertyPricingComponent,
|
|
3903
|
+
PropertySectionComponent,
|
|
3904
|
+
LettingActions,
|
|
3905
|
+
LettingActionContact,
|
|
3906
|
+
PropertyOwnerRendererComponent,
|
|
3907
|
+
PropertyLocationComponent,
|
|
3908
|
+
PropertyFeaturesComponent,
|
|
3909
|
+
PropertyVideoTourComponent,
|
|
3910
|
+
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.videoTour) {\n <rolatech-property-video-tour [videoTour]=\"property.videoTour\"></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
|
+
}], ctorParameters: () => [] });
|
|
3913
|
+
|
|
3914
|
+
const MY_FORMATS$1 = {
|
|
3915
|
+
parse: {
|
|
3916
|
+
dateInput: 'YYYY-MM-DD',
|
|
3917
|
+
},
|
|
3918
|
+
display: {
|
|
3919
|
+
dateInput: 'YYYY-MM-DD',
|
|
3920
|
+
monthYearLabel: 'MMM YYYY',
|
|
3921
|
+
dateA11yLabel: 'YYYY-MM-DD',
|
|
3922
|
+
monthYearA11yLabel: 'MMMM YYYY',
|
|
3923
|
+
},
|
|
3924
|
+
};
|
|
3925
|
+
class LettingManageViewingRequest extends BaseComponent {
|
|
3926
|
+
authService = inject(AuthService);
|
|
3927
|
+
authUserService = inject(AuthUserService);
|
|
3928
|
+
propertyService = inject(PropertyService);
|
|
3929
|
+
property;
|
|
3930
|
+
minDate = new Date();
|
|
3931
|
+
viewing = {
|
|
3932
|
+
proposedSlots: [
|
|
3933
|
+
{ date: '', time: '' },
|
|
3934
|
+
{ date: '', time: '' },
|
|
3935
|
+
{ date: '', time: '' },
|
|
3936
|
+
],
|
|
3937
|
+
};
|
|
3938
|
+
tenants;
|
|
3939
|
+
countries = ['United Kingdom', 'China'];
|
|
3940
|
+
selectedCountry;
|
|
3941
|
+
ngOnInit() {
|
|
3942
|
+
this.getProperty();
|
|
3943
|
+
this.findTenants();
|
|
3944
|
+
}
|
|
3945
|
+
getProperty() {
|
|
3946
|
+
this.propertyService.get(this.id).subscribe({
|
|
3947
|
+
next: (res) => {
|
|
3948
|
+
this.property = res.data;
|
|
3949
|
+
this.titleService.setTitle(`${this.property.title}`);
|
|
3950
|
+
},
|
|
3951
|
+
});
|
|
3952
|
+
}
|
|
3953
|
+
findTenants() {
|
|
3954
|
+
this.propertyService.findTenants({}).subscribe({
|
|
3955
|
+
next: (res) => {
|
|
3956
|
+
this.tenants = res.data;
|
|
3957
|
+
}
|
|
3958
|
+
});
|
|
3959
|
+
}
|
|
3960
|
+
onCountrySelect(event) {
|
|
3961
|
+
this.viewing['country'] = event.value;
|
|
3962
|
+
}
|
|
3963
|
+
sendRequest() {
|
|
3964
|
+
this.propertyService.requestViewing(this.id, this.viewing).subscribe({
|
|
3965
|
+
next: (res) => {
|
|
3966
|
+
this.snackBarService.open('Request viewing successfully');
|
|
3967
|
+
},
|
|
3968
|
+
error: (error) => {
|
|
3969
|
+
this.snackBarService.open(error.message);
|
|
3970
|
+
},
|
|
3971
|
+
});
|
|
3972
|
+
}
|
|
3973
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageViewingRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3974
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: LettingManageViewingRequest, isStandalone: true, selector: "rolatech-letting-viewing-request", providers: [
|
|
3975
|
+
{
|
|
3976
|
+
provide: DateAdapter,
|
|
3977
|
+
useClass: MomentDateAdapter,
|
|
3978
|
+
deps: [MAT_DATE_LOCALE],
|
|
3979
|
+
},
|
|
3980
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$1 },
|
|
3981
|
+
], 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
|
+
}
|
|
3983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageViewingRequest, decorators: [{
|
|
3984
|
+
type: Component,
|
|
3985
|
+
args: [{ selector: 'rolatech-letting-viewing-request', imports: [
|
|
3986
|
+
CommonModule,
|
|
3987
|
+
ContainerComponent,
|
|
3988
|
+
MatFormFieldModule,
|
|
3989
|
+
FormsModule,
|
|
3990
|
+
MatInputModule,
|
|
3991
|
+
TextFieldModule,
|
|
3992
|
+
MatButtonModule,
|
|
3993
|
+
ThumbnailComponent,
|
|
3994
|
+
MatSelectModule,
|
|
3995
|
+
MatDatepickerModule,
|
|
3996
|
+
MatRadioModule,
|
|
3997
|
+
PropertyViewingTimeComponent,
|
|
3998
|
+
PropertyPricingComponent
|
|
3999
|
+
], providers: [
|
|
4000
|
+
{
|
|
4001
|
+
provide: DateAdapter,
|
|
4002
|
+
useClass: MomentDateAdapter,
|
|
4003
|
+
deps: [MAT_DATE_LOCALE],
|
|
4004
|
+
},
|
|
4005
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$1 },
|
|
4006
|
+
], 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"] }]
|
|
4007
|
+
}] });
|
|
4008
|
+
|
|
4009
|
+
const MY_FORMATS = {
|
|
4010
|
+
parse: {
|
|
4011
|
+
dateInput: 'YYYY-MM-DD',
|
|
4012
|
+
},
|
|
4013
|
+
display: {
|
|
4014
|
+
dateInput: 'YYYY-MM-DD',
|
|
4015
|
+
monthYearLabel: 'MMM YYYY',
|
|
4016
|
+
dateA11yLabel: 'YYYY-MM-DD',
|
|
4017
|
+
monthYearA11yLabel: 'MMMM YYYY',
|
|
4018
|
+
},
|
|
4019
|
+
};
|
|
4020
|
+
class LettingManageOfferRequest extends BaseComponent {
|
|
4021
|
+
authService = inject(AuthService);
|
|
4022
|
+
authUserService = inject(AuthUserService);
|
|
4023
|
+
propertyService = inject(PropertyService);
|
|
4024
|
+
offer = {
|
|
4025
|
+
startDate: '',
|
|
4026
|
+
notes: '',
|
|
4027
|
+
amount: 0,
|
|
4028
|
+
};
|
|
4029
|
+
get formattedAmount() {
|
|
4030
|
+
return this.offer.amount.toFixed(2); // equivalent to | number:'1.2-2'
|
|
4031
|
+
}
|
|
4032
|
+
;
|
|
4033
|
+
property;
|
|
4034
|
+
minDate = new Date();
|
|
4035
|
+
sending = false;
|
|
4036
|
+
tenants;
|
|
4037
|
+
ngOnInit() {
|
|
4038
|
+
this.getProperty();
|
|
4039
|
+
this.findTenants();
|
|
4040
|
+
}
|
|
4041
|
+
onAmountChange(event) {
|
|
4042
|
+
const inputValue = event.target.value;
|
|
4043
|
+
console.log(inputValue);
|
|
4044
|
+
const regex = /^\d*\.?\d{0,2}$/;
|
|
4045
|
+
if (regex.test(inputValue)) {
|
|
4046
|
+
this.offer.amount = inputValue;
|
|
4047
|
+
}
|
|
4048
|
+
}
|
|
4049
|
+
getProperty() {
|
|
4050
|
+
this.propertyService.get(this.id).subscribe({
|
|
4051
|
+
next: (res) => {
|
|
4052
|
+
this.property = res.data;
|
|
4053
|
+
this.titleService.setTitle(`${this.property.title}`);
|
|
4054
|
+
},
|
|
4055
|
+
});
|
|
4056
|
+
}
|
|
4057
|
+
findTenants() {
|
|
4058
|
+
this.propertyService.findTenants({}).subscribe({
|
|
4059
|
+
next: (res) => {
|
|
4060
|
+
this.tenants = res.data;
|
|
4061
|
+
}
|
|
4062
|
+
});
|
|
4063
|
+
}
|
|
4064
|
+
onCategorySelect(event) {
|
|
4065
|
+
this.offer['category'] = event.value;
|
|
4066
|
+
}
|
|
4067
|
+
onResidencyStatusSelect(event) { }
|
|
4068
|
+
sendRequest() {
|
|
4069
|
+
this.sending = true;
|
|
4070
|
+
this.propertyService.makeOffer(this.id, this.offer).subscribe({
|
|
4071
|
+
next: (res) => {
|
|
4072
|
+
this.sending = false;
|
|
4073
|
+
this.snackBarService.open('Sent successfully');
|
|
4074
|
+
this.router.navigate([`/properties/offers/${res.data.id}`]);
|
|
4075
|
+
},
|
|
4076
|
+
error: (error) => {
|
|
4077
|
+
this.sending = false;
|
|
4078
|
+
this.snackBarService.open(error.message);
|
|
4079
|
+
},
|
|
4080
|
+
});
|
|
4081
|
+
}
|
|
4082
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageOfferRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4083
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: LettingManageOfferRequest, isStandalone: true, selector: "rolatech-letting-manage-offer-request", providers: [
|
|
4084
|
+
{
|
|
4085
|
+
provide: DateAdapter,
|
|
4086
|
+
useClass: MomentDateAdapter,
|
|
4087
|
+
deps: [MAT_DATE_LOCALE],
|
|
4088
|
+
},
|
|
4089
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
|
|
4090
|
+
], 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
|
+
}
|
|
4092
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: LettingManageOfferRequest, decorators: [{
|
|
4093
|
+
type: Component,
|
|
4094
|
+
args: [{ selector: 'rolatech-letting-manage-offer-request', imports: [
|
|
4095
|
+
CommonModule,
|
|
4096
|
+
ContainerComponent,
|
|
4097
|
+
MatFormFieldModule,
|
|
4098
|
+
FormsModule,
|
|
4099
|
+
MatInputModule,
|
|
4100
|
+
TextFieldModule,
|
|
4101
|
+
MatButtonModule,
|
|
4102
|
+
ThumbnailComponent,
|
|
4103
|
+
MatSelectModule,
|
|
4104
|
+
MatDatepickerModule,
|
|
4105
|
+
MatProgressSpinner,
|
|
4106
|
+
PropertyPricingComponent
|
|
4107
|
+
], providers: [
|
|
4108
|
+
{
|
|
4109
|
+
provide: DateAdapter,
|
|
4110
|
+
useClass: MomentDateAdapter,
|
|
4111
|
+
deps: [MAT_DATE_LOCALE],
|
|
4112
|
+
},
|
|
4113
|
+
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
|
|
4114
|
+
], 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"] }]
|
|
4115
|
+
}] });
|
|
4116
|
+
|
|
4117
|
+
const lettingManageRoutes = [
|
|
4118
|
+
{
|
|
4119
|
+
path: '',
|
|
4120
|
+
component: LettingManageIndex
|
|
4121
|
+
},
|
|
4122
|
+
{
|
|
4123
|
+
path: ':id',
|
|
4124
|
+
component: LettingManageDetail
|
|
4125
|
+
},
|
|
4126
|
+
{
|
|
4127
|
+
path: ':id/viewing/application',
|
|
4128
|
+
component: LettingManageViewingRequest,
|
|
4129
|
+
},
|
|
4130
|
+
{
|
|
4131
|
+
path: ':id/offer',
|
|
4132
|
+
component: LettingManageOfferRequest,
|
|
4133
|
+
},
|
|
4134
|
+
];
|
|
4135
|
+
|
|
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
|
+
class TenantItem {
|
|
4146
|
+
tenant = input.required();
|
|
4147
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4148
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.3", 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
|
+
}
|
|
4150
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantItem, decorators: [{
|
|
4151
|
+
type: Component,
|
|
4152
|
+
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
|
+
}] });
|
|
4154
|
+
|
|
4155
|
+
class TenantManageIndex {
|
|
4156
|
+
propertyService = inject(PropertyService);
|
|
4157
|
+
loading = false;
|
|
4158
|
+
tenants;
|
|
4159
|
+
ngOnInit() {
|
|
4160
|
+
this.find();
|
|
4161
|
+
}
|
|
4162
|
+
find() {
|
|
4163
|
+
this.loading = true;
|
|
4164
|
+
this.propertyService.findTenants({}).subscribe({
|
|
4165
|
+
next: (res) => {
|
|
4166
|
+
this.tenants = res.data;
|
|
4167
|
+
this.loading = false;
|
|
4168
|
+
},
|
|
4169
|
+
error: error => {
|
|
4170
|
+
this.loading = false;
|
|
4171
|
+
}
|
|
4172
|
+
});
|
|
4173
|
+
}
|
|
4174
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4175
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
4177
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageIndex, decorators: [{
|
|
4178
|
+
type: Component,
|
|
4179
|
+
args: [{ selector: 'rolatech-tenant-manage-index', imports: [CommonModule, ToolbarComponent, SpinnerComponent, MatButtonModule, MatIcon, RouterLink, TenantManageItem, 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
|
+
}] });
|
|
4181
|
+
|
|
4182
|
+
class TenantManageDetail extends BaseComponent {
|
|
4183
|
+
propertyService = inject(PropertyService);
|
|
4184
|
+
tenant;
|
|
4185
|
+
employmentStatus = EmploymentStatus;
|
|
4186
|
+
tenantCategory = PropertyApplicantType;
|
|
4187
|
+
residencyStatus = ResidencyStatus;
|
|
4188
|
+
adverseCreditStatus = AdverseCreditStatus;
|
|
4189
|
+
ngOnInit() {
|
|
4190
|
+
this.getTenant();
|
|
4191
|
+
}
|
|
4192
|
+
getTenant() {
|
|
4193
|
+
this.propertyService.getTenant(this.id).subscribe({
|
|
4194
|
+
next: (res) => {
|
|
4195
|
+
this.tenant = res.data;
|
|
4196
|
+
}
|
|
4197
|
+
});
|
|
4198
|
+
}
|
|
4199
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4200
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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
|
+
}
|
|
4202
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageDetail, decorators: [{
|
|
4203
|
+
type: Component,
|
|
4204
|
+
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
|
+
}] });
|
|
4206
|
+
|
|
4207
|
+
class TenantManageCreate {
|
|
4208
|
+
propertyService = inject(PropertyService);
|
|
4209
|
+
router = inject(Router);
|
|
4210
|
+
route = inject(ActivatedRoute);
|
|
4211
|
+
snackBar = inject(MatSnackBar);
|
|
4212
|
+
tenant = {};
|
|
4213
|
+
tenantCategory = PropertyApplicantType;
|
|
4214
|
+
residencyStatus = ResidencyStatus;
|
|
4215
|
+
employmentStatus = EmploymentStatus;
|
|
4216
|
+
adverseCreditStatus = AdverseCreditStatus;
|
|
4217
|
+
create() {
|
|
4218
|
+
const data = {
|
|
4219
|
+
...this.tenant,
|
|
4220
|
+
};
|
|
4221
|
+
this.propertyService.createTenant(data).subscribe({
|
|
4222
|
+
next: (res) => {
|
|
4223
|
+
this.router.navigate([`../${res.data.id}`], {
|
|
4224
|
+
relativeTo: this.route,
|
|
4225
|
+
});
|
|
4226
|
+
},
|
|
4227
|
+
error: (e) => {
|
|
4228
|
+
this.snackBar.open(e.message);
|
|
4229
|
+
},
|
|
4230
|
+
});
|
|
4231
|
+
}
|
|
4232
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageCreate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4233
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", 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: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { 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"] }] });
|
|
4234
|
+
}
|
|
4235
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: TenantManageCreate, decorators: [{
|
|
4236
|
+
type: Component,
|
|
4237
|
+
args: [{ selector: 'rolatech-tenant-manage-create', imports: [
|
|
4238
|
+
CommonModule,
|
|
4239
|
+
ToolbarComponent,
|
|
4240
|
+
FormsModule,
|
|
4241
|
+
MatFormFieldModule,
|
|
4242
|
+
MatInputModule,
|
|
4243
|
+
TextFieldModule,
|
|
4244
|
+
MatSelectModule,
|
|
4245
|
+
MatOptionModule,
|
|
4246
|
+
MatButtonModule
|
|
4247
|
+
], 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"] }]
|
|
4248
|
+
}] });
|
|
4249
|
+
|
|
4250
|
+
const tenantManageRoutes = [
|
|
4251
|
+
{
|
|
4252
|
+
path: '',
|
|
4253
|
+
component: TenantManageIndex,
|
|
4254
|
+
},
|
|
4255
|
+
{
|
|
4256
|
+
path: 'create',
|
|
4257
|
+
component: TenantManageCreate,
|
|
4258
|
+
},
|
|
4259
|
+
{
|
|
4260
|
+
path: ':id',
|
|
4261
|
+
component: TenantManageDetail,
|
|
4262
|
+
}
|
|
4263
|
+
];
|
|
4264
|
+
|
|
3462
4265
|
/**
|
|
3463
4266
|
* Generated bundle index. Do not edit.
|
|
3464
4267
|
*/
|
|
3465
4268
|
|
|
3466
|
-
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,
|
|
3467
|
-
//# sourceMappingURL=rolatech-angular-property-rolatech-angular-property-
|
|
4269
|
+
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-BcHHSS2T.mjs.map
|