Browse Source

修复高级筛选地区选择器变量名冲突问题

pull/12/head
徐飞洋 2 months ago
parent
commit
d9d049362a
  1. 84
      pages/index/index.js
  2. 32
      pages/index/index.wxml

84
pages/index/index.js

@ -129,6 +129,7 @@ Page({
yolkType: 'all', // 蛋黄类型 yolkType: 'all', // 蛋黄类型
specification: 'all', // 规格 specification: 'all', // 规格
productName: 'all', // 商品名称 productName: 'all', // 商品名称
region: 'all', // 地区
priceRange: [0, 100], // 价格范围 priceRange: [0, 100], // 价格范围
sortBy: 'default' // 排序方式 sortBy: 'default' // 排序方式
}, },
@ -137,6 +138,7 @@ Page({
showYolkTypePicker: false, showYolkTypePicker: false,
showSpecificationPicker: false, showSpecificationPicker: false,
showProductNamePicker: false, showProductNamePicker: false,
showRegionPicker: false,
// 蛋壳颜色选项 // 蛋壳颜色选项
shellColorOptions: [ shellColorOptions: [
{ label: '全部颜色', value: 'all' }, { label: '全部颜色', value: 'all' },
@ -205,6 +207,47 @@ Page({
{ label: '毛重30-31', value: '毛重30-31' }, { label: '毛重30-31', value: '毛重30-31' },
{ label: '毛重30以下', value: '毛重30以下' } { label: '毛重30以下', value: '毛重30以下' }
], ],
// 地区选项
regionOptions: [
{ label: '全国', value: 'all' },
{ label: '北京', value: '北京' },
{ label: '上海', value: '上海' },
{ label: '广州', value: '广州' },
{ label: '深圳', value: '深圳' },
{ label: '天津', value: '天津' },
{ label: '重庆', value: '重庆' },
{ label: '河北', value: '河北' },
{ label: '山西', value: '山西' },
{ label: '辽宁', value: '辽宁' },
{ label: '吉林', value: '吉林' },
{ label: '黑龙江', value: '黑龙江' },
{ label: '江苏', value: '江苏' },
{ label: '浙江', value: '浙江' },
{ label: '安徽', value: '安徽' },
{ label: '福建', value: '福建' },
{ label: '江西', value: '江西' },
{ label: '山东', value: '山东' },
{ label: '河南', value: '河南' },
{ label: '湖北', value: '湖北' },
{ label: '湖南', value: '湖南' },
{ label: '广东', value: '广东' },
{ label: '海南', value: '海南' },
{ label: '四川', value: '四川' },
{ label: '贵州', value: '贵州' },
{ label: '云南', value: '云南' },
{ label: '陕西', value: '陕西' },
{ label: '甘肃', value: '甘肃' },
{ label: '青海', value: '青海' },
{ label: '台湾', value: '台湾' },
{ label: '内蒙古', value: '内蒙古' },
{ label: '广西', value: '广西' },
{ label: '西藏', value: '西藏' },
{ label: '宁夏', value: '宁夏' },
{ label: '新疆', value: '新疆' },
{ label: '香港', value: '香港' },
{ label: '澳门', value: '澳门' }
],
// 商品名称选项 // 商品名称选项
productNameOptions: [ productNameOptions: [
{ label: '全部商品', value: 'all' }, { label: '全部商品', value: 'all' },
@ -1616,7 +1659,13 @@ Page({
console.log('applyFilters - 搜索过滤后数量:', filtered.length); console.log('applyFilters - 搜索过滤后数量:', filtered.length);
} }
if (this.data.selectedRegion !== '全国') { // 应用高级筛选中的地区筛选
if (this.data.advancedFilters.region !== 'all') {
const selectedRegion = this.data.advancedFilters.region
filtered = filtered.filter(item => item.isAd || (item.region && item.region.includes(selectedRegion)))
}
// 同时支持原有的地区筛选(为了向后兼容)
else if (this.data.selectedRegion !== '全国') {
const selectedRegion = this.data.selectedRegion const selectedRegion = this.data.selectedRegion
filtered = filtered.filter(item => item.isAd || (item.region && item.region.includes(selectedRegion))) filtered = filtered.filter(item => item.isAd || (item.region && item.region.includes(selectedRegion)))
} }
@ -1934,6 +1983,7 @@ Page({
yolkType: 'all', yolkType: 'all',
specification: 'all', specification: 'all',
productName: 'all', productName: 'all',
region: 'all',
priceRange: [0, 100], priceRange: [0, 100],
sortBy: 'default' sortBy: 'default'
} }
@ -1976,6 +2026,15 @@ Page({
}); });
}, },
// 选择地区并关闭下拉菜单
selectRegion: function (e) {
const region = e.currentTarget.dataset.region;
this.setData({
'advancedFilters.region': region,
showRegionPicker: false
});
},
// 选择价格范围 // 选择价格范围
selectPriceRange: function (e) { selectPriceRange: function (e) {
const priceRange = e.currentTarget.dataset.price; const priceRange = e.currentTarget.dataset.price;
@ -1998,7 +2057,8 @@ Page({
showShellColorPicker: !this.data.showShellColorPicker, showShellColorPicker: !this.data.showShellColorPicker,
showYolkTypePicker: false, showYolkTypePicker: false,
showSpecificationPicker: false, showSpecificationPicker: false,
showProductNamePicker: false showProductNamePicker: false,
showRegionPicker: false
}); });
}, },
@ -2008,7 +2068,8 @@ Page({
showYolkTypePicker: !this.data.showYolkTypePicker, showYolkTypePicker: !this.data.showYolkTypePicker,
showShellColorPicker: false, showShellColorPicker: false,
showSpecificationPicker: false, showSpecificationPicker: false,
showProductNamePicker: false showProductNamePicker: false,
showRegionPicker: false
}); });
}, },
@ -2018,7 +2079,8 @@ Page({
showSpecificationPicker: !this.data.showSpecificationPicker, showSpecificationPicker: !this.data.showSpecificationPicker,
showShellColorPicker: false, showShellColorPicker: false,
showYolkTypePicker: false, showYolkTypePicker: false,
showProductNamePicker: false showProductNamePicker: false,
showRegionPicker: false
}); });
}, },
@ -2028,7 +2090,19 @@ Page({
showProductNamePicker: !this.data.showProductNamePicker, showProductNamePicker: !this.data.showProductNamePicker,
showShellColorPicker: false, showShellColorPicker: false,
showYolkTypePicker: false, showYolkTypePicker: false,
showSpecificationPicker: false showSpecificationPicker: false,
showRegionPicker: false
});
},
// 切换地区下拉菜单
toggleRegionPicker: function () {
this.setData({
showRegionPicker: !this.data.showRegionPicker,
showShellColorPicker: false,
showYolkTypePicker: false,
showSpecificationPicker: false,
showProductNamePicker: false
}); });
}, },

