|
|
<template> <view class="lf-w-100 lf-h-100"> <block v-if="$isRight(member)"> <view class="content lf-bg-white lf-m-b-30"> <swiper class="swiper"> <swiper-item> <lf-image :src="member.user.avatar"></lf-image> </swiper-item> </swiper> <view class="list lf-p-l-32 lf-p-r-32"> <!-- <lf-image class="avatar" src="@/static/logo.png"></lf-image> --> <view class="info"> <view class="lf-flex-1"> <text>{{ member.number_nickname }}</text> <text class="lf-iconfont icon-nv lf-m-l-10 lf-color-primary" v-if="member.gender == '女'"></text> <text class="lf-iconfont icon-nan lf-m-l-10 color-nan" v-else></text> </view> <view class="lf-flex-1 lf-m-t-16">{{ member.age }}岁·{{ member.zodiac }}·{{ member.height }}cm·{{ member.education_id }}·{{ member.marital_status }}</view> <view class="lf-flex-1 lf-m-t-16">自有公司·金融/证券/保险·50万以上</view> </view> <!-- <view class="star"> <u-icon name="star-fill lf-font-40" style="color: #D1D1D1;"></u-icon> </view> --> </view> <!-- <view class="sketch">大家好，我是私人订制红娘-笑笑。如果你不想在平台上面曝光，需要我为你全程服务，精准高效，速配脱单的加我微信：18399999999</view> --> </view> <view class="info-content"> <view class="lf-color-222 lf-font-32 authen-title lf-p-l-20">信息资料</view> <view class="lf-row-between lf-m-t-30" v-for="(item, index) in basic_list" :key="index"> <view class="lf-color-333 lf-font-28">{{item.title}}</view> <view class="lf-color-333 lf-font-28">{{item.content}}</view> </view> </view> <view class="info-content lf-m-t-30" v-if="member.is_auth"> <view class="lf-color-222 lf-font-32 authen-title lf-p-l-20">家庭与房车</view> <view class="lf-row-between lf-m-t-30" v-for="(item, index) in family_list" :key="index"> <view class="lf-color-333 lf-font-28">{{item.title}}</view> <view class="lf-color-333 lf-font-28">{{item.content}}</view> </view> </view> <view class="info-content lf-m-t-30" v-if="member.is_auth"> <view class="lf-color-222 lf-font-32 authen-title lf-p-l-20">择偶要求</view> <view class="lf-row-between lf-m-t-30" v-for="(item, index) in require_list" :key="index"> <view class="lf-color-333 lf-font-28">{{item.title}}</view> <view class="lf-color-333 lf-font-28">{{item.content}}</view> </view> </view> <view class="lf-p-l-32 lf-p-r-32 info-tag" v-if="!member.is_auth"> <view class="lf-color-222 lf-font-32 lf-m-b-30 authen-title lf-p-l-20">家庭与房车</view> <view class="lf-color-333 lf-font-28"> 了解Ta的购车、住房情况和家庭成员资料 </view> <view class="lf-font-24 lf-m-t-20" style="color: #E21196;" @click="$url('/pages/my/authentication')"> 实名认证后可查看>> </view> </view> <view class="lf-p-l-32 lf-p-r-32 info-tag" v-if="!member.is_auth"> <view class="lf-color-222 lf-font-32 lf-m-b-30 authen-title lf-p-l-20">择偶要求</view> <view class="lf-color-333 lf-font-28"> 了解Ta的婚史、身高、年龄等各项择偶要求 </view> <view class="lf-font-24 lf-m-t-20" style="color: #E21196;" @click="$url('/pages/my/authentication')"> 实名认证后可查看>> </view> </view> <view style="height: 130rpx;"></view> <view class="tabbar-bottom"> <view class="lf-row-between"> <view class="lf-flex-column" style="align-items: center;" @click="$url('/pages/my/service')"> <view> <u-icon name="kefu-ermai lf-font-32 lf-color-555"></u-icon> </view> <view class="lf-color-555 lf-font-24"> 客服 </view> </view> <view class="lf-flex-column" style="align-items: center;margin-left: 50rpx;" @click="share"> <view> <u-icon name="share lf-font-32 lf-color-555"></u-icon> </view> <view class="lf-color-555 lf-font-24"> 分享 </view> </view> <!-- 暂时隐藏部分 --> <!-- <view class="lf-flex-column" style="align-items: center;margin-left: 50rpx;"> <view> <u-icon name="more-dot-fill lf-font-32 lf-color-555"></u-icon> </view> <view class="lf-color-555 lf-font-24"> 更多 </view> </view> --> </view> <view> <button class="tabbar-btn" @click="$url('/pages/my/exclusiveMatch')">联系Ta</button> </view> </view> </block> <!-- #ifdef H5 --> <view style="height: 10rpx;"></view> <!-- #endif --> <!-- 回到顶部 --> <u-back-top :scrollTop="pageScrollTop"></u-back-top> </view></template>
<script> export default { data() { return { basic_list: [], family_list: [], require_list: [], number_id: 0, member: {} } }, onLoad(options){ this.number_id = options.id || 0; this.getMemberDetail(); }, methods: { getMemberDetail(){ this.$http(this.API.API_MEMBERS_DETAIL, { number: this.number_id }).then(res => { let basic_list = []; let family_list = []; let require_list = []; let member = res.data.member; this.member = member; for(let i in member){ // 基本信息
if(i == 'number' && member[i]){ basic_list.push({title: '编号', content: member[i]}); } if(i == 'gender' && member[i]){ basic_list.push({title: '性别', content: member[i]}); } if(i == 'marital_status' && member[i]){ basic_list.push({title: '婚史', content: member[i]}); } if(i == 'age' && member[i]){ basic_list.push({title: '年龄', content: member[i] +'岁'}); } if(i == 'height' && member[i]){ basic_list.push({title: '身高', content: member[i]}); } if(i == 'weight' && member[i]){ basic_list.push({title: '体重', content: member[i]}); } if(i == 'zodiac' && member[i]){ basic_list.push({title: '属相', content: member[i]}); } if(i == 'constellation' && member[i]){ basic_list.push({title: '星座', content: member[i]}); } if(i == 'education' && this.$isRight(member[i])){ basic_list.push({title: '学历', content: member[i].name}); } if(i == 'enterprise' && this.$isRight(member[i])){ basic_list.push({title: '单位性质', content: member[i].name}); } if(i == 'salary' && this.$isRight(member[i])){ basic_list.push({title: '年薪', content: member[i].name}); } if(i == 'area' && this.$isRight(member[i])){ basic_list.push({title: '居住地区', content: member[i].name}); } // TODO basic_list 缺少户籍和所属行业
// 家庭与房车信息
if(i == 'housing' && this.$isRight(member[i])){ family_list.push({title: '住房情况', content: member[i].name}); } if(i == 'car' && this.$isRight(member[i])){ family_list.push({title: '购车情况', content: member[i]}); } if(i == 'family' && this.$isRight(member[i])){ let familys = member[i].map(item => item.name); let str = familys.join(','); family_list.push({title: '家庭成员', content: str}); } // TODO family_list 缺少现居地址
// 择偶要求
if(i == 'marital_status' && this.$isRight(member[i])){ require_list.push({title: '婚史要求', content: member[i]}); } if(i == 'selection' && this.$isRight(member[i].height)){ require_list.push({title: '最低身高', content: member[i].height}); } if(i == 'selection' && this.$isRight(member[i].min_age)){ require_list.push({title: '最低年龄要求', content: member[i].min_age}); } if(i == 'education' && this.$isRight(member[i])){ require_list.push({title: '最低学历要求', content: member[i].name}); } if(i == 'salary' && this.$isRight(member[i])){ require_list.push({title: '最低年薪要求', content: member[i].name}); } if(i == 'housing' && this.$isRight(member[i].selection_request)){ require_list.push({title: '住房要求', content: member[i].selection_request}); } if(i == 'selection' && this.$isRight(member[i].car)){ require_list.push({title: '购车要求', content: member[i].car}); } // TODO require_list 缺少行业要求、体重要求、子女要求、户籍要求、
// 家庭要求、外貌要求、是否喝酒、是否抽烟、性格要求、其他要求
} this.basic_list = basic_list; this.family_list = family_list; this.require_list = require_list; }) }, share(){ this.$msg('复制链接成功！') uni.setClipboardData({ data: 'a', complete: () => { console.log("aaa") } }); } } }</script>
<style> page { background-color: #F5F5F5; }</style><style lang="scss" scoped> .tabbar-bottom { width: 100%; background-color: white; height: 110rpx; position: fixed; bottom: 0; display: flex; justify-content: space-between; padding: 15rpx 32rpx; } .tabbar-btn { width: 362rpx; height: 88rpx; background: #E21196; color: white; border-radius: 45rpx; } .info-content { width: 686rpx; height: 100%; background: #FFFFFF; border-radius: 10rpx; margin: 0 auto; padding: 30rpx; } .authen-title { position: relative; font-size: 32rpx; color: #131315; font-weight: 500; } .info-tag { width: 686rpx; height: 100%; background: #FFFFFF; border-radius: 10rpx; margin: 30rpx auto; padding: 30rpx; } .authen-title::after { content: ''; position: absolute; left: 0; top: 8rpx; width: 8rpx; height: 30rpx; background: #E21196; border-radius: 4rpx; } .content{ width: 100%; height: auto; box-sizing: border-box; padding-bottom: 30rpx; .swiper{ width: 750rpx; height: 750rpx; } .list{ padding-top: 30rpx; display: flex; width: 100%; height: max-content; display: flex; align-items: center; justify-content: space-between; .avatar{ width: 150rpx; height: 150rpx; border-radius: 10rpx; margin-right: 15rpx; background-color: #EEEEEE; } .info{ min-height: 150rpx; width: 598rpx; display: flex; align-content: space-between; flex-wrap: wrap; flex-direction: column; } } .sketch{ width: 686rpx; height: 160rpx; background: #F5F5F5; border-radius: 10rpx 30rpx 10rpx 30rpx; margin: 60rpx auto 0; box-sizing: border-box; padding: 30rpx; font-size: 24rpx; color: #333333; } } .star { width: 80rpx; height: 80rpx; background: #FFFFFF; box-shadow: 0px 2rpx 10rpx 5rpx rgba(226, 17, 150, 0.05); border-radius: 50%; display: flex; align-items: center; justify-content: center; }</style>
|
