hz/learning-system-portal
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git synced 2025-12-09 10:56:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

修改

Browse Source
This commit is contained in:
lmj
2022-09-08 15:53:26 +08:00
parent 6d9d36f370
commit 2831de0f82
4 changed files with 190 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/images/grade.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
public/images/lvbg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 560 B

BIN
public/images/userbgimg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 98 KiB

202
src/components/UcHeader/Index.vue
View File

@@ -1,7 +1,58 @@
<template>
<div class="uc-header xcontent">
<div style="display: flex;justify-content: space-between;height: 100px;padding-top: 5px;">
<div style="display: flex;justify-content: flex-start;">
<div class="header-box" >
<div class="personalData">
<div class="uesr-avaer">
<img src="../../../public/images/Avatarwoman.png" alt="">
</div>
<div class="user-content">
<div class="content-top">
<h6>王明</h6>
<span>BOE/企划中心/数据资产部</span>
<el-button class="editbutt" icon="el-icon-edit" type="text">编辑资料</el-button>
</div>
<div class="content-bottom">
<div class="medal">
<img src="../../../public/images/grade.png" alt="">
<img src="../../../public/images/grade.png" alt="">
<img src="../../../public/images/grade.png" alt="">
</div>
<el-button class="medalbutt" type="text">更多 <i class="el-icon-d-arrow-right"></i> </el-button>
<div class="grade">
<div>LV.1</div>
<span>经验值：367</span>
</div>
</div>
</div>
</div>
<div class="learningData">
<div class="learning-info">
<div class="learning-qus">当月学习时长</div>
<div class="learning-an"><span>12.7</span>小时</div>
</div>
<div class="learning-info">
<div class="learning-qus">累计学习时长</div>
<div class="learning-an"><span>120.7.7</span>小时</div>
</div>
<div class="learning-border" ></div>
<div class="learning-info" style="margin-left:22px">
<div class="learning-qus">当月学习时长</div>
<div class="learning-an"><span>12.7</span>小时</div>
</div>
<div class="learning-info">
<div class="learning-qus">累计学习时长</div>
<div class="learning-an"><span>120.7.7</span>小时</div>
</div>
<div class="learning-border" ></div>
<div class="learning-info" style="margin-left:22px">
<div class="learning-qus">我的U币（累计）</div>
<div class="learning-an"><span>120.7.7</span>小时</div>
</div>
<div class="list">
BOE 排行榜 >>
</div>
</div>
<!-- <div style="display: flex;justify-content: flex-start;">
<div>
<img style="width: 100px;height: 100px;border-radius: 50%;border: 1px solid #f9f9f9;" :src="userInfo.avatar" v-if="userInfo.avatar !== '' ">
<div v-else class="uavatar">
@@ -19,7 +70,7 @@
</div>
<div style="height: 35px;padding-left: 5px;color:#7a7a7a;">
<span style="color: #7a7a7a;padding-right: 15px;" v-if="orgInfo">{{orgInfo}}</span>
<!-- 目前海没有实时更新的策略，暂未处理 -->
目前海没有实时更新的策略，暂未处理
<span>学习时长：{{userInfo.studyTotalH}}小时</span>
</div>
<div>
@@ -28,8 +79,8 @@
<router-link to="/manager/index"><span v-if="identity == 3 || identity == 5" :class="{identity:true,active:curIdentity==3}" @click="setCurIdentity(3)">管理员</span></router-link>
</div>
</div>
</div>
<div style="display: flex;justify-content: flex-end;padding-top: 35px;">
</div> -->
<!-- <div style="display: flex;justify-content: flex-end;padding-top: 35px;"> -->
<!-- q1没有课程表，所以这里先隐藏
<div v-if="curIdentity==2" style="padding: 0px 40px 0px 0px;color: #1EA0FA;text-align: center;">
<div><i style="font-size: 40px;" class="el-icon-date"></i> <br/>授课表</div>
@@ -54,7 +105,7 @@
<div>我的收藏</div>
</div>
</div> -->
</div>
<!-- </div> -->
</div>
</div>
</template>
@@ -100,14 +151,141 @@ import {userAvatarText,cutFullName} from "@/utils/tools.js";
</script>
<style lang="scss" scoped>
.list{
font-size: 16px;
font-weight: 600;
color: #333333;
margin-top: 20px;
}
.learningData{
flex: 1;
padding-top: 70px;
box-sizing: border-box;
margin-left: 15%;
.learning-info{
float: left;
margin-right: 22px;
.learning-qus{
font-size: 14px;
color: #666660;
margin-bottom: 24px;
}
.learning-an{
color: #999999;
font-size: 14px;
span{
font-weight: 600;
font-size: 22px;
color: #0060FF;
}
}
}
.learning-border{
width: 1px;
height: 49px;
opacity: 0.3;
border: 1px solid #AAA6A6;
float: left;
margin-top: 10px;
}
}
.content-bottom{
margin-top: 30px;
.medal{
float: left;
img{
width: 36px;
height: 40px;
margin-right: 10px;
vertical-align: top;
}
}
.medalbutt{
color: #333333;
font-size: 14px;
float: left;
margin-top: 10px;
}
.grade{
float: left;
margin-top: 10px;
div{
margin-left: 22px;
font-weight: 600;
float: left;
width: 70px;
height: 30px;
text-align: center;
line-height: 30px;
color: #9D6110 ;
background: url('../../../public/images/lvbg.png') no-repeat;
}
span{
font-size: 14px;
color: #A3680A;
line-height: 32px;
margin-left: 13px;
}
}
}
.personalData{
width: 630px;
padding-top: 40px;
padding-left: 115px;
box-sizing: border-box;
display: flex;
.uesr-avaer{
width: 120px;
height: 120px;
margin-right: 20px;
img{
width: 100%;
height: 100%;
vertical-align: top;
}
}
.user-content{
flex: 1;
.content-top{
margin-top: 15px;
line-height: 25px;
h6{
color: #333333;
font-size: 26px;
margin:0;
float: left;
}
span{
color: #999999;
font-size: 14px;
margin-left: 5px;
margin-right: 24px;
}
.editbutt{
font-size: 14px;
color: #333333;
}
}
}
}
.header-box{
display: flex;
justify-content: space-between;
height: 210px;
background: url('../../../public/images/userbgimg.png') no-repeat;
background-size:445px 210px;
background-position: right 0;
}
.uc-header{
height: 120px;
// min-width: 1366px;
// max-width: 1500px;
//width: 1500px;
//width: 1000px;
padding-top: 10px;
height: 210px;
margin: 0 auto;
// background-color: #c9c2c2;
}
.upicon{
text-align: center;