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

我的关注，消息中心页面

Browse Source
This commit is contained in:
zhaofang
2022-09-16 17:01:29 +08:00
parent 2e2b8bf0ed
commit 99586e1144
10 changed files with 293 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/HomePage/answerList.vue
View File

@@ -9,12 +9,13 @@
</h6> </h6>
<p class="answer-text"> <p class="answer-text">
假如你床头有 10 本书，你要在其中找到一本书，你会怎么找？你可能会说，扫一眼就找到了啊。假如你现在身处世界上最大的图书馆：美国国会图书馆，藏书超 2.1 亿本，现在你想在里边找某一本某某书，请问你如何找？一本一本翻吗？累死你，2.1 亿这个数字我给你换算了一下，把 2.1 亿本书铺起来可绕地球近两圈。不仅仅找书，图书馆每天还要在其中处理要在其中处要 假如你床头有 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?'收起':'全文展开'}} {{false?'收起':'全文展开'}}
</span> </span>
</p> </p>
<div> <div>
<interactBar :type="0" :shares="false" :views="false" :data="item" :readonly="true"></interactBar> <interactBar :type="0" :shares="false" :views="false" :readonly="true"></interactBar>
</div> </div>
</li> </li>
</ul> </ul>

5
src/components/HomePage/articleList.vue
View File

@@ -12,12 +12,13 @@
</div> </div>
<p class="article-text"> <p class="article-text">
假如你床头有 10 本书，你要在其中找到一本书，你会怎么找？你可能会说，扫一眼就找到了啊。假如你现在身处世界上最大的图书馆：美国国会图书馆，藏书超 2.1 亿本，现在你想在里边找某一本某某书，请问你如何找？一本一本翻吗？累死你，2.1 亿这个数字我给你换算了一下，把 2.1 亿本书铺起来可绕地球近两圈。不仅仅找书，图书馆每天还要在其中处理要在其中处要 假如你床头有 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?'收起':'全文展开'}} {{false?'收起':'全文展开'}}
</span> </span>
</p> </p>
<div> <div>
<interactBar :type="0" :shares="false" :views="false" :data="item" :readonly="true"></interactBar> <interactBar :type="0" :shares="false" :views="false" :readonly="true"></interactBar>
</div> </div>
</li> </li>
</ul> </ul>

2
src/components/HomePage/noteList.vue
View File

@@ -15,7 +15,7 @@
</span> </span>
</p> </p>
<div> <div>
<interactBar :type="0" :shares="false" :views="false" :data="item" :readonly="true"></interactBar> <interactBar :type="0" :shares="false" :views="false" :readonly="true"></interactBar>
</div> </div>
</li> </li>
</ul> </ul>

4
src/components/UserCenter/menu.vue
View File

@@ -300,6 +300,10 @@
<svg-icon :icon-class="activeMenu == '/user/favorites'?'stra-active':'stra'"></svg-icon> <svg-icon :icon-class="activeMenu == '/user/favorites'?'stra-active':'stra'"></svg-icon>
<span slot="title">我的收藏</span> <span slot="title">我的收藏</span>
</el-menu-item> </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"> <!-- <el-submenu index="myArticle" v-show="curIdentity == 1">
<template slot="title"> <template slot="title">

5
src/data/pages.js
View File

@@ -84,7 +84,10 @@ export const pages=[
{title:'课程开发教程',path:'developtoolsdown',component:'tools/DeveloptoolsDown',hidden:true}, {title:'课程开发教程',path:'developtoolsdown',component:'tools/DeveloptoolsDown',hidden:true},
{title:'我的U币',path:'ucurrency',component:'ucurrency/Index',hidden:true}, {title:'我的U币',path:'ucurrency',component:'ucurrency/Index',hidden:true},
{title:'我的勋章',path:'medal',component:'medal/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(){ export function routers(){

5
src/layout/components/TopNav/Index.vue
View File

@@ -42,8 +42,9 @@
<!-- </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" :underline="false">
<svg-icon style="margin-right: 0;font-size:26px;" icon-class="messfff"></svg-icon> <svg-icon style="margin-right: 0;font-size:26px;" icon-class="messfff"></svg-icon>
</el-link>
</el-badge> </el-badge>
</div> </div>
<el-dropdown class="person-action-index" style="margin-left: 44px;"> <el-dropdown class="person-action-index" style="margin-left: 44px;">

4
src/router/index.js
View File

@@ -190,8 +190,8 @@ export const constantRoutes = [{
path: '/follow', path: '/follow',
hidden: true, hidden: true,
component: (resolve) => require(['@/views/portal/follow'], resolve), component: (resolve) => require(['@/views/portal/follow'], resolve),
name: 'qaAnswer', name: 'follow',
meta: { title: '写回答', icon: 'dashboard', noCache: true, affix: false }, meta: { title: '我的关注', icon: 'dashboard', noCache: true, affix: false },
}, },
{ {
path: '/study', path: '/study',

94
src/views/homepage/page.vue
View File

@@ -1,52 +1,50 @@
<template> <template>
<div class="home-page-left">
<div class="home-page-left"> <div class="book-input">
<div class="book-input"> <span>分享书籍</span>
<span>分享书籍</span> <el-input style="width:130px" v-model="input" placeholder="请输入内容"></el-input>
<el-input style="width:130px" v-model="input" placeholder="请输入内容"></el-input> <i style="color: #333333" class="el-icon-search"></i>
<i style="color: #333333" class="el-icon-search"></i> </div>
</div> <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tab-pane name="first">
<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>
<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> <el-tab-pane name="second">
<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>
<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>
<course-list></course-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="case">
<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>
<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>
<case-list></case-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="note">
<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>
<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>
<note-list></note-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="qa">
<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>
<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>
<put-list></put-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="answer">
<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>
<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>
<answer-list></answer-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="article">
<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>
<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>
<article-list></article-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="fourth">
<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>
<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>
<follow-list></follow-list> </el-tab-pane>
</el-tab-pane> <el-tab-pane name="book">
<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>
<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>
<book-list></book-list> </el-tab-pane>
</el-tab-pane> </el-tabs>
</el-tabs> <div style="width:200px"></div>
<div style="width:200px"></div> </div>
</div>
</template> </template>
<script> <script>

224
src/views/portal/follow/index.vue
View File

@@ -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>

6
src/views/portal/user/Message.vue
View File

@@ -1,11 +1,11 @@
<template> <template>
<div> <div>
<Remark> <!-- <Remark>
<ul> <ul>
<li>个人觉得以单选框的形式展现应该是勾选条件而不是查询条件</li> <li>个人觉得以单选框的形式展现应该是勾选条件而不是查询条件</li>
</ul> </ul>
</Remark> </Remark>
<portal-header :goSearch="10"></portal-header> <portal-header :goSearch="10"></portal-header> -->
<div class="xcontent portal-content"> <div class="xcontent portal-content">
<div class="msg-nav"> <div class="msg-nav">
<div style="display: flex;align-items: center;"> <div style="display: flex;align-items: center;">
@@ -55,7 +55,7 @@
</div> </div>
<!-- <div class="pagination-div" v-if="queryData.pageIndex < totalPages"><span class="pag-text" @click="loadMore()">加载更多</span></div> --> <!-- <div class="pagination-div" v-if="queryData.pageIndex < totalPages"><span class="pag-text" @click="loadMore()">加载更多</span></div> -->
</div> </div>
<portal-footer></portal-footer> <!-- <portal-footer></portal-footer> -->
</div> </div>
</template> </template>