import Sortable from 'sortablejs'
import {VXETable} from "vxe-table";

/*表格拖拽*/
let sortable2 = null
 function columnDrop2(xGrid){
    const $grid = xGrid
    sortable2 = Sortable.create($grid.$el.querySelector('.body--wrapper>.vxe-table--header .vxe-header--row'), {
        handle: '.vxe-header--column',
        onEnd: (sortableEvent) => {
            const targetThElem = sortableEvent.item
            const newIndex = sortableEvent.newIndex
            const oldIndex = sortableEvent.oldIndex
            const { fullColumn, tableColumn } = $grid.getTableColumn()
            const wrapperElem = targetThElem.parentNode
            const newColumn = fullColumn[newIndex]
            if (newColumn.fixed) {
                // 错误的移动
                const oldThElem = wrapperElem.children[oldIndex]
                if (newIndex > oldIndex) {
                    wrapperElem.insertBefore(targetThElem, oldThElem)
                } else {
                    wrapperElem.insertBefore(targetThElem, oldThElem ? oldThElem.nextElementSibling : oldThElem)
                }
                VXETable.modal.message({ content: '固定列不允许拖动！', status: 'error' })
                return
            }
            // 获取列索引 columnIndex > fullColumn
            const oldColumnIndex = $grid.getColumnIndex(tableColumn[oldIndex])
            const newColumnIndex = $grid.getColumnIndex(tableColumn[newIndex])
            // 移动到目标列
            const currRow = fullColumn.splice(oldColumnIndex, 1)[0]
            fullColumn.splice(newColumnIndex, 0, currRow)
            $grid.loadColumn(fullColumn)
        }
    })
}
export {
    columnDrop2,
    sortable2
}