Skip to content

Commit f79e347

Browse files
committed
app module's tenant comps done
1 parent a883b91 commit f79e347

File tree

7 files changed

+531
-351
lines changed

7 files changed

+531
-351
lines changed
Lines changed: 114 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -1,71 +1,121 @@
1-
<form autocomplete="off" #createTenantForm="ngForm" (ngSubmit)="save()">
2-
<h1 mat-dialog-title>{{ "CreateNewTenant" | localize }}</h1>
3-
<mat-dialog-content>
4-
<div class="row-fluid">
5-
<div class="col-md-12">
6-
<mat-form-field>
7-
<input
8-
matInput
9-
name="TenancyName"
10-
[placeholder]="'TenancyName' | localize"
11-
[(ngModel)]="tenant.tenancyName"
12-
required
13-
minlength="2"
14-
maxlength="64"
15-
/>
16-
</mat-form-field>
17-
<mat-form-field>
18-
<input
19-
matInput
20-
name="Name"
21-
[placeholder]="'Name' | localize"
22-
[(ngModel)]="tenant.name"
23-
required
24-
maxlength="128"
25-
/>
26-
</mat-form-field>
27-
<mat-form-field>
28-
<input
29-
matInput
30-
name="ConnectionString"
31-
[placeholder]="'DatabaseConnectionString' | localize"
32-
[(ngModel)]="tenant.connectionString"
33-
maxlength="1024"
34-
/>
35-
</mat-form-field>
36-
<mat-form-field>
1+
<form
2+
class="form-horizontal"
3+
autocomplete="off"
4+
#createTenantForm="ngForm"
5+
(ngSubmit)="save()"
6+
>
7+
<abp-modal-header
8+
[title]="'CreateNewTenant' | localize"
9+
(onCloseClick)="bsModalRef.hide()"
10+
></abp-modal-header>
11+
<div class="modal-body">
12+
<div class="form-group row required">
13+
<label class="col-md-3 col-form-label" for="tenancyName">
14+
{{ "TenancyName" | localize }}
15+
</label>
16+
<div class="col-md-9">
17+
<input
18+
type="text"
19+
class="form-control"
20+
name="tenancyName"
21+
id="tenancyName"
22+
minlength="2"
23+
maxlength="64"
24+
required
25+
[(ngModel)]="tenant.tenancyName"
26+
#tenancyNameModel="ngModel"
27+
#tenancyNameEl
28+
/>
29+
<abp-validation-summary
30+
[control]="tenancyNameModel"
31+
[controlEl]="tenancyNameEl"
32+
></abp-validation-summary>
33+
</div>
34+
</div>
35+
<div class="form-group row required">
36+
<label class="col-md-3 col-form-label" for="name">
37+
{{ "Name" | localize }}
38+
</label>
39+
<div class="col-md-9">
40+
<input
41+
type="text"
42+
class="form-control"
43+
name="name"
44+
id="name"
45+
maxlength="128"
46+
required
47+
[(ngModel)]="tenant.name"
48+
#nameModel="ngModel"
49+
#nameEl
50+
/>
51+
<abp-validation-summary
52+
[control]="nameModel"
53+
[controlEl]="nameEl"
54+
></abp-validation-summary>
55+
</div>
56+
</div>
57+
<div class="form-group row">
58+
<label class="col-md-3 col-form-label" for="connectionString">
59+
{{ "DatabaseConnectionString" | localize }}
60+
</label>
61+
<div class="col-md-9">
62+
<input
63+
type="text"
64+
class="form-control"
65+
name="connectionString"
66+
id="connectionString"
67+
maxlength="1024"
68+
[(ngModel)]="tenant.connectionString"
69+
/>
70+
</div>
71+
</div>
72+
<div class="form-group row required">
73+
<label class="col-md-3 col-form-label" for="adminEmailAddress">
74+
{{ "AdminEmailAddress" | localize }}
75+
</label>
76+
<div class="col-md-9">
77+
<input
78+
type="email"
79+
class="form-control"
80+
name="adminEmailAddress"
81+
id="adminEmailAddress"
82+
pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{1,})+$"
83+
maxlength="256"
84+
required
85+
[(ngModel)]="tenant.adminEmailAddress"
86+
#adminEmailAddressModel="ngModel"
87+
#adminEmailAddressEl
88+
/>
89+
<abp-validation-summary
90+
[control]="adminEmailAddressModel"
91+
[controlEl]="adminEmailAddressEl"
92+
></abp-validation-summary>
93+
</div>
94+
</div>
95+
<div class="form-group row mb-0">
96+
<label class="col-md-3 col-form-label">
97+
{{ "IsActive" | localize }}
98+
</label>
99+
<div class="col-md-9">
100+
<div class="custom-control custom-checkbox">
37101
<input
38-
matInput
39-
name="AdminEmailAddress"
40-
[placeholder]="'AdminEmailAddress' | localize"
41-
[(ngModel)]="tenant.adminEmailAddress"
42-
type="email"
43-
pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{1,})+$"
44-
required
45-
maxlength="256"
102+
type="checkbox"
103+
class="custom-control-input"
104+
name="isActive"
105+
id="isActive"
106+
[(ngModel)]="tenant.isActive"
46107
/>
47-
</mat-form-field>
48-
<div class="checkbox-wrapper">
49-
<mat-checkbox name="IsActive" [(ngModel)]="tenant.isActive">
50-
{{ "IsActive" | localize }}
51-
</mat-checkbox>
108+
<label class="custom-control-label mt-2" for="isActive"></label>
52109
</div>
53-
<p>{{ "DefaultPasswordIs" | localize: "123qwe" }}</p>
54110
</div>
55111
</div>
56-
</mat-dialog-content>
57-
<div mat-dialog-actions align="end">
58-
<button mat-button type="button" [disabled]="saving" (click)="close(false)">
59-
{{ "Cancel" | localize }}
60-
</button>
61-
<button
62-
mat-flat-button
63-
type="submit"
64-
flex="15"
65-
color="primary"
66-
[disabled]="!createTenantForm.form.valid || saving"
67-
>
68-
{{ "Save" | localize }}
69-
</button>
112+
<p class="text-center text-info mb-0">
113+
{{ "DefaultPasswordIs" | localize: "123qwe" }}
114+
</p>
70115
</div>
116+
<abp-modal-footer
117+
[cancelDisabled]="saving"
118+
[saveDisabled]="!createTenantForm.form.valid || saving"
119+
(onCancelClick)="bsModalRef.hide()"
120+
></abp-modal-footer>
71121
</form>
Lines changed: 14 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,32 @@
1-
import { Component, Injector, OnInit } from '@angular/core';
2-
import { MatDialogRef } from '@angular/material';
1+
import {
2+
Component,
3+
Injector,
4+
OnInit,
5+
Output,
6+
EventEmitter
7+
} from '@angular/core';
38
import { finalize } from 'rxjs/operators';
9+
import { BsModalRef } from 'ngx-bootstrap/modal';
410
import { AppComponentBase } from '@shared/app-component-base';
511
import {
612
CreateTenantDto,
713
TenantServiceProxy
814
} from '@shared/service-proxies/service-proxies';
915

