import React from 'react'
import List from 'antd-mobile/es/list'
import WeekDayPicker from '../week-day-picker'
import { ChineseWeekDay } from '../calendar'

export interface WeekDayPickerItemProps {
  value?: number
  onChange?: (value: number) => void
  children?: React.ReactNode
}

export default class WeekDayPickerItem extends React.Component<
  WeekDayPickerItemProps
> {
  public render() {
    const { children, ...props } = this.props
    return (
      <WeekDayPicker {...props}>
        {(value, onClick) => (
          <List.Item
            arrow="horizontal"
            extra={'星期' + ChineseWeekDay[value]}
            onClick={onClick}
          >
            {children}
          </List.Item>
        )}
      </WeekDayPicker>
    )
  }
}