1<template> 2 <b-table stacked="sm" hover small :items="items" :fields="fields"> 3 <template #cell(administrator)="data"> 4 <template v-if="data.value"> 5 <checkmark20 /> 6 </template> 7 </template> 8 <template #cell(operator)="data"> 9 <template v-if="data.value"> 10 <checkmark20 /> 11 </template> 12 </template> 13 <template #cell(readonly)="data"> 14 <template v-if="data.value"> 15 <checkmark20 /> 16 </template> 17 </template> 18 <template #cell(noaccess)="data"> 19 <template v-if="data.value"> 20 <checkmark20 /> 21 </template> 22 </template> 23 </b-table> 24</template> 25 26<script> 27import Checkmark20 from '@carbon/icons-vue/es/checkmark/20'; 28import i18n from '@/i18n'; 29 30export default { 31 components: { 32 Checkmark20, 33 }, 34 data() { 35 return { 36 items: [ 37 { 38 description: i18n.global.t( 39 'pageUserManagement.tableRoles.configureComponentsManagedByThisService', 40 ), 41 administrator: true, 42 operator: true, 43 readonly: false, 44 noaccess: false, 45 }, 46 { 47 description: i18n.global.t( 48 'pageUserManagement.tableRoles.configureManagerResources', 49 ), 50 administrator: true, 51 operator: false, 52 readonly: false, 53 noaccess: false, 54 }, 55 { 56 description: i18n.global.t( 57 'pageUserManagement.tableRoles.updatePasswordForCurrentUserAccount', 58 ), 59 administrator: true, 60 operator: true, 61 readonly: true, 62 noaccess: false, 63 }, 64 { 65 description: i18n.global.t( 66 'pageUserManagement.tableRoles.configureUsersAndTheirAccounts', 67 ), 68 administrator: true, 69 operator: false, 70 readonly: false, 71 noaccess: false, 72 }, 73 { 74 description: i18n.global.t( 75 'pageUserManagement.tableRoles.logInToTheServiceAndReadResources', 76 ), 77 administrator: true, 78 operator: true, 79 readonly: true, 80 noaccess: false, 81 }, 82 ], 83 fields: [ 84 { 85 key: 'description', 86 label: i18n.global.t('pageUserManagement.tableRoles.privilege'), 87 }, 88 { 89 key: 'administrator', 90 label: i18n.global.t('pageUserManagement.tableRoles.administrator'), 91 class: 'text-center', 92 }, 93 { 94 key: 'operator', 95 label: i18n.global.t('pageUserManagement.tableRoles.operator'), 96 class: 'text-center', 97 }, 98 { 99 key: 'readonly', 100 label: i18n.global.t('pageUserManagement.tableRoles.readOnly'), 101 class: 'text-center', 102 }, 103 { 104 key: 'noaccess', 105 label: i18n.global.t('pageUserManagement.tableRoles.noAccess'), 106 class: 'text-center', 107 }, 108 ], 109 }; 110 }, 111}; 112</script> 113