chore: add tooltip for menu

eclipse · Mar 23, 2024 · 9b05bc1 · 9b05bc1
1 parent eb0063f
commit 9b05bc1
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 19 deletions.
diff --git a/frontend/src/components/layouts/Side.vue b/frontend/src/components/layouts/Side.vue
@@ -11,10 +11,11 @@
  SPDX-License-Identifier: EPL-2.0
  -->
 <script setup lang="ts">
-import { useRoute, useRouter } from 'vue-router';
-import { DataAnalysis, Files } from '@element-plus/icons-vue';
-import { useAnalysisStore } from '@/stores/analysis';
-import type { FileType } from '@/composables/file-types';
+import {t} from '@/i18n/i18n';
+import {useRoute, useRouter} from 'vue-router';
+import {DataAnalysis, Files} from '@element-plus/icons-vue';
+import {useAnalysisStore} from '@/stores/analysis';
+import type {FileType} from '@/composables/file-types';
 
 const router = useRouter();
 const route = useRoute();
@@ -37,16 +38,26 @@ function onSelect(index) {
 <template>
  <div>
  <el-menu class="ej-side-menu" :default-active="defaultActive" @select="onSelect" collapse>
- <el-menu-item index="Files">
- <el-icon>
- <Files />
- </el-icon>
- </el-menu-item>
- <el-menu-item index="Analysis" :disabled="!analysis.target">
- <el-icon>
- <DataAnalysis />
- </el-icon>
- </el-menu-item>
+ <el-tooltip placement="right" :show-arrow="false" :offset="6" :content="t('menu.files')">
+ <el-menu-item index="Files">
+ <el-icon>
+ <Files/>
+ </el-icon>
+ </el-menu-item>
+ </el-tooltip>
+ <el-tooltip
+ placement="right"
+ :show-arrow="false"
+ :offset="6"
+ :content="t('menu.analysisView')"
+ :disabled="!analysis.target"
+ >
+ <el-menu-item index="Analysis" :disabled="!analysis.target">
+ <el-icon>
+ <DataAnalysis/>
+ </el-icon>
+ </el-menu-item>
+ </el-tooltip>
  </el-menu>
  </div>
 </template>

diff --git a/frontend/src/i18n/en.ts b/frontend/src/i18n/en.ts
@@ -43,6 +43,11 @@ export default {
  download: 'Download'
  },
 
+ menu: {
+ files: "Files",
+ analysisView: "Analysis View",
+ },
+
  serviceUnavailable: {
  title: 'Service is unavailable',
  subtitle: 'Please contact the administrator'

diff --git a/frontend/src/i18n/zh.ts b/frontend/src/i18n/zh.ts
@@ -43,6 +43,11 @@ export default {
  download: '下载原文件'
  },
 
+ menu: {
+ files: "文件",
+ analysisView: "分析视图",
+ },
+
  serviceUnavailable: {
  title: '服务不可用',
  subtitle: '请联系系统管理员'

diff --git a/frontend/src/support/utils.ts b/frontend/src/support/utils.ts
@@ -10,9 +10,9 @@
  *
  * SPDX-License-Identifier: EPL-2.0
  ********************************************************************************/
-import { formatDate } from '@vueuse/core';
-import { ElNotification } from 'element-plus';
-import { h } from 'vue';
+import {formatDate} from '@vueuse/core';
+import {ElNotification} from 'element-plus';
+import {h} from 'vue';
 
 function nullOrUndefined(v: any) {
  return v === null || v === undefined;
@@ -79,7 +79,7 @@ export function prettyTime(number: number, format: string) {
  return format;
 }
 
-let hasUnclosedError = false
+let hasUnclosedError = false;
 
 export function showErrorNotification(errorCode: string, message: string) {
  if (hasUnclosedError) {
@@ -94,6 +94,6 @@ export function showErrorNotification(errorCode: string, message: string) {
  showClose: true,
  onClose() {
  hasUnclosedError = false;
- },
+ }
  });
 }