homePage.vue 30 KB

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