import { Button, Text, View } from '@tarojs/components'
import Taro from '@tarojs/taro'
import { useState } from 'react'
import styles from './index.module.scss'
import IconFont from '@/components/iconfont/iconfont'
import Popup from '@/components/popup'
import { useSelector } from '@/reducers/hooks'
import { alert } from '@/common/common'

interface Param {
  onClose?: () => void
  show: boolean
  messageTitle?: string
  messagePath?: string
  showCard?: true|false
}
export default (props: Param) => {
  const userInfo = useSelector(state => state.userInfo)
  const makePhoneCall = () => {
    if (!userInfo?.adminUserInfo?.sale_user_phone) { return alert.error('手机号不能为空') }
    Taro.makePhoneCall({
      phoneNumber: userInfo?.adminUserInfo?.sale_user_phone,
    })
  }
  const onClose = () => {
    props.onClose?.()
  }

  return <Popup show={props.show} showTitle={false} onClose={onClose}>
    <View className={styles.customer_service_list}>
      <View className={styles.customer_service_title}>
        <Text>请选择您要的服务</Text>
        {/* <Text>我们根据选择为您提供服务</Text> */}
      </View>
      <View className={styles.customer_service_con}>
        <View className={styles.customer_service_item}>
          <IconFont name="icon-guanfangweixinkefu" size={60} />
          <View className={styles.customer_service_item_con}>
            <Text>在线官方客服</Text>
            <Text>竭诚为您服务！</Text>
          </View>
          <View className={styles.customer_service_item_icon}>
            <IconFont name="icon-xiala" size={40} />
          </View>
          <Button
            className={styles.customer}
            openType="contact"
            sendMessageTitle={props.messageTitle}
            showMessageCard={props.showCard}
            sendMessagePath={props.messagePath}
          ></Button>
        </View>
        {!!userInfo?.adminUserInfo?.sale_user_phone && <View onClick={makePhoneCall} className={styles.customer_service_item}>
          <IconFont name="icon-bodakehujingli" size={60} />
          <View className={styles.customer_service_item_con}>
            <Text>客户经理</Text>
            <Text>点击拨打{userInfo?.adminUserInfo?.sale_user_phone}</Text>
          </View>
          <View className={styles.customer_service_item_icon} >
            <IconFont name="icon-xiala" size={40} />
          </View>
        </View>}
      </View>
    </View>
  </Popup>
}
