import { Ref } from 'vue'
import { CommonTableColumn } from '~/common'

export function useTableColumnSet(tableColumns: Ref<CommonTableColumn[]>) {
  const filterColumnKeys = ref<string[]>([])
  const filteredColumns = ref<CommonTableColumn[]>([])
  watch(filterColumnKeys, keys => {
    ;(filteredColumns.value = tableColumns.value.filter(column => {
      if (column.needShow && keys.includes(column.columnName)) {
        column.hidden = false
        return column
      } else {
        column.hidden = true
      }
    })),
      { deep: true }
  })
  const columnChecked = (checkedColumnKeys: string[]) => {
    filterColumnKeys.value = checkedColumnKeys
  }
  return {
    filteredColumns,
    columnChecked,
  }
}
