mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-26 17:24:56 +00:00
05e73a8aa1
* [ADF-4755] [CardViewDateItemComponent] Provide a way to reset date. * Added clear icon to reset date to empty. * Added Translation key to the new icon. * * Added displayClearAction flag to toggle clear action.* Added None as default for the selectItem components.* Added displayNoneOption flag to toggle the default none option. * * Fixed comments. * * Added translation key for 'none' option. * * Updated dateItem css to the match recent changes. * * Fixed failing unit tests* Updated TaskHeader components with the displayClearAction. * * Updated demo shell card-view component to test the latest changes
48 lines
2.1 KiB
HTML
48 lines
2.1 KiB
HTML
<div [attr.data-automation-id]="'card-dateitem-label-' + property.key" class="adf-property-label" *ngIf="showProperty() || isEditable()">{{ property.label | translate }}</div>
|
|
<div class="adf-property-value">
|
|
<span *ngIf="!isEditable()" [attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
|
|
<span [attr.data-automation-id]="'card-dateitem-' + property.key">
|
|
<span *ngIf="showProperty()">{{ property.displayValue }}</span>
|
|
</span>
|
|
</span>
|
|
<div *ngIf="isEditable()" class="adf-dateitem-editable">
|
|
<div class="adf-dateitem-editable-controls">
|
|
<span
|
|
class="adf-datepicker-toggle"
|
|
[attr.data-automation-id]="'datepicker-label-toggle-' + property.key"
|
|
(click)="showDatePicker()">
|
|
<span [attr.data-automation-id]="'card-' + property.type + '-value-' + property.key" *ngIf="showProperty(); else elseEmptyValueBlock">{{ property.displayValue }}</span>
|
|
</span>
|
|
|
|
<mat-icon *ngIf="showClearAction()"
|
|
class="adf-date-reset-icon"
|
|
(click)="onDateClear()"
|
|
[attr.title]="'CORE.METADATA.ACTIONS.CLEAR' | translate"
|
|
[attr.data-automation-id]="'datepicker-date-clear-' + property.key">
|
|
clear
|
|
</mat-icon>
|
|
|
|
<mat-datetimepicker-toggle
|
|
[attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
|
|
[attr.data-automation-id]="'datepickertoggle-' + property.key"
|
|
[for]="datetimePicker">
|
|
</mat-datetimepicker-toggle>
|
|
</div>
|
|
|
|
<input class="adf-invisible-date-input"
|
|
[matDatetimepicker]="datetimePicker"
|
|
[value]="valueDate"
|
|
(dateChange)="onDateChanged($event)">
|
|
|
|
<mat-datetimepicker #datetimePicker
|
|
[type]="property.type"
|
|
timeInterval="5"
|
|
[attr.data-automation-id]="'datepicker-' + property.key"
|
|
[startAt]="valueDate">
|
|
</mat-datetimepicker>
|
|
</div>
|
|
<ng-template #elseEmptyValueBlock>
|
|
{{ property.default | translate }}
|
|
</ng-template>
|
|
</div>
|