PC租房全局化-还没
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="dis-f jus-x al-item" style="position: relative; z-index: 333;">
|
<div class="dis-f jus-x al-item" style="position: relative; z-index: 333;">
|
||||||
<div class="body-maxWidth" :class="{seachPage: !props.seachPage}">
|
<div class="body-maxWidth" :class="{ seachPage: !props.seachPage }">
|
||||||
<div class="s-w-100 seach-box-bg">
|
<div class="s-w-100 seach-box-bg">
|
||||||
<div class="seach-box">
|
<div class="seach-box">
|
||||||
<div class="top-seach dis-f al-item" v-if="props.seachPage">
|
<div class="top-seach dis-f al-item" v-if="props.seachPage">
|
||||||
@@ -15,7 +15,7 @@
|
|||||||
<div class="flexacenter seek-input">
|
<div class="flexacenter seek-input">
|
||||||
<el-popover v-model:visible="historyShow" placement="bottom" :width="560" trigger="click" :show-arrow="false" popper-style="background: transparent;padding:0;box-shadow: none;border: none;transform: translateX(50px);">
|
<el-popover v-model:visible="historyShow" placement="bottom" :width="560" trigger="click" :show-arrow="false" popper-style="background: transparent;padding:0;box-shadow: none;border: none;transform: translateX(50px);">
|
||||||
<template #reference>
|
<template #reference>
|
||||||
<el-input class="search-input " v-model="pitchValue['keyword']" placeholder="搜索房源或输入房源ID" @keyup.enter="handleKeyword(pitchValue['keyword'])" style="height: 40px; width: 460px;" maxlength="15"></el-input>
|
<el-input class="search-input" v-model="pitchValue['keyword']" placeholder="搜索房源或输入房源ID" @keyup.enter="handleKeyword(pitchValue['keyword'])" style="height: 40px; width: 460px;" maxlength="15"></el-input>
|
||||||
</template>
|
</template>
|
||||||
<div class="dis-f al-item pos-r">
|
<div class="dis-f al-item pos-r">
|
||||||
<div class="seach-hiosory-box scrollbar">
|
<div class="seach-hiosory-box scrollbar">
|
||||||
@@ -87,13 +87,13 @@
|
|||||||
<img class="triangle" src="@/assets/img/publicImage/triangle-black.svg" />
|
<img class="triangle" src="@/assets/img/publicImage/triangle-black.svg" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="option-area flexflex" :class="{'option-area-unfold': state == 'unfold'}">
|
<div class="option-area flexflex" :class="{ 'option-area-unfold': state == 'unfold' }">
|
||||||
<div class="option-left">
|
<div class="option-left">
|
||||||
<div class="option-item flexflex">
|
<div class="option-item flexflex">
|
||||||
<div class="option-title">学校附近</div>
|
<div class="option-title">学校附近</div>
|
||||||
<div class="option-box flexflex flex1">
|
<div class="option-box flexflex flex1">
|
||||||
<div class="item flexcenter" :class="{pitch: 0 == pitchValue['school']}" @click="selectOption('nearSchool', 0)">不限</div>
|
<div class="item flexcenter" :class="{ pitch: 0 == pitchValue['school'] }" @click="selectOption('nearSchool', 0)">不限</div>
|
||||||
<div class="item flexcenter" v-for="item in nearSchoolList" :class="{pitch: item['id'] == pitchValue['school']}" @click="selectOption('nearSchool', item.id)">{{ item["name"] }}</div>
|
<div class="item flexcenter" v-for="item in nearSchoolList" :class="{ pitch: item['id'] == pitchValue['school'] }" @click="selectOption('nearSchool', item.id)">{{ item["name"] }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="option-item flexflex">
|
<div class="option-item flexflex">
|
||||||
@@ -111,8 +111,8 @@
|
|||||||
<div class="option-item flexflex">
|
<div class="option-item flexflex">
|
||||||
<div class="option-title">房型</div>
|
<div class="option-title">房型</div>
|
||||||
<div class="option-box flexflex flex1">
|
<div class="option-box flexflex flex1">
|
||||||
<div class="item flexcenter" :class="{pitch: 0 == pitchValue['roomtype']}" @click="selectOption('roomType', 0)">不限</div>
|
<div class="item flexcenter" :class="{ pitch: 0 == pitchValue['roomtype'] }" @click="selectOption('roomType', 0)">不限</div>
|
||||||
<div class="item flexcenter" :class="{pitch: item['id'] == pitchValue['roomtype']}" v-for="item in roomTypeList" @click="selectOption('roomType', item.id)">{{ item["name"] }}</div>
|
<div class="item flexcenter" :class="{ pitch: item['id'] == pitchValue['roomtype'] }" v-for="item in roomTypeList" @click="selectOption('roomType', item.id)">{{ item["name"] }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -121,8 +121,8 @@
|
|||||||
<div class="option-item flexflex">
|
<div class="option-item flexflex">
|
||||||
<div class="option-title">品牌</div>
|
<div class="option-title">品牌</div>
|
||||||
<div class="option-box flexflex flex1">
|
<div class="option-box flexflex flex1">
|
||||||
<div class="item flexcenter" :class="{pitch: 0 == pitchValue['companyid']}" @click="selectOption('brand', 0)">不限</div>
|
<div class="item flexcenter" :class="{ pitch: 0 == pitchValue['companyid'] }" @click="selectOption('brand', 0)">不限</div>
|
||||||
<div class="item flexcenter" :class="{pitch: item['id'] == pitchValue['companyid']}" v-for="item in brandList" @click="selectOption('brand', item.id)">
|
<div class="item flexcenter" :class="{ pitch: item['id'] == pitchValue['companyid'] }" v-for="item in brandList" @click="selectOption('brand', item.id)">
|
||||||
{{ item["name"] }}
|
{{ item["name"] }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -130,8 +130,8 @@
|
|||||||
<div class="option-item flexflex">
|
<div class="option-item flexflex">
|
||||||
<div class="option-title">楼型</div>
|
<div class="option-title">楼型</div>
|
||||||
<div class="option-box flexflex flex1">
|
<div class="option-box flexflex flex1">
|
||||||
<div class="item flexcenter" :class="{pitch: 0 == pitchValue['roomlistings']}" @click="selectOption('roomlistings', 0)">不限</div>
|
<div class="item flexcenter" :class="{ pitch: 0 == pitchValue['roomlistings'] }" @click="selectOption('roomlistings', 0)">不限</div>
|
||||||
<div class="item flexcenter" :class="{pitch: item['id'] == pitchValue['roomlistings']}" v-for="item in roomlistingsList" @click="selectOption('roomlistings', item.id)">
|
<div class="item flexcenter" :class="{ pitch: item['id'] == pitchValue['roomlistings'] }" v-for="item in roomlistingsList" @click="selectOption('roomlistings', item.id)">
|
||||||
{{ item["name"] }}
|
{{ item["name"] }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -154,14 +154,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import {ref, toRefs, watchEffect, reactive, defineProps, nextTick} from "vue"
|
import { ref, toRefs, computed, watchEffect, reactive, defineProps, nextTick } from "vue"
|
||||||
import {useStore} from "vuex"
|
import { useStore } from "vuex"
|
||||||
import store from "../../store/index"
|
import store from "../../store/index"
|
||||||
import {useRoute, useRouter} from "vue-router"
|
import { useRoute, useRouter } from "vue-router"
|
||||||
import choosingIdentity from "@/components/edit/choosingIdentity.vue"
|
import choosingIdentity from "@/components/edit/choosingIdentity.vue"
|
||||||
|
|
||||||
const usestore = useStore()
|
const usestore = useStore()
|
||||||
const {wechat} = toRefs(usestore.state)
|
const { wechat } = toRefs(usestore.state)
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
@@ -175,6 +175,9 @@ const props = defineProps({
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true,
|
||||||
},
|
},
|
||||||
|
initPitchValue: {
|
||||||
|
type: Object,
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(["handleTransfer"])
|
const emit = defineEmits(["handleTransfer"])
|
||||||
@@ -186,27 +189,19 @@ let historyShow = ref(false)
|
|||||||
let setHistoryShow = () => (historyShow.value = historyShow.value) // 修改历史记录框的显示状态 通过input的 焦点状态判断的
|
let setHistoryShow = () => (historyShow.value = historyShow.value) // 修改历史记录框的显示状态 通过input的 焦点状态判断的
|
||||||
|
|
||||||
let historyArr = ref([]) //历史查找记录
|
let historyArr = ref([]) //历史查找记录
|
||||||
let hotArr = reactive({data: []})
|
let hotArr = reactive({ data: [] })
|
||||||
|
|
||||||
//获取历史搜索记录
|
//获取历史搜索记录
|
||||||
historyArr.value = JSON.parse(localStorage.getItem("historyArr")) || []
|
historyArr.value = JSON.parse(localStorage.getItem("historyArr")) || []
|
||||||
|
|
||||||
let nearSchoolList = reactive([{name: "不限", id: 0}]) //学校附近
|
let nearSchoolList = reactive([{ name: "不限", id: 0 }]) //学校附近
|
||||||
|
|
||||||
let roomTypeList = reactive([]) // 房型
|
let roomTypeList = reactive([]) // 房型
|
||||||
|
|
||||||
let roomlistingsList = reactive([]) // 楼型
|
let roomlistingsList = reactive([]) // 楼型
|
||||||
|
|
||||||
let brandList = reactive([]) // 品牌数据
|
let brandList = reactive([]) // 品牌数据
|
||||||
|
// 筛选条件
|
||||||
watchEffect(() => {
|
|
||||||
nearSchoolList = store.state.apartment.school || []
|
|
||||||
roomTypeList = store.state.apartment.roomtype || []
|
|
||||||
roomlistingsList = store.state.apartment.roomlistings || []
|
|
||||||
brandList = store.state.apartment.brand || []
|
|
||||||
hotArr.data = store.state.indexData.hotSearcheWords
|
|
||||||
})
|
|
||||||
|
|
||||||
let pitchValue = ref({
|
let pitchValue = ref({
|
||||||
companyid: 0,
|
companyid: 0,
|
||||||
roomtype: 0,
|
roomtype: 0,
|
||||||
@@ -217,6 +212,15 @@ let pitchValue = ref({
|
|||||||
keyword: "",
|
keyword: "",
|
||||||
})
|
})
|
||||||
|
|
||||||
|
watchEffect(() => {
|
||||||
|
nearSchoolList = store.state.apartment.school || []
|
||||||
|
roomTypeList = store.state.apartment.roomtype || []
|
||||||
|
roomlistingsList = store.state.apartment.roomlistings || []
|
||||||
|
brandList = store.state.apartment.brand || []
|
||||||
|
hotArr.data = store.state.indexData.hotSearcheWords
|
||||||
|
pitchValue.value = { ...pitchValue.value, ...props.initPitchValue }
|
||||||
|
})
|
||||||
|
|
||||||
if (route.query["companyid"]) {
|
if (route.query["companyid"]) {
|
||||||
pitchValue.value["companyid"] = route.query["companyid"]
|
pitchValue.value["companyid"] = route.query["companyid"]
|
||||||
state.value = "unfold"
|
state.value = "unfold"
|
||||||
|
|||||||
@@ -192,7 +192,6 @@ const stateObj = { // btn: 0 删除 编辑 1 删除 编辑 上架 2 删除 编
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log(data.status);
|
|
||||||
|
|
||||||
let stateData = ref(stateObj[data.status])
|
let stateData = ref(stateObj[data.status])
|
||||||
// 监听修改的值
|
// 监听修改的值
|
||||||
|
|||||||
@@ -59,7 +59,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<div class="consult-pop flexacenter">
|
<div class="consult-pop flexacenter">
|
||||||
<div class="consult-title flexacenter">欢迎联系 <b>{{ wechat["nickname"] }}</b> 咨询公寓</div>
|
<div class="consult-title flexacenter">
|
||||||
|
欢迎联系 <b>{{ wechat["nickname"] }}</b> 咨询公寓
|
||||||
|
</div>
|
||||||
<div class="consult-QRcode flexcenter">
|
<div class="consult-QRcode flexcenter">
|
||||||
<img class="consult-QRcode-img" :src="wechat['personalqrcode']" />
|
<img class="consult-QRcode-img" :src="wechat['personalqrcode']" />
|
||||||
</div>
|
</div>
|
||||||
@@ -100,7 +102,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, toRefs, watchEffect, reactive, defineProps } from "vue"
|
import { onMounted, ref, toRefs, watchEffect, reactive, defineProps, inject } from "vue"
|
||||||
import { useStore } from "vuex"
|
import { useStore } from "vuex"
|
||||||
|
|
||||||
import seachInfo from "../indexSeachInfo/indexSeachInfo.vue"
|
import seachInfo from "../indexSeachInfo/indexSeachInfo.vue"
|
||||||
@@ -145,6 +147,13 @@ let seachAllType = reactive({
|
|||||||
orderby: "timestamp",
|
orderby: "timestamp",
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const pitchValue = inject("pitchValue") || {}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
// seachAllType = {...seachAllType, ...pitchValue}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
//获取区域下列数据
|
//获取区域下列数据
|
||||||
let getLocationData = data => {
|
let getLocationData = data => {
|
||||||
for (let item in data) {
|
for (let item in data) {
|
||||||
@@ -194,34 +203,37 @@ let seachList = item => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
//设置点击一级区域
|
//设置点击一级区域 特殊的 选中区域的不限 需要修改值 并且去掉学校值
|
||||||
let setLocation = (type, data) => {
|
let setLocation = (type, data, isupdate = true) => {
|
||||||
seachAllType[type] = data
|
seachAllType[type] = data
|
||||||
seachAllType["school"] = ""
|
seachAllType["school"] = ""
|
||||||
|
if (isupdate) getDataList(seachAllType)
|
||||||
}
|
}
|
||||||
|
|
||||||
//设置搜索数据
|
//设置搜索数据 type: 类型 data: 数据 second: 二级数据
|
||||||
let setSeachConditions = (type, data, second = null) => {
|
let setSeachConditions = (type, data, second = null) => {
|
||||||
|
console.log("赋值前的数据:",seachAllType);
|
||||||
if (type === "rent") {
|
if (type === "rent") {
|
||||||
seachAllType["rent_min"] = data.min
|
seachAllType["rent_min"] = data.min
|
||||||
seachAllType["rent_max"] = data.max
|
seachAllType["rent_max"] = data.max
|
||||||
} else if (type !== "") {
|
} else if (type !== "") { // 这里是正常的数据 直接赋值
|
||||||
seachAllType[type] = data
|
seachAllType[type] = data
|
||||||
} else if (type === "") {
|
} else if (type === "") { // 电梯 阳台 认证 那些是传数组的
|
||||||
data.indexOf("isintermediary") !== -1 ? (seachAllType["isintermediary"] = 1) : (seachAllType["isintermediary"] = 0)
|
data.indexOf("isintermediary") !== -1 ? (seachAllType["isintermediary"] = 1) : (seachAllType["isintermediary"] = 0)
|
||||||
data.indexOf("isverified") !== -1 ? (seachAllType["isverified"] = 1) : (seachAllType["isverified"] = 0)
|
data.indexOf("isverified") !== -1 ? (seachAllType["isverified"] = 1) : (seachAllType["isverified"] = 0)
|
||||||
data.indexOf("iselevator") !== -1 ? (seachAllType["iselevator"] = 1) : (seachAllType["iselevator"] = 0)
|
data.indexOf("iselevator") !== -1 ? (seachAllType["iselevator"] = 1) : (seachAllType["iselevator"] = 0)
|
||||||
data.indexOf("issunshinearea") !== -1 ? (seachAllType["issunshinearea"] = 1) : (seachAllType["issunshinearea"] = 0)
|
data.indexOf("issunshinearea") !== -1 ? (seachAllType["issunshinearea"] = 1) : (seachAllType["issunshinearea"] = 0)
|
||||||
}
|
}
|
||||||
if (type === "school") {
|
// 学校和区域是 二选一
|
||||||
seachAllType.location = []
|
if (type === "school") seachAllType.location = []
|
||||||
}
|
if (type === "location") seachAllType.school = ""
|
||||||
if (type === "location") {
|
|
||||||
seachAllType.school = ""
|
|
||||||
}
|
|
||||||
if (second) {
|
if (second) {
|
||||||
seachAllType[second.type] = second.id
|
seachAllType[second.type] = second.id
|
||||||
}
|
}
|
||||||
|
console.log(type, data, second);
|
||||||
|
console.log("保存前的处理数据:", seachAllType);
|
||||||
|
|
||||||
getDataList(seachAllType)
|
getDataList(seachAllType)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -210,7 +210,6 @@
|
|||||||
<div class="dropdown-btn min-btn jus-x al-item dis-f" style="border:1px solid #fff;"
|
<div class="dropdown-btn min-btn jus-x al-item dis-f" style="border:1px solid #fff;"
|
||||||
v-for="(item, i) in otherData" :key="i">
|
v-for="(item, i) in otherData" :key="i">
|
||||||
<el-checkbox-group v-model="otherCheck.list" @change="setOtherCheck">
|
<el-checkbox-group v-model="otherCheck.list" @change="setOtherCheck">
|
||||||
{{ item }}
|
|
||||||
<!-- 特殊处理 认证房源 要红色字体 -->
|
<!-- 特殊处理 认证房源 要红色字体 -->
|
||||||
<el-checkbox :label="item.id" :style="{color: item.title == '认证房源' ? '#F95D5D' : ''}">{{ item.title }}</el-checkbox>
|
<el-checkbox :label="item.id" :style="{color: item.title == '认证房源' ? '#F95D5D' : ''}">{{ item.title }}</el-checkbox>
|
||||||
</el-checkbox-group>
|
</el-checkbox-group>
|
||||||
@@ -261,7 +260,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, ref, getCurrentInstance, defineProps, watchEffect, inject, shallowReactive, defineExpose, nextTick, watch } from 'vue';
|
import { onMounted, reactive, ref, getCurrentInstance, defineProps, watchEffect, inject, shallowReactive, defineExpose, nextTick, watch } from 'vue';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import checkBoxGroup from "../../components/checkGroup/checkBoxGroup.vue";
|
import checkBoxGroup from "../../components/checkGroup/checkBoxGroup.vue";
|
||||||
import store from '../../store/index';
|
import store from '../../store/index';
|
||||||
@@ -288,6 +287,38 @@ const props = defineProps({
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const pitchValue = inject('pitchValue') || {}
|
||||||
|
|
||||||
|
onMounted(()=>{
|
||||||
|
console.log("min", pitchValue);
|
||||||
|
|
||||||
|
if (pitchValue['gender']) gender.id = pitchValue['gender']
|
||||||
|
if (pitchValue['publish']) releaseObj.id = pitchValue['publish']
|
||||||
|
if (pitchValue['leaseterm']) hireDate.id = pitchValue['leaseterm']
|
||||||
|
if (pitchValue['rent_min']) rentObj.min = pitchValue['rent_min']
|
||||||
|
if (pitchValue['rent_max']) rentObj.max = pitchValue['rent_max']
|
||||||
|
if (pitchValue['school']) schoolSelectObj.id = pitchValue['school']
|
||||||
|
|
||||||
|
|
||||||
|
if (pitchValue['types']) {
|
||||||
|
// hireTypeArr.forEach(element => {
|
||||||
|
// if (element.id == Math.floor(pitchValue['types'])) setHireId(element, false)
|
||||||
|
// element.hireType.forEach(ele => {
|
||||||
|
// if (ele.id === pitchValue['types']) dropdownCommand(ele)
|
||||||
|
// })
|
||||||
|
// })
|
||||||
|
}
|
||||||
|
|
||||||
|
if (pitchValue['iselevator'] == 1) otherCheck.list.push('iselevator')
|
||||||
|
if (pitchValue['isintermediary'] == 1) otherCheck.list.push('isintermediary')
|
||||||
|
if (pitchValue['issunshinearea'] == 1) otherCheck.list.push('issunshinearea')
|
||||||
|
if (pitchValue['isverified'] == 1) otherCheck.list.push('isverified')
|
||||||
|
|
||||||
|
// if (pitchValue['location']) selectSeach(pitchValue['location'])
|
||||||
|
// selectSeach(['1.2', '1.4'])
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
let setSeachCondition = props.setSeachCondition
|
let setSeachCondition = props.setSeachCondition
|
||||||
let setLocation = props.setLocation//设置一级区域
|
let setLocation = props.setLocation//设置一级区域
|
||||||
|
|
||||||
@@ -439,7 +470,7 @@ let setSelectData = (id, data = [], title) => {
|
|||||||
if (id) selectData.data = [{ title: '不限', id: '' }]
|
if (id) selectData.data = [{ title: '不限', id: '' }]
|
||||||
schoolSelectObj.id = ''
|
schoolSelectObj.id = ''
|
||||||
schoolSelectObj.title = ''
|
schoolSelectObj.title = ''
|
||||||
setLocation('location', [selectTabCheck.id + ''])
|
setLocation('location', [selectTabCheck.id + ''],)
|
||||||
if (id === '') {
|
if (id === '') {
|
||||||
selectData.data = []
|
selectData.data = []
|
||||||
loactionArr.data=null
|
loactionArr.data=null
|
||||||
@@ -467,12 +498,14 @@ let seachAreaId = (data) => {
|
|||||||
//设置当前地区选项
|
//设置当前地区选项
|
||||||
let checkBoxGroupInfo = ref(null)
|
let checkBoxGroupInfo = ref(null)
|
||||||
let setCheckBoxData = (data) => {
|
let setCheckBoxData = (data) => {
|
||||||
|
console.log("data", data);
|
||||||
checkBoxGroupInfo.value && checkBoxGroupInfo.value.setCheckData(data)
|
checkBoxGroupInfo.value && checkBoxGroupInfo.value.setCheckData(data)
|
||||||
}
|
}
|
||||||
|
|
||||||
let loactionArr=shallowReactive({data:null})
|
let loactionArr=shallowReactive({data:null})
|
||||||
//确认按钮
|
//确认按钮
|
||||||
let selectSeach = (data = []) => {
|
let selectSeach = (data = []) => {
|
||||||
|
console.log("data", data);
|
||||||
selectData.data = seachAreaId(data)
|
selectData.data = seachAreaId(data)
|
||||||
showSelect.value = false
|
showSelect.value = false
|
||||||
if (data.length === 0 && selectTabCheck.id) {
|
if (data.length === 0 && selectTabCheck.id) {
|
||||||
@@ -482,7 +515,6 @@ let selectSeach = (data = []) => {
|
|||||||
}
|
}
|
||||||
schoolSelectObj.id = ''
|
schoolSelectObj.id = ''
|
||||||
schoolSelectObj.title = ''
|
schoolSelectObj.title = ''
|
||||||
console.log(loactionArr.data,data)
|
|
||||||
if(loactionArr.data&&(loactionArr.data.toString()===data.toString()))return
|
if(loactionArr.data&&(loactionArr.data.toString()===data.toString()))return
|
||||||
|
|
||||||
loactionArr.data=JSON.parse(JSON.stringify(data))
|
loactionArr.data=JSON.parse(JSON.stringify(data))
|
||||||
@@ -538,7 +570,8 @@ let setHireTypeArr = (type, id) => {
|
|||||||
|
|
||||||
let hireTypeObj = reactive({ id: '', title: '', hireId: '不限',checkId:'' })//出租方式所选
|
let hireTypeObj = reactive({ id: '', title: '', hireId: '不限',checkId:'' })//出租方式所选
|
||||||
|
|
||||||
let setHireId = (item) => {
|
// isupdate 是否需要更新
|
||||||
|
let setHireId = (item, isupdate = true) => {
|
||||||
if(item.id===hireTypeObj.id)return
|
if(item.id===hireTypeObj.id)return
|
||||||
if (hireTypeObj.hireId != item.title) {
|
if (hireTypeObj.hireId != item.title) {
|
||||||
hireTypeObj.id = ''
|
hireTypeObj.id = ''
|
||||||
@@ -548,7 +581,7 @@ let setHireId = (item) => {
|
|||||||
if(hireTypeObj.checkId.toString().length>1)return
|
if(hireTypeObj.checkId.toString().length>1)return
|
||||||
hireTypeObj.hireId = item.title
|
hireTypeObj.hireId = item.title
|
||||||
hireTypeObj.id = item.id
|
hireTypeObj.id = item.id
|
||||||
setSeachCondition('types',hireTypeObj.id)
|
if(isupdate) setSeachCondition('types',hireTypeObj.id)
|
||||||
}
|
}
|
||||||
|
|
||||||
let dropdownCommand = (obj) => {
|
let dropdownCommand = (obj) => {
|
||||||
|
|||||||
@@ -24,6 +24,9 @@ export default createStore({
|
|||||||
seachPage: {}
|
seachPage: {}
|
||||||
},//保存筛选条件
|
},//保存筛选条件
|
||||||
showloginmodal: false, // 是否需要登录状态
|
showloginmodal: false, // 是否需要登录状态
|
||||||
|
apartmentPitchValue: {}, // 公寓筛选的值 全局化
|
||||||
|
needPitchValue: {}, // 求房源筛选的值 全局化
|
||||||
|
personPitchValue: {}, // 个人筛选的值 全局化
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
|
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<pageTopBar :bannerList="bannerList.data.apartment"></pageTopBar>
|
<pageTopBar :bannerList="bannerList.data.apartment"></pageTopBar>
|
||||||
<!-- 筛选 -->
|
<!-- 筛选 -->
|
||||||
<div class="screen-box wid1200">
|
<div class="screen-box wid1200">
|
||||||
<seach-module @handleTransfer="handleTransfer" :count="listCount"></seach-module>
|
<seach-module @handleTransfer="handleTransfer" :count="listCount" :initPitchValue="pitchValue"></seach-module>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="list wid1200 flexflex" ref="gridContainer">
|
<div class="list wid1200 flexflex" ref="gridContainer">
|
||||||
@@ -25,33 +25,31 @@
|
|||||||
<circle-btn></circle-btn>
|
<circle-btn></circle-btn>
|
||||||
<back-to-top></back-to-top>
|
<back-to-top></back-to-top>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import pageTopBar from '../../components/pageTopBar/pageTopBar.vue';
|
|
||||||
import seachModule from "@/components/apartment/seachModule.vue";
|
|
||||||
import apartmentItem from '@/components/public/apartment-item.vue';
|
|
||||||
import haveQuestions from '@/components/public/have-questions.vue'
|
|
||||||
import pageFooter from '@/components/footer/footer.vue'
|
|
||||||
import emptyDuck from '@/components/public/empty-duck.vue'
|
|
||||||
import circleBtn from '@/components/public/circle-btn.vue'
|
|
||||||
import { ref, onMounted, onUnmounted, watch, getCurrentInstance, nextTick,reactive } from 'vue';
|
|
||||||
import { ElLoading } from 'element-plus'
|
|
||||||
import Masonry from 'masonry-layout';
|
|
||||||
import { useRoute, useRouter } from 'vue-router';
|
|
||||||
import backToTop from '@/components/public/backToTop.vue'
|
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import pageTopBar from "../../components/pageTopBar/pageTopBar.vue"
|
||||||
|
import seachModule from "@/components/apartment/seachModule.vue"
|
||||||
|
import apartmentItem from "@/components/public/apartment-item.vue"
|
||||||
|
import haveQuestions from "@/components/public/have-questions.vue"
|
||||||
|
import pageFooter from "@/components/footer/footer.vue"
|
||||||
|
import emptyDuck from "@/components/public/empty-duck.vue"
|
||||||
|
import circleBtn from "@/components/public/circle-btn.vue"
|
||||||
|
import { ref, onMounted, onUnmounted, watch, getCurrentInstance, nextTick, reactive } from "vue"
|
||||||
|
import { ElLoading } from "element-plus"
|
||||||
|
import Masonry from "masonry-layout"
|
||||||
|
import { useRoute, useRouter } from "vue-router"
|
||||||
|
import backToTop from "@/components/public/backToTop.vue"
|
||||||
|
import store from "../../store/index"
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
item: Object,
|
item: Object,
|
||||||
});
|
})
|
||||||
|
|
||||||
const gridContainer = ref(null);
|
|
||||||
|
|
||||||
|
const gridContainer = ref(null)
|
||||||
|
|
||||||
let list = ref([])
|
let list = ref([])
|
||||||
let listCount = ref(0) // 列表数量
|
let listCount = ref(0) // 列表数量
|
||||||
@@ -59,21 +57,24 @@ let listCount = ref(0) // 列表数量
|
|||||||
let masonryInstance = null
|
let masonryInstance = null
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
// 初始化瀑布流
|
||||||
masonryInstance = new Masonry(gridContainer.value, {
|
masonryInstance = new Masonry(gridContainer.value, {
|
||||||
itemSelector: '.item',
|
itemSelector: ".item",
|
||||||
gutter: 20
|
gutter: 20,
|
||||||
});
|
})
|
||||||
|
|
||||||
if (route.query['companyid']) pitchValue['companyid'] = route.query['companyid']
|
pitchValue.value = store.state.apartmentPitchValue
|
||||||
banner()
|
if (route.query["companyid"]) pitchValue.value["companyid"] = route.query["companyid"]
|
||||||
getData()
|
|
||||||
|
|
||||||
window.addEventListener('scroll', handleScroll);
|
banner() // 获取轮播图数据
|
||||||
});
|
getData() // 获取列表数据
|
||||||
|
|
||||||
|
window.addEventListener("scroll", handleScroll)
|
||||||
|
})
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
window.removeEventListener('scroll', handleScroll);
|
window.removeEventListener("scroll", handleScroll)
|
||||||
});
|
})
|
||||||
|
|
||||||
let loading = null // 加载
|
let loading = null // 加载
|
||||||
let requestLoading = false // 接口加载中
|
let requestLoading = false // 接口加载中
|
||||||
@@ -82,58 +83,60 @@ const getData = () => {
|
|||||||
if (page == 0 || requestLoading) return
|
if (page == 0 || requestLoading) return
|
||||||
loading = ElLoading.service({
|
loading = ElLoading.service({
|
||||||
lock: true,
|
lock: true,
|
||||||
text: 'Loading',
|
text: "Loading",
|
||||||
background: 'rgba(0, 0, 0, 0.7)',
|
background: "rgba(0, 0, 0, 0.7)",
|
||||||
})
|
})
|
||||||
requestLoading = true
|
requestLoading = true
|
||||||
|
|
||||||
proxy.$get("/tenement/pc/api/apartment", {
|
proxy
|
||||||
limit: 10,
|
.$get("/tenement/pc/api/apartment", {
|
||||||
page,
|
limit: 10,
|
||||||
...pitchValue
|
page,
|
||||||
}).then(res => {
|
...pitchValue.value,
|
||||||
if (res.code != 200) return
|
})
|
||||||
let data = res.data
|
.then(res => {
|
||||||
list.value = list.value.concat(data.data || [])
|
if (res.code != 200) return
|
||||||
page = data.page * data.limit >= data.count ? 0 : page + 1
|
let data = res.data
|
||||||
|
list.value = list.value.concat(data.data || [])
|
||||||
|
page = data.page * data.limit >= data.count ? 0 : page + 1
|
||||||
|
|
||||||
listCount = data.count
|
listCount = data.count
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
masonryInstance.reloadItems();
|
masonryInstance.reloadItems()
|
||||||
masonryInstance.layout();
|
masonryInstance.layout()
|
||||||
|
loading.close()
|
||||||
|
requestLoading = false
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
loading.close()
|
loading.close()
|
||||||
requestLoading = false
|
requestLoading = false
|
||||||
})
|
})
|
||||||
|
|
||||||
}).catch(err => {
|
|
||||||
loading.close()
|
|
||||||
requestLoading = false
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleScroll = () => {
|
const handleScroll = () => {
|
||||||
const scrollHeight = document.documentElement.scrollHeight;
|
const scrollHeight = document.documentElement.scrollHeight
|
||||||
const clientHeight = document.documentElement.clientHeight;
|
const clientHeight = document.documentElement.clientHeight
|
||||||
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
|
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop
|
||||||
if (scrollTop + clientHeight >= scrollHeight - 350) getData()
|
if (scrollTop + clientHeight >= scrollHeight - 350) getData()
|
||||||
};
|
}
|
||||||
|
|
||||||
let pitchValue = {
|
let pitchValue = ref({
|
||||||
companyid: 0,
|
companyid: 0,
|
||||||
roomtype: 0,
|
roomtype: 0,
|
||||||
rent_min: null, // 租金
|
rent_min: null, // 租金
|
||||||
rent_max: null, // 租金
|
rent_max: null, // 租金
|
||||||
school: 0,
|
school: 0,
|
||||||
roomlistings: 0,
|
roomlistings: 0,
|
||||||
keyword: "",
|
keyword: "",
|
||||||
}
|
})
|
||||||
|
|
||||||
// 筛选组件的参数的中转
|
// 筛选组件的参数的中转
|
||||||
const handleTransfer = (data) => {
|
const handleTransfer = data => {
|
||||||
for (const key in data.value) {
|
for (const key in data.value) {
|
||||||
if (data.value[key] != pitchValue[key]) {
|
if (data.value[key] != pitchValue.value[key]) {
|
||||||
pitchValue = { ...data.value }
|
pitchValue.value = { ...data.value }
|
||||||
|
store.state.apartmentPitchValue = pitchValue.value
|
||||||
page = 1
|
page = 1
|
||||||
list.value = []
|
list.value = []
|
||||||
getData()
|
getData()
|
||||||
@@ -146,12 +149,9 @@ const handleTransfer = (data) => {
|
|||||||
let bannerList = reactive({ data: [] })
|
let bannerList = reactive({ data: [] })
|
||||||
let banner = () => {
|
let banner = () => {
|
||||||
proxy.$get("/tenement/pc/api/banner").then(res => {
|
proxy.$get("/tenement/pc/api/banner").then(res => {
|
||||||
if (res.code === 200) {
|
if (res.code === 200) bannerList.data = res.data
|
||||||
bannerList.data = res.data
|
})
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.screen-box {
|
.screen-box {
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
<pageTopBar></pageTopBar>
|
<pageTopBar></pageTopBar>
|
||||||
<seachModule :count="dataList.count" :getDataList="setSeachSelectData"></seachModule>
|
<seachModule :count="dataList.count" :getDataList="setSeachSelectData"></seachModule>
|
||||||
<div class="dis-f jus-x al-item">
|
<div class="dis-f jus-x al-item">
|
||||||
<div class="body-maxWidth mg-t-35" >
|
<div class="body-maxWidth mg-t-35">
|
||||||
<div v-show="dataList.data && dataList.data.length > 0" ref="list">
|
<div v-show="dataList.data && dataList.data.length > 0" ref="list">
|
||||||
<biserialItem v-for="(item, i) in pageList" :key="i" :item="item"></biserialItem>
|
<biserialItem v-for="(item, i) in pageList" :key="i" :item="item"></biserialItem>
|
||||||
</div>
|
</div>
|
||||||
@@ -18,25 +18,24 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<back-to-top></back-to-top>
|
<back-to-top></back-to-top>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { reactive, onMounted, ref, provide, onBeforeUnmount, nextTick } from 'vue'
|
|
||||||
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";
|
|
||||||
import noList from "../../components/public/empty-duck.vue";
|
|
||||||
import circleBtn from '@/components/public/circle-btn.vue'
|
|
||||||
import api from "../../utils/api";
|
|
||||||
import tool from '../../toolJs/downLoadMore'
|
|
||||||
import { ElMessage } from 'element-plus'
|
|
||||||
import footerTool from '@/components/footer/footer.vue'
|
|
||||||
import loadMoreText from '../../components/loadMore/loadMoreText.vue'
|
|
||||||
import backToTop from '@/components/public/backToTop.vue'
|
|
||||||
import Masonry from 'masonry-layout';
|
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { reactive, onMounted, ref, provide, onBeforeUnmount, nextTick } from "vue"
|
||||||
|
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"
|
||||||
|
import noList from "../../components/public/empty-duck.vue"
|
||||||
|
import circleBtn from "@/components/public/circle-btn.vue"
|
||||||
|
import api from "../../utils/api"
|
||||||
|
import tool from "../../toolJs/downLoadMore"
|
||||||
|
import { ElMessage } from "element-plus"
|
||||||
|
import footerTool from "@/components/footer/footer.vue"
|
||||||
|
import loadMoreText from "../../components/loadMore/loadMoreText.vue"
|
||||||
|
import backToTop from "@/components/public/backToTop.vue"
|
||||||
|
import Masonry from "masonry-layout"
|
||||||
|
import store from "../../store/index"
|
||||||
|
|
||||||
//瀑布实例
|
//瀑布实例
|
||||||
let listMasonryInstance = null
|
let listMasonryInstance = null
|
||||||
@@ -47,37 +46,41 @@ let dataCount = ref(0)
|
|||||||
let pageList = ref([])
|
let pageList = ref([])
|
||||||
let seachSelectData = reactive({ data: {} })
|
let seachSelectData = reactive({ data: {} })
|
||||||
let loading = ref(true)
|
let loading = ref(true)
|
||||||
let loadingText=ref(' 下拉加载更多 ')
|
let loadingText = ref(" 下拉加载更多 ")
|
||||||
provide('count', dataCount)
|
provide("count", dataCount)
|
||||||
|
|
||||||
//保存搜索设置
|
//保存搜索设置
|
||||||
let setSeachSelectData = (data) => {
|
let setSeachSelectData = data => {
|
||||||
|
console.log("保存数据的:", data);
|
||||||
|
store.state.needPitchValue = data
|
||||||
pages.value = 1
|
pages.value = 1
|
||||||
seachSelectData.data = {
|
seachSelectData.data = {
|
||||||
...data
|
// ...needPitchValue,
|
||||||
|
...data,
|
||||||
}
|
}
|
||||||
loading.value = true
|
loading.value = true
|
||||||
getDataList(seachSelectData.data)
|
getDataList(seachSelectData.data)
|
||||||
}
|
}
|
||||||
|
|
||||||
//获取搜索数据
|
//获取搜索数据
|
||||||
let getDataList = (data) => {
|
let getDataList = data => {
|
||||||
loadingText.value=' 加载中..... '
|
loadingText.value = " 加载中..... "
|
||||||
if(!loading.value)return
|
if (!loading.value) return
|
||||||
loading.value = false
|
loading.value = false
|
||||||
let postData = {
|
let postData = {
|
||||||
page: pages.value,
|
page: pages.value,
|
||||||
intermediary: 6,
|
intermediary: 6,
|
||||||
limit:20,
|
limit: 20,
|
||||||
...data
|
...data,
|
||||||
}
|
}
|
||||||
|
|
||||||
api.getLists(postData).then(res => {
|
api.getLists(postData).then(res => {
|
||||||
if (res.code === 200) {
|
if (res.code === 200) {
|
||||||
dataList.data = res.data.data
|
dataList.data = res.data.data
|
||||||
if(res.data.data.length<20){
|
if (res.data.data.length < 20) {
|
||||||
loadingText.value=' 到底了 '
|
loadingText.value = " 到底了 "
|
||||||
}else{
|
} else {
|
||||||
loadingText.value=' 下拉加载更多 '
|
loadingText.value = " 下拉加载更多 "
|
||||||
}
|
}
|
||||||
if (pages.value === 1) {
|
if (pages.value === 1) {
|
||||||
pageList.value = []
|
pageList.value = []
|
||||||
@@ -87,8 +90,8 @@ let getDataList = (data) => {
|
|||||||
dataList.count = res.data.count
|
dataList.count = res.data.count
|
||||||
dataCount.value = res.data.count
|
dataCount.value = res.data.count
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
listMasonryInstance.reloadItems();
|
listMasonryInstance.reloadItems()
|
||||||
listMasonryInstance.layout();
|
listMasonryInstance.layout()
|
||||||
if (dataList.data.length >= 20) loading.value = true
|
if (dataList.data.length >= 20) loading.value = true
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
@@ -109,22 +112,26 @@ let downLoadMore = () => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
let list = ref('')
|
let list = ref("")
|
||||||
|
|
||||||
//listImg
|
//listImg
|
||||||
|
|
||||||
|
const needPitchValue = store.state.needPitchValue
|
||||||
|
|
||||||
|
provide("pitchValue", needPitchValue)
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
listMasonryInstance = new Masonry(list.value, {
|
listMasonryInstance = new Masonry(list.value, {
|
||||||
itemSelector: '.item',
|
itemSelector: ".item",
|
||||||
gutter: 20
|
gutter: 20,
|
||||||
});
|
})
|
||||||
getDataList()
|
getDataList({...needPitchValue})
|
||||||
window.addEventListener('scroll', downLoadMore, true);
|
window.addEventListener("scroll", downLoadMore, true)
|
||||||
})
|
})
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
window.removeEventListener('scroll', downLoadMore, true);
|
window.removeEventListener("scroll", downLoadMore, true)
|
||||||
})
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
img {
|
img {
|
||||||
@@ -175,4 +182,3 @@ img {
|
|||||||
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
|
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
@@ -55,6 +55,7 @@ provide('count', dataCount)
|
|||||||
|
|
||||||
//保存搜索设置
|
//保存搜索设置
|
||||||
let setSeachSelectData = (data) => {
|
let setSeachSelectData = (data) => {
|
||||||
|
store.state.personPitchValue = data
|
||||||
pages.value = 1
|
pages.value = 1
|
||||||
seachSelectData.data = {
|
seachSelectData.data = {
|
||||||
...data
|
...data
|
||||||
|
|||||||
Reference in New Issue
Block a user