From 0b96f27a9974102e9c4ee55ef369878dc3ebdc4f Mon Sep 17 00:00:00 2001 From: xiaozhiyong Date: Tue, 16 May 2023 15:45:36 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/sl-filter/filter-view.vue | 482 +++++++++++++++------------ components/sl-filter/sl-filter.vue | 10 + pages/tabbar/station/stationList.vue | 4 +- utils/request.js | 4 +- 4 files changed, 284 insertions(+), 216 deletions(-) diff --git a/components/sl-filter/filter-view.vue b/components/sl-filter/filter-view.vue index 574e983..09fad3d 100644 --- a/components/sl-filter/filter-view.vue +++ b/components/sl-filter/filter-view.vue @@ -16,71 +16,86 @@ {{item.detailTitle}} - - - 渠道 - - - {{detailItem.title}} - + + + 渠道 + + + {{detailItem.title}} + + + 品牌 + + + {{detailItem.title}} + + + + {{p}} + + {{z}} + + + + + + + + + + + + + + {{ JSON.stringify(item.areaName) }} + {{item.areaName}} - 品牌 - - - {{detailItem.title}} - + + + + {{ JSON.stringify(item.areaName) }} + {{ item.areaName }} - - {{p}} - - {{z}} - + + + + {{ JSON.stringify(item.areaName) }} + {{ item.areaName }} - - - + + - - - - - - - - {{ JSON.stringify(item.areaName) }} - {{item.areaName}} - - - - - {{ JSON.stringify(item.areaName) }} - {{ item.areaName }} - - - - - {{ JSON.stringify(item.areaName) }} - {{ item.areaName }} - - - - + + + + 重置 - - - 重置 - - - 确定 - + + 确定 + @@ -88,7 +103,7 @@ export default { data() { return { - productCodeLable:null, + productCodeLable: null, selectArr: [], result: {}, menuIndex: 0, @@ -98,17 +113,17 @@ selectedKey: '', cacheSelectedObj: {}, defaultSelectedTitleObj: {}, - seleIdex:null, - areaCodeList:[], - areaIndex:[0, 0, 0], - provinceCode:'', - cityCode:'', - areaCode:'', - region:[], - paixu:1, - oilCode:'0#', - showHide:true, - pickerShow:false, + seleIdex: null, + areaCodeList: [], + areaIndex: [0, 0, 0], + provinceCode: '', + cityCode: '', + areaCode: '', + region: [], + paixu: 1, + oilCode: '0#', + showHide: true, + pickerShow: false, }; }, props: { @@ -141,28 +156,49 @@ default: false } }, - watch:{ - productCodeList:function(n,o){ - console.log('%c 打印的新的列表格式箭头↓zxxxx','color:red;font-size:32px') + watch: { + productCodeList: function(n, o) { + // console.log('%c 打印的新的列表格式箭头↓zxxxx','color:red;font-size:32px') this.setingFn() - console.log(this.productCodeList,this.menuList,'9999999999999') + // console.log(this.productCodeList,this.menuList,'9999999999999') }, - selectDetailList:function(n,o){ - console.log('%c 元数组切换↓1','font-size:50px;color:blue') - console.log(this.menuIndex) + selectDetailList: function(n, o) { + // console.log('%c 元数组切换↓1','font-size:50px;color:blue') + // console.log(this.menuIndex) } - + }, created() { /* * @property {Object} productCodeList: 传入的新列表格式 * @property {Array} productCodeLable: 传入的新列表格式的列表标题 * @property {Function} setingFn: 调用微信接口获取code 通过code调用服务端接口换取请求头数据 - */ - // console.log(this.menuList,'打印列表列表') + */ + // console.log(this.menuList,'打印列表列表') this.setingFn() - this.areaCodeList = uni.getStorageSync('areaCodeList') - this.areaCodeList.unshift({areaName:'全部',childList:[{areaName:'',childList:[{areaName:''}]}]}) + this.areaCodeList = uni.getStorageSync('areaCodeList') || [] + this.areaCodeList.unshift({ + areaName: '全部', + childList: [{ + areaName: '', + childList: [{ + areaName: '' + }] + }] + }) + if (this.areaCodeList.length === 1) { + let instance = setInterval(() => { + // console.log('执行一次') + if (this.areaCodeList1.length) { + clearInterval(instance) + this.areaCodeList = [...this.areaCodeList, ...this.areaCodeList1] + } + }, 2000) + } + // setTimeout(() => { + + // },3000) + // setTimeout(()=>{ // if(this.areaCodeList1.length<1){ // this.areaCodeList = uni.getStorageSync('areaCodeList') @@ -199,17 +235,17 @@ }, methods: { //选择值改变事件 省市区级联选择 - bindChange(e,ccc) { + bindChange(e, ccc) { // 用于对比滑动的是哪一列数据 const val = e.detail.value this.areaIndex = val this.region = val - console.log(this.areaIndex,val,'省市区下标') - if(this.areaIndex[0] !== val[0]) { + console.log(this.areaIndex, val, '省市区下标') + if (this.areaIndex[0] !== val[0]) { // 如果滑动的是第一列数据，让二三列恢复到0 this.areaIndex = [val[0], 0, 0] // console.log(this.areaCodeList[val[0]].childList[0].areaName,'打印是否[全部]') - } else if(this.areaIndex[1] !== val[1]) { + } else if (this.areaIndex[1] !== val[1]) { this.areaIndex[1] = val[1] // 滑动的是第二列数据 this.areaIndex = [val[0], val[1], 0] @@ -217,41 +253,46 @@ } else { this.areaIndex = e.detail.value; } - if(!ccc){ + if (!ccc) { // 数组push‘全部’ - if(val[0] != 0) { - if(this.areaCodeList[val[0]].childList[0].areaName != '全部'){ - this.areaCodeList[val[0]].childList.unshift({areaName:'全部'}) + if (val[0] != 0) { + if (this.areaCodeList[val[0]].childList[0].areaName != '全部') { + this.areaCodeList[val[0]].childList.unshift({ + areaName: '全部' + }) } - if(this.areaIndex[1]!=0){ - if(this.areaCodeList[val[0]].childList[val[1]].childList[0].areaName != '全部'){ - this.areaCodeList[val[0]].childList[val[1]].childList.unshift({areaName:'全部'}) + if (this.areaIndex[1] != 0) { + 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 - }else { - this.provinceCode = this.cityCode =this.areaCode = '' - this.areaIndex = [0,0,0] + this.areaCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this + .areaIndex[2]].id + } else { + this.provinceCode = this.cityCode = this.areaCode = '' + this.areaIndex = [0, 0, 0] } - } - - this.$emit('changeArea',e) + } + + this.$emit('changeArea', e) }, - - - pseleFn(e,w,j){ - if(arguments.length<3){ - this.seleIdex = '#' + '/'+ '柴油' + '/' + this.menuIndex - }else{ - this.seleIdex = e + '/'+ w + '/' + j + + + pseleFn(e, w, j) { + if (arguments.length < 3) { + this.seleIdex = '#' + '/' + '柴油' + '/' + this.menuIndex + } else { + this.seleIdex = e + '/' + w + '/' + j } // this.oilCode = this.seleIdex // console.log(e,w,j,'aaaaaaaaaaaaaaaaa') }, - setingFn(){ - if(this.productCodeList){ + setingFn() { + if (this.productCodeList) { this.productCodeLable = Object.keys(this.productCodeList) } // console.log(this.productCodeLable,'ddddddddddddddddddd') @@ -260,7 +301,8 @@ let obj = {} for (let i = 0; i < this.menuList.length; i++) { let item = this.menuList[i]; - if (!this.independence && item.defaultSelectedIndex != null && item.defaultSelectedIndex.toString().length > 0) { // 处理并列菜单默认值 + if (!this.independence && item.defaultSelectedIndex != null && item.defaultSelectedIndex.toString() + .length > 0) { // 处理并列菜单默认值 if (item.isMutiple) { obj[item.key] = []; @@ -303,7 +345,7 @@ resetAllSelect(callback) { let titles = []; for (let i = 0; i < this.menuList.length; i++) { - this.resetSelected(this.menuList[i].detailList,this.menuList[i].key); + this.resetSelected(this.menuList[i].detailList, this.menuList[i].key); titles[this.menuList[i].key] = this.menuList[i].title; } // console.log(titles,'*************************') @@ -324,16 +366,20 @@ if (Array.isArray(this.menuList[i].defaultSelectedIndex)) { // 把所有默认的为false的点为true for (let j = 0; j < this.menuList[i].defaultSelectedIndex.length; j++) { if (this.selectDetailList[this.menuList[i].defaultSelectedIndex[j]].isSelected == false) { - this.itemTap(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this + 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) - 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[ + 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) } @@ -342,10 +388,12 @@ // 把所有不是默认的为true的点为false for (let j = 0; j < unDefaultSelectedIndexArr.length; j++) { 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) + 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) } } } @@ -449,7 +497,7 @@ } }, //图标点击方法 - itemTap(index, list, isMutiple, key, detailItem,indexs) { + itemTap(index, list, isMutiple, key, detailItem, indexs) { //是否多选 if (isMutiple == true) { list[index].isSelected = !list[index].isSelected; @@ -511,11 +559,11 @@ } } } - if(indexs==1){ - if(detailItem.value==10){ + if (indexs == 1) { + if (detailItem.value == 10) { this.detailItems = '' this.pickerShow = true - }else{ + } else { this.detailItems = detailItem.value this.provinceCode = '' this.cityCode = '' @@ -523,16 +571,16 @@ this.pickerShow = false this.region = [] } - }else{ + } else { this.pickerShow = false } - if(indexs==2){ + if (indexs == 2) { this.oilCode = detailItem.value } - if(indexs==0){ - this.paixu = detailItem.value=='juli'?1:2 + if (indexs == 0) { + this.paixu = detailItem.value == 'juli' ? 1 : 2 } - console.log(index, list, isMutiple, key, detailItem,indexs,'打印打印打印') + console.log(index, list, isMutiple, key, detailItem, indexs, '打印打印打印') // this.detailItems = detailItem.value*1000 } // #ifdef H5 @@ -540,7 +588,7 @@ // #endif }, //图标点击方法 - itemTaps(index, list, isMutiple, key, detailItem,indexs) { + itemTaps(index, list, isMutiple, key, detailItem, indexs) { //是否多选 if (isMutiple == true) { list[index].isSelected = !list[index].isSelected; @@ -566,14 +614,14 @@ 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 { //判断是否是第一个 @@ -593,7 +641,7 @@ 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 @@ -602,13 +650,13 @@ } } } - console.log(index, list, isMutiple, key, detailItem,'打印打印打印') + console.log(index, list, isMutiple, key, detailItem, '打印打印打印') } // #ifdef H5 this.$forceUpdate(); // #endif }, - resetSelected(list, key,lists, keys) { + resetSelected(list, key, lists, keys) { // console.log('%c 重置方法第二步resetSelected函数参数↓','color:green;font-size:30px') if (typeof this.result[key] == 'object') { this.result[key] = []; @@ -625,7 +673,7 @@ list[i].isSelected = false; } } - if(key=='siteBrand'){ + if (key == 'siteBrand') { if (typeof this.result[keys] == 'object') { this.result[keys] = []; this.selectedTitleObj[keys] = lists[0].title; @@ -672,33 +720,33 @@ this.$emit("confirm", obj); }, //点击 确定方法 - sureClick(selectDetailList,item,index) { - console.log(index,this.oilCode,this.paixu,'5555555555555') - if(index == 2&&!this.oilCode){ - this.menuList[0].detailList[0].isSelected = true + 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){ + if (index == 0 && !this.oilCode && this.paixu == 2) { uni.showToast({ title: '请先选择油品再价格排序', icon: 'none' }) - this.itemTap(0, selectDetailList, false, item,selectDetailList[1],index) + this.itemTap(0, selectDetailList, false, item, selectDetailList[1], index) this.paixu = 1 return } - if(this.areaIndex[0] == 0){ + if (this.areaIndex[0] == 0) { this.provinceCode = '' this.cityCode = '' this.areaCode = '' } - if(this.areaIndex[1] == 0){ + if (this.areaIndex[1] == 0) { this.cityCode = '' this.areaCode = '' } - if(this.areaIndex[2] == 0){ + if (this.areaIndex[2] == 0) { this.areaCode = '' } let obj = { @@ -709,43 +757,46 @@ 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.distance = this.provinceCode ? '' : this.cityCode ? '' : this.areaCode ? '' : this.detailItems + obj.result.sort = this.paixu == 1 ? 'juli' : 'price' // obj.result.distance = this.detailItems - console.log(obj,this.oilCode,'look me!') + console.log(obj, this.oilCode, 'look me!') // console.log(this.seleIdex.split('/'),this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]],this.seleIdex.split('/')[2],'dddddddddddddddddd') - if(this.seleIdex!==null&&this.seleIdex.split('/')[2]==2){ - - obj.result.oilProductCode = this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]]?this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]]:'' - obj.titles.oilProductCode = obj.result.oilProductCode?obj.result.oilProductCode:'全部' + if (this.seleIdex !== null && this.seleIdex.split('/')[2] == 2) { + + obj.result.oilProductCode = this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[ + 0]] ? this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]] : '' + obj.titles.oilProductCode = obj.result.oilProductCode ? obj.result.oilProductCode : '全部' this.oilCode = obj.result.oilProductCode - console.log(obj,'look me!2') + console.log(obj, 'look me!2') this.$emit("confirm", obj); return - } + } this.$emit("confirm", obj); }, - resetClick(list, key,lists,keys,index) { - console.log('%c 重置方法第一步resetClick函数参数↓','color:red;font-size:30px') + 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){ - console.log(this.seleIdex.split('/'),this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]]) + if (this.seleIdex !== null && this.seleIdex.split('/')[2] == 2) { + console.log(this.seleIdex.split('/'), this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex + .split('/')[0] + ]) this.pseleFn() // console.log(obj,'look me!2') // this.$emit("confirm", obj); } - if(key == 'channelCode'){ + if (key == 'channelCode') { this.provinceCode = '' this.cityCode = '' this.areaCode = '' } - this.resetSelected(list, key,lists,keys) - if(index == 2){ + this.resetSelected(list, key, lists, keys) + if (index == 2) { this.oilCode = '' this.paixu = 1 - console.log(this.oilCode,index,'9999999999999999') + console.log(this.oilCode, index, '9999999999999999') } - if(index == 1){ + if (index == 1) { this.provinceCode = '' this.cityCode = '' this.areaCode = '' @@ -753,14 +804,14 @@ this.region = [] this.pickerShow = false let aaa = { - detail:{ - value:[0,0] + detail: { + value: [0, 0] } } let ccc = 1 - this.bindChange(aaa,ccc) + this.bindChange(aaa, ccc) } - if(index == 0){ + if (index == 0) { this.paixu = 1 } } @@ -769,26 +820,29 @@ \ No newline at end of file + diff --git a/components/sl-filter/sl-filter.vue b/components/sl-filter/sl-filter.vue index 8dd37a2..35262fe 100644 --- a/components/sl-filter/sl-filter.vue +++ b/components/sl-filter/sl-filter.vue @@ -80,6 +80,16 @@ watch:{ isTransNav:function(n,o){ console.log(n,'*****') + }, + 'areaCodeList':{ + handler(n,o) { + // console.log('触发watch',n,o) + if(n.length) { + this.areaCodeList1 = n + } + }, + deep:true, + immediate:true, } }, computed: { diff --git a/pages/tabbar/station/stationList.vue b/pages/tabbar/station/stationList.vue index 68ea259..59e2670 100644 --- a/pages/tabbar/station/stationList.vue +++ b/pages/tabbar/station/stationList.vue @@ -27,7 +27,7 @@ - + @@ -243,6 +243,7 @@ // console.log(storykey) }, onLoad() { + console.log("111111111111111",uni.getStorageSync('filterDatas')) if (!uni.getStorageSync('filterDatas')) { this.getFilterData() // console.log('dhgiuhihqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq') @@ -393,6 +394,7 @@ }, getFilterData() { oilSiteApi.getCheckInfo().then(res => { + console.log('resresresresres',res) if (res.code == 20000) { uni.setStorageSync('productCodeList', res.data.productCodeList) uni.setStorageSync('areaCodeList', res.data.areaCodeList) diff --git a/utils/request.js b/utils/request.js index 91c7108..598f758 100644 --- a/utils/request.js +++ b/utils/request.js @@ -3,9 +3,9 @@ import utils from '@/utils/encode' // const env = process.env.NODE_ENV // const env = 'production'/* */ // const env = 'test' -const env = 'production' +const env = 'test' // 45 -const testUrl = 'http://192.168.1.85:38080' +const testUrl = 'http://192.168.1.83:38080' // const productUrl = 'https://www.xingoil.com/adminapi' const productUrl = 'http://uat.xingoil.com/adminapi'