import { Text, View } from '@tarojs/components'
import classnames from 'classnames'
import { memo, useEffect, useRef, useState } from 'react'
import styles from './index.module.scss'

interface Param {
  onSelect?: (val: number) => void
  defaultValue?: 0|1|2
}
const ShipmentMode = ({ onSelect, defaultValue = 0 }: Param) => {
  // 收货方法 0:没选择, 1:自提，2：物流
  const shipmentMode = useRef([
    { value: 1, label: '上门自提', selected: false },
    { value: 2, label: '物流', selected: false },
  ])
  const [selectValue, setSelectValue] = useState<number>()
  useEffect(() => {
    setSelectValue(defaultValue)
  }, [defaultValue])
  const selectShipmentMode = (value) => {
    setSelectValue(() => value)
    onSelect?.(value)
  }
  return (
    <View className={styles.order_title}>
      <Text>收货方式</Text>
      {shipmentMode.current.map((item, key) => {
        return <View key={key} className={classnames(styles.order_status, (selectValue == item.value) && styles.order_status_selected)} onClick={() => selectShipmentMode(item.value)}>{item.label}</View>
      })}
    </View>
  )
}
export default memo(ShipmentMode)
