diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-02-29 00:21:27 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-03-03 02:40:05 +0300 |
commit | eaa04800a42b8cd8496ff613dd0d17055e6e477e (patch) | |
tree | f33cafdb41d38c48da4f89f3b2777633e867b994 /src/views/AccessControl/LocalUserManagement | |
parent | 8cc4866dbc86682a157a6f6b57526a31ac3fc524 (diff) | |
download | webui-vue-eaa04800a42b8cd8496ff613dd0d17055e6e477e.tar.xz |
Add translation to user management page
Updated TableToolbar component to handle label translation
outside of the component which is more consistent with bootstrap
table component patterns.
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Ic2e75e327f6a6067905c541f9a3ea55c5d103f4b
Diffstat (limited to 'src/views/AccessControl/LocalUserManagement')
3 files changed, 112 insertions, 59 deletions
diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue index 7b337a4f..23b06dd7 100644 --- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue +++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue @@ -4,11 +4,11 @@ <b-row> <b-col xl="9" class="text-right"> <b-button variant="link" @click="initModalSettings"> - Account policy settings + {{ $t('pageLocalUserManagement.accountPolicySettings') }} <icon-settings /> </b-button> <b-button variant="primary" @click="initModalUser(null)"> - Add user + {{ $t('pageLocalUserManagement.addUser') }} <icon-add /> </b-button> </b-col> @@ -52,6 +52,7 @@ :key="index" :value="action.value" :enabled="action.enabled" + :title="action.title" @click:tableAction="onTableRowAction($event, item)" > <template v-slot:icon> @@ -66,7 +67,7 @@ <b-row> <b-col xl="8"> <b-button v-b-toggle.collapse-role-table variant="link" class="mt-3"> - View privilege role descriptions + {{ $t('pageLocalUserManagement.viewPrivilegeRoleDescriptions') }} <icon-chevron /> </b-button> <b-collapse id="collapse-role-table" class="mt-3"> @@ -122,14 +123,20 @@ export default { activeUser: null, fields: [ { - key: 'checkbox', - label: '', - tdClass: 'table-cell__checkbox' + key: 'checkbox' + }, + { + key: 'username', + label: this.$t('pageLocalUserManagement.table.username') + }, + { + key: 'privilege', + label: this.$t('pageLocalUserManagement.table.privilege') + }, + { + key: 'status', + label: this.$t('pageLocalUserManagement.table.status') }, - 'checkbox', - 'username', - 'privilege', - 'status', { key: 'actions', label: '', @@ -139,15 +146,15 @@ export default { tableToolbarActions: [ { value: 'delete', - labelKey: 'global.action.delete' + label: this.$t('global.action.delete') }, { value: 'enable', - labelKey: 'global.action.enable' + label: this.$t('global.action.enable') }, { value: 'disable', - labelKey: 'global.action.disable' + label: this.$t('global.action.disable') } ] }; @@ -168,10 +175,15 @@ export default { ? 'Enabled' : 'Disabled', actions: [ - { value: 'edit', enabled: true }, + { + value: 'edit', + enabled: true, + title: this.$t('pageLocalUserManagement.editUser') + }, { value: 'delete', - enabled: user.UserName === 'root' ? false : true + enabled: user.UserName === 'root' ? false : true, + title: this.$t('pageLocalUserManagement.deleteUser') } ], ...user @@ -203,10 +215,12 @@ export default { initModalDelete(user) { this.$bvModal .msgBoxConfirm( - `Are you sure you want to delete user '${user.username}'? This action cannot be undone.`, + this.$t('pageLocalUserManagement.modal.deleteConfirmMessage', { + user: user.username + }), { - title: 'Delete user', - okTitle: 'Delete user' + title: this.$t('pageLocalUserManagement.deleteUser'), + okTitle: this.$t('pageLocalUserManagement.deleteUser') } ) .then(deleteConfirmed => { diff --git a/src/views/AccessControl/LocalUserManagement/ModalUser.vue b/src/views/AccessControl/LocalUserManagement/ModalUser.vue index 4a6a0bcf..ef13761f 100644 --- a/src/views/AccessControl/LocalUserManagement/ModalUser.vue +++ b/src/views/AccessControl/LocalUserManagement/ModalUser.vue @@ -2,24 +2,26 @@ <b-modal id="modal-user" ref="modal" @ok="onOk" @hidden="resetForm"> <template v-slot:modal-title> <template v-if="newUser"> - Add user + {{ $t('pageLocalUserManagement.addUser') }} </template> <template v-else> - Edit user + {{ $t('pageLocalUserManagement.editUser') }} </template> </template> <b-form novalidate @submit="handleSubmit"> <b-container> <b-row> <b-col> - <b-form-group label="Account status"> + <b-form-group + :label="$t('pageLocalUserManagement.modal.accountStatus')" + > <b-form-radio v-model="form.status" name="user-status" :value="true" @input="$v.form.status.$touch()" > - Enabled + {{ $t('global.status.enabled') }} </b-form-radio> <b-form-radio v-model="form.status" @@ -27,14 +29,21 @@ :value="false" @input="$v.form.status.$touch()" > - Disabled + {{ $t('global.status.disabled') }} </b-form-radio> </b-form-group> - <b-form-group label="Username" label-for="username"> + <b-form-group + :label="$t('pageLocalUserManagement.modal.username')" + label-for="username" + > <b-form-text id="username-help-block"> - Cannot start with a number + {{ $t('pageLocalUserManagement.modal.cannotStartWithANumber') }} <br /> - No special characters except underscore + {{ + $t( + 'pageLocalUserManagement.modal.noSpecialCharactersExceptUnderscore' + ) + }} </b-form-text> <b-form-input id="username" @@ -47,17 +56,21 @@ /> <b-form-invalid-feedback role="alert"> <template v-if="!$v.form.username.required"> - Field required + {{ $t('global.form.fieldRequired') }} </template> <template v-else-if="!$v.form.username.maxLength"> - Length must be between 1 – 16 characters + {{ + $t('global.form.lengthMustBeBetween', { min: 1, max: 16 }) + }} </template> <template v-else-if="!$v.form.username.pattern"> - Invalid format + {{ $t('global.form.invalidFormat') }} </template> </b-form-invalid-feedback> </b-form-group> - <b-form-group label="Privilege"> + <b-form-group + :label="$t('pageLocalUserManagement.modal.privilege')" + > <b-form-select v-model="form.privilege" :options="privilegeTypes" @@ -67,20 +80,23 @@ </b-form-select> <b-form-invalid-feedback role="alert"> <template v-if="!$v.form.privilege.required"> - Field required + {{ $t('global.form.fieldRequired') }} </template> </b-form-invalid-feedback> </b-form-group> </b-col> <b-col> - <b-form-group label="User password" label-for="password"> + <b-form-group + :label="$t('pageLocalUserManagement.modal.userPassword')" + label-for="password" + > <b-form-text id="password-help-block"> - Password must between - <span class="text-nowrap"> - {{ passwordRequirements.minLength }} - – {{ passwordRequirements.maxLength }} - </span> - characters + {{ + $t('pageLocalUserManagement.modal.passwordMustBeBetween', { + min: passwordRequirements.minLength, + max: passwordRequirements.maxLength + }) + }} </b-form-text> <input-password-toggle> <b-form-input @@ -93,25 +109,28 @@ /> <b-form-invalid-feedback role="alert"> <template v-if="!$v.form.password.required"> - Field required + {{ $t('global.form.fieldRequired') }} </template> <template v-if=" !$v.form.password.minLength || !$v.form.password.maxLength " > - Length must be between - <span class="text-nowrap"> - {{ passwordRequirements.minLength }} - – {{ passwordRequirements.maxLength }} - </span> - characters + {{ + $t( + 'pageLocalUserManagement.modal.passwordMustBeBetween', + { + min: passwordRequirements.minLength, + max: passwordRequirements.maxLength + } + ) + }} </template> </b-form-invalid-feedback> </input-password-toggle> </b-form-group> <b-form-group - label="Confirm user password" + :label="$t('pageLocalUserManagement.modal.confirmUserPassword')" label-for="password-confirmation" > <input-password-toggle> @@ -124,12 +143,14 @@ /> <b-form-invalid-feedback role="alert"> <template v-if="!$v.form.passwordConfirmation.required"> - Field required + {{ $t('global.form.fieldRequired') }} </template> <template v-else-if="!$v.form.passwordConfirmation.sameAsPassword" > - Passwords do not match + {{ + $t('pageLocalUserManagement.modal.passwordsDoNotMatch') + }} </template> </b-form-invalid-feedback> </input-password-toggle> @@ -140,10 +161,10 @@ </b-form> <template v-slot:modal-ok> <template v-if="newUser"> - Add user + {{ $t('pageLocalUserManagement.addUser') }} </template> <template v-else> - Save + {{ $t('global.action.save') }} </template> </template> </b-modal> diff --git a/src/views/AccessControl/LocalUserManagement/TableRoles.vue b/src/views/AccessControl/LocalUserManagement/TableRoles.vue index 0927c55d..a951b4f5 100644 --- a/src/views/AccessControl/LocalUserManagement/TableRoles.vue +++ b/src/views/AccessControl/LocalUserManagement/TableRoles.vue @@ -34,63 +34,81 @@ export default { return { items: [ { - description: 'Configure components managed by this service', + description: this.$t( + 'pageLocalUserManagement.tableRoles.configureComponentsManagedByThisService' + ), administrator: true, operator: false, readonly: false, noaccess: false }, { - description: 'Configure manager resources', + description: this.$t( + 'pageLocalUserManagement.tableRoles.configureManagerResources' + ), administrator: true, operator: false, readonly: false, noaccess: false }, { - description: 'Update password for current user account', + description: this.$t( + 'pageLocalUserManagement.tableRoles.updatePasswordForCurrentUserAccount' + ), administrator: true, operator: false, // TODO Set to true when profile page added readonly: false, // TODO Set to true when profile page added noaccess: false }, { - description: 'Configure users and their accounts', + description: this.$t( + 'pageLocalUserManagement.tableRoles.configureUsersAndTheirAccounts' + ), administrator: true, operator: false, readonly: false, noaccess: false }, { - description: 'Log in to the service and read resources', + description: this.$t( + 'pageLocalUserManagement.tableRoles.logInToTheServiceAndReadResources' + ), administrator: true, operator: true, readonly: true, noaccess: false }, { - description: 'IPMI access point', + description: this.$t( + 'pageLocalUserManagement.tableRoles.ipmiAccessPoint' + ), administrator: true, operator: true, readonly: true, noaccess: false }, { - description: 'Redfish access point', + description: this.$t( + 'pageLocalUserManagement.tableRoles.redfishAccessPoint' + ), administrator: true, operator: true, readonly: true, noaccess: false }, { - description: 'SSH access point', + description: this.$t( + 'pageLocalUserManagement.tableRoles.sshAccessPoint' + ), administrator: true, operator: false, readonly: false, noaccess: false }, { - description: 'WebUI access point', + description: this.$t( + 'pageLocalUserManagement.tableRoles.webUiAccessPoint' + ), administrator: true, operator: true, readonly: true, |