关注
This commit is contained in:
parent
b62c9a1eaa
commit
cfdd31be74
@ -1,16 +1,16 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div class="header">
|
||||
<img class="portrait" src="http://q1.qlogo.cn/g?b=qq&nk=1162963624&s=5" alt />
|
||||
<img class="portrait" :src="'http://lawpro.earnest.pro' + userimg" alt />
|
||||
<div class="introduce">
|
||||
<p class="name">啦啦啦</p>
|
||||
<p class="name">{{username}}</p>
|
||||
<div class="follow">
|
||||
<p>
|
||||
<span>0</span>
|
||||
<span>{{attention}}</span>
|
||||
关注我的
|
||||
</p>
|
||||
<p>
|
||||
<span>0</span>
|
||||
<span>{{myfollow}}</span>
|
||||
我关注的
|
||||
</p>
|
||||
</div>
|
||||
@ -18,15 +18,22 @@
|
||||
</div>
|
||||
<div class="classification">
|
||||
<div class="page">
|
||||
<div class="select">动态</div>
|
||||
<div>回答</div>
|
||||
<div>文章</div>
|
||||
<div>提问</div>
|
||||
<div>收藏</div>
|
||||
<div :class="types == 4?'select':''" @click="types=4">动态</div>
|
||||
<div :class="types == 3?'select':''" @click="types=3">回答</div>
|
||||
<div :class="types == 1?'select':''" @click="types=1">文章</div>
|
||||
<div :class="types == 2?'select':''" @click="types=2">提问</div>
|
||||
<div :class="types == 5?'select':''" @click="types=5">收藏</div>
|
||||
</div>
|
||||
<div class="list">
|
||||
<follow></follow>
|
||||
<answer></answer>
|
||||
<div v-for="(item,index) in dynamiclist" :key="index">
|
||||
<follow v-if="item.status == 3 " :operation="type[item.type] + '了该' + status[item.status]" :day="item.time + '前'" :title="item.title" :nickname="item.nickname" :userimg="'http://lawpro.earnest.pro' + item.img" :num="item.islike" :img="'http://lawpro.earnest.pro' + item.avatar" :text="item.text" :comment="item.comment"></follow>
|
||||
<answer v-if="item.status == 1 || item.status == 2" :operation="type[item.type] + '了该' + status[item.status]" :day="item.time + '前'" :title="item.title" ></answer>
|
||||
<follow v-if="types == 3" operation="发布了该回答" :day="item.time" :title="item.title" :nickname="item.nickname" :userimg="'http://lawpro.earnest.pro' + userimg" :num="item.islike" :img="'http://lawpro.earnest.pro' + item.avatar" :text="item.text" :comment="item.comment"></follow>
|
||||
<answer v-if="types==1" operation="发布了该文章" :day="item.time" :title="item.title" ></answer>
|
||||
<answer v-if="types==2" operation="发布了该问题" :day="item.time" :title="item.title" ></answer>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -108,16 +115,131 @@
|
||||
</style>
|
||||
<script>
|
||||
import follow from "./components/PersonafFollow"
|
||||
// import follows from "./components/PersonafFollows"
|
||||
import answer from "./components/PersonalAnswer"
|
||||
export default {
|
||||
name: "Personal homepage",
|
||||
name: "Personal-homepage",
|
||||
data() {
|
||||
return {
|
||||
userimg:"",
|
||||
username:"",
|
||||
myfollow:"",
|
||||
attention:"",
|
||||
dynamiclist:[],
|
||||
status:['','文章','问题','回答'],
|
||||
type:['','点赞','收藏','关注','评论','回答'],
|
||||
types:4,
|
||||
page:1,
|
||||
lock:false
|
||||
};
|
||||
},
|
||||
components:{
|
||||
follow,
|
||||
answer
|
||||
},
|
||||
methods:{
|
||||
getlist(){
|
||||
if(this.lock){
|
||||
return ;
|
||||
}
|
||||
this.lock = true
|
||||
this.page += 1
|
||||
this.axios.post("http://lawpro.earnest.pro/api/login_main/getUserListDetails",{
|
||||
token:localStorage.getItem("token"),
|
||||
type:this.types,
|
||||
page:this.page
|
||||
}).then((res)=>{
|
||||
window.console.log(res)
|
||||
if(res.data.code == 200){
|
||||
if(res.data.data.length == 0){
|
||||
// alert(1)
|
||||
|
||||
return ;
|
||||
}
|
||||
this.dynamiclist = this.dynamiclist.concat(res.data.data)
|
||||
this.lock = false
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
getlists(){
|
||||
if(this.lock){
|
||||
return ;
|
||||
}
|
||||
this.lock = true
|
||||
this.page += 1
|
||||
this.axios.post("http://lawpro.earnest.pro/api/login_main/getUserListDetails",{
|
||||
token:localStorage.getItem("token"),
|
||||
page:this.page
|
||||
}).then((res)=>{
|
||||
window.console.log(res)
|
||||
if(res.data.code == 200){
|
||||
if(res.data.data.length == 0){
|
||||
// alert(1)
|
||||
|
||||
return ;
|
||||
}
|
||||
this.dynamiclist = this.dynamiclist.concat(res.data.data)
|
||||
this.lock = false
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.axios.post('http://lawpro.earnest.pro/api/login_main/getUserDetails',{
|
||||
token:localStorage.getItem("token")
|
||||
}).then((res)=>{
|
||||
// window.console.log(res.data)
|
||||
if(res.data.code == 200){
|
||||
this.userimg = res.data.data.user.avatar,
|
||||
this.username = res.data.data.user.nickname,
|
||||
this.myfollow = res.data.data.myfollow,
|
||||
this.attention = res.data.data.user.attention
|
||||
}
|
||||
})
|
||||
this.axios.post("http://lawpro.earnest.pro/api/login_main/getUserListDetails",{
|
||||
token:localStorage.getItem("token"),
|
||||
type:4,
|
||||
page:1
|
||||
}).then((res)=>{
|
||||
window.console.log(res)
|
||||
if(res.data.code == 200){
|
||||
this.dynamiclist = res.data.data
|
||||
}
|
||||
|
||||
})
|
||||
var t = this
|
||||
window.$(window).scroll(() => {
|
||||
var windowH = window.$(window).height(); //设备可见区域高度
|
||||
var documentH = window.$(document).height(); //整个网页的高度（包括未显示的部分）
|
||||
var scrollH = window.$(window).scrollTop(); //滚动条滚动上去的高度
|
||||
//或者 scrollH = $(document).scrollTop();
|
||||
if (windowH + scrollH >= documentH) {
|
||||
// do something
|
||||
// alert(2);
|
||||
window.console.log(1)
|
||||
if(this.types == 5){
|
||||
t.getlists(0)
|
||||
}else{
|
||||
t.getlist()
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
watch:{
|
||||
types(){
|
||||
this.page = 0
|
||||
this.dynamiclist = []
|
||||
this.lock = false;
|
||||
this.getlist()
|
||||
}
|
||||
},
|
||||
beforeRouteLeave(){
|
||||
window.$(window).scroll(() => {
|
||||
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,23 +1,23 @@
|
||||
<template>
|
||||
<div class="PersonafFollow">
|
||||
<div class="title">
|
||||
<p>收藏了该回答</p>
|
||||
<p>3天前</p>
|
||||
<p>{{operation}}</p>
|
||||
<p>{{day}}</p>
|
||||
</div>
|
||||
<div class="center">舆论之于司法利大于弊还是弊大于利？</div>
|
||||
<div class="center">{{title}}</div>
|
||||
<div class="answer">
|
||||
<div class="user">
|
||||
<img src="http://q1.qlogo.cn/g?b=qq&nk=1162963624&s=5" alt srcset />
|
||||
<img :src="userimg" alt srcset />
|
||||
<div>
|
||||
<p>啦啦啦</p>
|
||||
<p>律师</p>
|
||||
<p>{{nickname}}</p>
|
||||
<p>{{role}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="agree">1345人赞同了该回答</div>
|
||||
<div class="agree">{{num}}人赞同了该回答</div>
|
||||
<div class="content">
|
||||
<img src alt srcset />
|
||||
<img :src="img" alt srcset />
|
||||
<p>
|
||||
这取决于司法是否独立。舆论能影响司法判决结果的，只能说明司法肯定不仅仅收到舆论的影响，还会收到同样的来自其他多方面的强力的影响。这种情况只能说明这取决于司法是否独立。舆论能影响司法判决结果的，只能说明司法肯定不仅仅收到舆论的影响，还会收到同样的来自其他多方面的强力的影响。这种情况只能说明
|
||||
{{text}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="operation">
|
||||
@ -27,7 +27,7 @@
|
||||
</div>
|
||||
<div>
|
||||
<img src="../assets/share.png" alt="" srcset="">
|
||||
888评论
|
||||
{{comment}}评论
|
||||
</div>
|
||||
<div>
|
||||
|
||||
@ -124,6 +124,7 @@ export default {
|
||||
name: "PersonafFollow",
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
props:['operation','day','title','userimg','nickname','img','role','num','text','comment']
|
||||
};
|
||||
</script>
|
||||
130
src/components/PersonafFollows.vue
Normal file
130
src/components/PersonafFollows.vue
Normal file
@ -0,0 +1,130 @@
|
||||
<template>
|
||||
<div class="PersonafFollow">
|
||||
<div class="title">
|
||||
<!-- <p>{{operation}}</p>
|
||||
<p>{{day}}前</p> -->
|
||||
</div>
|
||||
<div class="center">{{title}}</div>
|
||||
<div class="answer">
|
||||
<div class="user">
|
||||
<img :src="userimg" alt srcset />
|
||||
<div>
|
||||
<p>{{nickname}}</p>
|
||||
<p>{{role}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="agree">{{num}}人赞同了该回答</div>
|
||||
<div class="content">
|
||||
<img :src="img" alt srcset />
|
||||
<p>
|
||||
{{text}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="operation">
|
||||
<div>
|
||||
<img src="../assets/share.png" alt="" srcset="">
|
||||
分享
|
||||
</div>
|
||||
<div>
|
||||
<img src="../assets/share.png" alt="" srcset="">
|
||||
{{comment}}评论
|
||||
</div>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
.PersonafFollow {
|
||||
padding: 0 0 39px 0;
|
||||
border-bottom: 1px solid #dfdfdf;
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 26px;
|
||||
color: #95998f;
|
||||
// margin-bottom: 28px;
|
||||
}
|
||||
.center {
|
||||
font-size: 30px;
|
||||
color: #000;
|
||||
line-height: 46px;
|
||||
}
|
||||
.answer {
|
||||
.user {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 34px;
|
||||
> img {
|
||||
width: 58px;
|
||||
height: 58px;
|
||||
border-radius: 4px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
> div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> p {
|
||||
font-size: 24px;
|
||||
color: #000;
|
||||
}
|
||||
> p:last-child {
|
||||
margin-top: 10px;
|
||||
font-size: 24px;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
.agree {
|
||||
margin-top: 29px;
|
||||
font-size: 26px;
|
||||
color: #95998f;
|
||||
}
|
||||
.content {
|
||||
> img {
|
||||
width: 690px;
|
||||
height: 374px;
|
||||
background-color: #000;
|
||||
display: block;
|
||||
margin-top: 39px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
> p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
line-height: 40px;
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
.operation{
|
||||
display: flex;
|
||||
margin-top: 30px;
|
||||
>div{
|
||||
margin-right: 60px;
|
||||
font-size: 22px;
|
||||
color: #95998F;
|
||||
>img{
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
margin-right: 11px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
export default {
|
||||
name: "PersonafFollows",
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
props:['operation','day','title','userimg','nickname','img','role','num','text','comment']
|
||||
};
|
||||
</script>
|
||||
@ -1,12 +1,11 @@
|
||||
<template>
|
||||
<div class="PersonalAnswer">
|
||||
<div class="title">
|
||||
<p>关注了该问题</p>
|
||||
<p>3天前</p>
|
||||
<p>{{operation}}</p>
|
||||
<p>{{day}}</p>
|
||||
</div>
|
||||
<div class="center">
|
||||
如何看待正当防卫争议：丽江醉酒男午夜持刀砸门
|
||||
90后女子带刀“反杀”?
|
||||
{{title}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -33,6 +32,7 @@ export default {
|
||||
name: "PersonalAnswer",
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
props:['operation','day','title']
|
||||
};
|
||||
</script>
|
||||
Loading…
Reference in New Issue
Block a user