homePage.vue 27 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087
  1. <template>
  2. <view class="content" >
  3. <view class="topSection">
  4. <image class="bg_top" src="https://dm.static.elab-plus.com/yezhu/h5/backgroundImg.png" mode=""></image>
  5. <view class="liveContent">
  6. <view class="backDiv"></view>
  7. <view class="title">分享好房 · 躺平赚钱</view>
  8. <view class="subTitle" @click="setEnv">新手赚钱帮助 ></view>
  9. <view class="levelDiv"
  10. style="background: url('https://dm.static.elab-plus.com/yezhu/h5/icon_line_back.png') center/100% 100% no-repeat;">
  11. <view class="level_top" v-if="userInfo.userId">
  12. <image class="level_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_Level.png" mode="">
  13. </image>
  14. <view class="level_text">{{userInfo.curlevel}}</view>
  15. <view class="level_des">/达到 {{userInfo.nextIncome}} 收益可升级</view>
  16. <view class="level_update">
  17. <text>升级攻略</text>
  18. <image class="level_right_icon"
  19. src="https://dm.static.elab-plus.com/yezhu/h5/icon_right.png" mode=""></image>
  20. </view>
  21. </view>
  22. <view class="level_top" v-else @click="toLogin">
  23. <image class="level_icon" src="https://dm.static.elab-plus.com/yezhu/h5/icon_Level.png" mode="">
  24. </image>
  25. <view class="level_text_login">登录</view>
  26. <view class="level_des"></view>
  27. <view class="level_update">
  28. <text>立即登录</text>
  29. <image class="level_right_icon"
  30. src="https://dm.static.elab-plus.com/yezhu/h5/icon_right.png" mode=""></image>
  31. </view>
  32. </view>
  33. <view class="level_bottom" v-if="userInfo.userId">
  34. <levelView :currentLevel='userInfo.curIncome' :nextLevel='userInfo.nextIncome' :currentLevelTxt='userInfo.curlevel' :nextLevelTxt='userInfo.nextLevel'>
  35. </levelView>
  36. </view>
  37. <view class="level_bottom_login" v-else >
  38. 点此进行登录注册,开始赚钱吧
  39. </view>
  40. </view>
  41. </view>
  42. </view>
  43. <view class="content_body" :style="{background:color4}">
  44. <view class="content_beginner_guide" v-if="showGuide">
  45. <view class="title">
  46. <text class="title_txt">- 新手引导 -</text>
  47. <view class="title_right">
  48. <text class="title_right_txt" @click="upLoadView(false)">收起</text>
  49. <image class="title_right_cion" src="https://dm.static.elab-plus.com/yezhu/icon_shouqi.png"
  50. mode=""></image>
  51. </view>
  52. </view>
  53. <view class="guide_content">
  54. <view class="item_guide">
  55. <image class="guide_img" src="https://dm.static.elab-plus.com/yezhu/icon_yezhu.png" mode="">
  56. </image>
  57. <text class="guide_title" @click="clearToken">注册业主</text>
  58. <text class="guide_desc">业主注册审核\n实时等级升级</text>
  59. </view>
  60. <image class="icon_guide" src="https://dm.static.elab-plus.com/yezhu/icon_to_guide.png" mode="">
  61. </image>
  62. <view class="item_guide">
  63. <image class="guide_img" style="width: 72rpx;height: 72rpx;margin-top: 5rpx;"
  64. src="https://dm.static.elab-plus.com/yezhu/icon_pyq.png" mode=""></image>
  65. <text class="guide_title">分享项目</text>
  66. <text class="guide_desc">分享到朋友圈\n自动计算收益</text>
  67. </view>
  68. <image class="icon_guide" src="https://dm.static.elab-plus.com/yezhu/icon_to_guide.png" mode="">
  69. </image>
  70. <view class="item_guide">
  71. <image class="guide_img" style="width: 58rpx;height: 68rpx;margin-top: 9rpx;"
  72. src="https://dm.static.elab-plus.com/yezhu/icon_yz_money.png" mode=""></image>
  73. <text class="guide_title">提现到微信</text>
  74. <text class="guide_desc">实时查看收益\n快速提现到账</text>
  75. </view>
  76. </view>
  77. </view>
  78. <view class="content_beginner_guide_" v-else @click="upLoadView(true)">
  79. <text class="title_txt">展开新手引导</text>
  80. <image class="title_right_cion" src="../../static/icons/icon_down_.png"
  81. mode=""></image>
  82. </view>
  83. <view class="content_tab">
  84. <view class="tab_item" @click="toYezhu">
  85. <image class="icon_tab" src="../../static/icons/icon_zcyz_user.png" mode=""></image>
  86. <text class="txt_tab">注册业主</text>
  87. </view>
  88. <view class="tab_item" @click="toShouYiPage">
  89. <image class="icon_tab" src="../../static/icons/icon_shouyi_user.png" mode=""></image>
  90. <text class="txt_tab">收益排行榜</text>
  91. </view>
  92. <view class="tab_item" @click="goReportPage">
  93. <image class="icon_tab" src="../../static/icons/icon_report_user.png" mode=""></image>
  94. <text class="txt_tab">效果报表</text>
  95. </view>
  96. <view class="tab_item" @click="showMine">
  97. <image class="icon_tab" src="../../static/icons/icon_user_mine.png" mode=""></image>
  98. <text class="txt_tab">我的信息</text>
  99. </view>
  100. </view>
  101. <view class="content_tuiguang">
  102. <view class="content_tuiguang_city">
  103. <text class="city_num">{{userInfo.taskCount||0}}个</text>
  104. <text class="city_num_desc">推广任务</text>
  105. <view class="city_list">
  106. <text class="city_name">城市</text>
  107. <image class="city_more" src="https://dm.static.elab-plus.com/yezhu/icon_ios_back%402x.png"
  108. mode=""></image>
  109. </view>
  110. </view>
  111. <view class="content_tuiguang_money">
  112. <text class="money_num">¥{{Number(userInfo.surplusTaskAmount).toFixed(2)||'0.00'}}</text>
  113. <text class="money_num_des">剩余任务金额</text>
  114. <view class="money_list">
  115. <text class="money_name">类型</text>
  116. <image class="money_more" src="https://dm.static.elab-plus.com/yezhu/icon_ios_back%402x.png"
  117. mode=""></image>
  118. </view>
  119. <image class="money_bg" src="https://dm.static.elab-plus.com/yezhu/icon_money_bg.png" mode="">
  120. </image>
  121. </view>
  122. </view>
  123. <view class="content_list">
  124. <view class="content_title">
  125. <view class="content_title_poi">
  126. </view>
  127. 任务列表
  128. </view>
  129. <view class="content_hongbao">
  130. <view class="hongbao_left">
  131. <image class="icon_hongbao" src="https://dm.static.elab-plus.com/yezhu/icon_hongbao.png"
  132. mode=""></image>
  133. <view class="hongbao_left_info">
  134. <text class="hongbao_title">邀请好友注册</text>
  135. <text class="hongbao_money">完成邀请,可获得 ¥1/人</text>
  136. </view>
  137. </view>
  138. <view class="hongbao_right" @click="toShareCard('',1)">
  139. 邀请好友
  140. </view>
  141. </view>
  142. <view class="list_item" v-for="(item,index) in houseList" :key='index'>
  143. <image class="house_img" :src="item.image" mode="aspectFill"></image>
  144. <view class="item_content" @click="goDetailAction(item)">
  145. <text class="house_name">{{item.name}}</text>
  146. <view class="house_hk" v-if="item.taskCategory">
  147. <text class="house_hk_" v-for="(item1,index1) in item.taskCategory" :key='index1'>{{item1.category}} ¥{{item1.unitPrice}}/人</text>
  148. </view>
  149. <text class="house_hk" v-else></text>
  150. <view class="house_address">
  151. <image src="https://dm.static.elab-plus.com/yezhu/icon_location.png" mode=""></image>
  152. <text style="width: 100%;">{{item.city}} · {{item.minPrice}}-{{item.maxPrice}}万元/m² {{item.bizFormat?'· '+item.bizFormat:''}}</text>
  153. </view>
  154. <view class="house_num">
  155. <image src="https://dm.static.elab-plus.com/yezhu/icon_family.png" mode=""></image>
  156. <text style="width: 100%;">{{item.projectLayout}}</text>
  157. </view>
  158. <text class="house_desc">{{item.shareRemark}}</text>
  159. </view>
  160. <view class="item_share" @click="toShareCard(item.projectId,2)">
  161. <image class="icon_share" src="https://dm.static.elab-plus.com/yezhu/icon_small_share.png"
  162. mode=""></image>
  163. <text class="icon_text">分享</text>
  164. </view>
  165. <view class="item_bg"></view>
  166. </view>
  167. <view class="com_noMore_text" v-if="noMore && houseList.length > 0">没有更多了</view>
  168. <view class="empty" v-if="houseList.length == 0">
  169. <image class="emptyImg" src="https://dm.static.elab-plus.com/yezhu/h5/icon_empty.png" mode=""></image>
  170. <view class="text">暂无数据</view>
  171. </view>
  172. </view>
  173. </view>
  174. <login></login>
  175. <login-notice></login-notice>
  176. <dmMine ref='mine' :userInfo='userInfo'></dmMine>
  177. </view>
  178. </template>
  179. <script>
  180. import levelView from '@/components/leve-view/leve-view.vue';
  181. import dmMine from '@/components/subComponents/dmMine.vue'
  182. let app = getApp();
  183. export default {
  184. data() {
  185. return {
  186. color4: '#F5F5F7',
  187. houseList: [],
  188. userId: "",
  189. token: "",
  190. clickCount:8,
  191. userInfo: {
  192. "userId": "",
  193. "name": null,
  194. "head": null,
  195. "curlevel": null,
  196. "curIncome": null,
  197. "nextLevel": null,
  198. "nextIncome": null,
  199. "ownersUnion": false,
  200. "totalIncome": null,
  201. "taskCount": null,
  202. "surplusTaskAmount": null,
  203. "cardNo":"",
  204. "phone":"",
  205. "room":"",
  206. "sex":""
  207. },
  208. showGuide:true,
  209. total:0,
  210. pageNo:1,
  211. pageSize:10,
  212. noMore:false
  213. }
  214. },
  215. mounted() {
  216. this.color4 = app.globalData.color4;
  217. this.getData();
  218. uni.$on("request",()=>{
  219. this.getData();
  220. })
  221. let projectId = this.getQueryString('projectId');
  222. if(projectId){
  223. let e = {
  224. projectId
  225. }
  226. this.goDetailAction(e)
  227. }
  228. },
  229. onReachBottom() {
  230. if(this.houseList.length<this.total){
  231. this.pageNo ++;
  232. this.getHomePage();
  233. }
  234. },
  235. methods: {
  236. getQueryString(name){
  237. var reg = new RegExp("(^|\\?|&)"+ name +"=([^&]*)(\\s|&|$)", "i");
  238. return reg.test(location.href) ? unescape(RegExp.$2.replace(/\+/g, " ")) : ""
  239. },
  240. clearToken(){
  241. this.$cache.delete('_token_owner_union')
  242. },
  243. getData(){
  244. this.pageNo = 1;
  245. this.getUserInfo();
  246. this.getHomePage();
  247. },
  248. async getHomePage() {
  249. let ret = await this.$myRequest({
  250. url: "/project/homePage",
  251. data: {
  252. "city": "",
  253. "pageNo": this.pageNo,
  254. "pageSize": this.pageSize,
  255. "taskCategoryId": ""
  256. }
  257. })
  258. if (ret.data.success) {
  259. let pageModel = ret.data.pageModel;
  260. let houseList = pageModel.resultSet || [];
  261. if(this.pageNo==1){
  262. this.houseList = [];
  263. }
  264. this.houseList = this.houseList.concat(houseList);
  265. this.total = pageModel.total||0;
  266. this.noMore = this.houseList.length==this.total
  267. }
  268. },
  269. async getUserInfo() {
  270. let ret = await this.$myRequest({
  271. url: "/user/userInfo",
  272. data: {},
  273. method: "GET"
  274. });
  275. if (ret.data.success) {
  276. this.userInfo = ret.data.single || null;
  277. this.showGuide = this.userInfo.userId?this.userInfo.ownersUnion?false:true:true;
  278. }
  279. },
  280. // 调准项目详情
  281. goDetailAction(e) {
  282. if(this.userInfo.userId){
  283. uni.navigateTo({
  284. url: '../houseDetail/houseDetail?projectId='+e.projectId
  285. })
  286. }else{
  287. uni.$emit('unLogin')
  288. }
  289. },
  290. // 跳转至效果报表
  291. goReportPage() {
  292. if(this.userInfo.userId){
  293. uni.navigateTo({
  294. url: '../reportPage/reportPage'
  295. })
  296. }else{
  297. uni.$emit('unLogin')
  298. }
  299. },
  300. toShouYiPage() {
  301. if(this.userInfo.userId){
  302. uni.navigateTo({
  303. url: '../revenueRankingPage/revenueRankingPage'
  304. })
  305. }else{
  306. uni.$emit('unLogin')
  307. }
  308. },
  309. async toYezhu(){
  310. if(this.userInfo.userId){
  311. let ret = await this.$myRequest({
  312. url: "/user/regist/get",
  313. data: {
  314. "userId": app.globalData.userId,
  315. },
  316. method:"GET"
  317. })
  318. if (ret.data.success) {
  319. let single = ret.data.single||null;//:0待审核1通过2拒绝
  320. if(single){
  321. if(single.approvalStatus==0||single.approvalStatus==1){
  322. uni.navigateTo({
  323. url: '../certificationResultPage/certificationResultPage'
  324. })
  325. }
  326. }else{
  327. uni.navigateTo({
  328. url: '../ownerCertification/ownerCertification?mobile='+this.userInfo.phone
  329. })
  330. }
  331. }else{
  332. uni.showToast({
  333. icon:"none",
  334. title:ret.data.message
  335. })
  336. }
  337. }else{
  338. uni.$emit('unLogin')
  339. }
  340. },
  341. setEnv(){
  342. if (this.clickCount < 0) {
  343. this.clickCount = 8;
  344. uni.navigateTo({
  345. url:"../developSetting/developSetting"
  346. })
  347. } else {
  348. this.clickCount--;
  349. }
  350. },
  351. toShareCard(projectId,type){
  352. if(this.userInfo.userId){
  353. let href = location.href;
  354. if (href.indexOf("?")){
  355. href = href.split('?')[0]
  356. }
  357. uni.navigateTo({
  358. url:'../shareCardPage/shareCardPage?page='+href+"&projectId="+projectId+"&type="+type
  359. })
  360. }else{
  361. uni.$emit('unLogin')
  362. }
  363. },
  364. toLogin(){
  365. uni.$emit('login')
  366. },
  367. upLoadView(isShow){
  368. this.showGuide = isShow;
  369. },
  370. showMine(){
  371. if(this.userInfo.userId){
  372. this.$refs.mine.show()
  373. }else{
  374. uni.$emit('unLogin')
  375. }
  376. }
  377. },
  378. components: {
  379. levelView,
  380. dmMine
  381. }
  382. }
  383. </script>
  384. <style lang="scss" scoped>
  385. .content {
  386. width: 100%;
  387. height: 100%;
  388. position: relative;
  389. .topSection {
  390. position: relative;
  391. z-index: 100;
  392. }
  393. .bg_top {
  394. width: 100%;
  395. height: 470rpx;
  396. position: absolute;
  397. top: 0;
  398. left: 0;
  399. z-index: 100;
  400. }
  401. .liveContent {
  402. width: 100%;
  403. height: 470rpx;
  404. z-index: 100;
  405. display: flex;
  406. flex-direction: column;
  407. align-items: center;
  408. position: relative;
  409. .backDiv {
  410. top: 0;
  411. left: 0;
  412. position: absolute;
  413. width: 100%;
  414. height: 100%;
  415. background-color: rgba($color: #000000, $alpha: 0.1);
  416. z-index: 1;
  417. }
  418. .title {
  419. margin-top: 96rpx;
  420. font-size: 44rpx;
  421. font-weight: 700;
  422. text-align: center;
  423. color: #ffffff;
  424. z-index: 2;
  425. }
  426. .subTitle {
  427. font-size: 28rpx;
  428. font-family: Verdana, Verdana-Regular;
  429. font-weight: 400;
  430. text-align: left;
  431. color: #ffffff;
  432. margin-top: 20rpx;
  433. z-index: 2;
  434. }
  435. .levelDiv {
  436. margin-top: 82rpx;
  437. width: calc(100% - 60rpx);
  438. height: 152rpx;
  439. z-index: 2;
  440. display: flex;
  441. flex-direction: column;
  442. padding: 25rpx 30rpx;
  443. box-sizing: border-box;
  444. .level_top {
  445. width: 100%;
  446. display: flex;
  447. justify-content: space-between;
  448. flex-wrap: nowrap;
  449. align-items: center;
  450. margin-top: 5rpx;
  451. .level_icon {
  452. width: 37rpx;
  453. min-width: 37rpx;
  454. max-width: 37rpx;
  455. height: 35rpx;
  456. margin-right: 13rpx;
  457. margin-top: -5rpx;
  458. }
  459. .level_text {
  460. font-size: 48rpx;
  461. font-family: FontName, FontName-Regular;
  462. font-weight: 500;
  463. text-align: left;
  464. font-style: oblique;
  465. color: #f5c8a8;
  466. line-height: 40rpx;
  467. letter-spacing: 1.92rpx;
  468. margin-right: 8rpx;
  469. margin-top: -7rpx;
  470. }
  471. .level_text_login{
  472. font-size: 40rpx;
  473. font-family: FontName, FontName-Regular;
  474. font-weight: 400;
  475. text-align: left;
  476. color: #f5c8a8;
  477. }
  478. .level_des {
  479. font-size: 22rpx;
  480. font-family: Verdana, Verdana-Regular;
  481. font-weight: 400;
  482. text-align: left;
  483. color: #f5c8a8;
  484. white-space: nowrap;
  485. flex-grow: 1;
  486. }
  487. .level_update {
  488. font-size: 24rpx;
  489. font-family: Verdana, Verdana-Bold;
  490. font-weight: 700;
  491. text-align: right;
  492. color: #f5c8a8;
  493. letter-spacing: 0.96rpx;
  494. display: flex;
  495. align-items: center;
  496. .level_right_icon {
  497. margin-left: 8rpx;
  498. width: 6rpx;
  499. height: 7rpx;
  500. }
  501. }
  502. }
  503. .level_bottom_login{
  504. font-size: 22rpx;
  505. font-family: Verdana, Verdana-Regular;
  506. font-weight: 400;
  507. text-align: left;
  508. color: #f5c8a8;
  509. margin-top: 20rpx;
  510. }
  511. }
  512. }
  513. .content_body {
  514. border-radius: 20rpx 20rpx 0rpx 0rpx;
  515. height: calc(100% - 470rpx);
  516. margin-top: -24rpx;
  517. z-index: 102;
  518. position: relative;
  519. padding: 1rpx;
  520. .content_beginner_guide {
  521. height: 354rpx;
  522. margin-left: 30rpx;
  523. margin-right: 30rpx;
  524. margin-top: 40rpx;
  525. background: #ffffff;
  526. border-radius: 16rpx;
  527. box-sizing: border-box;
  528. .title {
  529. width: 100%;
  530. position: relative;
  531. height: 110rpx;
  532. .title_txt {
  533. font-size: 32rpx;
  534. font-family: FontName, FontName-Regular;
  535. font-weight: 400;
  536. text-align: left;
  537. color: #b1b1b1;
  538. font-style: italic;
  539. position: absolute;
  540. left: 50%;
  541. top: 30rpx;
  542. transform: translateX(-50%);
  543. }
  544. .title_right {
  545. position: absolute;
  546. right: 20rpx;
  547. top: 40rpx;
  548. display: flex;
  549. align-items: center;
  550. .title_right_txt {
  551. font-size: 24rpx;
  552. font-family: Verdana, Verdana-Regular;
  553. font-weight: 400;
  554. text-align: right;
  555. color: #b1b1b1;
  556. }
  557. .title_right_cion {
  558. width: 10rpx;
  559. height: 6rpx;
  560. margin-left: 10rpx;
  561. }
  562. }
  563. }
  564. .guide_content {
  565. display: flex;
  566. padding-left: 40rpx;
  567. padding-right: 40rpx;
  568. box-sizing: border-box;
  569. justify-content: space-between;
  570. .item_guide {
  571. display: flex;
  572. flex-direction: column;
  573. align-items: center;
  574. .guide_img {
  575. width: 58rpx;
  576. height: 74rpx;
  577. margin-bottom: 17rpx;
  578. }
  579. .guide_title {
  580. font-size: 26rpx;
  581. font-family: Verdana, Verdana-Bold;
  582. font-weight: 700;
  583. text-align: center;
  584. color: #2c2c2c;
  585. margin-bottom: 8rpx;
  586. }
  587. .guide_desc {
  588. font-size: 22rpx;
  589. font-family: Verdana, Verdana-Regular;
  590. font-weight: 400;
  591. text-align: center;
  592. color: #b1b1b1;
  593. }
  594. }
  595. .icon_guide {
  596. width: 48rpx;
  597. height: 32rpx;
  598. margin-top: 20rpx;
  599. }
  600. }
  601. }
  602. .content_beginner_guide_{
  603. width: 100%;
  604. position: relative;
  605. margin-left: 30rpx;
  606. margin-right: 30rpx;
  607. margin-top: 20rpx;
  608. margin-bottom: 30rpx;
  609. display: flex;
  610. justify-content: center;
  611. align-items: center;
  612. .title_txt {
  613. font-size: 24rpx;
  614. font-family: FontName, FontName-Regular;
  615. font-weight: 400;
  616. text-align: left;
  617. color: #b1b1b1;
  618. font-style: italic;
  619. }
  620. .title_right_cion {
  621. width: 10rpx;
  622. height: 6rpx;
  623. margin-left: 10rpx;
  624. }
  625. }
  626. .content_tab {
  627. display: flex;
  628. box-sizing: border-box;
  629. height: 180rpx;
  630. background: #ffffff;
  631. border-radius: 16rpx;
  632. margin-top: 14rpx;
  633. padding-left: 40rpx;
  634. padding-right: 40rpx;
  635. margin-left: 30rpx;
  636. margin-right: 30rpx;
  637. justify-content: space-between;
  638. .tab_item {
  639. display: flex;
  640. flex-direction: column;
  641. align-items: center;
  642. justify-content: center;
  643. .icon_tab {
  644. width: 96rpx;
  645. height: 96rpx;
  646. }
  647. .txt_tab {
  648. font-size: 24rpx;
  649. font-family: Verdana, Verdana-Regular;
  650. font-weight: 400;
  651. text-align: center;
  652. color: #262626;
  653. margin-top: 2rpx;
  654. }
  655. }
  656. }
  657. .content_tuiguang {
  658. height: 220rpx;
  659. display: flex;
  660. box-sizing: border-box;
  661. background: #ffffff;
  662. border-radius: 16rpx;
  663. margin-top: 14rpx;
  664. padding-left: 40rpx;
  665. padding-right: 40rpx;
  666. margin-left: 30rpx;
  667. margin-right: 30rpx;
  668. justify-content: space-between;
  669. position: relative;
  670. .content_tuiguang_city {
  671. display: flex;
  672. flex-direction: column;
  673. justify-content: center;
  674. align-items: center;
  675. width: 50%;
  676. .city_num {
  677. font-size: 40rpx;
  678. font-family: DIN Alternate, DIN Alternate-Bold;
  679. font-weight: 700;
  680. text-align: center;
  681. color: #262626;
  682. }
  683. .city_num_desc {
  684. font-size: 24rpx;
  685. font-family: Verdana, Verdana-Regular;
  686. font-weight: 400;
  687. text-align: center;
  688. color: #b1b1b1;
  689. }
  690. .city_list {
  691. display: flex;
  692. justify-content: center;
  693. margin-top: 52rpx;
  694. align-items: center;
  695. .city_name {
  696. font-size: 26rpx;
  697. font-family: Verdana, Verdana-Regular;
  698. font-weight: 400;
  699. text-align: left;
  700. color: #262626;
  701. }
  702. .city_more {
  703. width: 26rpx;
  704. height: 26rpx;
  705. margin-left: 8rpx;
  706. }
  707. }
  708. }
  709. .content_tuiguang_money {
  710. display: flex;
  711. flex-direction: column;
  712. justify-content: center;
  713. align-items: center;
  714. width: 50%;
  715. .money_num {
  716. font-size: 40rpx;
  717. font-family: DIN Alternate, DIN Alternate-Bold;
  718. font-weight: 700;
  719. text-align: center;
  720. color: #fd8f3c;
  721. }
  722. .money_num_des {
  723. font-size: 24rpx;
  724. font-family: Verdana, Verdana-Regular;
  725. font-weight: 400;
  726. text-align: center;
  727. color: #b1b1b1;
  728. }
  729. .money_list {
  730. display: flex;
  731. justify-content: center;
  732. margin-top: 52rpx;
  733. align-items: center;
  734. .money_name {
  735. font-size: 26rpx;
  736. font-family: Verdana, Verdana-Regular;
  737. font-weight: 400;
  738. text-align: left;
  739. color: #262626;
  740. }
  741. .money_more {
  742. width: 26rpx;
  743. height: 26rpx;
  744. margin-left: 8rpx;
  745. }
  746. }
  747. .money_bg {
  748. position: absolute;
  749. right: 0rpx;
  750. top: 0;
  751. width: 220rpx;
  752. height: 220rpx;
  753. }
  754. }
  755. }
  756. .content_list {
  757. margin-top: 60rpx;
  758. margin-left: 30rpx;
  759. margin-right: 30rpx;
  760. padding-bottom: 50rpx;
  761. .content_title {
  762. display: flex;
  763. font-size: 32rpx;
  764. font-family: Verdana, Verdana-Bold;
  765. font-weight: 700;
  766. text-align: left;
  767. color: #262626;
  768. align-items: center;
  769. .content_title_poi {
  770. width: 8rpx;
  771. height: 12rpx;
  772. background: #f07423;
  773. border-radius: 2rpx;
  774. margin-right: 8rpx;
  775. }
  776. }
  777. .content_hongbao {
  778. margin-top: 20rpx;
  779. height: 140rpx;
  780. background: linear-gradient(108deg, #ffb55f 9%, #f87523 96%);
  781. border-radius: 16rpx;
  782. display: flex;
  783. justify-content: space-between;
  784. align-items: center;
  785. .hongbao_left {
  786. display: flex;
  787. margin-left: 26rpx;
  788. .icon_hongbao {
  789. width: 60rpx;
  790. height: 80rpx;
  791. margin-right: 20rpx;
  792. }
  793. .hongbao_left_info {
  794. display: flex;
  795. flex-direction: column;
  796. .hongbao_title {
  797. font-size: 30rpx;
  798. font-family: Verdana, Verdana-Bold;
  799. font-weight: 700;
  800. text-align: left;
  801. color: #ffffff;
  802. }
  803. .hongbao_money {
  804. font-size: 24rpx;
  805. font-family: Verdana, Verdana-Regular;
  806. font-weight: 400;
  807. text-align: left;
  808. color: #ffead8;
  809. }
  810. }
  811. }
  812. .hongbao_right {
  813. width: 140rpx;
  814. height: 56rpx;
  815. line-height: 56rpx;
  816. background: #ffffff;
  817. border-radius: 12rpx;
  818. font-size: 24rpx;
  819. font-family: Verdana, Verdana-Bold;
  820. font-weight: 700;
  821. text-align: center;
  822. color: #f07423;
  823. margin-right: 20rpx;
  824. }
  825. }
  826. .list_item {
  827. width: 100%;
  828. min-height: 280rpx;
  829. border-radius: 16rpx;
  830. display: flex;
  831. position: relative;
  832. margin-top: 20rpx;
  833. .house_img {
  834. width: 200rpx;
  835. height: 240rpx;
  836. min-width: 200rpx;
  837. z-index: 11;
  838. margin-top: 20rpx;
  839. margin-left: 20rpx;
  840. border-radius: 10rpx;
  841. }
  842. .item_content {
  843. display: flex;
  844. flex-direction: column;
  845. margin-left: 50rpx;
  846. z-index: 11;
  847. max-width: 51%;
  848. .house_name {
  849. width: 100%;
  850. word-break:break-all;
  851. font-size: 30rpx;
  852. font-family: Verdana, Verdana-Bold;
  853. font-weight: 700;
  854. text-align: left;
  855. color: #262626;
  856. margin-top: 20rpx;
  857. }
  858. .house_hk {
  859. width: 100%;
  860. font-size: 26rpx;
  861. font-family: Verdana, Verdana-Regular;
  862. font-weight: 400;
  863. text-align: left;
  864. color: #fd8f3c;
  865. margin-top: 8rpx;
  866. .house_hk_{
  867. margin-right: 10rpx;
  868. }
  869. }
  870. .house_address {
  871. width: 100%;
  872. display: flex;
  873. font-size: 24rpx;
  874. font-family: Verdana, Verdana-Regular;
  875. font-weight: 400;
  876. text-align: left;
  877. color: #b1b1b1;
  878. margin-top: 16rpx;
  879. image {
  880. width: 20rpx;
  881. height: 28rpx;
  882. margin-right: 8rpx;
  883. margin-top: 6rpx;
  884. }
  885. text {
  886. width: 80%;
  887. }
  888. }
  889. .house_num {
  890. display: flex;
  891. font-size: 24rpx;
  892. font-family: Verdana, Verdana-Regular;
  893. font-weight: 400;
  894. text-align: left;
  895. color: #b1b1b1;
  896. margin-top: 12rpx;
  897. image {
  898. width: 24rpx;
  899. height: 26rpx;
  900. margin-right: 8rpx;
  901. margin-top: 6rpx;
  902. }
  903. text {
  904. width: 80%;
  905. }
  906. }
  907. .house_desc {
  908. margin-top: 24rpx;
  909. font-size: 24rpx;
  910. font-family: Verdana, Verdana-Regular;
  911. font-weight: 400;
  912. text-align: left;
  913. color: #b1b1b1;
  914. margin-bottom: 20rpx;
  915. word-break:break-all;
  916. }
  917. }
  918. .item_share {
  919. z-index: 11;
  920. display: flex;
  921. flex-direction: column;
  922. width: 70rpx;
  923. height: 100rpx;
  924. background: #f07423;
  925. border-radius: 12rpx;
  926. position: absolute;
  927. right: 0;
  928. top: 50%;
  929. transform: translateY(-50%);
  930. justify-content: center;
  931. align-items: center;
  932. .icon_share {
  933. width: 32rpx;
  934. height: 32rpx;
  935. margin-bottom: 6rpx;
  936. }
  937. .icon_text {
  938. font-size: 24rpx;
  939. font-family: Verdana, Verdana-Bold;
  940. font-weight: 700;
  941. text-align: center;
  942. color: #ffffff;
  943. }
  944. }
  945. .item_bg {
  946. position: absolute;
  947. left: 0;
  948. top: 0;
  949. width: 95%;
  950. height: 100%;
  951. background-color: #FFFFFF;
  952. border-radius: 16rpx;
  953. z-index: 10;
  954. }
  955. }
  956. }
  957. }
  958. .com_noMore_text{
  959. margin-top: 40rpx;
  960. font-size: 24rpx;
  961. font-family: Verdana, Verdana-Regular;
  962. font-weight: 400;
  963. text-align: center;
  964. color: #999999;
  965. }
  966. .empty {
  967. display: flex;
  968. flex-direction: column;
  969. align-items: center;
  970. .emptyImg {
  971. width: 283rpx;
  972. height: 227rpx;
  973. }
  974. .text {
  975. margin-top: -20rpx;
  976. font-size: 28rpx;
  977. font-family: PingFang SC, PingFang SC-Medium;
  978. font-weight: 500;
  979. text-align: center;
  980. color: #b1b3ba;
  981. }
  982. }
  983. }
  984. </style>