348 lines
8.0 KiB
Plaintext
348 lines
8.0 KiB
Plaintext
|
<style lang="less" scoped>
|
|||
|
|
@import url(../../styles/theme.less);
|
|||
|
|
page {
|
|||
|
|
background-color: #ffffff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ui-container{
|
|||
|
|
.ui-no-data-icon{
|
|||
|
|
width: 250rpx;
|
|||
|
|
height: 250rpx;
|
|||
|
|
display: block;
|
|||
|
|
vertical-align: top;
|
|||
|
|
margin: 36vh auto 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.m_vc_lst {
|
|||
|
|
padding: 30rpx 30rpx 60rpx;
|
|||
|
|
|
|||
|
|
.u_vc_lst {
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
margin-bottom: 30rpx;
|
|||
|
|
|
|||
|
|
.u_vclst_img {
|
|||
|
|
width: 100rpx;
|
|||
|
|
height: 100rpx;
|
|||
|
|
border-radius: 200rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.u_vclst_t_box {
|
|||
|
|
margin-left: 16rpx;
|
|||
|
|
|
|||
|
|
.u_vclst_name {
|
|||
|
|
max-width:200rpx;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.u_vclst_a_box {
|
|||
|
|
margin-left: 6rpx;
|
|||
|
|
padding: 0 12rpx;
|
|||
|
|
height: 36rpx;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.age_g {
|
|||
|
|
color: #ED3866;
|
|||
|
|
background: #FFF4F7;
|
|||
|
|
border: 2rpx solid #FFA9C0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.age_b {
|
|||
|
|
color: #2AAFF5;
|
|||
|
|
background: #EEF9FF;
|
|||
|
|
border: 2rpx solid #80D3FF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.a_sex_img {
|
|||
|
|
margin-right: 4rpx;
|
|||
|
|
height: 20rpx;
|
|||
|
|
width: 20rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.u_vertical {
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
margin-left: 116rpx;
|
|||
|
|
width: 546rpx;
|
|||
|
|
height: 2rpx;
|
|||
|
|
background-color: #F5F5F5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.u_vclst_img.blur {
|
|||
|
|
-webkit-filter: blur(8px);
|
|||
|
|
-moz-filter: blur(8px);
|
|||
|
|
-ms-filter: blur(8px);
|
|||
|
|
filter: blur(8px);
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ui-filter{
|
|||
|
|
filter: blur(4px) contrast(.8);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.m_fans_lst {
|
|||
|
|
padding: 0 30rpx 60rpx;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
align-content: stretch;
|
|||
|
|
.u_fans_lst:nth-child(3n+2) {
|
|||
|
|
margin-left: 22rpx;
|
|||
|
|
margin-right: 22rpx;
|
|||
|
|
}
|
|||
|
|
.u_fans_lst {
|
|||
|
|
width: 215rpx;
|
|||
|
|
height: 215rpx;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
margin-bottom: 30rpx;
|
|||
|
|
position: relative;
|
|||
|
|
.u_fans_img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
background-size: cover;
|
|||
|
|
background-position: center;
|
|||
|
|
}
|
|||
|
|
.u_fans_img.blur {
|
|||
|
|
-webkit-filter: blur(8px);
|
|||
|
|
-moz-filter: blur(8px);
|
|||
|
|
-ms-filter: blur(8px);
|
|||
|
|
filter: blur(8px);
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
.ui-fans-icon{
|
|||
|
|
width: 140rpx;
|
|||
|
|
height: 34rpx;
|
|||
|
|
top: 12rpx;
|
|||
|
|
right: 12rpx;
|
|||
|
|
position: absolute;
|
|||
|
|
}
|
|||
|
|
.u_vclst_ct {
|
|||
|
|
position: absolute;
|
|||
|
|
padding: 6rpx 0 0 12rpx;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 78rpx;
|
|||
|
|
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.4) 100%);
|
|||
|
|
z-index: 99;
|
|||
|
|
.u_vclst_name {
|
|||
|
|
line-height: 28rpx;
|
|||
|
|
width: 190rpx;
|
|||
|
|
}
|
|||
|
|
.u_vclst_add {
|
|||
|
|
width: 150rpx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow:ellipsis;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
padding-left: 10rpx;
|
|||
|
|
.icon-location {
|
|||
|
|
padding-right: 2rpx;
|
|||
|
|
font-size: 18rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cu-dialog{
|
|||
|
|
width: 600rpx;
|
|||
|
|
height: 660rpx;
|
|||
|
|
border-radius: 30rpx;
|
|||
|
|
position: relative;
|
|||
|
|
overflow:initial;
|
|||
|
|
.main{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-flow: column;
|
|||
|
|
.header{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-flow: column;
|
|||
|
|
.header-img{
|
|||
|
|
width: 180rpx;
|
|||
|
|
height: 180rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
filter:blur(4px) contrast(.8);
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
.ui-city{
|
|||
|
|
height: 40rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
line-height: 40rpx;
|
|||
|
|
margin-top: 16rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.ui-text{
|
|||
|
|
height: 44rpx;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
color: #333333;
|
|||
|
|
line-height: 44rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
margin-top: 84rpx;
|
|||
|
|
}
|
|||
|
|
.ui-img{
|
|||
|
|
width: 418rpx;
|
|||
|
|
height: 120rpx;
|
|||
|
|
margin-top: 74rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.actions {
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: -100rpx;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
margin: auto;
|
|||
|
|
width: 48rpx;
|
|||
|
|
height: 48rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.m_unl_bu {
|
|||
|
|
width: 100%;
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 60rpx;
|
|||
|
|
left: 0;
|
|||
|
|
z-index: 0;
|
|||
|
|
.u_unl_img {
|
|||
|
|
width: 616rpx;
|
|||
|
|
height: 120rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</style>
|
|||
|
|
<template>
|
|||
|
|
<view class="ui-visitor">
|
|||
|
|
<view class="ui-container">
|
|||
|
|
<image v-if="list.length == 0 && loading" class="ui-no-data-icon" src="https://images.ufutx.com/202104/13/1737964f7c98cbf65d728137dc2792eb.png" mode="aspectFill"></image>
|
|||
|
|
<block v-else>
|
|||
|
|
<view class="m_vc_lst">
|
|||
|
|
<block v-for="(item,index) in list" :key="index">
|
|||
|
|
<view class="u_vc_lst" @longpress="deleteRecord(item, index)" @tap="jumpPath(item, index)">
|
|||
|
|
<view class="f-fbc">
|
|||
|
|
<view class="f-fc">
|
|||
|
|
<image class="u_vclst_img" :src="item.photo" mode="aspectFill" @tap.stop="gotofriends(item, index)"></image>
|
|||
|
|
<view class="u_vclst_t_box">
|
|||
|
|
<view class="f-fc">
|
|||
|
|
<view class="u_vclst_name ellipsis_1">{{item.nickname}}</view>
|
|||
|
|
<view class="u_vclst_a_box f-fc {{ item.sex == 2 ? 'age_g' : 'age_b'}} font_22" v-if="item.sex == 2">
|
|||
|
|
<image v-if="item.sex == 2" class="a_sex_img" src="https://image.fulllinkai.com/202208/09/dfed05b3e1e1880a3a6f81806d99e9de.png" mode="widthFix"></image>
|
|||
|
|
<image v-else class="a_sex_img" src="https://image.fulllinkai.com/202208/09/dfed05b3e1e1880a3a6f81806d99e9de.png" mode="widthFix"></image>
|
|||
|
|
<view>{{item.year}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="f-fc">
|
|||
|
|
<view class="u_state">{{item.stature || ''}} {{item.city || ''}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="color-999">{{item.create_time}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="u_vertical"></view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import wepy from '@wepy/core'
|
|||
|
|
import https from '../../mixins/https'
|
|||
|
|
import base from '../../mixins/base'
|
|||
|
|
import utils from '../../utils/util'
|
|||
|
|
import {service} from '../../config'
|
|||
|
|
|
|||
|
|
wepy.page({
|
|||
|
|
config: {},
|
|||
|
|
mixins: [https, base],
|
|||
|
|
|
|||
|
|
data: {
|
|||
|
|
id: '',
|
|||
|
|
no_more: false,
|
|||
|
|
loading: false,
|
|||
|
|
page: 1,
|
|||
|
|
list: []
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 访客列表
|
|||
|
|
getList() {
|
|||
|
|
let vm = this
|
|||
|
|
let data = {
|
|||
|
|
page: vm.page,
|
|||
|
|
type: 'single',
|
|||
|
|
size: 15
|
|||
|
|
}
|
|||
|
|
vm.$showLoading('加载中...')
|
|||
|
|
vm.$get({url: `${service.host}/preview/other/${vm.id}/logs`, data}).then(({code, data}) => {
|
|||
|
|
if (code === 0) {
|
|||
|
|
data.data.forEach((item) => {
|
|||
|
|
item.create_time = utils.commentTimeHandle(item.create_time)
|
|||
|
|
})
|
|||
|
|
if (vm.list.length === 0 || vm.page === 1) {
|
|||
|
|
vm.list = data.data
|
|||
|
|
} else {
|
|||
|
|
data.data.map(function (item) {
|
|||
|
|
vm.list.push(item)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
if (vm.list.length < 15 || data.data.length < 15) {
|
|||
|
|
vm.no_more = true
|
|||
|
|
}
|
|||
|
|
setTimeout(() => {
|
|||
|
|
vm.loading = true
|
|||
|
|
}, 500)
|
|||
|
|
vm.page++
|
|||
|
|
}
|
|||
|
|
wx.hideLoading()
|
|||
|
|
}).catch(err => {
|
|||
|
|
wx.hideLoading()
|
|||
|
|
console.log(err)
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 跳转用户详情，没有vip时点击第四个用户弹框提示
|
|||
|
|
jumpPath(e) {
|
|||
|
|
wx.navigateTo({url: `/pages/home/information?id=${e.id}`})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 上拉获取更多数据
|
|||
|
|
onReachBottom() {
|
|||
|
|
let vm = this
|
|||
|
|
if (!vm.no_more) {
|
|||
|
|
vm.getList()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 下拉刷新
|
|||
|
|
onPullDownRefresh() {
|
|||
|
|
let vm = this
|
|||
|
|
vm.page = 1
|
|||
|
|
vm.no_more = false
|
|||
|
|
vm.getList()
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
},
|
|||
|
|
onLoad(e) {
|
|||
|
|
let vm = this
|
|||
|
|
vm.id = e.id
|
|||
|
|
vm.getList()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
</script>
|
|||
|
|
<config>
|
|||
|
|
{
|
|||
|
|
navigationBarTitleText: '来访记录',
|
|||
|
|
enablePullDownRefresh: true,
|
|||
|
|
backgroundColorTop: '#ffffff',
|
|||
|
|
backgroundColorBottom: '#ffffff',
|
|||
|
|
}
|
|||
|
|
</config>
|