-
Notifications
You must be signed in to change notification settings - Fork 1
#3-Time clock find project #54
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from 10 commits
22b7119
e15d20c
c501044
56247f6
f4b586c
de4fbd6
75b33b3
ae78b3d
e2ac439
01696cf
7c8ca50
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,17 +1,7 @@ | ||
| <div class="parent"> | ||
|
|
||
| <app-create-project class="item" | ||
| [projectToEdit] = "project" | ||
| (savedProject)="updateProject($event)" | ||
| (cancelForm) = "cancelForm()" | ||
| > | ||
| </app-create-project> | ||
|
|
||
| <app-project-list class="item" | ||
| [projects] = "projects" | ||
| (editProject) = "editProject($event)" | ||
| (deleteProject) = "deleteProject($event)" | ||
| > | ||
| </app-project-list> | ||
| </div> | ||
| <app-create-project class="item" [projectToEdit]="project" (savedProject)="updateProject($event)" (cancelForm)="cancelForm()"> | ||
| </app-create-project> | ||
|
|
||
| <app-project-list class="item" [projects]="projects" (editProject)="editProject($event)" (deleteProject)="deleteProject($event)"> | ||
| </app-project-list> | ||
| </div> | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,89 +1,79 @@ | ||
| <div class="text-center mt-3"> | ||
|
|
||
| <div *ngIf="showAlertEnterTecnology" class="alert alert-danger" role="alert"> | ||
| Field technology is requiered. Enter this field for clock out. | ||
| </div> | ||
|
|
||
| <div class="card"> | ||
| <div class="card-header"> | ||
| <div class="row"> | ||
| <div class="col-2 text-left"> | ||
| <strong>Time clock</strong> | ||
| </div> | ||
| <div class="col-10 text-right"> | ||
| <i class="far fa-question-circle"></i> | ||
| <div class="text-center mt-5"> | ||
| <div class="card"> | ||
|
||
| <div class="card-header"> | ||
| <div class="row"> | ||
| <div class="col-2 text-left"> | ||
| <strong>Time clock</strong> | ||
| </div> | ||
| <div class="col-10 text-right"> | ||
| <i class="far fa-question-circle"></i> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="card-body"> | ||
| <p *ngIf="!isClockIn" class="card-title text-left"><strong>{{ username }}</strong> clocked <strong class="text-success">in</strong> at <strong>{{ hour | number: '2.0-2' }}:{{ minute | number: '2.0-2' }}:{{ seconds | number: '2.0-2' }}</strong></p> | ||
| <p *ngIf="isClockIn" class="card-title text-left"><strong>{{ username }}</strong> clocked <strong class="text-danger">out</strong> at <strong>{{ hour | number: '2.0-2' }}:{{ minute | number: '2.0-2' }}:{{ seconds | number: '2.0-2' }}</strong></p> | ||
| <h6 class="text-left"><strong>Totals</strong></h6> | ||
| <hr> | ||
| <div class="row"> | ||
| <div class="col-4"> | ||
| <h6>Current</h6> | ||
| <h3>{{ hour | number: '2.0-2' }}:{{ minute | number: '2.0-2' }}:{{ seconds | number: '2.0-2' }}</h3> | ||
| </div> | ||
| <div class="col-4"> | ||
| <h6>Day</h6> | ||
| <h3>4:22</h3> | ||
| </div> | ||
| <div class="col-4"> | ||
| <h6>Week</h6> | ||
| <h3>14:00</h3> | ||
| </div> | ||
| </div> | ||
| <h6 class="text-left"><strong>Projects</strong></h6> | ||
| <form> | ||
| <div class="form-group"> | ||
| <input type="text" class="form-control" id="formGroupExampleInput" placeholder=" Search project" | ||
| style="font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, FontAwesome"> | ||
| </div> | ||
| </form> | ||
| <p class="text-left"><i class="fas fa-folder"></i><strong> Top</strong></p> | ||
| <ul class="list-group"> | ||
| <app-project-list-hover [projects]="projects" (showFields)="setShowFields($event)"></app-project-list-hover> | ||
| </ul> | ||
| <br> | ||
| <form *ngIf="!isClockIn || showFields"> | ||
| <div class="form-group row"> | ||
| <label for="inputActivity" class="col-sm-2 col-form-label text-center"><strong>Activity</strong></label> | ||
| <div class="col-sm-10"> | ||
| <input type="text" class="form-control"> | ||
| </div> | ||
| </div> | ||
| <div class="form-group row"> | ||
| <label for="inputJiraTicket" class="col-sm-2 col-form-label text-center"><strong>Jira Ticket</strong></label> | ||
| <div class="col-sm-10"> | ||
| <input type="text" class="form-control"> | ||
| </div> | ||
| </div> | ||
| <div class="form-group row"> | ||
| <label for="inputTechnology" class="col-sm-2 col-form-label text-center"><strong>Technology</strong></label> | ||
| <div class="col-sm-10"> | ||
| <input #data type="text" (keyup)="enterTechnology(data.value)" class="form-control"> | ||
| </div> | ||
| </div> | ||
| </form> | ||
| <hr> | ||
| <div class="container"> | ||
| <div class="row"> | ||
| <div class="col text-left"> | ||
| <button class="btn btn-light btn-sm dropdown-toggle" type="button" data-toggle="dropdown" | ||
| aria-haspopup="true" aria-expanded="false"> | ||
| Options | ||
| </button> | ||
| </div> | ||
| <div class="col text-right"> | ||
| <button *ngIf="isClockIn" class="btn btn-success btn-sm" type="button" (click)="employeClockIn()">Clock | ||
| In</button> | ||
| <button *ngIf="!isClockIn" class="btn btn-danger btn-sm" type="button" (click)="employeClockOut()">Clock | ||
| Out</button> | ||
| </div> | ||
| <div class="card-body"> | ||
| <p *ngIf="!isClockIn" class="card-title text-left"><strong>{{ username }}</strong> clocked <strong class="text-success">in</strong> at <strong>{{ hour | number: '2.0-2' }}:{{ minute | number: '2.0-2' }}:{{ seconds | number: '2.0-2' }}</strong></p> | ||
| <p *ngIf="isClockIn" class="card-title text-left"><strong>{{ username }}</strong> clocked <strong class="text-danger">out</strong> at <strong>{{ hour | number: '2.0-2' }}:{{ minute | number: '2.0-2' }}:{{ seconds | number: '2.0-2' }}</strong></p> | ||
| <h6 class="text-left"><strong>Totals</strong></h6> | ||
| <hr> | ||
| <div class="row"> | ||
| <div class="col-4"> | ||
| <h6>Current</h6> | ||
| <h3>{{ hourCounterRealTime | number: '2.0-2' }}:{{ minuteCounterRealTime | number: '2.0-2' }}:{{ secondsCounterRealTime | number: '2.0-2' }}</h3> | ||
| </div> | ||
| <div class="col-4"> | ||
| <h6>Day</h6> | ||
| <h3>00:00</h3> | ||
| </div> | ||
| <div class="col-4"> | ||
| <h6>Week</h6> | ||
| <h3>00:00</h3> | ||
| </div> | ||
| </div> | ||
| <h6 class="text-left"><strong>Projects</strong></h6> | ||
| <p class="text-left"><i class="fas fa-folder"></i><strong> Top</strong></p> | ||
| <ul class="list-group"> | ||
| <app-project-list-hover [projects]="projects" (showFields)="setShowFields($event)"></app-project-list-hover> | ||
| </ul> | ||
| <br> | ||
| <form *ngIf="(!isClockIn || showFields) && !isHidenForm"> | ||
| <div class="form-group row"> | ||
| <label for="inputActivity" class="col-sm-2 col-form-label text-center"><strong>Activity</strong></label> | ||
| <div class="col-sm-10"> | ||
| <input type="text" class="form-control"> | ||
| </div> | ||
| </div> | ||
| <div class="form-group row"> | ||
| <label for="inputJiraTicket" class="col-sm-2 col-form-label text-center"><strong>Jira Ticket</strong></label> | ||
| <div class="col-sm-10"> | ||
| <input type="text" class="form-control"> | ||
| </div> | ||
| </div> | ||
| <div class="form-group row"> | ||
| <label for="inputTechnology" class="col-sm-2 col-form-label text-center"><strong>Technology</strong></label> | ||
| <div class="col-sm-10"> | ||
| <input *ngIf="!showAlertEnterTecnology" #data type="text" (keyup)="enterTechnology(data.value)" class="form-control"> | ||
| <input *ngIf="showAlertEnterTecnology" #data type="text" (keyup)="enterTechnology(data.value)" class="form-control border-danger"> | ||
| <div> | ||
| <h6 *ngIf="showAlertEnterTecnology" class="text-danger text-left">Technology field is required. Enter this field to clock out.</h6> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </form> | ||
| <hr> | ||
| <div class="container"> | ||
| <div class="row"> | ||
| <div class="col text-left" id="optionsContainer"> | ||
| <button class="btn btn-light btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | ||
| Options | ||
| </button> | ||
| </div> | ||
| <div class="col text-right" id="clockInOutContainer"> | ||
| <button *ngIf="isClockIn" class="btn btn-success btn-sm" type="button" (click)="employeClockIn()">Clock In</button> | ||
| <button *ngIf="!isClockIn" class="btn btn-danger btn-sm" type="button" (click)="employeClockOut()">Clock Out</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -3,6 +3,7 @@ import { By } from '@angular/platform-browser'; | |
| import { DebugElement, Component } from '@angular/core'; | ||
| import { TimeClockComponent } from './time-clock.component'; | ||
| import { ProjectListHoverComponent } from '../../shared/project-list-hover/project-list-hover.component'; | ||
| import { FilterProjectPipe } from 'src/app/components/shared/pipes/filter-project/filter-project.pipe'; | ||
|
|
||
| describe('TimeClockComponent', () => { | ||
| let component: TimeClockComponent; | ||
|
|
@@ -11,7 +12,7 @@ describe('TimeClockComponent', () => { | |
|
|
||
| beforeEach(async(() => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [TimeClockComponent, ProjectListHoverComponent] | ||
| declarations: [TimeClockComponent, ProjectListHoverComponent, FilterProjectPipe] | ||
| }).compileComponents(); | ||
| })); | ||
|
|
||
|
|
@@ -197,6 +198,13 @@ describe('TimeClockComponent', () => { | |
| expect(component.secondsCounterRealTime).not.toEqual(0); | ||
| }); | ||
|
|
||
| it('inside timer first if' , () => { | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I don't understand what this test is doing? |
||
| component.secondsCounterRealTime = component.secondsCounterRealTime + 58; | ||
| component.timer(); | ||
| expect(component.minuteCounterRealTime).toEqual(1); | ||
| expect(component.secondsCounterRealTime).toEqual(0); | ||
| }); | ||
|
|
||
| /* ---------------------- ARRIVALS ------------------------------------- */ | ||
| it('should execute intern methods of arrivals' , () => { | ||
| const currentDate = new Date(); | ||
|
|
||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -99,8 +99,9 @@ export class TimeClockComponent implements OnInit { | |
| timer() { | ||
| this.secondsCounterRealTime += 1; | ||
| if ( this.secondsCounterRealTime === 59 ) { | ||
| this.minuteCounterRealTime += 1; | ||
| this.secondsCounterRealTime = 0; | ||
| console.log('entroooo'); | ||
|
||
| this.minuteCounterRealTime += 1; //1 | ||
| this.secondsCounterRealTime = 0; //0 | ||
| if ( this.minuteCounterRealTime === 59 ) { | ||
| this.hourCounterRealTime += 1; | ||
| this.minuteCounterRealTime = 0; | ||
|
|
||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -45,4 +45,18 @@ describe('ClockComponent', () => { | |
| expect(component.showClock).toHaveBeenCalled(); | ||
| }); | ||
|
|
||
| it('should be verify the init state of vars' , () => { | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. what are you testing here? |
||
| expect(component.hour).toEqual(0); | ||
| expect(component.minutes).toEqual(0); | ||
| expect(component.seconds).toEqual(0); | ||
| expect(component.displayTime).toBeFalsy(); | ||
| }); | ||
|
|
||
| it('should enter if and assign the value to vars' , () => { | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. what are you testing here? |
||
| component.showClock(); | ||
| expect(component.hour).toEqual(0); | ||
| expect(component.minutes).toEqual(0); | ||
| expect(component.seconds).toEqual(0); | ||
| }); | ||
|
|
||
| }); | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| import { FilterProjectPipe } from './filter-project.pipe'; | ||
| import { Project } from '../../../../interfaces/project'; | ||
|
|
||
| describe('FilterProjectPipe', () => { | ||
| it('create an instance', () => { | ||
| const pipe = new FilterProjectPipe(); | ||
| expect(pipe).toBeTruthy(); | ||
| }); | ||
|
|
||
| it('test method of pipe', () => { | ||
| expect(new FilterProjectPipe().transform([] , '')).toEqual([]); | ||
| }); | ||
|
|
||
| }); |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| import { Pipe, PipeTransform } from '@angular/core'; | ||
| import { Project } from 'src/app/interfaces'; | ||
|
|
||
| @Pipe({ | ||
| name: 'filterProject' | ||
| }) | ||
| export class FilterProjectPipe implements PipeTransform { | ||
|
|
||
| transform(value: Project[] = [], arg: string): string[] { | ||
|
|
||
| const restultProjects = []; | ||
| // tslint:disable-next-line: prefer-for-of | ||
| for ( let i = 0; i < value.length; i++ ) { | ||
| if ( value[i].name.toLowerCase().indexOf(arg.toLowerCase()) > -1 ) { | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This if statement should be tested since this is the logic we want to make sure it's working. |
||
| restultProjects.push(value[i]); | ||
| } | ||
| } | ||
| return restultProjects; | ||
| } | ||
| } | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,17 +1,9 @@ | ||
| <app-search-project (changeFilterProject)="filterProjects = $event"></app-search-project> | ||
| <ul class="list-group content-projects"> | ||
| <li | ||
| class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" | ||
| *ngFor="let item of projects; let i = index" | ||
| (mouseenter)="showButton = i" | ||
| (mouseleave)="showButton = -1" | ||
| (click)="clockIn(item.id)" | ||
| [ngClass]="{ active: selectedId === item.id }" | ||
| > | ||
| {{ item.name }} | ||
| <span | ||
| *ngIf="showButton === i && selectedId !== item.id" | ||
| class="badge badge-light" | ||
| >Clock In</span | ||
| <li class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" *ngFor="let item of projects | filterProject:filterProjects; let i = index" (mouseenter)="showButton = i" (mouseleave)="showButton = -1" (click)="clockIn(item.id)" | ||
|
||
| [ngClass]="{ active: selectedId === item.id }"> | ||
| {{ item.name }} | ||
| <span *ngIf="showButton === i && selectedId !== item.id" class="badge badge-light">Clock In</span | ||
| > | ||
| </li> | ||
| </ul> | ||
| </ul> | ||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
please, fix the indentation, remember that we are using an indentation based in 2 spaces.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done