AS1024/itflow
1
0
Fork 0
mirror of https://github.com/itflow-org/itflow synced 2026-02-28 10:54:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Totally remove Dragula in Favor of the modern SortableJS library, updated the Kanban

Browse Source
This commit is contained in:
johnnyq
2025-04-13 15:01:52 -04:00
parent 19b809b699
commit 65e107d154
10 changed files with 314 additions and 333 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
ticket.php
View File

@@ -341,7 +341,6 @@ if (isset($_GET['ticket_id'])) {
$ticket_collaborators = nullable_htmlentities($row['user_names']);
?>
<link rel="stylesheet" href="plugins/dragula/dragula.min.css">
<!-- Breadcrumbs-->
<ol class="breadcrumb d-print-none">
@@ -940,7 +939,7 @@ if (isset($_GET['ticket_id'])) {
</form>
<?php } ?>
<table class="table table-sm">
<table class="table table-sm" id="tasks">
<?php
while($row = mysqli_fetch_array($sql_tasks)){
$task_id = intval($row['task_id']);
@@ -960,14 +959,14 @@ if (isset($_GET['ticket_id'])) {
<?php } ?>
</td>
<td>
<a href="#" class="grab-cursor">
<span class="text-secondary"><?php echo $task_completion_estimate; ?>m</span>
<span class="text-dark"> - <?php echo $task_name; ?></span>
</a>
<a href="#" class="drag-handle"><i class="fas fa-bars text-muted mr-1"></i></a>
<span class="text-secondary"><?php echo $task_completion_estimate; ?>m</span>
<span class="text-dark"> - <?php echo $task_name; ?></span>
</td>
<td>
<div class="float-right">
<?php if (empty($ticket_resolved_at) && lookupUserPermission("module_support") >= 2) { ?>
<div class="dropdown dropleft text-center">
<button class="btn btn-link text-secondary btn-sm" type="button" data-toggle="dropdown">
<i class="fas fa-fw fa-ellipsis-v"></i>
@@ -991,6 +990,7 @@ if (isset($_GET['ticket_id'])) {
</a>
</div>
</div>
<?php } ?>
</div>
</td>
@@ -1207,41 +1207,23 @@ require_once "includes/footer.php";
});
</script>
<script src="plugins/dragula/dragula.min.js"></script>
<script src="plugins/SortableJS/Sortable.min.js"></script>
<script>
$(document).ready(function() {
var container = $('.table tbody')[0];
new Sortable(document.querySelector('table#tasks tbody'), {
handle: '.drag-handle',
animation: 150,
onEnd: function (evt) {
const rows = document.querySelectorAll('table#tasks tbody tr');
const positions = Array.from(rows).map((row, index) => ({
id: row.dataset.taskId,
order: index
}));
dragula([container])
.on('drop', function (el, target, source, sibling) {
// Handle the drop event to update the order in the database
var rows = $(container).children();
var positions = rows.map(function(index, row) {
return {
id: $(row).data('taskId'),
order: index
};
}).get();
//console.log('New positions:', positions);
// Send the new order to the server (example using fetch)
$.ajax({
url: 'ajax.php',
method: 'POST',
data: {
update_ticket_tasks_order: true,
ticket_id: <?php echo $ticket_id; ?>,
positions: positions
},
success: function(data) {
//console.log('Order updated:', data);
},
error: function(error) {
console.error('Error updating order:', error);
}
});
});
});
$.post('ajax.php', {
update_ticket_tasks_order: true,
ticket_id: <?php echo $ticket_id; ?>,
positions: positions
});
}
});
</script>