inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-1711] The <adf-task-attachment-list component displays drag-and-drop area that is not working (#2658)

Browse Source 
* [ADF-1711] The <adf-task-attachment-list component displays drag-and-drop area that is not working

* Made the drag and drop area working in demo shell for task attachment

* Provided a way to pass custom no content template for drag and drop to the user

* Updated the task-attachment README file for the user to know how to use drag and drop component with task-attachment component

* [ADF-1711] The <adf-task-attachment-list component displays drag-and-drop area that is not working

* Made the drag and drop area working in demo shell for task attachment

* Provided a way to pass custom no content template for drag and drop to the user

* Updated the task-attachment README file for the user to know how to use drag and drop component with task-attachment component
This commit is contained in:
madhukar23
2017-11-21 16:03:56 +05:30
committed by Eugenio Romano
parent bf6d0284e0
commit aa8b2a28f3
8 changed files with 167 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs/docassets/images/custom-no-content-drag-drop-template.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
docs/docassets/images/default-no-content-template.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

35
docs/task-attachment-list.component.md
View File

@@ -1,6 +1,6 @@
# Task Attachment List Component
Displays attached documents on a specified task
Displays attached documents on a specified task.
![task-attachment-list-sample](docassets/images/task-attachment-list.png)
@@ -9,6 +9,7 @@ Displays attached documents on a specified task
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Drag and Drop Functionality](#how-to-add-drag-and-drop-functionality)
* [Properties](#properties)
* [Events](#events)
@@ -24,6 +25,38 @@ Displays attached documents on a specified task
(attachmentClick)="YOUR_HANDLER">
</adf-task-attachment-list>
```
If the List is empty, a default no content template is displayed.
![default-no-content-template-sample](docassets/images/default-no-content-template.png)
### How to Add Drag and Drop Functionality
If we want user to be able to upload attachments for empty lists, We can wrap our component with upload drag area component. In that case, We should also pass a custom *no content template* as shown below with our component urging the user to drag files to upload whenever the list is empty.
```html
<adf-upload-drag-area
[parentId]="YOUR_TASK_ID"
[showNotificationBar]="BOOLEAN">
<adf-task-attachment-list
[taskId]="YOUR_TASK_ID"
(attachmentClick)="YOUR_HANDLER">
<div adf-empty-list> //no content template
<adf-empty-list>
<div adf-empty-list-header>{{This List is empty}}</div>
<div adf-empty-list-body>{{Drag and drop to upload}}</div>
<div adf-empty-list-footer>
<img [src]="Your custom image URL"></div>
</adf-empty-list>
</div>
</adf-task-attachment-list>
</adf-upload-drag-area>
```
[Upload Drag Area Component](./upload-drag-area.component.md)
If the List is empty, the custom no-content template we passed is displayed.
![custom-no-content-drag-drop-template-sample](docassets/images/custom-no-content-drag-drop-template.png)
### Properties