@yss123/cage-admin 0.0.0-stage → 0.2.0

package/ui/dist/modules/operations/operations-page.js

@@ -0,0 +1,95 @@
+import { api, can, run } from '../../shared/api.js';
+import { badge, field, formatTime, h, icon, modal, panel, table } from '../../shared/dom.js';
+import { capabilityName, eventName, jobName, statusName } from '../../shared/labels.js';
+import { navigate } from '../../shared/navigation.js';
+export async function renderOperations(main) {
+    const [summary, dead, jobs] = await Promise.all([
+        api('GET', '/api/sys/ops/summary'),
+        api('GET', '/api/sys/ops/dead-letters'),
+        api('GET', '/api/sys/ops/jobs'),
+    ]);
+    const manageable = can('Sys.ops.manage');
+    main.append(h('div', { class: 'stats-row' }, stat('待投递事件', summary.outbox.reduce((sum, item) => sum + item.n, 0), 'inbox'), stat('待处理死信', summary.deadLetters, 'info', summary.deadLetters > 0), stat('运行中定时任务', jobs.filter((job) => job.enabled).length, 'clock')));
+    main.append(panel('事件投递队列', '事件由后台 worker 按顺序投递，失败后自动退避重试。', table([
+        [
+            '处理状态',
+            (item) => badge(statusName(item.status), item.status === 'pending' ? 'amber' : 'neutral'),
+        ],
+        ['事件数量', (item) => h('strong', {}, item.n)],
+        ['最早进入时间', (item) => formatTime(item.oldest)],
+    ], summary.outbox, '投递队列已清空，没有积压事件')));
+    main.append(panel('需要处理的死信', '请先排查失败原因再重放。同一单据的后续事件会等待这条事件处理完成。', table([
+        [
+            '业务事件',
+            (item) => h('div', { class: 'stack-cell' }, h('strong', {}, eventName(item.event)), h('code', {}, item.event)),
+        ],
+        ['关联单据', (item) => h('code', { title: item.aggregate_id }, item.aggregate_id.slice(0, 12))],
+        ['尝试次数', (item) => badge(`${item.attempts} 次`, 'amber')],
+        [
+            '失败原因',
+            (item) => h('details', {}, h('summary', { class: 'failure-summary' }, (item.error || '无错误说明').slice(0, 65)), h('pre', {}, item.error || '无错误说明')),
+        ],
+        ['进入时间', (item) => formatTime(item.created_at)],
+        [
+            '处理',
+            (item) => manageable
+                ? h('div', { class: 'row-actions' }, h('button', {
+                    class: 'small primary',
+                    onclick: async (event) => {
+                        if (await run(() => api('POST', `/api/sys/ops/dead-letters/${item.id}/replay`), '事件已重新进入投递队列', event.currentTarget))
+                            navigate('ops');
+                    },
+                }, '重新投递'), h('button', { class: 'small danger', onclick: () => discard(item) }, '丢弃'))
+                : h('span', { class: 'muted' }, '仅查看'),
+        ],
+    ], dead, '当前没有待处理的死信')));
+    main.append(panel('定时任务', '按业务声明的时间执行；停用后不会继续触发新的调度。', table([
+        [
+            '任务名称',
+            (job) => h('div', { class: 'stack-cell' }, h('strong', {}, jobName(job.name)), h('code', {}, job.name)),
+        ],
+        ['执行计划', (job) => h('code', {}, job.cron)],
+        [
+            '业务操作',
+            (job) => h('div', { class: 'tag-list' }, job.calls.map((name) => badge(capabilityName(name)))),
+        ],
+        [
+            '上次运行',
+            (job) => h('div', { class: 'stack-cell' }, formatTime(job.lastRunAt), job.lastStatus &&
+                badge(statusName(job.lastStatus), job.lastStatus === 'ok' ? 'green' : 'amber')),
+        ],
+        [
+            '下次计划',
+            (job) => (job.enabled ? formatTime(job.nextRunAt) : h('span', { class: 'muted' }, '已暂停调度')),
+        ],
+        [
+            '状态与操作',
+            (job) => h('div', { class: 'row-actions' }, badge(job.enabled ? '运行中' : '已停用', job.enabled ? 'green' : 'neutral'), manageable &&
+                h('button', {
+                    class: 'small',
+                    onclick: async (event) => {
+                        if (await run(() => api('POST', `/api/sys/ops/jobs/${encodeURIComponent(job.name)}/${job.enabled ? 'disable' : 'enable'}`), '定时任务状态已更新', event.currentTarget))
+                            navigate('ops');
+                    },
+                }, job.enabled ? '停用' : '启用')),
+        ],
+    ], jobs, '当前业务没有声明定时任务')));
+    function discard(item) {
+        const confirm = h('input', { type: 'checkbox', required: true });
+        const save = h('button', { class: 'danger', type: 'submit' }, '确认丢弃事件');
+        const form = h('form', {
+            class: 'stack-form',
+            onsubmit: async (event) => {
+                event.preventDefault();
+                if (await run(() => api('POST', `/api/sys/ops/dead-letters/${item.id}/discard`), '事件已丢弃', save)) {
+                    dialog.close();
+                    navigate('ops');
+                }
+            },
+        }, h('p', {}, '丢弃后，这条事件将不再重试。请确认业务补偿或人工处理已经完成。'), field('我已了解此操作会停止该事件的后续处理', confirm), h('div', { class: 'form-actions' }, save));
+        const dialog = modal('丢弃死信事件', form);
+    }
+}
+function stat(label, value, glyph, warning = false) {
+    return h('div', { class: `stat-card ${warning ? 'attention' : ''}` }, h('span', { class: 'stat-icon' }, icon(glyph)), h('div', {}, h('span', {}, label), h('strong', {}, value)));
+}

