course_resource/src/components/admin/adminHeader.vue

<template>
    <div class="admin_header ">
        <div class="img_text_middle">
            <el-button @click="goBack()">返回人工智能专栏</el-button>
            <img :src="userImg" alt="">
            <span>{{ userName }}</span>
        </div>
    </div>
</template>
<script setup>
import { ref, watchEffect } from 'vue';
import userImg from '@/assets/img/user.png'
import { userInfoStore } from '@/stores/counter'

// U.MD.D.I.openInApplication('teacher')  教师管理
const user = userInfoStore()
const userName = ref('userName')
const goBack = () => {
    top.location.href = "https://zy.szedu.cn/ai/"
}
watchEffect(() => {
    if (JSON.stringify(user.user) != "{}") {
        userName.value = user.user.userName
    }
})
</script>
<style lang="scss" scoped>
.admin_header {
    width: 100%;
    padding: 12px 36px;
    height: 60px;

    .img_text_middle {
        float: right;
        img{
            margin: 0 8px 0 30px;
        }
    }

    .el-button {
        background: rgba(54, 129, 252, 1);
        color: #fff;
    }
}
</style>