46 lines
1.8 KiB
PHP
46 lines
1.8 KiB
PHP
@php use App\Settings; @endphp
|
|
|
|
<x-table.table with_title_area >
|
|
<x-slot:title class="-mb-5">Subscore Display Order</x-slot:title>
|
|
<div x-data="sortableListForTiebreak('/admin/scoring/reorder-display')" x-init="init">
|
|
<x-table.body id="sortable-list">
|
|
@foreach ($subscores as $subscore)
|
|
<tr data-id="{{ $subscore->id }}">
|
|
<x-table.td>{{ $subscore->name }}</x-table.td>
|
|
</tr>
|
|
@endforeach
|
|
</x-table.body>
|
|
</div>
|
|
</x-table.table>
|
|
|
|
<script>
|
|
function sortableListForTiebreak(submitLink) {
|
|
return {
|
|
init() {
|
|
let el = document.getElementById('sortable-list');
|
|
let sortable = Sortable.create(el, {
|
|
onEnd: function (evt) {
|
|
let order = Array.from(el.children).map((item, index) => item.getAttribute('data-id'));
|
|
fetch(submitLink, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRF-TOKEN': '{{ csrf_token() }}'
|
|
},
|
|
body: JSON.stringify({ order })
|
|
}).then(response => response.json())
|
|
.then(data => {
|
|
if (data.status === 'success') {
|
|
console.log('Order updated successfully');
|
|
}
|
|
else {
|
|
console.log(data.status);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|