style(接口测试): 表格国际化样式展示优化

frontend/src/locale/en-US/index.ts

@@ -35,7 +35,9 @@ export default {
     'menu.apiTest.debug.debug': 'Debug',
     'menu.apiTest.management': 'API',
     'menu.apiTest.management.definition': 'API',
+    'menu.apiTest.api': 'API List',
     'menu.apiTest.scenario': 'Scenario',
+    'menu.apiTest.apiScenario': 'Scenario',
     'menu.apiTest.scenario.recycle': 'Recycle',
     'menu.apiTest.report': 'Report',
     'menu.apiTest.reportDetail': 'Report Detail',

frontend/src/utils/index.ts

@@ -1006,3 +1006,6 @@ export function formatDuration(ms: number) {
   // 返回小时
   return `${hours.toFixed(1)}-hr`;
 }
+
+export const operationWidth = (enWidth: number, zhWidth: number) =>
+  localStorage.getItem('MS-locale') === 'en-US' ? enWidth : zhWidth;

frontend/src/views/api-test/management/components/management/api/apiTable.vue

@@ -292,7 +292,7 @@
   import useModal from '@/hooks/useModal';
   import useTableStore from '@/hooks/useTableStore';
   import useAppStore from '@/store/modules/app';
-  import { characterLimit } from '@/utils';
+  import { characterLimit, operationWidth } from '@/utils';
   import { hasAnyPermission } from '@/utils/permission';
 
   import { ApiDefinitionDetail, ApiDefinitionGetModuleParams } from '@/models/apiTest/management';
@@ -476,7 +476,7 @@
       slotName: 'action',
       dataIndex: 'operation',
       fixed: 'right',
-      width: hasOperationPermission.value ? 200 : 50,
+      width: operationWidth(215, hasOperationPermission.value ? 200 : 50),
     },
   ];
 

frontend/src/views/api-test/management/components/management/case/caseTable.vue

@@ -315,7 +315,7 @@
   import useModal from '@/hooks/useModal';
   import useTableStore from '@/hooks/useTableStore';
   import useAppStore from '@/store/modules/app';
-  import { characterLimit } from '@/utils';
+  import { characterLimit, operationWidth } from '@/utils';
   import { hasAnyPermission } from '@/utils/permission';
 
   import { ApiCaseDetail } from '@/models/apiTest/management';
@@ -525,7 +525,7 @@
       slotName: 'operation',
       dataIndex: 'operation',
       fixed: 'right',
