Implement and style Register page

Author: volodyakurpita

app/app.module.ts

@@ -8,6 +8,7 @@ import { CostModule } from "./tabs/cost/cost.module";
 import { TabsComponent } from "./tabs/tabs.component";
 import { CostsComponent } from "./tabs/cost/costs.component";
 import { LoginComponent} from "./login/login.component";
+import { RegisterComponent} from "./register/register.component";
 
 @NgModule({
     bootstrap: [
@@ -22,7 +23,8 @@ import { LoginComponent} from "./login/login.component";
         AppComponent,
         TabsComponent,
         CostsComponent,
-        LoginComponent
+        LoginComponent,
+        RegisterComponent
     ],
     providers: [
     ],

app/app.routing.ts

@@ -7,10 +7,12 @@ import { CostsComponent } from "./tabs/cost/costs.component";
 import { CostDetailComponent } from "./tabs/cost/detail/cost-detail.component";
 import { CostEditComponent } from "./tabs/cost/edit/cost-edit.component";
 import { LoginComponent } from "./login/login.component";
+import { RegisterComponent } from "./register/register.component";
 
 const routes: Routes = [
     { path: "", component: LoginComponent },
     { path: 'tabs', component: TabsComponent },
+    { path: 'register', component: RegisterComponent },
     //{ path: "costs", component: CostsComponent },
     { path: "cost/:id", component: CostDetailComponent },
     { path: "cost-edit/:id", component: CostEditComponent }

app/login/login.component.html

@@ -11,6 +11,6 @@
             <Label text="Password" class="label font-weight-bold m-b-5"></Label>
             <TextField secure="true"></TextField>
         </StackLayout>
-        <Button class="btn-login" text="Login" (tap)="login()"></Button>
+        <Button text="Login" class="btn-login" (tap)="login()"></Button>
         <Label [nsRouterLink]="['/register']" text="Not a member? Register here." class="text-center footnote"></Label>
 </StackLayout>

app/login/login.component.ts

@@ -19,11 +19,7 @@ export class LoginComponent implements OnInit {
         }
     }
 
-    public ngOnInit() {
-        //if(ApplicationSettings.getBoolean("authenticated", false)) {
-           // this.router.navigate(["/secure"], { clearHistory: true });
-        //}
-    }
+    public ngOnInit() {}
 
     public login() {
          this.router.navigate(["/tabs"], { clearHistory: true });

app/register/register.component.css

@@ -0,0 +1,11 @@
+.register-view
+{
+    padding-left: 50;
+    padding-right: 50;
+}
+ 
+.btn-register
+{
+    background-color: #7ada2f;  
+    color: aliceblue;
+}

app/register/register.component.html

@@ -0,0 +1,16 @@
+<ActionBar title="Register" class="action-bar">
+</ActionBar>
+
+<StackLayout verticalAlignment="center" class="register-view" >
+        <Label text="Name" class="label font-weight-bold m-b-5"></Label>
+        <TextField></TextField>
+        <Label text="Surname" class="label font-weight-bold m-b-5"></Label>
+        <TextField></TextField>
+        <Label text="Login" class="label font-weight-bold m-b-5"></Label>
+        <TextField></TextField>
+        <Label text="Email" class="label font-weight-bold m-b-5"></Label>
+        <TextField></TextField>
+        <Label text="Password" class="label font-weight-bold m-b-5"></Label>
+        <TextField secure="true"></TextField>
+        <Button  [nsRouterLink]="['']" text="Register" class="btn-register"></Button>
+</StackLayout>

app/register/register.component.ts

@@ -0,0 +1,26 @@
+import { Component, OnInit } from "@angular/core";
+import { RouterExtensions } from "nativescript-angular/router";
+import * as ApplicationSettings from "application-settings";
+
+@Component({
+    moduleId: module.id,
+    selector: "ns-register",
+    templateUrl: "register.component.html",
+    styleUrls: ["register.component.css"]
+})
+export class RegisterComponent implements OnInit {
+
+    public input: any;
+    
+    public constructor(private router: RouterExtensions) {
+        this.input = {
+            "name": "",
+            "surname": "",
+            "login": "",
+            "email": "",
+            "password": "",
+        }
+    }
+
+       public ngOnInit() {}
+}