1040 lines
37 KiB
JavaScript
1040 lines
37 KiB
JavaScript
document.body.addEventListener('htmx:responseError', (event) => {
|
||
const target = event.detail.target;
|
||
if (target) {
|
||
target.innerHTML = '<div class="alert alert-danger">요청 처리 중 오류가 발생했습니다.</div>';
|
||
}
|
||
});
|
||
|
||
function resetFilterToggle(button, target) {
|
||
if (!button || !target) {
|
||
return;
|
||
}
|
||
button.setAttribute('aria-expanded', 'false');
|
||
button.classList.remove('active');
|
||
target.innerHTML = button.dataset.toggleDefaultText || 'Filter 이름을 클릭하면 policy/filter source가 표시됩니다.';
|
||
}
|
||
|
||
function setFilterToggleLoading(button, target) {
|
||
if (!button || !target) {
|
||
return;
|
||
}
|
||
button.setAttribute('aria-expanded', 'true');
|
||
button.classList.add('active');
|
||
target.innerHTML = button.dataset.toggleLoadingText || 'policy/filter source를 조회하는 중입니다.';
|
||
}
|
||
|
||
function findHtmxTarget(button) {
|
||
const selector = button?.getAttribute('hx-target') || button?.getAttribute('data-hx-target');
|
||
return selector ? document.querySelector(selector) : null;
|
||
}
|
||
|
||
function syncPolicyTemplate(select) {
|
||
const form = select?.closest('form');
|
||
if (!form) {
|
||
return;
|
||
}
|
||
const option = select.options[select.selectedIndex];
|
||
const hasTemplate = Boolean(option?.dataset.policyName);
|
||
const policyName = form.querySelector('[data-policy-template-field="policyName"]');
|
||
const functionKey = form.querySelector('[data-policy-template-field="functionKey"]');
|
||
const enabled = form.querySelector('[data-policy-template-field="enabled"]');
|
||
const updateCheck = form.querySelector('[data-policy-template-field="updateCheck"]');
|
||
if (policyName) {
|
||
policyName.value = option?.dataset.policyName || '';
|
||
}
|
||
if (functionKey) {
|
||
functionKey.value = option?.dataset.functionKey || '';
|
||
}
|
||
if (enabled) {
|
||
enabled.checked = hasTemplate ? option?.dataset.enabled === 'true' : true;
|
||
}
|
||
if (updateCheck) {
|
||
updateCheck.checked = hasTemplate ? option?.dataset.updateCheck === 'true' : false;
|
||
}
|
||
const selectedStatements = (hasTemplate ? option?.dataset.statementTypes || '' : 'SELECT')
|
||
.split(',')
|
||
.map((value) => value.trim())
|
||
.filter(Boolean);
|
||
form.querySelectorAll('[data-policy-template-statement]').forEach((checkbox) => {
|
||
checkbox.checked = selectedStatements.includes(checkbox.value);
|
||
});
|
||
const preview = (name, value) => {
|
||
const target = form.querySelector(`[data-policy-template-preview="${name}"]`);
|
||
if (target) {
|
||
target.textContent = value;
|
||
}
|
||
};
|
||
preview('policyName', option?.dataset.policyName || '선택 전');
|
||
preview('functionKey', option?.dataset.functionKey || '선택 전');
|
||
preview('statementTypes', selectedStatements.join(', ') || 'SELECT');
|
||
preview(
|
||
'options',
|
||
`Enabled: ${enabled?.checked ? 'YES' : 'NO'} / Check: ${updateCheck?.checked ? 'YES' : 'NO'}`
|
||
);
|
||
}
|
||
|
||
function closeMenuGroup(group) {
|
||
if (!group) {
|
||
return;
|
||
}
|
||
group.classList.remove('open');
|
||
group.querySelector('.rw-menu-trigger')?.setAttribute('aria-expanded', 'false');
|
||
}
|
||
|
||
function closeAllMenuGroups(exceptGroup = null) {
|
||
document.querySelectorAll('.rw-menu-group.open').forEach((group) => {
|
||
if (group !== exceptGroup) {
|
||
closeMenuGroup(group);
|
||
}
|
||
});
|
||
}
|
||
|
||
function initPersistentMenus() {
|
||
document.querySelectorAll('.rw-menu-trigger').forEach((button) => {
|
||
button.addEventListener('click', (event) => {
|
||
event.stopPropagation();
|
||
const group = button.closest('.rw-menu-group');
|
||
if (!group) {
|
||
return;
|
||
}
|
||
const nextOpen = !group.classList.contains('open');
|
||
closeAllMenuGroups(group);
|
||
group.classList.toggle('open', nextOpen);
|
||
button.setAttribute('aria-expanded', String(nextOpen));
|
||
});
|
||
});
|
||
document.addEventListener('click', (event) => {
|
||
if (!event.target.closest('.rw-menu')) {
|
||
closeAllMenuGroups();
|
||
}
|
||
});
|
||
document.addEventListener('keydown', (event) => {
|
||
if (event.key === 'Escape') {
|
||
closeAllMenuGroups();
|
||
}
|
||
});
|
||
}
|
||
|
||
function initQuestionPresets(root = document) {
|
||
root.querySelectorAll('.question-preset[data-target]').forEach((button) => {
|
||
if (button.dataset.presetReady === 'true') {
|
||
return;
|
||
}
|
||
button.dataset.presetReady = 'true';
|
||
button.addEventListener('click', () => {
|
||
const target = document.getElementById(button.dataset.target || '');
|
||
if (target) {
|
||
target.value = button.dataset.question || '';
|
||
target.focus();
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
function initCopyButtons(root = document) {
|
||
root.querySelectorAll('[data-copy-source]').forEach((button) => {
|
||
if (button.dataset.copyReady === 'true') {
|
||
return;
|
||
}
|
||
button.dataset.copyReady = 'true';
|
||
button.addEventListener('click', async () => {
|
||
const source = document.getElementById(button.dataset.copySource || '');
|
||
const value = source?.textContent?.trim();
|
||
if (!value) {
|
||
return;
|
||
}
|
||
try {
|
||
await navigator.clipboard.writeText(value);
|
||
button.textContent = '복사했습니다';
|
||
} catch (error) {
|
||
button.textContent = '복사 실패 · 직접 선택하세요';
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
function escapeHtml(value) {
|
||
return value
|
||
.replaceAll('&', '&')
|
||
.replaceAll('<', '<')
|
||
.replaceAll('>', '>')
|
||
.replaceAll('"', '"')
|
||
.replaceAll("'", ''');
|
||
}
|
||
|
||
function renderInlineMarkdown(value) {
|
||
return escapeHtml(value)
|
||
.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>')
|
||
.replace(/`([^`]+)`/g, '<code>$1</code>');
|
||
}
|
||
|
||
function isMarkdownTable(lines, index) {
|
||
if (index + 1 >= lines.length) {
|
||
return false;
|
||
}
|
||
return lines[index].trim().startsWith('|')
|
||
&& lines[index + 1].trim().startsWith('|')
|
||
&& /^\|?\s*:?-{3,}:?\s*(\|\s*:?-{3,}:?\s*)+\|?$/.test(lines[index + 1].trim());
|
||
}
|
||
|
||
function splitMarkdownTableRow(line) {
|
||
return line.trim()
|
||
.replace(/^\|/, '')
|
||
.replace(/\|$/, '')
|
||
.split('|')
|
||
.map((cell) => cell.trim());
|
||
}
|
||
|
||
function renderMarkdownTable(lines, start) {
|
||
const headers = splitMarkdownTableRow(lines[start]);
|
||
let cursor = start + 2;
|
||
const rows = [];
|
||
while (cursor < lines.length && lines[cursor].trim().startsWith('|')) {
|
||
rows.push(splitMarkdownTableRow(lines[cursor]));
|
||
cursor += 1;
|
||
}
|
||
const headerHtml = headers.map((cell) => `<th>${renderInlineMarkdown(cell)}</th>`).join('');
|
||
const bodyHtml = rows.map((row) => {
|
||
const cells = headers.map((_, index) => `<td>${renderInlineMarkdown(row[index] || '')}</td>`).join('');
|
||
return `<tr>${cells}</tr>`;
|
||
}).join('');
|
||
return {
|
||
html: `<table><thead><tr>${headerHtml}</tr></thead><tbody>${bodyHtml}</tbody></table>`,
|
||
next: cursor
|
||
};
|
||
}
|
||
|
||
function renderMarkdownText(markdown) {
|
||
const lines = markdown.replace(/\r\n/g, '\n').split('\n');
|
||
const html = [];
|
||
let listType = null;
|
||
const closeList = () => {
|
||
if (listType) {
|
||
html.push(`</${listType}>`);
|
||
listType = null;
|
||
}
|
||
};
|
||
for (let i = 0; i < lines.length; i += 1) {
|
||
const line = lines[i];
|
||
const trimmed = line.trim();
|
||
if (!trimmed) {
|
||
closeList();
|
||
continue;
|
||
}
|
||
if (isMarkdownTable(lines, i)) {
|
||
closeList();
|
||
const table = renderMarkdownTable(lines, i);
|
||
html.push(table.html);
|
||
i = table.next - 1;
|
||
continue;
|
||
}
|
||
const heading = trimmed.match(/^(#{2,4})\s+(.+)$/);
|
||
if (heading) {
|
||
closeList();
|
||
const level = Math.min(heading[1].length, 3);
|
||
html.push(`<h${level}>${renderInlineMarkdown(heading[2])}</h${level}>`);
|
||
continue;
|
||
}
|
||
const unordered = trimmed.match(/^[-*]\s+(.+)$/);
|
||
if (unordered) {
|
||
if (listType !== 'ul') {
|
||
closeList();
|
||
listType = 'ul';
|
||
html.push('<ul>');
|
||
}
|
||
html.push(`<li>${renderInlineMarkdown(unordered[1])}</li>`);
|
||
continue;
|
||
}
|
||
const ordered = trimmed.match(/^\d+\.\s+(.+)$/);
|
||
if (ordered) {
|
||
if (listType !== 'ol') {
|
||
closeList();
|
||
listType = 'ol';
|
||
html.push('<ol>');
|
||
}
|
||
html.push(`<li>${renderInlineMarkdown(ordered[1])}</li>`);
|
||
continue;
|
||
}
|
||
closeList();
|
||
html.push(`<p>${renderInlineMarkdown(trimmed)}</p>`);
|
||
}
|
||
closeList();
|
||
return html.join('');
|
||
}
|
||
|
||
function renderMarkdownViews(root = document) {
|
||
root.querySelectorAll('[data-markdown-view]').forEach((view) => {
|
||
if (view.dataset.rendered === 'true') {
|
||
return;
|
||
}
|
||
view.innerHTML = renderMarkdownText(view.textContent || '');
|
||
view.dataset.rendered = 'true';
|
||
});
|
||
}
|
||
|
||
function filterUserRoleDetail() {
|
||
const master = document.getElementById('userRoleMaster');
|
||
const table = document.getElementById('userRoleDetail');
|
||
if (!master || !table) {
|
||
return;
|
||
}
|
||
const selected = master.value;
|
||
let shown = 0;
|
||
table.querySelectorAll('tbody tr[data-user-id]').forEach((row) => {
|
||
const visible = row.dataset.userId === selected;
|
||
row.hidden = !visible;
|
||
shown += visible ? 1 : 0;
|
||
});
|
||
let empty = table.querySelector('tbody tr.empty-user-role-runtime');
|
||
if (!empty) {
|
||
empty = document.createElement('tr');
|
||
empty.className = 'empty-user-role-runtime';
|
||
empty.innerHTML = '<td colspan="3" class="text-muted">선택한 사용자에게 부여된 역할이 없습니다.</td>';
|
||
table.querySelector('tbody').appendChild(empty);
|
||
}
|
||
empty.hidden = shown !== 0;
|
||
}
|
||
|
||
function filterGroupDetail(masterId) {
|
||
const master = document.getElementById(masterId);
|
||
const table = document.querySelector(`[data-group-detail-table="${masterId}"]`);
|
||
if (!master || !table) {
|
||
return;
|
||
}
|
||
const selected = master.value;
|
||
let shown = 0;
|
||
table.querySelectorAll('tbody tr[data-group-id]').forEach((row) => {
|
||
const visible = row.dataset.groupId === selected;
|
||
row.hidden = !visible;
|
||
shown += visible ? 1 : 0;
|
||
});
|
||
let empty = table.querySelector('tbody tr.empty-group-detail-runtime');
|
||
if (!empty) {
|
||
empty = document.createElement('tr');
|
||
empty.className = 'empty-group-detail-runtime';
|
||
empty.innerHTML = `<td colspan="3" class="text-muted">${escapeHtml(table.dataset.emptyMessage || '선택한 그룹에 등록된 항목이 없습니다.')}</td>`;
|
||
table.querySelector('tbody').appendChild(empty);
|
||
}
|
||
empty.hidden = shown !== 0;
|
||
}
|
||
|
||
function renderRuleColumnOptions(columns) {
|
||
document.querySelectorAll('.rule-column-select').forEach((select) => {
|
||
const current = select.value;
|
||
select.innerHTML = '<option value="">기본 컬럼</option>' + columns
|
||
.map((column) => `<option value="${column}">${column}</option>`)
|
||
.join('');
|
||
if (columns.includes(current)) {
|
||
select.value = current;
|
||
}
|
||
});
|
||
}
|
||
|
||
function renderMaskableColumnOptions(option) {
|
||
const list = document.querySelector('[data-maskable-column-list]');
|
||
if (!list) {
|
||
return;
|
||
}
|
||
const columns = (option?.dataset.maskableColumns || '').split(',').filter(Boolean);
|
||
const labels = (option?.dataset.maskableLabels || '').split('|').filter(Boolean);
|
||
if (!columns.length) {
|
||
list.innerHTML = '<span class="text-muted small">선택한 객체에 권한별로 허용할 마스킹 컬럼이 없습니다.</span>';
|
||
return;
|
||
}
|
||
list.innerHTML = columns.map((column, index) => (
|
||
`<button class="btn btn-sm btn-outline-secondary question-preset" type="button" data-mask-column="${column}">`
|
||
+ `${escapeHtml(labels[index] || column)}</button>`
|
||
)).join('');
|
||
list.querySelectorAll('[data-mask-column]').forEach((button) => {
|
||
button.addEventListener('click', () => {
|
||
const input = document.querySelector('input[name="visibleColumns"]');
|
||
if (!input) {
|
||
return;
|
||
}
|
||
const current = input.value.split(',').map((value) => value.trim()).filter(Boolean);
|
||
const column = button.dataset.maskColumn;
|
||
if (!current.includes(column)) {
|
||
current.push(column);
|
||
}
|
||
input.value = current.join(', ');
|
||
renderSelectedVisibleColumns();
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
});
|
||
}
|
||
|
||
function renderSelectedVisibleColumns() {
|
||
const input = document.querySelector('input[name="visibleColumns"]');
|
||
const list = document.querySelector('[data-selected-visible-columns]');
|
||
if (!input || !list) {
|
||
return;
|
||
}
|
||
const columns = input.value.split(',').map((value) => value.trim().toUpperCase()).filter(Boolean);
|
||
list.innerHTML = columns.map((column) => (
|
||
`<button type="button" class="badge text-bg-secondary border-0 me-1 mb-1" data-remove-visible-column="${column}">`
|
||
+ `${escapeHtml(column)} ×</button>`
|
||
)).join('');
|
||
list.querySelectorAll('[data-remove-visible-column]').forEach((button) => {
|
||
button.addEventListener('click', () => {
|
||
const remove = button.dataset.removeVisibleColumn;
|
||
input.value = columns.filter((column) => column !== remove).join(', ');
|
||
renderSelectedVisibleColumns();
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
});
|
||
}
|
||
|
||
function syncRuleTypeHints(root = document) {
|
||
root.querySelectorAll('.rule-row').forEach((row) => {
|
||
const typeSelect = row.querySelector('.rule-type-select');
|
||
const columnSelect = row.querySelector('.rule-column-select');
|
||
const valueInput = row.querySelector('input[name="ruleValue"]');
|
||
if (!typeSelect || !columnSelect || !valueInput) {
|
||
return;
|
||
}
|
||
|
||
const type = typeSelect.value;
|
||
const valueRequired = ['=', '!=', 'DEPT', 'EMP_NO', 'TAG'].includes(type);
|
||
const columnOptional = ['ALL', 'MY_DEPT', 'SELF', 'DEPT', 'EMP_NO', 'TAG'].includes(type);
|
||
const placeholderByType = {
|
||
ALL: '값 불필요',
|
||
MY_DEPT: '값 불필요',
|
||
SELF: '값 불필요',
|
||
DEPT: '예: HR',
|
||
EMP_NO: '예: E2001',
|
||
TAG: '예: SPRING_BOOT',
|
||
'=': '비교 값',
|
||
'!=': '비교 값'
|
||
};
|
||
|
||
columnSelect.required = !columnOptional;
|
||
valueInput.required = valueRequired;
|
||
valueInput.disabled = ['ALL', 'MY_DEPT', 'SELF'].includes(type);
|
||
valueInput.placeholder = placeholderByType[type] || '비교 값';
|
||
if (valueInput.disabled) {
|
||
valueInput.value = '';
|
||
}
|
||
});
|
||
}
|
||
|
||
async function syncRuleColumnOptions() {
|
||
const objectSelect = document.querySelector('select[name="objectRef"]');
|
||
if (!objectSelect) {
|
||
return;
|
||
}
|
||
const selectedOption = objectSelect.options[objectSelect.selectedIndex];
|
||
const fallbackColumns = (selectedOption?.dataset.columns || '').split(',').filter(Boolean);
|
||
const applyColumns = (columns) => {
|
||
if (selectedOption) {
|
||
selectedOption.dataset.columns = columns.join(',');
|
||
}
|
||
renderRuleColumnOptions(columns);
|
||
updatePermissionWizardPreview(document);
|
||
};
|
||
renderMaskableColumnOptions(selectedOption);
|
||
applyColumns(fallbackColumns);
|
||
try {
|
||
const response = await fetch(`/permissions/object-columns?objectRef=${encodeURIComponent(objectSelect.value)}`);
|
||
if (!response.ok) {
|
||
return;
|
||
}
|
||
const columns = await response.json();
|
||
applyColumns(Array.isArray(columns) ? columns : fallbackColumns);
|
||
} catch (error) {
|
||
applyColumns(fallbackColumns);
|
||
}
|
||
}
|
||
|
||
async function syncObjectCatalogSelection() {
|
||
const catalog = document.getElementById('objectCatalogSelect');
|
||
if (!catalog || !catalog.value) {
|
||
return;
|
||
}
|
||
const selected = catalog.options[catalog.selectedIndex];
|
||
const ownerInput = document.querySelector('input[name="owner"]');
|
||
const objectInput = document.querySelector('input[name="objectName"]');
|
||
const ordsPathInput = document.querySelector('input[name="ordsPath"]');
|
||
if (ownerInput) {
|
||
ownerInput.value = selected.dataset.owner || '';
|
||
}
|
||
if (objectInput) {
|
||
objectInput.value = selected.dataset.objectName || '';
|
||
}
|
||
if (ordsPathInput) {
|
||
const owner = (selected.dataset.owner || '').toLowerCase();
|
||
const objectName = (selected.dataset.objectName || '').toLowerCase();
|
||
ordsPathInput.value = owner && objectName ? `cb-ords/cb-object-query/${owner}/${objectName}` : '';
|
||
ordsPathInput.readOnly = true;
|
||
}
|
||
const ordsPathEdit = document.querySelector('[data-ords-path-edit]');
|
||
if (ordsPathEdit) {
|
||
ordsPathEdit.checked = false;
|
||
}
|
||
}
|
||
|
||
function initOrdsPathEditToggle() {
|
||
const toggle = document.querySelector('[data-ords-path-edit]');
|
||
const input = document.querySelector('[data-ords-path-input]');
|
||
if (!toggle || !input) {
|
||
return;
|
||
}
|
||
toggle.addEventListener('change', () => {
|
||
input.readOnly = !toggle.checked;
|
||
if (toggle.checked) {
|
||
input.focus();
|
||
}
|
||
});
|
||
}
|
||
|
||
function initProbeObjectDescription() {
|
||
const select = document.querySelector('select[name="objectId"]');
|
||
const target = document.querySelector('[data-probe-object-description]');
|
||
if (!select || !target) {
|
||
return;
|
||
}
|
||
const update = () => {
|
||
const option = selectedOption(select);
|
||
target.textContent = option?.dataset.description
|
||
|| '선택한 대상의 설명이 등록되지 않았습니다. ORDS 조회 대상에서 설명을 추가하세요.';
|
||
};
|
||
select.addEventListener('change', update);
|
||
update();
|
||
}
|
||
|
||
function initProbeVectorInput() {
|
||
const select = document.querySelector('select[name="objectId"]');
|
||
const blocks = document.querySelectorAll('[data-vector-probe-input]');
|
||
const input = document.querySelector('[data-vector-probe-input] textarea[name="requestBody"]');
|
||
const controls = document.querySelectorAll('[data-vector-probe-input] textarea, [data-vector-probe-input] select, [data-vector-probe-input] input');
|
||
if (!select || !blocks.length || !input) {
|
||
return;
|
||
}
|
||
const update = () => {
|
||
const option = selectedOption(select);
|
||
const isVectorSearch = option?.dataset.vectorSearch === 'true';
|
||
blocks.forEach(block => {
|
||
block.hidden = !isVectorSearch;
|
||
});
|
||
controls.forEach(control => {
|
||
control.disabled = !isVectorSearch;
|
||
});
|
||
input.required = isVectorSearch;
|
||
if (!isVectorSearch) {
|
||
input.value = '';
|
||
}
|
||
};
|
||
select.addEventListener('change', update);
|
||
update();
|
||
}
|
||
|
||
function selectedText(select) {
|
||
if (!select || select.selectedIndex < 0) {
|
||
return '-';
|
||
}
|
||
return select.options[select.selectedIndex].textContent.trim();
|
||
}
|
||
|
||
function selectedOption(select) {
|
||
if (!select || select.selectedIndex < 0) {
|
||
return null;
|
||
}
|
||
return select.options[select.selectedIndex];
|
||
}
|
||
|
||
function splitList(value, separator = '|') {
|
||
return (value || '')
|
||
.split(separator)
|
||
.map((item) => item.trim())
|
||
.filter(Boolean);
|
||
}
|
||
|
||
function formatList(values, emptyText) {
|
||
if (!values.length) {
|
||
return emptyText;
|
||
}
|
||
const shown = values.slice(0, 4).join(', ');
|
||
return values.length > 4 ? `${shown} 외 ${values.length - 4}` : shown;
|
||
}
|
||
|
||
function setWizardPreview(wizard, name, value) {
|
||
wizard.querySelectorAll(`[data-preview="${name}"]`).forEach((target) => {
|
||
target.textContent = value;
|
||
});
|
||
}
|
||
|
||
function setTokenPreview(preview, name, value) {
|
||
preview.querySelectorAll(`[data-token-preview="${name}"]`).forEach((target) => {
|
||
target.textContent = value;
|
||
});
|
||
}
|
||
|
||
function updateTokenContextPreview(select) {
|
||
const form = select.closest('form');
|
||
const preview = form?.querySelector('[data-token-context-preview]');
|
||
if (!preview) {
|
||
return;
|
||
}
|
||
const option = selectedOption(select);
|
||
if (!option || !option.value) {
|
||
setTokenPreview(preview, 'status', '미선택');
|
||
setTokenPreview(preview, 'username', '원문 직접 입력');
|
||
setTokenPreview(preview, 'prefix', '-');
|
||
setTokenPreview(preview, 'expiresAt', '-');
|
||
setTokenPreview(preview, 'directRoles', '-');
|
||
setTokenPreview(preview, 'groups', '-');
|
||
setTokenPreview(preview, 'inheritedRoles', '-');
|
||
setTokenPreview(preview, 'description', '토큰을 선택하면 등록된 사용자/역할 컨텍스트를 먼저 확인할 수 있습니다.');
|
||
return;
|
||
}
|
||
|
||
const directRoles = splitList(option.dataset.directRoles || '');
|
||
const groups = splitList(option.dataset.groups || '');
|
||
const inheritedRoles = splitList(option.dataset.inheritedRoles || '');
|
||
setTokenPreview(preview, 'status', option.dataset.status || '-');
|
||
setTokenPreview(preview, 'username', option.dataset.username || '-');
|
||
setTokenPreview(preview, 'prefix', option.dataset.prefix || '****');
|
||
setTokenPreview(preview, 'expiresAt', option.dataset.expiresAt || '-');
|
||
setTokenPreview(preview, 'directRoles', formatList(directRoles, '직접 역할 없음'));
|
||
setTokenPreview(preview, 'groups', formatList(groups, '소속 그룹 없음'));
|
||
setTokenPreview(preview, 'inheritedRoles', formatList(inheritedRoles, '그룹 상속 역할 없음'));
|
||
setTokenPreview(preview, 'description', option.dataset.description || '설명 없음');
|
||
}
|
||
|
||
function initTokenContextPreviews() {
|
||
document.querySelectorAll('[data-token-context-select]').forEach((select) => {
|
||
select.addEventListener('change', () => updateTokenContextPreview(select));
|
||
updateTokenContextPreview(select);
|
||
});
|
||
}
|
||
|
||
function filterEffectiveMatrixTable(select) {
|
||
const table = document.getElementById(select.dataset.effectiveFilter || '');
|
||
if (!table) {
|
||
return;
|
||
}
|
||
const value = select.value || '';
|
||
table.querySelectorAll('.effective-empty-row').forEach((row) => row.remove());
|
||
let visibleRows = 0;
|
||
table.querySelectorAll('tbody tr[data-effective-id]').forEach((row) => {
|
||
const visible = !value || row.dataset.effectiveId === value;
|
||
row.hidden = !visible;
|
||
if (visible) {
|
||
visibleRows += 1;
|
||
}
|
||
});
|
||
if (value && visibleRows === 0) {
|
||
const body = table.querySelector('tbody');
|
||
const columnCount = table.querySelectorAll('thead th').length || 1;
|
||
const row = document.createElement('tr');
|
||
row.className = 'effective-empty-row';
|
||
row.innerHTML = `<td colspan="${columnCount}" class="text-muted">${table.dataset.emptyMessage || '선택한 항목이 없습니다.'}</td>`;
|
||
body?.appendChild(row);
|
||
}
|
||
}
|
||
|
||
function initEffectiveMatrixFilters() {
|
||
document.querySelectorAll('[data-effective-filter]').forEach((select) => {
|
||
select.addEventListener('change', () => filterEffectiveMatrixTable(select));
|
||
filterEffectiveMatrixTable(select);
|
||
});
|
||
}
|
||
|
||
function sqlLiteral(value) {
|
||
return `'${String(value || '').replaceAll("'", "''")}'`;
|
||
}
|
||
|
||
function collectWizardRules(root) {
|
||
return Array.from(root.querySelectorAll('.rule-row')).map((row) => {
|
||
const column = row.querySelector('[name="ruleColumn"]')?.value || '';
|
||
const type = row.querySelector('[name="ruleType"]')?.value || '';
|
||
const value = row.querySelector('[name="ruleValue"]')?.value || '';
|
||
const displayColumn = column || {
|
||
MY_DEPT: 'DEPT_CODE',
|
||
SELF: 'OWNER_EMP_NO',
|
||
DEPT: 'DEPT_CODE',
|
||
EMP_NO: 'OWNER_EMP_NO',
|
||
TAG: 'TECH_TAG',
|
||
ALL: ''
|
||
}[type] || '';
|
||
if (type === 'ALL') {
|
||
return 'ALL';
|
||
}
|
||
if (['MY_DEPT', 'SELF'].includes(type)) {
|
||
return `${displayColumn} ${type}`;
|
||
}
|
||
if (type === 'TAG') {
|
||
return `${displayColumn} TAG ${value.toUpperCase()}`;
|
||
}
|
||
return [displayColumn, type, value].filter(Boolean).join(' ');
|
||
}).filter(Boolean);
|
||
}
|
||
|
||
function collectWizardPredicates(root) {
|
||
return Array.from(root.querySelectorAll('.rule-row')).map((row) => {
|
||
const column = row.querySelector('[name="ruleColumn"]')?.value || '';
|
||
const type = row.querySelector('[name="ruleType"]')?.value || '';
|
||
const value = row.querySelector('[name="ruleValue"]')?.value || '';
|
||
const displayColumn = column || {
|
||
MY_DEPT: 'DEPT_CODE',
|
||
SELF: 'OWNER_EMP_NO',
|
||
DEPT: 'DEPT_CODE',
|
||
EMP_NO: 'OWNER_EMP_NO',
|
||
TAG: 'TECH_TAG',
|
||
ALL: ''
|
||
}[type] || '';
|
||
if (type === 'ALL') {
|
||
return '1 = 1';
|
||
}
|
||
if (type === 'MY_DEPT') {
|
||
return `${displayColumn} = SYS_CONTEXT('CB_AGENT_CTX', 'DEPT_CODE')`;
|
||
}
|
||
if (type === 'SELF') {
|
||
return `${displayColumn} = SYS_CONTEXT('CB_AGENT_CTX', 'EMP_NO')`;
|
||
}
|
||
if (type === 'DEPT' || type === 'EMP_NO') {
|
||
return `${displayColumn} = ${sqlLiteral(value)}`;
|
||
}
|
||
if (type === 'TAG') {
|
||
return `REGEXP_LIKE(UPPER(${displayColumn}), ${sqlLiteral(`(^|,)${value.toUpperCase()}(,|$)`)})`;
|
||
}
|
||
if (type === '=') {
|
||
return `TO_CHAR(${displayColumn}) = ${sqlLiteral(value)}`;
|
||
}
|
||
if (type === '!=') {
|
||
return `TO_CHAR(${displayColumn}) <> ${sqlLiteral(value)}`;
|
||
}
|
||
return '';
|
||
}).filter(Boolean);
|
||
}
|
||
|
||
function updatePermissionWizardPreview(root = document) {
|
||
const wizard = root.querySelector('[data-permission-wizard]');
|
||
if (!wizard) {
|
||
return;
|
||
}
|
||
const roleSelect = wizard.querySelector('[name="roleId"]');
|
||
const objectSelect = wizard.querySelector('[name="objectRef"]');
|
||
const effectSelect = wizard.querySelector('[name="permissionEffect"]');
|
||
const visibleColumns = wizard.querySelector('[name="visibleColumns"]')?.value.trim() || '';
|
||
const roleOption = selectedOption(roleSelect);
|
||
const objectOption = selectedOption(objectSelect);
|
||
const effect = effectSelect?.value || 'ALLOW';
|
||
const rules = collectWizardRules(wizard);
|
||
const predicates = collectWizardPredicates(wizard);
|
||
const ruleText = rules.length ? rules.join(', ') : '행 규칙 없음';
|
||
const directUsers = splitList(roleOption?.dataset.directUsers || '');
|
||
const groups = splitList(roleOption?.dataset.groups || '');
|
||
const groupUsers = splitList(roleOption?.dataset.groupUsers || '');
|
||
const objectColumns = splitList(objectOption?.dataset.columns || '', ',');
|
||
const maskableColumns = splitList(objectOption?.dataset.maskableColumns || '', ',');
|
||
const visibleColumnList = splitList(visibleColumns, ',').map((column) => column.toUpperCase());
|
||
const nullColumns = maskableColumns.filter((column) => !visibleColumnList.includes(column.toUpperCase()));
|
||
const rowPolicy = effect === 'DENY'
|
||
? `거부 규칙: ${ruleText}`
|
||
: `허용 규칙: ${ruleText}`;
|
||
const predicateText = effect === 'DENY'
|
||
? (rules.includes('ALL') ? 'DENY ALL: 1 = 0' : `DENY 후보: NOT (${predicates.join(' OR ') || '조건 없음'})`)
|
||
: `ALLOW 후보: ${predicates.join(' OR ') || '조건 없음'}`;
|
||
const columnPolicy = visibleColumns
|
||
? `이 권한에서 원문 표시 허용: ${visibleColumns}`
|
||
: '마스킹 대상 컬럼은 기본 정책대로 NULL/마스킹 처리';
|
||
const nullPolicy = !maskableColumns.length
|
||
? '마스킹 대상 컬럼 없음'
|
||
: (nullColumns.length ? `NULL 처리: ${nullColumns.join(', ')}` : '선택한 마스킹 컬럼 모두 원문 표시 허용');
|
||
const affectedPrincipals = `직접 사용자 ${directUsers.length}명 / 그룹 ${groups.length}개 / 그룹 상속 사용자 ${groupUsers.length}명`;
|
||
|
||
wizard.querySelector('[data-wizard-summary="role"]').textContent = selectedText(roleSelect);
|
||
wizard.querySelector('[data-wizard-summary="object"]').textContent = selectedText(objectSelect);
|
||
wizard.querySelector('[data-wizard-summary="effect"]').textContent = effect;
|
||
wizard.querySelector('[data-wizard-summary="rules"]').textContent = ruleText;
|
||
|
||
setWizardPreview(wizard, 'role', selectedText(roleSelect));
|
||
setWizardPreview(wizard, 'sensitivity', roleOption?.dataset.maxSensitivity || 'PUBLIC');
|
||
setWizardPreview(wizard, 'object', objectOption?.dataset.objectDisplay || selectedText(objectSelect));
|
||
setWizardPreview(wizard, 'directUsers', formatList(directUsers, '직접 부여 사용자 없음'));
|
||
setWizardPreview(wizard, 'roleGroups', formatList(groups, '역할이 부여된 그룹 없음'));
|
||
setWizardPreview(wizard, 'groupUsers', formatList(groupUsers, '그룹 상속 사용자 없음'));
|
||
setWizardPreview(wizard, 'affectedPrincipals', affectedPrincipals);
|
||
setWizardPreview(wizard, 'objectColumns', formatList(objectColumns, '컬럼 조회 전'));
|
||
setWizardPreview(wizard, 'objectColumnsFinal', formatList(objectColumns, '컬럼 조회 전'));
|
||
setWizardPreview(wizard, 'maskableColumns', formatList(maskableColumns, '마스킹 대상 컬럼 없음'));
|
||
setWizardPreview(wizard, 'rowPolicy', rowPolicy);
|
||
setWizardPreview(wizard, 'predicatePreview', predicateText);
|
||
setWizardPreview(wizard, 'columnPolicy', columnPolicy);
|
||
setWizardPreview(wizard, 'nullPolicy', nullPolicy);
|
||
}
|
||
|
||
function activatePermissionWizardStep(wizard, step) {
|
||
const panels = Array.from(wizard.querySelectorAll('[data-wizard-step]'));
|
||
const maxStep = panels.length;
|
||
const nextStep = Math.max(1, Math.min(step, maxStep));
|
||
panels.forEach((panel) => {
|
||
panel.classList.toggle('active', Number(panel.dataset.wizardStep) === nextStep);
|
||
});
|
||
document.querySelectorAll('[data-wizard-target]').forEach((button) => {
|
||
button.classList.toggle('active', Number(button.dataset.wizardTarget) === nextStep);
|
||
});
|
||
wizard.dataset.currentStep = String(nextStep);
|
||
const prev = wizard.querySelector('[data-wizard-prev]');
|
||
const next = wizard.querySelector('[data-wizard-next]');
|
||
const submit = wizard.querySelector('[data-wizard-submit]');
|
||
if (prev) {
|
||
prev.disabled = nextStep === 1;
|
||
}
|
||
if (next) {
|
||
next.hidden = nextStep === maxStep;
|
||
}
|
||
if (submit) {
|
||
submit.hidden = nextStep !== maxStep;
|
||
}
|
||
updatePermissionWizardPreview(document);
|
||
}
|
||
|
||
function initPermissionWizard() {
|
||
const wizard = document.querySelector('[data-permission-wizard]');
|
||
if (!wizard) {
|
||
return;
|
||
}
|
||
wizard.dataset.currentStep = wizard.dataset.currentStep || '1';
|
||
wizard.querySelector('[data-wizard-prev]')?.addEventListener('click', () => {
|
||
activatePermissionWizardStep(wizard, Number(wizard.dataset.currentStep || '1') - 1);
|
||
});
|
||
wizard.querySelector('[data-wizard-next]')?.addEventListener('click', () => {
|
||
activatePermissionWizardStep(wizard, Number(wizard.dataset.currentStep || '1') + 1);
|
||
});
|
||
document.querySelectorAll('[data-wizard-target]').forEach((button) => {
|
||
button.addEventListener('click', () => activatePermissionWizardStep(wizard, Number(button.dataset.wizardTarget)));
|
||
});
|
||
wizard.addEventListener('input', () => updatePermissionWizardPreview(document));
|
||
wizard.addEventListener('change', () => updatePermissionWizardPreview(document));
|
||
activatePermissionWizardStep(wizard, Number(wizard.dataset.currentStep || '1'));
|
||
}
|
||
|
||
const backofficeSupportObjectPatterns = [
|
||
/^CB_APP_/,
|
||
/^CB_PERMISSION(_|$)/,
|
||
/^CB_PROTECTED_/,
|
||
/^CB_USER_/,
|
||
/^CB_GROUP_/,
|
||
/^CB_ORDS_/,
|
||
/^CB_AGENT_BEARER_/,
|
||
/^CB_BACKOFFICE_/,
|
||
/^APP_(GROUP|ROLE|USER)$/,
|
||
/^DB_SOURCE$/,
|
||
/^PERMISSION$/,
|
||
/^USER_GROUP$/
|
||
];
|
||
|
||
function isBackofficeSupportObject(objectName) {
|
||
const normalized = (objectName || '').trim().toUpperCase();
|
||
return backofficeSupportObjectPatterns.some((pattern) => pattern.test(normalized));
|
||
}
|
||
|
||
function initVpdTargetFilters() {
|
||
const controls = document.querySelector('[data-vpd-target-controls]');
|
||
const body = document.querySelector('[data-vpd-target-body]');
|
||
if (!controls || !body) {
|
||
return;
|
||
}
|
||
const rows = Array.from(body.querySelectorAll('[data-vpd-target-row]')).map((row) => ({
|
||
row,
|
||
detail: row.nextElementSibling?.matches('[data-vpd-target-detail]') ? row.nextElementSibling : null,
|
||
object: (row.dataset.object || '').toUpperCase(),
|
||
objectName: (row.dataset.objectName || '').toUpperCase(),
|
||
objectType: (row.dataset.objectType || '').toUpperCase(),
|
||
vpdApplied: row.dataset.vpdApplied || 'false',
|
||
protectedObject: row.dataset.protectedObject || 'false'
|
||
}));
|
||
const search = controls.querySelector('[data-vpd-target-search]');
|
||
const type = controls.querySelector('[data-vpd-target-type]');
|
||
const vpd = controls.querySelector('[data-vpd-target-vpd]');
|
||
const protectedObject = controls.querySelector('[data-vpd-target-protected]');
|
||
const includeSupport = controls.querySelector('[data-vpd-target-include-support]');
|
||
const pageSize = controls.querySelector('[data-vpd-target-page-size]');
|
||
const visibleCount = controls.querySelector('[data-vpd-target-visible]');
|
||
const matchedCount = controls.querySelector('[data-vpd-target-matched]');
|
||
const totalCount = controls.querySelector('[data-vpd-target-total]');
|
||
const reset = controls.querySelector('[data-vpd-target-reset]');
|
||
const empty = document.createElement('tr');
|
||
empty.className = 'vpd-target-empty-runtime';
|
||
empty.innerHTML = '<td colspan="7" class="text-muted">필터 조건에 맞는 TABLE/VIEW가 없습니다.</td>';
|
||
body.appendChild(empty);
|
||
|
||
const matchesFilters = (entry) => {
|
||
const query = (search?.value || '').trim().toUpperCase();
|
||
if (query && !entry.object.includes(query)) {
|
||
return false;
|
||
}
|
||
if (type?.value && entry.objectType !== type.value) {
|
||
return false;
|
||
}
|
||
if (vpd?.value && entry.vpdApplied !== vpd.value) {
|
||
return false;
|
||
}
|
||
if (protectedObject?.value && entry.protectedObject !== protectedObject.value) {
|
||
return false;
|
||
}
|
||
if (!includeSupport?.checked && isBackofficeSupportObject(entry.objectName)) {
|
||
return false;
|
||
}
|
||
return true;
|
||
};
|
||
|
||
const applyFilters = () => {
|
||
const maxRows = pageSize?.value === 'ALL' ? Number.POSITIVE_INFINITY : Number(pageSize?.value || 50);
|
||
let matched = 0;
|
||
let visible = 0;
|
||
rows.forEach((entry) => {
|
||
const matchedRow = matchesFilters(entry);
|
||
if (matchedRow) {
|
||
matched += 1;
|
||
}
|
||
const show = matchedRow && visible < maxRows;
|
||
if (show) {
|
||
visible += 1;
|
||
}
|
||
entry.row.hidden = !show;
|
||
if (entry.detail) {
|
||
entry.detail.hidden = !show;
|
||
}
|
||
});
|
||
empty.hidden = matched !== 0;
|
||
if (visibleCount) {
|
||
visibleCount.textContent = String(visible);
|
||
}
|
||
if (matchedCount) {
|
||
matchedCount.textContent = String(matched);
|
||
}
|
||
if (totalCount) {
|
||
totalCount.textContent = String(rows.length);
|
||
}
|
||
};
|
||
|
||
[search, type, vpd, protectedObject, includeSupport, pageSize].forEach((control) => {
|
||
control?.addEventListener(control === search ? 'input' : 'change', applyFilters);
|
||
});
|
||
reset?.addEventListener('click', () => {
|
||
if (search) {
|
||
search.value = '';
|
||
}
|
||
if (type) {
|
||
type.value = '';
|
||
}
|
||
if (vpd) {
|
||
vpd.value = '';
|
||
}
|
||
if (protectedObject) {
|
||
protectedObject.value = '';
|
||
}
|
||
if (includeSupport) {
|
||
includeSupport.checked = false;
|
||
}
|
||
if (pageSize) {
|
||
pageSize.value = '50';
|
||
}
|
||
applyFilters();
|
||
search?.focus();
|
||
});
|
||
applyFilters();
|
||
}
|
||
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
initPersistentMenus();
|
||
initQuestionPresets();
|
||
initCopyButtons();
|
||
renderMarkdownViews();
|
||
initVpdTargetFilters();
|
||
const master = document.getElementById('userRoleMaster');
|
||
if (master) {
|
||
master.addEventListener('change', filterUserRoleDetail);
|
||
filterUserRoleDetail();
|
||
}
|
||
document.querySelectorAll('.group-master-select').forEach((select) => {
|
||
select.addEventListener('change', () => filterGroupDetail(select.id));
|
||
filterGroupDetail(select.id);
|
||
});
|
||
initTokenContextPreviews();
|
||
initEffectiveMatrixFilters();
|
||
const objectSelect = document.querySelector('select[name="objectRef"]');
|
||
if (objectSelect) {
|
||
objectSelect.addEventListener('change', () => {
|
||
syncRuleColumnOptions();
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
syncRuleColumnOptions();
|
||
}
|
||
initPermissionWizard();
|
||
document.querySelectorAll('.rule-type-select').forEach((select) => {
|
||
select.addEventListener('change', () => {
|
||
syncRuleTypeHints();
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
});
|
||
syncRuleTypeHints();
|
||
document.querySelector('input[name="visibleColumns"]')?.addEventListener('input', renderSelectedVisibleColumns);
|
||
renderSelectedVisibleColumns();
|
||
const catalog = document.getElementById('objectCatalogSelect');
|
||
if (catalog) {
|
||
catalog.addEventListener('change', syncObjectCatalogSelection);
|
||
syncObjectCatalogSelection();
|
||
}
|
||
initOrdsPathEditToggle();
|
||
initProbeObjectDescription();
|
||
initProbeVectorInput();
|
||
document.querySelectorAll('[data-policy-template-select]').forEach((select) => {
|
||
select.addEventListener('change', () => syncPolicyTemplate(select));
|
||
syncPolicyTemplate(select);
|
||
});
|
||
document.querySelectorAll('[data-rule-add]').forEach((button) => {
|
||
button.addEventListener('click', () => {
|
||
const row = button.closest('.rule-row');
|
||
const list = document.getElementById('rowRuleList');
|
||
if (!row || !list) {
|
||
return;
|
||
}
|
||
const clone = row.cloneNode(true);
|
||
clone.querySelectorAll('input').forEach((input) => input.value = '');
|
||
const cloneButton = clone.querySelector('[data-rule-add]');
|
||
cloneButton.textContent = '삭제';
|
||
cloneButton.addEventListener('click', () => {
|
||
clone.remove();
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
clone.querySelectorAll('.rule-type-select').forEach((select) => {
|
||
select.addEventListener('change', () => {
|
||
syncRuleTypeHints();
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
});
|
||
list.appendChild(clone);
|
||
syncRuleColumnOptions();
|
||
syncRuleTypeHints(clone);
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
});
|
||
updatePermissionWizardPreview(document);
|
||
});
|
||
|
||
document.body.addEventListener('htmx:beforeRequest', (event) => {
|
||
const button = event.detail.elt;
|
||
if (!button?.matches?.('[data-filter-toggle]')) {
|
||
return;
|
||
}
|
||
const target = findHtmxTarget(button);
|
||
if (button.getAttribute('aria-expanded') === 'true') {
|
||
event.preventDefault();
|
||
resetFilterToggle(button, target);
|
||
return;
|
||
}
|
||
setFilterToggleLoading(button, target);
|
||
});
|
||
|
||
document.body.addEventListener('htmx:afterSwap', (event) => {
|
||
const button = event.detail.elt;
|
||
if (button?.matches?.('[data-filter-toggle]')) {
|
||
button.setAttribute('aria-expanded', 'true');
|
||
button.classList.add('active');
|
||
}
|
||
renderMarkdownViews(event.detail.target || document);
|
||
});
|