homePage.vue 30 KB

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