hr-position-system/js/dropdowns.js

/**
 * 下拉選單模組
 * 處理階層式下拉選單的連動
 */

import {
    businessUnits,
    businessToDivision,
    divisionToDepartment,
    departmentToPosition,
    loadHierarchyData
} from './data/hierarchy.js';

// ==================== 初始化下拉選單 ====================

export function initializeDropdowns() {
    // 初始化崗位基礎資料維護的事業體下拉選單
    const businessUnitSelect = document.getElementById('businessUnit');
    if (businessUnitSelect) {
        businessUnitSelect.innerHTML = '<option value="">請選擇</option>';
        businessUnits.forEach(unit => {
            const option = document.createElement('option');
            option.value = unit;
            option.textContent = unit;
            businessUnitSelect.appendChild(option);
        });
        businessUnitSelect.addEventListener('change', onBusinessUnitChange);
    }

    // 初始化處級單位下拉選單
    const divisionSelect = document.getElementById('division');
    if (divisionSelect) {
        divisionSelect.innerHTML = '<option value="">請先選擇事業體</option>';
        divisionSelect.addEventListener('change', onDivisionChange);
    }

    // 初始化部級單位下拉選單
    const departmentSelect = document.getElementById('department');
    if (departmentSelect) {
        departmentSelect.innerHTML = '<option value="">請先選擇處級單位</option>';
    }

    // ========== 初始化崗位描述模組的下拉選單 ==========
    const jdBusinessUnitSelect = document.getElementById('jd_businessUnit');
    if (jdBusinessUnitSelect) {
        jdBusinessUnitSelect.innerHTML = '<option value="">請選擇</option>';
        businessUnits.forEach(unit => {
            const option = document.createElement('option');
            option.value = unit;
            option.textContent = unit;
            jdBusinessUnitSelect.appendChild(option);
        });
        jdBusinessUnitSelect.addEventListener('change', onJobDescBusinessUnitChange);
    }

    // 崗位描述的處級單位
    const jdDivisionSelect = document.getElementById('jd_division');
    if (jdDivisionSelect) {
        jdDivisionSelect.addEventListener('change', onJobDescDivisionChange);
    }

    // 崗位描述的部級單位
    const jdDepartmentSelect = document.getElementById('jd_department');
    if (jdDepartmentSelect) {
        jdDepartmentSelect.addEventListener('change', onJobDescDepartmentChange);
    }

    // ========== 初始化部門職責維護模組的下拉選單 ==========
    const deptFuncBusinessUnitSelect = document.getElementById('deptFunc_businessUnit');
    if (deptFuncBusinessUnitSelect) {
        deptFuncBusinessUnitSelect.innerHTML = '<option value="">請選擇</option>';
        businessUnits.forEach(unit => {
            const option = document.createElement('option');
            option.value = unit;
            option.textContent = unit;
            deptFuncBusinessUnitSelect.appendChild(option);
        });
        deptFuncBusinessUnitSelect.addEventListener('change', onDeptFuncBusinessUnitChange);
    }

    // 部門職責的處級單位
    const deptFuncDivisionSelect = document.getElementById('deptFunc_division');
    if (deptFuncDivisionSelect) {
        deptFuncDivisionSelect.addEventListener('change', onDeptFuncDivisionChange);
    }

    // 部門職責的部級單位
    const deptFuncDepartmentSelect = document.getElementById('deptFunc_department');
    if (deptFuncDepartmentSelect) {
        deptFuncDepartmentSelect.addEventListener('change', onDeptFuncDepartmentChange);
    }
}

// ==================== 崗位基礎資料維護的連動 ====================

function onBusinessUnitChange(event) {
    const selectedBusiness = event.target.value;
    const divisionSelect = document.getElementById('division');
    const departmentSelect = document.getElementById('department');

    if (divisionSelect) {
        divisionSelect.innerHTML = '<option value="">請選擇</option>';
    }
    if (departmentSelect) {
        departmentSelect.innerHTML = '<option value="">請先選擇處級單位</option>';
    }

    if (selectedBusiness && businessToDivision[selectedBusiness]) {
        const divisions = businessToDivision[selectedBusiness];
        divisions.forEach(division => {
            const option = document.createElement('option');
            option.value = division;
            option.textContent = division;
            divisionSelect.appendChild(option);
        });
    }
}

