征信小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
zhengxinApplets/pages/user/collect.vue

116 lines
2.3 KiB

<template>
<view class="collect">
<view class="item" v-for="(a,i) in list" :key="i" @click="toGuanzhu(a)">
<view class="a">
<image v-if="a.avatar" :src="baseUrl+a.avatar"></image>
<image v-else src="https://zhengxin.njrenzhou.cn/static/default.png"></image>{{a.nickname}}
</view>
<view class="b">
<image src="https://zhengxin.njrenzhou.cn/static/icon-dui.png"></image>已关注
</view>
</view>
<view class="empty" v-if="isShow">
<image src="https://zhengxin.njrenzhou.cn/static/empty.png"></image>
<view class="txt">暂无数据 ~</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: [],
baseUrl: "",
isShow: false,
};
},
mounted() {
this.baseUrl = this.$baseUrl;
this.getList();
},
methods: {
//关注
async toGuanzhu(a) {
uni.setStorageSync("guanzhuInfo",a);
uni.navigateTo({
url: "/pages/user/mycollect"
})
},
//获取列表
async getList() {
const { code, data } = await this.$api.getguanzhu({
token: uni.getStorageSync("token")
})
if(code == 1){
this.list = data;
this.isShow = (data.length == 0?true:false);
}
},
},
destroyed() {
uni.removeStorageSync("guanzhuInfo")
}
}
</script>
<style scoped lang="scss">
.collect{
padding: 0 25rpx 25rpx;
overflow: hidden;
.empty{
padding: 150rpx 0;
text-align: center;
font-size: 26rpx;
color: #666;
image{
width: 460rpx;
height: 400rpx;
margin-bottom: 30rpx;
}
}
.item{
padding: 30rpx 25rpx;
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #FFFFFF;
margin-top: 20rpx;
box-shadow: 0px 3rpx 10rpx 0px rgba(9,44,39,0.05);
border-radius: 20rpx;
.a{
flex: 1;
display: flex;
align-items: center;
font-weight: 500;
font-size: 30rpx;
color: #222222;
image{
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 20rpx;
}
}
.b{
width: 130rpx;
height: 50rpx;
line-height: 50rpx;
background: #00C6A9;
border-radius: 4rpx;
font-weight: 500;
font-size: 22rpx;
display: flex;
align-items: center;
justify-content: center;
color: #FFFFFF;
image{
width: 20rpx;
height: 14rpx;
margin-right: 10rpx;
}
}
}
}
</style>