Skip to content

Commit 8e498d8

Browse files
committed
feat(arc-saas): adding tenant_registration component with integrartion
adding tenant_registration component with integrartion GH-63
1 parent e36bfe1 commit 8e498d8

14 files changed

+562
-3
lines changed

projects/saas-ui/src/app/main/commands/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,3 +15,4 @@ export * from './get-total-lead.command';
1515
export * from './get-total-tenant.command';
1616
export * from './get-total-plan.command';
1717
export * from './get-total-billing-plan.command';
18+
export * from './register-tenant.command';
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import {
2+
ApiService,
3+
GetListAPICommand,
4+
IAdapter,
5+
PostAPICommand,
6+
} from '@project-lib/core/api';
7+
import {Lead} from '../../shared/models';
8+
9+
import {IAnyObject} from '@project-lib/core/i-any-object';
10+
import {TenantLead} from '../../shared/models/tenantLead.model';
11+
12+
export class RegisterTenantCommand<T> extends PostAPICommand<TenantLead> {
13+
constructor(
14+
apiService: ApiService,
15+
adapter: IAdapter<TenantLead>,
16+
appConfig: IAnyObject,
17+
) {
18+
super(
19+
apiService,
20+
adapter,
21+
`${appConfig.baseApiUrl}${appConfig.tenantmgmtServiceUrl}/tenants`,
22+
);
23+
}
24+
}

projects/saas-ui/src/app/main/components/onboarding-tenant-list/onboarding-tenant-list.component.html

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,22 @@
11
<div>
22
<nb-card accent="danger" class="card-style">
33
<nb-card-body>
4-
<h2 class="heading">Onboarded Tenant List</h2>
4+
<div class="header-wrapper">
5+
<h2 class="heading">Onboarded Tenant List</h2>
6+
<!-- signup button -->
7+
<div class="regbtn">
8+
<button
9+
nbButton
10+
shape="round"
11+
size="medium"
12+
status="danger"
13+
(click)="registerTenantPage()"
14+
>
15+
Add tenant
16+
</button>
17+
</div>
18+
</div>
19+
520
<!-- ag-grid -->
621
<div class="grid">
722
<ag-grid-angular

projects/saas-ui/src/app/main/components/onboarding-tenant-list/onboarding-tenant-list.component.scss

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,14 @@
44
width: 100%;
55
height: 400;
66
}
7+
8+
.header-wrapper{
9+
display: flex;
10+
justify-content: space-between;
11+
align-items: center;
12+
}
13+
14+
.a {
15+
text-decoration: none;
16+
color: #19a5ff;
17+
}