32
pages/index/index.wxml

@ -8,10 +8,6 @@
<view class="search-section"> <view class="search-section">
<view class="search-bar" style="width: 693rpx; display: flex; box-sizing: border-box"> <view class="search-bar" style="width: 693rpx; display: flex; box-sizing: border-box">
<view class="search-input-wrapper"> <view class="search-input-wrapper">
<!-- 将地区选择器放在最左边 -->
<view class="region-selector" bindtap="toggleRegionPicker">
<text>{{selectedRegion || '全国'}} ➤</text>
</view>
<!-- 搜索图标和输入框 --> <!-- 搜索图标和输入框 -->
<text class="search-icon">🔍</text> <text class="search-icon">🔍</text>
<input <input
@ -115,6 +111,34 @@
<view wx:if="{{showAdvancedFilter}}" class="sidebar advanced-filter-sidebar"> <view wx:if="{{showAdvancedFilter}}" class="sidebar advanced-filter-sidebar">
<view class="sidebar-title">高级筛选</view> <view class="sidebar-title">高级筛选</view>
<!-- 地区选择筛选 - 自定义下拉菜单 -->
<view class="filter-section">
<view class="filter-title">地区</view>
<view class="custom-picker">
<view
class="custom-picker-trigger"
bindtap="toggleRegionPicker"
>
{{advancedFilters.region === 'all' ? '全国' : advancedFilters.region}}
<text class="custom-picker-arrow {{showRegionPicker ? 'rotate' : ''}}">▼</text>
</view>
<view
wx:if="{{showRegionPicker}}"
class="custom-picker-options"
>
<view
wx:for="{{regionOptions}}"
wx:key="index"
class="custom-picker-option {{advancedFilters.region === item.value ? 'active' : ''}}"
bindtap="selectRegion"
data-region="{{item.value}}"
>
{{item.label}}
</view>
</view>
</view>
</view>
<!-- 蛋壳颜色筛选 - 自定义下拉菜单 --> <!-- 蛋壳颜色筛选 - 自定义下拉菜单 -->
<view class="filter-section"> <view class="filter-section">
<view class="filter-title">蛋壳颜色</view> <view class="filter-title">蛋壳颜色</view>

Loading…
Cancel
Save