Skip to content

Commit

Permalink
Merge pull request #8102 from ever-co/add-dropdown-raisons
Browse files Browse the repository at this point in the history 
[Feat] Added Reason Drop-down for Manual Time
  • Loading branch information
@rahul-rocket
rahul-rocket authored Aug 27, 2024
2 parents e7704ac + e73c4be commit 7c1b4e3
Show file tree
Hide file tree
Showing 4 changed files with 65 additions and 142 deletions.
3 changes: 2 additions & 1 deletion .cspell.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -514,7 +514,8 @@
"flexbox",
"nbinput",
"nbbutton",
"xaxis"
"xaxis",
"wdth"
],
"useGitignore": true,
"ignorePaths": [
Expand Down
192 changes: 52 additions & 140 deletions ...s/ui-core/shared/src/lib/timesheet/edit-time-log-modal/edit-time-log-modal.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,16 @@
<form #f="ngForm" *ngIf="form" [formGroup]="form" (submit)="addTime()">
<nb-card>
<nb-card-header class="header">
<span class="cancel">
<i class="fas fa-times" (click)="close()"></i
></span>
<span class="cancel"> <i class="fas fa-times" (click)="close()"></i></span>
<div class="row">
<div class="col title">
{{
(mode == 'update'
? 'TIMESHEET.EDIT_TIME_LOGS'
: 'TIMESHEET.ADD_TIME_LOGS'
) | translate
}}
{{ (mode == 'update' ? 'TIMESHEET.EDIT_TIME_LOGS' : 'TIMESHEET.ADD_TIME_LOGS') | translate }}
</div>
</div>
</nb-card-header>
<nb-card-body>
<div
class="form-group"
*ngxPermissionsOnly="[PermissionsEnum.CHANGE_SELECTED_EMPLOYEE]"
>
<div
class="description col-6"
*ngIf="mode == 'update'; else employeeSelect"
>
<div class="form-group" *ngxPermissionsOnly="[PermissionsEnum.CHANGE_SELECTED_EMPLOYEE]">
<div class="description col-6" *ngIf="mode == 'update'; else employeeSelect">
<ngx-avatar
[id]="timeLog?.employee?.id"
[name]="timeLog?.employee?.user?.name"
Expand All @@ -37,18 +24,13 @@
name="employeeId"
[multiple]="false"
label="TIMESHEET.SELECT_EMPLOYEE"
[placeholder]="
'TIMESHEET.SELECT_EMPLOYEE' | translate
"
[placeholder]="'TIMESHEET.SELECT_EMPLOYEE' | translate"
formControlName="employeeId"
required
>
</ga-employee-multi-select>
</div>
<div
*ngIf="form.get('employeeId')?.invalid && f.submitted"
class="invalid-feedback d-block"
>
<div *ngIf="form.get('employeeId')?.invalid && f.submitted" class="invalid-feedback d-block">
<div *ngIf="form.get('employeeId')?.errors.required">
{{ 'TIMESHEET.VALIDATION.EMPLOYEE' | translate }}
</div>
Expand All @@ -65,31 +47,22 @@
</ngx-timer-range-picker>
</div>
<div class="col-6 show-time" *ngIf="timeDiff">
<label>{{ 'FORM.LABELS.PERIOD'|translate }}</label>
<label>{{ 'FORM.LABELS.PERIOD' | translate }}</label>
<div>{{ timeDiff | durationFormat }}</div>
</div>
</div>
<div class="form-group">
<div class="col-12">
<nb-card
class="w-100 custom-card"
status="danger"
*ngIf="overlaps.length > 0"
>
<nb-card class="w-100 custom-card" status="danger" *ngIf="overlaps.length > 0">
<nb-card-header>
<div class="d-flex align-items-center">
<nb-icon
icon="alert-triangle-outline"
class="mr-3"
></nb-icon>
<nb-icon icon="alert-triangle-outline" class="mr-3"></nb-icon>
{{ 'TIMESHEET.TIME_OVERLAPS' | translate }}
</div>
</nb-card-header>
<nb-card-body class="custom-card-body">
<p>{{ 'TIMESHEET.OVERLAP_MESSAGE' | translate }}</p>
<div
class="row align-items-center m-0 custom-header"
>
<div class="row align-items-center m-0 custom-header">
<div class="col">
{{ 'TIMESHEET.PROJECT' | translate }} /
{{ 'TIMESHEET.TODO' | translate }}
Expand All @@ -107,46 +80,27 @@
*ngFor="let overlapTimeLog of overlaps"
>
<div class="col">
<span
*ngIf="
overlapTimeLog?.project;
else noProject
"
>
<span *ngIf="overlapTimeLog?.project; else noProject">
{{ overlapTimeLog?.project?.name }}
</span>
<ng-template #noProject>
<span>{{
'TIMESHEET.NO_PROJECT' | translate
}}</span>
<span>{{ 'TIMESHEET.NO_PROJECT' | translate }}</span>
</ng-template>
<div class="mt-2 small">
<span
*ngIf="
overlapTimeLog?.task;
else noToDo
"
>
<span *ngIf="overlapTimeLog?.task; else noToDo">
<strong
>{{
'TIMESHEET.TODO' | translate
}}
>{{ 'TIMESHEET.TODO' | translate }}
:
</strong>
{{ overlapTimeLog?.task?.title }}
</span>
<ng-template #noToDo>
<span>{{
'TIMESHEET.NO_TODO' | translate
}}</span>
<span>{{ 'TIMESHEET.NO_TODO' | translate }}</span>
</ng-template>
</div>
</div>
<div class="col text-center">
{{
overlapTimeLog.overlapDuration
| durationFormat
}}
{{ overlapTimeLog.overlapDuration | durationFormat }}
</div>
</div>
</nb-card-body>
Expand All @@ -156,72 +110,44 @@

<div class="form-group">
<div class="col-12">
<nb-checkbox
formControlName="isBillable"
name="isBillable"
status="primary"
>
<nb-checkbox formControlName="isBillable" name="isBillable" status="primary">
{{ 'TIMER_TRACKER.IS_BILLABLE' | translate }}
</nb-checkbox>
</div>
</div>
<div class="form-group">
<div class="col-12 d-flex">
<div class="mr-3">
<label>{{
'TIMER_TRACKER.SELECT_CLIENT' | translate
}}</label>
<label>{{ 'TIMER_TRACKER.SELECT_CLIENT' | translate }}</label>
<ga-contact-selector
[employeeId]="form.get('employeeId')?.value"
name="organizationContactId"
formControlName="organizationContactId"
[required]="organization?.requireClient"
></ga-contact-selector>
<div
*ngIf="
form.get('organizationContactId')?.invalid &&
f.submitted
"
*ngIf="form.get('organizationContactId')?.invalid && f.submitted"
class="invalid-feedback d-block"
>
<div
*ngIf="
form.get('organizationContactId')?.errors
.required
"
>
{{
'TIMER_TRACKER.VALIDATION.CLIENT_REQUIRED'
| translate
}}
<div *ngIf="form.get('organizationContactId')?.errors.required">
{{ 'TIMER_TRACKER.VALIDATION.CLIENT_REQUIRED' | translate }}
</div>
</div>
</div>
<div>
<label>{{
'TIMER_TRACKER.SELECT_PROJECT' | translate
}}</label>
<label>{{ 'TIMER_TRACKER.SELECT_PROJECT' | translate }}</label>
<ga-project-selector
name="projectId"
formControlName="projectId"
[skipGlobalChange]="true"
[showAllOption]="false"
[placeholder]="
'TIMER_TRACKER.SELECT_PROJECT' | translate
"
[placeholder]="'TIMER_TRACKER.SELECT_PROJECT' | translate"
[defaultSelected]="false"
[employeeId]="form.get('employeeId')?.value"
[organizationContactId]="
form.get('organizationContactId')?.value
"
[organizationContactId]="form.get('organizationContactId')?.value"
[required]="organization?.requireProject"
></ga-project-selector>
<div
*ngIf="
form.get('projectId')?.invalid && f.submitted
"
class="invalid-feedback d-block"
>
<div *ngIf="form.get('projectId')?.invalid && f.submitted" class="invalid-feedback d-block">
<div *ngIf="form.get('projectId')?.errors.required">
{{ 'TIMESHEET.VALIDATION.PROJECT' | translate }}
</div>
Expand All @@ -240,10 +166,7 @@
formControlName="taskId"
[required]="organization?.requireTask"
></ga-task-selector>
<div
*ngIf="form.get('taskId')?.invalid && f.submitted"
class="invalid-feedback d-block"
>
<div *ngIf="form.get('taskId')?.invalid && f.submitted" class="invalid-feedback d-block">
<div *ngIf="form.get('taskId').errors.required">
{{ 'TIMESHEET.VALIDATION.TASK' | translate }}
</div>
Expand All @@ -263,10 +186,7 @@
formControlName="description"
[required]="organization?.requireDescription"
></textarea>
<div
*ngIf="form.get('description')?.invalid && f.submitted"
class="invalid-feedback d-block"
>
<div *ngIf="form.get('description')?.invalid && f.submitted" class="invalid-feedback d-block">
<div *ngIf="form.get('description')?.errors.required">
{{ 'TIMESHEET.VALIDATION.DESCRIPTION' | translate }}
</div>
Expand All @@ -276,26 +196,31 @@
<div class="form-group">
<div class="col-12">
<label>{{ 'TIMESHEET.REASON' | translate }}</label>
<textarea
nbInput
class="form-control"
fullWidth
[placeholder]="'TIMESHEET.REASON' | translate"
name="reason"
formControlName="reason"
[required]="organization?.requireReason"
></textarea>
<nb-form-field fullWidth>
<input
fullWidth
nbInput
placeholder="{{ 'TIMESHEET.REASON' | translate }}"
name="reason"
formControlName="reason"
[nbAutocomplete]="auto"
[required]="organization?.requireReason"
/>
<nb-autocomplete #auto fullWidth>
<nb-option *ngFor="let reason of reasons" [value]="reason">
{{ reason }}
</nb-option>
</nb-autocomplete>
</nb-form-field>
</div>

<div
*ngIf="form.get('reason')?.invalid && f.submitted"
class="invalid-feedback d-block"
>
<div *ngIf="form.get('reason')?.errors.required">
{{ 'TIMESHEET.VALIDATION.REASON' | translate }}
</div>
<div *ngIf="form.get('reason')?.invalid && f.submitted" class="invalid-feedback d-block">
<div *ngIf="form.get('reason')?.errors.required">
{{ 'TIMESHEET.VALIDATION.REASON' | translate }}
</div>
</div>
</div>

<div class="form-group"></div>
</nb-card-body>
<nb-card-footer>
Expand All @@ -308,20 +233,10 @@
nbSpinnerStatus="primary"
>
<nb-icon icon="save-outline"></nb-icon>
{{
(mode == 'create'
? 'TIMESHEET.ADD_TIME'
: 'TIMESHEET.UPDATE_TIME'
) | translate
}}
{{ (mode == 'create' ? 'TIMESHEET.ADD_TIME' : 'TIMESHEET.UPDATE_TIME') | translate }}
</button>
<ng-template
[ngxPermissionsOnly]="PermissionsEnum.ALLOW_DELETE_TIME"
>
<ng-template
ngxTimeTrackingAuthorized
[permission]="PermissionsEnum.ALLOW_DELETE_TIME"
>
<ng-template [ngxPermissionsOnly]="PermissionsEnum.ALLOW_DELETE_TIME">
<ng-template ngxTimeTrackingAuthorized [permission]="PermissionsEnum.ALLOW_DELETE_TIME">
<button
type="button"
class="action ml-3"
Expand All @@ -335,10 +250,7 @@
*ngIf="mode === 'update'"
[nbTooltip]="'BUTTONS.DELETE' | translate"
>
<nb-icon
status="danger"
icon="trash-2-outline"
></nb-icon>
<nb-icon status="danger" icon="trash-2-outline"></nb-icon>
</button>
</ng-template>
</ng-template>
Expand Down
4 changes: 3 additions & 1 deletion ...ges/ui-core/shared/src/lib/timesheet/edit-time-log-modal/edit-time-log-modal.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,8 @@ export class EditTimeLogModalComponent implements OnInit, AfterViewInit, OnDestr
subject$: Subject<any> = new Subject();

changeSelectedEmployee: boolean;

reasons = ['Worked offline', 'Internet issue', 'Forgot to track', 'Usability issue', 'App issue'];
selectedReason: string = '';
private _timeLog: ITimeLog | Partial<ITimeLog>;
get timeLog(): ITimeLog | Partial<ITimeLog> {
return this._timeLog;
Expand Down Expand Up @@ -227,6 +228,7 @@ export class EditTimeLogModalComponent implements OnInit, AfterViewInit, OnDestr

const payload = {
..._.omit(this.form.value, ['selectedRange']),

startedAt,
stoppedAt,
organizationId,
Expand Down
8 changes: 8 additions & 0 deletions packages/ui-core/shared/src/lib/timesheet/edit-time-log-modal/edit-time-log-modal.module.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,15 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import {
NbAutocompleteModule,
NbButtonModule,
NbCardModule,
NbCheckboxModule,
NbFormFieldModule,
NbIconModule,
NbInputModule,
NbOptionModule,
NbSelectModule,
NbSpinnerModule,
NbTooltipModule
} from '@nebular/theme';
Expand All @@ -31,10 +35,14 @@ import { TaskSelectModule } from '../../tasks/task-select/task-select.module';
NbButtonModule,
NbCardModule,
NbCheckboxModule,
NbAutocompleteModule,
NbFormFieldModule,
NbIconModule,
NbInputModule,
NbSpinnerModule,
NbTooltipModule,
NbSelectModule,
NbOptionModule,
NgxPermissionsModule.forChild(),
TranslateModule.forChild(),
SharedModule,
Expand Down

0 comments on commit 7c1b4e3

Please sign in to comment.