SZYGM1.0/src/views/realTime/hooks/useTableStyle.ts

import type {
  TableColumn,
  TableColumnInGroup,
  CellSlotProps
} from '../type'

type RowClassGetter = (param: {
  columns: TableColumn[] | TableColumnInGroup[]
  rowData: any
  rowIndex: number
}) => string

type CellClassGetter = (param: CellSlotProps) => string

const defaultCellClass = 'el-table-v2__cell-text'

export default function useTableStyle() {
  const rowClass: RowClassGetter = ({ columns, rowData, rowIndex }) => {
    const classes: string[] = []
    if (rowIndex <= 1) {
      classes.push('bg-gray')
    }
    if (rowIndex === 1) {
      classes.push('underline-red')
    }
    return classes.join(' ')
  }

  const cellClass: CellClassGetter = ({
    column,
    columns,
    columnIndex,
    rowData,
    rowIndex,
  }) => {
    const classes: string[] = [defaultCellClass]
    if (['4/243', '0/6'].includes(rowData[column.dataKey])) {
      classes.push('cell-warning')
    }
    if (['5/357'].includes(rowData[column.dataKey])) {
      classes.push('cell-error')
    }
    if (['flightNO'].includes(column.dataKey)) {
      classes.push('cell-click')
    }
    return classes.join(' ')
  }

  return {
    rowClass,
    cellClass,
  }
}