/* eslint-disable @typescript-eslint/no-unused-vars */
import type { InputProps, PopoverProps } from 'element-plus'
import type { PropType } from 'vue'
import type { TableConfig } from './types'

export const tableSelectProps = {
  // 绑定值
  modelValue: {
    type: [String, Number, Array],
    default: ''
  },
  // 是否多选
  multiple: Boolean,
  // 是否禁用
  disabled: Boolean,
  // 尺寸
  size: {
    type: String as PropType<InputProps['size']>,
    default: 'default'
  },
  // 是否支持清除
  clearable: {
    type: Boolean,
    default: true
  },
  // input 的 autocomplete 属性
  autocomplete: String,
  // value 的属性名
  valueKey: {
    type: String,
    default: 'id'
  },
  // label 的属性名
  labelKey: {
    type: String,
    default: 'label'
  },
  // 回显数据，用于后段分页显示
  initValue: [Object, Array],
  // 气泡位置
  placement: {
    type: String,
    default: 'bottom-start'
  },
  // 是否在输入框获得焦点后自动弹出选项菜单
  automaticDropdown: Boolean,
  // 占位符
  placeholder: {
    type: String,
    default: '请选择'
  },
  // popover 宽度
  popperWidth: {
    type: [String, Number],
    default: 560
  },
  // popover 样式
  popperClass: String,
  // popover 配置项
  popperOptions: Object as PropType<PopoverProps['popperOptions']>,
  // 表格配置
  tableConfig: {
    type: Object as PropType<TableConfig>,
    default: {
      columns: [],
      loading: false,
      data: [],
      total: 0
    }
  }
}

export type TableSelectProps = ExtractPropTypes<typeof tableSelectProps>

/**
 * 事件
 */
export const tableSelectEmits = {
  // 更新绑定值
  'update:modelValue': (_value: any) => true,
  // 清除按钮点击事件
  clear: () => true,
  // 多选单个清除事件
  'item-clear': (_value: object) => true,
  // 获取焦点事件
  focus: (_e: FocusEvent) => true,
  // 失去焦点事件
  blur: (_e: FocusEvent) => true,
  // 输入框值改变事件
  change: (_value: string | Array<any>) => true
}