import {onMounted, onUnmounted, ref} from "vue";
import {createRouter, createWebHashHistory, RouteRecordRaw} from "vue-router";

function getHash() {
    const hash = window.location.hash
    return hash.length > 0 ? hash.slice(1) : '';
}

export const useHash = () => {
    const hash = ref<string>(getHash())

    const onHashChange = () => {
        hash.value = getHash()
    }
    onMounted(() => {
        window.addEventListener('hashchange', onHashChange, false)
    })
    onUnmounted(() => {
        window.removeEventListener('hashchange', onHashChange, false)
    })
    return hash
}

export const routes:RouteRecordRaw[] = [
    {
        path: '',
        name: 'home',
        meta: {
            title: '输出计算',
            icon:'icon-calculator'
        },
        component: () => import('./pages/result.vue')
    },
    {
        path: 'data',
        name: 'data',
        meta: {
            title: '数据管理',
            icon:'icon-input'
        },
        component: () => import('./pages/datas.vue')
    },
    {
        path: 'user',
        name: 'user',
        component: () => import('./pages/user/index.vue'),
        meta: {
            role: 'root',
            title: '用户管理',
            icon:'icon-user'
        }
    }
]

export const router = createRouter({
    routes: [
        // 路由配置
        {
            path: '/',
            component: () => import('./pages/Layout.vue'),
            children: routes
        },
        // {
        //     path: '/login',
        //     name: 'login',
        //     component: () => import('./pages/login.vue')
        // }
    ],
    history: createWebHashHistory()
})

export default router