homePage.vue 30 KB

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