-      width: hasOperationPermission.value ? 200 : 50,
+      width: operationWidth(230, hasOperationPermission.value ? 200 : 50),
     },
   ];
   const { propsRes, propsEvent, loadList, setLoadListParams, resetSelector } = useTable(getCasePage, {

frontend/src/views/api-test/management/components/management/mock/mockTable.vue

@@ -225,6 +225,7 @@
   import useModal from '@/hooks/useModal';
   import useTableStore from '@/hooks/useTableStore';
   import useAppStore from '@/store/modules/app';
+  import { operationWidth } from '@/utils';
   import { hasAnyPermission } from '@/utils/permission';
 
   import { ApiDefinitionMockDetail } from '@/models/apiTest/management';
@@ -329,7 +330,7 @@
       slotName: 'action',
       dataIndex: 'operation',
       fixed: 'right',
-      width: 200,
+      width: operationWidth(230, 200),
     },
   ];
   const { propsRes, propsEvent, loadList, setLoadListParams, resetSelector } = useTable(getDefinitionMockPage, {

frontend/src/views/api-test/management/components/recycle/api/apiTable.vue

@@ -159,7 +159,7 @@
   import useModal from '@/hooks/useModal';
   import useTableStore from '@/hooks/useTableStore';
   import useAppStore from '@/store/modules/app';
-  import { characterLimit } from '@/utils';
+  import { characterLimit, operationWidth } from '@/utils';
 
   import {
     ApiDefinitionDetail,
@@ -267,7 +267,7 @@
       slotName: 'action',
       dataIndex: 'operation',
       fixed: 'right',
-      width: 150,
+      width: operationWidth(230, 150),
     },
   ];
   const { propsRes, propsEvent, loadList, setLoadListParams, resetSelector } = useTable(

frontend/src/views/api-test/management/locale/en-US.ts

@@ -23,7 +23,7 @@ export default {
   'apiTestManagement.executeMethod': 'Execute Method',
   'apiTestManagement.recycle.batchRecover': 'Recover',
   'apiTestManagement.recycle.recoveredSuccessfully': 'Recovered Successfully',
-  'apiTestManagement.recycle.batchCleanOut': 'Clean Out',
+  'apiTestManagement.recycle.batchCleanOut': 'Delete permanently',
   'apiTestManagement.recycle.completedDeleteCaseTitle': 'Confirm to completely delete {name}?',
   'apiTestManagement.recycle.cleanOutDeleteOnRecycleTip':
     'After deletion, the API cannot be recovered. Please proceed with caution!',

frontend/src/views/api-test/scenario/components/scenarioTable.vue

@@ -525,7 +525,7 @@
   import useModal from '@/hooks/useModal';
   import useTableStore from '@/hooks/useTableStore';
   import useAppStore from '@/store/modules/app';
-  import { characterLimit } from '@/utils';
+  import { characterLimit, operationWidth } from '@/utils';
   import { translateTextToPX } from '@/utils/css';
   import { hasAnyPermission } from '@/utils/permission';
 
@@ -652,7 +652,7 @@
         sorter: true,
       },
       fixed: 'left',
-      width: 140,
+      width: operationWidth(160, 140),
       showTooltip: false,
       columnSelectorDisabled: true,
     },
@@ -809,7 +809,7 @@
       slotName: 'operation',
       dataIndex: 'operation',
       fixed: 'right',
-      width: 200,
+      width: operationWidth(215, 200),
     },
   ];
   const { propsRes, propsEvent, loadList, setLoadListParams, resetSelector } = useTable(

frontend/src/views/api-test/scenario/locale/en-US.ts

@@ -223,8 +223,8 @@ export default {
   'api_scenario.recycle.recover': 'Recover',
   'api_scenario.recycle.recoveredSuccessfully': 'Recover Successful',
   'api_scenario.recycle.list': 'Recycle Bin List',
-  'api_scenario.recycle.batchCleanOut': 'Permanently Delete',
-  'api_scenario.recycle.completedDeleteCaseTitle': 'Confirm Permanently Delete {name}?',
+  'api_scenario.recycle.batchCleanOut': 'Delete Permanently',
+  'api_scenario.recycle.completedDeleteCaseTitle': 'Confirm Delete Permanently {name}?',
   'api_scenario.recycle.cleanOutDeleteOnRecycleTip':
     'Deleting will permanently remove the scenario. Proceed with caution!',
   'apiScenario.quoteTreeNoData': 'No quotable data available, switch projects to retrieve data',
@@ -252,9 +252,9 @@ export default {
   'apiScenario.setting.waitTime.tip':
     'When running a scenario, each step of the scenario will wait for the specified time before triggering the next step',
   // Scheduled Task
-  'apiScenario.schedule.create': 'Create Scheduled Task',
-  'apiScenario.schedule.update': 'Update Scheduled Task',
-  'apiScenario.schedule.delete': 'Delete Scheduled Task',
+  'apiScenario.schedule.create': 'Create cron job',
+  'apiScenario.schedule.update': 'Edit cron job',
+  'apiScenario.schedule.delete': 'Delete cron job',
   'apiScenario.schedule.config.resource_pool': 'Run Resource Pool',
   'apiScenario.schedule.task.status': 'Task Status',
   'apiScenario.schedule.task.schedule': 'Task Trigger Time',

frontend/src/views/api-test/scenario/recycle/recycleTable.vue

@@ -229,6 +229,7 @@
   import useModal from '@/hooks/useModal';
   import useTableStore from '@/hooks/useTableStore';
   import useAppStore from '@/store/modules/app';
+  import { operationWidth } from '@/utils';
 
   import { ApiScenarioTableItem } from '@/models/apiTest/scenario';
   import { ApiScenarioStatus } from '@/enums/apiEnum';
@@ -407,7 +408,7 @@
       slotName: 'operation',
       dataIndex: 'operation',
       fixed: 'right',
-      width: 180,
+      width: operationWidth(225, 160),
     },
   ];
   const { propsRes, propsEvent, loadList, setLoadListParams, resetSelector } = useTable(