mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-10-08 14:51:32 +00:00
[ADF-5390] [ADF-5391] Add multivalue cardview for Date, Datetime, Integers and Decimal properties. (#6980)
* [ADF-5390] Addd multivalue cardview for Date, Datetime, Integers and Decimal properties * Fix unit test * Fix linting * Fix e2e tests * fix e2e Co-authored-by: Eugenio Romano <eugenio.romano@alfresco.com>
This commit is contained in:
@@ -5,23 +5,23 @@
|
||||
</div>
|
||||
|
||||
<div class="adf-property-value adf-property-value-padding-top">
|
||||
<span *ngIf="!isEditable()"
|
||||
<span *ngIf="!isEditable() && !property.multivalued"
|
||||
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
|
||||
<span [attr.data-automation-id]="'card-dateitem-' + property.key">
|
||||
<span *ngIf="showProperty()"
|
||||
(dblclick)="copyToClipboard(property.displayValue)"
|
||||
matTooltipShowDelay="1000"
|
||||
[matTooltip]="'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate">{{ property.displayValue }}</span>
|
||||
</span>
|
||||
<span *ngIf="showProperty()"
|
||||
[attr.data-automation-id]="'card-dateitem-' + property.key"
|
||||
(dblclick)="copyToClipboard(property.displayValue)"
|
||||
matTooltipShowDelay="1000"
|
||||
[matTooltip]="'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate">{{ property.displayValue}}</span>
|
||||
</span>
|
||||
<div *ngIf="isEditable()"
|
||||
<div *ngIf="isEditable() && !property.multivalued"
|
||||
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 *ngIf="showProperty(); else elseEmptyValueBlock"
|
||||
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">{{ property.displayValue }}</span>
|
||||
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
|
||||
{{ property.displayValue }}</span>
|
||||
</span>
|
||||
|
||||
<mat-icon *ngIf="showClearAction()"
|
||||
@@ -55,4 +55,42 @@
|
||||
<ng-template #elseEmptyValueBlock>
|
||||
{{ property.default | translate }}
|
||||
</ng-template>
|
||||
|
||||
<div *ngIf="property.multivalued"
|
||||
class="adf-property-field adf-dateitem-chip-list-container adf-dateitem-editable">
|
||||
<mat-chip-list #chipList
|
||||
class="adf-textitem-chip-list">
|
||||
<mat-chip *ngFor="let propertyValue of property.displayValue let idx = index"
|
||||
[removable]="isEditable"
|
||||
(removed)="removeValueFromList(idx)">
|
||||
{{ propertyValue }}
|
||||
<mat-icon *ngIf="isEditable()"
|
||||
matChipRemove>cancel</mat-icon>
|
||||
</mat-chip>
|
||||
</mat-chip-list>
|
||||
|
||||
<mat-form-field *ngIf="isEditable()"
|
||||
class="adf-property-field adf-dateitem-editable-controls"
|
||||
[floatLabel]="'never'"
|
||||
(click)="showDatePicker()">
|
||||
<input matInput
|
||||
class="adf-invisible-date-input"
|
||||
[attr.tabIndex]="-1"
|
||||
[matDatetimepicker]="datetimePicker"
|
||||
(dateChange)="addDateToList($event)">
|
||||
<mat-datetimepicker-toggle [attr.tabindex]="-1"
|
||||
matSuffix
|
||||
[attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
|
||||
[attr.data-automation-id]="'datepickertoggle-' + property.key"
|
||||
[for]="datetimePicker">
|
||||
</mat-datetimepicker-toggle>
|
||||
|
||||
<mat-datetimepicker #datetimePicker
|
||||
[type]="property.type"
|
||||
timeInterval="5"
|
||||
[attr.data-automation-id]="'datepicker-' + property.key"
|
||||
[startAt]="valueDate">
|
||||
</mat-datetimepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user