completed NFC for CS Mohemm
parent
3e6e2a9353
commit
b7fc960ce7
@ -0,0 +1,43 @@
|
|||||||
|
<app-generic-header
|
||||||
|
showBack="true"
|
||||||
|
backLink="/home"
|
||||||
|
[headerText]="'general,option-attendance' | translate">
|
||||||
|
</app-generic-header>
|
||||||
|
|
||||||
|
<ion-content>
|
||||||
|
<ion-grid *ngIf="!nfcIOSSuccess" class="attendance-grid">
|
||||||
|
<ion-row>
|
||||||
|
<ion-col size='12' class="nfc-clock">
|
||||||
|
<img src="../assets/imgs/nfc_clock.png" />
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
<ion-row>
|
||||||
|
<ion-col padding>
|
||||||
|
<h4>{{'general, select-attendance' | translate}}</h4>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
<ion-row padding>
|
||||||
|
<ion-col
|
||||||
|
size='5'
|
||||||
|
[ngClass]="{'margin-col': direction === 'en', 'disable-attendance': !serviceEnableNFC }"
|
||||||
|
class='buttonStyle'>
|
||||||
|
<div class="textAndIcon" (click)="checkNFCStatus('two')">
|
||||||
|
<img src="../assets/imgs/nfc_icon.png" />
|
||||||
|
<p>{{'general, nfc-text' | translate}}</p>
|
||||||
|
</div>
|
||||||
|
</ion-col>
|
||||||
|
<ion-col
|
||||||
|
[ngClass]="{'margin-col-right': direction === 'ar', 'disable-attendance': !serviceEnableQR }"
|
||||||
|
size='5' offset='1'
|
||||||
|
class='buttonStyle'>
|
||||||
|
<div class="textAndIcon" (click)="startQRCode()">
|
||||||
|
<img src="../assets/imgs/nfc_QR.png" />
|
||||||
|
<p>{{'general, qr-text' | translate}}</p>
|
||||||
|
</div>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
</ion-grid>
|
||||||
|
<div *ngIf="nfcIOSSuccess" style="display: block; text-align: center;margin-top: 50%;">
|
||||||
|
<img src="../assets/imgs/check.png" />
|
||||||
|
</div>
|
||||||
|
</ion-content>
|
||||||
@ -0,0 +1,29 @@
|
|||||||
|
.attendance-grid {
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.nfc-clock {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 50px;
|
||||||
|
}
|
||||||
|
.buttonStyle{
|
||||||
|
border: 1px solid black;
|
||||||
|
border-radius: 16px;
|
||||||
|
height: 120px;
|
||||||
|
text-align: -webkit-center;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.margin-col {
|
||||||
|
margin-right: 15px !important;
|
||||||
|
}
|
||||||
|
.margin-col-right {
|
||||||
|
margin-right: 25px !important ;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textAndIcon{
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
.disable-attendance {
|
||||||
|
opacity: .2;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { AttendanceOptionsComponent } from './attendance-options.component';
|
||||||
|
|
||||||
|
describe('AttendanceOptionsComponent', () => {
|
||||||
|
let component: AttendanceOptionsComponent;
|
||||||
|
let fixture: ComponentFixture<AttendanceOptionsComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ AttendanceOptionsComponent ],
|
||||||
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(AttendanceOptionsComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
<ion-content>
|
||||||
|
<div style="display: block; text-align: center;">
|
||||||
|
<p *ngIf="!gifStatus" style="font-size: 20px;">Detecting NFC for marking attendance</p>
|
||||||
|
<p *ngIf="gifStatus" style="font-size: 20px;">Swipe Attendance Done!</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="!gifStatus" style="display: block; text-align: center;margin-top: -50px;">
|
||||||
|
<img src="../assets/imgs/rippleNFC.gif" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="gifStatus" style="display: block; text-align: center;margin-top: 25%;">
|
||||||
|
<img src="../assets/imgs/check.png" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</ion-content>
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { NfcModalComponent } from './nfc-modal.component';
|
||||||
|
|
||||||
|
describe('NfcModalComponent', () => {
|
||||||
|
let component: NfcModalComponent;
|
||||||
|
let fixture: ComponentFixture<NfcModalComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ NfcModalComponent ],
|
||||||
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(NfcModalComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 442 KiB |
Loading…
Reference in New Issue