sdz/ks-app-employment-service

Template

Fork 0

Files

冯辉 b72b7dd7d6 岗位发布开发

2025-10-23 17:16:16 +08:00

4.6 KiB

Raw Blame History

企业搜索功能实现说明

功能概述

根据用户类型对发布岗位页面的"招聘公司"输入框进行不同的交互处理：

企业用户：直接输入公司名称
网格员：点击输入框跳转到企业搜索页面，支持模糊查询

实现细节

1. 用户类型判断

通过 userInfo.isCompanyUser 字段判断用户类型：

0: 企业用户
1: 求职者
2: 网格员
3: 政府人员

2. 页面修改

发布岗位页面 (`pages/job/publishJob.vue`)

模板修改：

<!-- 企业用户：直接输入 -->
<input 
    v-if="isCompanyUser"
    class="input" 
    placeholder="请输入公司名称" 
    v-model="formData.companyName"
/>
<!-- 网格员：点击跳转到搜索页面 -->
<view 
    v-else
    class="company-selector"
    @click="openCompanySearch"
>
    <view class="selector-text" :class="{ 'placeholder': !formData.companyName }">
        {{ formData.companyName || '请选择企业' }}
    </view>
    <view class="selector-icon">
        <view class="arrow-icon">></view>
    </view>
</view>

脚本修改：

添加用户类型判断逻辑
添加打开企业搜索页面的方法
添加页面显示时处理返回数据的逻辑

企业搜索页面 (`pages/job/companySearch.vue`)

功能特性：

搜索框支持实时输入
防抖节流：500ms延迟执行搜索
调用接口：/app/company/likeList，参数：name
支持企业选择和数据回传
空状态和加载状态处理

核心代码：

// 防抖搜索
const onSearchInput = () => {
    if (debounceTimer) {
        clearTimeout(debounceTimer);
    }
    
    debounceTimer = setTimeout(() => {
        if (searchKeyword.value.trim()) {
            searchCompanies();
        } else {
            searchResults.value = [];
        }
    }, 500);
};

// 搜索企业
const searchCompanies = async () => {
    const response = await createRequest('/app/company/likeList', {
        name: searchKeyword.value.trim()
    }, 'GET', false);
    
    if (response.code === 200) {
        searchResults.value = response.data || [];
    }
};

// 选择企业
const selectCompany = (company) => {
    uni.navigateBack({
        success: () => {
            getApp().globalData = getApp().globalData || {};
            getApp().globalData.selectedCompany = company;
        }
    });
};

3. 数据传递

使用全局数据传递选中的企业信息：

企业搜索页面：

// 选择企业后设置全局数据
getApp().globalData.selectedCompany = company;

发布岗位页面：

// 页面显示时检查全局数据
onShow(() => {
    const app = getApp();
    if (app.globalData && app.globalData.selectedCompany) {
        const selectedCompany = app.globalData.selectedCompany;
        formData.companyName = selectedCompany.name;
        formData.companyId = selectedCompany.id;
        
        // 清除全局数据
        app.globalData.selectedCompany = null;
    }
});

4. 页面配置

在 pages.json 中添加了企业搜索页面配置：

{
    "path": "pages/job/companySearch",
    "style": {
        "navigationBarTitleText": "选择企业",
        "navigationStyle": "custom",
        "disableScroll": false,
        "enablePullDownRefresh": false,
        "backgroundColor": "#f5f5f5"
    }
}

5. 测试页面

创建了测试页面 pages/test/company-search-test.vue 用于验证功能：

用户类型切换
功能说明展示
直接跳转到发布岗位页面测试

使用说明

企业用户

进入发布岗位页面
招聘公司输入框为普通输入框
直接输入公司名称

网格员

进入发布岗位页面
点击"招聘公司"输入框
跳转到企业搜索页面
输入企业名称进行搜索（支持防抖）
选择企业后自动返回
企业名称显示在输入框中

技术特点

防抖节流：搜索输入500ms延迟，避免频繁请求
用户类型判断：根据 isCompanyUser 字段动态显示不同交互
数据传递：使用全局数据实现页面间数据传递
响应式设计：支持不同屏幕尺寸
错误处理：完善的错误提示和空状态处理

接口说明

搜索企业接口：

地址：/app/company/likeList
方法：GET
参数：name (企业名称)
返回：企业列表数据

注意事项

确保用户类型字段 isCompanyUser 正确设置
搜索接口需要支持模糊查询
企业数据需要包含 id 和 name 字段
防抖时间可根据实际需求调整

4.6 KiB Raw Blame History Unescape Escape