提交
This commit is contained in:
@@ -1,13 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="returnTop flexcenter" @click="screenroll()">
|
<div class="returnTop flexcenter" @click="screenroll()" v-if="show">
|
||||||
<img class="icon" src="@/assets/img/publicImage/back-icon.png">
|
<img class="icon" src="@/assets/img/publicImage/back-icon.png">
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
// onMounted(() => {
|
import { onMounted, onUnmounted, ref } from 'vue'
|
||||||
// window.addEventListener('scroll', handleScroll);
|
let show = ref(false)
|
||||||
// });
|
onMounted(() => {
|
||||||
|
window.addEventListener('scroll', handleScroll);
|
||||||
|
});
|
||||||
|
|
||||||
// onUnmounted(() => {
|
// onUnmounted(() => {
|
||||||
// window.removeEventListener('scroll', handleScroll);
|
// window.removeEventListener('scroll', handleScroll);
|
||||||
@@ -15,17 +17,9 @@
|
|||||||
|
|
||||||
const handleScroll = () => {
|
const handleScroll = () => {
|
||||||
if (Math.random() > 0.3) return
|
if (Math.random() > 0.3) return
|
||||||
// for (let i = 0; i < navList.value.length; i++) {
|
const scrolledDistance = window.scrollY || window.pageYOffset;
|
||||||
// let element = navList.value[i]
|
if (scrolledDistance >= 500 && !show.value) show.value = true
|
||||||
|
if (scrolledDistance < 500 && show.value) show.value = false
|
||||||
// const rect = eval(element.value).value.getBoundingClientRect();
|
|
||||||
// const distanceToTop = rect.top;
|
|
||||||
// if (distanceToTop >= 0) {
|
|
||||||
// navTab.value = element.value
|
|
||||||
// break;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const screenroll = () => {
|
const screenroll = () => {
|
||||||
@@ -39,7 +33,7 @@ const screenroll = () => {
|
|||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
@media screen and (max-width: 1360px) {
|
@media screen and (max-width: 1360px) {
|
||||||
.returnTop {
|
.returnTop {
|
||||||
right: 0 !important;
|
right: 20px !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -47,8 +41,8 @@ const screenroll = () => {
|
|||||||
position: fixed;
|
position: fixed;
|
||||||
right: calc((100vw - 1200px) / 2 - 75px);
|
right: calc((100vw - 1200px) / 2 - 75px);
|
||||||
bottom: 18px;
|
bottom: 18px;
|
||||||
width: 50px;
|
width: 60px;
|
||||||
height: 50px;
|
height: 60px;
|
||||||
background-color: #323232;
|
background-color: #323232;
|
||||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.11764706);
|
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.11764706);
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
@@ -56,8 +50,8 @@ const screenroll = () => {
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
width: 24px;
|
width: 28px;
|
||||||
height: 24px;
|
height: 28px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -30,10 +30,19 @@ let circleState = ref(false)
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
||||||
|
@media screen and (max-width: 1360px) {
|
||||||
|
.circle-btn {
|
||||||
|
right: 20px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.circle-btn {
|
.circle-btn {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 58px;
|
bottom: 98px;
|
||||||
right: 58px;
|
// right: 58px;
|
||||||
|
right: calc((100vw - 1200px) / 2 - 75px);
|
||||||
|
|
||||||
width: 60px;
|
width: 60px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
background-color: #50e3c2;
|
background-color: #50e3c2;
|
||||||
|
|||||||
@@ -27,6 +27,7 @@ const { wechat } = toRefs(store.state);
|
|||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.QRcode-box {
|
.QRcode-box {
|
||||||
width: 304px;
|
width: 304px;
|
||||||
|
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||||
// height: 304px;
|
// height: 304px;
|
||||||
background-color: rgba(255, 255, 255, 1);
|
background-color: rgba(255, 255, 255, 1);
|
||||||
border: 1px solid rgba(235, 235, 235, 1);
|
border: 1px solid rgba(235, 235, 235, 1);
|
||||||
|
|||||||
@@ -29,6 +29,7 @@ const props = defineProps({
|
|||||||
let key = ref("MVNBZ-PEFWI-O4OGT-5ADVJ-7QAYJ-NBFY4")
|
let key = ref("MVNBZ-PEFWI-O4OGT-5ADVJ-7QAYJ-NBFY4")
|
||||||
|
|
||||||
const initMap = () => {
|
const initMap = () => {
|
||||||
|
console.log("props.latlng",props.latlng);
|
||||||
let center = new TMap.LatLng(props.latlng['latitude'], props.latlng['longitude']);
|
let center = new TMap.LatLng(props.latlng['latitude'], props.latlng['longitude']);
|
||||||
let map = new TMap.Map("container", {
|
let map = new TMap.Map("container", {
|
||||||
zoom: 15,
|
zoom: 15,
|
||||||
|
|||||||
@@ -163,7 +163,7 @@
|
|||||||
|| 0 }}
|
|| 0 }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="img-list-box dis-f jus-x al-item" v-show="imgList.length > 0"> plm{{ imageIndex }}plm
|
<div class="img-list-box dis-f jus-x al-item" v-show="imgList.length > 0">
|
||||||
<img src="../assets/img/detail/moreNot.svg" class="icon left-icon" alt=""
|
<img src="../assets/img/detail/moreNot.svg" class="icon left-icon" alt=""
|
||||||
@click.stop="moveImageList('left')"
|
@click.stop="moveImageList('left')"
|
||||||
v-show="imgListTab === 0 && imageLIst[imageLIst.length - 1] > 800">
|
v-show="imgListTab === 0 && imageLIst[imageLIst.length - 1] > 800">
|
||||||
@@ -177,7 +177,8 @@
|
|||||||
style="transform: rotate(180deg);" @click.stop="moveImageList('right')"
|
style="transform: rotate(180deg);" @click.stop="moveImageList('right')"
|
||||||
v-show="imgList.length - 1 === imgListTab && imageLIst[imageLIst.length - 1] > 800">
|
v-show="imgList.length - 1 === imgListTab && imageLIst[imageLIst.length - 1] > 800">
|
||||||
<div class="dis-f al-item list-box s-w-100" ref="imageList" v-if="imgList.length > 0">
|
<div class="dis-f al-item list-box s-w-100" ref="imageList" v-if="imgList.length > 0">
|
||||||
<div v-for="(item, i) in imgList" :key="i" @click.stop="imageIndex = i, imageShow = true">
|
<div v-for="(item, i) in imgList" :key="i"
|
||||||
|
@click.stop="imageIndex = i, imageShow = true">
|
||||||
<div class="video" v-if="item && !item.thumbnail">
|
<div class="video" v-if="item && !item.thumbnail">
|
||||||
<div class="icon-box dis-f jus-x al-item">
|
<div class="icon-box dis-f jus-x al-item">
|
||||||
<img src="../assets/img/detail/videoStop.svg" class="icon" alt="">
|
<img src="../assets/img/detail/videoStop.svg" class="icon" alt="">
|
||||||
@@ -445,7 +446,7 @@
|
|||||||
}}</span>
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="dis-f jus-x" style="margin-top:15px;">
|
<div class="dis-f jus-x" style="margin-top:15px;">
|
||||||
<div v-if="housingInfo['data']">
|
<div v-if="housingInfo['data'] && housingInfo['data'].info.latitude">
|
||||||
<mapInfo :latlng="{
|
<mapInfo :latlng="{
|
||||||
longitude: housingInfo['data'].info.longitude * 1,
|
longitude: housingInfo['data'].info.longitude * 1,
|
||||||
latitude: housingInfo['data'].info.latitude * 1
|
latitude: housingInfo['data'].info.latitude * 1
|
||||||
@@ -738,7 +739,7 @@
|
|||||||
<!-- 推荐 -->
|
<!-- 推荐 -->
|
||||||
<div class="dis-f jus-x" v-if="pageType != 3 && (recommendListData.length > 0 || publisherList.length > 0)">
|
<div class="dis-f jus-x" v-if="pageType != 3 && (recommendListData.length > 0 || publisherList.length > 0)">
|
||||||
<div class="body-maxWidth housing-title" style="margin-top:50px;">
|
<div class="body-maxWidth housing-title" style="margin-top:50px;">
|
||||||
{{ pageType==2&&housingInfo['data'].isintermediary?`发布者的其他房源(${publisherList.length})`:'附近房源' }}
|
{{ pageType == 2 && housingInfo['data'].isintermediary ? `发布者的其他房源(${publisherList.length})` : '附近房源' }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="dis-f jus-x al-item" style="position: relative;" v-if="pageType != 3">
|
<div class="dis-f jus-x al-item" style="position: relative;" v-if="pageType != 3">
|
||||||
@@ -758,241 +759,244 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="dis-f jus-x bottom-tps"
|
<div class="dis-f jus-x bottom-tps"
|
||||||
v-if="pageType ===1 || (pageType===2&&recommendListData.length>0&&housingInfo['data']&&housingInfo['data'].isintermediary)">
|
v-if="pageType === 1 || (pageType === 2 && recommendListData.length > 0 && housingInfo['data'] && housingInfo['data'].isintermediary)">
|
||||||
- {{ loadText }} -
|
- {{ loadText }} -
|
||||||
</div>
|
</div>
|
||||||
<footerTool class="mg-t-60"></footerTool>
|
<footerTool class="mg-t-60"></footerTool>
|
||||||
<div class="pop-box" v-show="showConcat">
|
<div class="pop-mask" v-show="showConcat">
|
||||||
<!-- 两种信息 -->
|
<div class="pop-box">
|
||||||
<!-- third-concat -->
|
<!-- 两种信息 -->
|
||||||
<div class="pop-big-box" v-show="concatData.data && concatData.data.count > 1"
|
<!-- third-concat -->
|
||||||
:class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
|
<div class="pop-big-box" v-show="concatData.data && concatData.data.count > 1"
|
||||||
<div class="pop-info-box dis-f jus-x al-item"
|
|
||||||
:class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
|
:class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
|
||||||
<div class="pop-big-bg dis-f jus-x al-item"
|
<div class="pop-info-box dis-f jus-x al-item"
|
||||||
:class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
|
:class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
|
||||||
<div class="user-liner-box dis-f al-item"
|
<div class="pop-big-bg dis-f jus-x al-item"
|
||||||
:class="{ 'jus-bet': concatData.data && concatData.data.count > 2 }">
|
:class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
|
||||||
<!-- class='s-w-100' -->
|
<div class="user-liner-box dis-f al-item"
|
||||||
<div style="padding:0 0 30px 0;"
|
:class="{ 'jus-bet': concatData.data && concatData.data.count > 2 }">
|
||||||
:class="[{ 's-w-100': concatData.data && concatData.data.count === 2 }]">
|
<!-- class='s-w-100' -->
|
||||||
<div class="liner-title">
|
<div style="padding:0 0 30px 0;"
|
||||||
联系方式
|
:class="[{ 's-w-100': concatData.data && concatData.data.count === 2 }]">
|
||||||
</div>
|
<div class="liner-title">
|
||||||
<div class="whatsapp-box"
|
联系方式
|
||||||
v-if="concatData.data && concatData.data.wechat && concatData.data.count > 2">
|
|
||||||
<div class="dis-f al-item">
|
|
||||||
<img src="../assets/img/detail/wxIcon.png" class="whatsapp-icon" alt="">
|
|
||||||
微信
|
|
||||||
</div>
|
</div>
|
||||||
<div class="dis-f al-item box-text mg-l-35">
|
<div class="whatsapp-box"
|
||||||
<div style="width:120px;">
|
v-if="concatData.data && concatData.data.wechat && concatData.data.count > 2">
|
||||||
{{ concatData.data && concatData.data.wechat }}
|
<div class="dis-f al-item">
|
||||||
|
<img src="../assets/img/detail/wxIcon.png" class="whatsapp-icon" alt="">
|
||||||
|
微信
|
||||||
</div>
|
</div>
|
||||||
<div class="clone-btn dis-f al-item jus-x mg-l-50"
|
<div class="dis-f al-item box-text mg-l-35">
|
||||||
@click.stop="clone(concatData.data.wechat)">
|
<div style="width:120px;">
|
||||||
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
{{ concatData.data && concatData.data.wechat }}
|
||||||
复制
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="whatsapp-box"
|
|
||||||
v-if="concatData.data && concatData.data.whatsapp && concatData.data.count > 2">
|
|
||||||
<div class="dis-f al-item">
|
|
||||||
<img src="../assets/img/detail/WhatsAppIcon.png" class="whatsapp-icon" alt="">
|
|
||||||
WhatsApp
|
|
||||||
</div>
|
|
||||||
<div class="dis-f al-item box-text mg-l-35">
|
|
||||||
<div style="width:120px;">
|
|
||||||
{{ concatData.data && concatData.data.whatsapp }}
|
|
||||||
</div>
|
|
||||||
<div class="clone-btn dis-f al-item jus-x mg-l-50"
|
|
||||||
@click.stop="clone(concatData.data.whatsapp)">
|
|
||||||
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
|
||||||
复制
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="whatsapp-box"
|
|
||||||
v-if="concatData.data && concatData.data.tel && concatData.data.count > 2">
|
|
||||||
<div class="dis-f al-item">
|
|
||||||
<img src="../assets/img/detail/phoneIcon.png" class="whatsapp-icon" alt="">
|
|
||||||
电话号码
|
|
||||||
</div>
|
|
||||||
<div class="dis-f al-item box-text mg-l-35">
|
|
||||||
<div style="width:120px;">
|
|
||||||
{{ concatData.data && concatData.data.tel }}
|
|
||||||
</div>
|
|
||||||
<div class="clone-btn dis-f al-item jus-x mg-l-50"
|
|
||||||
@click.stop="clone(concatData.data.tel)">
|
|
||||||
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
|
||||||
复制
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="dis-f jus-x al-item whatsapp-wx-box s-w-100"
|
|
||||||
v-if="concatData.data && concatData.data.count === 2 && concatData.data.wechatdata.aid !== 0">
|
|
||||||
<div>
|
|
||||||
<div>
|
|
||||||
<div v-if="concatData.data.whatsapp">
|
|
||||||
WhatsApp
|
|
||||||
</div>
|
</div>
|
||||||
<div v-if="concatData.data.tel">
|
<div class="clone-btn dis-f al-item jus-x mg-l-50"
|
||||||
电话
|
@click.stop="clone(concatData.data.wechat)">
|
||||||
</div>
|
|
||||||
<div v-if="concatData.data.wechat">
|
|
||||||
微信
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="text-s">
|
|
||||||
{{ concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat ||
|
|
||||||
'' }}
|
|
||||||
</div>
|
|
||||||
<div class="dis-f jus-x al-item mg-t-60">
|
|
||||||
<div class="clone-btn dis-f al-item jus-x"
|
|
||||||
@click.stop="clone(concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat || '')">
|
|
||||||
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
||||||
复制
|
复制
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="liner"></div>
|
<div class="whatsapp-box"
|
||||||
<div>
|
v-if="concatData.data && concatData.data.whatsapp && concatData.data.count > 2">
|
||||||
<div class="wx-qrcode-s dis-f jus-x al-item">
|
<div class="dis-f al-item">
|
||||||
<img :src="concatData.data && concatData.data.wechatdata.url" class="user-img"
|
<img src="../assets/img/detail/WhatsAppIcon.png" class="whatsapp-icon" alt="">
|
||||||
alt="">
|
WhatsApp
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:15px;font-size:14px;text-align: center;">
|
<div class="dis-f al-item box-text mg-l-35">
|
||||||
|
<div style="width:120px;">
|
||||||
|
{{ concatData.data && concatData.data.whatsapp }}
|
||||||
|
</div>
|
||||||
|
<div class="clone-btn dis-f al-item jus-x mg-l-50"
|
||||||
|
@click.stop="clone(concatData.data.whatsapp)">
|
||||||
|
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
||||||
|
复制
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="whatsapp-box"
|
||||||
|
v-if="concatData.data && concatData.data.tel && concatData.data.count > 2">
|
||||||
|
<div class="dis-f al-item">
|
||||||
|
<img src="../assets/img/detail/phoneIcon.png" class="whatsapp-icon" alt="">
|
||||||
|
电话号码
|
||||||
|
</div>
|
||||||
|
<div class="dis-f al-item box-text mg-l-35">
|
||||||
|
<div style="width:120px;">
|
||||||
|
{{ concatData.data && concatData.data.tel }}
|
||||||
|
</div>
|
||||||
|
<div class="clone-btn dis-f al-item jus-x mg-l-50"
|
||||||
|
@click.stop="clone(concatData.data.tel)">
|
||||||
|
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
||||||
|
复制
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="dis-f jus-x al-item whatsapp-wx-box s-w-100"
|
||||||
|
v-if="concatData.data && concatData.data.count === 2 && concatData.data.wechatdata.aid !== 0">
|
||||||
|
<div>
|
||||||
<div>
|
<div>
|
||||||
微信扫码添加好友
|
<div v-if="concatData.data.whatsapp">
|
||||||
|
WhatsApp
|
||||||
|
</div>
|
||||||
|
<div v-if="concatData.data.tel">
|
||||||
|
电话
|
||||||
|
</div>
|
||||||
|
<div v-if="concatData.data.wechat">
|
||||||
|
微信
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:5px;font-size:14px;">
|
<div class="text-s">
|
||||||
备注:寄托租房
|
{{ concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat
|
||||||
|
||
|
||||||
|
'' }}
|
||||||
|
</div>
|
||||||
|
<div class="dis-f jus-x al-item mg-t-60">
|
||||||
|
<div class="clone-btn dis-f al-item jus-x"
|
||||||
|
@click.stop="clone(concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat || '')">
|
||||||
|
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
||||||
|
复制
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="liner"></div>
|
||||||
|
<div>
|
||||||
|
<div class="wx-qrcode-s dis-f jus-x al-item">
|
||||||
|
<img :src="concatData.data && concatData.data.wechatdata.url"
|
||||||
|
class="user-img" alt="">
|
||||||
|
</div>
|
||||||
|
<div style="margin-top:15px;font-size:14px;text-align: center;">
|
||||||
|
<div>
|
||||||
|
微信扫码添加好友
|
||||||
|
</div>
|
||||||
|
<div style="margin-top:5px;font-size:14px;">
|
||||||
|
备注:寄托租房
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div v-if="concatData.data && concatData.data.count > 2 && concatData.data.wechatdata.url">
|
||||||
<div v-if="concatData.data && concatData.data.count > 2 && concatData.data.wechatdata.url">
|
<div class="wx-qrcode-s dis-f jus-x al-item">
|
||||||
<div class="wx-qrcode-s dis-f jus-x al-item">
|
<img :src="concatData.data && concatData.data.wechatdata.url" class="user-img"
|
||||||
<img :src="concatData.data && concatData.data.wechatdata.url" class="user-img" alt="">
|
alt="">
|
||||||
</div>
|
|
||||||
<div style="margin-top:15px;font-size:14px;text-align: center;">
|
|
||||||
<div>
|
|
||||||
微信扫码添加好友
|
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:5px;font-size:14px;">
|
<div style="margin-top:15px;font-size:14px;text-align: center;">
|
||||||
备注:寄托租房
|
<div>
|
||||||
|
微信扫码添加好友
|
||||||
|
</div>
|
||||||
|
<div style="margin-top:5px;font-size:14px;">
|
||||||
|
备注:寄托租房
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="round dis-f jus-x al-item"
|
||||||
<div class="round dis-f jus-x al-item"
|
v-if="concatData.data && !concatData.data.wechatdata.url">
|
||||||
v-if="concatData.data && !concatData.data.wechatdata.url">
|
<div class="deepen dis-f jus-x al-item">
|
||||||
<div class="deepen dis-f jus-x al-item">
|
<div class="center-box dis-f jus-x al-item">
|
||||||
<div class="center-box dis-f jus-x al-item">
|
<div class="center-s dis-f jus-x al-item">
|
||||||
<div class="center-s dis-f jus-x al-item">
|
<div class="drop">
|
||||||
<div class="drop">
|
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<img src="../assets/img/detail/threePopBigBg.svg" class="pop-bg third-bg" style="width:700px;"
|
||||||
|
alt=""
|
||||||
|
v-if="concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3">
|
||||||
|
<img src="../assets/img/detail/threePopbigMap.svg" style="width:700px;"
|
||||||
|
v-if="concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3"
|
||||||
|
class="map third-bg" alt="">
|
||||||
|
<img src="../assets/img/detail/popBigBg.svg"
|
||||||
|
v-if="concatData.data && concatData.data.count === 3 ? concatData.data.wechatdata.url : concatData.data && concatData.data.count < 3"
|
||||||
|
class="pop-bg third-bg" alt="">
|
||||||
|
<img src="../assets/img/detail/popBigBgMap.svg"
|
||||||
|
v-if="concatData.data && concatData.data.count === 3 ? concatData.data.wechatdata.url : concatData.data && concatData.data.count < 3"
|
||||||
|
class="map third-bg" alt="">
|
||||||
</div>
|
</div>
|
||||||
<img src="../assets/img/detail/threePopBigBg.svg" class="pop-bg third-bg" style="width:700px;"
|
|
||||||
alt=""
|
|
||||||
v-if="concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3">
|
|
||||||
<img src="../assets/img/detail/threePopbigMap.svg" style="width:700px;"
|
|
||||||
v-if="concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3"
|
|
||||||
class="map third-bg" alt="">
|
|
||||||
<img src="../assets/img/detail/popBigBg.svg"
|
|
||||||
v-if="concatData.data && concatData.data.count === 3 ? concatData.data.wechatdata.url : concatData.data && concatData.data.count < 3"
|
|
||||||
class="pop-bg third-bg" alt="">
|
|
||||||
<img src="../assets/img/detail/popBigBgMap.svg"
|
|
||||||
v-if="concatData.data && concatData.data.count === 3 ? concatData.data.wechatdata.url : concatData.data && concatData.data.count < 3"
|
|
||||||
class="map third-bg" alt="">
|
|
||||||
</div>
|
</div>
|
||||||
|
<img src="../assets/img/detail/bigPopBg.svg"
|
||||||
|
v-if="concatData.data && concatData.data.count === 3 ? concatData.data.wechatdata.url : concatData.data && concatData.data.count < 3"
|
||||||
|
class="pop-big-bg" alt="">
|
||||||
|
<img src="../assets/img/detail/threeConcatbgImg.svg"
|
||||||
|
v-if="concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3"
|
||||||
|
class="third-concat" alt="">
|
||||||
|
<img src="../assets/img/detail/close.png" class="close-img" @click="showConcat = false" alt="">
|
||||||
</div>
|
</div>
|
||||||
<img src="../assets/img/detail/bigPopBg.svg"
|
<!-- 一种信息 -->
|
||||||
v-if="concatData.data && concatData.data.count === 3 ? concatData.data.wechatdata.url : concatData.data && concatData.data.count < 3"
|
<div class="pop" v-show="concatData.data && concatData.data.count === 1">
|
||||||
class="pop-big-bg" alt="">
|
<div class="pop-bg-s-box dis-f jus-x al-item">
|
||||||
<img src="../assets/img/detail/threeConcatbgImg.svg"
|
<div class="pop-bg-s">
|
||||||
v-if="concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3"
|
<div class="pos-a pop-bg-s" style="z-index:666;">
|
||||||
class="third-concat" alt="">
|
<div class="title s-w-100">
|
||||||
<img src="../assets/img/detail/close.png" class="close-img" @click="showConcat = false" alt="">
|
联系方式
|
||||||
</div>
|
|
||||||
<!-- 一种信息 -->
|
|
||||||
<div class="pop" v-show="concatData.data && concatData.data.count === 1">
|
|
||||||
<div class="pop-bg-s-box dis-f jus-x al-item">
|
|
||||||
<div class="pop-bg-s">
|
|
||||||
<div class="pos-a pop-bg-s" style="z-index:666;">
|
|
||||||
<div class="title s-w-100">
|
|
||||||
联系方式
|
|
||||||
</div>
|
|
||||||
<div class="s-w-100 mg-t-35" v-if="concatData.data && concatData.data.wechatdata.aid != 0">
|
|
||||||
<div class="wx-qrcode s-w-100 dis-f al-item jus-x">
|
|
||||||
<img :src="concatData.data && concatData.data.wechatdata.url" class="img" alt="">
|
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:15px">
|
<div class="s-w-100 mg-t-35" v-if="concatData.data && concatData.data.wechatdata.aid != 0">
|
||||||
<div>
|
<div class="wx-qrcode s-w-100 dis-f al-item jus-x">
|
||||||
微信扫码添加好友
|
<img :src="concatData.data && concatData.data.wechatdata.url" class="img" alt="">
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top:5px">
|
<div style="margin-top:15px">
|
||||||
备注:寄托租房
|
<div>
|
||||||
|
微信扫码添加好友
|
||||||
|
</div>
|
||||||
|
<div style="margin-top:5px">
|
||||||
|
备注:寄托租房
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="s-w-100"
|
||||||
|
v-if="concatData.data && (concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat)">
|
||||||
|
<div class="whatsapp-title" v-if="concatData.data.whatsapp">
|
||||||
|
WhatsApp
|
||||||
|
</div>
|
||||||
|
<div class="whatsapp-title" v-if="concatData.data.tel">
|
||||||
|
电话
|
||||||
|
</div>
|
||||||
|
<div class="whatsapp-title" v-if="concatData.data.wechat">
|
||||||
|
微信
|
||||||
|
</div>
|
||||||
|
<div class="whatsapp-text">
|
||||||
|
{{ concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat || ''
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="s-w-100 dis-f jus-x al-item mg-t-35">
|
||||||
|
<div class="clone-btn dis-f al-item jus-x"
|
||||||
|
v-if="concatData.data && (concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat)"
|
||||||
|
@click.stop="clone(concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat)">
|
||||||
|
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
||||||
|
复制
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="s-w-100"
|
<img src="../assets/img/detail/popSBg.svg" class="pop-bg-s pos-a" alt="">
|
||||||
v-if="concatData.data && (concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat)">
|
<img src="../assets/img/detail/popSbgMap.svg" class="pop-bg-s" alt="">
|
||||||
<div class="whatsapp-title" v-if="concatData.data.whatsapp">
|
|
||||||
WhatsApp
|
|
||||||
</div>
|
|
||||||
<div class="whatsapp-title" v-if="concatData.data.tel">
|
|
||||||
电话
|
|
||||||
</div>
|
|
||||||
<div class="whatsapp-title" v-if="concatData.data.wechat">
|
|
||||||
微信
|
|
||||||
</div>
|
|
||||||
<div class="whatsapp-text">
|
|
||||||
{{ concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat || '' }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="s-w-100 dis-f jus-x al-item mg-t-35">
|
|
||||||
<div class="clone-btn dis-f al-item jus-x"
|
|
||||||
v-if="concatData.data && (concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat)"
|
|
||||||
@click.stop="clone(concatData.data.whatsapp || concatData.data.tel || concatData.data.wechat)">
|
|
||||||
<img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
|
|
||||||
复制
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<img src="../assets/img/detail/popSBg.svg" class="pop-bg-s pos-a" alt="">
|
|
||||||
<img src="../assets/img/detail/popSbgMap.svg" class="pop-bg-s" alt="">
|
|
||||||
</div>
|
</div>
|
||||||
|
<img src="../assets/img/detail/close.png" @click="showConcat = false" class="close-img" alt="">
|
||||||
|
<img src="../assets/img/detail/popBg.svg" class="img" alt="">
|
||||||
</div>
|
</div>
|
||||||
<img src="../assets/img/detail/close.png" @click="showConcat = false" class="close-img" alt="">
|
|
||||||
<img src="../assets/img/detail/popBg.svg" class="img" alt="">
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<watchImage :show="imageShow" :index="imageIndex" :close="cloaseImageShow" :list="imgList"></watchImage>
|
<watchImage :show="imageShow" :index="imageIndex" :close="cloaseImageShow" :list="imgList"></watchImage>
|
||||||
<!-- 右下角咨询 -->
|
|
||||||
<circle-btn></circle-btn>
|
|
||||||
<back-to-top></back-to-top>
|
<back-to-top></back-to-top>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, onMounted, ref, nextTick, onBeforeUnmount,watch } from 'vue'
|
import { reactive, onMounted, ref, nextTick, onBeforeUnmount, watch } from 'vue'
|
||||||
import pageTopBar from '../components/pageTopBar/pageTopBar.vue';
|
import pageTopBar from '../components/pageTopBar/pageTopBar.vue';
|
||||||
import circleBtn from '@/components/public/circle-btn.vue'
|
|
||||||
import api from "../utils/api";
|
import api from "../utils/api";
|
||||||
import footerTool from '@/components/footer/footer.vue'
|
import footerTool from '@/components/footer/footer.vue'
|
||||||
import watchImage from '../components/detail/imageWatch.vue'
|
import watchImage from '../components/detail/imageWatch.vue'
|
||||||
import breadcrumb from '../components/detail/breadcrumb.vue'
|
import breadcrumb from '../components/detail/breadcrumb.vue'
|
||||||
import mapInfo from '../components/public/viewMap.vue'
|
import mapInfo from '../components/public/viewMap.vue'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import { useRouter,useRoute } from 'vue-router'
|
import { useRouter, useRoute } from 'vue-router'
|
||||||
import indexWaterfallBox from "../components/indexWaterfallBox/indexWaterfallBox.vue";
|
import indexWaterfallBox from "../components/indexWaterfallBox/indexWaterfallBox.vue";
|
||||||
import Masonry from 'masonry-layout';
|
import Masonry from 'masonry-layout';
|
||||||
import transmitBtn from '@/components/public/transmitBtn.vue'
|
import transmitBtn from '@/components/public/transmitBtn.vue'
|
||||||
@@ -1214,10 +1218,10 @@ let getHousingInfo = () => {
|
|||||||
})
|
})
|
||||||
concatInfo['data'] = store.state.indexData.wechat
|
concatInfo['data'] = store.state.indexData.wechat
|
||||||
if (res.data.contacts) contacts['data'] = res.data.contacts
|
if (res.data.contacts) contacts['data'] = res.data.contacts
|
||||||
console.log('pageType',pageType.value)
|
console.log('pageType', pageType.value)
|
||||||
if ( pageType.value ==2&&housingInfo['data'].isintermediary) {
|
if (pageType.value == 2 && housingInfo['data'].isintermediary) {
|
||||||
getPublisherList()
|
getPublisherList()
|
||||||
} else if (pageType.value !=3) {
|
} else if (pageType.value != 3) {
|
||||||
recommendList()
|
recommendList()
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1386,12 +1390,12 @@ let masonryInstance = null
|
|||||||
let router = useRouter()
|
let router = useRouter()
|
||||||
let route = useRoute()
|
let route = useRoute()
|
||||||
|
|
||||||
watch(route,()=>{
|
watch(route, () => {
|
||||||
let { id, type } = router.currentRoute.value.query
|
let { id, type } = router.currentRoute.value.query
|
||||||
uniqid.value = id
|
uniqid.value = id
|
||||||
pageType.value = type //1个人 2中介 3求房源
|
pageType.value = type //1个人 2中介 3求房源
|
||||||
publisherList.value=[]
|
publisherList.value = []
|
||||||
recommendListData.value=[]
|
recommendListData.value = []
|
||||||
getHousingInfo()
|
getHousingInfo()
|
||||||
masonryInstance = new Masonry(gridContainer.value, {
|
masonryInstance = new Masonry(gridContainer.value, {
|
||||||
itemSelector: '.waterfall-box',
|
itemSelector: '.waterfall-box',
|
||||||
@@ -2842,5 +2846,15 @@ img {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.pop-mask {
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
background-color: rgba(0, 0, 0, 0.7);
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
Reference in New Issue
Block a user