import { Image, Text, View } from '@tarojs/components'
import { memo, useEffect, useMemo, useRef, useState } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'
import IconFont from '@/components/iconfont/iconfont'
import { alert } from '@/common/common'

interface propsObj {
  receivingStatus: Number | null
  onReceivingStatus?: (any, Number) => void
  obj?: any
  navSelect?: (any) => void
  showBtn?: boolean
  showWhatFont?: string
}
const AddressDetailBox = (props: propsObj) => {
  const {
    receivingStatus = null,
    onReceivingStatus,
    obj = {},
    navSelect,
    showBtn = true,
    showWhatFont = '',
  } = props

  return (
    <View className={styles.addressBox}>
      <View className={styles.topBox} onClick={() => navSelect?.(obj)}>
        <View className={styles.cirle}>
          <IconFont name="icon-cangku1" size={60}></IconFont>
        </View>
        {
          receivingStatus == 1 && <View className={styles.address}>{obj.take_goods_address || '中华人民共和国广东省佛山市禅城区陆盈纺织仓库'}</View>
        }
        {
          (obj?.province_name != '' && receivingStatus == 2)
                    && <View className={styles.address}>{obj?.province_name}{obj?.city_name}{obj?.district_name}{obj?.address_detail}</View>
        }
        {
          (obj?.province_name == '' && receivingStatus == 2)
                    && <View className={styles.address}></View>
        }
        {
          receivingStatus !== 1
                    && <IconFont name="icon-chakanquanbukehu" size={50} ></IconFont>
        }
      </View>
      <View className={styles.line}></View>
      <View className={styles.bottom}>
        <View className={styles.leftbottom}>
          <View className={styles.name}>{receivingStatus === 1 ? '谭先生' : obj.target_user_name}</View>
          <View className={styles.phone}>{receivingStatus === 1 ? 13242128982 : obj.purchaser_phone}</View>
        </View>
        {
          showBtn && <View className={styles.reatBox}>
            <View className={styles.updateBtn}>
              <View className={styles.updateBtn_list}>
                <View className={classnames(styles.updateBtn_item, receivingStatus == 1 && styles.updateBtn_item_select)} onClick={e => onReceivingStatus?.(e, 1)}>
                      自提
                </View>
                <View className={classnames(styles.updateBtn_item, receivingStatus == 2 && styles.updateBtn_item_select)} onClick={e => onReceivingStatus?.(e, 2)}>
                      物流
                </View>
              </View>
              <View style={{ transform: receivingStatus == 1 ? 'translateX(0)' : 'translateX(100%)' }} className={classnames(styles.updateBtn_select)}></View>
            </View>
          </View>
        }
        {
          !showBtn && <View className={styles.reatName}>{showWhatFont}</View>
        }
      </View>
    </View >
  )
}
export default memo(AddressDetailBox)
