sipwise
/
ngcp-csc-ui
mirror of https://github.com/sipwise/ngcp-csc-ui.git
1
0
Fork 0
Code Issues Releases Wiki Activity

TT#128154 i18n - Fix none reactive translations in all places

Browse Source 
Fixed:
* translations for the first item in main menu "Start new call"
* fixed not translated page titles and back button in browser history
* fixed route for 404 page
* fixed intermittent issues with history by switching to Meta plugin instead of direc "document.title" call (bug was next: sometimes you can see current page in the history list as a previous route). It's the same solution that we have in AUI

Change-Id: Iea95e11911a76a5778fefe8320fc39f1934f8a6d
(cherry picked from commit 9bfde3e150)
mr9.5.2
Sergii Leonenko 4 years ago committed by Hans-Peter Herzog
parent 991d45858a
commit 4e92b9679a
10 changed files with 242 additions and 117 deletions
Show Stats Download Patch File Download Diff File

3
quasar.conf.js
Unescape View File

@ -115,7 +115,8 @@ module.exports = function (/* ctx */) {
'Dialog',
'SessionStorage',
'LocalStorage',
'Dark'
'Dark',
'Meta'
]
},

42
src/App.vue
Unescape View File

@ -4,7 +4,47 @@
</div>
</template>
<script>
import { APP_NAME } from 'src/constants'
import _ from 'lodash'
export default {
name: 'App'
name: 'App',
meta () {
return {
title: this.pageTitle,
titleTemplate: title => `${APP_NAME} - ${title}`
}
},
data () {
return {
pageTitle: ''
}
},
watch: {
$route (route) {
this.updateTitle(route)
}
},
mounted () {
this.updateTitle(this.$route)
},
methods: {
updateTitle: function (route) {
if (route) {
const titleElements = []
const title = _.get(route, 'meta.title', '')
const subTitle = _.get(route, 'meta.subtitle', '')
if (title !== '') {
titleElements.push(title)
}
if (subTitle !== '') {
titleElements.push(subTitle)
}
this.pageTitle = titleElements.join(' - ') || route.name || ''
} else {
this.pageTitle = ''
}
}
}
}
</script>

11
src/boot/routes.js
Unescape View File

@ -1,6 +1,5 @@
import routes from 'src/router/routes'
import _ from 'lodash'
import {
Dark
} from 'quasar'
@ -45,16 +44,6 @@ export default ({ app, router, store }) => {
})
router.afterEach((to, from) => {
const mainTitle = app.i18n.t('CSC')
let title = _.get(to, 'meta.title', '')
const subTitle = _.get(to, 'meta.subtitle', '')
if (mainTitle !== '') {
title = mainTitle + ' - ' + title
}
if (subTitle !== '') {
title = title + ' - ' + subTitle
}
document.title = title
store.commit('routeChanged', to)
})

2
src/constants.js
Unescape View File

@ -1,3 +1,5 @@
export const APP_NAME = 'CSC'
export const INTERNAL_DATE_FORMAT_SLASH = 'YYYY/MM/DD'
export const INTERNAL_DATE_FORMAT_DASH = 'YYYY-MM-DD'

2
src/layouts/CscLayoutConference.vue
Unescape View File