package/ui/dist/modules/operations/sync-page.js

@@ -0,0 +1,48 @@
+import { api, run, state } from '../../shared/api.js';
+import { badge, field, formatTime, h, panel, table } from '../../shared/dom.js';
+export async function renderSync(main) {
+    const connector = h('input', { placeholder: '连接器标识，留空查看全部' });
+    const status = h('select', {}, h('option', { value: '' }, '全部结果'), h('option', { value: 'ok' }, '同步成功'), h('option', { value: 'failed' }, '同步失败'));
+    const query = h('button', { class: 'primary', type: 'submit' }, '查询记录');
+    const out = h('div');
+    main.append(panel('外部系统同步记录', '查看出站请求的结果、重试次数与失败原因，辅助第三方联调与排障。', h('form', {
+        class: 'sync-filters',
+        onsubmit: (event) => {
+            event.preventDefault();
+            void load();
+        },
+    }, field('连接器', connector), field('同步结果', status), query), out));
+    async function load() {
+        const params = new URLSearchParams();
+        if (connector.value)
+            params.set('connector', connector.value);
+        if (status.value)
+            params.set('status', status.value);
+        const result = await run(() => api('GET', `/api/sys/ops/sync-records?${params}`), undefined, query);
+        if (!result)
+            return;
+        out.replaceChildren(table([
+            [
+                '连接器 / 操作',
+                (item) => h('div', { class: 'stack-cell' }, h('strong', {}, state.catalog.labels[`connector:connector:${item.connector}`] ||
+                    state.catalog.labels[`connector:${item.connector}`] ||
+                    '外部系统连接器'), h('code', {}, `${item.connector}.${item.operation}`)),
+            ],
+            ['业务单据', (item) => h('code', {}, item.ref_id || '—')],
+            [
+                '同步结果',
+                (item) => badge(item.status === 'ok' ? '同步成功' : '同步失败', item.status === 'ok' ? 'green' : 'red'),
+            ],
+            ['响应状态', (item) => item.http_status ?? '未收到响应'],
+            ['尝试次数', (item) => `${item.attempts} 次`],
+            [
+                '错误详情',
+                (item) => item.error
+                    ? h('details', {}, h('summary', {}, '查看原因'), h('pre', {}, item.error))
+                    : h('span', { class: 'muted' }, '—'),
+            ],
+            ['最近更新', (item) => formatTime(item.updated_at)],
+        ], result, '暂无符合条件的同步记录'));
+    }
+    await load();
+}

