This commit is contained in:
zhaofang
2022-09-14 16:37:46 +08:00
parent 5146759a08
commit 03c7d17095
5 changed files with 94 additions and 52 deletions

View File

@@ -60,8 +60,8 @@
<div class="person-action" > <div class="person-action" >
<!-- 消息 --> <!-- 消息 -->
<el-link v-if="current == 'qa'" class="person-action-index" type="primary" style="margin-right:10px; color:#333;" :href="`${webBaseUrl}${isTiao ? '/uc/study/task' : '/uc/study/courses'}`" :underline="false">个人中心</el-link> <!-- <el-link v-if="current == 'qa'" class="person-action-index" type="primary" style="margin-right:10px; color:#333;" :href="`${webBaseUrl}${isTiao ? '/uc/study/task' : '/uc/study/courses'}`" :underline="false">个人中心</el-link>
<el-link v-else class="person-action-index" type="primary" style="margin-right:10px; color:#fff;" :href="`${webBaseUrl}${isTiao ? '/uc/study/task' : '/uc/study/courses'}`" :underline="false">个人中心</el-link> <el-link v-else class="person-action-index" type="primary" style="margin-right:10px; color:#fff;" :href="`${webBaseUrl}${isTiao ? '/uc/study/task' : '/uc/study/courses'}`" :underline="false">个人中心</el-link> -->
<!-- <el-link type="primary" @click="logout()" icon="el-icon-switch-button" :underline="false">退出</el-link> --> <!-- <el-link type="primary" @click="logout()" icon="el-icon-switch-button" :underline="false">退出</el-link> -->
<el-badge class="person-action-index message-count" :value="userMsg" :hidden="userMsg == 0"> <el-badge class="person-action-index message-count" :value="userMsg" :hidden="userMsg == 0">
<el-tooltip content="消息" placement="bottom" effect="light" :visible-arrow="false" popper-class="text-tooltip"> <el-tooltip content="消息" placement="bottom" effect="light" :visible-arrow="false" popper-class="text-tooltip">
@@ -94,6 +94,12 @@
</div> </div>
<div v-if="current == 'qa'" style="color:#000;font-size: 16px;font-weight: 600;">{{userInfo.name}}</div> <div v-if="current == 'qa'" style="color:#000;font-size: 16px;font-weight: 600;">{{userInfo.name}}</div>
<div v-else style="color:#fff;font-size: 16px;font-weight: 600;">{{userInfo.name}}</div> <div v-else style="color:#fff;font-size: 16px;font-weight: 600;">{{userInfo.name}}</div>
<div v-if="current == 'qa'" class="person-action-index" style="color:#000" @click="logout()">
<svg-icon style="margin-right: 4px;font-size:22px;" icon-class="black-out"></svg-icon>登出
</div>
<div v-else class="person-action-index" style="color:#fff" @click="logout()">
<svg-icon style="margin-right: 4px;font-size:22px;color: #000;" icon-class="white-out"></svg-icon>登出
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -36,25 +36,25 @@
<div class="learningData"> <div class="learningData">
<div class="learning-info"> <div class="learning-info">
<div class="learning-qus">当月学习时长</div> <div class="learning-qus">当月学习时长</div>
<div class="learning-an"><span>12.7</span>小时</div> <div class="learning-an"><span>{{uinfo.monthStudy}}</span>小时</div>
</div> </div>
<div class="learning-info"> <div class="learning-info">
<div class="learning-qus">累计学习时长</div> <div class="learning-qus">累计学习时长</div>
<div class="learning-an"><span>120.7.7</span>小时</div> <div class="learning-an"><span>{{uinfo.monthTotal}}</span>小时</div>
</div> </div>
<div class="learning-border" ></div> <div class="learning-border" ></div>
<div class="learning-info" style="margin-left:22px"> <div class="learning-info" style="margin-left:22px">
<div class="learning-qus">当月学习天数</div> <div class="learning-qus">当月学习天数</div>
<div class="learning-an"><span>12.7</span>小时</div> <div class="learning-an"><span>{{uinfo.monthDay}}</span>小时</div>
</div> </div>
<div class="learning-info"> <div class="learning-info">
<div class="learning-qus">累计学习天数</div> <div class="learning-qus">累计学习天数</div>
<div class="learning-an"><span>120.7.7</span></div> <div class="learning-an"><span>{{uinfo.monthTotalDay}}</span></div>
</div> </div>
<div class="learning-border" ></div> <div class="learning-border" ></div>
<div class="learning-info" style="margin-left:22px"> <div class="learning-info" style="margin-left:22px">
<div class="learning-qus">我的U币累计</div> <div class="learning-qus">我的U币累计</div>
<div class="learning-an"><span>120.7.7</span></div> <div class="learning-an"><span>{{uinfo.uCurrency}}</span></div>
</div> </div>
<div class="list"> <div class="list">
BOE 排行榜 >> BOE 排行榜 >>
@@ -115,7 +115,7 @@
<script> <script>
import {userAvatarText,cutFullName} from "@/utils/tools.js"; import {userAvatarText,cutFullName} from "@/utils/tools.js";
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
// import apiUserstart from '@/api/modules/userstart.js' import apiStart from '@/api/phase2/stat.js'
export default { export default {
name: 'UcHeader', name: 'UcHeader',
computed:{ computed:{
@@ -127,7 +127,13 @@ import {userAvatarText,cutFullName} from "@/utils/tools.js";
data(){ data(){
return { return {
fileBaseUrl:process.env.VUE_APP_FILE_BASE_URL, fileBaseUrl:process.env.VUE_APP_FILE_BASE_URL,
uinfo:{}, uinfo:{
monthStudy:0,//当月学习时长
monthTotal: 0,
monthDay:0,
monthTotalDay:0,
uCurrency:0
},
orgInfo:'', orgInfo:'',
sex:'', sex:'',
} }
@@ -145,12 +151,23 @@ import {userAvatarText,cutFullName} from "@/utils/tools.js";
}, },
methods:{ methods:{
getInfo(){ getInfo(){
// let data = { apiStart.userTotal(this.userInfo.aid,[10,11,30]).then(res=>{
// statType:'10,11' if(res.status == 200 && res.result.length > 0) {
// } res.result.forEach(item => {
// apiUserstart.user(data).then(res=>{ if(item.statType == 10) {
this.uinfo.monthStudy = item.months;
// }) this.uinfo.monthTotal = item.total;
}
if(item.statType == 11) {
this.uinfo.monthDay = item.months;
this.uinfo.monthTotalDay = item.total;
}
if(item.statType == 30) {
this.uinfo.uCurrency = item.total;
}
});
}
})
}, },
setCurIdentity(iden){ setCurIdentity(iden){
this.$store.dispatch('SetCurIdentity',iden); this.$store.dispatch('SetCurIdentity',iden);

View File

@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>退出</title>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="13.课程播放页-课程单元" transform="translate(-1807.000000, -22.000000)" stroke="#000000" stroke-width="2">
<g id="退出" transform="translate(1807.000000, 22.000000)">
<path d="M11.3137085,20.3137085 C15.7319865,20.3137085 19.3137085,16.7319865 19.3137085,12.3137085 C19.3137085,10.3536403 18.6088075,8.55821065 17.4386806,7.16709457 C15.9711717,5.42243316 13.7719183,4.3137085 11.3137085,4.3137085 C8.56063442,4.3137085 6.13236685,5.70437052 4.69305124,7.82154913 C3.8224775,9.10213004 3.3137085,10.6485046 3.3137085,12.3137085" id="椭圆形" transform="translate(11.313708, 12.313708) rotate(-225.000000) translate(-11.313708, -12.313708) "></path>
<line x1="11.3137085" y1="2.95851626" x2="11.3137085" y2="7.41342758" id="路径-13" stroke-linecap="round" stroke-linejoin="round"></line>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>退出</title>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="13.课程播放页-课程单元" transform="translate(-1807.000000, -22.000000)" stroke="#FFFFFF" stroke-width="2">
<g id="退出" transform="translate(1807.000000, 22.000000)">
<path d="M11.3137085,20.3137085 C15.7319865,20.3137085 19.3137085,16.7319865 19.3137085,12.3137085 C19.3137085,10.3536403 18.6088075,8.55821065 17.4386806,7.16709457 C15.9711717,5.42243316 13.7719183,4.3137085 11.3137085,4.3137085 C8.56063442,4.3137085 6.13236685,5.70437052 4.69305124,7.82154913 C3.8224775,9.10213004 3.3137085,10.6485046 3.3137085,12.3137085" id="椭圆形" transform="translate(11.313708, 12.313708) rotate(-225.000000) translate(-11.313708, -12.313708) "></path>
<line x1="11.3137085" y1="2.95851626" x2="11.3137085" y2="7.41342758" id="路径-13" stroke-linecap="round" stroke-linejoin="round"></line>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -4,12 +4,12 @@
<div class="xtop-content xcontent"> <div class="xtop-content xcontent">
<div class="xtop-left"> <div class="xtop-left">
<!-- <div> --> <!-- <div> -->
<router-link class="routerLink" to="/index"><img src="../../../assets/logo/logo2.png" style="width:240px;height: 30px;" /></router-link> <router-link class="routerLink" to="/index"><img src="../../../assets/logo/logo2.png" style="width:240px;height: 40px;" /></router-link>
<!-- </div> --> <!-- </div> -->
<div class="xtop-nav"> <div class="xtop-nav">
<div><a :href="`${webBaseUrl}/index`">首页</a></div> <div><a :href="`${webBaseUrl}/index`">首页</a></div>
<div><a :href="`${webBaseUrl}/course`">课程</a></div> <div><a :href="`${webBaseUrl}/course`">课程</a></div>
<div><a :href="`${webBaseUrl}/case`">案例</a></div>
<div><a :href="`${webBaseUrl}/article`">文章</a></div> <div><a :href="`${webBaseUrl}/article`">文章</a></div>
<div><a :href="`${webBaseUrl}/qa`">问答</a></div> <div><a :href="`${webBaseUrl}/qa`">问答</a></div>
<div> <div>
@@ -24,29 +24,42 @@
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</div> </div>
<div><a :href="`${webBaseUrl}/case`">推荐案例</a></div>
<div><a :href="`${webBaseUrl}/follow`">我的关注</a></div>
</div> </div>
</div> </div>
<div class="xtop-right" style="display: flex;justify-content: flex-end;align-items: center;"> <div class="xtop-right" style="display: flex;justify-content: flex-end;align-items: center;">
<div style="margin-left:250px;margin-right:50px;"> <!-- <div style="margin-left:250px;margin-right:50px;"> -->
<el-input placeholder="搜索" style="width: 260px;border-radius: 20px !important;" @keyup.enter.native="searchJump()" clearable maxlength="50" v-model="keyword" class="input-with-select"> <!-- <el-input placeholder="搜索" style="width: 260px;border-radius: 20px !important;" @keyup.enter.native="searchJump()" clearable maxlength="50" v-model="keyword" class="input-with-select">
<el-select v-model="findType" style="width: 75px;" slot="prepend" placeholder="请选择"> <el-select v-model="findType" style="width: 75px;" slot="prepend" placeholder="请选择">
<el-option label="课程" value="1"></el-option> <el-option label="课程" value="1"></el-option>
<el-option label="案例" value="2"></el-option> <el-option label="案例" value="2"></el-option>
<el-option label="文章" value="3"></el-option> <el-option label="文章" value="3"></el-option>
<el-option label="问答" value="4"></el-option> <el-option label="问答" value="4"></el-option>
<!-- <el-option label="专区" value="5"></el-option> -->
</el-select> </el-select>
<!-- <el-button slot="append" icon="el-icon-search" @click="searchJump()">搜索</el-button> -->
<el-button slot="append" icon="el-icon-search" @click="searchJump()" class="input-with-select-btn"></el-button> <el-button slot="append" icon="el-icon-search" @click="searchJump()" class="input-with-select-btn"></el-button>
</el-input> </el-input> -->
</div> <!-- </div> -->
<div> <div>
<el-badge :value="userMsg" :hidden="userMsg==0" class="message-count"> <el-badge :value="userMsg" :hidden="userMsg==0" class="message-count">
<el-link type="primary" :href="`${webBaseUrl}/message`" target="_blank" icon="el-icon-message-solid" :underline="false"></el-link> <!-- <el-link type="primary" :href="`${webBaseUrl}/message`" target="_blank" icon="el-icon-message-solid" :underline="false"></el-link> -->
<svg-icon style="margin-right: 0;font-size:26px;" icon-class="messfff"></svg-icon>
</el-badge> </el-badge>
</div> </div>
<div style="margin-left: 50px;"><el-avatar :src="userInfo.avatar" style="vertical-align: middle;width:28px;height:28px;margin-right:2px;"></el-avatar></div> <el-dropdown class="person-action-index" style="margin-left: 44px;">
<div style="margin-left: 5px;"> <span class="el-dropdown-link">
<span v-if="current == 'qa'" style="color: #333;">学员</span>
<span v-else style="color: #fff;">学员</span><i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>学员</el-dropdown-item>
<el-dropdown-item>教师</el-dropdown-item>
<el-dropdown-item>管理员</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<div style="margin-left: 50px;color: #fff;"><el-avatar :src="userInfo.avatar" style="vertical-align: middle;width:40px;height:40px;margin-right:10px;"></el-avatar>{{userInfo.name}}</div>
<!-- <div style="margin-left: 5px;">
<el-dropdown @command="handleUcCommand"> <el-dropdown @command="handleUcCommand">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
{{userInfo.name}}<i class="el-icon-arrow-down el-icon--right"></i> {{userInfo.name}}<i class="el-icon-arrow-down el-icon--right"></i>
@@ -55,25 +68,10 @@
<el-dropdown-item command="logout">退出</el-dropdown-item> <el-dropdown-item command="logout">退出</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</div> </div> -->
<div class="person-action"> <div class="person-action">
<el-badge :value="userMsg" :hidden="userMsg == 0" class="message-count"> <el-button @click="logout()" type="text"><svg-icon style="margin-right: 4px;font-size:22px;color: #000;" icon-class="white-out"></svg-icon>退出</el-button>
<el-link type="primary" :href="`${webBaseUrl}/message`" icon="el-icon-bell" :underline="false"></el-link>
</el-badge>
<!-- <el-avatar :src="userInfo.avatar"></el-avatar> -->
<!-- <el-link type="primary" :href="`${webBaseUrl}${isTiao ? '/uc/study/task' : '/uc/study/courses'}`" :underline="false">个人中心</el-link> -->
<el-button @click="logout()" type="text" icon="el-icon-switch-button">退出</el-button>
</div> </div>
<!-- <ul>
<li @mouseover="mouseOver(1)" @mouseleave="mouseLeave(1)" :class="{ xactive: mouseIndex == 1 }">
<el-badge :value="userMsg" :hidden="userMsg==0" style="margin-top: 10px;margin-right: -10px;">
<el-link type="primary" :href="`${webBaseUrl}/message`" target="_blank" icon="el-icon-bell" style="margin-top: -10px;" :underline="false">消息</el-link>
</el-badge>
</li>
<li @mouseover="mouseOver(9)" @mouseleave="mouseLeave(9)" :class="{ xactive: mouseIndex == 9 }" style="padding-right: 10px;">
<el-button @click="logout()" type="text" icon="el-icon-switch-button">退出</el-button>
</li>
</ul> -->
</div> </div>
</div> </div>
</div> </div>
@@ -332,8 +330,8 @@ export default {
justify-content: space-between justify-content: space-between
} }
.xtop { .xtop {
height: 56px; height: 72px;
line-height: 56px; line-height: 72px;
background-color: #302F33; background-color: #302F33;
position: fixed; position: fixed;
top: 0px; top: 0px;
@@ -345,11 +343,9 @@ export default {
border-bottom: 1px solid #e9e9e9; border-bottom: 1px solid #e9e9e9;
z-index: 9999; z-index: 9999;
.xtop-content{ .xtop-content{
//width: 1500px; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center;
} }
} }
.xtop .xtop-left { .xtop .xtop-left {
@@ -365,24 +361,23 @@ export default {
.xtop-nav { .xtop-nav {
display: flex; display: flex;
justify-content: flex-start; // justify-content: flex-start;
a{ a{
display: inline-block; display: inline-block;
} }
} }
.xtop-nav > div { .xtop-nav > div {
line-height: 56px; line-height:72px;
padding: 0px 24px; padding: 0px 24px;
color: #fff; color: #fff;
} }
.xtop .xtop-right { .xtop .xtop-right {
float: right;
.person-action{ .person-action{
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
margin-left: 100px; margin-left: 44px;
::v-deep .message-count{ ::v-deep .message-count{
margin-right: 30px; margin-right: 30px;
i{ i{