import React, { useCallback, useEffect, useState } from 'react'
import styles from './index.module.scss'
import TopCom from '@/components/TopCom'
import history from '@/utils/history'
import ZFlooBtn from '@/components/ZFlooBtn'
import dayjs from 'dayjs'
import { A3_APIgetInfoByDay } from '@/store/action/all'

function A2notice() {
  const [txt, setTxt] = useState('')

  const getTxtFu = useCallback(async () => {
    const res = await A3_APIgetInfoByDay(dayjs().format('YYYY-MM-DD'))
    if (res.code === 0) {
      let obj = JSON.parse(res.data.notice)

      setTxt(obj.txtArr[0].txt)
    }
  }, [])

  useEffect(() => {
    getTxtFu()
  }, [getTxtFu])

  return (
    <div className={styles.A2notice}>
      <TopCom txt='预约须知' />

      <div className='A2main'>
        <div className='A2txt'>
          <div className='mySorrl myTextBox' dangerouslySetInnerHTML={{ __html: txt }}></div>
        </div>
        <ZFlooBtn txt='我已阅读并同意' clickFu={() => history.push('/selectDay')} />
      </div>
    </div>
  )
}

const MemoA2notice = React.memo(A2notice)

export default MemoA2notice