@ -184,13 +184,11 @@ import CscConferenceJoin from 'components/pages/Conference/CscConferenceJoin'
import CscConferenceJoined from 'components/pages/Conference/CscConferenceJoined'
import CscMedia from 'components/CscMedia'
import CscConfirmDialog from 'components/CscConfirmationDialog'
// import CscConferenceLocalParticipant from 'components/pages/Conference/CscConferenceLocalParticipant'
import CscConferenceParticipants from 'components/pages/Conference/CscConferenceParticipants'
export default {
name: 'CscConferenceLayout',
components: {
// CscConferenceLocalParticipant,
CscConferenceParticipants,
CscConfirmDialog,
CscMedia,

30
src/layouts/CscLayoutMain.vue
Unescape View File

@ -305,13 +305,10 @@ export default {
'route'
]),
...mapGetters([
'pageTitle',
'pageSubtitle',
'isCallForward',
'isCallBlocking',
'isPbxConfiguration',
'isHome',
'title'
'isHome'
]),
...mapGetters('call', [
'isCallEnabled',
@ -383,20 +380,6 @@ export default {
}
return classes
},
pageTitleExt () {
if (this.isHome) {
return this.callStateTitle
} else {
return this.pageTitle
}
},
pageSubtitleExt () {
if (this.isHome) {
return this.callStateSubtitle
} else {
return this.pageSubtitle
}
},
headerClasses () {
const classes = ['transition-generic']
if (this.isMobile) {
@ -446,14 +429,10 @@ export default {
} else {
this.header = true
}
if (this.isHome) {
this.setCallStateTitle()
}
},
isHome (isHome) {
if (isHome) {
this.$store.commit('call/minimize')
this.setCallStateTitle()
}
},
userDataSucceeded (userDataSucceeded) {
@ -583,13 +562,6 @@ export default {
leftBreakpoint (enabled) {
this.mobileMenu = !enabled
},
setCallStateTitle () {
let title = this.callStateTitle
if (this.callStateSubtitle !== '') {
title = title + ' (' + this.callStateSubtitle + ')'
}
document.title = this.title + ' - ' + title
},
toggleMenu () {
this.menuMinimized = !this.menuMinimized
},

17
src/pages/CscPageHome.vue
Unescape View File

@ -57,6 +57,12 @@ import CscInlineAlertInfo from 'components/CscInlineAlertInfo'
import CscInput from 'components/form/CscInput'
export default {
name: 'CscPageHome',
meta () {
return {
title: this.pageTitle
}
},
components: {
CscInput,
CscInlineAlertInfo,
@ -79,7 +85,9 @@ export default {
'hasRtcEngineCapabilityEnabled',
'desktopSharingInstall',
'isCallEnabled',
'isCallInitializing'
'isCallInitializing',
'callStateTitle',
'callStateSubtitle'
]),
dialpadOpened () {
return this.callState === 'input' &&
@ -97,6 +105,13 @@ export default {
classes.push('csc-call-page-mobile')
}
return classes
},
pageTitle () {
let title = this.callStateTitle
if (this.callStateSubtitle !== '') {
title += ' (' + this.callStateSubtitle + ')'
}
return title
}
},
methods: {

228
src/router/routes.js
Unescape View File

@ -50,15 +50,21 @@ export default function routes (app) {
path: 'home',
component: CscPageHome,
meta: {
title: i18n.t('Start new call')
get title () {
return i18n.t('Start new call')
}
}
},
{
path: 'conversations',
component: CscPageConversations,
meta: {
title: i18n.t('Conversations'),
subtitle: i18n.t('Calls, Faxes, VoiceMails')
get title () {
return i18n.t('Conversations')
},
get subtitle () {
return i18n.t('Calls, Faxes, VoiceMails')
}
}
},
{
@ -69,71 +75,105 @@ export default function routes (app) {
path: 'call-forwarding',
component: CscPageCf,
meta: {
title: i18n.t('Call Forwarding')
get title () {
return i18n.t('Call Forwarding')
}
}
},
{
path: 'call-forward/always',
component: CscPageCallForwardAlways,
meta: {
title: i18n.t('Call Forwarding'),
subtitle: i18n.t('Always')
get title () {
return i18n.t('Call Forwarding')
},
get subtitle () {
return i18n.t('Always')
}
}
},
{
path: 'call-forward/company-hours',
component: CscPageCallForwardCompanyHours,
meta: {
title: i18n.t('Call Forwarding'),
subtitle: i18n.t('Company Hours')
get title () {
return i18n.t('Call Forwarding')
},
get subtitle () {
return i18n.t('Company Hours')
}
}
},
{
path: 'call-forward/after-hours',
component: CscPageCallForwardAfterHours,
meta: {
title: i18n.t('Call Forwarding'),
subtitle: i18n.t('After Hours')
get title () {
return i18n.t('Call Forwarding')
},
get subtitle () {
return i18n.t('After Hours')
}
}
},
{
path: 'call-blocking/incoming',
component: CscPageCallBlockingIncoming,
meta: {
title: i18n.t('Call Blocking'),
subtitle: i18n.t('Incoming')
get title () {
return i18n.t('Call Blocking')
},
get subtitle () {
return i18n.t('Incoming')
}
}
},
{
path: 'call-blocking/outgoing',
component: CscPageCallBlockingOutgoing,
meta: {
title: i18n.t('Call Blocking'),
subtitle: i18n.t('Outgoing')
get title () {
return i18n.t('Call Blocking')
},
get subtitle () {
return i18n.t('Outgoing')
}
}
},
{
path: 'call-blocking/privacy',
component: CscPageCallBlockingPrivacy,
meta: {
title: i18n.t('Call Blocking'),
subtitle: i18n.t('Privacy')
get title () {
return i18n.t('Call Blocking')
},
get subtitle () {
return i18n.t('Privacy')
}
}
},
{
path: 'recordings',
component: CscPageCallRecording,
meta: {
title: i18n.t('Recordings'),
subtitle: i18n.t('Call recordings')
get title () {
return i18n.t('Recordings')
},
get subtitle () {
return i18n.t('Call recordings')
}
}
},
{
path: 'reminder',
component: CscPageReminder,
meta: {
title: i18n.t('Reminder'),
subtitle: i18n.t('Set your personal alarm'),
get title () {
return i18n.t('Reminder')
},
get subtitle () {
return i18n.t('Set your personal alarm')
},
profileAttribute: 'reminder'
}
},
@ -141,8 +181,12 @@ export default function routes (app) {
path: 'speeddial',
component: CscPageSpeedDial,
meta: {
title: i18n.t('Speed Dial'),
subtitle: i18n.t('Set your speed dials'),
get title () {
return i18n.t('Speed Dial')
},
get subtitle () {
return i18n.t('Set your speed dials')
},
profileAttribute: 'speed_dial'
}
},
@ -150,64 +194,96 @@ export default function routes (app) {
path: 'pbx-configuration/groups',
component: CscPagePbxGroups,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Groups')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Groups')
}
}
},
{
path: 'pbx-configuration/seats',
component: CscPagePbxSeats,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Seats')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Seats')
}
}
},
{
path: 'pbx-configuration/devices',
component: CscPagePbxDevices,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Devices')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Devices')
}
}
},
{
path: 'pbx-configuration/call-queues',
component: CscPagePbxCallQueues,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Call Queues')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Call Queues')
}
}
},
{
path: 'pbx-configuration/sound-sets',
component: CscPagePbxSoundSets,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Sound Sets')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Sound Sets')
}
}
},
{
path: 'pbx-configuration/ms-configs',
component: CscPagePbxMsConfigs,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Manager Secretary')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Manager Secretary')
}
}
},
{
path: 'pbx-configuration/auto-attendant',
component: CscPagePbxAutoAttendant,
meta: {
title: i18n.t('PBX Configuration'),
subtitle: i18n.t('Auto-attendant')
get title () {
return i18n.t('PBX Configuration')
},
get subtitle () {
return i18n.t('Auto-attendant')
}
}
},
{
path: 'voicebox',
component: CscPageVoicebox,
meta: {
title: i18n.t('Voicebox'),
subtitle: i18n.t('Set your voicebox settings'),
get title () {
return i18n.t('Voicebox')
},
get subtitle () {
return i18n.t('Set your voicebox settings')
},
profileAttribute: 'voice_mail'
}
},
@ -215,8 +291,12 @@ export default function routes (app) {
path: 'fax-settings',
component: CscPageFaxSettings,
meta: {
title: i18n.t('Fax Settings'),
subtitle: i18n.t('Set your fax settings'),
get title () {
return i18n.t('Fax Settings')
},
get subtitle () {
return i18n.t('Set your fax settings')
},
profileAttribute: 'fax_server'
},
async beforeEnter (routeTo, routeFrom, next) {
@ -231,37 +311,58 @@ export default function routes (app) {
path: 'settings',
component: CscPageUserSettings,
meta: {
title: i18n.t('User settings'),
subtitle: i18n.t('Change password')
get title () {
return i18n.t('User settings')
},
get subtitle () {
return i18n.t('Change password')
}
}
},
{
path: 'call-settings',
component: CscPageCallSettings,
meta: {
title: i18n.t('Call Settings'),
subtitle: i18n.t('Call Settings')
get title () {
return i18n.t('Call Settings')
},
get subtitle () {
return i18n.t('Call Settings')
}
}
},
{
path: 'pbx-settings',
component: CscPagePbxSettings,
meta: {
title: i18n.t('PBX Settings'),
subtitle: i18n.t('Set your PBX settings')
get title () {
return i18n.t('PBX Settings')
},
get subtitle () {
return i18n.t('Set your PBX settings')
}
}
},
{
path: 'registered-devices',
component: CscPageRegisteredDevices,
meta: {
title: i18n.t('Registered Devices'),
subtitle: i18n.t('List of registered devices for the subscriber')
get title () {
return i18n.t('Registered Devices')
},
get subtitle () {
return i18n.t('List of registered devices for the subscriber')
}
}
},
{
path: '*',
component: CscPageError404
component: CscPageError404,
meta: {
get title () {
return i18n.t('Page not found')
}
}
}
]
},
@ -269,21 +370,27 @@ export default function routes (app) {
path: '/login',
component: CscPageLogin,
meta: {
title: i18n.t('Subscriber Sign In')
get title () {
return i18n.t('Subscriber Sign In')
}
}
},
{
path: '/conference',
component: CscLayoutConference,
meta: {
title: 'Conference'
get title () {
return i18n.t('Conference')
}
}
},
{
path: '/conference/:id',
component: CscLayoutConference,
meta: {
title: 'Conference'
get title () {
return i18n.t('Conference')
}
}
},
{
@ -295,7 +402,9 @@ export default function routes (app) {
component: CscRecoverPassword,
props: getToken,
meta: {
title: 'Reset Password',
get title () {
return i18n.t('Reset Password')
},
permission: 'public'
}
}
@ -309,7 +418,18 @@ export default function routes (app) {
},
{
path: '*',
component: CscPageError404
component: CscLayoutLogin,
children: [
{
path: '',
component: CscPageError404,
meta: {
get title () {
return i18n.t('Page not found')
}
}
}
]
}
]
}

