krishna_hexa
/
Integrated
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

UI Update

gauravfullcomponent
Gowrisankar J g 4 years ago
parent
79ad793d61
commit
69efc22a50
3 changed files with 66 additions and 69 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 13
      Angular-UrbanBazaar/src/app/auth/login/login.component.css
  2. 73
      Angular-UrbanBazaar/src/app/auth/login/login.component.html
  3. 49
      Angular-UrbanBazaar/src/app/auth/login/login.component.ts

13
Angular-UrbanBazaar/src/app/auth/login/login.component.css
View File

@ -3,10 +3,19 @@ body {
padding: 10px 10px 10px 10px;
}
.login-main{
.login-main {
margin-top: 10%;
}
mat-card{
mat-card {
min-width: 30%;
max-width: 50%;
}
.main-div {
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}

73
Angular-UrbanBazaar/src/app/auth/login/login.component.html
View File

@ -1,43 +1,34 @@
<body>
<div fxLayout="column" fxLayoutAlign="space-around center" class="login-main">
<mat-card >
&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;
<h2 style="color:darkblue;">
&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; Welcome to Urban Bazaar !!!
</h2>
<div style="text-align:center;"><img src="/assets/Images/Logo.png" alt="Logo"></div>
<mat-card-header>
<mat-card-title>Login Page</mat-card-title>
</mat-card-header>
<mat-card-content fxLayout="column">
<mat-form-field>
<input matInput placeholder="Username"
[formControl]="username">
</mat-form-field>
<mat-form-field>
<input type="password" matInput placeholder="password"
[formControl]="password">
</mat-form-field>
</mat-card-content>
<!-- <div style="text-align:left;">
<a [routerLink]="['signup']">SignUp</a>
</div> -->
<mat-card-actions align="end">
<button mat-raised-button color="primary" (click)="signup()">Signup</button>
<p style="color: darkblue;" >OR &nbsp;</p>
<button mat-raised-button color="primary" (click)="userLogin()">Login</button>
</mat-card-actions>
</mat-card>
<!-- </div>
<div style="text-align:center;">
<a [routerLink]="['signup']">SignUp</a>
</div> -->
<!-- <div style="text-align:center;">
<a [routerLink]="['user-profile-details']">user details</a>
</div>
<div class="main-div">
<mat-card>
<mat-card-header>
<mat-card-title>Welcome to Urban Bazaar !!!</mat-card-title>
</mat-card-header>
<div style="text-align:center;">
<a [routerLink]="['memberlist']">memberlist</a>
</div>
</body> -->
<div style="text-align: center">
<img src="/assets/Images/Logo.png" alt="Logo" />
</div>
<mat-card-content fxLayout="column">
<mat-form-field>
<input matInput placeholder="Username" [formControl]="username" />
</mat-form-field>
<mat-form-field>
<input type="password" matInput placeholder="Password" [formControl]="password" />
</mat-form-field>
<span style="color: red;">{{errorMessage}}</span>
<button mat-raised-button color="primary" (click)="userLogin()">
Login
</button>
<a href="#" style="text-align: center; padding-top: 8px;">Forgotten password?</a>
</mat-card-content>
<mat-divider></mat-divider>
<mat-card-actions>
<button mat-raised-button color="primary" (click)="signup()">
Create a new Account
</button>
</mat-card-actions>
</mat-card>
</div>
</body>

49
Angular-UrbanBazaar/src/app/auth/login/login.component.ts
View File

@ -10,41 +10,38 @@ import { UserService } from 'src/app/services/user.service';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
styleUrls: ['./login.component.css'],
})
export class LoginComponent implements OnInit {
username = new FormControl();
password = new FormControl();
responseMessage : string = "";
temp : Observable<User>;
// temp : User;
// temps : Observable<string>;
// userList : Observable<User[]>;
signup(){
this.router.navigateByUrl('/signup')
}
constructor(private _userService : UserService, private router : Router) {}
responseMessage: string = '';
temp: Observable<User>;
errorMessage: string = '';
constructor(private _userService: UserService, private router: Router) {}
signup() {
this.router.navigateByUrl('/signup');
}
userLogin() {
// alert(this.username.value+" | "+this.password.value);
let user : Login = {
let user: Login = {
userfirstname: this.username.value,
userpassword: this.password.value
}
userpassword: this.password.value,
};
this.temp = this._userService.findUserByUsername(this.username.value);
this.temp.subscribe(v => {
if(v.userpassword == this.password.value)
{ this.temp.subscribe(v => this._userService.currentUser = v);
this.router.navigateByUrl('/home');
alert("Login Successfull !!")}
else
alert("Login falied !!");
this.temp.subscribe((v) => {
if (v.userpassword == this.password.value) {
this.temp.subscribe((v) => (this._userService.currentUser = v));
this.router.navigateByUrl('/home');
alert('Login Successfull !!');
} else {
this.errorMessage = 'Wrong Password.';
alert('Login falied !!');
}
});
}
ngOnInit(): void {
}
ngOnInit(): void {}
}
Write Preview
Loading…
Cancel
Save