import { ScrollView, View } from '@tarojs/components'
import Taro from '@tarojs/taro'
import { memo, useCallback, useEffect, useMemo, useState } from 'react'
import classnames from 'classnames'
import { navigateTo } from '@tarojs/router'
import styles from './index.module.scss'
// import BottomBtns from '@/components/BottomBtns'
import { formatDateTime, formatPriceDiv } from '@/common/format'

interface Params {
  obj: any
}
const ItemList = (pros: Params) => {
  const navTo = () => {
    Taro.navigateTo({
      url: `/pages/collectionDetail/index?id=${pros.obj.id}`,
    })
  }

  const styleColor = useMemo(() => {
    if (pros.obj.auditor_status_name == '待审核') {
      return '#E42945'
    }
    else if (pros.obj.auditor_status_name == '已审核') {
      return '#337FFF'
    }
    else if (pros.obj.auditor_status_name == '已拒绝') {
      return '#000000'
    }
  }, [pros.obj])

  return (
    <View className={styles.itemBox}>
      <View className={styles.itemTop}>
        <View className={styles.itemTopLeft}>{pros.obj.purchaser_name}</View>
        <View className={styles.itemTopRight} style={{ color: styleColor }}>{pros.obj.auditor_status_name}</View>
      </View>
      <View className={styles.flexBox}>
        <View className={styles.flexLeft1}>转账金额：</View>
        <View className={styles.flexRight1}>￥{formatPriceDiv(pros.obj.receipt_amount)}</View>
      </View>
      <View className={styles.flexBox}>
        <View className={styles.flexLeft}>待认款金额：</View>
        <View className={styles.flexRight}>￥{formatPriceDiv(pros.obj.pending_distribute_amount)}</View>
      </View>
      <View className={styles.flexBox}>
        <View className={styles.flexLeft}>收款时间：</View>
        <View className={styles.flexRight}>{formatDateTime(pros.obj.create_time)}</View>
      </View>
      <View className={styles.btnAnd} onClick={() => navTo()}>查看详情</View>
    </View>
  )
}
export default memo(ItemList)