function onDivisionChange(event) {
    const selectedDivision = event.target.value;
    const departmentSelect = document.getElementById('department');

    if (departmentSelect) {
        departmentSelect.innerHTML = '<option value="">請選擇</option>';
    }

    if (selectedDivision && divisionToDepartment[selectedDivision]) {
        const departments = divisionToDepartment[selectedDivision];
        departments.forEach(department => {
            const option = document.createElement('option');
            option.value = department;
            option.textContent = department;
            departmentSelect.appendChild(option);
        });
    }
}

// ==================== 崗位描述模組的階層式下拉選單 ====================

function onJobDescBusinessUnitChange(event) {
    const selectedBusiness = event.target.value;
    const divisionSelect = document.getElementById('jd_division');
    const departmentSelect = document.getElementById('jd_department');
    const positionSelect = document.getElementById('jd_positionTitle');

    if (divisionSelect) divisionSelect.innerHTML = '<option value="">請選擇</option>';
    if (departmentSelect) departmentSelect.innerHTML = '<option value="">請先選擇處級單位</option>';
    if (positionSelect) positionSelect.innerHTML = '<option value="">請先選擇部級單位</option>';

    if (selectedBusiness && businessToDivision[selectedBusiness]) {
        const divisions = businessToDivision[selectedBusiness];
        divisions.forEach(division => {
            const option = document.createElement('option');
            option.value = division;
            option.textContent = division;
            divisionSelect.appendChild(option);
        });
    }
}

function onJobDescDivisionChange(event) {
    const selectedDivision = event.target.value;
    const departmentSelect = document.getElementById('jd_department');
    const positionSelect = document.getElementById('jd_positionTitle');

    if (departmentSelect) departmentSelect.innerHTML = '<option value="">請選擇</option>';
    if (positionSelect) positionSelect.innerHTML = '<option value="">請先選擇部級單位</option>';

    if (selectedDivision && divisionToDepartment[selectedDivision]) {
        const departments = divisionToDepartment[selectedDivision];
        departments.forEach(department => {
            const option = document.createElement('option');
            option.value = department;
            option.textContent = department;
            departmentSelect.appendChild(option);
        });
    }
}

function onJobDescDepartmentChange(event) {
    const selectedDepartment = event.target.value;
    const positionSelect = document.getElementById('jd_positionTitle');

    if (positionSelect) positionSelect.innerHTML = '<option value="">請選擇</option>';

    if (selectedDepartment && departmentToPosition[selectedDepartment]) {
        const positions = departmentToPosition[selectedDepartment];
        positions.forEach(position => {
            const option = document.createElement('option');
            option.value = position;
            option.textContent = position;
            positionSelect.appendChild(option);
        });
    }
}

// ==================== 部門職責維護模組的階層式下拉選單 ====================

function onDeptFuncBusinessUnitChange(event) {
    const selectedBusiness = event.target.value;
    const divisionSelect = document.getElementById('deptFunc_division');
    const departmentSelect = document.getElementById('deptFunc_department');
    const positionSelect = document.getElementById('deptFunc_positionTitle');

    if (divisionSelect) divisionSelect.innerHTML = '<option value="">請選擇</option>';
    if (departmentSelect) departmentSelect.innerHTML = '<option value="">請先選擇處級單位</option>';
    if (positionSelect) positionSelect.innerHTML = '<option value="">請先選擇部級單位</option>';

    if (selectedBusiness && businessToDivision[selectedBusiness]) {
        const divisions = businessToDivision[selectedBusiness];
        divisions.forEach(division => {
            const option = document.createElement('option');
            option.value = division;
            option.textContent = division;
            divisionSelect.appendChild(option);
        });
    }
}

