From fee01ae875ec383b54535077956277909dd9c7db Mon Sep 17 00:00:00 2001 From: lixuan Date: Thu, 1 Dec 2022 16:06:58 +0800 Subject: [PATCH 1/2] xiugai --- components/sl-filter/filter-view.vue | 16 ++++++++++++---- pages/tabbar/station/stationList.vue | 7 ++++++- 2 files changed, 18 insertions(+), 5 deletions(-) diff --git a/components/sl-filter/filter-view.vue b/components/sl-filter/filter-view.vue index d611d32..13d6fcb 100644 --- a/components/sl-filter/filter-view.vue +++ b/components/sl-filter/filter-view.vue @@ -3,21 +3,27 @@ - + + {{item.detailTitle}} + + + {{detailItem.title}} + + @@ -81,6 +87,7 @@ result: {}, menuIndex: 0, selectDetailList: [], + selectDetailLists: [], independenceObj: {}, selectedKey: '', cacheSelectedObj: {}, @@ -347,6 +354,7 @@ console.log('展开') this.menuIndex = index; this.selectDetailList = this.menuList[index].detailList; + this.selectDetailLists = this.menuList[index].detailLists; this.selectedKey = this.menuList[index].key; // 如果是独立菜单 if (this.independence && !this.menuList[index].isSort) { @@ -475,7 +483,6 @@ }, resetSelected(list, key) { console.log('%c 重置方法第二步resetSelected函数参数↓','color:green;font-size:30px') - console.log(list, key) if (typeof this.result[key] == 'object') { this.result[key] = []; this.selectedTitleObj[key] = list[0].title; @@ -490,6 +497,7 @@ list[i].isSelected = false; } } + console.log(this.result) // #ifdef H5 this.$forceUpdate(); // #endif diff --git a/pages/tabbar/station/stationList.vue b/pages/tabbar/station/stationList.vue index 039d0e9..3b5d6b3 100644 --- a/pages/tabbar/station/stationList.vue +++ b/pages/tabbar/station/stationList.vue @@ -131,6 +131,10 @@ key: 'siteBrand', isSort: true, isMutiple: false, + detailLists:[{ + title: "全部", + value: "" + }], detailList: [{ title: "全部", value: "" @@ -379,7 +383,8 @@ this.productCodeList = uni.getStorageSync('productCodeList') // console.log(this.productCodeList,'新的列表格式') res.data.channelCodes.map(item => { - this.menuList[1].detailList.push({ + // this.menuList[1].detailList.push({ + this.menuList[3].detailLists.push({ title: item.name, value: item.id }) From 386045339f3a71b42b23132ad7821433761a7f62 Mon Sep 17 00:00:00 2001 From: lixuan Date: Tue, 6 Dec 2022 18:12:13 +0800 Subject: [PATCH 2/2] xiugai --- api/account.js | 8 + components/sl-filter/filter-view.vue | 236 +++++++++++++++++++++++---- components/sl-filter/sl-filter.vue | 10 ++ pages/tabbar/station/stationList.vue | 43 +++-- 4 files changed, 256 insertions(+), 41 deletions(-) diff --git a/api/account.js b/api/account.js index 2a5f2b5..7801703 100644 --- a/api/account.js +++ b/api/account.js @@ -10,6 +10,14 @@ export default { data:data }) }, + //查询不可用油卡 + getSyncDeductions (data) { + return request({ + url: `/oil-dict/areaCode/getSyncDeductions`, + method: 'post', + data:data + }) + }, //获取用户油卡账户信息 （个人 / 自营 / 外请） getUserAccount (data) { return request({ diff --git a/components/sl-filter/filter-view.vue b/components/sl-filter/filter-view.vue index d6f01ad..e16553c 100644 --- a/components/sl-filter/filter-view.vue +++ b/components/sl-filter/filter-view.vue @@ -18,15 +18,17 @@ + 渠道 + @tap="itemTaps(idx,selectDetailLists,item.isMutiple,'channelCode',detailItem)"> {{detailItem.title}} + 品牌 + @tap="itemTap(idx,selectDetailList,item.isMutiple,item.key,detailItem,index)"> {{detailItem.title}} @@ -40,9 +42,9 @@ - + - + @@ -64,10 +66,10 @@ - + 重置 - + 确定 @@ -97,7 +99,12 @@ areaIndex:[0, 0, 0], provinceCode:'', cityCode:'', - areaCode:'' + areaCode:'', + region:[], + paixu:1, + oilCode:'0#', + showHide:true, + pickerShow:false, }; }, props: { @@ -187,7 +194,7 @@ }, methods: { //选择值改变事件 省市区级联选择 - bindChange(e) { + bindChange(e,ccc) { // 用于对比滑动的是哪一列数据 const val = e.detail.value this.areaIndex = val @@ -204,20 +211,19 @@ } else { this.areaIndex = e.detail.value; } - - // 数组push‘全部’ - if(this.areaCodeList[val[0]].childList[0].areaName != '全部'){ - this.areaCodeList[val[0]].childList.unshift({areaName:'全部'}) - } - if(this.areaCodeList[val[0]].childList[val[1]].childList[0].areaName != '全部'){ - this.areaCodeList[val[0]].childList[val[1]].childList.unshift({areaName:'全部'}) - } - console.log(this.areaCodeList,'99999999999999999') - console.log(this.areaCodeList[this.areaIndex[0]],this.areaCodeList[this.areaIndex[0]].childList,this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList,'打印圣兽下标') - console.log(this.areaCodeList[this.areaIndex[0]].areaName + this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].areaName + this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this.areaIndex[2]].areaName) - this.provinceCode = this.areaCodeList[this.areaIndex[0]].id - this.cityCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].id - this.areaCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this.areaIndex[2]].id + if(!ccc){ + // 数组push‘全部’ + if(this.areaCodeList[val[0]].childList[0].areaName != '全部'){ + this.areaCodeList[val[0]].childList.unshift({areaName:'全部'}) + } + if(this.areaCodeList[val[0]].childList[val[1]].childList[0].areaName != '全部'){ + this.areaCodeList[val[0]].childList[val[1]].childList.unshift({areaName:'全部'}) + } + this.provinceCode = this.areaCodeList[this.areaIndex[0]].id + this.cityCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].id + this.areaCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this.areaIndex[2]].id + } + this.$emit('changeArea',e) }, @@ -228,6 +234,7 @@ }else{ this.seleIdex = e + '/'+ w + '/' + j } + this.oilCode = this.seleIdex }, setingFn(){ if(this.productCodeList){ @@ -244,12 +251,15 @@ if (item.isMutiple) { obj[item.key] = []; item.detailList[0].isSelected = false; + item.detailLists[0].isSelected = false; if (!Array.isArray(item.defaultSelectedIndex)) { // 如果默认值不是数组 item.defaultSelectedIndex = [item.defaultSelectedIndex]; } for (let j = 0; j < item.defaultSelectedIndex.length; j++) { // 将默认选中的值放入selectedObj item.detailList[item.defaultSelectedIndex[j]].isSelected = true; obj[item.key].push(item.detailList[item.defaultSelectedIndex[j]].value) + item.detailLists[item.defaultSelectedIndex[j]].isSelected = true; + obj[item.key].push(item.detailLists[item.defaultSelectedIndex[j]].value) } } else { @@ -258,6 +268,11 @@ this.defaultSelectedTitleObj[item.key] = item.detailList[item.defaultSelectedIndex].title; item.detailList[0].isSelected = false; item.detailList[item.defaultSelectedIndex].isSelected = true; + obj[item.key] = item.detailLists[item.defaultSelectedIndex].value; + this.selectedTitleObj[item.key] = item.detailLists[item.defaultSelectedIndex].title; + this.defaultSelectedTitleObj[item.key] = item.detailLists[item.defaultSelectedIndex].title; + item.detailLists[0].isSelected = false; + item.detailLists[item.defaultSelectedIndex].isSelected = true; } } else { if (item.isMutiple) { @@ -297,11 +312,15 @@ if (this.selectDetailList[this.menuList[i].defaultSelectedIndex[j]].isSelected == false) { this.itemTap(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this .menuList[i].key) + this.itemTaps(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this + .menuList[i].key) } } } else { this.itemTap(this.menuList[i].defaultSelectedIndex, this.selectDetailList, this.menuList[i].isMutiple, this.menuList[ i].key) + this.itemTaps(this.menuList[i].defaultSelectedIndex, this.selectDetailList, this.menuList[i].isMutiple, this.menuList[ + i].key) } // 获取非默认项的下标 @@ -311,6 +330,8 @@ if (this.selectDetailList[unDefaultSelectedIndexArr[j]].isSelected == true) { this.itemTap(unDefaultSelectedIndexArr[j], this.selectDetailList, this.menuList[i].isMutiple, this .menuList[i].key) + this.itemTaps(unDefaultSelectedIndexArr[j], this.selectDetailList, this.menuList[i].isMutiple, this + .menuList[i].key) } } } @@ -351,7 +372,7 @@ this.$emit('update:menuList', val) }, menuTabClick(index) { - console.log('展开') + console.log(this.menuList,'展开') this.menuIndex = index; this.selectDetailList = this.menuList[index].detailList; this.selectDetailLists = this.menuList[index].detailLists; @@ -383,6 +404,7 @@ for (let i = 0; i < idx.length; i++) { if (this.menuList[index].detailList[idx[i]].isSelected == false) { this.itemTap(idx[i], this.menuList[index].detailList, true, this.selectedKey); + this.itemTaps(idx[i], this.menuList[index].detailList, true, this.selectedKey); } } @@ -390,6 +412,7 @@ if (this.menuList[index].detailList[idx].isSelected == false) { this.itemTap(idx, this.menuList[index].detailList, false, this.selectedKey); + this.itemTaps(idx, this.menuList[index].detailList, false, this.selectedKey); } } @@ -412,7 +435,7 @@ } }, //图标点击方法 - itemTap(index, list, isMutiple, key, detailItem) { + itemTap(index, list, isMutiple, key, detailItem,indexs) { //是否多选 if (isMutiple == true) { list[index].isSelected = !list[index].isSelected; @@ -474,14 +497,104 @@ } } } + if(indexs==1){ + if(detailItem.value==10){ + this.detailItems = '' + this.pickerShow = true + }else{ + this.detailItems = detailItem.value + this.provinceCode = '' + this.cityCode = '' + this.areaCode = '' + this.pickerShow = false + this.region = [] + } + }else{ + this.pickerShow = false + } + if(indexs==2){ + this.oilCode = detailItem.value + } + if(indexs==0){ + this.paixu = detailItem.value=='juli'?1:2 + } + console.log(index, list, isMutiple, key, detailItem,indexs,'打印打印打印') + // this.detailItems = detailItem.value*1000 + } + // #ifdef H5 + this.$forceUpdate(); + // #endif + }, + //图标点击方法 + itemTaps(index, list, isMutiple, key, detailItem,indexs) { + //是否多选 + if (isMutiple == true) { + list[index].isSelected = !list[index].isSelected; + if (index == 0) { + this.resetSelected(list, key) + if (!this.independence) { + this.selectedTitleObj[key] = list[index].title; + } + } else { + list[0].isSelected = false + if (list[index].isSelected) { + if (this.independence) { + this.independenceObj[this.selectedKey].push(list[index].value); + } else { + this.selectedObj[key].push(list[index].value); + } + } else { + list[index].isSelected = false; + if (this.independence) { + var idx = this.independenceObj[this.selectedKey].indexOf(list[index].value); + this.independenceObj[this.selectedKey].splice(idx, 1); + } else { + var idx = this.selectedObj[key].indexOf(list[index].value); + this.selectedObj[key].splice(idx, 1); + } + + } + if (this.independence) { + this.result = this.independenceObj; + } else { + this.result = this.selectedObj; + } + + } + } else { + //判断是否是第一个 + if (index == 0) { + this.resetSelected(list, key) + if (!this.independence) { + this.selectedTitleObj[key] = list[index].title; + } + } else { + //列表第一个为false + list[0].isSelected = false + if (this.independence) { + this.independenceObj[this.selectedKey] = list[index].value; + this.result = this.independenceObj; + } else { + this.selectedObj[key] = list[index].value; + this.result = this.selectedObj; + this.selectedTitleObj[key] = list[index].title; + } + + for (let i = 0; i < list.length; i++) { + if (index == i) { + list[i].isSelected = true + } else { + list[i].isSelected = false + } + } + } console.log(index, list, isMutiple, key, detailItem,'打印打印打印') - this.detailItems = detailItem.value*1000 } // #ifdef H5 this.$forceUpdate(); // #endif }, - resetSelected(list, key) { + resetSelected(list, key,lists, keys) { console.log('%c 重置方法第二步resetSelected函数参数↓','color:green;font-size:30px') if (typeof this.result[key] == 'object') { this.result[key] = []; @@ -498,6 +611,23 @@ list[i].isSelected = false; } } + if(key=='siteBrand'){ + if (typeof this.result[keys] == 'object') { + this.result[keys] = []; + this.selectedTitleObj[keys] = lists[0].title; + } else { + this.result[keys] = ''; + this.selectedTitleObj[key] = lists[0].title; + console.log(this.result,'重置之后的数据') + } + for (let i = 0; i < lists.length; i++) { + if (i == 0) { + lists[i].isSelected = true; + } else { + lists[i].isSelected = false; + } + } + } console.log(this.result) // #ifdef H5 this.$forceUpdate(); @@ -528,7 +658,23 @@ this.$emit("confirm", obj); }, //点击 确定方法 - sureClick() { + sureClick(selectDetailList,item,index) { + console.log(index,this.oilCode,this.paixu,'5555555555555') + if(index == 2&&!this.oilCode){ + this.menuList[0].detailList[0].isSelected = true + this.menuList[0].detailList[1].isSelected = false + this.paixu = 1 + this.selectedTitleObj['sort'] = '距离排序' + } + if(index == 0&&!this.oilCode&&this.paixu==2){ + uni.showToast({ + title: '请先选择油品再价格排序', + icon: 'none' + }) + this.itemTap(0, selectDetailList, false, item,selectDetailList[1],index) + this.paixu = 1 + return + } if(this.areaIndex[0] == 0){ this.provinceCode = '' this.cityCode = '' @@ -549,6 +695,9 @@ obj.result.provinceCode = this.provinceCode obj.result.cityCode = this.cityCode obj.result.areaCode = this.areaCode + obj.result.distance = this.provinceCode?'':this.cityCode?'':this.areaCode?'':this.detailItems + obj.result.sort = this.paixu==1?'juli':'price' + obj.result.oilProductCode = this.oilCode // obj.result.distance = this.detailItems console.log(obj,'look me!') // console.log(this.seleIdex.split('/'),this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]],this.seleIdex.split('/')[2],'dddddddddddddddddd') @@ -562,7 +711,7 @@ } this.$emit("confirm", obj); }, - resetClick(list, key) { + resetClick(list, key,lists,keys,index) { console.log('%c 重置方法第一步resetClick函数参数↓','color:red;font-size:30px') console.log(list, key) if(this.seleIdex!==null&&this.seleIdex.split('/')[2]==2){ @@ -570,14 +719,36 @@ this.pseleFn() // console.log(obj,'look me!2') // this.$emit("confirm", obj); - return } if(key == 'channelCode'){ this.provinceCode = '' this.cityCode = '' this.areaCode = '' } - this.resetSelected(list, key) + this.resetSelected(list, key,lists,keys) + if(index == 2){ + this.oilCode = '' + this.paixu = 1 + console.log(this.oilCode,index,'9999999999999999') + } + if(index == 1){ + this.provinceCode = '' + this.cityCode = '' + this.areaCode = '' + this.detailItems = '' + this.region = [] + this.pickerShow = false + let aaa = { + detail:{ + value:[0,0] + } + } + let ccc = 1 + this.bindChange(aaa,ccc) + } + if(index == 0){ + this.paixu = 1 + } } } } @@ -741,4 +912,9 @@ height: 600upx; } } +.zdyTitle{ + font-weight: 600; + margin: 10px 10px 0; + display: block; + } \ No newline at end of file diff --git a/components/sl-filter/sl-filter.vue b/components/sl-filter/sl-filter.vue index f7073ac..975e9d1 100644 --- a/components/sl-filter/sl-filter.vue +++ b/components/sl-filter/sl-filter.vue @@ -201,6 +201,16 @@ d_item.isSelected = false } } + if(item.detailLists){ + for (let j = 0; j < item.detailLists.length; j++) { + let d_item = item.detailLists[j]; + if (j == 0) { + d_item.isSelected = true + } else { + d_item.isSelected = false + } + } + } } return arr; }, diff --git a/pages/tabbar/station/stationList.vue b/pages/tabbar/station/stationList.vue index d49e6f1..ca02449 100644 --- a/pages/tabbar/station/stationList.vue +++ b/pages/tabbar/station/stationList.vue @@ -87,7 +87,22 @@ ureaFilterDatas:[], loadStatus: 'load', siteName: '', - menuList: [{ + menuList: [ + { + title: '距离排序', + isMutiple: false, + key: 'sort', + detailList: [{ + title: "距离排序", + value: 'juli' + }, + { + title: "价格排序", + value: 'price' + } + ] + }, + { title: '距离', isMutiple: false, key: 'distance', @@ -106,17 +121,22 @@ { title: "50Km", value: 50000 + }, + { + title: "省市", + value: 10 } ] - },{ - title: '渠道', - isMutiple: false, - key: 'channelCode', - detailList: [{ - title: "全部", - value: "" - }] }, + // { + // title: '渠道', + // isMutiple: false, + // key: 'channelCode', + // detailList: [{ + // title: "全部", + // value: "" + // }] + // }, { title: '0#轻柴油', key: 'oilProductCode', @@ -423,7 +443,7 @@ value: 'E' }, ] - this.oliMenuList[3].detailList = data + // this.oliMenuList[3].detailList = data // // console.log(channelCodes, productCodes, siteBrands) // this.$refs.slFilter.resetMenuList(this.menuList) } @@ -483,7 +503,7 @@ currentPage: this.currentPage, pageSize: 10, params: { //类型：Object 必有字段 备注：// 筛选对象 - sort: "juli", //类型：String 必有字段 备注：// 智能排序 ( price：价格最低 juli：距离最近 ) 默认距离排序 + // sort: "juli", //类型：String 必有字段 备注：// 智能排序 ( price：价格最低 juli：距离最近 ) 默认距离排序 siteName: this.siteName, ...uni.getStorageSync('location'), // ...this.filterData @@ -499,6 +519,7 @@ // siteLevel: this.siteName ? '' : this.filterDatas siteLevel: this.filterDatas .siteLevel , + sort:this.filterDatas.sort?this.filterDatas.sort:'juli', provinceCode:this.filterDatas.provinceCode, cityCode:this.filterDatas.cityCode, areaCode:this.filterDatas.areaCode,