<template> <view class="content" > <view class="topSection"> <image class="bg_top" src="https://dm.static.elab-plus.com/yezhu/h5/backgroundImg.png" mode=""></image> <view class="liveContent"> <view class="backDiv"></view> <view class="title">分享好房 · 躺平赚钱</view> <view class="subTitle"></view> <view class="levelDiv" style="background: url('https://dm.static.elab-plus.com/yezhu/h5/icon_line_back.png') center/100% 100% no-repeat;"> <view class="" v-if="userInfo.userId"> <view class="level_top" v-if="userInfo.ownersUnion"> <image class="level_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_Level.png" mode=""> </image> <view class="level_text">{{userInfo.curlevel?'Lv'+userInfo.curlevel:''}}</view> <view class="level_des" v-if="!userInfo.nextIncome">/当前已达到最高等级</view> <view class="level_des" v-else>/达到 {{userInfo.nextIncome}} 收益可升级</view> <view class="level_update" v-if="false"> <text>升级攻略</text> <image class="level_right_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_right.png" mode=""></image> </view> </view> <view class="level_top" v-else @click="toYezhu"> <image class="level_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_Level.png" mode=""> </image> <view class="level_text_login">业主认证</view> <view class="level_des"></view> <view class="level_update"> <text>立即认证</text> <image class="level_right_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_right.png" mode=""></image> </view> </view> </view> <view class="level_top" v-else @click="toLogin"> <image class="level_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_Level.png" mode=""> </image> <view class="level_text_login">登录</view> <view class="level_des"></view> <view class="level_update"> <text>立即登录</text> <image class="level_right_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_right.png" mode=""></image> </view> </view> <view class="" v-if="userInfo.userId"> <view class="level_bottom" v-if="userInfo.ownersUnion"> <levelView :currentLevel='userInfo.curIncome' :nextLevel='userInfo.nextIncome?userInfo.nextIncome:userInfo.curIncome' :currentLevelTxt='userInfo.curlevel' :nextLevelTxt='userInfo.nextIncome?userInfo.nextLevel:userInfo.curlevel'> </levelView> </view> <view class="level_bottom_login" v-else > 点此进行业主认证,审核后实时等级升级 </view> </view> <view class="level_bottom_login" v-else > 点此进行登录注册,开始赚钱吧 </view> </view> </view> </view> <view class="content_body" :style="{background:color4}"> <view class="content_beginner_guide" v-if="showGuide"> <view class="title"> <text class="title_txt" :style="{color:contentColor}">- 新手引导 -</text> <view class="title_right"> <text class="title_right_txt" :style="{color:contentColor}" @click="upLoadView(false)">收起</text> <image class="title_right_cion" src="https://dm.static.elab-plus.com/yezhu/icon_shouqi.png" mode=""></image> </view> </view> <view class="guide_content"> <view class="item_guide"> <image class="guide_img" src="https://dm.static.elab-plus.com/yezhu/icon_yezhu.png" mode=""> </image> <text class="guide_title" :style="{color:titleColor}" @click="clearToken">业主认证</text> <text class="guide_desc" :style="{color:contentColor}">业主认证审核\n实时等级升级</text> </view> <image class="icon_guide" src="https://dm.static.elab-plus.com/yezhu/icon_to_guide.png" mode=""> </image> <view class="item_guide"> <image class="guide_img" style="width: 72rpx;height: 72rpx;margin-top: 5rpx;" src="https://dm.static.elab-plus.com/yezhu/icon_pyq.png" mode=""></image> <text class="guide_title" :style="{color:titleColor}">分享项目</text> <text class="guide_desc" :style="{color:contentColor}">分享到朋友圈\n自动计算收益</text> </view> <image class="icon_guide" src="https://dm.static.elab-plus.com/yezhu/icon_to_guide.png" mode=""> </image> <view class="item_guide"> <image class="guide_img" style="width: 58rpx;height: 68rpx;margin-top: 9rpx;" src="https://dm.static.elab-plus.com/yezhu/icon_yz_money.png" mode=""></image> <text class="guide_title" :style="{color:titleColor}">提现到微信</text> <text class="guide_desc" :style="{color:contentColor}">实时查看收益\n快速提现到账</text> </view> </view> </view> <view class="content_beginner_guide_" v-else @click="upLoadView(true)"> <text class="title_txt" :style="{color:contentColor}">展开新手引导</text> <image class="title_right_cion" src="../../static/icons/icon_down_.png" mode=""></image> </view> <view class="content_tab"> <view class="tab_item" @click="toYezhu"> <image class="icon_tab" src="../../static/icons/icon_zcyz_user.png" mode=""></image> <text class="txt_tab" :style="{color:titleColor}">业主认证</text> </view> <view class="tab_item" @click="toShouYiPage"> <image class="icon_tab" src="../../static/icons/icon_shouyi_user.png" mode=""></image> <text class="txt_tab" :style="{color:titleColor}">收益排行榜</text> </view> <view class="tab_item" @click="goReportPage"> <image class="icon_tab" src="../../static/icons/icon_report_user.png" mode=""></image> <text class="txt_tab" :style="{color:titleColor}">效果报表</text> </view> <view class="tab_item" @click="showMine"> <image class="icon_tab" src="../../static/icons/icon_user_mine.png" mode=""></image> <text class="txt_tab" :style="{color:titleColor}">我的信息</text> </view> </view> <view class="content_tuiguang" v-if="userInfo.userId"> <view class="content_tuiguang_city"> <view class="city_num" :style="{color:titleColor}"><countTo :startVal='0' :endVal='Number(userInfo.taskCount)' :duration='3000'></countTo>个</view> <text class="city_num_desc" :style="{color:contentColor}">推广任务</text> </view> <view class="content_tuiguang_money"> <view class="money_num" :style="{color:color2}"> ¥<countTo :startVal='0' :decimals='2' :endVal='Number(userInfo.surplusTaskAmount)' :duration='1000'></countTo></view> <text class="money_num_des" :style="{color:contentColor}">剩余任务金额</text> </view> </view> <view class="content_list"> <view class="content_title" :style="{color:titleColor}"> <view class="content_title_poi"> </view> 任务列表 </view> <view class="content_hongbao" v-if="registAmount"> <view class="hongbao_left"> <image class="icon_hongbao" src="https://dm.static.elab-plus.com/yezhu/icon_hongbao.png" mode=""></image> <view class="hongbao_left_info"> <text class="hongbao_title">邀请好友注册</text> <text class="hongbao_money">完成邀请,可获得 ¥{{registAmount}}/人</text> </view> </view> <view class="hongbao_right" @click="toShareCard('',1)"> 邀请好友 </view> </view> <view class="content_tuiguang_new" style="height: auto;"> <view class="content_tuiguang_city"> <view class="city_list" style="margin-top: 30rpx;margin-bottom: 30rpx;" @click="showOptions(1)"> <text class="city_name">{{city}}</text> <image class="city_more" src="https://dm.static.elab-plus.com/yezhu/icon_ios_back%402x.png" mode=""></image> </view> </view> <view class="content_tuiguang_money" > <view class="money_list" style="margin-top: 30rpx;margin-bottom: 30rpx;" @click="showOptions(2)"> <text class="money_name" >{{typeName}}</text> <image class="money_more" src="https://dm.static.elab-plus.com/yezhu/icon_ios_back%402x.png" mode=""></image> </view> </view> </view> <view class="list_item" v-for="(item,index) in houseList" :key='index'> <view class="list_item" @click="goDetailAction(item,1)"> <image class="house_img" :src="item.image" mode="aspectFill"></image> <view class="item_content" > <text class="house_name" :style="{color:titleColor}">{{item.name}}</text> <view class="house_hk" :style="{color:color2}" v-if="item.taskCategory"> <text class="house_hk_" v-for="(item1,index1) in item.taskCategory" :key='index1'>{{item1.category}} ¥{{item1.unitPrice}}/人</text> </view> <text class="house_hk" v-else></text> <view class="house_address"> <image src="https://dm.static.elab-plus.com/yezhu/icon_location.png" mode=""></image> <text style="width: 100%;" :style="{color:contentColor}">{{item.city}} {{item.minPrice?"· "+item.minPrice:""}}{{item.maxPrice?'-'+item.maxPrice+'元/m²':""}} {{item.bizFormat?'· '+item.bizFormat:''}}</text> </view> <view class="house_num"> <image src="https://dm.static.elab-plus.com/yezhu/icon_family.png" mode=""></image> <text style="width: 100%;" :style="{color:contentColor}">{{item.projectLayout}}</text> </view> <text class="house_desc" :style="{color:contentColor}">{{item.taskEndTime}}</text> </view> </view> <view class="item_share" :style="{background:color1}" @click="toShareCard(item.projectId,2)"> <image class="icon_share" src="https://dm.static.elab-plus.com/yezhu/icon_small_share.png" mode=""></image> <text class="icon_text">分享</text> </view> <view class="item_bg"></view> </view> <view class="com_noMore_text" :style="{color:contentColor}" v-if="noMore && houseList.length > 0">没有更多了</view> <view class="empty" v-if="houseList.length == 0"> <image class="emptyImg" src="https://dm.static.elab-plus.com/yezhu/h5/icon_empty.png" mode=""></image> <view class="text">暂无数据</view> </view> </view> </view> <login ref='login'></login> <login-notice ref='login_notice'></login-notice> <dmMine ref='mine' :userInfo='userInfo'></dmMine> <dmHomeChoose ref='chooseType' :option='optionType' @chooiceType="chooiceType"></dmHomeChoose> <show-guide ref="showGuide" @registAction="toYezhu"></show-guide> </view> </template> <script> import levelView from '@/components/leve-view/leve-view.vue'; import dmMine from '@/components/subComponents/dmMine.vue' import dmHomeChoose from "@/components/subComponents/dmHomeChoose.vue" import showGuide from '@/components/subComponents/showGuide.vue' import countTo from 'vue-count-to'; let app = getApp(); export default { data() { return { color4: '#F5F5F7', color2:"", color1:"", contentColor:"", titleColor:"", houseList: [], userId: "", token: "", clickCount:8, userInfo: { "userId": "", "name": null, "head": null, "curlevel": null, "curIncome": null, "nextLevel": null, "nextIncome": null, "ownersUnion": false, "totalIncome": null, "taskCount": null, "surplusTaskAmount": null, "cardNo":"", "phone":"", "room":"", "sex":"" }, showGuide:true, total:0, pageNo:1, pageSize:10, noMore:false, city:"筛选城市", type:"", typeName:"任务类型", optionType:1, registAmount:null, shareToken:"", isVisiable:true, isPageHide:false, } }, mounted() { window.addEventListener('pageshow', function(){ if(this.isPageHide) { window.location.reload(); } }) window.addEventListener('pagehide',function(){ this.isPageHide = true; }) this.isFirst = true this.color4 = app.globalData.color4; this.color2 = app.globalData.color2; this.color1 = app.globalData.color1; this.contentColor = app.globalData.contentColor; this.titleColor = app.globalData.titleColor; this.getData(); uni.$on("request",()=>{ this.getData(); this.$refs.login_notice.hide(); this.$refs.login.hide(); }) let projectId = this.getQueryString('projectId'); this.toPage(projectId); }, onShow() { this.isVisiable = true; this.getSingle(); }, onHide() { this.isVisiable = false }, onPullDownRefresh() { this.getData(); }, onReachBottom() { if(this.houseList.length<this.total){ this.pageNo ++; this.getHomePage(); } }, methods: { toPage(projectId){ if(projectId){ let e = { projectId } this.goDetailAction(e,2) } }, getQueryString(name){ var reg = new RegExp("(^|\\?|&)"+ name +"=([^&]*)(\\s|&|$)", "i"); return reg.test(location.href) ? unescape(RegExp.$2.replace(/\+/g, " ")) : "" }, clearToken(){ }, getData(){ this.pageNo = 1; this.getUserInfo(); this.getHomePage(); this.getRegistTask(); this.getSingle(); }, chooiceType(e){ this.city = e.city==''?"筛选城市":(e.city).split('市')[0]; this.type = e.type; this.typeName = e.typeName==''?'任务类型':e.typeName; this.pageNo = 1; this.getHomePage(); }, async getRegistTask(){ if(app.globalData.userId){ let res = await this.$myRequest({ url: "/task/registTask", method:"GET", data: { "userId":app.globalData.userId, } }) if(res.data.success){ this.registAmount = res.data.single.amount||null }else{ this.registAmount = null; } } }, async getHomePage() { let ret = await this.$myRequest({ url: "/project/homePage", data: { "city": this.city=='筛选城市'?'':this.city, "pageNo": this.pageNo, "pageSize": this.pageSize, "taskCategoryId": this.type, "userId":app.globalData.userId, } }) if (ret.data.success) { let pageModel = ret.data.pageModel; let houseList = pageModel.resultSet || []; if(this.pageNo==1){ this.houseList = []; } this.houseList = this.houseList.concat(houseList); this.total = pageModel.total||0; this.noMore = this.houseList.length==this.total } }, async getUserInfo() { if(app.globalData.userId){ let ret = await this.$myRequest({ url: "/user/userInfo", data: {}, method: "GET" }); if (ret.data.success) { this.userInfo = ret.data.single || null; this.showGuide = this.userInfo.userId?this.userInfo.ownersUnion?false:true:true; if (this.showGuide) { this.$refs.showGuide.show() }else{ this.$refs.showGuide.hide(); } } } }, // 调准项目详情 goDetailAction(e,type) { if(type==1){ if(this.userInfo.userId){ uni.navigateTo({ url: '../houseDetail/houseDetail?projectId='+e.projectId }) }else{ uni.$emit('unLogin') } }else{ uni.navigateTo({ url: '../houseDetail/houseDetail?projectId='+e.projectId }) } }, // 跳转至效果报表 goReportPage() { if(this.userInfo.userId){ uni.navigateTo({ url: '../reportPage/reportPage' }) }else{ uni.$emit('unLogin') } }, toShouYiPage() { if(this.userInfo.userId){ uni.navigateTo({ url: '../revenueRankingPage/revenueRankingPage' }) }else{ uni.$emit('unLogin') } }, async toYezhu(){ let ret = await this.$myRequest({ url: "/user/regist/get", data: { "userId": app.globalData.userId, }, method:"GET" }) if (ret.data.success) { let single = ret.data.single||null;//:0待审核1通过2拒绝 if(single){ if(single.approvalStatus==0||single.approvalStatus==1){ uni.navigateTo({ url: '../certificationResultPage/certificationResultPage' }) }else if(single.approvalStatus==2){ uni.navigateTo({ url: '../ownerCertification/ownerCertification?mobile='+this.userInfo.phone }) } }else{ uni.navigateTo({ url: '../ownerCertification/ownerCertification?mobile='+this.userInfo.phone }) } }else{ uni.showToast({ icon:"none", title:ret.data.message }) } }, setEnv(){ if (this.clickCount < 0) { this.clickCount = 8; uni.navigateTo({ url:"../developSetting/developSetting" }) } else { this.clickCount--; } }, toShareCard(projectId,type){ if(this.userInfo.userId){ let href = location.origin+location.pathname; uni.navigateTo({ url:'../shareCardPage/shareCardPage?page='+href+"&projectId="+projectId+"&type="+type }) }else{ uni.$emit('unLogin') } }, toLogin(){ uni.$emit('login') }, upLoadView(isShow){ this.showGuide = isShow; }, showMine(){ if(this.userInfo.userId){ this.$refs.mine.show() }else{ uni.$emit('unLogin') } }, showOptions(option){ this.$refs.chooseType.setOptionType(option); this.$forceUpdate(); this.$refs.chooseType.show() }, async getSingle(){ let params = { "projectId": "", "userId": getApp().globalData.userId } let res = await this.$myRequest({ url: '/share_token/generate', data: params }); if(res.data.success){ this.shareToken = res.data.single; this.queryProtocolConfigView(); } }, async queryProtocolConfigView(){ let res = await this.$myRequest({ url: "/project/queryProtocolConfigView", data: {}, }); if(res.data.success){ let single = res.data.single; if(this.isVisiable){ this.config(single.shareName,single.shareRemark,location.origin+location.pathname +"?shareToken="+this.shareToken,single.shareLogoImage) } } } }, components: { levelView, dmMine, dmHomeChoose, showGuide, countTo } } </script> <style lang="scss" scoped> .content { width: 100%; height: 100%; position: relative; .topSection { position: relative; z-index: 100; } .bg_top { width: 100%; height: 470rpx; position: absolute; top: 0; left: 0; z-index: 100; } .liveContent { width: 100%; height: 470rpx; z-index: 100; display: flex; flex-direction: column; align-items: center; position: relative; .backDiv { top: 0; left: 0; position: absolute; width: 100%; height: 100%; background-color: rgba($color: #000000, $alpha: 0.1); z-index: 1; } .title { margin-top: 96rpx; font-size: 44rpx; font-weight: 700; text-align: center; color: #ffffff; z-index: 2; } .subTitle { font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #ffffff; margin-top: 20rpx; height: 40rpx; z-index: 2; } .levelDiv { margin-top: 82rpx; width: calc(100% - 60rpx); height: 152rpx; z-index: 2; display: flex; flex-direction: column; padding: 25rpx 30rpx; box-sizing: border-box; .level_top { width: 100%; display: flex; justify-content: space-between; flex-wrap: nowrap; align-items: center; margin-top: 5rpx; .level_icon { width: 37rpx; min-width: 37rpx; max-width: 37rpx; height: 35rpx; margin-right: 13rpx; margin-top: -5rpx; } .level_text { font-size: 48rpx; font-family: FontName, FontName-Regular; font-weight: 500; text-align: left; font-style: oblique; color: #f5c8a8; line-height: 40rpx; letter-spacing: 1.92rpx; margin-right: 8rpx; margin-top: -7rpx; } .level_text_login{ font-size: 40rpx; font-family: FontName, FontName-Regular; font-weight: 400; text-align: left; color: #f5c8a8; } .level_des { font-size: 22rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #f5c8a8; white-space: nowrap; flex-grow: 1; } .level_update { font-size: 24rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: right; color: #f5c8a8; letter-spacing: 0.96rpx; display: flex; align-items: center; .level_right_icon { margin-left: 8rpx; width: 6rpx; height: 7rpx; } } } .level_bottom_login{ font-size: 22rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #f5c8a8; margin-top: 20rpx; } } } .content_body { border-radius: 20rpx 20rpx 0rpx 0rpx; height: calc(100% - 470rpx); margin-top: -24rpx; z-index: 102; position: relative; padding: 1rpx; .content_beginner_guide { height: 354rpx; margin-left: 30rpx; margin-right: 30rpx; margin-top: 40rpx; background: #ffffff; border-radius: 16rpx; box-sizing: border-box; .title { width: 100%; position: relative; height: 110rpx; .title_txt { font-size: 32rpx; font-family: FontName, FontName-Regular; font-weight: 400; text-align: left; position: absolute; left: 50%; top: 30rpx; transform: translateX(-50%); } .title_right { position: absolute; right: 20rpx; top: 40rpx; display: flex; align-items: center; .title_right_txt { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: right; color: #b1b1b1; } .title_right_cion { width: 10rpx; height: 6rpx; margin-left: 10rpx; } } } .guide_content { display: flex; padding-left: 40rpx; padding-right: 40rpx; box-sizing: border-box; justify-content: space-between; .item_guide { display: flex; flex-direction: column; align-items: center; .guide_img { width: 58rpx; height: 74rpx; margin-bottom: 17rpx; } .guide_title { font-size: 26rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: center; color: #2c2c2c; margin-bottom: 8rpx; } .guide_desc { font-size: 22rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #b1b1b1; } } .icon_guide { width: 48rpx; height: 32rpx; margin-top: 20rpx; } } } .content_beginner_guide_{ width: 100%; position: relative; margin-top: 20rpx; margin-bottom: 30rpx; display: flex; justify-content: center; align-items: center; .title_txt { font-size: 32rpx; font-family: FontName, FontName-Regular; font-weight: 400; text-align: left; color: #b1b1b1; } .title_right_cion { width: 10rpx; height: 6rpx; margin-left: 10rpx; } } .content_tab { display: flex; box-sizing: border-box; height: 180rpx; background: #ffffff; border-radius: 16rpx; margin-top: 14rpx; padding-left: 40rpx; padding-right: 40rpx; margin-left: 30rpx; margin-right: 30rpx; justify-content: space-between; .tab_item { display: flex; flex-direction: column; align-items: center; justify-content: center; .icon_tab { width: 96rpx; height: 96rpx; } .txt_tab { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #262626; margin-top: 2rpx; } } } .content_tuiguang { height: 140rpx; display: flex; box-sizing: border-box; background: #ffffff; border-radius: 16rpx; margin-top: 14rpx; padding-left: 40rpx; padding-right: 40rpx; margin-left: 30rpx; margin-right: 30rpx; justify-content: space-between; position: relative; .content_tuiguang_city { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 50%; .city_num { font-size: 40rpx; font-family: DIN Alternate, DIN Alternate-Bold; font-weight: 700; text-align: center; color: #262626; } .city_num_desc { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #b1b1b1; } .city_list { display: flex; justify-content: center; margin-top: 52rpx; align-items: center; .city_name { font-size: 26rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } .city_more { width: 26rpx; height: 26rpx; margin-left: 8rpx; } } } .content_tuiguang_money { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 50%; .money_num { font-size: 40rpx; font-family: DIN Alternate, DIN Alternate-Bold; font-weight: 700; text-align: center; color: #fd8f3c; } .money_num_des { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #b1b1b1; } .money_list { display: flex; justify-content: center; margin-top: 52rpx; align-items: center; z-index: 11; .money_name { font-size: 26rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } .money_more { width: 26rpx; height: 26rpx; margin-left: 8rpx; } } .money_bg { position: absolute; right: 0rpx; top: 0; width: 220rpx; height: 220rpx; } } } .content_list { margin-top: 60rpx; margin-left: 30rpx; margin-right: 30rpx; padding-bottom: 50rpx; .content_tuiguang_new{ display: flex; box-sizing: border-box; background: #ffffff; border-radius: 16rpx; margin-top: 20rpx; padding-left: 40rpx; padding-right: 40rpx; justify-content: space-between; position: relative; .content_tuiguang_city { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 50%; .city_num { font-size: 40rpx; font-family: DIN Alternate, DIN Alternate-Bold; font-weight: 700; text-align: center; color: #262626; } .city_num_desc { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #b1b1b1; } .city_list { display: flex; justify-content: center; margin-top: 52rpx; align-items: center; .city_name { font-size: 26rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } .city_more { width: 26rpx; height: 26rpx; margin-left: 8rpx; } } } .content_tuiguang_money { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 50%; .money_num { font-size: 40rpx; font-family: DIN Alternate, DIN Alternate-Bold; font-weight: 700; text-align: center; color: #fd8f3c; } .money_num_des { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #b1b1b1; } .money_list { display: flex; justify-content: center; margin-top: 52rpx; align-items: center; z-index: 11; .money_name { font-size: 26rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } .money_more { width: 26rpx; height: 26rpx; margin-left: 8rpx; } } .money_bg { position: absolute; right: 0rpx; top: 0; width: 220rpx; height: 220rpx; } } } .content_title { display: flex; font-size: 32rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: left; color: #262626; align-items: center; .content_title_poi { width: 8rpx; height: 12rpx; background: #f07423; border-radius: 2rpx; margin-right: 8rpx; } } .content_hongbao { margin-top: 20rpx; height: 140rpx; background: linear-gradient(108deg, #ffb55f 9%, #f87523 96%); border-radius: 16rpx; display: flex; justify-content: space-between; align-items: center; .hongbao_left { display: flex; margin-left: 26rpx; .icon_hongbao { width: 60rpx; height: 80rpx; margin-right: 20rpx; } .hongbao_left_info { display: flex; flex-direction: column; .hongbao_title { font-size: 30rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: left; color: #ffffff; } .hongbao_money { font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #ffead8; } } } .hongbao_right { width: 140rpx; height: 56rpx; line-height: 56rpx; background: #ffffff; border-radius: 12rpx; font-size: 24rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: center; color: #f07423; margin-right: 20rpx; } } .list_item { width: 100%; min-height: 280rpx; border-radius: 16rpx; display: flex; position: relative; margin-top: 20rpx; .house_img { width: 200rpx; height: 240rpx; min-width: 200rpx; z-index: 11; margin-top: 20rpx; margin-left: 20rpx; border-radius: 10rpx; } .item_content { display: flex; flex-direction: column; margin-left: 50rpx; z-index: 11; max-width: 51%; .house_name { width: 100%; font-size: 30rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: left; margin-top: 20rpx; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .house_hk { width: 100%; font-size: 26rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; margin-top: 8rpx; .house_hk_{ margin-right: 10rpx; } } .house_address { width: 100%; display: flex; font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #b1b1b1; margin-top: 16rpx; image { width: 20rpx; height: 28rpx; margin-right: 8rpx; margin-top: 6rpx; } text { width: 80%; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } } .house_num { display: flex; font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #b1b1b1; margin-top: 12rpx; image { width: 24rpx; height: 26rpx; margin-right: 8rpx; margin-top: 6rpx; } text { width: 80%; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } } .house_desc { margin-top: 24rpx; font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; margin-bottom: 20rpx; word-break:break-all; } } .item_share { z-index: 11; display: flex; flex-direction: column; width: 70rpx; height: 100rpx; border-radius: 12rpx; position: absolute; right: 0; top: 50%; transform: translateY(-50%); justify-content: center; align-items: center; .icon_share { width: 32rpx; height: 32rpx; margin-bottom: 6rpx; } .icon_text { font-size: 24rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; text-align: center; color: #ffffff; } } .item_bg { position: absolute; left: 0; top: 0; width: 95%; height: 100%; background-color: #FFFFFF; border-radius: 16rpx; z-index: 10; } } } } .com_noMore_text{ margin-top: 40rpx; font-size: 24rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: center; color: #999999; } .empty { display: flex; flex-direction: column; align-items: center; .emptyImg { width: 283rpx; height: 227rpx; margin-top: 100rpx; } .text { margin-top: -20rpx; font-size: 28rpx; margin-bottom: 50rpx; font-family: PingFang SC, PingFang SC-Medium; font-weight: 500; text-align: center; color: #b1b3ba; } } } </style>