function onDeptFuncDivisionChange(event) {
    const selectedDivision = event.target.value;
    const departmentSelect = document.getElementById('deptFunc_department');
    const positionSelect = document.getElementById('deptFunc_positionTitle');

    if (departmentSelect) departmentSelect.innerHTML = '<option value="">請選擇</option>';
    if (positionSelect) positionSelect.innerHTML = '<option value="">請先選擇部級單位</option>';

    if (selectedDivision && divisionToDepartment[selectedDivision]) {
        const departments = divisionToDepartment[selectedDivision];
        departments.forEach(department => {
            const option = document.createElement('option');
            option.value = department;
            option.textContent = department;
            departmentSelect.appendChild(option);
        });
    }
}

function onDeptFuncDepartmentChange(event) {
    const selectedDepartment = event.target.value;
    const positionSelect = document.getElementById('deptFunc_positionTitle');

    if (positionSelect) positionSelect.innerHTML = '<option value="">請選擇</option>';

    if (selectedDepartment && departmentToPosition[selectedDepartment]) {
        const positions = departmentToPosition[selectedDepartment];
        positions.forEach(position => {
            const option = document.createElement('option');
            option.value = position;
            option.textContent = position;
            positionSelect.appendChild(option);
        });
    }
}

// ==================== 部門職責關聯功能 ====================

// 部門職責資料 (示範用)
let deptFunctionData = [];

export function refreshDeptFunctionList(showMessage = false) {
    const select = document.getElementById('jd_deptFunction');
    if (!select) return;

    select.innerHTML = '<option value="">-- 請選擇部門職責 --</option>';

    if (deptFunctionData.length > 0) {
        deptFunctionData.forEach(df => {
            const option = document.createElement('option');
            option.value = df.deptFunctionCode;
            option.textContent = `${df.deptFunctionCode} - ${df.deptFunctionName} (${df.deptFunctionDept})`;
            select.appendChild(option);
        });
        if (showMessage && typeof showToast === 'function') {
            showToast('已載入 ' + deptFunctionData.length + ' 筆部門職責資料');
        }
    } else {
        if (showMessage && typeof showToast === 'function') {
            showToast('尚無部門職責資料，請先建立部門職責');
        }
    }
}

export function loadDeptFunctionInfo() {
    const select = document.getElementById('jd_deptFunction');
    const infoSection = document.getElementById('deptFunctionInfoSection');

    if (!select) return;

    const selectedCode = select.value;

    if (!selectedCode) {
        if (infoSection) infoSection.style.display = 'none';
        return;
    }

    const deptFunc = deptFunctionData.find(d => d.deptFunctionCode === selectedCode);

    if (deptFunc) {
        const codeEl = document.getElementById('jd_deptFunctionCode');
        const buEl = document.getElementById('jd_deptFunctionBU');
        const missionEl = document.getElementById('jd_deptMission');
        const functionsEl = document.getElementById('jd_deptCoreFunctions');
        const kpisEl = document.getElementById('jd_deptKPIs');

        if (codeEl) codeEl.value = deptFunc.deptFunctionCode || '';
        if (buEl) buEl.value = deptFunc.deptFunctionBU || '';
        if (missionEl) missionEl.value = deptFunc.deptMission || '';
        if (functionsEl) functionsEl.value = deptFunc.deptCoreFunctions || '';
        if (kpisEl) kpisEl.value = deptFunc.deptKPIs || '';

        const deptInput = document.getElementById('jd_department');
        if (deptInput && !deptInput.value) {
            deptInput.value = deptFunc.deptFunctionDept;
        }

        if (infoSection) infoSection.style.display = 'block';

        if (typeof showToast === 'function') {
            showToast('已載入部門職責: ' + deptFunc.deptFunctionName);
        }
    }
}

export function setDeptFunctionData(data) {
    deptFunctionData = data;
}

// 初始化時載入階層資料
export async function initializeHierarchyDropdowns() {
    await loadHierarchyData();
    initializeDropdowns();
}