mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
* people module directory restructuring * Extract PeopleSearchFieldComponent to reuse most part of it * Transform PeopleSearchFieldComponent to the form we want to reuse * People selector component, first try * Remove material grid from start-task.component, first part * Styling and i18n * clear button for deleting the selected assignee * Remove people preloading, remove combobox and update assigneeId * Fix existing tests * Add new tests * Final css fixes
89 lines
4.5 KiB
HTML
89 lines
4.5 KiB
HTML
<mat-card class="adf-new-task-layout-card">
|
|
<mat-grid-list cols="1" rowHeight="60px">
|
|
<mat-grid-tile>
|
|
<div class="adf-new-task-heading">{{'ADF_TASK_LIST.START_TASK.FORM.TITLE'|translate}}</div>
|
|
</mat-grid-tile>
|
|
</mat-grid-list>
|
|
<mat-card-content>
|
|
<div class="adf-new-task-layout-card-content">
|
|
<div class="adf-grid-full-width adf-grid-row">
|
|
<mat-form-field class="adf-grid-full-width adf-grid-column">
|
|
<input matInput
|
|
class="adf-grid-full-width"
|
|
placeholder="{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.NAME'|translate}}"
|
|
[(ngModel)]="startTaskmodel.name"
|
|
required
|
|
id="name_id">
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<div class="adf-grid-full-width adf-grid-row">
|
|
<mat-form-field class="adf-grid-full-width adf-grid-column">
|
|
<textarea
|
|
matInput
|
|
class="adf-grid-full-width"
|
|
placeholder="{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.DESCRIPTION'|translate}}"
|
|
[(ngModel)]="startTaskmodel.description"
|
|
rows="1"
|
|
id="description_id">
|
|
</textarea>
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<div class="adf-grid-full-width adf-grid-row">
|
|
<div class="adf-grid-column adf-grid-half-width">
|
|
<div class="adf-grid-full-width adf-grid-row">
|
|
<mat-form-field class="adf-grid-full-width">
|
|
<input matInput
|
|
[matDatepicker]="taskDatePicker"
|
|
(keydown)="true"
|
|
(focusout)="onDateChanged($event.srcElement.value)"
|
|
placeholder="{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.DATE'|translate}}"
|
|
[(ngModel)]="startTaskmodel.dueDate"
|
|
id="date_id">
|
|
<mat-datepicker-toggle matSuffix [for]="taskDatePicker"></mat-datepicker-toggle>
|
|
<mat-datepicker #taskDatePicker
|
|
[touchUi]="true"
|
|
(dateChanged)="onDateChanged($event)">
|
|
</mat-datepicker>
|
|
<div class="adf-error-text-container">
|
|
<div *ngIf="dateError">
|
|
<div class="adf-error-text">{{'ADF_TASK_LIST.START_TASK.FORM.DATE.ERROR'|translate}}</div>
|
|
<mat-icon class="adf-error-icon">warning</mat-icon>
|
|
</div>
|
|
</div>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="adf-grid-full-width adf-grid-row">
|
|
<mat-form-field class="adf-grid-full-width">
|
|
<mat-select placeholder="{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.FORM'|translate}}" id="form_id" [(ngModel)]="formKey">
|
|
<mat-option>{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.NONE'|translate}}</mat-option>
|
|
<mat-option *ngFor="let form of forms" [value]="form.id">{{ form.name }}</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="adf-grid-column adf-grid-half-width">
|
|
<adf-people-selector [(peopleId)]="assigneeId" id="assignee_id"></adf-people-selector>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
<mat-card-actions>
|
|
<mat-grid-list cols="1" rowHeight="60px">
|
|
<mat-grid-tile>
|
|
<div class="adf-new-task-footer">
|
|
<button mat-button (click)="onCancel()" id="button-cancle">
|
|
{{'ADF_TASK_LIST.START_TASK.FORM.ACTION.CANCEL'|translate}}
|
|
</button>
|
|
<button color="primary" mat-button [disabled]="!startTaskmodel.name || dateError" (click)="start()" id="button-start">
|
|
{{'ADF_TASK_LIST.START_TASK.FORM.ACTION.START'|translate}}
|
|
</button>
|
|
</div>
|
|
</mat-grid-tile>
|
|
</mat-grid-list>
|
|
</mat-card-actions>
|
|
</mat-card>
|
|
|