cip-components/cip-select-table/use-table-selected.js

import { ref, computed } from 'vue'
export const useTableSelected = (props, { itemList }) => {
  const optionProps = computed(() => {
    return Object.assign({ value: 'value', label: 'label' }, props.optionProps)
  })
  const selectedRows = ref([])
  // 表格组件ref
  const tableRef = ref()
  // 设置当前列表选中 [注：存在分页]
  const setCurrentSelect = () => {
    if (itemList.value.length === 0 || !props.multiple) return
    const valueKey = optionProps.value.value
    selectedRows.value.forEach(row => {
      // 需要用itemList内的值
      const selectedRow = itemList.value.find(v => v[valueKey] === row[valueKey])
      if (selectedRow) {
        tableRef.value.cipTableRef.toggleRowSelection(selectedRow, true)
      }
    })
  }
  // 通过标签去除选中
  const removeSelectRow = (index) => {
    // 如果取消选中行在当前表格内则取消其选中
    const valueKey = optionProps.value.value
    // 从选中列表删除
    const [row] = selectedRows.value.splice(index, 1)
    const selectedRow = itemList.value.find(v => v[valueKey] === row[valueKey])
    if (selectedRow) {
      // 如果在当前视图则取消选中
      tableRef.value.cipTableRef.toggleRowSelection(selectedRow, false)
    }
  }

  const handleSelect = (pageSelected, changeRow) => {
    const valueKey = optionProps.value.value
    const index = selectedRows.value.findIndex(row => row[valueKey] === changeRow[valueKey])
    if (index > -1) {
      selectedRows.value.splice(index, 1)
    } else {
      selectedRows.value.push(changeRow)
    }
  }

  const handleSelectAll = (changeRows) => {
    const valueKey = optionProps.value.value
    if (changeRows.length > 0) {
      // 当前页全选
      changeRows.forEach(changeRow => {
        const index = selectedRows.value.findIndex(row => row[valueKey] === changeRow[valueKey])
        if (index > -1) {
          // 将原先在的删除，然后添加到最后一位
          selectedRows.value.splice(index, 1)
        }
        selectedRows.value.push(changeRow)
      })
    } else {
      // 当前页已选中的全部删除
      itemList.value.forEach(changeRow => {
        const index = selectedRows.value.findIndex(row => row[valueKey] === changeRow[valueKey])
        if (index > -1) {
          selectedRows.value.splice(index, 1)
        }
      })
    }
  }

  // 自带设置

  return {
    tableRef,
    selectedRows,
    optionProps,
    setCurrentSelect,
    removeSelectRow,
    handleSelect,
    handleSelectAll
  }
}