Skip to content

T
Time-Expense
Commit 8483fbe6 authored by Poojitha, Katakam's avatar Poojitha, Katakam
Browse files
Options

UI changes

parent 5d41043e
Hide whitespace changes
Inline Side-by-side
Showing with 83 additions and 32 deletions
package-lock.json
View file @ 8483fbe6
......@@ -19,6 +19,7 @@
"@techiediaries/ngx-qrcode": "^9.1.0",
"bootstrap": "^5.2.3",
"rxjs": "~7.5.0",
"swal": "^0.1.0",
"sweetalert2": "^11.7.3",
"tslib": "^2.3.0",
"zone.js": "~0.12.0"
......@@ -1190,7 +1191,6 @@
"version": "7.21.3",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.21.3.tgz",
"integrity": "sha512-lobG0d7aOfQRXh8AyklEAgZGvA4FShxo6xQbUrrT/cNBPUdIDojlokwJsQyCC/eKia7ifqM0yP+2DRZ4WKw2RQ==",
"dev": true,
"bin": {
"parser": "bin/babel-parser.js"
},
......@@ -3437,6 +3437,24 @@
"@types/node": "*"
}
},
"node_modules/@vue/compiler-sfc": {
"version": "2.7.14",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz",
"integrity": "sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==",
"dependencies": {
"@babel/parser": "^7.18.4",
"postcss": "^8.4.14",
"source-map": "^0.6.1"
}
},
"node_modules/@vue/compiler-sfc/node_modules/source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/@webassemblyjs/ast": {
"version": "1.11.1",
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.1.tgz",
......@@ -4910,6 +4928,11 @@
"node": ">=4"
}
},
"node_modules/csstype": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz",
"integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ=="
},
"node_modules/custom-event": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
......@@ -8140,7 +8163,6 @@
"version": "3.3.4",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz",
"integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==",
"dev": true,
"bin": {
"nanoid": "bin/nanoid.cjs"
},
......@@ -9286,8 +9308,7 @@
"node_modules/picocolors": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
"dev": true
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
},
"node_modules/picomatch": {
"version": "2.3.1",
......@@ -9349,7 +9370,6 @@
"version": "8.4.21",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
"integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==",
"dev": true,
"funding": [
{
"type": "opencollective",
......@@ -10648,7 +10668,6 @@
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
"integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
"dev": true,
"engines": {
"node": ">=0.10.0"
}
......@@ -10881,6 +10900,18 @@
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/swal": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/swal/-/swal-0.1.0.tgz",
"integrity": "sha512-uJP65BJyHjZ1dAsWSeiVG7JKDOcvaDOqLBCPHOZ0y2xlVwqZHqAungxtOwirM5hPoovBaJ05W7F+wF+azVjhbg==",
"dependencies": {
"vue": "^2.0.1"
},
"engines": {
"node": ">= 4.0.0",
"npm": ">= 3.0.0"
}
},
"node_modules/sweetalert2": {
"version": "11.7.3",
"resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-11.7.3.tgz",
......@@ -11460,6 +11491,15 @@
"node": ">=0.10.0"
}
},
"node_modules/vue": {
"version": "2.7.14",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.7.14.tgz",
"integrity": "sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==",
"dependencies": {
"@vue/compiler-sfc": "2.7.14",
"csstype": "^3.1.0"
}
},
"node_modules/watchpack": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",
......
src/app/login/login.component.css
View file @ 8483fbe6
......@@ -3,9 +3,10 @@
justify-content: center;
align-items: center;
width: 25rem;
margin-left: auto;
height:23rem;
margin-left: 5rem;
margin-right: auto;
margin-top: 5rem;
margin-top: 8rem;
background-color: rgb(255, 255, 255);
box-shadow: rgb(46 56 64 / 12%) 0px 4px 16px;
border-radius: 8px;
......@@ -21,12 +22,12 @@
justify-content: center;
}
.ctn-btn{
width : 60%;
color : #021a32;
background-color: #c1d82f;
width : 50%;
color : whitesmoke;
background-color: #2b3c6b;
border : 0.5px solid #d7eafd;
border-radius : 5px;
margin-left: 4rem !important;
margin-left: 5.8rem !important;
}
......
src/app/scanqr/scanqr.component.css
View file @ 8483fbe6
......@@ -2,10 +2,11 @@
margin:auto;
justify-content: center;
align-items: center;
width: 43rem;
margin-left: auto;
width: 25rem;
height: auto;
margin-left: 5rem;
margin-right: auto;
margin-top: 5rem;
margin-top: 8rem;
background-color: rgb(255, 255, 255);
border-radius: 8px;
justify-content: center;
......@@ -17,21 +18,20 @@
.submit{
width:50%;
margin-left: 5rem !important;
color : #021a32;
background-color: #c1d82f;
border : 0.5px solid #d7eafd;
border-radius : 5px;
color : whitesmoke;
background-color: #2b3c6b;
border : 0.5px solid #d7eafd;
border-radius : 5px;
}
.qr{
display: flex;
width:50%;
margin-left: 8rem !important;
margin-left: 5rem !important;
}
.ctn-btn{
width : 60%;
color : #021a32;
background-color: #c1d82f;
color : whitesmoke;
background-color: #2b3c6b;
border : 0.5px solid #d7eafd;
border-radius : 5px;
margin-left: 4rem !important;
......
src/app/scanqr/scanqr.component.html
View file @ 8483fbe6
......@@ -8,7 +8,7 @@
</div>
<div class="row mb-3">
<div class="col">
<h6>Enter your Unique Id:</h6>
<h6>Enter your OTP:</h6>
</div>
<div class="col">
<input type="text" class="text-field" placeholder=" Enter value " [(ngModel)]="genOtp">
......
src/app/scanqr/scanqr.component.ts
View file @ 8483fbe6
......@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { NgxQrcodeElementTypes, NgxQrcodeErrorCorrectionLevels } from '@techiediaries/ngx-qrcode';
import { GlobalService } from '../global.service';
import Swal from 'sweetalert2';
import { Router } from '@angular/router';
@Component({
selector: 'app-scanqr',
......@@ -13,19 +14,21 @@ export class ScanqrComponent implements OnInit {
qrDetails : any = '';
genOtp : any = '';
phnNumber : any = '';
constructor(public globals:GlobalService) {}
constructor(public globals:GlobalService,private router: Router) {}
ngOnInit(): void {
this.globals.getQr().subscribe((res : any)=>{
this.globals.getQr().subscribe({
next:(res : any)=>{
console.log(res);
this.qrDetails = res;
this.uniqueId = res.secret.otpauth_url;
console.log(this.uniqueId);
})
},error: (err) => {Swal.fire("Error","Unable to load QR code","error")}
}
)}
validate(){
let postObj = {
totp : this.genOtp,
......@@ -33,12 +36,18 @@ export class ScanqrComponent implements OnInit {
secret : this.qrDetails.secret.base32,
phone_number : this.phnNumber
}
this.globals.validateQr(postObj).subscribe((res : any)=>{
this.globals.validateQr(postObj).subscribe({
next:(res : any)=>{
console.log(res);
if(res.insert_to_db == 'True' && res.validated == true){
Swal.fire("success", "App validated Successfully","success")
this.router.navigateByUrl('/login')
}
else{
Swal.fire("Error","Enter Valid Details","error")
}
})
},error: (err) => {Swal.fire("Error","Error in validating QR","error")}
}
)}
}
src/index.html
View file @ 8483fbe6
......@@ -15,7 +15,7 @@
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</head>
<body>
<body style="background-image: url('./assets/bg.png'); background-size: 100%; background-repeat: no-repeat;">
<app-root></app-root>
</body>
</html>
src/styles.css
View file @ 8483fbe6
......@@ -6,7 +6,7 @@
color: #4b9dee;
}
.tekgreen{
color:#c1d82f;
color:#2b3c6b;
}
.text-field{
height :30px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment