Skip to content

Commit

Permalink
fix: i18n bugs of Breadcrumb (#526)
Browse files Browse the repository at this point in the history
  • Loading branch information
linkun-wang authored Aug 9, 2023
1 parent b601dfb commit f8304b4
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 34 deletions.
58 changes: 29 additions & 29 deletions front-end/src/components/Breadcrumb/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@
<el-breadcrumb class="app-breadcrumb" separator="/">
<transition-group name="breadcrumb">
<el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
<span v-if="item.redirect==='noredirect'||index==levelList.length-1" class="no-redirect">{{ generateTitle(item.meta.title) }}</span>
<router-link v-else :to="item.path">{{ generateTitle(item.meta.title) }}</router-link>
<span v-if="item.redirect==='noredirect'||index==levelList.length-1" class="no-redirect">{{ generateTitle(item.meta.title, 'breadcrumb') }}</span>
<router-link v-else :to="item.path">{{ generateTitle(item.meta.title, 'breadcrumb') }}</router-link>
</el-breadcrumb-item>
</transition-group>
</el-breadcrumb>
Expand Down Expand Up @@ -62,7 +62,7 @@ export default {
'path': matched[i].path,
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.management')
'title': 'management'
}
})
}
Expand All @@ -71,191 +71,191 @@ export default {
route.push({
'path': '/management/clusters',
'meta': {
'title': this.$i18n.t('breadcrumb.clusters')
'title': 'clusters'
},
'redirect': matched[i].redirect
})
route.push({
'path': '/management/clusters/' + pathList[3] + '/cluster?tab=brokers',
'meta': {
'title': this.$i18n.t('breadcrumb.brokers')
'title': 'brokers'
},
'redirect': matched[i].redirect
})
route.push({
'path': matched[i].path,
'meta': {
'title': this.$i18n.t('breadcrumb.brokerInfo')
'title': 'brokerInfo'
},
'redirect': matched[i].redirect
})
} else if (pathList.indexOf('namespaceIsolationPolicy') === 5) {
route.push({
'path': '/management/clusters',
'meta': {
'title': this.$i18n.t('breadcrumb.clusters')
'title': 'clusters'
},
'redirect': matched[i].redirect
})
route.push({
'path': '/management/clusters/' + pathList[3] + '/cluster?tab=isolationPolicies',
'meta': {
'title': this.$i18n.t('breadcrumb.isolationPolicies')
'title': 'isolationPolicies'
},
'redirect': matched[i].redirect
})
route.push({
'path': matched[i].path,
'meta': {
'title': this.$i18n.t('breadcrumb.isolationPolicyInfo')
'title': 'isolationPolicyInfo'
},
'redirect': matched[i].redirect
})
} else if (pathList.indexOf('failureDomainName') === 5) {
route.push({
'path': '/management/clusters',
'meta': {
'title': this.$i18n.t('breadcrumb.clusters')
'title': 'clusters'
},
'redirect': matched[i].redirect
})
route.push({
'path': '/management/clusters/' + pathList[3] + '/cluster?tab=failureDomains',
'meta': {
'title': this.$i18n.t('breadcrumb.failureDomains')
'title': 'failureDomains'
},
'redirect': matched[i].redirect
})
route.push({
'path': matched[i].path,
'meta': {
'title': this.$i18n.t('breadcrumb.failureDomainInfo')
'title': 'failureDomainInfo'
},
'redirect': matched[i].redirect
})
} else if (pathList.indexOf('cluster') === 4) {
route.push({
'path': '/management/clusters',
'meta': {
'title': this.$i18n.t('breadcrumb.clusters')
'title': 'clusters'
},
'redirect': matched[i].redirect
})
route.push({
'path': matched[i].path,
'meta': {
'title': this.$i18n.t('breadcrumb.clusterInfo')
'title': 'clusterInfo'
},
'redirect': matched[i].redirect
})
} else if (pathList.indexOf('clusters') === 2) {
route.push({
'path': '/management/clusters',
'meta': {
'title': this.$i18n.t('breadcrumb.clusters')
'title': 'clusters'
},
'redirect': matched[i].redirect
})
} else if (pathList.indexOf('subscriptions') === 2) {
route.push({
'path': '/management/tenants',
'meta': {
'title': this.$i18n.t('breadcrumb.tenants')
'title': 'tenants'
},
'redirect': matched[i].redirect
})
route.push({
'path': '/management/tenants/tenantInfo/' + pathList[4] + '?tab=namespaces',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.namespaces')
'title': 'namespaces'
}
})
route.push({
'path': '/management/namespaces/' + pathList[4] + '/' + pathList[5] + '/namespace' + '?tab=topics',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.topics')
'title': 'topics'
}
})
route.push({
'path': '/management/topics/' + pathList[3] + '/' + pathList[4] + '/' + pathList[5] + '/' + pathList[6] + '/topic',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.subscriptions')
'title': 'subscriptions'
}
})
route.push({
'path': matched[i].path,
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.subscriptionInfo')
'title': 'subscriptionInfo'
}
})
} else if (pathList.indexOf('topics') === 2) {
route.push({
'path': '/management/tenants',
'meta': {
'title': this.$i18n.t('breadcrumb.tenants')
'title': 'tenants'
},
'redirect': matched[i].redirect
})
route.push({
'path': '/management/tenants/tenantInfo/' + pathList[4] + '?tab=namespaces',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.namespaces')
'title': 'namespaces'
}
})
route.push({
'path': '/management/namespaces/' + pathList[4] + '/' + pathList[5] + '/namespace' + '?tab=topics',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.topics')
'title': 'topics'
}
})
route.push({
'path': matched[i].path,
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.topicInfo')
'title': 'topicInfo'
}
})
} else if (pathList.indexOf('namespaces') === 2) {
route.push({
'path': '/management/tenants',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.tenants')
'title': 'tenants'
}
})
route.push({
'path': '/management/tenants/tenantInfo/' + pathList[3] + '?tab=namespaces',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.namespaces')
'title': 'namespaces'
}
})
route.push({
'path': matched[i].path,
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.namespaceInfo')
'title': 'namespaceInfo'
}
})
} else if (pathList.indexOf('tenantInfo') === 3) {
route.push({
'path': '/management/tenants',
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.tenants')
'title': 'tenants'
}
})
route.push({
'path': matched[i].path,
'redirect': matched[i].redirect,
'meta': {
'title': this.$i18n.t('breadcrumb.tenantInfo')
'title': 'tenantInfo'
}
})
}
Expand Down
9 changes: 4 additions & 5 deletions front-end/src/utils/i18n.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,14 +12,13 @@
* limitations under the License.
*/
// translate router.meta.title, be used in breadcrumb sidebar tagsview
export function generateTitle(title) {
const hasKey = this.$te('route.' + title)
export function generateTitle(title, type = 'route') {
const i18nKey = `${type}.${title}`
const hasKey = this.$te(i18nKey)

if (hasKey) {
// $t :this method from vue-i18n, inject in @/lang/index.js
const translatedTitle = this.$t('route.' + title)

return translatedTitle
return this.$t(i18nKey)
}
return title
}

0 comments on commit f8304b4

Please sign in to comment.