import React , { useEffect , useState } from 'react';
import { Modal , Button } from 'antd';
import './Index.scss';
import '../../css/index.scss';
import RenderHtml from '../../../components/render-html';
// import cookie from 'react-cookies';
import axios from 'axios';

function SystemNotice({showNotice,system_notification,history,login,hideSystemNotice}){
  const [ visible , setVisible ] = useState(false);

  useEffect(()=>{

    if((system_notification && !system_notification.is_read) && showNotice && login){
      setVisible(true);
    }
  },[system_notification,login])

  function sureContinue() {
    if(login && ( system_notification && system_notification.id )){
      const url = `/users/${login}/system_notification_histories.json`;
      axios.post(url,{
        system_notification_id:system_notification.id
      }).then(result=>{
        setVisible(false);
        hideSystemNotice();
      }).catch(error=>{
        setVisible(false);
        hideSystemNotice();
      })
    }else{
      setVisible(false);
      hideSystemNotice();
    }
    // cookie.remove('notice_stage');

    // let inFifteenMinutes = new Date(new Date().getTime() + 24 * 3600 * 1000);//一天
    // // let inFifteenMinutes = new Date(new Date().getTime() + 60 * 1000);//一分钟
    // cookie.save('notice_stage', true,{ expires: inFifteenMinutes,path:"/" });

    // setVisible(false);
  }

  return (
    <Modal
      visible = {visible}
      width="1000px"
      footer={false}
      title={false}
      centered={true}
      closable={false}
      wrapClassName={'systemBox'}
    >
      <div className="sysBox">
        <div className="sysnoticeBox">
          <p className="ntitle">{system_notification && system_notification.subject}</p>
          <p className="nSubtitle">{system_notification && system_notification.sub_subject}</p>
          {/* <div className="nContent">
            <div className="nMaindesc">
            为了给用户提供更加稳定、优质的服务，我们即将对平台门户首页、平台名称、平台域名进行一次全面升级与变更。原平台名称：Trustie（中文名：确实）将于2021年10月xx日统一更改为Gitlink（中文名：确实开源）。届时平台域名将统一进行更换，更换规则如下
            </div>
            <div className="realmName">
              <ul>
                <li>原域名：</li>
                <li>官网顶级域名https://www.trustie.net</li>
                <li>版本库子域名https://forgeplus.trustie.net</li>
                <li>论坛子域名https://forum.trustie.net/forums</li>
              </ul>
              <ul>
                <li>更换后域名：</li>
                <li>官网顶级域名https://www.gitlink.org.cn</li>
                <li>版本库子域名https://www.git.gitlink.org.cn</li>
                <li>论坛子域名https://forum.gitlink.org.cn</li>
              </ul>
            </div>
            <div className="nSubdesc">
            自2021年10月xx日起，旧域名将停止访问。因平台名称与域名变更给您带来的不便，我们深表歉意!非常感谢您一直以来对本平台的信任与支持，我们将一如既往地为您提供优质的服务。 特此通知!
            </div>
            <div className="nInfo">
              <p>Gitlink运营团队</p>
              <p>2021年10月xx日</p>
            </div>
          </div> */}
          <RenderHtml className="break_word_comments imageLayerParent" value={system_notification && system_notification.content} url={history.location}/>
          <div className="nBtn">
            <Button type="primary" className="btnblue" onClick={sureContinue}>确认并继续</Button>
          </div>
        </div>
      </div>
    </Modal>
  )
}
export default SystemNotice;