404.js

/**
 *name: 404页
 *path: /404
 *creator: zyj
 *create-date: 20200722
 *modifier:
 *modify-date:
 * */
import React, { useState, useEffect } from "react"
import { Button, Statistic } from 'antd'
import './index.scss'
import connect from '@/store/models/route/connect'

const { Countdown } = Statistic

const Page404 = ({ history, userRoute = [] }) => {

    const [time, setTime] = useState(0)
    useEffect(() => {
        setTime(Date.now() + 6000)
    }, [])

    const onFinish = () => {
        if (userRoute.length)
            history.replace(userRoute[0].childMenus[0].url)
        else
            history.replace('/')

    }
    return (
        <div className="error-box">
            <header className="login-header">
                <section className='logo-box'>
                    <img src={require('../login/images/xbd_logo.png')} width="102" height="36" alt="信巴迪logo" />
                    <span className="platform-name">卖家工作台</span>
                </section>
            </header>
            <section className="error-img" style={{ backgroundImage: `url(${require('./images/401.png')})` }}></section>
            <div style={{ marginBottom: 68 }}>
                你想要访问的页面不存在，<Countdown value={time} onFinish={onFinish} /> 秒后自动返回首页。
            </div>
            <Button type="primary" onClick={onFinish}>立即返回首页</Button>
        </div>
    )
}

export default connect(Page404)