Skip to content

Commit 1b90b2c

Browse files
ismcagdasismcagdas
committed
#14: implemented tenant page
1 parent 5b5d6cf commit 1b90b2c

File tree

7 files changed

+148
-16
lines changed

7 files changed

+148
-16
lines changed

‎angular/src/app/app.module.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import { AboutComponent } from '@app/about/about.component';
2121
import { UsersComponent } from '@app/users/users.component';
2222
import { CreateUserModalComponent } from '@app/users/create-user-modal.component';
2323
import { TenantsComponent } from '@app/tenants/tenants.component';
24-
24+
import { CreateTenantModalComponent } from '@app/tenants/create-tenant-modal.component';
2525

2626
@NgModule({
2727
declarations: [
@@ -30,7 +30,8 @@ import { TenantsComponent } from '@app/tenants/tenants.component';
3030
AboutComponent,
3131
UsersComponent,
3232
CreateUserModalComponent,
33-
TenantsComponent
33+
TenantsComponent,
34+
CreateTenantModalComponent
3435
],
3536
imports: [
3637
ngCommon.CommonModule,

‎angular/src/app/tenants/create-tenant-modal.component.html‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<div bsModal #createTenantModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="createUserModal" aria-hidden="true" [config]="{backdrop: 'static'}">
2+
<div class="modal-dialog">
3+
4+
<div class="modal-content">
5+
6+
<form *ngIf="active" #createTenantForm="ngForm" novalidate (ngSubmit)="save()">
7+
8+
<div class="modal-header">
9+
<button type="button" class="close" (click)="close()" aria-label="Close">
10+
<span aria-hidden="true">&times;</span>
11+
</button>
12+
<h4 class="modal-title">
13+
<span>{{l("ChangeTenant")}}</span>
14+
</h4>
15+
</div>
16+
17+
<div class="modal-body">
18+
<div class="form-group">
19+
<label>{{l("TenancyName")}}</label>
20+
<input class="form-control" type="text" name="TenancyName" [(ngModel)]="tenant.tenancyName" required maxlength="64" minlength="2">
21+
</div>
22+
<div class="form-group">
23+
<label>{{l("Name")}}</label>
24+
<input type="text" name="Name" class="form-control" [(ngModel)]="tenant.name" required maxlength="128">
25+
</div>
26+
<div class="form-group">
27+
<label>{{l("DatabaseConnectionString")}} ({{l("Optional")}})</label>
28+
<input type="text" name="ConnectionString" class="form-control" [(ngModel)]="tenant.connectionString" maxlength="1024">
29+
</div>
30+
<div class="form-group">
31+
<label>{{l("AdminEmailAddress")}}</label>
32+
<input type="email" name="AdminEmailAddress" class="form-control" [(ngModel)]="tenant.adminEmailAddress" required maxlength="256">
33+
</div>
34+
<p>{{l("DefaultPasswordIs","123qwe")}}</p>
35+
</div>
36+
37+
<div class="modal-footer">
38+
<button [disabled]="saving" type="button" class="btn btn-default" (click)="close()">{{l("Cancel")}}</button>
39+
<button type="submit" class="btn btn-primary blue" [disabled]="!createTenantForm.form.valid"><i class="fa fa-save"></i> <span>{{l("Save")}}</span></button>
40+
</div>
41+
42+
</form>
43+
44+
</div>
45+
</div>
46+
</div>

‎angular/src/app/tenants/create-tenant-modal.component.ts‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import { Component, ViewChild, Injector, Output, EventEmitter, ElementRef } from '@angular/core';
2+
import { ModalDirective } from 'ng2-bootstrap';
3+
import { TenantServiceProxy, CreateTenantInput } from '@shared/service-proxies/service-proxies';
4+
import { AppComponentBase } from '@shared/common/app-component-base';
5+
import { AppConsts } from '@shared/AppConsts';
6+
7+
import * as _ from "lodash";
8+
9+
@Component({
10+
selector: 'createTenantModal',
11+
templateUrl: './create-tenant-modal.component.html'
12+
})
13+
export class CreateTenantModalComponent extends AppComponentBase {
14+
15+
@ViewChild('createTenantModal') modal: ModalDirective;
16+
17+
@Output() modalSave: EventEmitter<any> = new EventEmitter<any>();
18+
19+
active: boolean = false;
20+
saving: boolean = false;
21+
tenant: CreateTenantInput = null;
22+
23+
constructor(
24+
injector: Injector,
25+
private _tenantService: TenantServiceProxy
26+
) {
27+
super(injector);
28+
}
29+
30+
show(): void {
31+
this.active = true;
32+
this.modal.show();
33+
this.tenant = new CreateTenantInput();
34+
}
35+
36+
save(): void {
37+
38+
this.saving = true;
39+
this._tenantService.createTenant(this.tenant)
40+
.finally(() => { this.saving = false; })
41+
.subscribe(() => {
42+
this.notify.info(this.l('SavedSuccessfully'));
43+
this.close();
44+
this.modalSave.emit(null);
45+
});
46+
}
47+
48+
close(): void {
49+
this.active = false;
50+
this.modal.hide();
51+
}
52+
}

‎angular/src/app/tenants/tenants.component.html‎

Lines changed: 23 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,23 @@
1-
<!DOCTYPE html>
2-
<html>
3-
<head>
4-
<meta charset="utf-8" />
5-
<title></title>
6-
</head>
7-
<body>
8-
Tenants...
9-
</body>
10-
</html>
1+
<div>
2+
<h1>{{l("Tenants")}}</h1>
3+
<div class="row">
4+
<div class="col-md-12">
5+
<button data-toggle="modal" class="btn btn-primary pull-right" (click)="createTenant()"><i class="fa fa-plus"></i> {{l("CreateNewTenant")}}</button>
6+
<table class="table">
7+
<thead>
8+
<tr>
9+
<th>{{l("TenancyName")}}</th>
10+
<th>{{l("Name")}}</th>
11+
</tr>
12+
</thead>
13+
<tbody>
14+
<tr *ngFor="let tenant of tenants">
15+
<td>{{tenant.tenancyName}}</td>
16+
<td>{{tenant.name}}</td>
17+
</tr>
18+
</tbody>
19+
</table>
20+
</div>
21+
</div>
22+
</div>
23+
<createTenantModal #createTenantModal (modalSave)="getTenants()"></createTenantModal>

‎angular/src/app/tenants/tenants.component.ts‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1-
import { Component, Injector, AfterViewInit } from '@angular/core';
1+
import { Component, Injector, AfterViewInit, ViewChild } from '@angular/core';
22
import { AppComponentBase } from '@shared/common/app-component-base';
33
import { appModuleAnimation } from '@shared/animations/routerTransition';
4+
import { TenantServiceProxy, TenantListDto } from '@shared/service-proxies/service-proxies';
5+
import { CreateTenantModalComponent } from '@app/tenants/create-tenant-modal.component';
46

57
@Component({
68
templateUrl: './tenants.component.html',
@@ -9,8 +11,27 @@ import { appModuleAnimation } from '@shared/animations/routerTransition';
911
export class TenantsComponent extends AppComponentBase {
1012

1113
constructor(
12-
injector: Injector
14+
injector: Injector,
15+
private _tenantService: TenantServiceProxy
1316
) {
1417
super(injector);
1518
}
19+
20+
@ViewChild('createTenantModal') createTenantModal: CreateTenantModalComponent;
21+
tenants: TenantListDto[] = [];
22+
23+
ngOnInit() {
24+
this.getTenants();
25+
}
26+
27+
getTenants(): void {
28+
this._tenantService.getTenants()
29+
.subscribe((result) => {
30+
this.tenants = result.items;
31+
});
32+
}
33+
34+
createTenant(): void {
35+
this.createTenantModal.show();
36+
}
1637
}

‎angular/src/app/users/users.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<h1>{{l('Users')}}</h1>
33
<div class="row">
44
<div class="col-md-12">
5-
<button data-toggle="modal" data-target="#createUserModal" class="btn btn-primary pull-right" (click)="createUser()"><i class="fa fa-plus"></i> {{l('CreateNewUser')}}</button>
5+
<button data-toggle="modal" class="btn btn-primary pull-right" (click)="createUser()"><i class="fa fa-plus"></i> {{l('CreateNewUser')}}</button>
66
<table class="table">
77
<thead>
88
<tr>

‎angular/src/app/users/users.component.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,6 @@ export class UsersComponent extends AppComponentBase implements OnInit {
3333
}
3434

3535
createUser(): void {
36-
console.log("creat it...");
3736
this.createUserModal.show();
3837
}
3938
}

0 commit comments

Comments
 (0)