Merge branch 'xuebaoxin' of pplokijuhyg/falvpingtai into master

This commit is contained in:
pplokijuhyg 2019-11-29 10:38:33 +08:00
commit a19a7eb80d
4 changed files with 281 additions and 28 deletions

View File

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

View File

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

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

View File

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