Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
B
beyond-clouds-front
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Administrator
beyond-clouds-front
Commits
bbc9e541
Commit
bbc9e541
authored
Feb 12, 2020
by
yanju
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
获取他人的主页
parent
e6102ae7
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
391 additions
and
0 deletions
+391
-0
pages/u/_id/_select.vue
+391
-0
No files found.
pages/u/_id/_select.vue
0 → 100644
View file @
bbc9e541
<
template
>
<div
class=
"home-container"
>
<div
class=
"home-container__top"
>
<img
src=
"../../../assets/img/personal-cover.png"
alt=
""
>
</div>
<div
class=
"home-container__bottom"
>
<div
class=
"home-container__bottom-center"
>
<div
class=
"bottom-container__bg"
></div>
<div
class=
"bottom-container"
>
<div
class=
"bottom-left"
>
<user-card
:userId=
"userId"
></user-card>
</div>
<div
class=
"bottom-right"
>
<div
class=
"bottom-right__tab"
>
<div
class=
"tab__left"
>
<nuxt-link
tag=
"div"
class=
"left__item"
:to=
"
{path:'/u/'+userId+'/project'}">
<p
class=
"abs"
></p>
<p
class=
"word"
>
项目
</p>
<p
class=
"line"
v-if=
"selected==='project'"
></p>
</nuxt-link>
<nuxt-link
tag=
"div"
class=
"left__item"
:to=
"
{path:'/u/'+userId+'/blog'}">
<p
class=
"abs"
></p>
<p
class=
"word"
>
博客
</p>
<p
class=
"line"
v-if=
"selected==='blog'"
></p>
</nuxt-link>
<nuxt-link
tag=
"div"
class=
"left__item"
:to=
"
{path:'/u/'+userId+'/answer',query:{type:'my'}}">
<p
class=
"abs"
></p>
<p
class=
"word"
>
问答
</p>
<p
class=
"line"
v-if=
"selected==='answer'"
></p>
</nuxt-link>
<nuxt-link
tag=
"div"
class=
"left__item"
:to=
"
{path:'/u/'+userId+'/dynamic'}">
<p
class=
"abs"
></p>
<p
class=
"word"
>
动态
</p>
<p
class=
"line"
v-if=
"selected==='dynamic'"
></p>
</nuxt-link>
<nuxt-link
tag=
"div"
class=
"left__item"
:to=
"
{path:'/u/'+userId+'/info'}">
<p
class=
"abs"
></p>
<p
class=
"word"
>
资料
</p>
<p
class=
"line"
v-if=
"selected==='info'"
></p>
</nuxt-link>
</div>
<p
class=
"tab__right"
>
</p>
</div>
<div
style=
"min-height:556px"
>
<transition
name=
"fade-transform"
mode=
"out-in"
>
<div
v-if=
"selected==='blog'"
>
<card-container
key=
"container3"
style=
"margin-top: 16px"
:title=
"rightConTitle"
label=
"换一换"
>
<project-card
v-if=
"rightList.length>0"
v-for=
"(val,index) in rightList"
:key=
"val.blogId"
:info=
"val"
></project-card>
<empty-card
v-if=
"rightList.length===0"
height=
"556px"
></empty-card>
</card-container>
<pagination
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
</div>
</transition>
<transition
name=
"fade-transform"
mode=
"out-in"
>
<div
v-if=
"selected==='project'"
>
<card-container
key=
"container3"
style=
"margin-top: 16px"
:title=
"rightConTitle"
label=
"换一换"
>
<project-card
@
listenProjectCardUpdate=
"dataGetProject(1)"
v-if=
"rightList.length>0"
v-for=
"(val,index) in rightList"
:key=
"val.projectId"
:info=
"val"
></project-card>
<empty-card
v-if=
"rightList.length===0"
height=
"556px"
></empty-card>
</card-container>
<pagination
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
</div>
</transition>
<transition
name=
"fade-transform"
mode=
"out-in"
>
<div
v-if=
"selected==='answer'"
>
<card-container
key=
"container3"
style=
"margin-top: 16px"
:title=
"rightConTitle"
label=
"换一换"
>
<answer-card
v-if=
"rightList.length>0"
v-for=
"(val,index) in rightList"
:key=
"val.questionId"
:info=
"val"
></answer-card>
<empty-card
v-if=
"rightList.length===0"
height=
"556px"
></empty-card>
</card-container>
<pagination
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
</div>
</transition>
<transition
name=
"fade-transform"
mode=
"out-in"
>
<div
v-if=
"selected==='dynamic'"
style=
"margin-top:16px"
>
<social-card
@
listenSocialCardState=
"dataGetDynamic(1)"
v-for=
"(val,index) in rightList"
:key=
"val.postId"
:info=
"val"
></social-card>
<empty-card
v-if=
"rightList.length===0"
height=
"556px"
></empty-card>
<pagination
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
</div>
</transition>
<transition
name=
"fade-transform"
mode=
"out-in"
>
<div
v-if=
"selected==='info'"
>
<card-container
key=
"container3"
style=
"margin-top: 16px"
title=
"用户信息"
label=
"换一换"
>
<empty-card
height=
"556px"
></empty-card>
</card-container>
</div>
</transition>
</div>
</div>
</div>
<page-footer></page-footer>
</div>
</div>
</div>
</
template
>
<
script
>
import
UserCard
from
'../../../components/pc/userCard'
;
import
EmptyCard
from
'../../../components/pc/emptyCard'
;
import
AnswerCard
from
'../../../components/pc/answerCard'
;
import
Pagination
from
'../../../components/pc/pagination'
;
import
ReleaseCard
from
'../../../components/pc/releaseCard'
;
import
SocialCard
from
'../../../components/pc/socialContactCard'
;
import
ProjectCard
from
'../../../components/pc/projectCard'
;
import
CardContainer
from
'../../../components/pc/cardContainer'
;
import
PageFooter
from
'../../../components/pc/pageFooter'
;
import
config
from
"../../../action/config"
;
export
default
{
layout
:
'only-header'
,
data
(){
return
{
labelList
:
[
'我的消息'
,
'私信'
],
userId
:
''
,
rightList
:[],
pages
:
1
,
// selected: this.$route.name
}
},
components
:{
UserCard
,
ProjectCard
,
CardContainer
,
PageFooter
,
EmptyCard
,
SocialCard
,
ReleaseCard
,
AnswerCard
,
Pagination
},
watch
:{
$route
(
to
,
from
){
if
(
this
.
$route
.
name
){
this
.
selected
=
this
.
$route
.
params
.
id
;
}
}
},
computed
:{
rightConTitle
(){
if
(
this
.
selected
===
'project'
){
return
'Ta的项目'
}
if
(
this
.
selected
===
'blog'
){
return
'Ta的博客'
}
if
(
this
.
selected
===
'answer'
){
return
'Ta的问答'
}
if
(
this
.
selected
===
'dynamic'
){
return
'Ta的动态'
}
if
(
this
.
selected
===
'info'
){
return
'Ta的信息'
}
},
},
created
(){
this
.
selected
=
this
.
$route
.
params
.
select
;
let
select
=
this
.
$route
.
params
.
select
;
this
.
userId
=
this
.
$route
.
params
.
id
;
if
(
select
!==
'project'
&&
select
!==
'blog'
&&
select
!==
'answer'
&&
select
!==
'dynamic'
&&
select
!==
'info'
){
this
.
$router
.
replace
(
'/'
)
}
},
methods
:{
//获取动态list
dataGetDynamic
(
currentPage
){
this
.
$axios
.
$get
(
config
.
api
.
get
.
Post
.
otherList
+
this
.
user
+
'/posts'
,
{
params
:
{
page
:
currentPage
,
size
:
10
}
}).
then
((
response
)
=>
{
this
.
rightList
=
response
.
data
.
dataList
;
this
.
pages
=
response
.
data
.
totalPage
;
})
},
//获取创建的问题list
dataGetMyAnswer
(
currentPage
){
this
.
$axios
.
$get
(
config
.
api
.
get
.
Question
.
otherCreated
+
this
.
userId
+
'/questions'
,{
params
:{
page
:
currentPage
,
size
:
10
}
}).
then
((
response
)
=>
{
this
.
rightList
=
response
.
data
.
dataList
;
this
.
pages
=
response
.
data
.
totalPage
;
})
},
//获取回答的问题list
dataGetNoticeAnswer
(
currentPage
){
this
.
$axios
.
$get
(
config
.
api
.
get
.
Question
.
otherParticipated
+
this
.
userId
+
'/question/participated'
,{
params
:{
page
:
currentPage
,
size
:
10
}
}).
then
((
response
)
=>
{
this
.
rightList
=
response
.
data
.
dataList
;
this
.
pages
=
response
.
data
.
totalPage
;
})
},
//获取我的项目list
dataGetProject
(
currentPage
){
this
.
$axios
.
$get
(
config
.
api
.
get
.
Project
.
otherList
+
this
.
userId
+
'/projects'
,
{
params
:
{
page
:
currentPage
,
size
:
10
}
}).
then
((
response
)
=>
{
this
.
rightList
=
response
.
data
.
dataList
;
this
.
pages
=
response
.
data
.
totalPage
;
})
},
//获取我的博客list
dataGetBlog
(
currentPage
){
this
.
$axios
.
$get
(
config
.
api
.
get
.
Blog
.
otherList
+
this
.
userId
+
'/blogs'
,
{
params
:
{
page
:
currentPage
,
size
:
10
}
}).
then
((
response
)
=>
{
this
.
rightList
=
response
.
data
.
dataList
;
this
.
pages
=
response
.
data
.
totalPage
;
})
},
changePage
(
currentPage
){
//返回页数 请求新的数据
if
(
this
.
selected
===
'project'
){
this
.
dataGetProject
(
currentPage
)
}
if
(
this
.
selected
===
'blog'
){
this
.
dataGetBlog
(
currentPage
)
}
if
(
this
.
selected
===
'answer'
){
this
.
dataGetMyAnswer
(
currentPage
)
}
if
(
this
.
selected
===
'dynamic'
){
this
.
dataGetDynamic
(
currentPage
)
}
}
},
}
</
script
>
<
style
lang=
"scss"
scoped
>
html
{
background-image
:
$
bgImage
;
}
.home-container
{
align-items
:
flex-start
;
.home-container__top{
width
:
100%
;
height
:
auto
;
z-index
:
100
;
position
:
relative
;
img{
width
:
100%
;
min-height
:
270
*$
length
;
background-color
:
#B9A3D2
;
height
:
auto
;
}
}
.home-container__bottom
{
position
:
relative
;
margin
:
0
auto
;
.home-container__bottom-center{
position
:
absolute
;
top
:
-60
*$
length
;
left
:
0
;
right
:
0
;
background-image
:
$
bgImage
;
.bottom-container__bg{
background-image
:
$
bgImage
;
position
:
absolute
;
top
:
60
*$
length
;
left
:
0
;
right
:
0
;
z-index
:
-1
;
}
.bottom-container
{
position
:
relative
;
z-index
:
200
;
padding-bottom
:
32
*$
length
;
width
:
$
pageWidth
;
margin
:
0
auto
;
@extend
%flex-row-spb;
align-items
:
flex-start
;
.bottom-left{
width
:
302
*$
length
;
}
.bottom-right
{
width
:
938
*$
length
;
.bottom-right__tab{
box-sizing
:
border-box
;
height
:
62
*$
length
;
padding
:
18
*$
length
24
*$
length
;
border-bottom
:
1px
solid
#EFEFEF
;
@extend
%flex-row-spb;
.tab__left{
@extend
%flex-row-spb;
.left__item{
position
:
relative
;
@extend
%flex-column-spb;
margin-right
:
24
*$
length
;
.abs{
position
:
absolute
;
}
.word
{
@include
fontStyle(14,19,500,rgba(255,255,255,.6),center);
@extend
%animate-transition;
@extend
%cursorPointer;
&:hover{
color
:
#fff
}
}
.line
{
position
:
absolute
;
top
:
32
*$
length
;
margin
:
0
auto
;
left
:
0
;
right
:
0
;
width
:
16
*$
length
;
height
:
4
*$
length
;
border-radius
:
2px
2px
0
0
;
background-color
:
#00AAE6
;
}
}
}
.tab__right
{
@include
fontStyle(12,16,500,#999,center);
@extend
%animate-transition;
@extend
%cursorPointer;
&:hover{
color
:
#00AAE6
}
}
}
}
}
}
}
}
</
style
>
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment