import { Text, View } from '@tarojs/components'
import Taro from '@tarojs/taro'
import { memo } from 'react'
import classnames from 'classnames'
import AmountShow from '../amountShow'
import styles from './index.module.scss'
import MCheckbox from '@/components/checkbox'
import Popup from '@/components/popup'
import SearchInput from '@/components/searchInput'

interface Param {
  show?: true|false
  onClose?: () => void
  offlineInfo?: {
    account_name: string
    bank_of_deposit: string
    transfer_remittance_account: string
  }
}
const OfflinePay = ({ show = true, onClose, offlineInfo }: Param) => {
  // 复制功能
  const clipboardData = () => {
    Taro.setClipboardData({
      data: `开户名称：${offlineInfo?.account_name};\n\r 开户银行：${offlineInfo?.bank_of_deposit};\n\r 转账汇款账号：${offlineInfo?.transfer_remittance_account};`,
      success(res) {
        Taro.showToast({
          icon: 'none',
          title: '复制成功',
        })
      },
    })
  }

  const handCopy = (val) => {
    Taro.setClipboardData({
      data: val,
      success(res) {
        Taro.showToast({
          icon: 'none',
          title: '复制成功',
        })
      },
    })
  }

  return (
    <View className={styles.offlinePay_main}>
      <Popup show={show} showTitle={false} onClose={onClose} >
        <View className={styles.offlinePay_con}>
          <View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View>
          <View className={styles.title}>线下汇款</View>
          <View className={styles.topTitle}>
                请您通过网银转账，或者自行到银行进行汇款
          </View>
          <View className={styles.secondTitle}>
            <View className={styles.cricle}>!</View>
            <View className={styles.cricleFont}> 温馨提示:受银行处理影响，采用线下汇款方式到账会有延迟</View>
          </View>
          <View className={styles.offlinePay_list}>
            <SearchInput showBorder={false} title="开户名称" titleStyle={{ fontSize: '23rpx' }} hasCopy>
              <Text className={styles.offlinePay_con_text}>{offlineInfo?.account_name}</Text>
              <View className={styles.copyBtn} onClick={() => handCopy(offlineInfo?.account_name)}>复制</View>
            </SearchInput>
            <SearchInput showBorder={false} title="开户银行" titleStyle={{ fontSize: '23rpx' }} hasCopy>
              <Text className={styles.offlinePay_con_text}>{offlineInfo?.bank_of_deposit}</Text>
              <View className={styles.copyBtn} onClick={() => handCopy(offlineInfo?.bank_of_deposit)}>复制</View>
            </SearchInput>
            <SearchInput showBorder={false} title="转账汇款账号" titleStyle={{ fontSize: '23rpx' }} hasCopy>
              <Text className={styles.offlinePay_con_text}>{offlineInfo?.transfer_remittance_account}</Text>
              <View className={styles.copyBtn} onClick={() => handCopy(offlineInfo?.transfer_remittance_account)}>复制</View>
            </SearchInput>
          </View>
          <View className={styles.btns} onClick={clipboardData}>复制信息</View>
        </View>
      </Popup>
    </View>

  )
}
export default memo(OfflinePay)
