In my Login.vue file, I have login function When I click login button, it reload twice in login layout before route redirect to checkin layout. So I must click two times login button

This is my video about this error

https://youtu.be/t5OHtqjgT54

// Login.vue
<template>
    <CButton @click="onLogin()">
        Login
    </CButton>
</template>

<script>
const onLogin = async () => {
    const { data } = await axios.post('/login', data)
    window.localStorage.setItem('user-info', JSON.stringify(data.user))
    router.push('/manager/checkin')
}
</script>

In my router.js

// router/index.js

    const routes = [
        {
        path: '/',
        component: DefaultLayout,
        redirect: '/manager/checkin',
        children: [
            {
            path: '/manager/checkin',
            component: () => import('@/views/manager/Checkin.vue'),
            },
        ],
        },
        {
        path: '/pages',
        redirect: '/pages/404',
        component: {
            render() {
            return h(resolveComponent('router-view'))
            },
        },
        children: [
            {
            path: 'login',
            component: () => import('@/views/pages/Login.vue'),
            },
        ],
        },
    ]

    const router = createRouter({
        history: createWebHashHistory(process.env.BASE_URL),
        routes,
    })
    
    router.beforeEach((to, from, next) => {
        const publicPages = ['/pages/login']
        const authRequired = !publicPages.includes(to.path)
        const loggedIn = localStorage.getItem('user-info')
    
        if (authRequired && !loggedIn) {
        next('/pages/login')
        } else {
        next()
        }
    })
  
    export default router