This is an automated email from the ASF dual-hosted git repository.
jinsongzhou pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/amoro.git
The following commit(s) were added to refs/heads/master by this push:
new fcc794c36 [Improvement] Complete internationalization for some
remaining pages (#3011)
fcc794c36 is described below
commit fcc794c36a072d38e4961dccb5432304ffdda7a1
Author: chouchouji <[email protected]>
AuthorDate: Mon Jul 8 10:29:49 2024 +0800
[Improvement] Complete internationalization for some remaining pages (#3011)
* [Improvement] Complete internationalization for some remaining pages
* refactor(amoro-ams-dashboard): optimize code
* refactor(amoro-ams-dashboard): optimize code
* refactor(amoro-ams-dashboard): optimize code
---
amoro-ams/amoro-ams-dashboard/src/App.vue | 6 +-
.../amoro-ams-dashboard/src/components/Topbar.vue | 140 +++++++++------------
amoro-ams/amoro-ams-dashboard/src/language/en.ts | 8 ++
amoro-ams/amoro-ams-dashboard/src/language/zh.ts | 8 ++
.../src/views/hive-details/components/ErrorMsg.vue | 2 +-
.../src/views/hive-details/upgrade.vue | 4 +-
.../src/views/optimize/components/List.vue | 3 -
.../src/views/optimize/components/ScaleOut.vue | 9 +-
.../src/views/optimize/index.vue | 1 -
.../src/views/resource/components/GroupModal.vue | 9 +-
.../src/views/resource/components/List.vue | 3 -
.../src/views/tables/components/Operations.vue | 4 +-
.../src/views/tables/components/Optimizing.vue | 3 -
.../src/views/tables/components/Selector.vue | 8 +-
.../amoro-ams-dashboard/src/views/tables/index.vue | 12 +-
.../src/views/terminal/components/sql-result.vue | 5 +-
16 files changed, 115 insertions(+), 110 deletions(-)
diff --git a/amoro-ams/amoro-ams-dashboard/src/App.vue
b/amoro-ams/amoro-ams-dashboard/src/App.vue
index 888b68c62..4b0194fc5 100644
--- a/amoro-ams/amoro-ams-dashboard/src/App.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/App.vue
@@ -20,9 +20,11 @@
import zhCN from 'ant-design-vue/es/locale/zh_CN'
import enUS from 'ant-design-vue/es/locale/en_US'
import dayjs from 'dayjs'
-import { ref, watch } from 'vue'
+import { watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import 'dayjs/locale/zh-cn';
-const locale = ref(enUS.locale)
+const { locale } = useI18n()
dayjs.locale('en')
watch(locale, (val) => {
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
b/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
index aea7ca84a..dacdfd89f 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
@@ -16,8 +16,8 @@
limitations under the License.
/ -->
-<script lang="ts">
-import { defineComponent, onMounted, reactive } from 'vue'
+<script setup lang="ts">
+import { onMounted, reactive } from 'vue'
import { Modal } from 'ant-design-vue'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
@@ -25,78 +25,67 @@ import { useRouter } from 'vue-router'
import useStore from '@/store'
import { getVersionInfo } from '@/services/global.service'
import loginService from '@/services/login.service'
+import { DownOutlined, QuestionCircleOutlined, LogoutOutlined,
TranslationOutlined } from '@ant-design/icons-vue'
interface IVersion {
version: string
commitTime: string
}
-export default defineComponent ({
- name: 'Topbar',
- setup() {
- const verInfo = reactive<IVersion>({
- version: '',
- commitTime: '',
- })
-
- const { t, locale } = useI18n()
- const router = useRouter()
-
- const getVersion = async () => {
- const res = await getVersionInfo()
- if (res) {
- verInfo.version = res.version
- verInfo.commitTime = res.commitTime
- }
- }
+const verInfo = reactive<IVersion>({
+ version: '',
+ commitTime: '',
+})
- const goLoginPage = () => {
- router.push({ path: '/login' })
- }
+const { t, locale } = useI18n()
+const router = useRouter()
+const store = useStore()
- const handleLogout = async () => {
- Modal.confirm({
- title: t('logoutModalTitle'),
- okText: t('confirm'),
- cancelText: t('cancel'),
- onOk: async () => {
- try {
- await loginService.logout()
- }
- catch (error) {
- }
- finally {
- const store = useStore()
- store.updateUserInfo({
- userName: '',
- })
- goLoginPage()
- }
- },
- })
- }
+const getVersion = async () => {
+ const res = await getVersionInfo()
+ if (res) {
+ verInfo.version = res.version
+ verInfo.commitTime = res.commitTime
+ }
+}
- const goDocs = () => {
- window.open('https://amoro.apache.org/docs/latest/')
- }
+const goLoginPage = () => {
+ router.push({ path: '/login' })
+}
- const setLocale = ({ key }: { key: string }) => {
- if(locale.value !== key) {
- locale.value = key
+const handleLogout = async () => {
+ Modal.confirm({
+ title: t('logoutModalTitle'),
+ onOk: async () => {
+ try {
+ await loginService.logout()
}
- };
+ catch (error) {
+ }
+ finally {
+ store.updateUserInfo({
+ userName: '',
+ })
+ goLoginPage()
+ }
+ },
+ })
+}
- onMounted(() => {
- getVersion()
- })
+const goDocs = () => {
+ window.open('https://amoro.apache.org/docs/latest/')
+}
- return {
- verInfo,
- goDocs,
- handleLogout,
- setLocale,
- }
- },
+const setLocale = () => {
+ if(locale.value === 'zh') {
+ locale.value = 'en'
+ } else {
+ locale.value = 'zh'
+ }
+}
+
+onMounted(() => {
+ getVersion()
})
</script>
@@ -106,29 +95,22 @@ export default defineComponent ({
<span class="g-mr-8">{{ `${$t('version')}: ${verInfo.version}` }}</span>
<span class="g-mr-8">{{ `${$t('commitTime')}: ${verInfo.commitTime}`
}}</span>
</div>
- <a-tooltip placement="bottomRight" arrow-point-at-center
overlay-class-name="topbar-tooltip">
- <template #title>
- {{ $t('userGuide') }}
- </template>
- <question-circle-outlined class="question-icon" @click="goDocs" />
- </a-tooltip>
<a-dropdown>
- <TranslationOutlined class="g-ml-8" />
+ <span>{{ store.userInfo.userName}} <DownOutlined /></span>
<template #overlay>
- <a-menu @click="setLocale">
- <a-menu-item key="en">English</a-menu-item>
- <a-menu-item key="zh">中文</a-menu-item>
+ <a-menu>
+ <a-menu-item key="userGuide" @click="goDocs">
+ <question-circle-outlined /> {{ $t('userGuide') }}
+ </a-menu-item>
+ <a-menu-item key="locale" @click="setLocale">
+ <translation-outlined /> {{ locale === 'zh' ? '切换至英文' : 'Switch To
Chinese' }}
+ </a-menu-item>
+ <a-menu-item key="logout" @click="handleLogout">
+ <logout-outlined /> {{ $t('logout') }}
+ </a-menu-item>
</a-menu>
</template>
</a-dropdown>
- <a-tooltip>
- <template #title>
- {{ $t('logout') }}
- </template>
- <a-button class="logout-button" @click="handleLogout">
- <LogoutOutlined style="font-size: 1.2em" />
- </a-button>
- </a-tooltip>
</div>
</template>
diff --git a/amoro-ams/amoro-ams-dashboard/src/language/en.ts
b/amoro-ams/amoro-ams-dashboard/src/language/en.ts
index b49d680ac..60c6ed7ee 100644
--- a/amoro-ams/amoro-ams-dashboard/src/language/en.ts
+++ b/amoro-ams/amoro-ams-dashboard/src/language/en.ts
@@ -205,4 +205,12 @@ export default {
noResourceGroupsTitle: 'No resource groups available.',
noResourceGroupsContent: 'Please create an optimizer group first.',
goToButtonText: 'Go',
+ snapshots: 'Snapshots',
+ details: 'Details',
+ operations: 'Operations',
+ Running: 'Running',
+ Canceled: 'Canceled',
+ Failed: 'Failed',
+ Finished: 'Finished',
+ Created: 'Created',
}
diff --git a/amoro-ams/amoro-ams-dashboard/src/language/zh.ts
b/amoro-ams/amoro-ams-dashboard/src/language/zh.ts
index d8bb45b15..23cdeee18 100644
--- a/amoro-ams/amoro-ams-dashboard/src/language/zh.ts
+++ b/amoro-ams/amoro-ams-dashboard/src/language/zh.ts
@@ -205,4 +205,12 @@ export default {
noResourceGroupsTitle: '没有任何优化组',
noResourceGroupsContent: '需要首先创建一个默认优化组',
goToButtonText: '前往',
+ snapshots: '快照',
+ details: '详情',
+ operations: '操作',
+ Running: '运行中',
+ Canceled: '已取消',
+ Failed: '已失败',
+ Finished: '已结束',
+ Created: '已创建',
}
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
index 609dcadd9..c0934cbf2 100644
---
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
+++
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
@@ -31,7 +31,7 @@ const open = ref(true)
<AModal
v-model:open="open"
:width="560"
- :title="`${$t('errorMessage')}`"
+ :title="$t('errorMessage')"
:footer="null"
class="upgrade-error"
@cancel="emit('cancel')"
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
index a5e22f9a3..bce4ae927 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
@@ -73,7 +73,7 @@ async function getDetails() {
}
}
-function onCofirm() {
+function onConfirm() {
getParams()
}
@@ -158,7 +158,7 @@ onMounted(() => {
</a-form>
</div>
<div class="footer-btn">
- <a-button type="primary" :loading="loading" class="btn g-mr-12"
@click="onCofirm">
+ <a-button type="primary" :loading="loading" class="btn g-mr-12"
@click="onConfirm">
{{ $t('ok') }}
</a-button>
<a-button type="ghost" class="btn" @click="cancel">
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
index 112d67b92..a815b24f6 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
@@ -110,9 +110,6 @@ function releaseModal(record: any) {
}
Modal.confirm({
title: t('releaseOptModalTitle'),
- content: '',
- okText: '',
- cancelText: '',
onOk: () => {
releaseJob(record)
},
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
index 8dc3eff9e..f9a1c9360 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
@@ -85,7 +85,14 @@ onMounted(() => {
</script>
<template>
- <AModal :visible="props.visible" :title="$t('scaleOut')"
:confirm-loading="confirmLoading" :closable="false" @ok="handleOk"
@cancel="handleCancel">
+ <AModal
+ :open="props.visible"
+ :title="$t('scaleOut')"
+ :confirm-loading="confirmLoading"
+ :closable="false"
+ @ok="handleOk"
+ @cancel="handleCancel"
+ >
<a-form ref="formRef" :model="formState" class="label-120">
<a-form-item name="resourceGroup" :label="$t('resourceGroup')"
:rules="[{ required: true, message: `${placeholder.resourceGroupPh}` }]">
<a-select
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/optimize/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/optimize/index.vue
index fbc8faa33..1b017b50f 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/optimize/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/optimize/index.vue
@@ -25,7 +25,6 @@ import type { IGroupItem, IGroupItemInfo, ILableAndValue,
IMap } from '@/types/c
import { usePlaceholder } from '@/hooks/usePlaceholder'
import { usePagination } from '@/hooks/usePagination'
import { getOptimizerGroups, getQueueResourceInfo } from
'@/services/optimize.service'
-// import ScaleOutModal from './components/ScaleOut.vue'
import { mbToSize } from '@/utils'
export default defineComponent({
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
index 19e61789c..12469f316 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
@@ -109,8 +109,13 @@ onMounted(() => {
<template>
<AModal
- :visible="true" :title="edit ? $t('editgroup') : $t('addgroup')"
:confirm-loading="confirmLoading"
- :closable="false" class="group-modal" @ok="handleOk" @cancel="handleCancel"
+ :open="true"
+ :title="edit ? $t('editgroup') : $t('addgroup')"
+ :confirm-loading="confirmLoading"
+ :closable="false"
+ class="group-modal"
+ @ok="handleOk"
+ @cancel="handleCancel"
>
<a-form ref="formRef" :model="formState" class="label-120">
<a-form-item name="name" :label="$t('name')" :rules="[{ required: true,
message: `${placeholder.groupNamePh}` }]">
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
index 7c2d42c3e..981e37099 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
@@ -96,9 +96,6 @@ function releaseModal(record: any) {
}
Modal.confirm({
title: t('releaseOptModalTitle'),
- content: '',
- okText: '',
- cancelText: '',
onOk: () => {
releaseJob(record)
},
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
index c9cd4e748..2063bff44 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
@@ -124,9 +124,9 @@ onMounted(() => {
</a-table>
</div>
<AModal
- :visible="visible"
+ :open="visible"
:width="560"
- :title="`${$t('operationDetails')}`"
+ :title="$t('operationDetails')"
class="operation-wrap"
@cancel="cancel"
>
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
index 7482b4f38..eeb45138f 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
@@ -124,9 +124,6 @@ async function refreshOptimizingProcesses() {
async function cancel() {
Modal.confirm({
title: t('cancelOptimizingProcessOptModalTitle'),
- content: '',
- okText: '',
- cancelText: '',
onOk: async () => {
try {
loading.value = true
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
index cf41fe50a..bc9162d80 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
@@ -88,11 +88,11 @@ onMounted(() => {
<template #overlay>
<div>
<div class="branch-selector-search">
- <a-input v-show="tabActiveKey === branchTypeMap.BRANCH"
v-model:value="branchSearchKey" :placeholder="$t('Filter branches/tags')"
@click="onClickInput" />
- <a-input v-show="tabActiveKey === branchTypeMap.TAG"
v-model:value="tagSearchKey" :placeholder="$t('Filter branches/tags')"
@click="onClickInput" />
+ <a-input v-show="tabActiveKey === branchTypeMap.BRANCH"
v-model:value="branchSearchKey" :placeholder="$t('filterBranchesOrTags')"
@click="onClickInput" />
+ <a-input v-show="tabActiveKey === branchTypeMap.TAG"
v-model:value="tagSearchKey" :placeholder="$t('filterBranchesOrTags')"
@click="onClickInput" />
</div>
<a-tabs v-model:activeKey="tabActiveKey" type="card">
- <a-tab-pane :key="branchTypeMap.BRANCH" tab="Branches">
+ <a-tab-pane :key="branchTypeMap.BRANCH" :tab="$t('branches')">
<template v-if="!!actualBranchList.length">
<div v-for="(item, key) in actualBranchList" :key="key"
class="branch-selector-item" @click="selectObject(item)">
<div class="item-icon">
@@ -103,7 +103,7 @@ onMounted(() => {
</template>
<span v-else class="empty-tips">{{ $t('nothingToShow') }}</span>
</a-tab-pane>
- <a-tab-pane :key="branchTypeMap.TAG" tab="Tags">
+ <a-tab-pane :key="branchTypeMap.TAG" :tab="$t('tags')">
<template v-if="!!actualTagList.length">
<div v-for="(item, key) in actualTagList" :key="key"
class="branch-selector-item" @click="selectObject(item)">
<div class="item-icon">
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
index 5e5eca29a..f5aa495ee 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
@@ -44,9 +44,9 @@ export default defineComponent({
const detailRef = ref()
const tabConfigs = shallowReactive([
- { key: 'Snapshots', label: 'Snapshots' },
- { key: 'Optimizing', label: 'Optimizing' },
- { key: 'Operations', label: 'Operations' },
+ { key: 'Snapshots', label: 'snapshots' },
+ { key: 'Optimizing', label: 'optimizing' },
+ { key: 'Operations', label: 'operations' },
])
const state = reactive({
@@ -155,13 +155,13 @@ export default defineComponent({
</div>
<div class="content">
<a-tabs v-model:activeKey="activeKey" destroy-inactive-tab-pane
@change="onChangeTab">
- <a-tab-pane key="Details" tab="Details" force-render>
+ <a-tab-pane key="Details" :tab="$t('details')" force-render>
<UDetails ref="detailRef"
@set-base-detail-info="setBaseDetailInfo" />
</a-tab-pane>
- <a-tab-pane v-if="detailLoaded" key="Files" tab="Files">
+ <a-tab-pane v-if="detailLoaded" key="Files" :tab="$t('files')">
<UFiles :has-partition="baseInfo.hasPartition" />
</a-tab-pane>
- <a-tab-pane v-for="tab in tabConfigs" :key="tab.key"
:tab="`${tab.label}`">
+ <a-tab-pane v-for="tab in tabConfigs" :key="tab.key"
:tab="$t(tab.label)">
<component :is="`U${tab.key}`" />
</a-tab-pane>
</a-tabs>
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
b/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
index a17486abf..aeb373a3e 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
@@ -27,6 +27,9 @@ const isEmpty = computed(() => {
return !props.info || !props.info?.columns
})
+const status = computed(() => {
+ return props.info?.status
+})
</script>
<template>
@@ -45,7 +48,7 @@ const isEmpty = computed(() => {
<template v-if="status === 'Created'">
<close-circle-outlined style="color:#333" />
</template>
- <span class="g-ml-8">{{ status }}</span>
+ <span class="g-ml-8">{{ $t(status) }}</span>
</div>
<div v-if="isEmpty" class="empty">
{{ $t('noResult') }}
