SMANAGE/TempLate/GERP/pages/Company/department-detail.html

<script src="/assets/gerp/CompanyCommon.js?v=20260627c"></script>

<div class="GERPPage">
    <div class="cp-page">
        <div class="cp-header">
            <a href="javascript:void(0)" class="cp-back-btn" onclick="goBack()"><i class="fas fa-arrow-left"></i> 返回</a>
            <h1 class="PageTitle">
                <i class="fas fa-sitemap icon-primary icon-left-lg"></i>
                <span id="page-title">部门详情</span>
            </h1>
            <button class="GERPBtn Primary" onclick="handleEdit()" style="margin-left:auto;"><i class="fas fa-edit"></i> 编辑</button>
        </div>
        <div class="cp-container" id="detailContainer" style="overflow:auto;">
            <div class="cp-loading"><i class="fas fa-spinner fa-spin"></i> 加载中...</div>
        </div>
    </div>
</div>

<script>
    const currentServer = CompanyUtils.getServer();
    const deptUUID = new URLSearchParams(window.location.search).get('DeptUUID');

    CompanyUtils.setPageTitle('部门详情');

    function goBack() {
        if (window.history.length > 1) {
            window.history.back();
        } else {
            GERP.Navigate('/pages/Company/department.html' + (currentServer !== 'gvsds-master' ? `?server=${encodeURIComponent(currentServer)}` : ''), '部门管理');
        }
    }

    let currentData = null;
    let empTable = null;

    function buildApiUrl(path, params = {}) {
        const allParams = {};
        if (currentServer !== 'gvsds-master') allParams.server = currentServer;
        Object.assign(allParams, params);
        const qs = new URLSearchParams(allParams).toString();
        return qs ? `${path}?${qs}` : path;
    }

    async function init() {
        const containerEl = document.getElementById('detailContainer');

        if (!deptUUID) {
            containerEl.innerHTML = `<div class="cp-error"><i class="fas fa-exclamation-triangle" style="margin-right:6px;"></i> 缺少 DeptUUID 参数，无法加载部门详情。</div>`;
            return;
        }

        try {
            const dataResp = await fetch(buildApiUrl('/API/FormAPI/Get/Department', { DeptUUID: deptUUID, PageSize: '1' }), { credentials: 'include' });
            const dataResult = await dataResp.json();
            if (dataResult.code !== 0) {
                containerEl.innerHTML = `<div class="cp-error"><i class="fas fa-exclamation-circle" style="margin-right:6px;"></i> 加载失败: ${CompanyUtils.esc(dataResult.msg || '未知错误')}</div>`;
                return;
            }
            const list = dataResult.data || [];
            const data = Array.isArray(list) ? (list.find(d => d.DeptUUID === deptUUID) || list[0]) : list;
            if (!data) {
                containerEl.innerHTML = `<div class="cp-error">未找到部门数据</div>`;
                return;
            }

            currentData = data;
            CompanyUtils.setPageTitle(data.DeptName || '部门详情');

            // 解析 UUID 字段为名称
            const uuidMap = {};
            if (data.ParentDeptUUID) uuidMap.parentDept = { table: 'Department', uuids: [data.ParentDeptUUID] };
            const resolved = await CompanyUtils.resolveUUIDs(uuidMap);

            // 渲染基本信息 + 表格容器
            containerEl.innerHTML = `
                <div class="cp-detail-section">
                    <h3><i class="fas fa-sitemap"></i> 基本信息</h3>
                    <div class="cp-info-grid">
                        <div class="cp-info-item"><div class="label">部门名称</div><div class="value">${CompanyUtils.esc(data.DeptName) || '-'}</div></div>
                        <div class="cp-info-item"><div class="label">部门状态</div><div class="value">${CompanyUtils.statusTag(data.DeptStatus)}</div></div>
                        <div class="cp-info-item"><div class="label">上级部门</div><div class="value">${CompanyUtils.esc(resolved.parentDept?.[data.ParentDeptUUID] || data.ParentDeptUUID) || '-'}</div></div>
                        <div class="cp-info-item"><div class="label">排序</div><div class="value">${data.DeptSort ?? '-'}</div></div>
                        <div class="cp-info-item"><div class="label">创建时间</div><div class="value">${CompanyUtils.formatTime(data.DeptCreateTime)}</div></div>
                    </div>
                </div>
                <div class="cp-detail-section">
                    <h3><i class="fas fa-users"></i> 部门员工</h3>
                    <div id="emp-table-container" style="height:400px;"></div>
                </div>`;

            // 初始化 TableEngine 实例
            initEmployeeTable();
        } catch (e) {
            containerEl.innerHTML = `<div class="cp-error"><i class="fas fa-exclamation-circle" style="margin-right:6px;"></i> 网络错误: ${CompanyUtils.esc(e.message)}</div>`;
        }
    }

    function initEmployeeTable() {
        empTable = new TableEngine({
            container: '#emp-table-container',
            height: '400px',
            tableName: 'UserRole',
            columns: [
                { field: 'UserRoleUUID', title: '关联UUID', primaryKey: true, editable: false, hideInForm: true },
                CompanyUtils.epColumn('UserUUID', '用户名', 'User', { editable: false }),
                CompanyUtils.epColumn('RoleUUID', '角色名', 'Role'),
                { field: 'RoleType', title: '角色类型', type: 'select', options: [{ value: 0, label: '员工' }, { value: 1, label: '负责人' }] },
                { field: 'CreateTime', title: '创建时间', type: 'datetime', editable: false },
            ],
            data: [],
            pageSize: 20,
            columnDistribution: 'equal',
            showPagination: true,
            showCheckbox: true,
            editable: true,
            sortable: true,
            filterable: true,
            striped: true,
            hoverable: true,
            bordered: true,
            api: {
                get: buildApiUrl('/API/FormAPI/Get/UserRole', { DeptUUID: deptUUID }),
                add: buildApiUrl('/API/FormAPI/Add/UserRole', { DeptUUID: deptUUID }),
                edit: buildApiUrl('/API/FormAPI/Modify/UserRole/<id>'),
                modify: buildApiUrl('/API/FormAPI/ModifyItem/UserRole/<id>'),
                delete: buildApiUrl('/API/FormAPI/Delete/UserRole/<id>'),
            },
            onView: (row) => {
                let url = `/pages/Company/employee-detail.html?UserUUID=${encodeURIComponent(row.UserUUID || '')}`;
                if (currentServer !== 'gvsds-master') url += `&server=${encodeURIComponent(currentServer)}`;
                GERP.Navigate(url, row.UserUUID_label || '员工详情');
            },
        });
    }

    /** 编辑按钮：弹出编辑对话框 */
    async function handleEdit() {
        if (!currentData) return;
        CompanyUtils.showEditDialog({
            tableName: 'Department',
            data: currentData,
            onSave: () => {
                if (window.GERPUI && typeof window.GERPUI.ShowToast === 'function') {
                    window.GERPUI.ShowToast({ message: '保存成功', type: 'success' });
                }
                init();
            }
        });
    }

    init();
</script>