enhance(roles): use KeyValue to show policies
This commit is contained in:
parent
95c84ebb69
commit
55d750c3e8
2 changed files with 19 additions and 6 deletions
|
@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<i v-if="role.isAdministrator" class="ti ti-crown" style="color: var(--accent);"></i>
|
<i v-if="role.isAdministrator" class="ti ti-crown" style="color: var(--accent);"></i>
|
||||||
<i v-else-if="role.isModerator" class="ti ti-shield" style="color: var(--accent);"></i>
|
<i v-else-if="role.isModerator" class="ti ti-shield" style="color: var(--accent);"></i>
|
||||||
<i v-else class="ti ti-user" style="opacity: 0.7;"></i>
|
<i v-else class="ti ti-badge" style="opacity: 0.7;"></i>
|
||||||
</template>
|
</template>
|
||||||
</span>
|
</span>
|
||||||
<span :class="$style.name">{{ role.name }}</span>
|
<span :class="$style.name">{{ role.name }}</span>
|
||||||
|
|
|
@ -13,11 +13,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</FormSection>
|
</FormSection>
|
||||||
<FormSection>
|
<FormSection>
|
||||||
<template #label>{{ i18n.ts._role.policies }}</template>
|
<template #label>{{ i18n.ts._role.policies }}</template>
|
||||||
<div class="_gaps_s">
|
<MkKeyValue v-for="policy in Object.keys($i.policies)" :key="policy" oneline style="margin: 1em 0;">
|
||||||
<div v-for="policy in Object.keys($i.policies)" :key="policy">
|
<template #key>{{ i18n.ts._role._options[`${policy}`] }}</template>
|
||||||
{{ i18n.ts._role._options[`${policy}`] }} ... {{ $i.policies[policy] }}
|
<template #value>{{ getValue(policy, $i.policies[policy]) }}</template>
|
||||||
</div>
|
</MkKeyValue>
|
||||||
</div>
|
|
||||||
</FormSection>
|
</FormSection>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -29,9 +28,23 @@ import { i18n } from '@/i18n.js';
|
||||||
import { signinRequired } from '@/account.js';
|
import { signinRequired } from '@/account.js';
|
||||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||||
import MkRolePreview from '@/components/MkRolePreview.vue';
|
import MkRolePreview from '@/components/MkRolePreview.vue';
|
||||||
|
import MkKeyValue from '@/components/MkKeyValue.vue';
|
||||||
|
|
||||||
const $i = signinRequired();
|
const $i = signinRequired();
|
||||||
|
|
||||||
|
function getValue(policy, policyValue) {
|
||||||
|
if (typeof(policyValue) === 'boolean') {
|
||||||
|
return policyValue ? i18n.ts.yes : i18n.ts.no;
|
||||||
|
} else if (typeof(policyValue) === 'number') {
|
||||||
|
if (policy === 'driveCapacityMb') {
|
||||||
|
return `${policyValue}MB`;
|
||||||
|
}
|
||||||
|
return policyValue;
|
||||||
|
} else {
|
||||||
|
return policyValue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const headerActions = computed(() => []);
|
const headerActions = computed(() => []);
|
||||||
|
|
||||||
const headerTabs = computed(() => []);
|
const headerTabs = computed(() => []);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue