import {getDefault, Ref} from '@befe/brick-utils'
import {COL_NAMES} from '../defs/types'
import {UiAside} from './ui-aside'
import {UiTimePanel} from './ui-time-panel'

export class PartialTimeCol {
    comp: UiTimePanel
    propName: typeof COL_NAMES[number]
    private readonly innerRef = new Ref<UiAside>()

    constructor(
        comp: UiTimePanel,
        propName: PartialTimeCol['propName']
    ) {
        this.comp = comp
        this.propName = propName
    }

    scrollToSelected = () => {
        if (!this.innerRef.elem) {
            return
        }

        const itemKey = this.comp.props[this.propName] as number | string
        this.innerRef.elem.scrollToItem(getDefault(itemKey, ''))
    }

    handleChange = (value: number | string) => {
        const {onChange} = this.comp.props

        // @todo:pending 本次交互, U 反馈不要点击就置顶
        // this.comp.actionQueue.pushAction(() => this.scrollToSelected())

        onChange && onChange(
            this.propName,
            value as number
        )
    }

    renderCol() {
        const itemKey = this.comp.props[this.propName]

        return (
            <UiAside
                ref={this.innerRef.ref}
                onChange={this.handleChange}
                itemKeySelected={typeof itemKey === 'undefined' ? '' : itemKey}
                asideItems={UiTimePanel.list[this.propName]}
            />
        )
    }
}