EchoTex_Payroll/HRM.UI/ClientApp/src/app/attendance/echotex-roster-assignment/echotex-roster-assignment.component.html

101 lines
4.8 KiB
HTML

<app-loading-panel> </app-loading-panel>
<div class="card card-w-title">
<form [formGroup]="rosterAssignmentForm">
<div class="p-grid ElementsInside" style="align-items: center; margin: 10px">
<div class="rosterAssignmentControls">
<strong>
<label>Select Employee: </label>
</strong>
</div>
<div class="rosterAssignmentControls">
<app-employee-picker [MultiSelect]="true"
(ItemSelected)="GetSelectedEmployee($event)"></app-employee-picker>
</div>
<div class="rosterAssignmentControls">
<strong>
<label>Roster Type: </label>
</strong>
</div>
<div class="rosterAssignmentControls">
<kendo-dropdownlist [(ngModel)]="selectedWorkPlanTypeIsFixed" [data]="workPlanTypes"
[defaultItem]="{ text: 'Select Roster Type..', value: null }" [textField]="'text'" [valueField]="'value'"
(valueChange)="onChangeWorkPlanType($event)" [valuePrimitive]="true"
class="form-control form-control-sm input-sm" formControlName="type">
</kendo-dropdownlist>
</div>
<div class="rosterAssignmentControls">
<strong>
<label>Roster: </label>
</strong>
</div>
<div class="rosterAssignmentControls">
<kendo-dropdownlist [(ngModel)]="selectedWorkPlanID" [data]="workPlanGroupListByType"
[defaultItem]="{ name: 'Select..', value: null }" [textField]="'name'" [valueField]="'id'"
(valueChange)="populateEmpWorkPlanByWorkGroup($event)" [valuePrimitive]="true"
class="form-control form-control-sm input-sm" formControlName="group">
</kendo-dropdownlist>
</div>
<div class="rosterAssignmentControls" *ngIf="!fixedWorkPlan">
<strong>
<label>Start Date: </label>
</strong>
</div>
<div class="rosterAssignmentControls" *ngIf="!fixedWorkPlan">
<kendo-datepicker [(ngModel)]="startDate" [format]="'dd-MMM-yyyy'"formControlName="startDate"
style="width:100%"></kendo-datepicker>
<!-- (valueChange)="populateEmpWorkPlanByWorkGroup($event)" -->
</div>
<div class="rosterAssignmentControls">
<button kendoButton icon="plus" [primary]="true" (click)="AddtotheList()">
Add
</button>
</div>
<div class="rosterAssignmentControls">
<button kendoButton icon="upload" [primary]="true" (click)="UploadEmployeeRoster()">
Upload
</button>
</div>
</div>
<hr style="width: inherit" />
<div class="p-grid" style="margin: 10px">
<strong>
<label>Roster Details:</label>
</strong>
{{ "&nbsp;&nbsp;" + workPlanGroupInitialShift }}
</div>
</form>
</div>
<kendo-grid [kendoGridBinding]="empWorkPlanSetupList" [height]="380" [filterable]="true">
<ng-template kendoGridToolbarTemplate>
<label>Count: {{ this.empWorkPlanSetupList.length }}</label>
<kendo-grid-spacer></kendo-grid-spacer>
<button icon="save" kendoButton [primary]="true" (click)="saveEmpWorkPlan()">
Save
</button>
<button type="button" kendoGridExcelCommand icon="file-excel">
Export
</button>
<!--<input placeholder="Count: {{this.empWorkPlanSetupList.length}}" kendoTextBox />-->
</ng-template>
<kendo-grid-column field="employeeNoView" title="Employee No" width="150px">
</kendo-grid-column>
<kendo-grid-column field="employeeNameView" title="Employee Name" width="150px">
</kendo-grid-column>
<kendo-grid-column field="workPlanGroupNameView" title="Work Plan Group" width="150px">
</kendo-grid-column>
<kendo-grid-column field="oldWorkPlanGroupName" title="Previous Group" width="150px">
</kendo-grid-column>
<kendo-grid-column field="weekEndOn" title="Holiday" width="150px">
<ng-template kendoGridCellTemplate let-dataItem>
{{getHolidayDayOfWeek(dataItem.weekEndOn)}}
</ng-template>
</kendo-grid-column>
<kendo-grid-command-column title="Action" width="60">
<ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
<button kendoGridRemoveCommand icon="delete" class="kt-delete" (click)="removeHandler(dataItem)"></button>
</ng-template>
</kendo-grid-command-column>
<kendo-grid-excel fileName="exportExcelFileName"></kendo-grid-excel>
</kendo-grid>