indexDtl.jsx 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059
  1. import Taro, { Component } from '@tarojs/taro'
  2. import { View, Map, Image, Swiper, SwiperItem, Button, ScrollView } from '@tarojs/components'
  3. import { arrToObj } from '@utils'
  4. import LoginPopup from '@/c/login/Popup'
  5. import Comment from './components/indexDtl/comment'
  6. import ListMore from '@/c/pageDataList/listMore'
  7. import Header from './components/indexDtl/header'
  8. import News from './components/indexDtl/news'
  9. import Chat from './components/indexDtl/chat/com'
  10. import Rooms from './components/indexDtl/rooms'
  11. import MoreHouse from './components/indexDtl/moreHouse'
  12. import HouseChannel from './components/indexDtl/channel'
  13. import './indexDtl.scss'
  14. class Index extends Component {
  15. onShareAppMessage() {
  16. const userInfo = Taro.getStorageSync('APP_userInfo') || {}
  17. const { curId, curObj } = this.state
  18. if (userInfo.is_sale == 1) {
  19. return {
  20. title: `${userInfo.nickname}给您推荐:${curObj.estate_name}`,
  21. path: `/pagesHouse/indexDtl?id=${curId}&referrer=${userInfo.user_id}`,
  22. }
  23. } else {
  24. return {
  25. title: `${curObj.estate_name}-楼盘详情`,
  26. path: `/pagesHouse/indexDtl?id=${curId}`,
  27. }
  28. }
  29. }
  30. onShareTimeline () {
  31. const userInfo = Taro.getStorageSync('APP_userInfo') || {}
  32. const { curId, curObj } = this.state
  33. if (userInfo.is_sale == 1) {
  34. return {
  35. title: `${userInfo.nickname}给您推荐:${curObj.estate_name}`,
  36. path: `/pagesHouse/indexDtl?id=${curId}&referrer=${userInfo.user_id}`,
  37. }
  38. } else {
  39. return {
  40. title: `${curObj.estate_name}-楼盘详情`,
  41. path: `/pagesHouse/indexDtl?id=${curId}`,
  42. }
  43. }
  44. }
  45. constructor (props) {
  46. super(props)
  47. const {id: curId} = this.$router.params
  48. this.state = {
  49. curId,
  50. curObj: {},
  51. curImgIndex: 0,
  52. isLoginPopupShow: false,
  53. token: '',
  54. userInfo: '',
  55. photoList: [],
  56. buyRuleObj: {},
  57. viewId: '',
  58. referrer: '',
  59. }
  60. }
  61. config = {
  62. navigationBarTitleText: '楼盘详情',
  63. }
  64. componentWillMount () {
  65. let userInfo = Taro.getStorageSync('APP_userInfo')
  66. if (userInfo) {
  67. this.setState({
  68. userInfo
  69. })
  70. }
  71. Taro.removeStorageSync('APP_MY_REFERRER')
  72. const {referrer} = this.$router.params
  73. if (referrer) {
  74. this.setState({
  75. referrer
  76. })
  77. Taro.removeStorageSync('APP_cur_sale')
  78. Taro.setStorageSync("APP_MY_REFERRER", referrer)
  79. }
  80. }
  81. componentDidMount () {
  82. Taro.$AHU(this)
  83. const { curId } = this.state
  84. this.getDtl(() => {
  85. const { curId, curObj } = this.state
  86. let historyRecordArr = Taro.getStorageSync('APP_historyRecord') || []
  87. let cIndex = -1
  88. historyRecordArr.forEach((item, index) => {
  89. if (String(item.id) === String(curId)) {
  90. cIndex = index
  91. }
  92. })
  93. if (cIndex !== -1) historyRecordArr.splice(cIndex, 1)
  94. if (historyRecordArr.length > 19) historyRecordArr.splice(19, 1)
  95. historyRecordArr.unshift(curObj)
  96. Taro.setStorageSync('APP_historyRecord', historyRecordArr)
  97. // Taro.api.house.estatephotolist({estate_id: curId}).then(res => {
  98. // const cArr = res.data ? JSON.parse(res.data) : []
  99. // this.setState({
  100. // photoList: cArr
  101. // })
  102. // })
  103. // Taro.api.other.apiactivityruleinfo({estate_id: curId}).then(res => {
  104. // this.setState({
  105. // buyRuleObj: res.rule || {}
  106. // })
  107. // })
  108. const { scrollInto } = this.$router.params
  109. if (scrollInto === 'comment') {
  110. setTimeout(() => {
  111. this.setState({
  112. viewId: 'stComment'
  113. })
  114. }, 500)
  115. }
  116. })
  117. }
  118. getDtl = (bc) => {
  119. const { fromViews, YH } = this.$router.params
  120. const { curId } = this.state
  121. this.setState({
  122. token: Taro.getStorageSync('APP_token') || ''
  123. })
  124. let params = {
  125. id: curId
  126. }
  127. if (fromViews) params.from = fromViews
  128. // if (YH === 'zzyh' || YH === 'yhjg') {
  129. // Taro.api.house.apiestatelottery2detail(params).then(res => {
  130. // let curObj = res || {}
  131. // curObj.longitude = Number(curObj.longitude)
  132. // curObj.latitude = Number(curObj.latitude)
  133. // this.subComment.getData(curObj || {})
  134. // this.subNews.getData(curObj.information_list || [])
  135. // this.setState({
  136. // curObj
  137. // }, () => {
  138. // if (bc) bc()
  139. // })
  140. // })
  141. // }
  142. Taro.api.house.admestatedetail(params).then(res => {
  143. let curObj = res || {}
  144. curObj.longitude = Number(curObj.longitude)
  145. curObj.latitude = Number(curObj.latitude)
  146. this.setState({
  147. curObj
  148. }, () => {
  149. if (this.subHeader) this.subHeader.getData(curObj || {})
  150. if (this.subComment) this.subComment.getData(curObj || {})
  151. if (this.subNews) this.subNews.getData(curObj.information_list || [])
  152. // if (this.subChat) this.subChat.getData(curObj.estate_sale || [], {name: curObj.estate_name, id: curObj.id})
  153. if (this.subChat) this.subChat.getData({name: curObj.estate_name, id: curObj.id}, 'estateDtl')
  154. if (this.subMoreHouse) this.subMoreHouse.getData(curObj.estate_compete || [])
  155. if (this.subRooms) this.subRooms.getData(curObj.old_house_list || [])
  156. if (this.subChannel) this.subChannel.getData(curObj.estate_channel || [])
  157. if (bc) bc()
  158. })
  159. })
  160. }
  161. componentDidShow () { }
  162. componentDidHide () { }
  163. renderHeader () {
  164. const { curImgIndex, curObj, photoList } = this.state
  165. let morePhoto = []
  166. photoList.forEach(item => {
  167. item.urls.forEach(url => {
  168. morePhoto.push({img_url: `${url}`})
  169. })
  170. })
  171. // if (morePhoto.length > 0) morePhoto.shift()
  172. const imgArr = [{img_url: `${curObj.pri_image}`}, ...morePhoto]
  173. const iconShare = require('@img/images/icon_g_share.png')
  174. return (
  175. <View className="dtl-header">
  176. <Swiper
  177. circular
  178. current={curImgIndex}
  179. onChange={this.headerImgChange.bind(this)}
  180. className='dh-swiper'>
  181. {
  182. imgArr.map((item, index) => {
  183. return (
  184. <SwiperItem key={index}>
  185. <View className='dh-item'>
  186. <Image src={item.img_url ? item.img_url + '_white' : ''} className="img" onClick={this.previewImageHandle.bind(this, item.img_url, imgArr)} />
  187. </View>
  188. </SwiperItem>
  189. )
  190. })
  191. }
  192. </Swiper>
  193. <View className="dh-pk" onClick={this.pkHandle.bind(this)}>
  194. <View className="bg"></View>
  195. <View className="t">PK</View>
  196. </View>
  197. <Button className="dh-icon-share btn-to-div" openType="share">
  198. <Image className="img" src={iconShare} />
  199. </Button>
  200. <View className="dh-count">
  201. <View className="bg"></View>
  202. <View className="num">{curImgIndex + 1}/{imgArr.length}</View>
  203. </View>
  204. </View>
  205. )
  206. }
  207. pkHandle () {
  208. const { curId } = this.state
  209. let oldPkList = Taro.getStorageSync('APP_pkList') || []
  210. let addFalg = true
  211. oldPkList.forEach(item => {
  212. if (String(item.id) === String(curId)) {
  213. addFalg = false
  214. }
  215. })
  216. if (addFalg) {
  217. Taro.api.house.admestatesimple({id: curId}).then(res => {
  218. oldPkList.unshift(res)
  219. if (oldPkList.length > 19) oldPkList.splice(19, 1)
  220. Taro.setStorageSync('APP_pkList', oldPkList)
  221. Taro.navigateTo({
  222. url: '/pagesHouse/pkList'
  223. })
  224. })
  225. } else {
  226. Taro.navigateTo({
  227. url: '/pagesHouse/pkList'
  228. })
  229. }
  230. }
  231. headerImgChange (e) {
  232. this.setState({
  233. curImgIndex: e.detail.current || 0
  234. })
  235. }
  236. previewImageHandle (cur, arr) {
  237. const current = `${cur}_plus`
  238. const urls = arr.map(item => {
  239. return `${item.img_url}_plus`
  240. })
  241. Taro.previewImage({
  242. current,
  243. urls
  244. })
  245. }
  246. renderInfo () {
  247. const { curId, curObj, token } = this.state
  248. const iconPos = require('@img/i_g_pos.png')
  249. const iconHeart = require('@img/i_g_heart.png')
  250. const iconHeartGif = require('@img/i_g_warn.gif')
  251. const iconHeart2 = require('@img/i_g_heart2.png')
  252. const cTagStr = curObj.custom_tag || ''
  253. const tagViews = cTagStr.split(',').map((tag, tagIndex) => {
  254. return (
  255. <View className="s" key={tagIndex}>{tag}</View>
  256. )
  257. })
  258. return (
  259. <View className="dtl-info">
  260. <View className="di-title">{curObj.estate_name}</View>
  261. <View className="di-sign">
  262. <View className="l">¥{curObj.price_range || 'loading'}/㎡</View>
  263. {
  264. curObj.estate_tag === '售罄'
  265. ? <View className="s t4">{curObj.estate_tag}</View>
  266. : curObj.estate_tag === '待售'
  267. ? <View className="s t3">{curObj.estate_tag}</View>
  268. : <View className="s t2">{curObj.estate_tag}</View>
  269. }
  270. {tagViews}
  271. </View>
  272. <Navigator url={'/pagesHouse/indexDtlAround?id=' + curId + '&name=' + curObj.estate_name} className="di-addr">
  273. <Image className="i" src={iconPos} />
  274. {curObj.address}
  275. </Navigator>
  276. {
  277. curObj.is_follow
  278. ?
  279. <View className="di-r cur" onClick={this.followHandle.bind(this, 'apiestateunfollow')}>
  280. <Image className="i" src={iconHeart2} />
  281. <View className="t">已关注</View>
  282. </View>
  283. :
  284. <View className="di-r" onClick={this.followHandle.bind(this, 'apiestatefollow')}>
  285. <Image className="i2" src={iconHeartGif} />
  286. <View className="t">关注楼盘</View>
  287. </View>
  288. }
  289. </View>
  290. )
  291. }
  292. followHandle (apiStr) {
  293. const { curId, curObj } = this.state
  294. Taro.api.house[apiStr]({estate_id: curId}).then(res => {
  295. Taro.$msgConfirm(apiStr === 'apiestatefollow' ? '已关注' + curObj.estate_name : '已取消关注' + curObj.estate_name)
  296. this.getDtl()
  297. })
  298. }
  299. renderEntry () {
  300. const { curId, curObj } = this.state
  301. const icon1 = require('./img/dtl/icon1.png')
  302. const icon2 = require('./img/dtl/icon2.png')
  303. const icon3 = require('./img/dtl/icon3.png')
  304. const icon4 = require('./img/dtl/icon4.png')
  305. const icon5 = require('./img/dtl/icon5.png')
  306. const icon6 = require('./img/dtl/icon6-new.png')
  307. const icon6s = require('./img/dtl/icon6s.png')
  308. const icon7 = require('./img/dtl/icon7.png')
  309. const icon8 = require('./img/dtl/icon8-new.png')
  310. const icon9 = require('./img/dtl/icon9-new.png')
  311. const icon10 = require('./img/dtl/icon10-new.png')
  312. return (
  313. <View className="dtl-entry">
  314. <Navigator url={'/pagesHouse/produceType?id=' + curId + '&name=' + curObj.estate_name} className="de-op">
  315. <Image className="i" src={icon1} />
  316. <View className="t">户型图</View>
  317. </Navigator>
  318. {
  319. curObj.estate_tag === '二手'
  320. ?
  321. <Navigator url={`/pagesRoom/list?estate_id=${curId}&estate_name=${curObj.estate_name}`} className="de-op">
  322. <Image className="i" src={icon2} />
  323. <View className="t">二手房源</View>
  324. </Navigator>
  325. :
  326. <Navigator url={'/pagesHouse/news?id=' + curId + '&name=' + curObj.estate_name} className="de-op">
  327. <Image className="i" src={icon2} />
  328. <View className="t">楼盘动态</View>
  329. </Navigator>
  330. }
  331. <Navigator url={'/pagesHouse/indexDtlMore?id=' + curId + '&name=' + curObj.estate_name} className="de-op">
  332. <Image className="i" src={icon3} />
  333. <View className="t">楼盘详情</View>
  334. </Navigator>
  335. <Navigator url={'/pagesHouse/indexDtlAround?id=' + curId + '&name=' + curObj.estate_name} className="de-op">
  336. <Image className="i" src={icon4} />
  337. <View className="t">周边配套</View>
  338. </Navigator>
  339. <Navigator url={'/pagesHouse/photo?id=' + curId + '&name=' + curObj.estate_name} className="de-op">
  340. <Image className="i" src={icon5} />
  341. <View className="t">楼盘相册</View>
  342. </Navigator>
  343. <Navigator url={`/pagesHouse/price?id=${curId}&name=${curObj.estate_name}`} className="de-op">
  344. <Image className="i" src={icon6} />
  345. <View className="t">历史成交</View>
  346. </Navigator>
  347. {
  348. curObj.estate_tag === '二手'
  349. ?
  350. <Navigator url={'/pagesMore/comment/list?id=' + curId + '&name=' + curObj.estate_name} className="de-op">
  351. <Image className="i" src={icon7} />
  352. <View className="t">楼盘评论</View>
  353. </Navigator>
  354. :
  355. <Navigator url={`/pagesPlan/apply2?eId=${curId}&eName=${curObj.estate_name}`} className="de-op">
  356. <Image className="i" src={icon7} />
  357. <View className="t">团购报名</View>
  358. </Navigator>
  359. }
  360. <Navigator url={`/pagesMore/center/feedback?eId=${curId}&eName=${curObj.estate_name}`} className="de-op">
  361. <Image className="i" src={icon8} />
  362. <View className="t">纠错补图</View>
  363. </Navigator>
  364. <Navigator url="/pagesMore/news/indexDtl?id=2262" className="de-op">
  365. <Image className="i" src={icon9} />
  366. <View className="t">房友群</View>
  367. </Navigator>
  368. <Navigator url={'/pagesMore/center/loanCalc'} className="de-op">
  369. <Image className="i" src={icon10} />
  370. <View className="t">房贷计算</View>
  371. </Navigator>
  372. </View>
  373. )
  374. }
  375. renderOptionsDkSchool () {
  376. const { curObj } = this.state
  377. return (
  378. <View className="dtl-options scoped-school">
  379. <View className="do-title">
  380. <View className="t">对口学校</View>
  381. <View className="r2">注:目前该楼盘在此学区中</View>
  382. </View>
  383. {this.renderDkSchool()}
  384. </View>
  385. )
  386. }
  387. renderDkSchool () {
  388. const { curObj } = this.state
  389. const dictData = Taro.getStorageSync('dictData')
  390. const arr = curObj.school_list.duikou || []
  391. const curItems = arr.map((item, index) => {
  392. return (
  393. <Navigator url={'/pagesSchool/indexDtl?id=' + item.id} className="lb-item" key={index}>
  394. <View className="lb-img">
  395. <Image className="img" src={item.pri_image + '_xs'} />
  396. </View>
  397. <View className="lb-info">
  398. <View className="lb-p1">{item.school_name}</View>
  399. <View className="lb-p2">{item.address}</View>
  400. <View className="lb-tag">
  401. <View className="t t1">{arrToObj(dictData.school_attrib)[item.school_attrib]}</View>
  402. <View className="t t4">{arrToObj(dictData.school_type)[item.school_type]}</View>
  403. </View>
  404. </View>
  405. </Navigator>
  406. )
  407. })
  408. return (
  409. <View className="l-list-box t2">
  410. {curItems}
  411. </View>
  412. )
  413. }
  414. renderOptionsGhSchool () {
  415. const { curObj } = this.state
  416. return (
  417. <View className="dtl-options scoped-school">
  418. <View className="do-title">
  419. <View className="t">可能就读</View>
  420. <View className="r2">注:未来该楼盘有可能划入该学校</View>
  421. </View>
  422. {this.renderGhSchool()}
  423. </View>
  424. )
  425. }
  426. renderGhSchool () {
  427. const { curObj } = this.state
  428. const dictData = Taro.getStorageSync('dictData')
  429. const arr = curObj.school_list.guihua || []
  430. const curItems = arr.map((item, index) => {
  431. return (
  432. <Navigator url={'/pagesSchool/indexDtl?id=' + item.id} className="lb-item" key={index}>
  433. <View className="lb-img">
  434. <Image className="img" src={item.pri_image + '_xs'} />
  435. </View>
  436. <View className="lb-info">
  437. <View className="lb-p1">{item.school_name}</View>
  438. <View className="lb-p2">{item.address}</View>
  439. <View className="lb-tag">
  440. <View className="t t1">{arrToObj(dictData.school_attrib)[item.school_attrib]}</View>
  441. <View className="t t4">{arrToObj(dictData.school_type)[item.school_type]}</View>
  442. </View>
  443. </View>
  444. </Navigator>
  445. )
  446. })
  447. return (
  448. <View className="l-list-box t2">
  449. {curItems}
  450. </View>
  451. )
  452. }
  453. renderQrcode () {
  454. const qrcodeImg = 'http://icon.honglounews.com/miniqrcode.jpg'
  455. return (
  456. <Image src={qrcodeImg} className="g-img-qrcode" onClick={this.previewQrcodeImageHandle.bind(this, qrcodeImg, [qrcodeImg])} />
  457. )
  458. }
  459. previewQrcodeImageHandle (current, urls) {
  460. Taro.previewImage({
  461. current,
  462. urls
  463. })
  464. }
  465. renderOptionsInfo () {
  466. const dictData = Taro.getStorageSync('dictData')
  467. const { curObj, curId } = this.state
  468. const product_type = curObj.product_type || ''
  469. const productTypeArr = product_type.split(',').map(v => {
  470. return arrToObj(dictData.product_type)[v]
  471. })
  472. return (
  473. <View className="dtl-options">
  474. {this.renderQrcode()}
  475. <View className="do-title">
  476. <View className="t">基本信息</View>
  477. <Navigator url={'/pagesHouse/indexDtlMore?id=' + curId + '&name=' + curObj.estate_name} className="r">更多楼盘详细信息{' >'}</Navigator>
  478. </View>
  479. <View className="do-content">
  480. <View className="do-p">
  481. <View className="k">所属区域</View>
  482. <View className="v">{arrToObj(dictData.area_type)[curObj.area_type]}</View>
  483. </View>
  484. <View className="do-p">
  485. <View className="k">产品类型</View>
  486. <View className="v">{productTypeArr.length > 0 ? `${productTypeArr.join('/')}` : ''}</View>
  487. </View>
  488. <View className="do-p">
  489. <View className="k">参考价格</View>
  490. <View className="v">{curObj.price_range}/㎡</View>
  491. </View>
  492. <View className="do-p">
  493. <View className="k">户型面积</View>
  494. <View className="v">{curObj.built_area}㎡</View>
  495. </View>
  496. <View className="do-p">
  497. <View className="k">总户数</View>
  498. <View className="v">{curObj.household || '未知'}</View>
  499. </View>
  500. <View className="do-p">
  501. <View className="k">车位数</View>
  502. <View className="v">{curObj.parking || '未知'}</View>
  503. </View>
  504. <View className="do-p">
  505. <View className="k">绿化率</View>
  506. <View className="v">{curObj.green_rate || '未知'}%</View>
  507. </View>
  508. <View className="do-p">
  509. <View className="k">初次交付</View>
  510. <View className="v">{curObj.deliver_time || '未知'}</View>
  511. </View>
  512. </View>
  513. </View>
  514. )
  515. }
  516. renderDesc () {
  517. const { curObj } = this.state
  518. return (
  519. <View className="dtl-options">
  520. <View className="do-title">
  521. <View className="t">洪楼简评</View>
  522. </View>
  523. <View className="do-content">
  524. <View className="scoped-desc">{curObj.remarked}</View>
  525. </View>
  526. </View>
  527. )
  528. }
  529. renderProductType () {
  530. const { curObj } = this.state
  531. const aData = curObj.area_data || []
  532. const vrIcon = require('@img/icon_vr.png')
  533. const dictData = Taro.getStorageSync('dictData')
  534. const ptObj = arrToObj(dictData.product_type)
  535. const htObj = arrToObj(dictData.house_type)
  536. let ptArr = []
  537. if (aData) {
  538. aData.map(one =>{
  539. one.house_type_list.map(two => {
  540. two.area_list.map(three => {
  541. ptArr.push({
  542. imgUrl: three.img_url + '_xs',
  543. area: three.area + '㎡',
  544. ptName: ptObj[one.product_type_val],
  545. htName: htObj[two.house_type_val],
  546. vr_key: three.vr_key,
  547. })
  548. })
  549. })
  550. })
  551. }
  552. const pt3Arr = ptArr.slice(0, 3)
  553. return (
  554. <View className="dtl-options" onClick={this.morePtLink.bind(this)}>
  555. <View className="do-title">
  556. <View className="t">户型图</View>
  557. <View className="r">全部户型图{'>>'}</View>
  558. </View>
  559. <View className="do-content">
  560. <View className="scoped-pt">
  561. <View className="sp-wrap">
  562. {
  563. pt3Arr.map((item, index) => {
  564. return (
  565. <View className="sp-item" key={index}>
  566. <View className="w">
  567. <Image className="img" src={item.imgUrl} />
  568. <View className="p1">
  569. <View className="bg"></View>
  570. <View className="t">{item.area}({item.ptName})</View>
  571. </View>
  572. {
  573. item.vr_key
  574. ? <Image className="vr-icon" src={vrIcon}/>
  575. : ''
  576. }
  577. </View>
  578. <View className="p2">{item.htName}</View>
  579. </View>
  580. )
  581. })
  582. }
  583. </View>
  584. {
  585. ptArr.length > 2
  586. &&
  587. <View className="sp-more">点击查看更多</View>
  588. }
  589. </View>
  590. {
  591. aData.length === 0
  592. &&
  593. <ListMore isOther={true} text="户型图整理中"/>
  594. }
  595. </View>
  596. </View>
  597. )
  598. }
  599. morePtLink () {
  600. const { curObj } = this.state
  601. Taro.navigateTo({
  602. url: '/pagesHouse/produceType?id=' + curObj.id + '&name=' + curObj.estate_name
  603. })
  604. }
  605. renderPos () {
  606. const { curObj } = this.state
  607. const markers = [{
  608. longitude: curObj.longitude,
  609. latitude: curObj.latitude,
  610. iconPath: 'https://img2.honglounews.com/20220110041411-6675.png',
  611. width: '20',
  612. height: '20',
  613. id: curObj.id,
  614. label: {
  615. content: curObj.estate_name,
  616. color: '#fff',
  617. fontSize: 12,
  618. anchorX: curObj.estate_name ? - curObj.estate_name.length * 6 : 0,
  619. anchorY: -50,
  620. textAlign: 'center',
  621. bgColor: '#369af7',
  622. padding: 5,
  623. borderRadius: 5,
  624. borderColor: '#f2f2f2',
  625. borderWidth: 1,
  626. }
  627. }]
  628. return (
  629. <View className="dtl-options last">
  630. <View className="do-title" onClick={this.mapHandle.bind(this)}>
  631. <View className="t">楼盘位置</View>
  632. </View>
  633. <View className="l-list-box scoped-list-map">
  634. <View className="bg" onClick={this.mapHandle.bind(this)}></View>
  635. <Map
  636. className="m"
  637. longitude={curObj.longitude}
  638. latitude={curObj.latitude}
  639. scale="12"
  640. onTap={this.mapHandle.bind(this)}
  641. markers={markers}
  642. />
  643. </View>
  644. </View>
  645. )
  646. }
  647. mapHandle () {
  648. const { curId, curObj } = this.state
  649. Taro.navigateTo({
  650. // url: `/pagesOther/map/dtl2?longitude=${curObj.longitude}&latitude=${curObj.latitude}&more=es`
  651. // url: '/pagesHouse/indexDtlAround?id=' + curId + '&name=' + curObj.estate_name
  652. url: '/pagesHouse/indexDtlAround?id=' + curId + '&name=' + curObj.estate_name
  653. })
  654. }
  655. posHandle () {
  656. const { curObj } = this.state
  657. const key = '5WFBZ-LCZ3J-D5AFM-KNUUL-BTT46-45BWB'
  658. const referer = '洪楼Plus'
  659. const location = JSON.stringify({
  660. latitude: curObj.latitude,
  661. longitude: curObj.longitude
  662. })
  663. const category = '地铁公交,医院,购物美食'
  664. Taro.navigateTo({
  665. url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer + '&location=' + location + '&category=' + category
  666. })
  667. }
  668. refHeader = (ref) => {
  669. this.subHeader = ref
  670. }
  671. renderOptionsNews () {
  672. return (
  673. <View className="dtl-options">
  674. <View className="do-title">
  675. <View className="t">洪楼观点</View>
  676. </View>
  677. <News onRef={this.refNews} />
  678. </View>
  679. )
  680. }
  681. refNews = (ref) => {
  682. this.subNews = ref
  683. }
  684. refChat = (ref) => {
  685. this.subChat = ref
  686. }
  687. renderRooms () {
  688. const { curObj } = this.state
  689. return (
  690. <View className="dtl-options">
  691. <View className="do-title">
  692. <View className="t">洪楼房源</View>
  693. <Navigator url={'/pagesRoom/list?estate_id=' + curObj.id + '&estate_name=' + curObj.estate_name} className="r">查看更多{' >'}</Navigator>
  694. </View>
  695. <Rooms onRef={this.refRooms} />
  696. </View>
  697. )
  698. }
  699. refRooms = (ref) => {
  700. this.subRooms = ref
  701. }
  702. renderComment () {
  703. const { curObj } = this.state
  704. return (
  705. <View className="dtl-options" id="stComment">
  706. <View className="do-title">
  707. <View className="t">大家怎么看</View>
  708. <Navigator url={'/pagesMore/comment/list?id=' + curObj.id + '&name=' + curObj.estate_name} className="r">查看更多{' >'}</Navigator>
  709. </View>
  710. <Comment onRef={this.refComment} getDtl={this.getDtl.bind(this)} />
  711. </View>
  712. )
  713. }
  714. refComment = (ref) => {
  715. this.subComment = ref
  716. }
  717. openLoginPopup (obj) {
  718. this.setState({
  719. isLoginPopupShow: true
  720. })
  721. }
  722. closeLoginPopup (str) {
  723. this.setState({
  724. isLoginPopupShow: false
  725. })
  726. if (str && str === 'success') {
  727. this.getDtl()
  728. }
  729. }
  730. getUserProfile (e) {
  731. wx.getUserProfile({
  732. desc: '用于完善头像和昵称资料',
  733. success: (res) => {
  734. const dtlObj = res || {}
  735. this.setState({
  736. userInfo: dtlObj.userInfo
  737. })
  738. Taro.setStorageSync('APP_userInfo', dtlObj.userInfo)
  739. Taro.$msgConfirm(`登录成功~有任何建议或者反馈,可以进个人中心给我们反馈哦`, () => {}, () => {})
  740. }
  741. })
  742. }
  743. linkHome () {
  744. Taro.reLaunch({
  745. url: '/pages/index/index'
  746. })
  747. }
  748. renderGoHome () {
  749. const icon = require('@img/images/icon_go_home.png')
  750. return (
  751. <Image className="g-go-home" src={icon} onClick={this.linkHome.bind(this)}/>
  752. )
  753. }
  754. linkPlan () {
  755. const {id} = this.$router.params
  756. const { curObj } = this.state
  757. Taro.navigateTo({
  758. url: `/pagesPlan/apply2?eId=${id}&eName=${curObj.estate_name}`
  759. })
  760. }
  761. renderPlan () {
  762. const footerBanner = require('./img/dtl/footer_banner.png')
  763. return (
  764. <View className="scoped-footer">
  765. <Image src={footerBanner} className="img" onClick={this.linkPlan.bind(this)}></Image>
  766. </View>
  767. )
  768. }
  769. renderEntryYH () {
  770. const i1 = require('./img/yfyj/yfyj01.png')
  771. const i2 = require('./img/yfyj/yfyj02.png')
  772. const bg = require('./img/yfyj/yfyj03s.jpg')
  773. const { curObj } = this.state
  774. const lotteryObj = curObj.estate_lottery || {}
  775. return (
  776. <View className="scoped-entry-yh">
  777. <Navigator url={`/pagesRoom/roomPrice?eId=${curObj.id}&name=${curObj.estate_name}&id=${lotteryObj.id}`} className="sey-wrap">
  778. <View className="sey-p1">
  779. <Image className="i" src={i1}></Image>
  780. <View className="t">{lotteryObj.under_way}</View>
  781. </View>
  782. <View className="sey-p1">
  783. <Image className="i" src={i2}></Image>
  784. <View className="t2">{lotteryObj.lottery_time}</View>
  785. </View>
  786. <View className="sey-img">
  787. <Image className="img" src={bg}></Image>
  788. </View>
  789. </Navigator>
  790. </View>
  791. )
  792. }
  793. renderYH () {
  794. const { curObj } = this.state
  795. const lotteryObj = curObj.estate_lottery || {}
  796. const bg = require('./img/yfyj/yfyj03s.jpg')
  797. let lotteryImg = []
  798. if (lotteryObj.lottery_img) lotteryImg = lotteryObj.lottery_img.split(',')
  799. return (
  800. <View className="scoped-yh">
  801. <View className="sy-wrap">
  802. {
  803. lotteryObj.lottery_res && lotteryImg.length > 0
  804. &&
  805. <View>
  806. <Navigator url={`/pagesRoom/roomPriceImg?eId=${lotteryObj.estate_id}&id=${lotteryObj.id}&name=${curObj.estate_name}`} className="sy-p">{lotteryObj.lottery_res}{'-查看结果>>'}</Navigator>
  807. {/* <View className="sy-op">
  808. <View className="l">摇号结果图</View>
  809. <View className="r">
  810. {
  811. lotteryImg.map((hImg, hi) => {
  812. return (
  813. <View className="o" key={hi} onClick={this.YHImageHandle.bind(this, hImg, lotteryImg)}>
  814. <Image src={hImg + '_xs'} className="img" />
  815. <View className="tips">
  816. <View className="bg"></View>
  817. <View className="t">查看大图</View>
  818. </View>
  819. </View>
  820. )
  821. })
  822. }
  823. </View>
  824. </View> */}
  825. </View>
  826. }
  827. <Navigator url={`/pagesRoom/roomPrice?eId=${curObj.id}&name=${curObj.estate_name}&id=${lotteryObj.id}`} className="sy-img">
  828. <Image className="img" src={bg}></Image>
  829. </Navigator>
  830. </View>
  831. </View>
  832. )
  833. }
  834. YHImageHandle (current, urls) {
  835. Taro.previewImage({
  836. current,
  837. urls
  838. })
  839. }
  840. linkBuyTg () {
  841. const { curId, curObj } = this.state
  842. Taro.navigateTo({
  843. url: `/pagesPlan/discountGroup?eId=${curId}&eName=${curObj.estate_name}`
  844. })
  845. }
  846. renderBuyTg () {
  847. const iconTg = require('./img/dtl/icon_tg.png')
  848. return (
  849. <View className="scoped-bug-tg">
  850. <Image src={iconTg} className="img" onClick={this.linkBuyTg.bind(this)}></Image>
  851. </View>
  852. )
  853. }
  854. renderMoreHouse () {
  855. const { curObj } = this.state
  856. return (
  857. <View className="dtl-options scoped-school">
  858. <View className="do-title">
  859. <View className="t">看了这个楼盘还看了</View>
  860. </View>
  861. <MoreHouse onRef={this.refMoreHouse} />
  862. </View>
  863. )
  864. }
  865. refMoreHouse = (ref) => {
  866. this.subMoreHouse = ref
  867. }
  868. renderOptionsChannel () {
  869. return (
  870. <View className="dtl-options scoped-school">
  871. <View className="do-title">
  872. <View className="t">相关视频</View>
  873. </View>
  874. <HouseChannel onRef={this.refChannel} />
  875. </View>
  876. )
  877. }
  878. refChannel = (ref) => {
  879. this.subChannel = ref
  880. }
  881. loginJudge () {
  882. const { userInfo, token } = this.state
  883. const uInfo = userInfo || Taro.getStorageSync('APP_userInfo')
  884. const { isLoginPopupShow } = this.state
  885. return (
  886. <View style={uInfo && uInfo.avatarUrl && token ? '' : 'position: absolute;height: 100%;width: 100%;'}>
  887. <LoginPopup show={isLoginPopupShow} close={this.closeLoginPopup.bind(this)} />
  888. {
  889. uInfo && uInfo.avatarUrl
  890. ? token || isLoginPopupShow
  891. ? ''
  892. : <Button className="g-u-btn t2" onClick={this.openLoginPopup.bind(this)}></Button>
  893. : <Button className="g-u-btn t2" onClick={this.getUserProfile.bind(this)}></Button>
  894. }
  895. </View>
  896. )
  897. }
  898. renderAdBanner () {
  899. const { curObj, curId } = this.state
  900. const adBanner = require('./img/dtl/ad_banner3.jpg')
  901. return (
  902. <Navigator url={`/pagesPlan/apply2?eId=${curId}&eName=${curObj.estate_name}`} className='scoped-ad-banner t2'>
  903. <Image className="img" src={adBanner} />
  904. </Navigator>
  905. )
  906. }
  907. renderAdBanner2 () {
  908. const adBanner = require('./img/dtl/ad_banner4.jpg')
  909. return (
  910. <View className='scoped-ad-banner' onClick={this.callHandle.bind(this)}>
  911. <Image className="img" src={adBanner} />
  912. </View>
  913. )
  914. }
  915. callHandle () {
  916. Taro.makePhoneCall({
  917. phoneNumber: '18100792072'
  918. })
  919. }
  920. render () {
  921. const { curObj, buyRuleObj } = this.state
  922. const pages = getCurrentPages()
  923. const pagesLength = pages.length
  924. const schoolList = curObj.school_list || {}
  925. const { YH } = this.$router.params
  926. const lotteryObj = curObj.estate_lottery || {}
  927. const channelList = curObj.estate_channel || []
  928. const { viewId } = this.state
  929. return (
  930. <View className='l-box'>
  931. <ScrollView
  932. className='l-scroll-view'
  933. scrollY
  934. scrollWithAnimation
  935. scrollIntoView={viewId}
  936. >
  937. <View style="position:relative;">
  938. {this.loginJudge()}
  939. {
  940. buyRuleObj.id
  941. &&
  942. this.renderBuyTg()
  943. }
  944. <Header onRef={this.refHeader} />
  945. {/* {this.renderHeader()} */}
  946. {this.renderInfo()}
  947. {
  948. curObj.estate_tag === '待售' || curObj.estate_tag === '在售' || curObj.estate_tag === '尾盘'
  949. ? this.renderAdBanner()
  950. : this.renderAdBanner2()
  951. }
  952. {/* {
  953. YH === 'yhjg'
  954. &&
  955. this.renderYH()
  956. } */}
  957. {
  958. lotteryObj.lottery_res
  959. ? this.renderYH()
  960. :
  961. lotteryObj.under_way
  962. ?
  963. this.renderEntryYH()
  964. : ''
  965. }
  966. {this.renderEntry()}
  967. {this.renderOptionsInfo()}
  968. {
  969. curObj.remarked
  970. &&
  971. this.renderDesc()
  972. }
  973. {this.renderProductType()}
  974. {
  975. (curObj.old_house_list && curObj.old_house_list.length > 0)
  976. && this.renderRooms()
  977. }
  978. {
  979. (curObj.estate_compete && curObj.estate_compete.length > 0)
  980. && this.renderMoreHouse()
  981. }
  982. {
  983. channelList && channelList.length > 0
  984. &&
  985. this.renderOptionsChannel()
  986. }
  987. {this.renderOptionsNews()}
  988. {
  989. schoolList.duikou && schoolList.duikou.length > 0
  990. &&
  991. this.renderOptionsDkSchool()
  992. }
  993. {
  994. schoolList.guihua && schoolList.guihua.length > 0
  995. &&
  996. this.renderOptionsGhSchool()
  997. }
  998. {this.renderComment()}
  999. {this.renderPos()}
  1000. {pagesLength < 3 && this.renderGoHome()}
  1001. {/* {this.renderPlan()} */}
  1002. </View>
  1003. </ScrollView>
  1004. <Chat onRef={this.refChat} />
  1005. </View>
  1006. )
  1007. }
  1008. }
  1009. export default Index