fix(项目管理): 修复消息中心样式显示以及功能用例列表执行结果字段显示和接口定义响应内容标题删除时超长显示问题

--bug=1039864 --user=郭雨琦 https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001039864
--bug=1039852 --user=郭雨琦 https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001039852
--bug=1037824 --user=郭雨琦 https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001037824

frontend/src/components/business/ms-case-associate/executeResult.vue

@@ -3,9 +3,10 @@
     <MsIcon
       :type="lastExecuteResultMap[props.executeResult]?.icon || ''"
       class="mr-1"
+      :size="16"
       :style="{ color: lastExecuteResultMap[props.executeResult].color }"
     ></MsIcon>
-    <span class="text-[var(--color-text-2)]">{{ status?.text || '' }}</span>
+    <span class="text-[14px] text-[var(--color-text-2)]">{{ status?.text || '' }}</span>
   </div>
 </template>
 

frontend/src/components/business/ms-message/MessageCenterDrawer.vue

@@ -67,23 +67,35 @@
             @reach-bottom="handleReachBottom"
           >
             <template #item="{ item }">
-              <div v-if="item.type === 'MENTIONED_ME'" class="ms-message-item">
+              <div v-if="item.type === 'MENTIONED_ME'" class="mb-[16px] pt-[8px]">
                 <div class="flex items-center">
                   <MSAvatar v-if="item.avatar" :avatar="item.avatar" :word="item.userName" />
                   <div class="ml-[8px] flex">
-                    <div class="text-[var(--color-text-2)]">
+                    <a-tooltip :content="item.subject" :mouse-enter-delay="300">
-                      {{ item.subject }}
+                      <div class="one-line-text max-w-[300px] font-medium leading-[22px] text-[var(--color-text-1)]">
-                    </div>
+                        {{ item.subject }}
+                      </div>
+                    </a-tooltip>
                     <div class="font-medium text-[rgb(var(--primary-5))]"
                       >&nbsp;&nbsp;{{ t('ms.message.me', { var: '@' }) }}</div
                     >
                   </div>
                 </div>
                 <div class="flex items-center">
-                  <div class="text-[var(--color-text-2)]">{{ item.content.split(':')[0] }}：</div>
+                  <a-tooltip :content="item.content.split(':')[0]" :mouse-enter-delay="300">
-                  <div v-if="item.operation.includes('DELETE')" class="text-[var(--color-text-1)]">
+                    <div class="one-line-text ml-[8px] max-w-[300px] text-[var(--color-text-2)]"
-                    {{ item.resourceName }}
+                      >{{ item.content.split(':')[0] }}：</div
-                  </div>
+                    >
+                  </a-tooltip>
+
+                  <a-tooltip v-if="item.operation.includes('DELETE')" :content="item.resourceName">
+                    <div
+                      v-if="item.operation.includes('DELETE')"
+                      class="one-line-text max-w-[300px] text-[var(--color-text-1)]"
+                    >
+                      {{ item.resourceName }}
+                    </div>
+                  </a-tooltip>
                   <MsButton v-else @click="handleNameClick(item)">
                     <a-tooltip :content="item.resourceName" :mouse-enter-delay="300">
                       <div class="one-line-text max-w-[300px]">
@@ -92,7 +104,7 @@
                     </a-tooltip>
                   </MsButton>
                 </div>
-                <div class="flex items-center text-[var(--color-text-4)]">
+                <div class="ml-[8px] flex items-center text-[var(--color-text-4)]">
                   {{ dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss') }}
                 </div>
               </div>
@@ -101,23 +113,38 @@
                 <div class="ml-[8px] flex flex-col">
                   <div class="flex items-center overflow-x-hidden">
                     <a-badge v-if="item.status === 'UNREAD'" :count="9" dot :offset="[6, -2]" class="w-full">
-                      <div class="font-medium leading-[22px] text-[var(--color-text-1)]">
+                      <a-tooltip :content="item.subject">
-                        {{ item.subject }}
+                        <div class="one-line-text max-w-[300px] font-medium leading-[22px] text-[var(--color-text-1)]">
-                      </div>
+                          {{ item.subject }}
+                        </div>
+                      </a-tooltip>
                     </a-badge>
                     <a-tooltip v-else-if="item.status === 'READ'" :content="item.subject">
-                      <div class="font-medium leading-[22px] text-[var(--color-text-1)]">
+                      <div class="one-line-text max-w-[300px] font-medium leading-[22px] text-[var(--color-text-1)]">
                         {{ item.subject }}
                       </div>
                     </a-tooltip>
                   </div>
                   <div class="flex items-center">
-                    <div class="one-line-text max-w-[300px] text-[var(--color-text-2)]"
+                    <a-tooltip
-                      >{{ item.content.split(':')[0] }}：</div
+                      v-if="item.operation.includes('DELETE')"
+                      :content="item.content.split(':')[0]"
+                      :mouse-enter-delay="300"
                     >
-                    <div v-if="item.operation.includes('DELETE')" class="text-[var(--color-text-1)]">
+                      <div class="one-line-text max-w-[300px] text-[var(--color-text-2)]"
-                      {{ item.resourceName }}
+                        >{{ item.content.split(':')[0] }}：</div
-                    </div>
+                      >
+                    </a-tooltip>
+                    <a-tooltip
+                      v-if="item.operation.includes('DELETE')"
+                      :content="item.resourceName"
+                      :mouse-enter-delay="300"
+                    >
+                      <div class="one-line-text max-w-[300px] text-[var(--color-text-1)]">
+                        {{ item.resourceName }}
+                      </div>
+                    </a-tooltip>
+
                     <MsButton v-else @click="handleNameClick(item)">
                       <a-tooltip :content="item.resourceName" :mouse-enter-delay="300">
                         <div class="one-line-text max-w-[300px]">
@@ -412,7 +439,7 @@
     .ms-message-item {
       @apply flex;
 
-      padding: 8px;
+      padding-top: 8px;
       &:not(:last-child) {
         margin-bottom: 16px;
       }

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

@@ -57,7 +57,12 @@
               <icon-exclamation-circle-fill class="!text-[rgb(var(--danger-6))]" />
             </template>
             <template #content>
-              <div class="font-semibold text-[var(--color-text-1)]">
+              <a-tooltip v-if="translateTextToPX(t(tab.name || tab.label)) > 200" :content="t(tab.name || tab.label)">
+                <div class="one-line-text max-w-[200px] font-semibold text-[var(--color-text-1)]">
+                  {{ t('apiTestManagement.confirmDelete', { name: tab.label || tab.name }) }}
+                </div>
+              </a-tooltip>
+              <div v-else class="font-semibold text-[var(--color-text-1)]">
                 {{ t('apiTestManagement.confirmDelete', { name: tab.label || tab.name }) }}
               </div>
             </template>