homePage.vue 27 KB

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