Element-UI 表格实现行列拖拽排序功能

要在 Element-UI 的表格中实现行列拖拽排序功能，可以使用 sortablejs 库来实现。首先，需要安装 sortablejs 库：

npm install sortablejs

然后，在你的项目中引入 sortablejs 库：

import Sortable from 'sortablejs';

接下来，你可以在表格的 mounted 钩子函数中初始化 sortablejs：

mounted() {
  this.initSortable();
},

methods: {
  initSortable() {
    const table = document.getElementById('your-table-id');
    const rows = table.getElementsByTagName('tbody')[0].getElementsByTagName('tr');
    const columns = table.getElementsByTagName('thead')[0].getElementsByTagName('th');
    
    // 初始化行拖拽排序
    Sortable.create(table, {
      animation: 150,
      handle: '.drag-handle',
      onEnd: (event) => {
        // 获取拖拽后的行数据
        const newData = Array.from(rows).map((row) => {
          return {
            // 根据你的数据结构来获取每一列的值
            column1: row.cells[0].innerText,
            column2: row.cells[1].innerText,
            // ...
          };
        });
        
        // 更新数据
        this.tableData = newData;
      },
    });
    
    // 初始化列拖拽排序
    Array.from(columns).forEach((column, index) => {
      Sortable.create(column, {
        group: 'table-columns',
        animation: 150,
        onEnd: (event) => {
          // 更新列数据
          this.tableColumns.splice(event.newIndex, 0, this.tableColumns.splice(event.oldIndex, 1)[0]);
        },
      });
    });
  },
},

在上面的代码中，你需要替换your-table-id为你的表格的 id，drag-handle为你的行拖拽排序的拖拽手柄的类名，tableData为你的表格数据，tableColumns为你的表格列数据。

这样，当你拖拽行或列时，表格的数据会跟随改变。请确保你的表格的数据和列的顺序与tableData和tableColumns匹配。