项目信息样式调整

src/views/trials/trials-panel/trial-summary/trial-information/index.vue

@@ -1,6 +1,12 @@
 <template>
   <div class="trial-information">
-    <el-descriptions :column="2" border style="width: 1000px">
+    <el-descriptions
+      :column="2"
+      border
+      style="width: 1000px"
+      labelStyle="white-space:nowrap;"
+      contentStyle="word-break:break-all;"
+    >
       <el-descriptions-item :label="$t('trials:trials-list:form:trialId')">
         {{ trialInfo.TrialCode }}
         <el-tag
@@ -19,27 +25,39 @@
         :label="$t('trials:trials-list:form:experimentName')"
         :contentStyle="{ 'max-width': '300px' }"
       >
+        <div class="ell" :title="trialInfo.ExperimentName">
           {{ trialInfo.ExperimentName }}
+        </div>
       </el-descriptions-item>
       <el-descriptions-item
         :label="$t('trials:trials-list:form:researchNumber')"
         :contentStyle="{ 'max-width': '300px' }"
       >
+        <div class="ell" :title="trialInfo.ResearchProgramNo">
           {{ trialInfo.ResearchProgramNo }}
+        </div>
       </el-descriptions-item>
 
       <el-descriptions-item :label="$t('trials:trials-list:form:researchUnit')">
+        <div class="ell" :title="trialInfo.MainResearchUnit">
           {{ trialInfo.MainResearchUnit }}
+        </div>
       </el-descriptions-item>
       <el-descriptions-item :label="$t('trials:trials-list:form:pi')">
+        <div class="ell" :title="trialInfo.HeadPI">
           {{ trialInfo.HeadPI }}
+        </div>
       </el-descriptions-item>
 
       <el-descriptions-item :label="$t('trials:trials-list:form:sponsor')">
+        <div class="ell" :title="trialInfo.Sponsor">
           {{ trialInfo.Sponsor }}
+        </div>
       </el-descriptions-item>
       <el-descriptions-item :label="$t('trials:trials-list:form:cro')">
+        <div class="ell" :title="trialInfo.CRO">
           {{ trialInfo.CRO }}
+        </div>
       </el-descriptions-item>
 
       <el-descriptions-item
@@ -65,7 +83,9 @@
         }}{{ trialInfo.Indication }}
       </el-descriptions-item>
       <el-descriptions-item :label="$t('trials:trials-list:form:modality')">
+        <div class="ell" :title="trialInfo.Modalitys">
           {{ trialInfo.Modalitys }}
+        </div>
       </el-descriptions-item>
       <el-descriptions-item :label="$t('trials:trials-list:form:siteCount')">
         {{ trialInfo.PlanSiteCount }}
@@ -91,7 +111,9 @@
         :span="2"
         :label="$t('trials:trials-list:form:criterion')"
       >
+        <div class="ell" :title="trialInfo.Criterion">
           {{ trialInfo.Criterion }}
+        </div>
       </el-descriptions-item>
       <!--      <el-descriptions-item :label="$t('trials:trials-list:form:reviewMode')">-->
       <!--        <span>{{$fd('ReadingType', trialInfo.ReadingType)}}</span>-->
@@ -199,4 +221,10 @@ export default {
   margin-top: 30px;
   cursor: pointer;
 }
+.ell {
+  width: 90%;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
 </style>