Merge remote-tracking branch 'origin/main'
# Conflicts: # src/router/index.js
This commit is contained in:
@@ -109,7 +109,7 @@
|
||||
<div>
|
||||
<div ref="waterfall1">
|
||||
<div class="waterfall-first-box dis-f">
|
||||
<div class="info-box dis-f jus-x al-item first">
|
||||
<div class="info-box dis-f jus-x al-item first" @click="indexWaterfallBoxCheck(indexData.data.tabs[0])">
|
||||
<div>
|
||||
<div class="img-box dis-f jus-x al-item">
|
||||
<img src="../assets/homeImage/person.png" class="img" alt="">
|
||||
@@ -117,7 +117,7 @@
|
||||
<div class="text-center">{{ indexData.data.tabs && indexData.data.tabs[0].name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-box dis-f jus-x al-item second">
|
||||
<div class="info-box dis-f jus-x al-item second" @click="indexWaterfallBoxCheck(indexData.data.tabs[1])">
|
||||
<div>
|
||||
<div class="img-box dis-f jus-x al-item">
|
||||
<img src="../assets/homeImage/intermediary.png" class="img" alt="">
|
||||
@@ -125,7 +125,7 @@
|
||||
<div class="text-center">{{ indexData.data.tabs && indexData.data.tabs[1].name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-box dis-f jus-x al-item third">
|
||||
<div class="info-box dis-f jus-x al-item third" @click="indexWaterfallBoxCheck(indexData.data.tabs[2])">
|
||||
<div>
|
||||
<div class="img-box dis-f jus-x al-item">
|
||||
<img src="../assets/homeImage/brand.png" class="img" alt="">
|
||||
@@ -133,7 +133,7 @@
|
||||
<div class="text-center">{{ indexData.data.tabs && indexData.data.tabs[2].name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-box dis-f jus-x al-item">
|
||||
<div class="info-box dis-f jus-x al-item" @click="indexWaterfallBoxCheck(indexData.data.tabs[3])">
|
||||
<div>
|
||||
<div class="img-box dis-f jus-x al-item">
|
||||
<img src="../assets/homeImage/seek.png" class="img" alt="">
|
||||
@@ -178,7 +178,8 @@ import pageTopBar from '../components/pageTopBar/pageTopBar.vue';
|
||||
import indexWaterfallBox from "../components/indexWaterfallBox/indexWaterfallBox.vue";
|
||||
import seachModule from "../components/seachModule/seachModule.vue";
|
||||
import indexRegularBox from '../components/indexRegularBox/indexRegularBox.vue';
|
||||
import headerNavigation from '../components/public/head.vue'
|
||||
import headerNavigation from '../components/public/head.vue';
|
||||
import { useRouter } from 'vue-router'
|
||||
import store from '../store/index';
|
||||
import api from "../utils/api";
|
||||
|
||||
@@ -201,7 +202,22 @@ let seachTypeData = reactive({ data: [] })
|
||||
watchEffect(() => {
|
||||
seachTypeData.data = store.state.seachTypeData
|
||||
indexData.data = store.state.indexData
|
||||
ListSelectBtn.data = store.state.recommendedTab
|
||||
ListSelectBtn.data = store.state.ListSelectBtn
|
||||
if (indexData.data.length) {
|
||||
indexData.data.tabs.map(res => {
|
||||
if (res.name === "个人房源") {
|
||||
res.path = '/personHousing'
|
||||
} else if (res.name === "中介房源") {
|
||||
res.path = '/intermediaryHousing'
|
||||
} else if (res.name === "求房源") {
|
||||
res.path = '/needHousing'
|
||||
} else if (res.name === "品牌公寓") {
|
||||
res.path = ''
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
//公寓数据
|
||||
@@ -265,24 +281,26 @@ let getRecommendList = () => {
|
||||
//标签切换
|
||||
let listDataTypeChange = (item) => {
|
||||
ListSelectBtn.selectType = item.type
|
||||
loadMore.value = false
|
||||
waterfallList[1] = []
|
||||
waterfallList[2] = []
|
||||
waterfallList[3] = []
|
||||
waterfallList[4] = []
|
||||
pages.value=1
|
||||
pages.value = 1
|
||||
getRecommendList()
|
||||
}
|
||||
|
||||
|
||||
//监听滚动条
|
||||
const onPageSrcoll = (e) => {
|
||||
if (!loadMore.value) return
|
||||
let body = document.documentElement ? document.documentElement : document.body ?
|
||||
document.body :
|
||||
document.querySelector('.element');
|
||||
let scrollTop = body.scrollTop
|
||||
let clientHeight = body.clientHeight
|
||||
let offsetHeight = body.offsetHeight
|
||||
if (scrollTop + clientHeight > offsetHeight - 500) {
|
||||
if (scrollTop + clientHeight === offsetHeight) {
|
||||
if (loadMore.value) {
|
||||
loadMore.value = false
|
||||
pages.value += 1
|
||||
@@ -291,14 +309,21 @@ const onPageSrcoll = (e) => {
|
||||
}
|
||||
}
|
||||
|
||||
//瀑布流模块
|
||||
const router = useRouter()
|
||||
let indexWaterfallBoxCheck = (res) => {
|
||||
router.push({
|
||||
path: res.path
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
document.documentElement.scrollTop = 0
|
||||
currentInstance = getCurrentInstance()
|
||||
setTimeout(() => {
|
||||
getRecommendList()
|
||||
}, 1000)
|
||||
nextTick(() => {
|
||||
window.addEventListener('scroll', onPageSrcoll, true);
|
||||
})
|
||||
}, 1000)
|
||||
})
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
|
||||
62
src/views/housingView/needHousing.vue
Normal file
62
src/views/housingView/needHousing.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div>
|
||||
<pageTopBar></pageTopBar>
|
||||
<seachModule></seachModule>
|
||||
<div class="dis-f jus-x al-item">
|
||||
<div class="body-maxWidth mg-t-35">
|
||||
<div class="dis-f jus-bet">
|
||||
<div>
|
||||
<biserialItem></biserialItem>
|
||||
</div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import pageTopBar from '../../components/pageTopBar/pageTopBar.vue';
|
||||
import seachModule from "../../components/seachModule/seachModule.vue";
|
||||
import biserialItem from '../../components/biserialListItem/biserialListItem.vue'
|
||||
</script>
|
||||
<style scoped>
|
||||
img {
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.dis-f {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.jus-x {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.al-item {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.pos-r {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.body-maxWidth {
|
||||
width: 1200px;
|
||||
min-width: 1200px;
|
||||
}
|
||||
|
||||
.s-w-100 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.jus-bet {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.mg-t-35 {
|
||||
margin-top: 35px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<listBtmPrompt></listBtmPrompt>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -20,6 +20,7 @@
|
||||
import pageTopBar from '../../components/pageTopBar/pageTopBar.vue';
|
||||
import seachModule from "../../components/seachModule/seachModule.vue";
|
||||
import biserialItem from '../../components/biserialListItem/biserialListItem.vue'
|
||||
import listBtmPrompt from "../../components/public/have-questions.vue";
|
||||
</script>
|
||||
<style scoped>
|
||||
img {
|
||||
|
||||
Reference in New Issue
Block a user