fix(接口管理):修复接口定义调试另存为用例标题显示错误问题以及项目管理用户名称超长显示错乱问题

--bug=1038231 --user=郭雨琦 https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001038231
--bug=1037880 --user=郭雨琦 https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001037880

frontend/src/utils/css.ts

@@ -16,3 +16,16 @@ export function translatePxToNumber(str: string): number {
   const result = Number(str.replace('px', ''));
   return Number.isNaN(result) ? 0 : result;
 }
+
+export function translateTextToPX(text?: string) {
+  if (!text) {
+    return 0;
+  }
+  const canvas = document.createElement('canvas');
+  const context = canvas.getContext('2d');
+  if (context != null) {
+    const metrics = context.measureText(text);
+    return metrics.width;
+  }
+  return 0;
+}

frontend/src/views/api-test/components/requestComposition/index.vue

@@ -487,7 +487,7 @@
   <a-modal
     v-if="!isCase"
     v-model:visible="saveCaseModalVisible"
-    :title="t('common.save')"
+    :title="t('apiTestManagement.saveAsCase')"
     :ok-loading="saveCaseLoading"
     class="ms-modal-form"
     title-align="start"
@@ -1591,6 +1591,7 @@
     }
     isUrlError.value = false;
     activeApiTabFormRef.value?.validate(async (errors) => {
+      console.log('validate');
       if (errors) {
         horizontalSplitBoxRef.value?.expand();
       } else {

frontend/src/views/api-test/components/requestComposition/response/edit.vue

@@ -11,7 +11,7 @@
         <div class="response-tab">
           <div v-if="tab.defaultFlag" class="response-tab-default-icon"></div>
           <a-tooltip
-            v-if="getTextWidth(t(tab.name || tab.label)) > 200"
+            v-if="translateTextToPX(t(tab.name || tab.label)) > 200"
             :content="t(tab.name || tab.label) + '(' + tab.statusCode + ')'"
           >
             <span class="one-line-text" style="max-width: 200px"
@@ -189,6 +189,7 @@
   import { responseHeaderOption } from '@/config/apiTest';
   import { useI18n } from '@/hooks/useI18n';
   import useAppStore from '@/store/modules/app';
+  import { translateTextToPX } from '@/utils/css';
 
   import { ResponseDefinition } from '@/models/apiTest/common';
   import { ResponseBodyFormat, ResponseComposition } from '@/enums/apiEnum';
@@ -317,16 +318,6 @@
     emit('change');
   }
 
-  function getTextWidth(text: string) {
-    const canvas = document.createElement('canvas');
-    const context = canvas.getContext('2d');
-    if (context != null) {
-      const metrics = context.measureText(text);
-      return metrics.width;
-    }
-    return 0;
-  }
-
   // const jsonSchemaColumns: FormTableColumn[] = [
   //   {
   //     title: 'apiTestManagement.paramName',

frontend/src/views/project-management/projectAndPermission/basicInfos/index.vue

@@ -31,7 +31,10 @@
   <div class="ml-1 flex flex-col">
     <div class="label-item">
       <span class="label">{{ t('project.basicInfo.createBy') }}</span>
-      <span>{{ projectDetail?.createUser }}</span>
+      <a-tooltip v-if="translateTextToPX(projectDetail?.createUser) > 300" :content="projectDetail?.createUser">
+        <span class="one-line-text" style="max-width: 300px">{{ projectDetail?.createUser }}</span>
+      </a-tooltip>
+      <span v-else>{{ projectDetail?.createUser }}</span>
     </div>
     <div class="label-item">
       <span class="label">{{ t('project.basicInfo.organization') }}</span>
@@ -62,6 +65,7 @@
   import { getProjectInfo } from '@/api/modules/project-management/basicInfo';
   import { useI18n } from '@/hooks/useI18n';
   import { useAppStore } from '@/store';
+  import { translateTextToPX } from '@/utils/css';
 
   import type { ProjectBasicInfoModel } from '@/models/projectManagement/basicInfo';