tnblog
首页
精品
资源
登录

关注

846人阅读 2021/6/13 22:14 总访问:2989 评论:0 收藏:0 手机
分类: vue
<template>
<view >
<view class="flex-between user-info"  >
<view class="flex-center-height user-info-info"  >
<view class="flex-center user-info-avatar">
<image :src="gzlist.head" mode="aspectFill">
</image>
</view>
<view>

<view >{{gzlist.blogName}}</view>
<view class="flex-center-height desc-text line-clamp1">{{gzlist.motto}}</view>

</view>
</view>
<view class="">
<button class="flex-center-height bton" @click="con">+ 关注</button>
</view> 
</view>
<view id="top">
<view>
<view data-am-widget="list_news" class="am-list-news am-list-news-default am-no-layout">
<view>
<view class="am-g am-list-item-desced pet_list_one_block" v-for="item in lists">
<view>
<view @click="concern(item.userName)">
<view><img :src="gzlist.head" alt=""></view>
<view>{{gzlist.blogName}}</view>
</view>
<view>
<a href="/aojiancc2/article/UserCategory/8">
<view class="pet_list_tag " :class="item.styletype">{{item.aClass}}</view>
</a>
</view>
</view>
<view class=" am-list-main" @click="getdetails(item.id,item.userName)">
<h3 class="am-list-item-hd pet_list_one_bt"><a :href="item.link" class="">{{item.title}}</a>
</h3>
<view class="am-list-item-text pet_list_two_text">{{item.sContent}}</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>

</template>

<script>
export default {
data() {
return {
gzlist: [],
lists:[],
}
},
onLoad(username) {
//请求个人公开信息
this.getgzdata(username.username);
// this.getdetails();
this.getuserdata(username.username);
},
methods: {
getgzdata: function(username) {


//访问全局变量
let v1 = getApp().globalData.api;

uni.request({
url: v1 + `/UserInfo/${username}`, //仅为示例,并非真实接口地址。
method: 'GET',
header: {
'api-version': '1.0' //自定义请求头信息
},
success: (res) => {

console.log(res.data.value);

this.gzlist = res.data.value;
}
});

// this.httpUtil.post(url, token, {
//  'api-version': '2.0'
// }, "正在加载...").then(res => {
//  my.lists = res.value;
//  console.log(res.value)

// });

},
con:function(){
let userid=getApp().globalData.concerng.userId;
let v1 = getApp().globalData.api;
console.log(userid)

uni.request({
url: v1 + '/MyFocus', //仅为示例,并非真实接口地址。
method: 'POST',
header: {
'Content-Type' : 'application/json',
'api-version': '1.0' //自定义请求头信息
},
data:{
destId:userid,
token:getApp().globalData.token
},
success: (res) => {
if(res.data.code==200){
this.pageUtil.tips("关注成功")
console.log(res.vlaue);
}else if(res.data.code==402){
this.pageUtil.tips("已经关注过了")
}else{
this.pageUtil.tips("关注失败")

}

}
});

},
getuserdata: function(username) {

let page=1;
let rows=16;

//访问全局变量
let url =getApp().globalData.api+ `/UserArticles/${username}/${page}/${rows}`;

this.httpUtil.get(url, null, {
'api-version': '1.0'
}, "正在加载...").then(res => {
this.lists = res.value;
console.log(res.value)
// getApp().globalData.detauserinfo=res.value;
// setTimeout(function() {

//  uni.stopPullDownRefresh();
// }, 1000);

});
},

// getdetails:function(id,userName){


//  this.pageUtil.gotoPage('../details/details?id='+id+'&username='+userName)

// },
// concern:function(userName){
//  // alert(userName)
//  let ul=getApp().globalData.api;
//  uni.request({
//      url: ul+`/UserInfo/${userName}`, //仅为示例,并非真实接口地址。
//  method:'GET',
//      header: {
//          'api-version': '1.0' //自定义请求头信息
//      },
//      success: (res) => {
//          console.log(res.data.value);
//          getApp().globalData.concerng= res.data.value;
//      }
//  });
//  this.pageUtil.gotoPage('../concern/concer?username='+userName)
// }
}
}
</script>


 <style>
@import 'http://image.tnblog.net/amazeui.min.css';
</style>

<style>
@import 'http://image.tnblog.net/wap.css';
</style>

<style scoped>

page {
background: #FFFFFF;
width: 100%;
height: 100%;
}
image {
width: 100%;
height: 100%;
}
.user-info {
margin: 0rpx 0rpx 30rpx 0rpx;
width: 750rpx;
height: 200rpx;
background: #FFFFFF;
// background-color: red;
position: fixed;
// top:100rpx;
z-index: 9;
&-info {
width: 80%;
overflow: hidden;

}
&-avatar {
flex: none;
width: 128rpx;
height: 128rpx;
border-radius: 50%;
overflow: hidden;
}
&-name {
flex: 2;
margin-left: 28rpx;
width: 100%;

.nickname {
font-size: 40rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #131315;

}
.desc-text {
font-size: 26rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
margin: 12rpx 0;
// width: 90%;
}
.edit-text {
font-size: 26rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
}


}
.bton{
width:65px;
height:35px;
background-color:#999999;
color: #FFFFFF;
font-size: 24rpx;
position: relative;
right: 20px;

}
&-tips {
width: 20%;
&-image {
width: 65rpx;
height: 65rpx;
margin-right: 24rpx;
}
}
}
.pet_list_one_block{
margin-top: 170rpx;
}
.am-list-item-desced {
padding-top: 1rem;
border-bottom: 1px solid #f1f1f1;
}

.pet_list_two_text {
margin-top: 5px;
}

.pet_list_one_bt {
margin-top: -4px;
line-height: 22px;
}
</style>


评价
三千世界
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2022TNBLOG.NET
技术交流:群号677373950
联系我们:contact@tnblog.net
欢迎加群交流技术