forked from mirror/pixelfed
Update Admin Curated Onboarding, add select-all/mass action operations
This commit is contained in:
Daniel Supernault
parent
66f7dbcff2
commit
b22cac944b
1 changed files with 225 additions and 0 deletions
|
|
@ -20,10 +20,32 @@
|
|||
@include('admin.curated-register.partials.nav')
|
||||
|
||||
@if($records && $records->count())
|
||||
<div class="select-all-menu" style="display: none;">
|
||||
<form class="form-inline" id="select-form">
|
||||
<p class="mb-2 align-middle text-sm mr-2 font-weight-bold text-muted">Select an action:</p>
|
||||
<label class="sr-only" for="actionInput">Action</label>
|
||||
<select class="custom-select mb-2 mr-sm-2" id="actionInput">
|
||||
<option selected disabled>Select action</option>
|
||||
<option value="silently-reject-all" data-action="silently reject">Silently reject all</option>
|
||||
<option value="email-reject-all" data-action="reject all w/ email">Reject all w/ email</option>
|
||||
<option disabled value="">-------------------</option>
|
||||
<option value="request-info" data-action="request more info">Request more info</option>
|
||||
<option disabled value="">-------------------</option>
|
||||
<option value="approve-all" data-action="approve all">Approve all</option>
|
||||
</select>
|
||||
<button type="submit" class="btn btn-primary mb-2" id="actionInputButton" disabled>Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="table-responsive rounded">
|
||||
<table class="table table-dark">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th scope="col">
|
||||
<div class="custom-control custom-checkbox">
|
||||
<input type="checkbox" class="custom-control-input" id="selectall">
|
||||
<label class="custom-control-label" for="selectall"></label>
|
||||
</div>
|
||||
</th>
|
||||
<th scope="col">ID</th>
|
||||
<th scope="col">Username</th>
|
||||
@if(in_array($filter, ['all', 'open', 'awaiting', 'responses']))
|
||||
|
|
@ -37,6 +59,12 @@
|
|||
<tbody>
|
||||
@foreach($records as $record)
|
||||
<tr>
|
||||
<td>
|
||||
<div class="custom-control custom-checkbox">
|
||||
<input type="checkbox" class="custom-control-input account-select-check" id="r{{$record->id}}" data-id="{{$record->id}}">
|
||||
<label class="custom-control-label" for="r{{$record->id}}"></label>
|
||||
</div>
|
||||
</td>
|
||||
<td class="align-middle">
|
||||
<a href="/i/admin/curated-onboarding/show/{{$record->id}}" class="font-weight-bold">
|
||||
#{{ $record->id }}
|
||||
|
|
@ -84,3 +112,200 @@
|
|||
@include('admin.curated-register.partials.not-enabled')
|
||||
@endif
|
||||
@endsection
|
||||
|
||||
@push('scripts')
|
||||
<script type="text/javascript">
|
||||
const menu = document.querySelector(".select-all-menu");
|
||||
const selectAll = document.getElementById("selectall");
|
||||
const checkboxes = document.querySelectorAll(".account-select-check");
|
||||
const form = document.getElementById('select-form');
|
||||
const action = document.getElementById('actionInput');
|
||||
const actionBtn = document.getElementById('actionInputButton');
|
||||
|
||||
action.addEventListener("change", function() {
|
||||
if([
|
||||
'silently-reject-all',
|
||||
'email-reject-all',
|
||||
'request-info',
|
||||
'approve-all'
|
||||
].includes(action.value)) {
|
||||
actionBtn.removeAttribute('disabled')
|
||||
} else {
|
||||
actionBtn.setAttribute('disabled', 'disabled')
|
||||
}
|
||||
})
|
||||
|
||||
selectAll.addEventListener("change", function() {
|
||||
checkboxes.forEach(function(checkbox) {
|
||||
checkbox.checked = selectAll.checked;
|
||||
});
|
||||
|
||||
if(selectAll.checked) {
|
||||
menu.style.display = 'block';
|
||||
} else {
|
||||
menu.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
checkboxes.forEach(function(checkbox) {
|
||||
checkbox.addEventListener("change", function() {
|
||||
let count = Array.from(checkboxes).filter(cb => cb.checked).length;
|
||||
|
||||
if(count > 1) {
|
||||
menu.style.display = 'block';
|
||||
} else {
|
||||
menu.style.display = 'none';
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
form.addEventListener("submit", async function(event) {
|
||||
event.preventDefault();
|
||||
event.currentTarget?.blur();
|
||||
|
||||
const messages = await axios.get('/i/admin/api/curated-onboarding/templates/get')
|
||||
.then(res => res.data);
|
||||
|
||||
let action = form.actionInput.value;
|
||||
if(action === 'Select action') {
|
||||
return;
|
||||
}
|
||||
|
||||
let actionMap = {
|
||||
'silently-reject-all': 'silently reject all these applications?',
|
||||
'email-reject-all': 'reject and notify applicants via email?',
|
||||
'request-info': 'request more info from these applicants?',
|
||||
'approve-all': 'approve all these applicants?',
|
||||
}
|
||||
|
||||
let wrapper = document.createElement('div');
|
||||
let warning = document.createElement('p');
|
||||
warning.classList.add('text-left');
|
||||
warning.innerHTML = 'Are you sure you want to ' + actionMap[action];
|
||||
wrapper.appendChild(warning)
|
||||
|
||||
swal({
|
||||
title: "Confirm",
|
||||
content: wrapper,
|
||||
icon: "warning",
|
||||
dangerMode: true,
|
||||
buttons: {
|
||||
cancel: "Cancel",
|
||||
confirm: {
|
||||
text: "Proceed",
|
||||
value: "proceed",
|
||||
}
|
||||
},
|
||||
})
|
||||
.then(res => {
|
||||
if(res === 'proceed') {
|
||||
const ids = Array.from(checkboxes).filter(cb => cb.checked).map(el => el.getAttribute('data-id'));
|
||||
|
||||
if(action === 'request-info') {
|
||||
let wrapper = document.createElement('div');
|
||||
let warning = document.createElement('p');
|
||||
wrapper.classList.add('list-group')
|
||||
warning.classList.add('text-left');
|
||||
warning.innerHTML = 'Select a message to send:';
|
||||
wrapper.appendChild(warning);
|
||||
|
||||
messages.forEach(m => {
|
||||
let mr = document.createElement('button');
|
||||
mr.classList.add('list-group-item');
|
||||
mr.innerHTML = m.name;
|
||||
mr.onclick = () => {
|
||||
swal.close();
|
||||
handleRequestType(m, ids)
|
||||
}
|
||||
wrapper.appendChild(mr);
|
||||
})
|
||||
|
||||
swal({
|
||||
title: "Select Message Template",
|
||||
content: wrapper,
|
||||
icon: "warning",
|
||||
dangerMode: true,
|
||||
buttons: false,
|
||||
})
|
||||
return;
|
||||
} else {
|
||||
ids.reduce((promiseChain, id) => {
|
||||
return promiseChain
|
||||
.then((result) => {
|
||||
return handleAction(id, action);
|
||||
})
|
||||
.catch((error) => {
|
||||
throw error;
|
||||
});
|
||||
}, Promise.resolve())
|
||||
.then(() => {
|
||||
console.log('All requests completed successfully');
|
||||
window.location.reload()
|
||||
})
|
||||
.catch((error) => {
|
||||
swal('Error', 'An error occured, please try again later!', 'error');
|
||||
console.error('Promise chain failed:', error);
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
function handleRequestType(type, ids) {
|
||||
swal({
|
||||
title: 'Confirm Message Request',
|
||||
text: type.content,
|
||||
icon: "warning",
|
||||
dangerMode: true,
|
||||
buttons: {
|
||||
cancel: "Cancel",
|
||||
confirm: {
|
||||
text: "Proceed",
|
||||
value: "proceed",
|
||||
}
|
||||
}
|
||||
}).then(res => {
|
||||
if(res === 'proceed') {
|
||||
ids.reduce((promiseChain, id) => {
|
||||
return promiseChain
|
||||
.then((result) => {
|
||||
return handleAction(id, 'request-info', type.content);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(`Error fetching data for ID ${id}:`, error);
|
||||
throw error;
|
||||
});
|
||||
}, Promise.resolve())
|
||||
.then(() => {
|
||||
console.log('All requests completed successfully');
|
||||
window.location.reload()
|
||||
})
|
||||
.catch((error) => {
|
||||
swal('Error', 'An error occured, please try again later!', 'error');
|
||||
console.error('Promise chain failed:', error);
|
||||
});
|
||||
} else {
|
||||
console.log(res)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function handleAction(id, type, msg = false) {
|
||||
if(type === 'silently-reject-all') {
|
||||
return axios.post(`/i/admin/api/curated-onboarding/show/${id}/reject`, {
|
||||
action: 'reject-silent'
|
||||
})
|
||||
} else if(type === 'email-reject-all') {
|
||||
return axios.post(`/i/admin/api/curated-onboarding/show/${id}/reject`, {
|
||||
action: 'reject-email'
|
||||
})
|
||||
} else if(type === 'approve-all') {
|
||||
return axios.post(`/i/admin/api/curated-onboarding/show/${id}/approve`)
|
||||
} else if(type === 'request-info') {
|
||||
axios.post(`/i/admin/api/curated-onboarding/show/${id}/message/send`, {
|
||||
message: msg
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@endpush
|
||||
|
|
|
|||
Loading…
Reference in a new issue