mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-09 10:56:44 +08:00
我的关注,消息中心页面
This commit is contained in:
@@ -9,12 +9,13 @@
|
||||
</h6>
|
||||
<p class="answer-text">
|
||||
假如你床头有 10 本书,你要在其中找到一本书,你会怎么找?你可能会说,扫一眼就找到了啊。假如你现在身处世界上最大的图书馆:美国国会图书馆,藏书超 2.1 亿本,现在你想在里边找某一本某某书,请问你如何找?一本一本翻吗?累死你,2.1 亿这个数字我给你换算了一下,把 2.1 亿本书铺起来可绕地球近两圈。不仅仅找书,图书馆每天还要在其中处理要在其中处要
|
||||
<span style="color:#0B4D9D;cursor:pointer;" @click.stop="changeIsAll(item)">
|
||||
<span style="color:#0B4D9D;cursor:pointer;">
|
||||
<!-- @click.stop="changeIsAll(item)" -->
|
||||
{{false?'收起':'全文展开'}}
|
||||
</span>
|
||||
</p>
|
||||
<div>
|
||||
<interactBar :type="0" :shares="false" :views="false" :data="item" :readonly="true"></interactBar>
|
||||
<interactBar :type="0" :shares="false" :views="false" :readonly="true"></interactBar>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -12,12 +12,13 @@
|
||||
</div>
|
||||
<p class="article-text">
|
||||
假如你床头有 10 本书,你要在其中找到一本书,你会怎么找?你可能会说,扫一眼就找到了啊。假如你现在身处世界上最大的图书馆:美国国会图书馆,藏书超 2.1 亿本,现在你想在里边找某一本某某书,请问你如何找?一本一本翻吗?累死你,2.1 亿这个数字我给你换算了一下,把 2.1 亿本书铺起来可绕地球近两圈。不仅仅找书,图书馆每天还要在其中处理要在其中处要
|
||||
<span style="color:#0B4D9D;cursor:pointer;" @click.stop="changeIsAll(item)">
|
||||
<span style="color:#0B4D9D;cursor:pointer;" >
|
||||
<!-- @click.stop="changeIsAll(item)" -->
|
||||
{{false?'收起':'全文展开'}}
|
||||
</span>
|
||||
</p>
|
||||
<div>
|
||||
<interactBar :type="0" :shares="false" :views="false" :data="item" :readonly="true"></interactBar>
|
||||
<interactBar :type="0" :shares="false" :views="false" :readonly="true"></interactBar>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
</span>
|
||||
</p>
|
||||
<div>
|
||||
<interactBar :type="0" :shares="false" :views="false" :data="item" :readonly="true"></interactBar>
|
||||
<interactBar :type="0" :shares="false" :views="false" :readonly="true"></interactBar>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -300,6 +300,10 @@
|
||||
<svg-icon :icon-class="activeMenu == '/user/favorites'?'stra-active':'stra'"></svg-icon>
|
||||
<span slot="title">我的收藏</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/message/center/index" v-show="curIdentity == 1">
|
||||
<svg-icon :icon-class="activeMenu == '/user/favorites'?'stra-active':'stra'"></svg-icon>
|
||||
<span slot="title">消息中心</span>
|
||||
</el-menu-item>
|
||||
|
||||
<!-- <el-submenu index="myArticle" v-show="curIdentity == 1">
|
||||
<template slot="title">
|
||||
|
||||
@@ -84,7 +84,10 @@ export const pages=[
|
||||
{title:'课程开发教程',path:'developtoolsdown',component:'tools/DeveloptoolsDown',hidden:true},
|
||||
{title:'我的U币',path:'ucurrency',component:'ucurrency/Index',hidden:true},
|
||||
{title:'我的勋章',path:'medal',component:'medal/Index',hidden:true}
|
||||
]}
|
||||
]},
|
||||
{title:'消息中心',path:'/message/center',hidden:false,children:[
|
||||
{title:'消息中心',path:'index',component:'portal/user/Message',hidden:false}
|
||||
]},
|
||||
]
|
||||
|
||||
export function routers(){
|
||||
|
||||
@@ -42,8 +42,9 @@
|
||||
<!-- </div> -->
|
||||
<div>
|
||||
<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> -->
|
||||
<svg-icon style="margin-right: 0;font-size:26px;" icon-class="messfff"></svg-icon>
|
||||
<el-link type="primary" :href="`${webBaseUrl}/message`" target="_blank" :underline="false">
|
||||
<svg-icon style="margin-right: 0;font-size:26px;" icon-class="messfff"></svg-icon>
|
||||
</el-link>
|
||||
</el-badge>
|
||||
</div>
|
||||
<el-dropdown class="person-action-index" style="margin-left: 44px;">
|
||||
|
||||
@@ -190,8 +190,8 @@ export const constantRoutes = [{
|
||||
path: '/follow',
|
||||
hidden: true,
|
||||
component: (resolve) => require(['@/views/portal/follow'], resolve),
|
||||
name: 'qaAnswer',
|
||||
meta: { title: '写回答', icon: 'dashboard', noCache: true, affix: false },
|
||||
name: 'follow',
|
||||
meta: { title: '我的关注', icon: 'dashboard', noCache: true, affix: false },
|
||||
},
|
||||
{
|
||||
path: '/study',
|
||||
|
||||
@@ -1,52 +1,50 @@
|
||||
<template>
|
||||
|
||||
<div class="home-page-left">
|
||||
<div class="book-input">
|
||||
<span>分享书籍</span>
|
||||
<el-input style="width:130px" v-model="input" placeholder="请输入内容"></el-input>
|
||||
<i style="color: #333333" class="el-icon-search"></i>
|
||||
</div>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane name="first">
|
||||
<span slot="label"><svg-icon icon-class="home-dynamic" style="font-size: 30px;"></svg-icon> <span class="tabs-info">动态</span></span>
|
||||
动态
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="second">
|
||||
<span slot="label"><svg-icon icon-class="home-course" style="font-size: 30px;"></svg-icon><span class="tabs-info">课程</span></span>
|
||||
<course-list></course-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="case">
|
||||
<span slot="label"><svg-icon icon-class="home-case" style="font-size: 30px;"></svg-icon><span class="tabs-info">案例</span></span>
|
||||
<case-list></case-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="note">
|
||||
<span slot="label"><svg-icon icon-class="home-note" style="font-size: 30px;"></svg-icon><span class="tabs-info">笔记</span></span>
|
||||
<note-list></note-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="qa">
|
||||
<span slot="label"><svg-icon icon-class="home-qa" style="font-size: 30px;"></svg-icon><span class="tabs-info">提问</span></span>
|
||||
<put-list></put-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="answer">
|
||||
<span slot="label"><svg-icon icon-class="home-answer" style="font-size: 30px;"></svg-icon><span class="tabs-info">回答</span></span>
|
||||
<answer-list></answer-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="article">
|
||||
<span slot="label"><svg-icon icon-class="home-article" style="font-size: 30px;"></svg-icon><span class="tabs-info">文章</span></span>
|
||||
<article-list></article-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="fourth">
|
||||
<span slot="label"><svg-icon icon-class="home-follow" style="font-size: 30px;"></svg-icon><span class="tabs-info">关注</span></span>
|
||||
<follow-list></follow-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="book">
|
||||
<span slot="label"><svg-icon icon-class="home-book" style="font-size: 30px;"></svg-icon><span class="tabs-info">书籍</span></span>
|
||||
<book-list></book-list>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div style="width:200px"></div>
|
||||
</div>
|
||||
|
||||
<div class="home-page-left">
|
||||
<div class="book-input">
|
||||
<span>分享书籍</span>
|
||||
<el-input style="width:130px" v-model="input" placeholder="请输入内容"></el-input>
|
||||
<i style="color: #333333" class="el-icon-search"></i>
|
||||
</div>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane name="first">
|
||||
<span slot="label"><svg-icon icon-class="home-dynamic" style="font-size: 30px;"></svg-icon> <span class="tabs-info">动态</span></span>
|
||||
动态
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="second">
|
||||
<span slot="label"><svg-icon icon-class="home-course" style="font-size: 30px;"></svg-icon><span class="tabs-info">课程</span></span>
|
||||
<course-list></course-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="case">
|
||||
<span slot="label"><svg-icon icon-class="home-case" style="font-size: 30px;"></svg-icon><span class="tabs-info">案例</span></span>
|
||||
<case-list></case-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="note">
|
||||
<span slot="label"><svg-icon icon-class="home-note" style="font-size: 30px;"></svg-icon><span class="tabs-info">笔记</span></span>
|
||||
<note-list></note-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="qa">
|
||||
<span slot="label"><svg-icon icon-class="home-qa" style="font-size: 30px;"></svg-icon><span class="tabs-info">提问</span></span>
|
||||
<put-list></put-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="answer">
|
||||
<span slot="label"><svg-icon icon-class="home-answer" style="font-size: 30px;"></svg-icon><span class="tabs-info">回答</span></span>
|
||||
<answer-list></answer-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="article">
|
||||
<span slot="label"><svg-icon icon-class="home-article" style="font-size: 30px;"></svg-icon><span class="tabs-info">文章</span></span>
|
||||
<article-list></article-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="fourth">
|
||||
<span slot="label"><svg-icon icon-class="home-follow" style="font-size: 30px;"></svg-icon><span class="tabs-info">关注</span></span>
|
||||
<follow-list></follow-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="book">
|
||||
<span slot="label"><svg-icon icon-class="home-book" style="font-size: 30px;"></svg-icon><span class="tabs-info">书籍</span></span>
|
||||
<book-list></book-list>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div style="width:200px"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<div class="follow-page">
|
||||
<top></top>
|
||||
<div>
|
||||
<div class="home-page-left">
|
||||
<div class="book-input">
|
||||
<span>分享书籍</span>
|
||||
<el-input style="width:130px" v-model="input" placeholder="请输入内容"></el-input>
|
||||
<i style="color: #333333" class="el-icon-search"></i>
|
||||
</div>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane name="first" label="动态">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-dynamic" style="font-size: 30px;"></svg-icon> <span class="tabs-info">动态</span></span> -->
|
||||
动态
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="second" label="课程">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-course" style="font-size: 30px;"></svg-icon><span class="tabs-info">课程</span></span> -->
|
||||
<course-list></course-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="case" label="案例">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-case" style="font-size: 30px;"></svg-icon><span class="tabs-info">案例</span></span> -->
|
||||
<case-list></case-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="note" label="笔记">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-note" style="font-size: 30px;"></svg-icon><span class="tabs-info">笔记</span></span> -->
|
||||
<note-list></note-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="qa" label="提问">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-qa" style="font-size: 30px;"></svg-icon><span class="tabs-info">提问</span></span> -->
|
||||
<put-list></put-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="answer" label="回答">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-answer" style="font-size: 30px;"></svg-icon><span class="tabs-info">回答</span></span> -->
|
||||
<answer-list></answer-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="article" label="文章">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-article" style="font-size: 30px;"></svg-icon><span class="tabs-info">文章</span></span> -->
|
||||
<article-list></article-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="fourth" label="关注">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-follow" style="font-size: 30px;"></svg-icon><span class="tabs-info">关注</span></span> -->
|
||||
<follow-list></follow-list>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="book" label="书籍">
|
||||
<!-- <span slot="label"><svg-icon icon-class="home-book" style="font-size: 30px;"></svg-icon><span class="tabs-info">书籍</span></span> -->
|
||||
<book-list></book-list>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div style="width:200px"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import top from '../../../layout/components/TopNav/Index.vue'
|
||||
import UcHeader from '@/components/HomePage/homePage.vue'
|
||||
import CaseList from '@/components/HomePage/caseList.vue'
|
||||
import CourseList from '@/components/HomePage/courseList.vue'
|
||||
import NoteList from "@/components/HomePage/noteList.vue"
|
||||
import PutList from "@/components/HomePage/putTo.vue"
|
||||
import AnswerList from "@/components/HomePage/answerList.vue"
|
||||
import ArticleList from "@/components/HomePage/articleList.vue"
|
||||
import FollowList from "@/components/HomePage/followList.vue"
|
||||
import BookList from "@/components/HomePage/bookList.vue"
|
||||
|
||||
export default{
|
||||
components:{top,UcHeader,CaseList,CourseList,NoteList,PutList,AnswerList,ArticleList,FollowList,BookList},
|
||||
data(){
|
||||
return{
|
||||
input:'',
|
||||
activeName:'first',
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleClick() {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.follow-page{
|
||||
background: #FFFFFF;
|
||||
padding-top: 72px;
|
||||
height: 100vh;
|
||||
::v-deep .el-tabs__active-bar{
|
||||
height: 4px;
|
||||
border-radius: 3px;
|
||||
background: #387DF7;
|
||||
margin-top: 15px;
|
||||
}
|
||||
::v-deep .el-tabs__item{
|
||||
padding: 0 30px;
|
||||
height: 55px;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
::v-deep .el-tabs__item.is-active{
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
::v-deep .el-tabs__nav-wrap::after{
|
||||
height: 1px;
|
||||
background-color: 979797;
|
||||
}
|
||||
.home-page-left{
|
||||
border-radius: 4px;
|
||||
padding-top: 29px;
|
||||
margin: 0px 20% 0 19%;
|
||||
position: relative;
|
||||
.book-input{
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
width: 250px;
|
||||
height: 40px;
|
||||
border: 1px solid rgba(153,153,153,0.5);
|
||||
border-radius: 19px;
|
||||
span{
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
padding: 0 10px 0 16px;
|
||||
border-right: 1px solid rgba($color: #999999, $alpha: 0.48);
|
||||
}
|
||||
::v-deep .el-input__inner{
|
||||
border: none !important;
|
||||
}
|
||||
::v-deep .el-icon-search{
|
||||
color: #333333 !important;
|
||||
}
|
||||
}
|
||||
// display: flex;
|
||||
.svg-icon{
|
||||
vertical-align: middle;
|
||||
}
|
||||
.tabs-info{
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
.home-page-right{
|
||||
width: 395px;
|
||||
padding: 40px 52px 18px 52px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
margin-left: 25px;
|
||||
.total-per{
|
||||
display: flex;
|
||||
// justify-content: space-between;
|
||||
padding-bottom: 28px;
|
||||
border-bottom: 1px solid rgba($color: #999999, $alpha: 0.21);
|
||||
.per-li{
|
||||
width: 90px;
|
||||
text-align: center;
|
||||
margin: 0 25px;
|
||||
.per-info{
|
||||
display: block;
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
.per-text{
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.ach-title{
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
.ach-ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
border-bottom: 1px solid rgba($color: #999999, $alpha: 0.21);
|
||||
padding-bottom: 4px;
|
||||
.ach-box{
|
||||
flex: 33%;
|
||||
width: 57px;
|
||||
text-align: center;
|
||||
margin-bottom: 18px;
|
||||
img{
|
||||
width: 52px;
|
||||
height: 58px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
p{
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.ava-info{
|
||||
display: flex;
|
||||
padding: 10px 0 30px 0;
|
||||
img{
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
.ava-text{
|
||||
padding: 2px 0;
|
||||
margin-left: 18px;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
// }
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<div>
|
||||
<Remark>
|
||||
<!-- <Remark>
|
||||
<ul>
|
||||
<li>个人觉得以单选框的形式展现应该是勾选条件而不是查询条件</li>
|
||||
</ul>
|
||||
</Remark>
|
||||
<portal-header :goSearch="10"></portal-header>
|
||||
<portal-header :goSearch="10"></portal-header> -->
|
||||
<div class="xcontent portal-content">
|
||||
<div class="msg-nav">
|
||||
<div style="display: flex;align-items: center;">
|
||||
@@ -55,7 +55,7 @@
|
||||
</div>
|
||||
<!-- <div class="pagination-div" v-if="queryData.pageIndex < totalPages"><span class="pag-text" @click="loadMore()">加载更多</span></div> -->
|
||||
</div>
|
||||
<portal-footer></portal-footer>
|
||||
<!-- <portal-footer></portal-footer> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user