From 95b207d64fab29ad1bd7cdc77ba0811f363dcbaf Mon Sep 17 00:00:00 2001
From: shiziyuan9527 <yuhao.li@fit2cloud.com>
Date: Wed, 15 Mar 2023 17:57:59 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E6=B5=8B=E8=AF=95=E8=B7=9F=E8=B8=AA):=20?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E9=A2=84=E8=A7=88=E7=94=A8=E4=BE=8B=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--bug=1024392 --user=李玉号 【测试跟踪】用例详情，前置文本为超长文本，查看页面只展示了3行文本
https://www.tapd.cn/55049933/s/1350761
---
 .../case/components/TestCasePreview.vue       | 46 ++++++++++++++++---
 1 file changed, 40 insertions(+), 6 deletions(-)

diff --git a/test-track/frontend/src/business/case/components/TestCasePreview.vue b/test-track/frontend/src/business/case/components/TestCasePreview.vue
index 628583e869..b9dafd9843 100644
--- a/test-track/frontend/src/business/case/components/TestCasePreview.vue
+++ b/test-track/frontend/src/business/case/components/TestCasePreview.vue
@@ -9,16 +9,41 @@
     <template v-slot:title>
       {{$t('test_track.case.case_desc')}}
     </template>
-    <div style="height: 100%; overflow: auto">
+
+    <div style="height: 1000px; overflow: scroll;">
       <el-form :model="data" class="case-desc-form">
-        <div class="prerequisite-item-layout" style="margin-top: 24px; margin-bottom: 20px">
+
+        <div class="prerequisite-item-layout">
           <h3>{{$t('test_track.case.prerequisite')}}</h3>
-          <span>{{data.prerequisite}}</span>
+          <div class="case-desc-form-div">
+            <span v-if="!data['prerequisite']">{{$t('case.none')}}</span>
+            <ms-mark-down-text v-else :disabled="true" :data="data" prop="prerequisite"/>
+          </div>
         </div>
+
         <step-change-item :label-width="formLabelWidth" :form="data"/>
-        <ms-case-desc-text-item v-if="data.stepModel === 'TEXT'" :title="$t('test_track.case.step_desc')" :data="data" :content="data.stepDescription" style="margin-bottom: 20px"/>
-        <ms-case-desc-text-item v-if="data.stepModel === 'TEXT'" :title="$t('test_track.case.expected_results')" :data="data" :content="data.expectedResult"/>
-        <ms-case-desc-text-item v-if="data.stepModel === 'STEP' || !data.stepModel" :data="data"/>
+
+        <div v-if="data.stepModel === 'TEXT'" class="prerequisite-item-layout">
+          <h3>{{$t('test_track.case.step_desc')}}</h3>
+          <div class="case-desc-form-div">
+            <span v-if="!data['stepDescription']">{{$t('case.none')}}</span>
+            <ms-mark-down-text v-else :disabled="true" :data="data" prop="stepDescription"/>
+          </div>
+        </div>
+
+        <div v-if="data.stepModel === 'TEXT'" class="prerequisite-item-layout">
+          <h3>{{$t('test_track.case.expected_results')}}</h3>
+          <div class="case-desc-form-div">
+            <span v-if="!data['expectedResult']">{{$t('case.none')}}</span>
+            <ms-mark-down-text v-else :disabled="true" :data="data" prop="expectedResult"/>
+          </div>
+        </div>
+
+        <div v-if="data.stepModel === 'STEP' || !data.stepModel" class="prerequisite-item-layout">
+          <div class="case-desc-form-div">
+            <ms-case-desc-text-item :data="data"/>
+          </div>
+        </div>
       </el-form>
     </div>
   </el-drawer>
@@ -29,6 +54,7 @@ import MsFormDivider from "metersphere-frontend/src/components/MsFormDivider";
 import MsCaseDescTextItem from "metersphere-frontend/src/components/new-ui/MsCaseDescTextItem";
 import StepChangeItem from "@/business/case/components/StepChangeItem";
 import TestCaseStepItem from "@/business/case/components/TestCaseStepItem";
+import MsMarkDownText from "metersphere-frontend/src/components/MsMarkDownText";
 
 export default {
   name: "TestCasePreview",
@@ -37,6 +63,7 @@ export default {
     MsCaseDescTextItem,
     StepChangeItem,
     TestCaseStepItem,
+    MsMarkDownText
   },
   props: {
     width: {
@@ -109,6 +136,8 @@ export default {
   flex: none;
   order: 0;
   flex-grow: 0;
+  margin-top: 24px;
+  margin-bottom: 20px;
 }
 
 .prerequisite-item-layout h3{
@@ -152,4 +181,9 @@ export default {
   order: 0;
   flex-grow: 0;
 }
+
+.case-desc-form-div {
+  height: 150px;
+  overflow-y: scroll;
+}
 </style>