59 lines
1.8 KiB
Svelte
59 lines
1.8 KiB
Svelte
<script>
|
|
import Sortable from "sortablejs";
|
|
import { onMount, createEventDispatcher } from "svelte";
|
|
export let sortableClass;
|
|
// export let handle;
|
|
export let isTable = false;
|
|
export let sortableInstance;
|
|
const dispatch = createEventDispatcher();
|
|
let sortableContainer;
|
|
|
|
onMount(() => {
|
|
let options = {
|
|
// handle: ".sortable-handle",
|
|
// draggable: ".quote-line-wrapper",
|
|
// filter: ".not-draggable", // Selectors that do not lead to dragging (String or Function)
|
|
// preventOnFilter: true,
|
|
animation: 150, // ms, animation speed moving items when sorting, `0` — without animation
|
|
easing: "cubic-bezier(1, 0, 0, 1)",
|
|
onUpdate: function (/**Event*/ evt) {
|
|
// reorder(evt.oldIndex,evt.newIndex);
|
|
dispatch("update", {
|
|
source: evt.oldIndex,
|
|
target: evt.newIndex,
|
|
});
|
|
},
|
|
onMove(event) {
|
|
// if (event.related.className.indexOf("not-draggable") > -1) {
|
|
// return false;
|
|
// }
|
|
},
|
|
};
|
|
|
|
// if (handle) {
|
|
// options.handle = handle;
|
|
// }
|
|
sortableInstance = Sortable.create(sortableContainer, options);
|
|
});
|
|
|
|
// function reorder(from, to) {
|
|
// let newList = JSON.parse(JSON.stringify(value));
|
|
// let fromElem = newList[from];
|
|
// newList.splice(from, 1);
|
|
// newList.splice(to, 0, fromElem);
|
|
// value = newList;
|
|
// dispatch("reordered", value);
|
|
// }
|
|
</script>
|
|
|
|
{#if isTable}
|
|
<tbody class="sortable-container {sortableClass}" bind:this={sortableContainer}>
|
|
<slot />
|
|
</tbody>
|
|
{:else}
|
|
<div class="sortable-container {sortableClass}" bind:this={sortableContainer}>
|
|
<slot />
|
|
</div>
|
|
{/if}
|
|
|