fix #491: add permission effective preview

This commit is contained in:
devmrko
2026-06-26 13:32:39 +09:00
parent 9f63adeca5
commit cd7860e253
5 changed files with 277 additions and 14 deletions

View File

@@ -520,6 +520,33 @@ body {
margin: 0;
}
.effective-preview dl {
display: grid;
gap: .75rem;
grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
margin: 0;
}
.effective-preview dl > div {
background: var(--rw-surface-muted);
border: 1px solid var(--rw-border);
border-radius: 8px;
min-width: 0;
padding: .7rem;
}
.effective-preview dt {
color: var(--rw-muted);
font-size: .74rem;
font-weight: 800;
text-transform: uppercase;
}
.effective-preview dd {
margin: .25rem 0 0;
overflow-wrap: anywhere;
}
.policy-apply-flow {
align-items: center;
display: flex;

View File

@@ -363,17 +363,24 @@ async function syncRuleColumnOptions() {
}
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);
renderRuleColumnOptions(fallbackColumns);
applyColumns(fallbackColumns);
try {
const response = await fetch(`/permissions/object-columns?objectRef=${encodeURIComponent(objectSelect.value)}`);
if (!response.ok) {
return;
}
const columns = await response.json();
renderRuleColumnOptions(Array.isArray(columns) ? columns : fallbackColumns);
applyColumns(Array.isArray(columns) ? columns : fallbackColumns);
} catch (error) {
renderRuleColumnOptions(fallbackColumns);
applyColumns(fallbackColumns);
}
}
@@ -406,6 +413,38 @@ function selectedText(select) {
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 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 || '';
@@ -428,6 +467,40 @@ function collectWizardRules(root) {
}).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',
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 === '=') {
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) {
@@ -437,27 +510,52 @@ function updatePermissionWizardPreview(root = document) {
const objectSelect = wizard.querySelector('[name="objectRef"]');
const effectSelect = wizard.querySelector('[name="permissionEffect"]');
const visibleColumns = wizard.querySelector('[name="visibleColumns"]')?.value.trim() || '';
const roleOption = roleSelect?.options[roleSelect.selectedIndex];
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;
wizard.querySelector('[data-preview="role"]').textContent = selectedText(roleSelect);
wizard.querySelector('[data-preview="sensitivity"]').textContent = roleOption?.dataset.maxSensitivity || 'PUBLIC';
wizard.querySelector('[data-preview="object"]').textContent = selectedText(objectSelect);
wizard.querySelector('[data-preview="rowPolicy"]').textContent = rowPolicy;
wizard.querySelector('[data-preview="columnPolicy"]').textContent = columnPolicy;
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) {

View File

@@ -59,10 +59,21 @@
<option th:each="role : ${roles}"
th:value="${role.roleId()}"
th:text="${role.roleName()}"
th:attr="data-max-sensitivity=${role.maxSensitivityLevel()}"></option>
th:attr="data-max-sensitivity=${role.maxSensitivityLevel()},
data-direct-users=${#strings.listJoin(directUsersByRole[role.roleId()], '|')},
data-groups=${#strings.listJoin(groupsByRole[role.roleId()], '|')},
data-group-users=${#strings.listJoin(groupUsersByRole[role.roleId()], '|')}"></option>
</select>
</label>
<p class="wizard-hint">선택한 역할의 민감도 허용 상한도 preview에 반영됩니다.</p>
<div class="effective-preview">
<div class="field-block-title">선택 역할 영향도</div>
<dl>
<div><dt>직접 사용자</dt><dd data-preview="directUsers">-</dd></div>
<div><dt>역할 보유 그룹</dt><dd data-preview="roleGroups">-</dd></div>
<div><dt>그룹 상속 사용자</dt><dd data-preview="groupUsers">-</dd></div>
</dl>
</div>
</div>
<div class="wizard-panel" data-wizard-step="2">
@@ -79,7 +90,8 @@
<optgroup label="등록된 보호 객체">
<option th:each="object : ${objects}"
th:value="${'protected:' + object.objectId()}"
th:attr="data-columns=${#strings.listJoin(columnsByObject[object.objectId()], ',')},
th:attr="data-object-display=${object.displayName()},
data-columns=${#strings.listJoin(columnsByObject[object.objectId()], ',')},
data-maskable-columns=${#strings.listJoin(maskableColumnsByObject[object.objectId()], ',')},
data-maskable-labels=${#strings.listJoin(maskableColumnLabelsByObject[object.objectId()], '|')}"
th:text="${object.displayName()}"></option>
@@ -87,11 +99,19 @@
<optgroup label="DB 스키마 객체">
<option th:each="dbObject : ${dbObjects}"
th:value="${'db:' + dbObject.value()}"
th:attr="data-object-display=${dbObject.value()}"
th:text="${dbObject.label()}"></option>
</optgroup>
</select>
</label>
<p class="wizard-hint">DB 스키마 객체를 선택하면 저장 시 보호 객체가 자동 등록됩니다.</p>
<div class="effective-preview">
<div class="field-block-title">선택 객체 컬럼</div>
<dl>
<div><dt>전체 컬럼</dt><dd data-preview="objectColumns">-</dd></div>
<div><dt>마스킹 대상</dt><dd data-preview="maskableColumns">-</dd></div>
</dl>
</div>
</div>
<div class="wizard-panel" data-wizard-step="3">
@@ -170,8 +190,12 @@
<div><dt>역할</dt><dd data-preview="role">-</dd></div>
<div><dt>민감도 상한</dt><dd data-preview="sensitivity">-</dd></div>
<div><dt>보호 객체</dt><dd data-preview="object">-</dd></div>
<div><dt>적용 대상</dt><dd data-preview="affectedPrincipals">-</dd></div>
<div><dt>객체 컬럼</dt><dd data-preview="objectColumnsFinal">-</dd></div>
<div><dt>행 접근</dt><dd data-preview="rowPolicy">-</dd></div>
<div><dt>VPD predicate 예상</dt><dd data-preview="predicatePreview">-</dd></div>
<div><dt>권한별 컬럼 마스킹</dt><dd data-preview="columnPolicy">-</dd></div>
<div><dt>NULL 처리 예상</dt><dd data-preview="nullPolicy">-</dd></div>
</dl>
</div>
</div>