feat(i18n): add ui localization (#2279)
Co-authored-by: TheElixZammuto <6505622+TheElixZammuto@users.noreply.github.com>
This commit is contained in:
@@ -16,42 +16,40 @@
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body id="app">
|
||||
<body id="app" v-cloak>
|
||||
<Navbar></Navbar>
|
||||
<div class="container">
|
||||
<h1 class="my-4">Password Change</h1>
|
||||
<h1 class="my-4">{{ $t('password.password_change') }}</h1>
|
||||
<form @submit.prevent="save">
|
||||
<div class="card d-flex p-4 flex-row">
|
||||
<div class="col-md-6 px-4">
|
||||
<h4>Current Credentials</h4>
|
||||
<h4>{{ $t('password.current_creds') }}</h4>
|
||||
<div class="mb-3">
|
||||
<label for="currentUsername" class="form-label">Username</label>
|
||||
<label for="currentUsername" class="form-label">{{ $t('_common.username') }}</label>
|
||||
<input required type="text" class="form-control" id="currentUsername"
|
||||
v-model="passwordData.currentUsername" />
|
||||
<div class="form-text"> </div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="currentPassword" class="form-label">Password</label>
|
||||
<label for="currentPassword" class="form-label">{{ $t('_common.password') }}</label>
|
||||
<input autocomplete="current-password" type="password" class="form-control" id="currentPassword"
|
||||
v-model="passwordData.currentPassword" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 px-4">
|
||||
<h4>New Credentials</h4>
|
||||
<h4>{{ $t('password.new_creds') }}</h4>
|
||||
<div class="mb-3">
|
||||
<label for="newUsername" class="form-label">New Username</label>
|
||||
<label for="newUsername" class="form-label">{{ $t('_common.username') }}</label>
|
||||
<input type="text" class="form-control" id="newUsername" v-model="passwordData.newUsername" />
|
||||
<div class="form-text">
|
||||
If not specified, the username will not change
|
||||
</div>
|
||||
<div class="form-text">{{ $t('password.new_username_desc') }}</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="newPassword" class="form-label">Password</label>
|
||||
<label for="newPassword" class="form-label">{{ $t('_common.password') }}</label>
|
||||
<input autocomplete="new-password" required type="password" class="form-control" id="newPassword"
|
||||
v-model="passwordData.newPassword" />
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="confirmNewPassword" class="form-label">Confirm Password</label>
|
||||
<label for="confirmNewPassword" class="form-label">{{ $t('password.confirm_password') }}</label>
|
||||
<input autocomplete="new-password" required type="password" class="form-control" id="confirmNewPassword"
|
||||
v-model="passwordData.confirmNewPassword" />
|
||||
</div>
|
||||
@@ -59,17 +57,17 @@
|
||||
</div>
|
||||
<div class="alert alert-danger" v-if="error"><b>Error: </b>{{error}}</div>
|
||||
<div class="alert alert-success" v-if="success">
|
||||
<b>Success! </b>This page will reload soon, your browser will ask you for
|
||||
the new credentials
|
||||
<b>{{ $t('_common.success') }}</b> {{ $t('password.success_msg') }}
|
||||
</div>
|
||||
<div class="mb-3 buttons">
|
||||
<button class="btn btn-primary">Save</button>
|
||||
<button class="btn btn-primary">{{ $t('_common.save') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
<script type="module">
|
||||
import { createApp } from 'vue'
|
||||
import i18n from './locale.js'
|
||||
import Navbar from './Navbar.vue'
|
||||
|
||||
const app = createApp({
|
||||
@@ -115,5 +113,9 @@
|
||||
},
|
||||
});
|
||||
|
||||
app.mount("#app");
|
||||
//Wait for locale initialization, then render
|
||||
i18n().then(i18n => {
|
||||
app.use(i18n);
|
||||
app.mount('#app');
|
||||
});
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user