import React, { useState } from 'react'
import useRequest from '@ahooksjs/use-request'

import { message, Modal, Tooltip } from 'antd'
import SuccessSvg from 'assets/success.svg'
import TipsSvg from 'assets/tips2.svg'

import NButton from 'components/NButton/NButton'
import { MaterialService } from '../../Material/Material.service'
import { useLogin2p } from 'Login2p/Login2pContext'
import { ITryType } from '../../Material/components/NoPermission'
import PayProcessModel from 'Material/components/PayProcessModel'
import { IActivityTypeDetailRes } from 'Activity/Activity.service'
import styles from '../css/NoPermission.module.scss'

interface IYiDongModelProps {
  visible: boolean
  dataInfo: IActivityTypeDetailRes
  handleClose: () => void
  onRefresh: () => void
}

/**
 * 易懂提示弹框 不需要了（废弃
 */
const YiDongModel: React.FC<IYiDongModelProps> = props => {
  const { visible, dataInfo, handleClose, onRefresh } = props
  const login2p = useLogin2p()

  const [visibleApply, setVisibleApply] = useState(false) // 普通申请权限弹框
  const [visibleBuyCard, setVisibleBuyCard] = useState(false) // 购买畅读卡弹框

  const { run } = useRequest(MaterialService.postApplyTry, {
    manual: true,
    onSuccess: res => {
      res.data.Ret === 200 ? message.success('已提交给您的对口销售，请耐心等待。') : message.info(res.data.Msg)
      handleToClose()
    }
  })
  const handleToClose = () => {
    // 关闭前把名片给清除了
    handleClose()
  }
  const handleBackClose = () => {
    //
    handleClose()
  }
  return (
    <>
      <Modal
        open={visible}
        centered={true}
        onCancel={handleToClose}
        destroyOnClose={true}
        maskClosable={false}
        title="提示"
        footer={null}
      >
        <div className={styles['paymodel-content-wrapper']}>
          <div className="paymodel-title">
            <img src={SuccessSvg} alt="图标" className="paymodel-success-icon" />
            <span>畅读卡购买成功</span>
            <span>支付成功</span>
          </div>
          <div className="paymodel-text">您暂无权限参与此活动，</div>
          <div className="paymodel-text">
            <span>您可以购买畅读卡后参与</span>
            <span className="paymodel-redtext">（¥99/日，¥999/月）</span>
            <Tooltip
              title={
                <div>
                  注释：畅读卡有效期内，可查阅无限量调研纪要及常规研选专栏，
                  参与所有公开活动（日卡自付费完成顺延24小时，月卡自付费完成当天顺延一个自然月）
                </div>
              }
            >
              <img src={TipsSvg} alt="icon" className="paymodel-tips-icon" />
            </Tooltip>
          </div>

          <div className="paymodel-text">或者向销售申请开通机构试用</div>
        </div>
        <div className={styles['paymodel-footer-wrapper']}>
          <NButton type="primary" onClick={handleBackClose} size="large" className="pay-btn">
            返回活动页
          </NButton>
        </div>
      </Modal>
      {/* <PayProcessModel
        dataInfo={dataInfo}
        tryType={ITryType.Activity}
        open={visibleBuyCard}
        applyTrial={visibleApply}
        // onRefresh={onRefresh}
      /> */}
    </>
  )
}

export default YiDongModel
