peisweb/src/components/publicjs/public.js

import Sortable from "sortablejs";
import { putapi } from "@/api/api";
//拖拽组件初始化
function rowDrop(aa, tableData, isshow, cb) {
  const tbody = document.querySelector(aa); //".el-table__body-wrapper tbody"
  console.log("tableDatatableData", tableData, isshow, this);
  Sortable.create(tbody, {
    handle: ".move",
    animation: 300,
    onEnd({ newIndex, oldIndex }) {
      cb();
      const currRow = tableData.splice(oldIndex, 1)[0];
      tableData.splice(newIndex, 0, currRow);
      tableData.map((item, index) => {
        if (index == newIndex && index == oldIndex) {
          // console.log(item, "新数据");
        } else if (index == oldIndex) {
        } else if (index == newIndex) {
        }
      });
      console.log(tableData);
      console.log(tableData.map((item) => item.displayOrder));
    },
  });
}

//拖拽排序确定方法
//确定拖拽
//  function aassertion() {
//     const result = [];
//     this.tableData.forEach((item, index) => {
//       // index 从0开始的， displayOrder从大到小排
//       console.log(item.id);
//       console.log(index);
//       // const currentDisplayOrder = this.tableData.length -1
//       const currentDisplayOrder = this.initTableData[index].displayOrder;
//       if (item.displayOrder != currentDisplayOrder) {
//         // 如果它的displayOrder和它当前所在的位置不同代表挪动过位置
//         result.push({ id: item.id, displayOrder: currentDisplayOrder });
//       }
//     });
//     conlusiondraganddrop({ itemList: result }).then((res) => {
//       console.log("操作成功");
//       this.isshow = true;
//       this.getlist();
//     });
//   }
function assertions(tableData, initTableData) {
  const result = [];
  tableData.forEach((item, index) => {
    // index 从0开始的， displayOrder从大到小排
    console.log(item.id);
    console.log(index);
    // const currentDisplayOrder = this.tableData.length -1
    const currentDisplayOrder = initTableData[index].displayOrder;
    if (item.displayOrder != currentDisplayOrder) {
      // 如果它的displayOrder和它当前所在的位置不同代表挪动过位置
      result.push({ id: item.id, displayOrder: currentDisplayOrder });
    }
    console.log("currentDisplayOrder", currentDisplayOrder);
    console.log("item", item);
  });
  // putapi(url, { itemList: result }).then((res) => {
  //     console.log("操作成功");
  //     this.isshow = true;
  //     this.getlist();
  // });
}
export { rowDrop, assertions };