257 lines
7.1 KiB
Vue
257 lines
7.1 KiB
Vue
<template>
|
|
<div class="box">
|
|
<div class="header">
|
|
<img class="portrait" :src="'http://lawpro.earnest.pro' + userimg" alt />
|
|
<div class="introduce">
|
|
<p class="name">{{username}}</p>
|
|
<div class="follow">
|
|
<p>
|
|
<span>{{attention}}</span>
|
|
关注我的
|
|
</p>
|
|
<p>
|
|
<span>{{myfollow}}</span>
|
|
我关注的
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="classification">
|
|
<div class="page">
|
|
<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">
|
|
<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" :types="item.status" :id="item.id"></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 @wz="wzs" v-if="types==1" operation="发布了该文章" :day="item.time" :title="item.title" types="1" :id="item.id"></answer>
|
|
<answer v-if="types==2" operation="发布了该问题" :day="item.time" :title="item.title" types="2" :id="item.id"></answer>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<style lang="scss" scoped>
|
|
.box {
|
|
background-color: #f6f6f6;
|
|
min-height: 100vh;
|
|
.header {
|
|
width: 100%;
|
|
height: 227px;
|
|
background-color: #fff;
|
|
box-sizing: border-box;
|
|
padding: 51px 30px;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 20px;
|
|
.portrait {
|
|
width: 126px;
|
|
height: 126px;
|
|
border-radius: 50%;
|
|
margin-right: 31px;
|
|
}
|
|
.introduce {
|
|
height: 90px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.name {
|
|
margin: 0;
|
|
font-size: 36px;
|
|
color: #333;
|
|
font-weight: 400;
|
|
margin-bottom: 29px;
|
|
}
|
|
.follow {
|
|
display: flex;
|
|
color: #999;
|
|
font-size: 28px;
|
|
|
|
> p {
|
|
display: flex;
|
|
margin-right: 69px;
|
|
> span {
|
|
color: #333;
|
|
display: block;
|
|
min-width: 23px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.classification {
|
|
width: 100%;
|
|
background-color: #fff;
|
|
// min-height: 300px;
|
|
box-sizing: border-box;
|
|
padding: 30px 30px;
|
|
.page {
|
|
width: 100%;
|
|
display: flex;
|
|
height: 62px;
|
|
border-bottom: 1px solid #dfdfdf;
|
|
> div {
|
|
width: 100%;
|
|
font-size: 32px;
|
|
text-align: center;
|
|
|
|
}
|
|
.select{
|
|
border-bottom: 4px solid #6B9147;
|
|
}
|
|
}
|
|
.list{
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
<script>
|
|
import follow from "./components/PersonafFollow"
|
|
// import follows from "./components/PersonafFollows"
|
|
import answer from "./components/PersonalAnswer"
|
|
// import { log } from 'util';
|
|
export default {
|
|
name: "Personal-homepage",
|
|
data() {
|
|
return {
|
|
userimg:"",
|
|
username:"",
|
|
myfollow:"",
|
|
attention:"",
|
|
dynamiclist:[],
|
|
status:['','文章','问题','回答'],
|
|
type:['','点赞','收藏','关注','评论','回答'],
|
|
types:4,
|
|
page:1,
|
|
lock:false
|
|
};
|
|
},
|
|
components:{
|
|
follow,
|
|
answer
|
|
},
|
|
methods:{
|
|
wzs(){
|
|
// console.log(a,b,12)
|
|
// this.$router.replace('/')
|
|
|
|
this.$router.push({
|
|
path:'/articledetail'
|
|
})
|
|
},
|
|
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(){
|
|
if(localStorage.getItem('token') == ""){
|
|
this.$router.push("/login")
|
|
}
|
|
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> |