From 1aa48bd4e61ffb0987c02e1b6f0668a1e44ca452 Mon Sep 17 00:00:00 2001
From: gaoyuanwei <2826352639@qq.com>
Date: Thu, 30 Jun 2022 11:42:01 +0800
Subject: [PATCH] =?UTF-8?q?318-=E8=AF=A6=E6=83=85=E9=A1=B5=E6=A0=87?=
 =?UTF-8?q?=E9=A2=98tip=EF=BC=885=E4=B8=AA=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Algorithm/AlgorithmTopDetails.vue         | 17 +++++++++++++++--
 .../Application/ApplicationTopDetails.vue     | 19 +++++++++++++++++--
 .../Business/BusinessTopDetails.vue           | 17 +++++++++++++++--
 .../Developer/DeveloperTopDetails.vue         | 17 +++++++++++++++--
 .../LayerService/LayerServiceTopDetails.vue   | 17 +++++++++++++++--
 5 files changed, 77 insertions(+), 10 deletions(-)

diff --git a/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue b/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
index d52206ab..f7ed512b 100644
--- a/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
+++ b/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
@@ -9,7 +9,13 @@
   <div class="algorithm-top-details">
     <div class="left">
       <div class="top">
-        <span class="name">{{ props.dataList.name }}</span>
+        <a-tooltip placement="top">
+          <template #title>{{ props.dataList.name }}</template>
+          <span class="name">
+            {{ props.dataList.name }}
+          </span>
+        </a-tooltip>
+        <!-- <span class="name">{{ props.dataList.name }}</span> -->
         <div class="label-content">
           <p class="lable-father">
             <span class="label">
@@ -137,12 +143,19 @@
         }
         .name {
           display: inline-block;
-          width: 10.2rem;
+          // width: 10.2rem;
           // overflow: hidden;
           // text-overflow: ellipsis;
           // white-space: nowrap;
           font-size: 40px;
           margin-right: 20px;
+          max-width: 7rem;
+          text-overflow: -o-ellipsis-lastline;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
         }
         .label-content {
           position: relative;
diff --git a/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue b/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
index 5026f8d8..1e3c06f0 100644
--- a/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
+++ b/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
@@ -9,7 +9,13 @@
   <div class="algorithm-top-details">
     <div class="left">
       <div class="top">
-        <span class="name">{{ props.dataList.name }}</span>
+        <a-tooltip placement="top">
+          <template #title>{{ props.dataList.name }}</template>
+          <span class="name">
+            {{ props.dataList.name }}
+          </span>
+        </a-tooltip>
+        <!-- <span class="name">{{ props.dataList.name }}</span> -->
         <div class="label-content">
           <p class="lable-father">
             <span class="label">{{ props.dataList.type }}</span>
@@ -124,9 +130,18 @@
           // max-width: 3.3rem;
           // overflow: hidden;
           // text-overflow: ellipsis;
-          white-space: nowrap;
+          // white-space: nowrap;
           font-size: 0.4rem;
           margin-right: 0.2rem;
+          font-size: 0.4rem;
+          margin-right: 0.2rem;
+          max-width: 7rem;
+          text-overflow: -o-ellipsis-lastline;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
         }
         .label-content {
           position: relative;
diff --git a/front/src/views/detailsAll/components/Business/BusinessTopDetails.vue b/front/src/views/detailsAll/components/Business/BusinessTopDetails.vue
index fa6b83e2..42bea3df 100644
--- a/front/src/views/detailsAll/components/Business/BusinessTopDetails.vue
+++ b/front/src/views/detailsAll/components/Business/BusinessTopDetails.vue
@@ -9,7 +9,13 @@
   <div class="algorithm-top-details">
     <div class="left">
       <div class="top">
-        <span class="name">{{ props.dataList.name }}</span>
+        <a-tooltip placement="top">
+          <template #title>{{ props.dataList.name }}</template>
+          <span class="name">
+            {{ props.dataList.name }}
+          </span>
+        </a-tooltip>
+        <!-- <span class="name">{{ props.dataList.name }}</span> -->
         <div class="label-content">
           <p class="lable-father">
             <span class="label">
@@ -140,9 +146,16 @@
           // max-width: 3.3rem;
           // overflow: hidden;
           // text-overflow: ellipsis;
-          white-space: nowrap;
+          // white-space: nowrap;
           font-size: 0.4rem;
           margin-right: 0.2rem;
+          max-width: 7rem;
+          text-overflow: -o-ellipsis-lastline;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
         }
         .label-content {
           position: relative;
diff --git a/front/src/views/detailsAll/components/Developer/DeveloperTopDetails.vue b/front/src/views/detailsAll/components/Developer/DeveloperTopDetails.vue
index f0734a64..2fc2e974 100644
--- a/front/src/views/detailsAll/components/Developer/DeveloperTopDetails.vue
+++ b/front/src/views/detailsAll/components/Developer/DeveloperTopDetails.vue
@@ -9,7 +9,13 @@
   <div class="algorithm-top-details">
     <div class="left">
       <div class="top">
-        <span class="name">{{ props.dataList.name }}</span>
+        <a-tooltip placement="top">
+          <template #title>{{ props.dataList.name }}</template>
+          <span class="name">
+            {{ props.dataList.name }}
+          </span>
+        </a-tooltip>
+        <!-- <span class="name">{{ props.dataList.name }}</span> -->
         <div class="label-content">
           <p class="lable-father">
             <span class="label">
@@ -139,9 +145,16 @@
           // max-width: 3.3rem;
           // overflow: hidden;
           // text-overflow: ellipsis;
-          white-space: nowrap;
+          // white-space: nowrap;
           font-size: 0.4rem;
           margin-right: 0.2rem;
+          max-width: 7rem;
+          text-overflow: -o-ellipsis-lastline;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
         }
         .label-content {
           position: relative;
diff --git a/front/src/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue b/front/src/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue
index 3fb2b33a..f307a4fe 100644
--- a/front/src/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue
@@ -9,7 +9,13 @@
   <div class="algorithm-top-details">
     <div class="left">
       <div class="top">
-        <span class="name">{{ props.dataList.name }}</span>
+        <a-tooltip placement="top">
+          <template #title>{{ props.dataList.name }}</template>
+          <span class="name">
+            {{ props.dataList.name }}
+          </span>
+        </a-tooltip>
+        <!-- <span class="name">{{ props.dataList.name }}</span> -->
         <div class="label-content">
           <p class="lable-father">
             <span class="label">
@@ -140,9 +146,16 @@
           // max-width: 3.3rem;
           // overflow: hidden;
           // text-overflow: ellipsis;
-          white-space: nowrap;
+          // white-space: nowrap;
           font-size: 0.4rem;
           margin-right: 0.2rem;
+          max-width: 7rem;
+          text-overflow: -o-ellipsis-lastline;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
         }
         .label-content {
           position: relative;