91 lines
3.5 KiB
HTML
91 lines
3.5 KiB
HTML
<mat-card>
|
|
<mat-card-title-group>
|
|
<mat-card-title>Employee</mat-card-title>
|
|
<mat-icon
|
|
matSuffix
|
|
(click)="item.isStarred = !item.isStarred"
|
|
class="pointer"
|
|
[class.gold]="item.isStarred"
|
|
>
|
|
{{ item.isStarred ? 'star' : 'star_border' }}
|
|
</mat-icon>
|
|
</mat-card-title-group>
|
|
<mat-card-content>
|
|
<form [formGroup]="form" class="flex flex-col">
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Code</mat-label>
|
|
<input matInput placeholder="Code" formControlName="code" />
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Name</mat-label>
|
|
<input matInput #nameElement placeholder="Name" formControlName="name" />
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Designation</mat-label>
|
|
<input matInput placeholder="Designation" formControlName="designation" />
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Salary</mat-label>
|
|
<input matInput placeholder="Salary" formControlName="salary" />
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Points</mat-label>
|
|
<input matInput placeholder="Points" formControlName="points" />
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-checkbox formControlName="isActive">Is Active?</mat-checkbox>
|
|
</div>
|
|
<div class="flex flex-row justify-around content-start items-start">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Cost Centre</mat-label>
|
|
<mat-select placeholder="Cost Centre" formControlName="costCentre" name="CostCentre">
|
|
<mat-option *ngFor="let cs of costCentres" [value]="cs.id">
|
|
{{ cs.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</div>
|
|
<mat-form-field class="flex-auto">
|
|
<input
|
|
matInput
|
|
[matDatepicker]="joiningDate"
|
|
(focus)="joiningDate.open()"
|
|
placeholder="Joining Date"
|
|
formControlName="joiningDate"
|
|
autocomplete="off"
|
|
/>
|
|
<mat-datepicker-toggle matSuffix [for]="joiningDate"></mat-datepicker-toggle>
|
|
<mat-datepicker #joiningDate></mat-datepicker>
|
|
</mat-form-field>
|
|
<mat-form-field *ngIf="!item.isActive" class="flex-auto">
|
|
<input
|
|
matInput
|
|
[matDatepicker]="leavingDate"
|
|
(focus)="leavingDate.open()"
|
|
placeholder="Leaving Date"
|
|
formControlName="leavingDate"
|
|
autocomplete="off"
|
|
/>
|
|
<mat-datepicker-toggle matSuffix [for]="leavingDate"></mat-datepicker-toggle>
|
|
<mat-datepicker #leavingDate></mat-datepicker>
|
|
</mat-form-field>
|
|
</form>
|
|
</mat-card-content>
|
|
<mat-card-actions>
|
|
<button mat-raised-button color="primary" (click)="save()">Save</button>
|
|
<button mat-raised-button color="warn" (click)="confirmDelete()" *ngIf="!!item.id">
|
|
Delete
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|