package/ui/dist/modules/org/index.js

@@ -0,0 +1 @@
+export { renderOrg } from './org-page.js';

package/ui/dist/modules/org/org-page.js

@@ -0,0 +1,213 @@
+import { api, can, run } from '../../shared/api.js';
+import { badge, field, h, icon, modal, panel, searchInput, table } from '../../shared/dom.js';
+import { navigate } from '../../shared/navigation.js';
+/** 组织编辑继续走生成命令；负责人和角色是两份配置，在界面上明确区分。 */
+export async function renderOrg(main) {
+    const [departments, people, roleResult] = await Promise.all([
+        can('Dept.read')
+            ? api('GET', '/api/dept?pageSize=200&sort=createdAt')
+            : Promise.resolve({ items: [], total: 0 }),
+        can('User.read')
+            ? api('GET', '/api/user?pageSize=200&status=active,disabled')
+            : Promise.resolve({ items: [], total: 0 }),
+        can('Role.read')
+            ? api('GET', '/api/role?pageSize=200')
+            : Promise.resolve({ items: [] }),
+    ]);
+    const depts = departments.items, users = people.items, roles = roleResult.items;
+    const departmentName = new Map(depts.map((dept) => [dept.id, dept.name]));
+    const userName = new Map(users.map((user) => [user.id, `${user.name}（${user.username}）`]));
+    const roleName = new Map(roles.map((role) => [role.id, role.name]));
+    const depth = (dept) => Math.max(0, dept.ancestors.split('/').filter(Boolean).length - 1);
+    const selectDepartment = (value) => h('select', { ...(value ? { value } : {}) }, depts.map((dept) => h('option', { value: dept.id }, `${'　'.repeat(depth(dept))}${dept.name}`)));
+    main.append(h('div', { class: 'stats-row' }, stat('部门', departments.total, 'grid'), stat('用户', people.total, 'users'), stat('当前列表已启用', users.filter((user) => user.status === 'active').length, 'check')));
+    const deptPanel = panel('部门与负责人', '部门负责人用于审批选人；给用户分配经理角色后，仍需在这里指定负责人。');
+    const departmentActions = h('div', { class: 'section-actions' });
+    if (can('Dept.create') && depts.length)
+        departmentActions.append(h('button', { class: 'small', onclick: createDepartment }, icon('plus'), '新建部门'));
+    deptPanel.querySelector('.panel-heading').append(departmentActions);
+    deptPanel.append(table([
+        [
+            '部门名称',
+            (dept) => h('div', { class: 'entity-cell', style: `padding-left:${depth(dept) * 20}px` }, h('span', { class: 'entity-icon' }, icon('grid')), h('strong', {}, dept.name)),
+        ],
+        ['部门编码', (dept) => h('code', { class: 'muted' }, dept.code || '—')],
+        [
+            '部门负责人',
+            (dept) => {
+                if (!can('Dept.update') || !can('User.read'))
+                    return userName.get(dept.leaderId ?? '') || '未设置';
+                const select = h('select', {
+                    value: dept.leaderId ?? '',
+                    'aria-label': `${dept.name}负责人`,
+                    onchange: async () => {
+                        select.disabled = true;
+                        const updated = await run(() => api('POST', `/api/dept/${dept.id}/update`, { leaderId: select.value || null }), '部门负责人已保存');
+                        if (updated)
+                            dept.leaderId = updated.leaderId;
+                        else
+                            select.value = dept.leaderId ?? '';
+                        select.disabled = false;
+                    },
+                }, h('option', { value: '' }, '请选择负责人'), users
+                    .filter((user) => user.status === 'active')
+                    .map((user) => h('option', { value: user.id }, userName.get(user.id))));
+                return select;
+            },
+        ],
+        [
+            '状态',
+            (dept) => badge(dept.status === 'active' ? '已启用' : '已停用', dept.status === 'active' ? 'green' : 'neutral'),
+        ],
+    ], depts));
+    if (can('Dept.read'))
+        main.append(deptPanel);
+    if (can('User.read')) {
+        const out = h('div');
+        let query = '';
+        const toolbar = h('div', { class: 'table-toolbar' }, searchInput('搜索姓名、账号或部门', (value) => {
+            query = value.toLowerCase();
+            renderUsers();
+        }));
+        if (can('User.create'))
+            toolbar.append(h('button', { class: 'primary', disabled: !depts.length, onclick: createUser }, icon('plus'), '新建用户'));
+        const userPanel = panel('用户与角色', '通过角色分配操作权限；账号停用后将无法继续访问系统。', toolbar, out);
+        main.append(userPanel);
+        function renderUsers() {
+            const visible = users.filter((user) => `${user.name} ${user.username} ${departmentName.get(user.deptId) ?? ''}`
+                .toLowerCase()
+                .includes(query));
+            out.replaceChildren(table([
+                [
+                    '用户',
+                    (user) => h('div', { class: 'person-cell' }, h('span', { class: 'person-avatar' }, user.name.slice(0, 1)), h('div', {}, h('strong', {}, user.name), h('small', {}, user.username))),
+                ],
+                ['所属部门', (user) => departmentName.get(user.deptId) || '未获取部门名称'],
+                [
+                    '拥有角色',
+                    (user) => h('div', { class: 'tag-list' }, user.roleIds.length
+                        ? user.roleIds.map((id) => badge(roleName.get(id) || '未获取角色名称'))
+                        : h('span', { class: 'muted' }, '尚未分配'), can('User.assignRoles') && can('Role.read') && user.status === 'active'
+                        ? h('button', { class: 'text-button', onclick: () => assignRoles(user) }, '配置')
+                        : null),
+                ],
+                [
+                    '状态',
+                    (user) => badge(user.status === 'active' ? '已启用' : '已停用', user.status === 'active' ? 'green' : 'neutral'),
+                ],
+                [
+                    '账号操作',
+                    (user) => h('div', { class: 'row-actions' }, can('User.setPassword') && user.status === 'active'
+                        ? h('button', { class: 'text-button', onclick: () => resetPassword(user) }, '重置密码')
+                        : null, user.status === 'active' && can('User.disable')
+                        ? h('button', {
+                            class: 'text-button danger',
+                            onclick: async (event) => {
+                                if (await run(() => api('POST', `/api/user/${user.id}/disable`), '账号已停用', event.currentTarget))
+                                    navigate('org');
+                            },
+                        }, '停用')
+                        : null, user.status === 'disabled' && can('User.enable')
+                        ? h('button', {
+                            class: 'text-button',
+                            onclick: async (event) => {
+                                if (await run(() => api('POST', `/api/user/${user.id}/enable`), '账号已启用', event.currentTarget))
+                                    navigate('org');
+                            },
+                        }, '启用')
+                        : null),
+                ],
+            ], visible));
+        }
+        renderUsers();
+    }
+    if (people.total > users.length || departments.total > depts.length)
+        main.append(h('p', { class: 'muted' }, '当前仅展示前 200 条可见组织记录；超出部分请通过业务组织接口查询。'));
+    function createDepartment() {
+        const name = h('input', { required: true, maxlength: 100, placeholder: '例如：采购部' });
+        const parent = selectDepartment();
+        const save = h('button', { type: 'submit', class: 'primary' }, '创建部门');
+        const form = h('form', {
+            class: 'stack-form',
+            onsubmit: async (event) => {
+                event.preventDefault();
+                if (await run(() => api('POST', '/api/dept/create', { name: name.value, parentId: parent.value }), '部门已创建', save)) {
+                    dialog.close();
+                    navigate('org');
+                }
+            },
+        }, field('部门名称', name), field('上级部门', parent), h('div', { class: 'form-actions' }, save));
+        const dialog = modal('新建部门', form);
+        name.focus();
+    }
+    function createUser() {
+        const username = h('input', { required: true, placeholder: '用于登录的账号', autocomplete: 'off' });
+        const name = h('input', { required: true, placeholder: '用户真实姓名' });
+        const department = selectDepartment();
+        const save = h('button', { type: 'submit', class: 'primary' }, '创建用户');
+        const form = h('form', {
+            class: 'stack-form',
+            onsubmit: async (event) => {
+                event.preventDefault();
+                if (await run(() => api('POST', '/api/user/create', {
+                    username: username.value,
+                    name: name.value,
+                    deptId: department.value,
+                }), '用户已创建，请设置密码并分配角色', save)) {
+                    dialog.close();
+                    navigate('org');
+                }
+            },
+        }, field('登录账号', username), field('用户姓名', name), field('所属部门', department), h('p', { class: 'inline-info' }, icon('info'), '新用户默认没有角色。创建后请设置登录密码，并按职责配置角色。'), h('div', { class: 'form-actions' }, save));
+        const dialog = modal('新建用户', form);
+        username.focus();
+    }
+    function assignRoles(user) {
+        const selected = new Set(user.roleIds);
+        const save = h('button', { class: 'primary', type: 'submit' }, '保存角色');
+        const form = h('form', {
+            class: 'stack-form',
+            onsubmit: async (event) => {
+                event.preventDefault();
+                if (await run(() => api('POST', `/api/user/${user.id}/assign-roles`, { roleIds: [...selected] }), '用户角色已保存', save)) {
+                    dialog.close();
+                    navigate('org');
+                }
+            },
+        }, h('p', { class: 'muted' }, `为 ${user.name} 选择角色，多个角色的有效权限会共同生效。`), h('div', { class: 'choice-list' }, roles
+            .filter((role) => role.status === 'active')
+            .map((role) => h('label', {}, h('input', {
+            type: 'checkbox',
+            checked: selected.has(role.id),
+            onchange: (event) => {
+                event.currentTarget.checked
+                    ? selected.add(role.id)
+                    : selected.delete(role.id);
+            },
+        }), h('span', {}, h('strong', {}, role.name), h('small', {}, role.code))))), h('div', { class: 'form-actions' }, save));
+        const dialog = modal('配置用户角色', form);
+    }
+    function resetPassword(user) {
+        const password = h('input', {
+            type: 'password',
+            minlength: 8,
+            required: true,
+            autocomplete: 'new-password',
+            placeholder: '至少 8 位',
+        });
+        const save = h('button', { type: 'submit', class: 'primary' }, '保存新密码');
+        const form = h('form', {
+            class: 'stack-form',
+            onsubmit: async (event) => {
+                event.preventDefault();
+                if (await run(() => api('POST', `/api/user/${user.id}/set-password`, { password: password.value }), '密码已重置', save))
+                    dialog.close();
+            },
+        }, h('p', { class: 'muted' }, `正在为 ${user.name}（${user.username}）设置新密码。`), field('新密码', password), h('div', { class: 'form-actions' }, save));
+        const dialog = modal('重置登录密码', form);
+        password.focus();
+    }
+}
+function stat(label, value, glyph) {
+    return h('div', { class: 'stat-card' }, h('span', { class: 'stat-icon' }, icon(glyph)), h('div', {}, h('span', {}, label), h('strong', {}, value)));
+}

package/ui/dist/modules/roles/index.js

@@ -0,0 +1 @@
+export { renderRoles } from './roles-page.js';