mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2024-11-15 01:05:42 +00:00
Small update Corpus File List Selection
This commit is contained in:
parent
49ff1aa284
commit
b795cfa891
@ -12,7 +12,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
element.addEventListener('click', (event) => {this.onSelectionAction(event)});
|
element.addEventListener('click', (event) => {this.onSelectionAction(event)});
|
||||||
});
|
});
|
||||||
this.isInitialized = false;
|
this.isInitialized = false;
|
||||||
this.selectedItemIds = [];
|
this.selectedItemIds = new Set();
|
||||||
this.userId = listContainerElement.dataset.userId;
|
this.userId = listContainerElement.dataset.userId;
|
||||||
this.corpusId = listContainerElement.dataset.corpusId;
|
this.corpusId = listContainerElement.dataset.corpusId;
|
||||||
this.hasPermissionView = listContainerElement.dataset?.hasPermissionView == 'true' || false;
|
this.hasPermissionView = listContainerElement.dataset?.hasPermissionView == 'true' || false;
|
||||||
@ -35,7 +35,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
<tr class="list-item">
|
<tr class="list-item">
|
||||||
<td>
|
<td>
|
||||||
<label class="list-action-trigger ${this.hasPermissionView ? '' : 'hide'}" data-list-action="select">
|
<label class="list-action-trigger ${this.hasPermissionView ? '' : 'hide'}" data-list-action="select">
|
||||||
<input type="checkbox">
|
<input class="select-checkbox" type="checkbox">
|
||||||
<span class="disable-on-click"></span>
|
<span class="disable-on-click"></span>
|
||||||
</label>
|
</label>
|
||||||
</td>
|
</td>
|
||||||
@ -80,7 +80,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
<tr>
|
<tr>
|
||||||
<th>
|
<th>
|
||||||
<label class="selection-action-trigger ${this.listContainerElement.dataset?.hasPermissionView == 'true' ? '' : 'hide'}" data-selection-action="select-all">
|
<label class="selection-action-trigger ${this.listContainerElement.dataset?.hasPermissionView == 'true' ? '' : 'hide'}" data-selection-action="select-all">
|
||||||
<input type="checkbox">
|
<input class="select-all-checkbox" type="checkbox">
|
||||||
<span></span>
|
<span></span>
|
||||||
</label>
|
</label>
|
||||||
</th>
|
</th>
|
||||||
@ -158,7 +158,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
window.location.reload();
|
window.location.reload();
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
Requests.corpora.entity.followers.entity.delete(this.corpusId, followerId);
|
Requests.corpora.entity.followers.entity.delete(this.corpusId, itemId);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
modal.open();
|
modal.open();
|
||||||
@ -173,13 +173,11 @@ class CorpusFileList extends ResourceList {
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case 'select': {
|
case 'select': {
|
||||||
|
|
||||||
if (event.target.checked) {
|
if (event.target.checked) {
|
||||||
this.selectedItemIds.push(itemId);
|
this.selectedItemIds.add(itemId);
|
||||||
} else {
|
} else {
|
||||||
let index = this.selectedItemIds.indexOf(itemId);
|
this.selectedItemIds.delete(itemId);
|
||||||
if (index > -1) {
|
|
||||||
this.selectedItemIds.splice(index, 1);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
this.renderingItemSelection();
|
this.renderingItemSelection();
|
||||||
}
|
}
|
||||||
@ -195,18 +193,19 @@ class CorpusFileList extends ResourceList {
|
|||||||
let items = this.listjs.items;
|
let items = this.listjs.items;
|
||||||
let selectableItems = Array.from(items)
|
let selectableItems = Array.from(items)
|
||||||
.filter(item => item.elm)
|
.filter(item => item.elm)
|
||||||
.map(item => item.elm.querySelector('input[type="checkbox"]'));
|
.map(item => item.elm.querySelector('.select-checkbox[type="checkbox"]'));
|
||||||
|
|
||||||
switch (selectionAction) {
|
switch (selectionAction) {
|
||||||
case 'select-all': {
|
case 'select-all': {
|
||||||
let selectedIds = Array.from(items)
|
let selectedIds = new Set(Array.from(items)
|
||||||
.map(item => item.values().id);
|
.map(item => item.values().id))
|
||||||
if (event.target.checked) {
|
if (event.target.checked) {
|
||||||
selectableItems.forEach(selectableItem => selectableItem.checked = true);
|
selectableItems.forEach(selectableItem => selectableItem.checked = true);
|
||||||
this.selectedItemIds = selectedIds;
|
this.selectedItemIds = selectedIds;
|
||||||
} else {
|
} else {
|
||||||
selectableItems.forEach(checkbox => checkbox.checked = false);
|
selectableItems.forEach(checkbox => checkbox.checked = false);
|
||||||
this.selectedItemIds = this.selectedItemIds.filter(id => !selectedIds.includes(id));
|
this.selectedItemIds = new Set([...this.selectedItemIds].filter(id => !selectedIds.has(id)));
|
||||||
|
|
||||||
}
|
}
|
||||||
this.renderingItemSelection();
|
this.renderingItemSelection();
|
||||||
break;
|
break;
|
||||||
@ -249,9 +248,16 @@ class CorpusFileList extends ResourceList {
|
|||||||
let confirmElement = modalElement.querySelector('.action-button[data-action="confirm"]');
|
let confirmElement = modalElement.querySelector('.action-button[data-action="confirm"]');
|
||||||
confirmElement.addEventListener('click', (event) => {
|
confirmElement.addEventListener('click', (event) => {
|
||||||
this.selectedItemIds.forEach(selectedItemId => {
|
this.selectedItemIds.forEach(selectedItemId => {
|
||||||
Requests.corpora.entity.files.ent.delete(this.corpusId, selectedItemId);
|
if (currentUserId != this.userId) {
|
||||||
|
Requests.corpora.entity.files.ent.delete(this.corpusId, selectedItemId)
|
||||||
|
.then(() => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
Requests.corpora.entity.files.ent.delete(this.corpusId, selectedItemId);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
this.selectedItemIds = [];
|
this.selectedItemIds.clear();
|
||||||
this.renderingItemSelection();
|
this.renderingItemSelection();
|
||||||
});
|
});
|
||||||
modal.open();
|
modal.open();
|
||||||
@ -265,7 +271,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
downloadLink.click();
|
downloadLink.click();
|
||||||
});
|
});
|
||||||
selectableItems.forEach(checkbox => checkbox.checked = false);
|
selectableItems.forEach(checkbox => checkbox.checked = false);
|
||||||
this.selectedItemIds = [];
|
this.selectedItemIds.clear();
|
||||||
this.renderingItemSelection();
|
this.renderingItemSelection();
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
@ -287,7 +293,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
|
|
||||||
Object.values(selectableItems).forEach(selectableItem => {
|
Object.values(selectableItems).forEach(selectableItem => {
|
||||||
if (selectableItem.elm) {
|
if (selectableItem.elm) {
|
||||||
let checkbox = selectableItem.elm.querySelector('input[type="checkbox"]');
|
let checkbox = selectableItem.elm.querySelector('.select-checkbox[type="checkbox"]');
|
||||||
if (checkbox.checked) {
|
if (checkbox.checked) {
|
||||||
selectableItem.elm.classList.add('grey', 'lighten-3');
|
selectableItem.elm.classList.add('grey', 'lighten-3');
|
||||||
} else {
|
} else {
|
||||||
@ -305,7 +311,7 @@ class CorpusFileList extends ResourceList {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
// Hide item action buttons if > 0 item is selected and show selection action buttons
|
// Hide item action buttons if > 0 item is selected and show selection action buttons
|
||||||
if (this.selectedItemIds.length > 0) {
|
if (this.selectedItemIds.size > 0) {
|
||||||
selectionActionButtons.forEach(selectionActionButton => {
|
selectionActionButtons.forEach(selectionActionButton => {
|
||||||
selectionActionButton.classList.remove('hide');
|
selectionActionButton.classList.remove('hide');
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user