projects/saas-ui/src/app/main/components/onboarding-tenant-list/onboarding-tenant-list.component.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {Component, Inject, OnInit} from '@angular/core';
2-
import {ActivatedRoute} from '@angular/router';
2+
import {ActivatedRoute, Router} from '@angular/router';
33
import {RouteComponentBaseDirective} from '@project-lib/core/route-component-base';
44
import {
55
ColDef,
@@ -37,6 +37,7 @@ export class OnboardingTenantListComponent extends RouteComponentBaseDirective {
3737
};
3838
constructor(
3939
protected override readonly location: Location,
40+
private readonly router: Router,
4041
protected override readonly route: ActivatedRoute,
4142
private readonly tenantFacade: TenantFacadeService,
4243
private http: HttpClient,
@@ -152,4 +153,8 @@ export class OnboardingTenantListComponent extends RouteComponentBaseDirective {
152153
getTotal() {
153154
return this.tenantFacade.getTotalTenant();
154155
}
156+
157+
registerTenantPage() {
158+
this.router.navigate(['main/create-tenant']);
159+
}
155160
}
Lines changed: 256 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,256 @@
1+
<nb-card class="h-100 card-row">
2+
<nb-card-body class="m-0">
3+
<div class="main-wrapper add-lead-wrapper">
4+
<div>
5+
<div class="sign-in-title">
6+
<h2>Tenant Registration</h2>
7+
<form [formGroup]="tenantRegForm" (ngSubmit)="onSubmit()">
8+
<!-- input fields -->
9+
<div class="input-wrapper">
10+
<div class="input-box">
11+
<div class="input-title">
12+
<span>First Name</span>
13+
</div>
14+
<div class="inputTags">
15+
<input
16+
type="text"
17+
placeholder="Enter First Name"
18+
status="“info”"
19+
formControlName="firstName"
20+
nbInput
21+
/>
22+
</div>
23+
</div>
24+
25+
<div class="input-box">
26+
<div class="input-title">
27+
<span>Last Name</span>
28+
</div>
29+
<div class="inputTags">
30+
<input
31+
type="text"
32+
placeholder="Enter Last Name"
33+
status="“info”"
34+
formControlName="lastName"
35+
nbInput
36+
/>
37+
</div>
38+
</div>
39+
40+
<div class="input-box">
41+
<div class="input-title">
42+
<span>Company Name</span>
43+
</div>
44+
<div class="inputTags">
45+
<input
46+
type="text"
47+
placeholder="Company Name"
48+
status="“info”"
49+
formControlName="name"
50+
nbInput
51+
/>
52+
</div>
53+
</div>
54+
55+
<!-- email -->
56+
<div class="input-box">
57+
<div class="input-title">
58+
<span>Email</span>
59+
</div>
60+
<div class="input">
61+
<input
62+
type="Email"
63+
placeholder="Email"
64+
status="“info”"
65+
fieldSize="medium"
66+
formControlName="email"
67+
nbInput
68+
/>
69+
</div>
70+
<div
71+
*ngIf="
72+
tenantRegForm.get('email').hasError('required') &&
73+
tenantRegForm.get('email').touched
74+
"
75+
>
76+
Email is required.
77+
</div>
78+
<div
79+
*ngIf="
80+
tenantRegForm.get('email').hasError('email') &&
81+
tenantRegForm.get('email').touched
82+
"
83+
>
84+
Invalid email format.
85+
</div>
86+
</div>
87+
<!-- Validated or not -->
88+
89+
<!-- address-->
90+
<div class="input-box address-input-box">
91+
<div class="input-title">
92+
<span>Address</span>
93+
</div>
94+
<div class="input address-input">
95+
<input
96+
type="text"
97+
placeholder="Enter Your Address"
98+
status="“info”"
99+
formControlName="address"
100+
nbInput
101+
/>
102+
</div>
103+
</div>
104+
105+
<div class="input-box">
106+
<div class="input-title">
107+
<span>City</span>
108+
</div>
109+
<div class="input">
110+
<input
111+
type="text"
112+
placeholder="Enter Your City"
113+
status="“info”"
114+
formControlName="city"
115+
nbInput
116+
/>
117+
</div>
118+
</div>
119+
120+
<div class="input-box">
121+
<div class="input-title">
122+
<span>State</span>
123+
</div>
124+
<div class="input">
125+
<input
126+
type="text"
127+
placeholder="Enter Your State"
128+
status="“info”"
129+
formControlName="state"
130+
nbInput
131+
/>
132+
</div>
133+
</div>
134+
135+
<div class="input-box">
136+
<div class="input-title">
137+
<span>Country</span>
138+
</div>
139+
<div class="input">
140+
<input
141+
type="text"
142+
placeholder="Enter your Country"
143+
status="“info”"
144+
formControlName="country"
145+
nbInput
146+
/>
147+
</div>
148+
</div>
149+
150+
<div class="input-box">
151+
<div class="input-title">
152+
<span>Zip Code</span>
153+
</div>
154+
<div class="input">
155+
<input
156+
type="text"
157+
placeholder="Enter your Zip Code"
158+
status="“info”"
159+
formControlName="zip"
160+
nbInput
161+
/>
162+
</div>
163+
</div>
164+
<!-- key -->
165+
<div class="input-box">
166+
<div class="input-title">
167+
<span>Key</span>
168+
</div>
169+
<div class="input">
170+
<input
171+
placeholder="Enter Unique Key."
172+
fieldSize="medium"
173+
status="“info”"
174+
formControlName="key"
175+
nbInput
176+
/>
177+
</div>
178+
</div>
179+
<!-- domain -->
180+
<div class="input-box">
181+
<div class="input-title">
182+
<span>Domain</span>
183+
</div>
184+
<div class="input">
185+
<input
186+
placeholder="Enter your mail domain."
187+
fieldSize="medium"
188+
status="“info”"
189+
formControlName="domains"
190+
nbInput
191+
/>
192+
</div>
193+
</div>
194+
195+
<!-- Subscription Plans -->
196+
197+
<div class="plan-card-container">
198+
<div class="input-title">
199+
<span>Subscription Plan</span>
200+
</div>
201+
<div class="plan-card-wrapper">
202+
<nb-card
203+
class="plan-card-box"
204+
accent="danger"
205+
*ngFor="let plan of subscriptionPlans"
206+
>
207+
<nb-card-header>{{ plan.name }}</nb-card-header>
208+
<nb-card-body>
209+
<p>{{ plan.description }}</p>
210+
<p>${{ plan.price }}</p>
211+
</nb-card-body>
212+
<nb-card-footer>
213+
<!-- Use FormControl directly -->
214+
<input
215+
type="radio"
216+
[formControl]="tenantRegForm.get('planId')"
217+
[value]="plan.id"
218+
/>
219+
{{ plan.name }}
220+
</nb-card-footer>
221+
</nb-card>
222+
</div>
223+
</div>
224+
225+
<!-- signup button -->
226+
<div class="btn-wrapper">
227+
<div class="btn regbtn">
228+
<button
229+
nbButton
230+
shape="round"
231+
size="medium"
232+
status="danger"
233+
(click)="backToPriviousPage()"
234+
>
235+
Back
236+
</button>
237+
238+
<button
239+
nbButton
240+
shape="round"
241+
size="medium"
242+
status="danger"
243+
[disabled]="!tenantRegForm.valid"
244+
type="submit"
245+
>
246+
Registration
247+
</button>
248+
</div>
249+
</div>
250+
</div>
251+
</form>
252+
</div>
253+
</div>
254+
</div>
255+
</nb-card-body>
256+
</nb-card>

0 commit comments

Comments
 (0)