diff --git a/components/new-filter-page/new-filter-page.vue b/components/new-filter-page/new-filter-page.vue
index f47565e..c834b8c 100644
--- a/components/new-filter-page/new-filter-page.vue
+++ b/components/new-filter-page/new-filter-page.vue
@@ -1,5 +1,14 @@
+
+
+
+
-
+
- handleSelect('area', e)">
+ handleCheckboxSelect('area', e)">
-
+
@@ -132,6 +141,7 @@
+
@@ -176,7 +186,7 @@ const selectedValues = reactive({
experience: '',
salary: '',
scale: '',
- area: '',
+ area: [],
jobType: ''
});
@@ -218,21 +228,60 @@ onBeforeMount(async () => {
}
});
-// 处理选项选择
+// 处理单选选项选择
const handleSelect = (key, e) => {
selectedValues[key] = e.detail.value;
};
+// 处理多选选项选择(地区)
+// 兼容不同平台:H5 可能返回逗号分隔字符串,小程序返回数组
+const handleCheckboxSelect = (key, e) => {
+ let val = e.detail.value;
+ if (typeof val === 'string') {
+ selectedValues[key] = val ? val.split(',').map((s) => s.trim()) : [];
+ } else if (Array.isArray(val)) {
+ selectedValues[key] = val.map((v) => String(v));
+ } else {
+ selectedValues[key] = [];
+ }
+};
+
+// 判断地区选项是否被选中(兼容数组和字符串)
+const isAreaSelected = (value) => {
+ const areaVal = selectedValues.area;
+ if (Array.isArray(areaVal)) {
+ return areaVal.includes(value);
+ }
+ if (typeof areaVal === 'string' && areaVal) {
+ return areaVal.split(',').includes(value);
+ }
+ return false;
+};
+
// 清除所有选择
const handleClear = () => {
Object.keys(selectedValues).forEach((key) => {
- selectedValues[key] = '';
+ if (key === 'area') {
+ selectedValues[key] = [];
+ } else {
+ selectedValues[key] = '';
+ }
});
};
// 确认筛选
const handleConfirm = () => {
const payload = { ...selectedValues };
+ // 将多选的地区数组转为逗号分隔字符串(兼容各种格式)
+ if (Array.isArray(payload.area) && payload.area.length > 0) {
+ payload.area = payload.area.map((v) => String(v)).join(',');
+ } else if (typeof payload.area === 'string' && payload.area) {
+ // 如果已经是逗号分隔字符串,保持原样
+ payload.area = payload.area;
+ } else {
+ payload.area = '';
+ }
+ console.log('[new-filter-page] area value to emit:', payload.area);
// 将选中的薪资区间转换为 minSalary / maxSalary 参数
// 始终带上 minSalary / maxSalary(含空值),便于父组件在清除时移除旧值
let minSalary = '';
@@ -269,22 +318,33 @@ const handleClose = () => {
background-color: #fff;
z-index: 9999;
display: flex;
- flex-direction: row;
+ flex-direction: column;
}
.filter-header {
height: 96rpx;
display: flex;
align-items: center;
- justify-content: space-between;
+ justify-content: center;
padding: 0 32rpx;
border-bottom: 1rpx solid #eee;
background-color: #fff;
- box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+ flex-shrink: 0;
+ position: relative;
- .back-btn {
- font-size: 36rpx;
+ .header-title {
+ font-size: 34rpx;
+ font-weight: 600;
+ color: #333;
+ }
+
+ .header-close {
+ position: absolute;
+ right: 32rpx;
+ top: 50%;
+ transform: translateY(-50%);
width: 48rpx;
+ height: 48rpx;
display: flex;
align-items: center;
justify-content: center;
@@ -295,15 +355,42 @@ const handleClose = () => {
&:active {
background-color: rgba(37, 107, 250, 0.1);
}
- }
- .filter-title {
- font-size: 34rpx;
- font-weight: 600;
- color: #333;
+ .close-icon {
+ position: relative;
+ width: 28rpx;
+ height: 28rpx;
+
+ &::before,
+ &::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ width: 4rpx;
+ height: 28rpx;
+ border-radius: 2rpx;
+ background: #5A5A68;
+ }
+
+ &::before {
+ transform: translate(-50%, -50%) rotate(45deg);
+ }
+
+ &::after {
+ transform: translate(-50%, -50%) rotate(-45deg);
+ }
+ }
}
}
+.filter-body {
+ flex: 1;
+ display: flex;
+ flex-direction: row;
+ overflow: hidden;
+}
+
.filter-tabs {
width: 200rpx;
border-right: 1rpx solid #eee;
diff --git a/components/renderJobs/renderJobs.vue b/components/renderJobs/renderJobs.vue
index 3354ce2..9731062 100644
--- a/components/renderJobs/renderJobs.vue
+++ b/components/renderJobs/renderJobs.vue
@@ -21,14 +21,8 @@
{{ job.postingDate }}
-
-
-
+
+ 地区:{{ job.regionName }}
diff --git a/pages/index/components/index-one.vue b/pages/index/components/index-one.vue
index a860d95..0ab5ddc 100644
--- a/pages/index/components/index-one.vue
+++ b/pages/index/components/index-one.vue
@@ -40,7 +40,7 @@
-
+
职位名称、薪资要求等
@@ -263,9 +263,14 @@
{{ item.text }}
-
- 筛选
-
+
+
+ 清除筛选
+
+
+ 筛选
+
+
@@ -564,6 +569,12 @@ const shouldShowCompanyContent = computed(() => {
return userType === 0;
});
+// 判断是否有筛选条件(用于显示/隐藏清除按钮)
+const hasFilterConditions = computed(() => {
+ const searchKeys = Object.keys(pageState.search).filter((k) => k !== 'order' && pageState.search[k]);
+ return searchKeys.length > 0 || Object.keys(conditionSearch.value).length > 0 || Boolean(selectedCity.value.code);
+});
+
// 判断当前用户是否为招聘者(企业用户)
const isRecruiter = computed(() => {
if (!hasLogin.value) {
@@ -1067,6 +1078,38 @@ function openFilter() {
emits('onShowTabbar', false);
}
+// 跳转到搜索页,并携带筛选条件
+function navToSearch() {
+ const query = {};
+ // 携带筛选弹窗中选择的地区(确保是逗号分隔字符串)
+ const areaVal = pageState.search.area;
+ if (areaVal && String(areaVal)) {
+ query.area = String(areaVal);
+ }
+ // 携带城市选择器中选择的regionCode
+ if (conditionSearch.value.regionCode) {
+ query.regionCode = String(conditionSearch.value.regionCode);
+ }
+ console.log('[navToSearch] query params:', query);
+ navTo('/pages/search/search', { query });
+}
+
+// 清除所有筛选条件
+function clearFilter() {
+ // 保留 order 排序方式
+ const currentOrder = pageState.search.order;
+ pageState.search = { order: currentOrder };
+ // 清除城市选择
+ conditionSearch.value = {};
+ selectedCity.value = { code: '', name: '' };
+ // 刷新列表
+ if (state.tabIndex === 'all') {
+ getJobRecommend('refresh');
+ } else {
+ getJobList('refresh');
+ }
+}
+
function handleNewFilterConfirm(values) {
pageState.search = {
...pageState.search,
@@ -1993,16 +2036,26 @@ defineExpose({ loadData });
font-weight: 500;
font-size: 32rpx;
color: #256BFA;
- .btm-right
- font-family: 'PingFangSC-Regular', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
- font-weight: 400;
- font-size: 32rpx;
- color: #6C7282;
- .right-sx
- width: 26rpx;
- height: 26rpx;
- .active
- transform: rotate(180deg)
+ .btm-right-wrap
+ display: flex
+ align-items: center
+ .clear-btn
+ font-family: 'PingFangSC-Regular', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #999;
+ margin-right: 20rpx;
+ white-space: nowrap;
+ .btm-right
+ font-family: 'PingFangSC-Regular', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ font-weight: 400;
+ font-size: 32rpx;
+ color: #6C7282;
+ .right-sx
+ width: 26rpx;
+ height: 26rpx;
+ .active
+ transform: rotate(180deg)
.table-list
background: #F4F4F4
flex: 1
diff --git a/pages/search/search.vue b/pages/search/search.vue
index a08c1bf..4db610c 100644
--- a/pages/search/search.vue
+++ b/pages/search/search.vue
@@ -1,9 +1,9 @@
-