homePage.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095
  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,1)">
  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,2)
  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. },
  242. getData(){
  243. this.pageNo = 1;
  244. this.getUserInfo();
  245. this.getHomePage();
  246. },
  247. async getHomePage() {
  248. let ret = await this.$myRequest({
  249. url: "/project/homePage",
  250. data: {
  251. "city": "",
  252. "pageNo": this.pageNo,
  253. "pageSize": this.pageSize,
  254. "taskCategoryId": ""
  255. }
  256. })
  257. if (ret.data.success) {
  258. let pageModel = ret.data.pageModel;
  259. let houseList = pageModel.resultSet || [];
  260. if(this.pageNo==1){
  261. this.houseList = [];
  262. }
  263. this.houseList = this.houseList.concat(houseList);
  264. this.total = pageModel.total||0;
  265. this.noMore = this.houseList.length==this.total
  266. }
  267. },
  268. async getUserInfo() {
  269. if(app.globalData.userId){
  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. // 调准项目详情
  282. goDetailAction(e,type) {
  283. if(type==1){
  284. if(this.userInfo.userId){
  285. uni.navigateTo({
  286. url: '../houseDetail/houseDetail?projectId='+e.projectId
  287. })
  288. }else{
  289. uni.$emit('unLogin')
  290. }
  291. }else{
  292. uni.navigateTo({
  293. url: '../houseDetail/houseDetail?projectId='+e.projectId
  294. })
  295. }
  296. },
  297. // 跳转至效果报表
  298. goReportPage() {
  299. if(this.userInfo.userId){
  300. uni.navigateTo({
  301. url: '../reportPage/reportPage'
  302. })
  303. }else{
  304. uni.$emit('unLogin')
  305. }
  306. },
  307. toShouYiPage() {
  308. if(this.userInfo.userId){
  309. uni.navigateTo({
  310. url: '../revenueRankingPage/revenueRankingPage'
  311. })
  312. }else{
  313. uni.$emit('unLogin')
  314. }
  315. },
  316. async toYezhu(){
  317. if(this.userInfo.userId){
  318. let ret = await this.$myRequest({
  319. url: "/user/regist/get",
  320. data: {
  321. "userId": app.globalData.userId,
  322. },
  323. method:"GET"
  324. })
  325. if (ret.data.success) {
  326. let single = ret.data.single||null;//:0待审核1通过2拒绝
  327. if(single){
  328. if(single.approvalStatus==0||single.approvalStatus==1){
  329. uni.navigateTo({
  330. url: '../certificationResultPage/certificationResultPage'
  331. })
  332. }
  333. }else{
  334. uni.navigateTo({
  335. url: '../ownerCertification/ownerCertification?mobile='+this.userInfo.phone
  336. })
  337. }
  338. }else{
  339. uni.showToast({
  340. icon:"none",
  341. title:ret.data.message
  342. })
  343. }
  344. }else{
  345. uni.$emit('unLogin')
  346. }
  347. },
  348. setEnv(){
  349. if (this.clickCount < 0) {
  350. this.clickCount = 8;
  351. uni.navigateTo({
  352. url:"../developSetting/developSetting"
  353. })
  354. } else {
  355. this.clickCount--;
  356. }
  357. },
  358. toShareCard(projectId,type){
  359. if(this.userInfo.userId){
  360. let href = location.href;
  361. if (href.indexOf("?")){
  362. href = href.split('?')[0]
  363. }
  364. uni.navigateTo({
  365. url:'../shareCardPage/shareCardPage?page='+href+"&projectId="+projectId+"&type="+type
  366. })
  367. }else{
  368. uni.$emit('unLogin')
  369. }
  370. },
  371. toLogin(){
  372. uni.$emit('login')
  373. },
  374. upLoadView(isShow){
  375. this.showGuide = isShow;
  376. },
  377. showMine(){
  378. if(this.userInfo.userId){
  379. this.$refs.mine.show()
  380. }else{
  381. uni.$emit('unLogin')
  382. }
  383. }
  384. },
  385. components: {
  386. levelView,
  387. dmMine
  388. }
  389. }
  390. </script>
  391. <style lang="scss" scoped>
  392. .content {
  393. width: 100%;
  394. height: 100%;
  395. position: relative;
  396. .topSection {
  397. position: relative;
  398. z-index: 100;
  399. }
  400. .bg_top {
  401. width: 100%;
  402. height: 470rpx;
  403. position: absolute;
  404. top: 0;
  405. left: 0;
  406. z-index: 100;
  407. }
  408. .liveContent {
  409. width: 100%;
  410. height: 470rpx;
  411. z-index: 100;
  412. display: flex;
  413. flex-direction: column;
  414. align-items: center;
  415. position: relative;
  416. .backDiv {
  417. top: 0;
  418. left: 0;
  419. position: absolute;
  420. width: 100%;
  421. height: 100%;
  422. background-color: rgba($color: #000000, $alpha: 0.1);
  423. z-index: 1;
  424. }
  425. .title {
  426. margin-top: 96rpx;
  427. font-size: 44rpx;
  428. font-weight: 700;
  429. text-align: center;
  430. color: #ffffff;
  431. z-index: 2;
  432. }
  433. .subTitle {
  434. font-size: 28rpx;
  435. font-family: Verdana, Verdana-Regular;
  436. font-weight: 400;
  437. text-align: left;
  438. color: #ffffff;
  439. margin-top: 20rpx;
  440. z-index: 2;
  441. }
  442. .levelDiv {
  443. margin-top: 82rpx;
  444. width: calc(100% - 60rpx);
  445. height: 152rpx;
  446. z-index: 2;
  447. display: flex;
  448. flex-direction: column;
  449. padding: 25rpx 30rpx;
  450. box-sizing: border-box;
  451. .level_top {
  452. width: 100%;
  453. display: flex;
  454. justify-content: space-between;
  455. flex-wrap: nowrap;
  456. align-items: center;
  457. margin-top: 5rpx;
  458. .level_icon {
  459. width: 37rpx;
  460. min-width: 37rpx;
  461. max-width: 37rpx;
  462. height: 35rpx;
  463. margin-right: 13rpx;
  464. margin-top: -5rpx;
  465. }
  466. .level_text {
  467. font-size: 48rpx;
  468. font-family: FontName, FontName-Regular;
  469. font-weight: 500;
  470. text-align: left;
  471. font-style: oblique;
  472. color: #f5c8a8;
  473. line-height: 40rpx;
  474. letter-spacing: 1.92rpx;
  475. margin-right: 8rpx;
  476. margin-top: -7rpx;
  477. }
  478. .level_text_login{
  479. font-size: 40rpx;
  480. font-family: FontName, FontName-Regular;
  481. font-weight: 400;
  482. text-align: left;
  483. color: #f5c8a8;
  484. }
  485. .level_des {
  486. font-size: 22rpx;
  487. font-family: Verdana, Verdana-Regular;
  488. font-weight: 400;
  489. text-align: left;
  490. color: #f5c8a8;
  491. white-space: nowrap;
  492. flex-grow: 1;
  493. }
  494. .level_update {
  495. font-size: 24rpx;
  496. font-family: Verdana, Verdana-Bold;
  497. font-weight: 700;
  498. text-align: right;
  499. color: #f5c8a8;
  500. letter-spacing: 0.96rpx;
  501. display: flex;
  502. align-items: center;
  503. .level_right_icon {
  504. margin-left: 8rpx;
  505. width: 6rpx;
  506. height: 7rpx;
  507. }
  508. }
  509. }
  510. .level_bottom_login{
  511. font-size: 22rpx;
  512. font-family: Verdana, Verdana-Regular;
  513. font-weight: 400;
  514. text-align: left;
  515. color: #f5c8a8;
  516. margin-top: 20rpx;
  517. }
  518. }
  519. }
  520. .content_body {
  521. border-radius: 20rpx 20rpx 0rpx 0rpx;
  522. height: calc(100% - 470rpx);
  523. margin-top: -24rpx;
  524. z-index: 102;
  525. position: relative;
  526. padding: 1rpx;
  527. .content_beginner_guide {
  528. height: 354rpx;
  529. margin-left: 30rpx;
  530. margin-right: 30rpx;
  531. margin-top: 40rpx;
  532. background: #ffffff;
  533. border-radius: 16rpx;
  534. box-sizing: border-box;
  535. .title {
  536. width: 100%;
  537. position: relative;
  538. height: 110rpx;
  539. .title_txt {
  540. font-size: 32rpx;
  541. font-family: FontName, FontName-Regular;
  542. font-weight: 400;
  543. text-align: left;
  544. color: #b1b1b1;
  545. font-style: italic;
  546. position: absolute;
  547. left: 50%;
  548. top: 30rpx;
  549. transform: translateX(-50%);
  550. }
  551. .title_right {
  552. position: absolute;
  553. right: 20rpx;
  554. top: 40rpx;
  555. display: flex;
  556. align-items: center;
  557. .title_right_txt {
  558. font-size: 24rpx;
  559. font-family: Verdana, Verdana-Regular;
  560. font-weight: 400;
  561. text-align: right;
  562. color: #b1b1b1;
  563. }
  564. .title_right_cion {
  565. width: 10rpx;
  566. height: 6rpx;
  567. margin-left: 10rpx;
  568. }
  569. }
  570. }
  571. .guide_content {
  572. display: flex;
  573. padding-left: 40rpx;
  574. padding-right: 40rpx;
  575. box-sizing: border-box;
  576. justify-content: space-between;
  577. .item_guide {
  578. display: flex;
  579. flex-direction: column;
  580. align-items: center;
  581. .guide_img {
  582. width: 58rpx;
  583. height: 74rpx;
  584. margin-bottom: 17rpx;
  585. }
  586. .guide_title {
  587. font-size: 26rpx;
  588. font-family: Verdana, Verdana-Bold;
  589. font-weight: 700;
  590. text-align: center;
  591. color: #2c2c2c;
  592. margin-bottom: 8rpx;
  593. }
  594. .guide_desc {
  595. font-size: 22rpx;
  596. font-family: Verdana, Verdana-Regular;
  597. font-weight: 400;
  598. text-align: center;
  599. color: #b1b1b1;
  600. }
  601. }
  602. .icon_guide {
  603. width: 48rpx;
  604. height: 32rpx;
  605. margin-top: 20rpx;
  606. }
  607. }
  608. }
  609. .content_beginner_guide_{
  610. width: 100%;
  611. position: relative;
  612. margin-left: 30rpx;
  613. margin-right: 30rpx;
  614. margin-top: 20rpx;
  615. margin-bottom: 30rpx;
  616. display: flex;
  617. justify-content: center;
  618. align-items: center;
  619. .title_txt {
  620. font-size: 24rpx;
  621. font-family: FontName, FontName-Regular;
  622. font-weight: 400;
  623. text-align: left;
  624. color: #b1b1b1;
  625. font-style: italic;
  626. }
  627. .title_right_cion {
  628. width: 10rpx;
  629. height: 6rpx;
  630. margin-left: 10rpx;
  631. }
  632. }
  633. .content_tab {
  634. display: flex;
  635. box-sizing: border-box;
  636. height: 180rpx;
  637. background: #ffffff;
  638. border-radius: 16rpx;
  639. margin-top: 14rpx;
  640. padding-left: 40rpx;
  641. padding-right: 40rpx;
  642. margin-left: 30rpx;
  643. margin-right: 30rpx;
  644. justify-content: space-between;
  645. .tab_item {
  646. display: flex;
  647. flex-direction: column;
  648. align-items: center;
  649. justify-content: center;
  650. .icon_tab {
  651. width: 96rpx;
  652. height: 96rpx;
  653. }
  654. .txt_tab {
  655. font-size: 24rpx;
  656. font-family: Verdana, Verdana-Regular;
  657. font-weight: 400;
  658. text-align: center;
  659. color: #262626;
  660. margin-top: 2rpx;
  661. }
  662. }
  663. }
  664. .content_tuiguang {
  665. height: 220rpx;
  666. display: flex;
  667. box-sizing: border-box;
  668. background: #ffffff;
  669. border-radius: 16rpx;
  670. margin-top: 14rpx;
  671. padding-left: 40rpx;
  672. padding-right: 40rpx;
  673. margin-left: 30rpx;
  674. margin-right: 30rpx;
  675. justify-content: space-between;
  676. position: relative;
  677. .content_tuiguang_city {
  678. display: flex;
  679. flex-direction: column;
  680. justify-content: center;
  681. align-items: center;
  682. width: 50%;
  683. .city_num {
  684. font-size: 40rpx;
  685. font-family: DIN Alternate, DIN Alternate-Bold;
  686. font-weight: 700;
  687. text-align: center;
  688. color: #262626;
  689. }
  690. .city_num_desc {
  691. font-size: 24rpx;
  692. font-family: Verdana, Verdana-Regular;
  693. font-weight: 400;
  694. text-align: center;
  695. color: #b1b1b1;
  696. }
  697. .city_list {
  698. display: flex;
  699. justify-content: center;
  700. margin-top: 52rpx;
  701. align-items: center;
  702. .city_name {
  703. font-size: 26rpx;
  704. font-family: Verdana, Verdana-Regular;
  705. font-weight: 400;
  706. text-align: left;
  707. color: #262626;
  708. }
  709. .city_more {
  710. width: 26rpx;
  711. height: 26rpx;
  712. margin-left: 8rpx;
  713. }
  714. }
  715. }
  716. .content_tuiguang_money {
  717. display: flex;
  718. flex-direction: column;
  719. justify-content: center;
  720. align-items: center;
  721. width: 50%;
  722. .money_num {
  723. font-size: 40rpx;
  724. font-family: DIN Alternate, DIN Alternate-Bold;
  725. font-weight: 700;
  726. text-align: center;
  727. color: #fd8f3c;
  728. }
  729. .money_num_des {
  730. font-size: 24rpx;
  731. font-family: Verdana, Verdana-Regular;
  732. font-weight: 400;
  733. text-align: center;
  734. color: #b1b1b1;
  735. }
  736. .money_list {
  737. display: flex;
  738. justify-content: center;
  739. margin-top: 52rpx;
  740. align-items: center;
  741. .money_name {
  742. font-size: 26rpx;
  743. font-family: Verdana, Verdana-Regular;
  744. font-weight: 400;
  745. text-align: left;
  746. color: #262626;
  747. }
  748. .money_more {
  749. width: 26rpx;
  750. height: 26rpx;
  751. margin-left: 8rpx;
  752. }
  753. }
  754. .money_bg {
  755. position: absolute;
  756. right: 0rpx;
  757. top: 0;
  758. width: 220rpx;
  759. height: 220rpx;
  760. }
  761. }
  762. }
  763. .content_list {
  764. margin-top: 60rpx;
  765. margin-left: 30rpx;
  766. margin-right: 30rpx;
  767. padding-bottom: 50rpx;
  768. .content_title {
  769. display: flex;
  770. font-size: 32rpx;
  771. font-family: Verdana, Verdana-Bold;
  772. font-weight: 700;
  773. text-align: left;
  774. color: #262626;
  775. align-items: center;
  776. .content_title_poi {
  777. width: 8rpx;
  778. height: 12rpx;
  779. background: #f07423;
  780. border-radius: 2rpx;
  781. margin-right: 8rpx;
  782. }
  783. }
  784. .content_hongbao {
  785. margin-top: 20rpx;
  786. height: 140rpx;
  787. background: linear-gradient(108deg, #ffb55f 9%, #f87523 96%);
  788. border-radius: 16rpx;
  789. display: flex;
  790. justify-content: space-between;
  791. align-items: center;
  792. .hongbao_left {
  793. display: flex;
  794. margin-left: 26rpx;
  795. .icon_hongbao {
  796. width: 60rpx;
  797. height: 80rpx;
  798. margin-right: 20rpx;
  799. }
  800. .hongbao_left_info {
  801. display: flex;
  802. flex-direction: column;
  803. .hongbao_title {
  804. font-size: 30rpx;
  805. font-family: Verdana, Verdana-Bold;
  806. font-weight: 700;
  807. text-align: left;
  808. color: #ffffff;
  809. }
  810. .hongbao_money {
  811. font-size: 24rpx;
  812. font-family: Verdana, Verdana-Regular;
  813. font-weight: 400;
  814. text-align: left;
  815. color: #ffead8;
  816. }
  817. }
  818. }
  819. .hongbao_right {
  820. width: 140rpx;
  821. height: 56rpx;
  822. line-height: 56rpx;
  823. background: #ffffff;
  824. border-radius: 12rpx;
  825. font-size: 24rpx;
  826. font-family: Verdana, Verdana-Bold;
  827. font-weight: 700;
  828. text-align: center;
  829. color: #f07423;
  830. margin-right: 20rpx;
  831. }
  832. }
  833. .list_item {
  834. width: 100%;
  835. min-height: 280rpx;
  836. border-radius: 16rpx;
  837. display: flex;
  838. position: relative;
  839. margin-top: 20rpx;
  840. .house_img {
  841. width: 200rpx;
  842. height: 240rpx;
  843. min-width: 200rpx;
  844. z-index: 11;
  845. margin-top: 20rpx;
  846. margin-left: 20rpx;
  847. border-radius: 10rpx;
  848. }
  849. .item_content {
  850. display: flex;
  851. flex-direction: column;
  852. margin-left: 50rpx;
  853. z-index: 11;
  854. max-width: 51%;
  855. .house_name {
  856. width: 100%;
  857. word-break:break-all;
  858. font-size: 30rpx;
  859. font-family: Verdana, Verdana-Bold;
  860. font-weight: 700;
  861. text-align: left;
  862. color: #262626;
  863. margin-top: 20rpx;
  864. }
  865. .house_hk {
  866. width: 100%;
  867. font-size: 26rpx;
  868. font-family: Verdana, Verdana-Regular;
  869. font-weight: 400;
  870. text-align: left;
  871. color: #fd8f3c;
  872. margin-top: 8rpx;
  873. .house_hk_{
  874. margin-right: 10rpx;
  875. }
  876. }
  877. .house_address {
  878. width: 100%;
  879. display: flex;
  880. font-size: 24rpx;
  881. font-family: Verdana, Verdana-Regular;
  882. font-weight: 400;
  883. text-align: left;
  884. color: #b1b1b1;
  885. margin-top: 16rpx;
  886. image {
  887. width: 20rpx;
  888. height: 28rpx;
  889. margin-right: 8rpx;
  890. margin-top: 6rpx;
  891. }
  892. text {
  893. width: 80%;
  894. }
  895. }
  896. .house_num {
  897. display: flex;
  898. font-size: 24rpx;
  899. font-family: Verdana, Verdana-Regular;
  900. font-weight: 400;
  901. text-align: left;
  902. color: #b1b1b1;
  903. margin-top: 12rpx;
  904. image {
  905. width: 24rpx;
  906. height: 26rpx;
  907. margin-right: 8rpx;
  908. margin-top: 6rpx;
  909. }
  910. text {
  911. width: 80%;
  912. }
  913. }
  914. .house_desc {
  915. margin-top: 24rpx;
  916. font-size: 24rpx;
  917. font-family: Verdana, Verdana-Regular;
  918. font-weight: 400;
  919. text-align: left;
  920. color: #b1b1b1;
  921. margin-bottom: 20rpx;
  922. word-break:break-all;
  923. }
  924. }
  925. .item_share {
  926. z-index: 11;
  927. display: flex;
  928. flex-direction: column;
  929. width: 70rpx;
  930. height: 100rpx;
  931. background: #f07423;
  932. border-radius: 12rpx;
  933. position: absolute;
  934. right: 0;
  935. top: 50%;
  936. transform: translateY(-50%);
  937. justify-content: center;
  938. align-items: center;
  939. .icon_share {
  940. width: 32rpx;
  941. height: 32rpx;
  942. margin-bottom: 6rpx;
  943. }
  944. .icon_text {
  945. font-size: 24rpx;
  946. font-family: Verdana, Verdana-Bold;
  947. font-weight: 700;
  948. text-align: center;
  949. color: #ffffff;
  950. }
  951. }
  952. .item_bg {
  953. position: absolute;
  954. left: 0;
  955. top: 0;
  956. width: 95%;
  957. height: 100%;
  958. background-color: #FFFFFF;
  959. border-radius: 16rpx;
  960. z-index: 10;
  961. }
  962. }
  963. }
  964. }
  965. .com_noMore_text{
  966. margin-top: 40rpx;
  967. font-size: 24rpx;
  968. font-family: Verdana, Verdana-Regular;
  969. font-weight: 400;
  970. text-align: center;
  971. color: #999999;
  972. }
  973. .empty {
  974. display: flex;
  975. flex-direction: column;
  976. align-items: center;
  977. .emptyImg {
  978. width: 283rpx;
  979. height: 227rpx;
  980. }
  981. .text {
  982. margin-top: -20rpx;
  983. font-size: 28rpx;
  984. font-family: PingFang SC, PingFang SC-Medium;
  985. font-weight: 500;
  986. text-align: center;
  987. color: #b1b3ba;
  988. }
  989. }
  990. }
  991. </style>