inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2026-09-09 18:03:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-12728] Allowed to decide if drag preview should be whole row or not

Browse Source
This commit is contained in:
Aleksander Sklorz
2026-09-09 14:42:50 +02:00
parent f82f86d99a
commit 090de510f2
4 changed files with 73 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/content-services/src/lib/document-list/components/document-list.component.html
+2 -1
View File
@@ -33,7 +33,8 @@
[enableDragRows]="enableDragRows"
[dropListConnectedTo]="dropListConnectedTo"
[dragBoundary]="dragBoundary"
[showDragIndicator]="showDragIndicator">
[showDragIndicator]="showDragIndicator"
[useWholeRowAsDragPreview]="useWholeRowAsDragPreview">
<div *ngIf="headerFilters">
<adf-filter-header
lib/content-services/src/lib/document-list/components/document-list.component.ts
+3
View File
@@ -399,6 +399,9 @@ export class DocumentListComponent extends DataTableSchema implements OnInit, On
@Input()
showDragIndicator = true;
@Input()
useWholeRowAsDragPreview = true;
/**
* Indicates if the data is provided externally.
* If true the component won't fetch data itself
lib/core/src/lib/datatable/components/datatable/datatable.component.html
+65 -63
View File
@@ -596,75 +596,77 @@
</div>
}
<div *cdkDragPreview class="adf-datatable-row__dragging-preview">
@for (col of getVisibleColumns(); track col.key) {
@if (col.visibleInDragPreview) {
@if (!col.template) {
<div class="adf-datatable-cell-container">
@switch (data.getColumnType(row, col)) {
@case ('image') {
<div class="adf-cell-value">
@if (isIconValue(row, col)) {
<mat-icon
[attr.aria-label]="col.srTitle ? (col.srTitle | translate) : null"
[attr.aria-hidden]="!asIconValue(row, col)"
[adf-icon]="asIconValue(row, col)"
/>
} @else {
@if (row.isSelected && !multiselect) {
<mat-icon class="adf-datatable-selected" svgIcon="selected" />
} @else {
<img
class="adf-datatable-center-img-ie"
[attr.aria-label]="
(data.getValue(row, col) | fileType) === 'disable'
? ('ADF-DATATABLE.ACCESSIBILITY.ICON_DISABLED' | translate)
: ('ADF-DATATABLE.ACCESSIBILITY.ICON_TEXT'
| translate
: {
type:
'ADF-DATATABLE.FILE_TYPE.' +
(data.getValue(row, col) | fileType | uppercase)
| translate
})
"
[attr.alt]="
(data.getValue(row, col) | fileType) === 'disable'
? ('ADF-DATATABLE.ACCESSIBILITY.ICON_DISABLED' | translate)
: ('ADF-DATATABLE.ACCESSIBILITY.ICON_TEXT'
| translate
: {
type:
'ADF-DATATABLE.FILE_TYPE.' +
(data.getValue(row, col) | fileType | uppercase)
| translate
})
"
src="{{ data.getValue(row, col) }}"
(error)="onImageLoadingError($event, row)"
@if (!useWholeRowAsDragPreview) {
<div *cdkDragPreview class="adf-datatable-row__dragging-preview">
@for (col of getVisibleColumns(); track col.key) {
@if (col.visibleInDragPreview) {
@if (!col.template) {
<div class="adf-datatable-cell-container">
@switch (data.getColumnType(row, col)) {
@case ('image') {
<div class="adf-cell-value">
@if (isIconValue(row, col)) {
<mat-icon
[attr.aria-label]="col.srTitle ? (col.srTitle | translate) : null"
[attr.aria-hidden]="!asIconValue(row, col)"
[adf-icon]="asIconValue(row, col)"
/>
} @else {
@if (row.isSelected && !multiselect) {
<mat-icon class="adf-datatable-selected" svgIcon="selected" />
} @else {
<img
class="adf-datatable-center-img-ie"
[attr.aria-label]="
(data.getValue(row, col) | fileType) === 'disable'
? ('ADF-DATATABLE.ACCESSIBILITY.ICON_DISABLED' | translate)
: ('ADF-DATATABLE.ACCESSIBILITY.ICON_TEXT'
| translate
: {
type:
'ADF-DATATABLE.FILE_TYPE.' +
(data.getValue(row, col) | fileType | uppercase)
| translate
})
"
[attr.alt]="
(data.getValue(row, col) | fileType) === 'disable'
? ('ADF-DATATABLE.ACCESSIBILITY.ICON_DISABLED' | translate)
: ('ADF-DATATABLE.ACCESSIBILITY.ICON_TEXT'
| translate
: {
type:
'ADF-DATATABLE.FILE_TYPE.' +
(data.getValue(row, col) | fileType | uppercase)
| translate
})
"
src="{{ data.getValue(row, col) }}"
(error)="onImageLoadingError($event, row)"
/>
}
}
}
</div>
</div>
}
}
}
</div>
} @else {
<div class="adf-datatable-cell-container">
<div class="adf-cell-value">
<ng-container
[ngTemplateOutlet]="col.template"
[ngTemplateOutletContext]="{
$implicit: { data: data, row: row, col: col },
value: data.getValue(row, col, resolverFn)
}"
/>
</div>
</div>
} @else {
<div class="adf-datatable-cell-container">
<div class="adf-cell-value">
<ng-container
[ngTemplateOutlet]="col.template"
[ngTemplateOutletContext]="{
$implicit: { data: data, row: row, col: col },
value: data.getValue(row, col, resolverFn)
}"
/>
</div>
</div>
}
}
}
}
</div>
</div>
}
</adf-datatable-row>
@if (isEmpty()) {
<div role="row" class="adf-datatable-row">
lib/core/src/lib/datatable/components/datatable/datatable.component.ts
+3
View File
@@ -239,6 +239,9 @@ export class DataTableComponent implements OnInit, AfterContentInit, OnChanges,
@Input()
showDragIndicator = true;
@Input()
useWholeRowAsDragPreview = true;
/** Emitted when the user clicks a row. */
@Output()
rowClick = new EventEmitter<DataRowEvent>();