| | |
| | | <template> |
| | | <page> |
| | | <div class="contentBox"> |
| | | <div class="breadcrumbBox"> |
| | | <span>位置:</span> |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item>个人中心</el-breadcrumb-item> |
| | | <el-breadcrumb-item>{{ label }}</el-breadcrumb-item> |
| | | </el-breadcrumb> |
| | | </div> |
| | | <el-divider /> |
| | | <div class="personalPage clear"> |
| | | <div class="leftList fl"> |
| | | <ul class="menu"> |
| | | <li |
| | | v-for="item in listMenu" |
| | | :key="item.key" |
| | | @click="goRouter(item)" |
| | | :class="`/${item.path}` === path ? 'activeItem hover' : 'menuItem hover'" |
| | | <div class="contentBox"> |
| | | <div class="breadcrumbBox"> |
| | | <span>位置:</span> |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item>个人中心</el-breadcrumb-item> |
| | | <el-breadcrumb-item>{{ label }}</el-breadcrumb-item> |
| | | </el-breadcrumb> |
| | | </div> |
| | | <el-divider style="margin: 5px 0;" /> |
| | | <div class="personalPage clear"> |
| | | <div class="leftList fl"> |
| | | <ul class="menu"> |
| | | <li |
| | | v-for="item in listMenu" |
| | | :key="item.key" |
| | | @click="goRouter(item)" |
| | | :class="`/${item.path}` === path ? 'activeItem hover' : 'menuItem hover'" |
| | | > |
| | | <span |
| | | :style="{ |
| | | fill: `/${item.path}` === path ? '#fff' : '#000', |
| | | }" |
| | | v-html="item.icon" |
| | | > |
| | | <span |
| | | :style="{ |
| | | fill: `/${item.path}` === path ? '#fff' : '#000', |
| | | }" |
| | | v-html="item.icon" |
| | | > |
| | | </span> |
| | | <span>{{ item.label }}</span> |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | <div class="rightContent"> |
| | | <div> |
| | | <!-- 让主体做子路由的显示 --> |
| | | <router-view /> |
| | | </div> |
| | | </span> |
| | | <span>{{ item.label }}</span> |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | <div class="rightContent"> |
| | | <div> |
| | | <!-- 让主体做子路由的显示 --> |
| | | <router-view /> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </page> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup lang="ts"> |
| | |
| | | }) |
| | | return false |
| | | } |
| | | // if (userInfo.role == 'Teacher') { |
| | | // const data: any = menu.filter((item) => item.path != 'myClass') |
| | | // listMenu.value = data |
| | | // } else { |
| | | // const data: any = menu.filter((item) => item.path != 'myCourse') |
| | | // listMenu.value = data |
| | | // } |
| | | listMenu.value = menu |
| | | if (userInfo.role == 'Teacher') { |
| | | const data: any = menu.filter((item) => item.path != 'myClass') |
| | | listMenu.value = data |
| | | } else { |
| | | const data: any = menu.filter((item) => item.path != 'myCourse') |
| | | listMenu.value = data |
| | | } |
| | | }) |
| | | const goRouter = (item: any) => { |
| | | if (!localStorage.getItem(config.tokenKey) || localStorage.getItem(config.tokenKey) == null) { |
| | |
| | | } |
| | | </script> |
| | | <style lang="less" scoped> |
| | | .homePage { |
| | | min-width: 1220px; |
| | | min-height: calc(100vh - 61.8%); |
| | | background-color: #fff; |
| | | padding-bottom: 100px; |
| | | } |
| | | .breadcrumbBox { |
| | | display: flex; |
| | | padding: 20px; |
| | |
| | | border-radius: 10px 10px 10px 10px; |
| | | background: #e1ebe3; |
| | | height: max-content; |
| | | background-image: url('@/assets/images/personalCenter/Account_bg.png'); |
| | | background-repeat: no-repeat; |
| | | background-position: center; |
| | | background-size: 100% 100%; |
| | | .menu { |
| | | li { |
| | | height: 50px; |