邓平艺 5 years ago
parent
commit
09dae38d4a
  1. 29
      pages/find/find.vue
  2. 90
      pages/wallMember/contactedMember.vue

29
pages/find/find.vue

@ -16,7 +16,7 @@
<view class="lf-font-32 lf-color-222 lf-m-t-10">我更新了相册</view>
<!-- 图片显示区 -->
<view class="images-box">
<view class="img" v-for="item in 2" :key="item">
<view class="img2" v-for="item in 3" :key="item">
<lf-image src="https://picsum.photos/seed/picsum/200/300" />
</view>
</view>
@ -130,7 +130,21 @@
margin-top: 28rpx;
display: flex;
flex-wrap: wrap;
//
.img{
width: 460rpx;
height: 460rpx;
background-color: #0BCE5F;
margin-right: 10rpx;
&:nth-child(2n){
margin-right: 0rpx;
}
&:nth-child(n+3){
margin-top: 10rpx;
}
}
//2
.img1{
width: 275rpx;
height: 275rpx;
background-color: #0BCE5F;
@ -142,6 +156,19 @@
margin-top: 10rpx;
}
}
//
.img2{
width: 180rpx;
height: 180rpx;
background-color: #0BCE5F;
margin-right: 10rpx;
&:nth-child(3n){
margin-right: 0rpx;
}
&:nth-child(n+4){
margin-top: 10rpx;
}
}
}
.more{

90
pages/wallMember/contactedMember.vue

@ -1,19 +1,37 @@
<template>
<view>
<view class="lf-color-222 lf-font-32 authen-title lf-p-l-20 lf-m-l-30">联系过的人</view>
<view class="lf-color-222 lf-font-32 authen-title lf-p-l-20 lf-m-l-30">新招呼 <text class="lf-m-l-10 lf-color-primary">2</text></view>
<view class="content">
<view class="card" v-for="item in 7" :key="item">
<view class="card" v-for="(item,index) in 7" :key="index">
<lf-image class="cover" src="../../static/logo.png"></lf-image>
<view class="label">
<view class="lf-line-1">嘉宾xxx <text class="lf-iconfont icon-nan lf-m-l-10 lf-color-blue"></text></view>
<view class="lf-line-1">25··180cm·本科·未婚</view>
<view class="contact-flex">
<view class="lf-line-1 lf-font-28 lf-color-222" style="font-weight: 500;">嘉宾xxx <text class="lf-iconfont icon-nan lf-m-l-10 lf-color-blue"></text></view>
<view class="lf-line-1 lf-font-24 lf-color-555">25··180cm·本科·未婚</view>
<view class="lf-font-222 lf-color-777 lf-m-t-16" v-if="index == 2">申请中等待对方同意</view>
<view class="lf-m-t-10 lf-row-between" v-else>
<button class="refuse-btn">拒绝</button>
<button class="agree-btn">同意</button>
</view>
</view>
</view>
</view>
<view class="lf-color-222 lf-font-32 authen-title lf-p-l-20 lf-m-l-30">历史记录</view>
<view class="content">
<view class="card">
<lf-image class="cover" src="../../static/logo.png"></lf-image>
<view class="contact-flex">
<view class="lf-line-1 lf-font-28 lf-color-222" style="font-weight: 500;">嘉宾xxx <text class="lf-iconfont icon-nan lf-m-l-10 lf-color-blue"></text></view>
<view class="lf-line-1 lf-font-24 lf-color-555">25··180cm·本科·未婚</view>
</view>
</view>
</view>
<!-- 加载更多 -->
<view class="loading-more">
<text>没有更多数据啦~</text>
</view>
<!-- 回到顶部 -->
<u-back-top :scrollTop="pageScrollTop"></u-back-top>
</view>
@ -36,6 +54,34 @@
</script>
<style lang="scss" scoped="scoped">
.refuse-btn {
width: 140rpx;
height: 42rpx;
background: #D8D8D8;
border-radius: 5rpx;
color: #555;
font-size: 24rpx;
display: flex;
align-items: center;
justify-content: center;
}
.agree-btn {
width: 140rpx;
height: 42rpx;
background: #E21196;
border-radius: 5rpx;
color: #FFF;
font-size: 24rpx;
display: flex;
align-items: center;
justify-content: center;
}
.contact-flex {
display: flex;
flex-direction: column;
margin: 10rpx 20rpx 26rpx 20rpx;
justify-content: space-around;
}
.authen-title {
position: relative;
font-size: 32rpx;
@ -58,38 +104,22 @@
padding: 44rpx 32rpx;
}
.card{
width: 334rpx;
height: 360rpx;
width: 333rpx;
height: 100%;
border-radius: 10rpx;
position: relative;
overflow: hidden;
margin-right: 18rpx;
margin-bottom: 18rpx;
background: rgba(255, 255, 255, 0.5);
box-shadow: 0px 2rpx 4rpx 2rpx rgba(0, 0, 0, 0.08);
&:nth-child(2n){
margin-right: 0rpx;
}
.cover{
width: 100%;
height: 100%;
background-color: #EEEEEE;
position: absolute;
top: 0;
left: 0;
}
.label{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 98rpx;
color: #FFFFFF;
background: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
padding: 0 20rpx;
flex-wrap: nowrap;
flex-direction: column;
font-size: 28rpx;
}
}
.cover {
width: 333rpx;
height: 333rpx;
}
</style>
Loading…
Cancel
Save