<template>
    <head-component :headinfo=headinfo></head-component>
    <div style="display: flex;flex-direction: row">
        <div class="temp" @click="jumpTo('/xjc-integratedmachine/wakeup/career_recognize/index')">
            认识生涯
        </div>
        <div class="temp" @click="jumpTo('/xjc-integratedmachine/wakeup/rainbow/paint')">
            生涯彩虹图
        </div>
        <div class="temp" @click="jumpTo('/xjc-integratedmachine/wakeup/career_maturity/index')">
            生涯成熟度测评
        </div>
        <div class="temp" @click="jumpTo('/xjc-integratedmachine/wakeup/career_example/index')">
            生涯榜样
        </div>
        <div class="temp" @click="jumpTo('/xjc-integratedmachine/wakeup/career_cinema/index')">
            生涯影院
        </div>

    </div>
</template>

<script setup>
    import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'


    const router = useRouter()

    let headinfo =ref({})
    function setHeadinfo(){
        headinfo.value = {
            title: '生涯唤醒学习系统',
            user: {
                avatar: '头像路径',
                nickName: '张三'
            }
        }
    }


    function jumpTo(path) {
        console.log("path:",path)
        router.push({
            path: path,
            query: {name: 123}
        })
    }

    onMounted(() => {
        setHeadinfo()
    })


</script>


<style scoped>
    .temp{
       width:20vw;
        height: 10vh;
        background: #85eff5;
        border: solid 1px #a2fffc;
        border-radius: 10px;
        cursor: pointer;
    }
</style>
