import { View } from '@tarojs/components'
import type { FC } from 'react'
import React, { memo, useEffect, useState } from 'react'
import styles from './index.module.scss'

interface PropsType {
  showModal: boolean
  children?: React.ReactNode
}

const DrawerCenter: FC<PropsType> = (props) => {
  const { children, showModal } = props

  const [show, setShow] = useState(false)

  useEffect(() => {
    setShow(showModal)
  }, [showModal])
  // 关闭
  const close = () => {
    setShow(false)
  }

  return show
    ? (
      <View className={styles.popups} catchMove>
        <View className={styles.popcoms}>{children}</View>
        <View className={styles.cover} onClick={close}></View>
      </View>
    )
    : null
}
export default memo(DrawerCenter)
