From 477e11004c8dd20a6459125dd3c600efd20522c8 Mon Sep 17 00:00:00 2001 From: sriram-at-840620226347 Date: Wed, 25 Sep 2019 10:49:32 +0530 Subject: [PATCH] Login, Reegister and Contribute page done by suren --- ng8-seed/src/app/app.module.ts | 15 +- .../contribute/contribute.component.html | 253 ++++++++---------- .../contribute/contribute.component.scss | 16 +- .../contribute/contribute.component.ts | 204 +++++++++----- .../src/app/dashboard/dashboard.module.ts | 5 +- .../app/session/login/login-component.html | 8 +- .../src/app/session/login/login.component.ts | 56 +++- .../session/register/register-component.html | 31 ++- .../session/register/register.component.ts | 44 ++- ng8-seed/src/app/session/session.module.ts | 3 +- ng8-seed/src/app/shared/api.service.spec.ts | 12 + ng8-seed/src/app/shared/api.service.ts | 119 ++++++++ .../shared/guards/auth-guard.service.spec.ts | 12 + .../app/shared/guards/auth-guard.service.ts | 22 ++ .../guards/token-interceptor.service.spec.ts | 12 + .../guards/token-interceptor.service.ts | 58 ++++ ng8-seed/src/environments/environment.prod.ts | 3 +- ng8-seed/src/environments/environment.ts | 3 +- 18 files changed, 632 insertions(+), 244 deletions(-) create mode 100644 ng8-seed/src/app/shared/api.service.spec.ts create mode 100644 ng8-seed/src/app/shared/api.service.ts create mode 100644 ng8-seed/src/app/shared/guards/auth-guard.service.spec.ts create mode 100644 ng8-seed/src/app/shared/guards/auth-guard.service.ts create mode 100644 ng8-seed/src/app/shared/guards/token-interceptor.service.spec.ts create mode 100644 ng8-seed/src/app/shared/guards/token-interceptor.service.ts diff --git a/ng8-seed/src/app/app.module.ts b/ng8-seed/src/app/app.module.ts index 19de29a..3cb7caf 100644 --- a/ng8-seed/src/app/app.module.ts +++ b/ng8-seed/src/app/app.module.ts @@ -2,9 +2,9 @@ import { BrowserModule } from '@angular/platform-browser'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { RouterModule } from '@angular/router'; import { NgModule } from '@angular/core'; -import { FormsModule } from '@angular/forms'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; // import { HttpModule, Http } from '@angular/'; -import { HttpClientModule, HttpClient} from '@angular/common/http'; +import { HttpClientModule, HttpClient, HTTP_INTERCEPTORS} from '@angular/common/http'; import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar'; import { PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar'; @@ -46,6 +46,9 @@ import { ProjectsComponent } from './components/projects/projects.component'; import { PaymentComponent } from './components/payment/payment.component'; import { PaymentConfirmationComponent } from './components/payment-confirmation/payment-confirmation.component'; import { MyAccountComponent } from './components/my-account/my-account.component'; +import { TokenInterceptorService } from './shared/guards/token-interceptor.service'; +import { AuthGuardService } from './shared/guards/auth-guard.service'; +import { MatTableDataSource, MatTableModule } from '@angular/material'; // import { AddEventModule } from './add-event.module'; export function HttpLoaderFactory(http: HttpClient) { @@ -86,6 +89,7 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = { MatListModule, MatMenuModule, MatToolbarModule, + ReactiveFormsModule, MatTabsModule, NgxDatatableModule, MatCheckboxModule, @@ -93,6 +97,7 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = { SlickCarouselModule, MatSelectModule, MatCardModule, + MatTableModule, DemoMaterialModule, HttpClientModule, TranslateModule.forRoot({ @@ -112,7 +117,11 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = { { provide: PERFECT_SCROLLBAR_CONFIG, useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG - } + },{ + provide:HTTP_INTERCEPTORS, + useClass: TokenInterceptorService, + multi: true + },AuthGuardService, ], entryComponents: [], bootstrap: [AppComponent] diff --git a/ng8-seed/src/app/components/contribute/contribute.component.html b/ng8-seed/src/app/components/contribute/contribute.component.html index 3f984ab..2287dec 100644 --- a/ng8-seed/src/app/components/contribute/contribute.component.html +++ b/ng8-seed/src/app/components/contribute/contribute.component.html @@ -2,163 +2,134 @@
- -
Be a Champion of Change
+ +
Be a Champion of Change
-
-
+ +
- - - {{ item.value }} + + + {{ item.district_name }} - - - {{ item.value }} + + + {{ item.school_name }} - - - {{ item.value }} + + + {{ item.cat_name }} -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 RequirementQuantitySponsor
- - Student Benches required at Govt Girls School, Panruti, Villupuram Dt. - 30 - -
- -
-
- - - Desktop Computers require for GGHSS,Palacode - 15 - -
- -
-
- - - Smartboard required for CPS Kannammapey - 5 - -
- -
-
- - - R.O Purifier required for 500 students in GHS, Periamedu - 2 - -
- -
-
-
- - -
- - - + + + + {{ item.material_name }} + + + +
+
+
+ +
+
+ + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ImageSchool ImgDescription{{row.material_name}} required at {{row.school_name}}, {{row.block_name}} Block, {{row.district_name}} District. Requirement Qty {{row.qty}} Sponsor Cost Per Unit {{row.cost_per_unit === null?0:row.cost_per_unit}} Total {{Total[i]}}
+
+
+ + + + + +
Total ₹{{somethingChanged()}}
+
+
+ + +
+ + +
+
+ + - +
Or Contribute to General Development Fund
diff --git a/ng8-seed/src/app/components/contribute/contribute.component.scss b/ng8-seed/src/app/components/contribute/contribute.component.scss index 3922a08..86f7c8c 100644 --- a/ng8-seed/src/app/components/contribute/contribute.component.scss +++ b/ng8-seed/src/app/components/contribute/contribute.component.scss @@ -1,4 +1,18 @@ - +.calculated-shipping[_ngcontent-gen-c13]{ + padding: 0px !important; +} + table { + width: 100%; + } + + .mat-form-field { + font-size: 14px; + width: 100%; + } + + td, th { + width: 25%; + } table.shop-table { // border-collapse: separate; border-spacing: 0; diff --git a/ng8-seed/src/app/components/contribute/contribute.component.ts b/ng8-seed/src/app/components/contribute/contribute.component.ts index 40ae12e..adb285d 100644 --- a/ng8-seed/src/app/components/contribute/contribute.component.ts +++ b/ng8-seed/src/app/components/contribute/contribute.component.ts @@ -1,4 +1,10 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { environment } from '../../../environments/environment'; +import { ApiService } from '../../shared/api.service'; +import { FormGroup, FormBuilder, FormControl, Validators, } from '@angular/forms'; +import { MatTableDataSource, MatPaginator, MatSort } from '@angular/material'; + + @Component({ selector: 'app-contribute', @@ -6,87 +12,143 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./contribute.component.scss'] }) export class ContributeComponent implements OnInit { - isRequired = false; - isDisabled = false; - currentDrink: string; - drinks = [{ - value: 'coke-0', - viewValue: 'Coke' - }, { - value: 'sprite-1', - viewValue: 'Sprite' - }, { - value: 'water-2', - viewValue: 'Water' - }, { - value: 'pepper-3', - viewValue: 'Dr. Pepper' - }, { - value: 'coffee-4', - viewValue: 'Coffee' - }, { - value: 'tea-5', - viewValue: 'Tea' - }, { - value: 'juice-6', - viewValue: 'Orange juice' - }, { - value: 'wine-7', - viewValue: 'Wine' - }, { - value: 'milk-8', - viewValue: 'Milk' - }]; - districtList=[{ - id:"1", - value:"Chennai" - },{ - id:"2", - value:"Vellore" - },{ - id:"3", - value:"Thiruvannamalai" - },{ - id:"4", - value:"Kanchipuram" - },{ - id:"5", - value:"Nagapattinam" - },] - schoolList=[{ - id:"1", - value:"Govt High School" - }, - { - id:"2", - value:"Govt Primary School" - }] - categoryList=[{ - id:"1", - value:"Building" - }, - { - id:"2", - value:"Furnitures" - }, - { - id:"2", - value:"Students kit" - }] - constructor() { } + displayedColumns: string[] = ['Image', 'Description', 'Requirement Qty', 'Sponsor', 'Cost Per Unit', 'Total']; + dataSource:any = new MatTableDataSource(); + dataLength :number; + @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator; + @ViewChild(MatSort, {static: true}) sort: MatSort; + pageSize = 5; + Contribute: FormGroup; + material_category: any = []; + district: any = []; + school: any = []; + category: any = []; + Total: any = []; - ngOnInit() { + constructor(public restApi:ApiService,public fb:FormBuilder) { + // Create 100 users + + } + + // ngOnInit() { + // this.dataSource.paginator = this.paginator; + // this.dataSource.sort = this.sort; + // } + + + + applyFilter(filterValue: string) { + this.dataSource.filter = filterValue.trim().toLowerCase(); + + if (this.dataSource.paginator) { + this.dataSource.paginator.firstPage(); + } + } + ngOnInit() { + + // this.getSchoolReqList(); + this.initForm(); + this.getSchoolReqList(); + this.getSchoolReqList2(); } + + initForm() + { + this.Contribute = this.fb.group( + { + schoold_id: new FormControl(''), + district_id: new FormControl(''), + cad_id: new FormControl(''), + mat_id: new FormControl('') + }) + } + + getSchoolReqList() + { + + let url = `${environment.apiUrl}${'getSchoolReqList'}`; + let data = this.Contribute.value; + this.restApi.post(url,data).subscribe(schDet=> + { + if(schDet.dataStatus==true) + { + this.dataLength = schDet.records.length; + this.dataSource.data = schDet.records; + + // console.log(this.material_category); + // this.dataSource.data = schDet.records.map((val, i)=>{ + // val['SerialNo'] = i + 2; + // return val; + // }) + // console.log(this.dataSource.data); + } + }) + } + somethingChanged(e,i,item){ + // console.log(e,i,item); + this.Total[i] = e*item; + // console.log(this.Total); + return ( this.Total.reduce((acc, value) => acc + value, 0)); + } + + + getSchoolReqList2() + { + + let url = `${environment.apiUrl}${'getSchoolReqList'}`; + let data = this.Contribute.value; + this.restApi.post(url,data).subscribe(schDet=> + { + if(schDet.dataStatus==true) + { + this.material_category = schDet.records.map(item=>({mat_id:item.mat_id,material_name:item.material_name})); + this.material_category = this.material_category.filter((test, index, array) => + index === array.findIndex((findTest) => + findTest.material_name === test.material_name + ) + ); + + this.district = schDet.records.map(item=>({district_id:item.district_id,district_name:item.district_name})); + this.district = this.district.filter((test, index, array) => + index === array.findIndex((findTest) => + findTest.district_name === test.district_name + ) + ); + + this.school = schDet.records.map(item=>({school_id:item.school_id,school_name:item.school_name})); + this.school = this.school.filter((test, index, array) => + index === array.findIndex((findTest) => + findTest.school_name === test.school_name + ) + ); + + this.category = schDet.records.map(item=>({cad_id:item.cad_id,cat_name:item.cat_name})); + this.category = this.category.filter((test, index, array) => + index === array.findIndex((findTest) => + findTest.cat_name === test.cat_name + ) + ); + + // console.log('mat'+JSON.stringify(this.material_category )); + // console.log('dis'+JSON.stringify(this.district )); + // console.log('sch'+JSON.stringify(this.school )); + } + }) + // console.log('mat'+this.material_category); + } ngAfterViewInit() { // Hack: Scrolls to top of Page after page view initialized let top = document.getElementById('top'); - console.log("d",top); + // console.log("d",top); if (top !== null) { top.scrollIntoView(); top = null; } + this.dataSource.paginator = this.paginator; + this.dataSource.sort = this.sort; } } + diff --git a/ng8-seed/src/app/dashboard/dashboard.module.ts b/ng8-seed/src/app/dashboard/dashboard.module.ts index dfa3c3e..71aabfa 100644 --- a/ng8-seed/src/app/dashboard/dashboard.module.ts +++ b/ng8-seed/src/app/dashboard/dashboard.module.ts @@ -1,7 +1,7 @@ import { NgModule } from '@angular/core'; import { RouterModule } from '@angular/router'; import { CommonModule } from '@angular/common'; -import { MatIconModule, MatCardModule, MatButtonModule, MatListModule, MatProgressBarModule, MatMenuModule, MatFormField, MatFormFieldModule, MatInputModule, MatButtonToggleModule, MatTabsModule,MatSelectModule, MatRadioModule } from '@angular/material'; +import { MatIconModule, MatCardModule, MatButtonModule, MatListModule, MatProgressBarModule, MatMenuModule, MatFormField, MatFormFieldModule, MatInputModule, MatButtonToggleModule, MatTabsModule,MatSelectModule, MatRadioModule, MatTableDataSource, MatTableModule } from '@angular/material'; import { FlexLayoutModule } from '@angular/flex-layout'; import { ChartsModule } from 'ng2-charts/ng2-charts'; @@ -18,12 +18,14 @@ import { ProjectDetailComponent } from 'app/components/project-detail/project-de import {FooterComponent} from 'app/components/footer/footer.component' import { SlickCarouselModule } from 'ngx-slick-carousel'; + @NgModule({ imports: [ CommonModule, RouterModule.forChild(DashboardRoutes), MatIconModule, MatCardModule, + ReactiveFormsModule, MatButtonModule, MatListModule, MatProgressBarModule, @@ -32,6 +34,7 @@ import { SlickCarouselModule } from 'ngx-slick-carousel'; MatRadioModule, SlickCarouselModule, ChartsModule, + MatTableModule, // NgxChartsModule, NgxDatatableModule, FlexLayoutModule, diff --git a/ng8-seed/src/app/session/login/login-component.html b/ng8-seed/src/app/session/login/login-component.html index 37fb00d..299a14a 100644 --- a/ng8-seed/src/app/session/login/login-component.html +++ b/ng8-seed/src/app/session/login/login-component.html @@ -6,15 +6,15 @@

Login Form

Enter Your Login Details

-
+
- + - + - +

Forgot password?

Don't have an account? Register Here

diff --git a/ng8-seed/src/app/session/login/login.component.ts b/ng8-seed/src/app/session/login/login.component.ts index c0d35f0..2743127 100644 --- a/ng8-seed/src/app/session/login/login.component.ts +++ b/ng8-seed/src/app/session/login/login.component.ts @@ -1,5 +1,8 @@ import { Component, OnInit ,ViewEncapsulation } from '@angular/core'; import {Router} from "@angular/router"; +import { FormControl, FormBuilder } from '@angular/forms'; +import { environment } from 'environments/environment'; +import { ApiService } from 'app/shared/api.service'; @Component({ selector: 'ms-login-session', @@ -11,11 +14,58 @@ export class LoginComponent { email: string; password: string; + loginForm: any; - constructor( - private router: Router - ) { } + constructor(public restApi:ApiService,public fb:FormBuilder,public router:Router) { } + ngOnInit() { + // this.getSchoolReqList(); + this.initForm(); + } + + + initForm() + { + this.loginForm = this.fb.group( + { + email: new FormControl(''), + password: new FormControl(''), + + }) + } + + csrUserLogin() + { + // console.log(this.loginForm.value);return false; + let url = `${environment.apiUrl}${'csrUserLogin'}`; + let data = this.loginForm.value; + this.restApi.post(url,data).subscribe(schDet=> + { + // this.load.loadedDismiss(); + // console.log(schDet);return false; + + // if(schDet.dataStatus==true) + // { + // this.setTokenData(schDet.records); + + this.restApi.setToken(schDet.token); + this.router.navigate(['/home']); + // window.localStorage.setItem('token','abcd'); + // }else + // { + // // this.toast.apptoast(res.message,'danger'); + // window.localStorage.clear(); + // return false; + // } + }) + } + + + + + // setTokenData(records: any) { + // throw new Error("Method not implemented."); + // } login() { this.router.navigate(['/']); } diff --git a/ng8-seed/src/app/session/register/register-component.html b/ng8-seed/src/app/session/register/register-component.html index 6a14c59..b429fa2 100644 --- a/ng8-seed/src/app/session/register/register-component.html +++ b/ng8-seed/src/app/session/register/register-component.html @@ -7,40 +7,43 @@

Register as a new user

We would need some of your information to facilitate your contributions and keep you updated on the progress of the projects or new projects

- +
- + - + - + -
+ + + +
-
+
- + - + - + - +