index.vue 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859
  1. <template>
  2. <view class="page u-skeleton">
  3. <wm-watermark :text="userInfo.phone" :num="50"></wm-watermark>
  4. <!-- 经纪人信息卡片 -->
  5. <view class="userinfo-wrap u-skeleton-fillet box-shadow">
  6. <!-- 个人信息 -->
  7. <view class="userinfo">
  8. <view class="user">
  9. <view class="avatar-wrap" @click="pageTo('/pages/user/setting/avatar')">
  10. <u-avatar
  11. class="u-skeleton-circle"
  12. :src="userInfo.avatar"
  13. size="128"
  14. mode="circle"
  15. ></u-avatar>
  16. <!-- :show-level="true" -->
  17. <view class="avatar-bg box-shadow"></view>
  18. </view>
  19. <view class="info">
  20. <view class="nickname u-skeleton-rect">
  21. {{userInfo.user_id ? userInfo.nickname ? userInfo.nickname : '未设置用户名' : '未登录'}}
  22. </view>
  23. </view>
  24. <image v-if="userInfo && userInfo.manage_type == 2" src="/static/index/i_c_1.png" class="scoped-scan-img" @click="scanHandle"></image>
  25. </view>
  26. <u-button
  27. v-if="!userInfo.user_id"
  28. class="u-skeleton-fillet"
  29. size="mini"
  30. type="primary"
  31. @click="pageTo('/pages/user/login/login')"
  32. :customStyle="{ margin: 0 }"
  33. >
  34. 立即登录
  35. </u-button>
  36. <view
  37. v-if="userInfo.user_id" style="padding: 20rpx 30rpx" @click="pageTo('/pages/user/setting/setting')">
  38. <u-icon name="/static/index/i_c_2.png" size="40"></u-icon>
  39. </view>
  40. </view>
  41. <u-line length="650rpx" margin="30rpx 0 0"></u-line>
  42. <!-- 数据信息 -->
  43. <view class="datainfo">
  44. <view class="data-item" @click="pageTo('/pages/agent/recommend/list?filterStepStatus=1')">
  45. <view class="data u-skeleton-fillet">{{reportStepCountObj['1'] || 0}}</view>
  46. <view class="item u-skeleton-fillet">未到访</view>
  47. </view>
  48. <view class="data-item" @click="pageTo('/pages/agent/recommend/list?filterStepStatus=2')">
  49. <view class="data u-skeleton-fillet">{{reportStepCountObj['2'] || 0}}</view>
  50. <view class="item u-skeleton-fillet">已到访</view>
  51. </view>
  52. <view class="data-item" @click="pageTo('/pages/agent/recommend/list?filterStepStatus=3')">
  53. <view class="data u-skeleton-fillet">{{reportStepCountObj['3'] || 0}}</view>
  54. <view class="item u-skeleton-fillet">已认购</view>
  55. </view>
  56. <view class="data-item" @click="pageTo('/pages/agent/recommend/list?filterStepStatus=4')">
  57. <view class="data u-skeleton-fillet">
  58. {{reportStepCountObj['4'] || 0}}
  59. </view>
  60. <view class="item u-skeleton-fillet">已签约</view>
  61. </view>
  62. <view class="data-item" @click="pageTo('/pages/agent/recommend/list?filterStepStatus=5')">
  63. <view class="data u-skeleton-fillet">{{reportStepCountObj['5'] || 0}}</view>
  64. <view class="item u-skeleton-fillet">已结佣</view>
  65. </view>
  66. </view>
  67. </view>
  68. <!-- 功能卡片 -->
  69. <view class="scoped-entry">
  70. <view class="op" @click="pageTo('/pages/agent/recommend/create')">
  71. <u-image src="/static/index/i_e_1.png" mode="heightFix" height="146rpx" class="icon"></u-image>
  72. </view>
  73. <view class="op" @click="pageTo('/pages/agent/recommend/list')">
  74. <u-image src="/static/index/i_e_2.png" mode="heightFix" height="146rpx" class="icon"></u-image>
  75. </view>
  76. <view class="op" @click="pageTo('/pages/cust/list')">
  77. <u-image src="/static/index/i_e_3.png" mode="heightFix" height="146rpx" class="icon"></u-image>
  78. </view>
  79. <view class="op" @click="commonRulesShow = true">
  80. <u-image src="/static/index/i_e_4.png" mode="heightFix" height="146rpx" class="icon"></u-image>
  81. </view>
  82. </view>
  83. <!-- <view class="function-card-wrap">
  84. <view class="col-card-wrap">
  85. <view class="function-card box-shadow u-skeleton-fillet" @click="pageTo('/pages/agent/recommend/create')">
  86. <view class="title-wrap">
  87. <view class="main-title">
  88. <u-icon class="u-m-r-5" name="/static/icon/thump-up.png" size="32"></u-icon>
  89. ️我要推荐
  90. </view>
  91. <view class="sub-title u-line-1">Recommend</view>
  92. </view>
  93. <u-image src="/static/icon/wenli1.png" mode="heightFix" height="144rpx" class="icon"></u-image>
  94. </view>
  95. <view class="function-card box-shadow u-skeleton-fillet" @click="pageTo('/pages/agent/recommend/list')">
  96. <view class="title-wrap">
  97. <view class="main-title">
  98. <u-icon class="u-m-r-5" name="/static/icon/money.png" size="32"></u-icon>
  99. 报备管理
  100. </view>
  101. <view class="sub-title u-line-1">Filing</view>
  102. </view>
  103. <u-image src="/static/icon/wenli2.png" mode="heightFix" height="144rpx" class="icon"></u-image>
  104. </view>
  105. </view>
  106. <view class="col-card-wrap">
  107. <view class="function-card box-shadow u-skeleton-fillet" @click="pageTo('/pages/cust/list')">
  108. <view class="title-wrap">
  109. <view class="main-title">
  110. <u-icon class="u-m-r-5" name="/static/icon/customer.png" size="32"></u-icon>
  111. 客户管理
  112. </view>
  113. <view class="sub-title u-line-1">Customer</view>
  114. </view>
  115. <u-image src="/static/icon/wenli3.png" mode="heightFix" height="144rpx" class="icon"></u-image>
  116. </view>
  117. <view class="function-card box-shadow u-skeleton-fillet" @click="commonRulesShow = true">
  118. <view class="title-wrap">
  119. <view class="main-title">
  120. <u-icon class="u-m-r-5" name="/static/icon/book.png" size="32"></u-icon>
  121. 奖励政策
  122. </view>
  123. <view class="sub-title u-line-1">Rules</view>
  124. </view>
  125. <u-image src="/static/icon/wenli4.png" mode="heightFix" height="144rpx" class="icon"></u-image>
  126. </view>
  127. </view>
  128. </view> -->
  129. <!-- 项目卡片 -->
  130. <view class="card-list-wrap box-shadow u-m-b-20">
  131. <view class="header-title-warp">
  132. <view class="title u-skeleton-rect">
  133. <u-icon class="u-m-r-10" name="/static/index/i_c_3.png" size="36"></u-icon>
  134. 热销推荐
  135. </view>
  136. <!-- <view v-show="propertyList.length > 5" class="more u-skeleton-rect">
  137. 更多
  138. <u-icon name="arrow-right"></u-icon>
  139. </view> -->
  140. <view class="more u-skeleton-rect" @click="this.isOneRow = !this.isOneRow">{{isOneRow ? '切换至双行' : '切换至单行'}}</view>
  141. </view>
  142. <view v-if="propertyList.length == 0" class="u-m-t-40 u-m-b-40"><u-empty mode="list" text="暂无在售房源"></u-empty></view>
  143. <view class="scoped-list-one" v-for="(item, one) in twoObj" :key="one">
  144. <view class="slo-title">{{item.str}}</view>
  145. <view :class="isOneRow ? 'property-row-wrap' : 'property-col-wrap'">
  146. <view class="property-body u-skeleton-fillet box-shadow" v-for="(item, index) in item.list" :key="index" @click="showDetail(index, item)">
  147. <view class="image-wrap">
  148. <text class="tag u-skeleton-rect">{{ item.estate_tag }}</text>
  149. <image class="u-skeleton-rect" :src="item.pri_image" mode="aspectFill"></image>
  150. </view>
  151. <view class="property-info-wrap">
  152. <view class="title u-skeleton-rect">{{ item.estate_name }}
  153. <text class="s">{{areaTypeObj[item.area_type]}}</text>
  154. </view>
  155. <view class="commission u-skeleton-rect" v-if="userInfo.auth_state == 1">预计奖励:{{ item.brokerage }}</view>
  156. </view>
  157. </view>
  158. </view>
  159. </view>
  160. </view>
  161. <!-- 平台佣金政策弹窗 -->
  162. <u-popup v-model="commonRulesShow" mode="center" width="80%" height="800rpx" border-radius="20" closeable>
  163. <view class="bwin-popup">
  164. <view class="popup-header">平台佣金政策</view>
  165. <view class="popup-body">需上传身份证、银行卡进行实名认证,认证通过后方可报备客户和获得佣金,各楼盘相关带看规则和佣金政策点击下方对应楼盘<!-- <u-parse :html="xxxxxxxxxx"></u-parse> --></view>
  166. </view>
  167. </u-popup>
  168. <!-- 项目佣金政策信息弹窗 -->
  169. <u-popup v-model="propertyPopupShow" mode="center" width="80%" height="90%" border-radius="20" closeable>
  170. <view class="bwin-popup">
  171. <view class="popup-header">{{ currentPropertyObj.estate_name + '介绍' }}</view>
  172. <view class="popup-body">
  173. <view class="scoped-popup-more" @click="oneImgHandle(currentPropertyObj)">
  174. <u-image src="/static/index/popup_bg_more.png" mode="heightFix" height="118rpx" class="icon"></u-image>
  175. </view>
  176. <u-parse :html="currentPropertyObj.introduce"></u-parse>
  177. <u-divider marginTop="20" marginBottom="20">详情</u-divider>
  178. <view class="property-info">
  179. <!-- <view class="item">
  180. <view class="item-title">基本情况:</view>
  181. <view class="item-info" style="text-decoration: underline;color: #2080f0;">点击查看楼盘一页纸</view>
  182. </view> -->
  183. <view class="item" v-if="userInfo.auth_state == 1">
  184. <view class="item-title">预计奖励:</view>
  185. <view class="item-info" style="color: red;font-weight: bold;">{{ currentPropertyObj.brokerage }}</view>
  186. </view>
  187. <view class="item">
  188. <view class="item-title">营销中心:</view>
  189. <view class="item-info">{{ currentPropertyObj.address }}</view>
  190. </view>
  191. <view class="item">
  192. <view class="item-title">销售热线:</view>
  193. <view class="item-info">{{ currentPropertyObj.marketing_phone || '00000000' }}</view>
  194. </view>
  195. <view class="item">
  196. <view class="item-title">带看需收集:</view>
  197. <view class="item-info">{{ currentPropertyObj.report_visit }}</view>
  198. </view>
  199. <view class="item">
  200. <view class="item-title">报备保护期:</view>
  201. <view class="item-info">{{ currentPropertyObj.report_lock + '天' }}</view>
  202. </view>
  203. <view class="item">
  204. <view class="item-title">带看保护期:</view>
  205. <view class="item-info">{{ currentPropertyObj.lead_lock + '天' }}</view>
  206. </view>
  207. </view>
  208. <u-divider marginTop="20" marginBottom="20">更多</u-divider>
  209. <view class="scoped-estate-desc">
  210. <!-- <view v-html="curHtml"></view> -->
  211. <rich-text :nodes="curHtml | filtersRichText"></rich-text>
  212. </view>
  213. </view>
  214. </view>
  215. </u-popup>
  216. <!-- 骨架屏 -->
  217. <u-skeleton :loading="skeletonLoading" animation></u-skeleton>
  218. <backTop :src="backTop.src" :scrollTop="backTop.scrollTop"></backTop>
  219. </view>
  220. </template>
  221. <script>
  222. var that;
  223. import { arrToObj } from '@/utils'
  224. import backTop from '@/components/back-top/back-top.vue'
  225. import wmWatermark from '@/components/wm-watermark/wm-watermark.vue'
  226. export default {
  227. components: {
  228. backTop,
  229. wmWatermark
  230. },
  231. filters: {
  232. filtersRichText(html) { //控制小程序中图片大小
  233. let newContent = html.replace(/<img[^>]*>/gi, (match, capture)=>{
  234. match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
  235. match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
  236. match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
  237. return match;
  238. });
  239. newContent = newContent.replace(/style="[^"]+"/gi, (match, capture)=>{
  240. match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
  241. return match;
  242. });
  243. newContent = newContent.replace(/<br[^>]*\/>/gi, '');
  244. newContent = newContent.replace(/\<img/gi,
  245. '<img style="max-width:100%;height:auto;display:inline-block;margin:10rpx auto;"');
  246. return newContent;
  247. }
  248. },
  249. data() {
  250. // 页面数据变量
  251. return {
  252. isOneRow: false,
  253. curHtml: '',
  254. backTop: {
  255. src: '../../static/back-top/top.png',
  256. scrollTop: 0
  257. },
  258. userInfo: {},
  259. skeletonLoading: true,
  260. agentTypeList: ['', '自由经纪人', '渠道经纪人', '老业主'],
  261. propertyList: [
  262. {
  263. estate_name: '在售项目1',
  264. pri_image: 'https://zdcdn.2bwin.cn/uploads/20220501/af6eb9c2a5d462be10a15c2302e5e6b5.jpg',
  265. sale_tag: '刚需好盘',
  266. rulesInfo: {
  267. des: '内容加载中1....',
  268. des_content: '内容加载中2....'
  269. }
  270. },
  271. ],
  272. commonRulesShow: false,
  273. propertyPopupShow: false,
  274. currentPropertyIndex: 0,
  275. currentPropertyObj: {},
  276. // init请求返回的数据
  277. data: {},
  278. // 表单请求数据
  279. form1: {},
  280. scrollTop: 0,
  281. reportStepCountObj: {},
  282. areaTypeObj: {},
  283. twoObj: {},
  284. };
  285. },
  286. onPageScroll(e) {
  287. this.scrollTop = e.scrollTop;
  288. this.backTop.scrollTop = e.scrollTop;
  289. },
  290. // 监听 - 页面每次【加载时】执行(如:前进)
  291. onLoad(options = {}) {
  292. // that = this;
  293. // this.options = options;
  294. // this.init(options);
  295. },
  296. // 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快,会在页面进入动画完成前触发
  297. onReady() {
  298. },
  299. // 监听 - 页面每次【显示时】执行(如:前进和返回) (页面每次出现在屏幕上都触发,包括从下级页面点返回露出当前页面)
  300. onShow() {
  301. this.init()
  302. this.checkUpdate()
  303. // const dictObj = uni.getStorageSync('MD_dict')
  304. // this.areaTypeObj = arrToObj(dictObj.area_type)
  305. },
  306. // 监听 - 页面每次【隐藏时】执行(如:返回)
  307. onHide() {},
  308. // 监听 - 页面触底部
  309. onReachBottom() {},
  310. // 监听 - 窗口尺寸变化(仅限:App、微信小程序)
  311. onResize() {},
  312. // 监听 - 点击右上角转发时
  313. onShareAppMessage(options) {},
  314. // 监听 - 页面创建时
  315. created() {},
  316. // 函数
  317. methods: {
  318. checkUpdate() {
  319. const updateManager = uni.getUpdateManager();
  320. updateManager.onUpdateReady(function(res) {
  321. uni.showModal({
  322. title: '更新提示',
  323. content: '新版本已经准备好,是否重启应用?',
  324. success(res) {
  325. if (res.confirm) {
  326. // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
  327. updateManager.applyUpdate()
  328. }
  329. }
  330. })
  331. })
  332. },
  333. oneImgHandle (item) {
  334. uni.api.estate.apiestateinfodetail({id: item.id}).then(res => {
  335. const curImgUrl = res.info_img || ''
  336. if (!curImgUrl) {
  337. uni.$msg('该楼盘暂未设置一页纸楼盘简介~')
  338. return
  339. }
  340. uni.previewImage({
  341. current: curImgUrl,
  342. urls: [curImgUrl],
  343. })
  344. })
  345. },
  346. scanHandle () {
  347. uni.scanCode({
  348. success: function (res) {
  349. uni.navigateTo({
  350. url: `/pages/agent/recommend/detail2?id=${res.result}`
  351. })
  352. }
  353. })
  354. },
  355. // 页面数据初始化函数
  356. init(options) {
  357. const userInfo2 = uni.getStorageSync('MD_userInfo2')
  358. this.userInfo = userInfo2 || {}
  359. uni.api.estate.apireportcount().then(res => {
  360. const reportStepCount = res.report_step_count || []
  361. let reportStepCountObj = {}
  362. reportStepCount.forEach(item => {
  363. reportStepCountObj[item.report_step] = item.total || 0
  364. })
  365. this.reportStepCountObj = {...reportStepCountObj}
  366. })
  367. uni.api.estate.apiestatelist({page_size: 100}).then(res => {
  368. const list = res.list || []
  369. const dictObj = uni.getStorageSync('MD_dict')
  370. const areaTypeObj = arrToObj(dictObj.area_type)
  371. let twoObj = {}
  372. list.forEach(item => {
  373. if (twoObj[item.area_type]) {
  374. twoObj[item.area_type].list.push(item)
  375. } else {
  376. twoObj[item.area_type] = {
  377. list: [item],
  378. str: areaTypeObj[item.area_type],
  379. }
  380. }
  381. })
  382. this.twoObj = {...twoObj}
  383. // console.log(twoObj)
  384. // let oneObj = list[0] || {}
  385. this.propertyList = [...list]
  386. // this.propertyList = [list[0], list[1], list[2]]
  387. })
  388. // let currentTime = Date.parse(new Date()) / 1000; // 秒级
  389. // // 初始化平台数据
  390. // let systemConfig = vk.vuex.get('$app.systemConfig');
  391. // if (!systemConfig.use_skeleton) {
  392. this.skeletonLoading = false;
  393. // }
  394. // if (vk.pubfn.isNull(systemConfig._id)) {
  395. // // 不存在则直接初始化
  396. // vk.callFunction({
  397. // url: 'client/agent/pub/getConfigInfo',
  398. // needAlert: false
  399. // }).then(res => {
  400. // vk.vuex.set('$app.systemConfig', res.config);
  401. // vk.vuex.set('$app.systemConfig.lastGetTime', currentTime);
  402. // });
  403. // } else {
  404. // let mathTime = ((currentTime - systemConfig.lastGetTime) / 3600).toFixed(2);
  405. // if (mathTime > systemConfig.cache_time) {
  406. // vk.callFunction({
  407. // url: 'client/agent/pub/getConfigInfo',
  408. // needAlert: false
  409. // }).then(res => {
  410. // vk.vuex.set('$app.systemConfig', res.config);
  411. // vk.vuex.set('$app.systemConfig.lastGetTime', currentTime);
  412. // });
  413. // }
  414. // }
  415. // // 请求经纪人个人数据
  416. // let lastInitAgentDataTime = vk.vuex.get('$user.history.lastInitAgentDataTime');
  417. // if (currentTime - lastInitAgentDataTime >= 60 && vk.checkToken()) {
  418. // // 个人数据1分钟主动更新1次
  419. // vk.callFunction({
  420. // url: 'client/agent/kh/getAgentData',
  421. // data: {
  422. // agentId: vk.vuex.get('$user.agentInfo._id')
  423. // },
  424. // needAlert: false
  425. // }).then(res => {
  426. // vk.vuex.set('$user.dataInfo.recommendNum', res.data.recommendNum);
  427. // vk.vuex.set('$user.dataInfo.visitedNum', res.data.visitedNum);
  428. // vk.vuex.set('$user.dataInfo.buyNum', res.data.buyNum);
  429. // vk.vuex.set('$user.dataInfo.totalCommission', res.data.totalCommission);
  430. // vk.vuex.set('$user.history.lastInitAgentDataTime', currentTime);
  431. // });
  432. // }
  433. // // 请求未读消息数量
  434. // // 最快1分钟请求一次
  435. // let lastGetUnreadMsgTime = vk.vuex.get('$user.history.lastGetUnreadMsgTime');
  436. // if (currentTime - lastGetUnreadMsgTime > 60 && vk.checkToken()) {
  437. // vk.callFunction({
  438. // url: 'client/agent/kh/getUnreadMsgNum'
  439. // }).then(res => {
  440. // vk.vuex.set('$user.dataInfo.unreadMsgNum', res.num);
  441. // vk.vuex.set('$user.history.lastGetUnreadMsgTime', currentTime);
  442. // });
  443. // }
  444. // // 请求在售项目列表
  445. // vk.callFunction({
  446. // url: 'client/agent/pub/getPropertyList',
  447. // needAlert: false
  448. // }).then(res => {
  449. // that.propertyList = res.list;
  450. // // 存储到vuex,方便其他页面调用
  451. // if (res.list.length < 5) {
  452. // // 若大于等于5则可能有更多项目,则不缓存
  453. // let list = res.list.map(function(val, index) {
  454. // return { value: val._id, label: val.name };
  455. // });
  456. // vk.vuex.set('$app.propertyList', list);
  457. // }
  458. // // 拼接佣金政策
  459. // // 非经纪人身份时显示佣金政策简介
  460. // // 否则显示最高可获得的佣金额度
  461. // let i;
  462. // for (i = 0; i < res.list.length; i++) {
  463. // let agentType = vk.vuex.get('$user.agentInfo.type');
  464. // if (vk.pubfn.isNull(agentType)) {
  465. // // 还未注册为经纪人
  466. // that.propertyList[i].commissionText = that.propertyList[i].rulesInfo.des;
  467. // } else {
  468. // let commissionInfo = that.propertyList[i].rulesInfo.commission_info;
  469. // let item = vk.pubfn.getListItem(commissionInfo, 'type', agentType);
  470. // that.propertyList[i].commissionText = '您最高可获得佣金' + item.amount + '元';
  471. // }
  472. // }
  473. // that.skeletonLoading = false;
  474. // });
  475. },
  476. pageTo(path) {
  477. if (path === 'dev') {
  478. uni.$msg('开发中~')
  479. return
  480. }
  481. uni.navigateTo({
  482. url: path
  483. })
  484. },
  485. // 弹窗展示项目佣金详情
  486. showDetail(index, item) {
  487. if (this.userInfo && this.userInfo.auth_state == 1) {
  488. this.currentPropertyIndex = index;
  489. this.currentPropertyObj = item
  490. this.propertyPopupShow = true;
  491. uni.api.estate.apiestatecontentdetail({id: item.id}).then(res => {
  492. this.curHtml = res.content || ''
  493. })
  494. } else {
  495. uni.$msgConfirm('请点击首页右上角设置,进行实名认证,实名认证后可查看详细信息')
  496. }
  497. }
  498. },
  499. // 监听器
  500. watch: {},
  501. // 计算属性
  502. computed: {}
  503. };
  504. </script>
  505. <style lang="scss" scoped>
  506. .page {
  507. min-height: calc(100vh - 44px);
  508. }
  509. .userinfo-wrap {
  510. display: flex;
  511. flex-direction: column;
  512. align-items: flex-start;
  513. background-color: #fff;
  514. padding: 10rpx 26rpx 26rpx;
  515. width: 100%;
  516. margin-bottom: 20rpx;
  517. border-radius: 10rpx;
  518. position: relative;
  519. .userinfo {
  520. width: 100%;
  521. display: flex;
  522. align-items: center;
  523. justify-content: space-between;
  524. .user {
  525. display: flex;
  526. align-items: center;
  527. .avatar-wrap {
  528. position: relative;
  529. .avatar-bg {
  530. position: absolute;
  531. left: 0;
  532. top: 0;
  533. border-radius: 50%;
  534. width: 128rpx;
  535. height: 128rpx;
  536. }
  537. }
  538. .info {
  539. margin-left: 32rpx;
  540. .nickname {
  541. font-size: $u-p;
  542. font-weight: bold;
  543. color: $u-main-color;
  544. margin-bottom: 5rpx;
  545. }
  546. .mobile {
  547. font-size: $u-p1;
  548. color: $u-tips-color;
  549. }
  550. }
  551. }
  552. }
  553. .datainfo {
  554. width: 100%;
  555. display: flex;
  556. align-items: flex-end;
  557. justify-content: space-between;
  558. padding: 20rpx 0 0;
  559. .data-item {
  560. display: flex;
  561. flex-direction: column;
  562. align-items: center;
  563. .data {
  564. font-weight: bold;
  565. font-size: $u-h2;
  566. line-height: $u-h2;
  567. margin-bottom: 10rpx;
  568. }
  569. .item {
  570. font-size: $u-p2;
  571. color: $u-content-color;
  572. }
  573. }
  574. }
  575. }
  576. .function-card-wrap {
  577. .col-card-wrap {
  578. display: flex;
  579. align-items: center;
  580. justify-content: space-between;
  581. }
  582. .function-card {
  583. background-color: #fff;
  584. padding: 32rpx 20rpx;
  585. width: 345rpx;
  586. margin-bottom: 20rpx;
  587. border-radius: 10rpx;
  588. position: relative;
  589. overflow: hidden;
  590. .title-wrap {
  591. text-align: left;
  592. .main-title {
  593. display: flex;
  594. align-items: center;
  595. font-size: $u-p;
  596. font-weight: bold;
  597. }
  598. .sub-title {
  599. font-size: $u-p2;
  600. color: $u-content-color;
  601. }
  602. }
  603. .icon {
  604. text-align: right;
  605. position: absolute;
  606. top: 0;
  607. right: 0;
  608. }
  609. }
  610. }
  611. // 项目列表
  612. .card-list-wrap {
  613. background-color: #fff;
  614. // margin: 0rpx -20rpx 20rpx;
  615. padding: 20rpx 20rpx 0 20rpx;
  616. display: flex;
  617. flex-direction: column;
  618. border-radius: 10rpx;
  619. .header-title-warp {
  620. width: 100%;
  621. margin-bottom: 20rpx;
  622. display: flex;
  623. align-items: center;
  624. justify-content: space-between;
  625. .title {
  626. display: flex;
  627. align-items: center;
  628. color: $u-main-color;
  629. font-weight: bold;
  630. font-size: $u-p;
  631. }
  632. .more {
  633. font-size: $u-sub;
  634. color: $u-tips-color;
  635. }
  636. }
  637. // 行版
  638. .property-row-wrap {
  639. .property-body {
  640. width: 100%;
  641. border-radius: 10rpx;
  642. margin-bottom: 20rpx;
  643. // background-color: #fff;
  644. .image-wrap {
  645. position: relative;
  646. image {
  647. width: 100%;
  648. height: 300rpx;
  649. display: block;
  650. border-top-left-radius: 10rpx;
  651. border-top-right-radius: 10rpx;
  652. }
  653. .tag {
  654. color: #ffffff;
  655. // background-color: $u-theme-color;
  656. background: #8BC34A;
  657. font-size: $u-p2;
  658. position: absolute;
  659. z-index: 1;
  660. left: 0;
  661. padding: 8rpx 20rpx;
  662. border-top-left-radius: 10rpx;
  663. border-bottom-right-radius: 10rpx;
  664. }
  665. }
  666. .property-info-wrap {
  667. padding: 20rpx;
  668. .title {
  669. font-weight: bold;
  670. color: $u-main-color;
  671. font-size: $u-p;
  672. .s {
  673. font-weight: normal;
  674. padding-left: 10rpx;
  675. }
  676. }
  677. .commission {
  678. margin-top: 10rpx;
  679. font-size: $u-p2;
  680. color: $u-content-color;
  681. }
  682. }
  683. }
  684. }
  685. // 两列版
  686. .property-col-wrap {
  687. display: flex;
  688. flex-wrap: wrap;
  689. justify-content: space-between;
  690. align-items: flex-start;
  691. .property-body {
  692. width: 325rpx;
  693. border-radius: 10rpx;
  694. margin-bottom: 20rpx;
  695. // background-color: #fff;
  696. .image-wrap {
  697. position: relative;
  698. image {
  699. width: 100%;
  700. height: 210rpx;
  701. display: block;
  702. border-top-left-radius: 10rpx;
  703. border-top-right-radius: 10rpx;
  704. }
  705. .tag {
  706. color: #ffffff;
  707. // background-color: $u-theme-color;
  708. background: #8BC34A;
  709. font-size: $u-sub;
  710. position: absolute;
  711. z-index: 1;
  712. left: 0;
  713. padding: 8rpx 20rpx;
  714. border-top-left-radius: 10rpx;
  715. border-bottom-right-radius: 10rpx;
  716. }
  717. }
  718. .property-info-wrap {
  719. padding: 20rpx;
  720. .title {
  721. font-weight: bold;
  722. color: $u-main-color;
  723. font-size: $u-p2;
  724. .s {
  725. font-weight: normal;
  726. padding-left: 10rpx;
  727. }
  728. }
  729. .commission {
  730. margin-top: 10rpx;
  731. font-size: $u-sub;
  732. color: $u-content-color;
  733. }
  734. }
  735. }
  736. }
  737. }
  738. .popup-body {
  739. .property-info {
  740. font-size: $u-p1;
  741. .item {
  742. display: flex;
  743. margin-bottom: 10rpx;
  744. text-align: left;
  745. .item-title {
  746. font-weight: bold;
  747. width: 170rpx;
  748. }
  749. .item-info {
  750. flex: 1;
  751. }
  752. }
  753. }
  754. }
  755. .scoped-scan-img {
  756. padding-left: 20px;
  757. width: 40rpx;
  758. height: 40rpx;
  759. }
  760. .scoped-estate-desc {
  761. padding: 10rpx;
  762. iamge, img {
  763. width: 100%;
  764. }
  765. }
  766. .scoped-popup-more {
  767. width: 100%;
  768. height: 118rpx;
  769. margin-left: -20rpx;
  770. margin-top: -20rpx;
  771. margin-bottom: 20rpx;
  772. }
  773. .scoped-entry {
  774. display: flex;
  775. flex-wrap: wrap;
  776. .op {
  777. flex: 1;
  778. margin-bottom: 20rpx;
  779. &:nth-child(2n) {
  780. text-align: right;
  781. }
  782. }
  783. }
  784. .scoped-list-one {
  785. .slo-title {
  786. margin-top: 20rpx;
  787. margin-bottom: 20rpx;
  788. color: #2080f0;
  789. font-weight: bold;
  790. border-left: 2PX solid #2080f0;
  791. padding-left: 10rpx;
  792. font-size: 32rpx;
  793. }
  794. }
  795. </style>