1016
@Component({
11-
templateUrl: 'create-tenant-dialog.component.html',
12-
styles: [
13-
`
14-
mat-form-field {
15-
width: 100%;
16-
}
17-
mat-checkbox {
18-
padding-bottom: 5px;
19-
}
20-
`
21-
]
17+
templateUrl: 'create-tenant-dialog.component.html'
2218
})
2319
export class CreateTenantDialogComponent extends AppComponentBase
2420
implements OnInit {
2521
saving = false;
2622
tenant: CreateTenantDto = new CreateTenantDto();
2723

24+
@Output() onSave = new EventEmitter<any>();
25+
2826
constructor(
2927
injector: Injector,
3028
public _tenantService: TenantServiceProxy,
31-
private _dialogRef: MatDialogRef<CreateTenantDialogComponent>
29+
public bsModalRef: BsModalRef
3230
) {
3331
super(injector);
3432
}
@@ -49,11 +47,8 @@ export class CreateTenantDialogComponent extends AppComponentBase
4947
)
5048
.subscribe(() => {
5149
this.notify.info(this.l('SavedSuccessfully'));
52-
this.close(true);
50+
this.bsModalRef.hide();
51+
this.onSave.emit();
5352
});
5453
}
55-
56-
close(result: any): void {
57-
this._dialogRef.close(result);
58-
}
5954
}
Lines changed: 73 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,80 @@
1-
<form autocomplete="off" #editTenantForm="ngForm" (ngSubmit)="save()">
2-
<h1 mat-dialog-title>{{ "EditTenant" | localize }}</h1>
3-
<mat-dialog-content>
4-
<div class="row-fluid">
5-
<div class="col-md-12">
6-
<mat-form-field>
7-
<input
8-
matInput
9-
name="TenancyName"
10-
[placeholder]="'TenancyName' | localize"
11-
[(ngModel)]="tenant.tenancyName"
12-
required
13-
minlength="2"
14-
maxlength="64"
15-
/>
16-
</mat-form-field>
17-
<mat-form-field>
1+
<form
2+
class="form-horizontal"
3+
autocomplete="off"
4+
#editTenantForm="ngForm"
5+
(ngSubmit)="save()"
6+
>
7+
<abp-modal-header
8+
[title]="'EditTenant' | localize"
9+
(onCloseClick)="bsModalRef.hide()"
10+
></abp-modal-header>
11+
<div class="modal-body">
12+
<div class="form-group row required">
13+
<label class="col-md-3 col-form-label" for="tenancyName">
14+
{{ "TenancyName" | localize }}
15+
</label>
16+
<div class="col-md-9">
17+
<input
18+
type="text"
19+
class="form-control"
20+
name="tenancyName"
21+
id="tenancyName"
22+
minlength="2"
23+
maxlength="64"
24+
required
25+
[(ngModel)]="tenant.tenancyName"
26+
#tenancyNameModel="ngModel"
27+
#tenancyNameEl
28+
/>
29+
<abp-validation-summary
30+
[control]="tenancyNameModel"
31+
[controlEl]="tenancyNameEl"
32+
></abp-validation-summary>
33+
</div>
34+
</div>
35+
<div class="form-group row required">
36+
<label class="col-md-3 col-form-label" for="name">
37+
{{ "Name" | localize }}
38+
</label>
39+
<div class="col-md-9">
40+
<input
41+
type="text"
42+
class="form-control"
43+
name="name"
44+
id="name"
45+
maxlength="128"
46+
required
47+
[(ngModel)]="tenant.name"
48+
#nameModel="ngModel"
49+
#nameEl
50+
/>
51+
<abp-validation-summary
52+
[control]="nameModel"
53+
[controlEl]="nameEl"
54+
></abp-validation-summary>
55+
</div>
56+
</div>
57+
<div class="form-group row mb-0">
58+
<label class="col-md-3 col-form-label">
59+
{{ "IsActive" | localize }}
60+
</label>
61+
<div class="col-md-9">
62+
<div class="custom-control custom-checkbox">
1863
<input
19-
matInput
20-
name="Name"
21-
[placeholder]="'Name' | localize"
22-
[(ngModel)]="tenant.name"
23-
required
24-
maxlength="128"
64+
type="checkbox"
65+
class="custom-control-input"
66+
name="isActive"
67+
id="isActive"
68+
[(ngModel)]="tenant.isActive"
2569
/>
26-
</mat-form-field>
27-
<div class="checkbox-wrapper">
28-
<mat-checkbox name="IsActive" [(ngModel)]="tenant.isActive">
29-
{{ "IsActive" | localize }}
30-
</mat-checkbox>
70+
<label class="custom-control-label mt-2" for="isActive"></label>
3171
</div>
3272
</div>
3373
</div>
34-
</mat-dialog-content>
35-
<div mat-dialog-actions align="end">
36-
<button mat-button type="button" [disabled]="saving" (click)="close(false)">
37-
{{ "Cancel" | localize }}
38-
</button>
39-
<button
40-
mat-flat-button
41-
type="submit"
42-
flex="15"
43-
color="primary"
44-
[disabled]="!editTenantForm.form.valid || saving"
45-
>
46-
{{ "Save" | localize }}
47-
</button>
4874
</div>
75+
<abp-modal-footer
76+
[cancelDisabled]="saving"
77+
[saveDisabled]="!editTenantForm.form.valid || saving"
78+
(onCancelClick)="bsModalRef.hide()"
79+
></abp-modal-footer>
4980
</form>

0 commit comments

Comments
 (0)