12
src/store/call.js
Unescape View File

@ -20,12 +20,12 @@ export var CallState = {
ended: 'ended'
}
export var CallStateTitle = {
input: i18n.t('Start new call'),
initiating: i18n.t('Calling'),
ringing: i18n.t('Ringing at'),
incoming: i18n.t('Incoming call from'),
established: i18n.t('In call with'),
ended: i18n.t('Call ended')
get input () { return i18n.t('Start new call') },
get initiating () { return i18n.t('Calling') },
get ringing () { return i18n.t('Ringing at') },
get incoming () { return i18n.t('Incoming call from') },
get established () { return i18n.t('In call with') },
get ended () { return i18n.t('Call ended') }
}
export var MediaType = {

12
src/store/index.js
Unescape View File

@ -1,8 +1,5 @@
import Vue from 'vue'
import Vuex from 'vuex'
import {
i18n
} from 'src/boot/i18n'
import _ from 'lodash'
import { date } from 'quasar'
@ -94,12 +91,6 @@ export default function (/* { ssrContext } */) {
hasConferenceId (state, getters) {
return getters.conferenceId !== null && getters.conferenceId !== undefined
},
pageTitle (state) {
return _.get(state, 'route.meta.title', 'Not defined')
},
pageSubtitle (state) {
return _.get(state, 'route.meta.subtitle', '')
},
isCallForward (state) {
return _.startsWith(_.get(state, 'route.path', ''), '/user/call-forward')
},
@ -112,9 +103,6 @@ export default function (/* { ssrContext } */) {
isHome (state) {
return _.get(state, 'route.path', '') === '/user/home'
},
title () {
return i18n.t('CSC')
},
getCurrentFormattedDateWithDash () {
const currentDate = Date.now()
return date.formatDate(currentDate, INTERNAL_DATE_FORMAT_DASH)

Write Preview
Loading…
Cancel
Save