import { View } from '@tarojs/components'
import Taro, { useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro'
import React, { ReactNode, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'
import { alert } from '@/common/common'
import { formatDateTime, formatPriceDiv, formatWeightDiv } from '@/common/format'
import IconFont from '@/components/iconfont/iconfont'
import Tag from '@/components/tag'

interface Props {
  obj: any
  sortId: number | string
}
const ItemList = (props: Props) => {
  const handPhone = (e) => {
    e.stopPropagation()
    Taro.makePhoneCall({
      phoneNumber: props.obj?.real_phone,
    })
  }

  const handNav = () => {
    Taro.navigateTo({
      url: `/pages/customerDetails/index?purchaser_id=${props.obj?.id}`,
    })
  }

  const time = useMemo(() => {
    if (props?.sortId == '' || !props?.sortId) {
      return props?.obj?.recent_order_time
    }
    if (props?.sortId == 1 || props?.sortId == -1) {
      return props?.obj?.recent_order_time
    }
    if (props?.sortId == 2 || props?.sortId == -2) {
      return props?.obj?.create_time
    }
    if (props?.sortId == 3 || props?.sortId == -3) {
      return props?.obj?.update_time
    }
  }, [props?.sortId])

  const timeFont = useMemo(() => {
    if (props?.sortId == '' || !props?.sortId) {
      return '下单时间'
    }
    if (props?.sortId == 1 || props?.sortId == -1) {
      return '下单时间'
    }
    if (props?.sortId == 2 || props?.sortId == -2) {
      return '创建时间'
    }
    if (props?.sortId == 3 || props?.sortId == -3) {
      return '更新时间'
    }
  }, [props?.sortId])

  return (
    <View className={styles.mainItem} onClick={() => handNav()}>
      <View className={styles.itemTop}>
        <View className={styles.itemLeft}>
          <View className={styles.leftSafe}>
            <View className={styles.itemCile}>{props.obj.name[0]}</View>
          </View>
          <View className={styles.item_top_one}>
            <View className={styles.item_top_one_flex}>
              <View className={styles.itemName}>{props.obj.name}</View>
              <View className={styles.itemPhone}>{props.obj.phone}</View>
            </View>
            <View className={styles.item_tag_box}>
              <Tag type="primary" size="normal" circle customClassName={styles.item_tagItem}>
                {props.obj.purchaser_type_name || '暂无'}
              </Tag>
              <Tag type="primary" size="normal" circle customClassName={styles.item_tagItem}>
                {props.obj.sale_user_name || '暂无'}
              </Tag>
              {
                props.obj?.label_list?.map((item, key) => {
                  return (
                    <Tag type="primary" key={key} size="normal" circle customClassName={styles.item_tagItem}>
                      {item.label_name}
                    </Tag>
                  )
                })
              }
            </View>
          </View>
        </View>
        <View className={styles.itemRight} onClick={e => handPhone(e)}>

          <IconFont name="icon-dianhua" size={30} color="#337FFF"></IconFont>
          <View className={styles.phoneFont}>联系TA</View>
        </View>
      </View>
      <View className={styles.line}></View>
      <View className={styles.flex_bottom}>
        <View className={styles.flex_left}>{props.obj.default_address.province_name + props.obj.default_address.city_name + props.obj.default_address.district_name || '暂无'}</View>
        <View className={styles.flex_right}>{timeFont}：{formatDateTime(time, 'YYYY-MM-DD HH:mm') || '暂无'}</View>
      </View>
    </View >
  )
}
export default memo(ItemList)
