mirror of
https://github.com/psforever/PSFPortal.git
synced 2026-01-19 18:14:45 +00:00
75 lines
2.2 KiB
Svelte
75 lines
2.2 KiB
Svelte
<script>
|
|
import { onMount } from 'svelte';
|
|
import axios from 'axios'
|
|
import Alert from './Alert'
|
|
import jq from 'jquery'
|
|
|
|
import { createEventDispatcher } from 'svelte';
|
|
|
|
const dispatch = createEventDispatcher();
|
|
|
|
let modalAlert;
|
|
|
|
onMount(() => setup_actions());
|
|
|
|
function setup_actions() {
|
|
const modal = jq('#roleModal');
|
|
|
|
modal.on('hide.bs.modal', () => modalAlert.message(""));
|
|
modal.on('show.bs.modal', (event) => {
|
|
const button = jq(event.relatedTarget) // Button that triggered the modal
|
|
const username = button.data('account-name')
|
|
const avatar_id = button.data('avatar-id')
|
|
const action_type = button.data('action')
|
|
const action_name = button.text();
|
|
|
|
modal.find('.modal-title').text("Confirm " + action_name)
|
|
modal.find('.modal-body p').text("Are you sure you want to perform this action on \'" + username + "\'?")
|
|
|
|
const submit = modal.find('.modal-footer .btn-primary')
|
|
|
|
submit.text(action_name)
|
|
// remove ALL previous click handlers
|
|
submit.off()
|
|
|
|
submit.click(async (event) => {
|
|
submit.addClass("disabled")
|
|
|
|
try {
|
|
await axios.post("/api/roles/"+ avatar_id + "/" + action_type)
|
|
dispatch('action', {
|
|
target: avatar_id,
|
|
action: action_type,
|
|
});
|
|
modal.modal('hide')
|
|
} catch (e) {
|
|
modalAlert.message(e.message)
|
|
} finally {
|
|
submit.removeClass("disabled")
|
|
}
|
|
});
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<div class="modal fade" id="roleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="exampleModalLabel">Perform Action</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<Alert bind:this={modalAlert} />
|
|
<p>Are you sure?</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
|
|
<button type="button" class="btn btn-primary">Yes</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|