diff --git a/components/DropDown/DropDown.vue b/components/DropDown/DropDown.vue index 924d899..295bcc7 100644 --- a/components/DropDown/DropDown.vue +++ b/components/DropDown/DropDown.vue @@ -15,8 +15,8 @@ - + @@ -35,6 +35,8 @@ return { title: ['行业', '区域', '面积', '筛选'], activeIndex: -1, + // 是否显示下拉框 + isShow: false, postlist: [ [], [], @@ -47,19 +49,30 @@ areatype: '', business: '' }, - // 当前行业下拉列表 - currentClassList: 0, - // 当前区域下拉列表 - currentRegionList: 0, - // 当前面积下拉列表 - currentAreaList: 0, - // 当前筛选下拉列表 - currentFilterList: 0, + // 当前选中的行业下拉列表项 + currentClassActive: 0, + // 当前选中的区域下拉列表项 + currentRegionActive: 0, + // 当前选中的面积下拉列表项 + currentAreaActive: 0, + // 当前选中的筛选下拉列表项 + currentFilterActive: 0, }; }, computed: { tablist: function() { return this.postlist[this.activeIndex] + }, + setActiveTag: function(){ + if(this.activeIndex == 0){ + return this.currentClassActive + }else if(this.activeIndex == 1){ + return this.currentRegionActive + }else if(this.activeIndex == 2){ + return this.currentAreaActive + }else if(this.activeIndex == 3){ + return this.currentFilterActive + } } }, created() { @@ -70,6 +83,11 @@ // this.postlist[2].unshift('所有面积') // this.postlist[3].unshift('全部') }, + watch: { + setActiveTag (reset){ + + } + }, methods: { changeActiveIndex(index) { if (this.activeIndex === index) { @@ -80,49 +98,54 @@ cancelDrop() { this.activeIndex = -1; }, + cancelPageNum(){ + this.$emit('cancelPageNum') + }, getQueryInfo(querys) { - + console.log(querys, 'getquerysinfo'); // 修改当前选择的各选项卡下标 - if (this.activeIndex === 0) { - this.currentClassList = querys.business - }else if (this.activeIndex === 1) { - this.currentRegionList = querys.region - }else if (this.activeIndex === 2) { - this.currentAreaList = querys.areatype - }else if (this.activeIndex === 3) { - this.currentFilterList = querys.sortType - } - // 记忆各下拉框数据 - if(querys.business==0){ - querys.business = '' - }else{ - querys.business = this.postlist[0][this.currentClassList] - } - if(querys.region==0){ - querys.region = '' - }else querys.region = this.postlist[1][this.currentRegionList] - + if (this.activeIndex === 0) { + this.currentClassActive = querys.business + }else if (this.activeIndex === 1) { + this.currentRegionActive = querys.region + }else if (this.activeIndex === 2) { + this.currentAreaActive = querys.areatype + }else if (this.activeIndex === 3) { + this.currentFilterActive = querys.sortType + } + // 特殊处理行业、区域 + if(querys.business){ + querys.business = this.tablist[this.currentClassActive] + } + if(querys.region){ + querys.region = this.tablist[this.currentRegionActive] + } + this.queryInfo = { ...this.queryInfo, ...querys } const query = this.$u.queryParams(this.queryInfo) - console.log(query, 'dropquery'); + console.log(querys, 'dropquery'); this.$emit('getQueryInfo', this.queryInfo) }, - setActiveTag(){ - if(this.activeIndex == 0){ - return this.currentClassList - }else if(this.activeIndex == 1){ - return this.currentRegionList - }else if(this.activeIndex == 2){ - return this.currentAreaList - }else{ - return this.currentFilterList + resetInfo(){ + console.log("重置了Dropdown"); + this.queryInfo = { + region: '', + sortType: '', + areatype: '', + business: '' } + this.currentClassActive = 0 + this.currentRegionActive = 0 + this.currentAreaActive = 0 + this.currentFilterActive = 0 + // 重置各下拉框保存的数据 + this.$refs.dropdownitem.resetQueryInfo() } } } diff --git a/components/DropDown/DropDownItem.vue b/components/DropDown/DropDownItem.vue index 9bf56eb..b629bc8 100644 --- a/components/DropDown/DropDownItem.vue +++ b/components/DropDown/DropDownItem.vue @@ -3,7 +3,7 @@ - {{item}} @@ -22,10 +22,15 @@ } }, type: { - type: String, default () { return '' } + }, + activeChoose: { + type: Number, + default () { + return 0 + } } }, data() { @@ -40,87 +45,75 @@ }, sendQueryInfo() { console.log(this.queryInfo); + console.log(this.type); + console.log(this.activeIndex); + if (this.type === '行业') { - + if(this.list[this.activeIndex] == '全部'){ + this.queryInfo = { + business: '' + } + }else{ this.queryInfo = { business: this.activeIndex } + } - - } - if (this.type === '区域') { - + } else if (this.type === '区域') { + if(this.list[this.activeIndex] == '全区域'){ + this.queryInfo = { + region: '' + } + }else{ this.queryInfo = { region: this.activeIndex } - - } - if (this.type === '面积') { - + } + } else if (this.type === '面积') { + if(this.list[this.activeIndex] == '任意面积'){ + this.queryInfo = { + areatype: '' + } + }else { this.queryInfo = { areatype: this.activeIndex } + } - - } - if (this.type === '筛选') { - + } else if (this.type === '筛选') { + if(this.list[this.activeIndex] == '全部'){ + this.queryInfo = { + sortType: '' + } + }else{ this.queryInfo = { sortType: this.activeIndex } - + } } - // if (this.type === '行业') { - // if(this.list[this.activeIndex] == '全部'){ - // this.queryInfo = { - // business: '' - // } - // }else{ - // this.queryInfo = { - // business: this.activeIndex - // } - // } - - // } else if (this.type === '区域') { - // if(this.list[this.activeIndex] == '全区域'){ - // this.queryInfo = { - // region: '' - // } - // }else{ - // this.queryInfo = { - // region: this.activeIndex - // } - // } - // } else if (this.type === '面积') { - // if(this.list[this.activeIndex] == '任意面积'){ - // this.queryInfo = { - // areatype: '' - // } - // }else { - // this.queryInfo = { - // areatype: this.activeIndex - // } - // } - - // } else if (this.type === '筛选') { - // if(this.list[this.activeIndex] == '全部'){ - // this.queryInfo = { - // sortType: '' - // } - // }else{ - // this.queryInfo = { - // sortType: this.activeIndex - // } - // } - - // } // 发送queryInfo console.log(this.queryInfo, 'sendqueryInfo'); this.$emit('getQueryInfo', this.queryInfo); }, + resetQueryInfo(){ + console.log("重置了DropdownItem"); + this.currentClassActive = 0 + this.currentRegionActive = 0 + this.currentAreaActive = 0 + this.currentFilterActive = 0 + this.activeIndex = 0 + this.queryInfo = { + region: '', + sortType: '', + areatype: '', + business: '' + } + }, async handleActive(index) { this.activeIndex = index; + // 取消当前页面的pageNum参数 + this.$emit('cancelPageNum'); this.sendQueryInfo(); // 设置一个定时器，等待200毫秒 const delayPromise = this.delay(200); diff --git a/components/ShowShopList/ShowShopList.vue b/components/ShowShopList/ShowShopList.vue index 79e5b01..483d7cc 100644 --- a/components/ShowShopList/ShowShopList.vue +++ b/components/ShowShopList/ShowShopList.vue @@ -1,6 +1,6 @@