sj-miniprogram/pages/experience/position-select.js

import { ref, computed, getCurrentInstance } from 'vue';
import { onLoad, onReady } from '@dcloudio/uni-app';
import { listIndustry, listIndustrySkill } from '../../api/systemIndustry';

export default {
    setup() {
        const searchQuery = ref('');
        const activeIndex = ref(0);
        const scrollIntoId = ref('category-0');
        const currentSelected = ref('');

        let sectionHeights = [];
        let isClickScrolling = false;
        let clickTimer = null;

        const instance = getCurrentInstance();

        const positionData = ref([]);

        const loadData = async (selectedVal) => {
            try {
                uni.showLoading({ title: '加载中...' });
                const [indRes, skillRes] = await Promise.all([
                    listIndustry(),
                    listIndustrySkill()
                ]);

                if (indRes.code === 200 && skillRes.code === 200) {
                    const industries = indRes.rows || indRes.data || [];
                    const skills = skillRes.rows || skillRes.data || [];

                    // Level 1: parentId = 0
                    const level1 = industries.filter(i => i.parentId == 0 || !i.parentId);
                    
                    const result = level1.map(l1 => {
                        // Level 2: parentId = l1.industryId
                        const level2 = industries.filter(i => i.parentId == l1.industryId);
                        
                        const sections = level2.map(l2 => {
                             // Level 3: skill.industryId = l2.industryId
                             const level3 = skills
                                 .filter(s => s.industryId == l2.industryId)
                                 .map(s => s.skillName);
                             return {
                                 name: l2.industryName,
                                 id: l2.industryId,
                                 children: level3
                             };
                        });
                        
                        // 过滤掉没下级节点的(可选)
                        return {
                            name: l1.industryName,
                            id: l1.industryId,
                            sections: sections
                        };
                    });
                    
                    positionData.value = result;

                    // 计算回显
                    if (selectedVal) {
                        for (let i = 0; i < result.length; i++) {
                            let found = false;
                            for (let j = 0; j < result[i].sections.length; j++) {
                                if (result[i].sections[j].children.includes(selectedVal)) {
                                    activeIndex.value = i;
                                    scrollIntoId.value = 'category-' + i;
                                    found = true;
                                    break;
                                }
                            }
                            if (found) break;
                        }
                    }

                    setTimeout(() => {
                        calculateSectionHeights();
                    }, 500);
                }
            } catch (e) {
                console.error('加载职位结构失败', e);
                uni.showToast({ title: '加载职位失败', icon: 'none' });
            } finally {
                uni.hideLoading();
            }
        };

        const searchResults = computed(() => {
            if (!searchQuery.value) return [];
            const q = searchQuery.value.toLowerCase();
            const results = [];
            positionData.value.forEach(l1 => {
                l1.sections.forEach(l2 => {
                    l2.children.forEach(pos => {
                        if (pos.toLowerCase().includes(q)) {
                            results.push(pos);
                        }
                    });
                });
            });
            return results;
        });

        onLoad((options) => {
            let selectedParam = '';
            if (options && options.selected) {
                currentSelected.value = decodeURIComponent(options.selected);
                selectedParam = currentSelected.value;
            }
            uni.setNavigationBarTitle({ title: '选择职位名称' });
            loadData(selectedParam);
        });

        const calculateSectionHeights = () => {
            const query = uni.createSelectorQuery().in(instance.proxy);
            query.selectAll('.category-wrapper').boundingClientRect(rects => {
                if (rects && rects.length > 0) {
                    let currentTop = 0;
                    sectionHeights = rects.map(r => {
                        let top = currentTop;
                        currentTop += r.height;
                        return top; 
                    });
                }
            }).exec();
        };

        const onRightScroll = (e) => {
            if (isClickScrolling || sectionHeights.length === 0) return;
            const scrollTop = e.detail.scrollTop;

            let currentIndex = 0;
            for (let i = 0; i < sectionHeights.length; i++) {
                if (scrollTop >= sectionHeights[i] - 15) {
                    currentIndex = i;
                } else {
                    break;
                }
            }
            if (activeIndex.value !== currentIndex) {
                activeIndex.value = currentIndex;
            }
        };

        const selectMenu = (index) => {
            activeIndex.value = index;
            scrollIntoId.value = 'category-' + index;

            isClickScrolling = true;
            clearTimeout(clickTimer);
            clickTimer = setTimeout(() => {
                isClickScrolling = false;
            }, 600);
        };

        const selectPosition = (posName) => {
            uni.$emit('select_position', posName);
            uni.navigateBack();
        };

        return {
            searchQuery,
            activeIndex,
            scrollIntoId,
            currentSelected,
            positionData,
            searchResults,
            selectMenu,
            selectPosition,
            onRightScroll
        };
    }
}