gter.net/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

筛选组件选择一级区域优化

Browse Source
This commit is contained in:
luJianJun 2023-08-04 17:43:04 +08:00
parent d6dfd87fc2
commit e4ebbe1d82
4 changed files with 31 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/checkGroup/checkBoxGroup.vue
View File

@ -86,7 +86,6 @@ let closeBtn=()=>{
//设置参数
let setCheckData=(data)=>{
console.log(123,checkList.list)
checkList.list=data
}

8
src/components/seachModule/seachModule.vue
View File

@ -90,7 +90,7 @@
<!-- -->
<div
v-if="routePath === '/personHousing' || routePath === '/intermediaryHousing' || routePath === '/needHousing'">
<selectTabBox :setSeachCondition="setSeachConditions"></selectTabBox>
<selectTabBox :setSeachCondition="setSeachConditions" :setLocation="setLocation"></selectTabBox>
</div>
</div>
</div>
@ -186,6 +186,12 @@ let seachList = (item) => {
})
}
//设置点击一级区域
let setLocation=(type,data)=>{
seachAllType[type] = data
seachAllType['school']=''
}
//设置搜索数据
let setSeachConditions = (type, data, second = null) => {
if (type === 'rent') {

8
src/components/seachPage/input.vue
View File

@ -102,7 +102,7 @@
<div class="seach-select-info" v-show="tabType !== 'apartment'">
<div class="select-box" :class="{ 'seach-select-h': showSelectModule }"
:style="{ 'overflow': showSelectModule ? 'visible' : 'hidden' }">
<selectTabBox :setSeachCondition="setSeachConditions" ref="selectTabBoxInfo"></selectTabBox>
<selectTabBox :setSeachCondition="setSeachConditions" :setLocation="setLocation" ref="selectTabBoxInfo"></selectTabBox>
</div>
<div :class="{ 'show-box-pd': !showSelectModule }">
<div class="box" :class="{ 'show-box': showSelectModule }">
@ -306,6 +306,12 @@ let setSeachVal = () => {
seachVal.value = seachKey.key.keyword
}
//设置点击一级区域
let setLocation=(type,data)=>{
seachAllType[type] = data
seachAllType['school']=''
}
//设置搜索数据
let setSeachConditions = (type, data) => {
if (seachAllType['tabType'] !== 'apartment') {

28
src/components/selectTabBox/selectTabBox.vue
View File

@ -1,10 +1,10 @@
<template>
<div class="dis-f s-w-100" :style="[routePath === '/seachPage' ? '' : 'border-bottom:1px solid #ebebeb;']">
<div class="select-box s-w-50">
<div class="dis-f" :class="{ 'al-item housing-pd': routePath === '/needHousing' }">
<div class="tab-title">{{ routePath === '/needHousing' ? '目标区域' : '地理位置' }}</div>
<div class="dis-f" :class="{ 'al-item housing-pd': routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6' }">
<div class="tab-title">{{ routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6' ? '目标区域' : '地理位置' }}</div>
<!-- 中介/个人房源页面 -->
<div class="tab-text" v-if="routePath !== '/needHousing'">
<div class="tab-text" v-if="routePath !== '/needHousing'&&(routeQuery.data && routeQuery.data.houseingPageType !== '6')">
<div class="dis-f">
<div class="btn jus-x al-item dis-f" :class="{ 'btn-check': selectPosition === 'region' }"
@click="setSelectPosition('region')">按区域</div>
@ -20,10 +20,10 @@
<div class="dis-f al-item">{{ item.name }} <div class="dis-f al-item"
v-show="selectTabCheck.id === item.id && selectTabCheck.id">&nbsp>&nbsp
<div
:class="{ 'check-data': selectData.data && selectData.data.length > 0 && selectData.data.length !== selectTabCheck.data.length }">
:class="{ 'check-data': selectData.data && selectData.data.length > 0 && selectData.data.length !== selectTabCheck.data.length&&selectData.data[0].id }">
{{
selectData.data && selectData.data.length ===
0 || selectData.data.length === selectTabCheck.data.length ? '不限' :
0||selectData.data&&selectData.data[0]&&!selectData.data[0].id || selectData.data.length === selectTabCheck.data.length ? '不限' :
selectData.data && selectData.data.length
}}
</div>
@ -66,7 +66,7 @@
</div>
</div>
<!-- 求房源 -->
<div class="need-housing-box dis-f al-item" v-if="routePath === '/needHousing'">
<div class="need-housing-box dis-f al-item" v-if="routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6'">
<div class="select-tab-info" style="margin-top:0;">
<div class="housing-info-box info-box" v-show="selectPosition === 'region'"
style="position: relative;padding: 0;height:30px;width: 420px;">
@ -99,8 +99,8 @@
</div>
</div>
<div class="bor-b-das"></div>
<div class="dis-f pad-t-b-15" :class="{ 'housing-pd pd-t-25': routePath === '/needHousing' }">
<div class="tab-title">{{ routePath === '/needHousing' ? '求租方式' : '出租方式' }}</div>
<div class="dis-f pad-t-b-15" :class="{ 'housing-pd pd-t-25': routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6' }">
<div class="tab-title">{{ routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6' ? '求租方式' : '出租方式' }}</div>
<div class="tab-text dis-f al-item" style="padding-bottom:0;">
<div class="dis-f" v-for="(item, i) in hireTypeArr" :key="i">
<div v-if="item.title !== '不限'">
@ -134,7 +134,7 @@
</div>
<div class="bor-b-das"></div>
<div class="dis-f al-item" style="padding:30px 0;">
<div class="tab-title">{{ routePath === '/needHousing' ? '租金预算' : '租金' }}</div>
<div class="tab-title">{{ routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6' ? '租金预算' : '租金' }}</div>
<div class="dis-f al-item rent-box jus-bet">
<div class="dis-f al-item">
<input type="text" class="input" v-model="rentObj.min" @blur="setRent">
@ -166,7 +166,7 @@
</div>
<div class="bor-b-das"></div>
<div class="dis-f pd-t-20">
<div class="tab-title">{{ routePath === '/needHousing' ? '求租者性别' : '性别' }}</div>
<div class="tab-title">{{ routePath === '/needHousing'||routeQuery.data && routeQuery.data.houseingPageType === '6' ? '求租者性别' : '性别' }}</div>
<div class="select-btn-box">
<div class="dis-f">
<div class="btn jus-x al-item dis-f" v-for="(item, i) in genderData" :key="i"
@ -264,10 +264,14 @@ const { proxy } = getCurrentInstance()
const props = defineProps({
setSeachCondition: {
type: Function
},
setLocation:{
type:Function
}
})
let setSeachCondition = props.setSeachCondition
let setLocation = props.setLocation//设置一级区域
//最新发布选项
let listSort = shallowReactive({
@ -386,9 +390,10 @@ let setSelectData = (id, data = [], title) => {
selectTabCheck.id = id;
selectTabCheck.title = title
selectTabCheck.data = data;
selectData.data = []
selectData.data = [{ title: '不限', id: '' }]
schoolSelectObj.id = ''
schoolSelectObj.title = ''
setLocation('location',[selectTabCheck.id + ''])
if (id === '') {
setSeachCondition('location', [])
}
@ -666,6 +671,7 @@ let routerQuerySet = () => {
selectTabCheck.title = deconstructionSeachData.areaItem.name;
selectTabCheck.data = deconstructionSeachData.areaItem.data;
selectData.data = seachAreaId(deconstructionSeachData.selectData)
if(selectData.data.length===0)selectData.data = [{ title: '不限', id: '' }]
if (deconstructionSeachData.cotenancy) {
let type = deconstructionSeachData.cotenancyData.id.toString().substring(0, 1)