修改展示

src/components/testcase/TestCaseList.vue

@@ -1,24 +1,26 @@
 <template>
   <div class="testCase-container" v-loading="loading">
-    <div v-if="testcaseToUserList.length===0">
+    <!--    <h1>{{testcaseToUserList.length}}</h1>-->
+    <div v-if="testcaseToUserList.length==0">
       <div v-for="(item, index) in testCaseList" :key="index.id">
         <div class="testCase-content">
           <div>
             <div style="float: left">
               <span class="title">用例{{ index + 1 }}：{{ item.name }}</span>
               <el-tag type="success" v-if="item.completeCount!==0">已完成{{ item.completeCount }}</el-tag>
-              <el-tag type="warring" v-else>待完成{{ item.completeCount }}</el-tag>
+              <el-tag type="warring" v-else>待完成</el-tag>
             </div>
           </div>
           <div style="clear:both"></div>
           <div>
             <h3>前置条件</h3>
-            <div v-for="(testActionPreItem, testActionPreIndex) in item.testActionsPre"
+            <div :title="`${index = 0}`"></div>
+            <div v-for="(testActionPreItem) in item.testActionsPre"
                  :key="testActionPreItem.id">
-              <div v-if="!testActionPreItem.same" :title="`${sameIndex = 0} ${stepIndex = testActionPreIndex + 1}`">
-                步骤{{ testActionPreIndex + 1 }}：{{ testActionPreItem.description }}
+              <div v-if="!testActionPreItem.same" :title="`${index++} ${sameIndex = 0}`">
+                步骤{{ index }}：{{ testActionPreItem.description }}
               </div>
-              <div v-else :value="`${sameIndex++}`">步骤{{ stepIndex }}.{{ sameIndex }}：{{
+              <div v-else :value="`${sameIndex++}`">步骤{{ index }}.{{ sameIndex }}：{{
                   testActionPreItem.description
                 }}
               </div>
@@ -27,10 +29,11 @@
             <div v-for="(testActionPreItem, testActionPreIndex) in item.testActionsPre"
                  :key="testActionPreItem.id">
               <div class="content" v-if="testActionPreItem.screenShot != null">
-                <h3 v-if="!testActionPreItem.same" :title="`${sameIndex = 0} ${stepIndex = testActionPreIndex + 1}`">
-                  步骤{{ testActionPreIndex + 1 }}</h3>
-                <h3 v-else :value="`${sameIndex++}`">步骤{{ stepIndex }}.{{ sameIndex }}</h3>
-                <img :src="testActionPreItem.screenShot" style="width: 200px"/>
+                <div v-if="!testActionPreItem.same">
+                  <h3 :title="`${sameIndex = 0} ${stepIndex = testActionPreIndex + 1}`">
+                    步骤{{ testActionPreIndex + 1 }}</h3>
+                  <img :src="testActionPreItem.screenShot" style="width: 200px"/>
+                </div>
               </div>
             </div>
           </div>
@@ -41,14 +44,10 @@
                  :key="testActionNextItem.id">
               <div>步骤{{ testActionNextIndex + 1 }}：{{ testActionNextItem.description }}</div>
             </div>
-            <!--        <h3>用例步骤截图</h3>-->
-            <div v-for="(testActionNextItem, testActionNextIndex) in item.testActionsNext"
-                 :key="testActionNextItem.id">
-              <div class="content" v-if="testActionNextItem.screenShot != null">
-                <div>
-                  <h3>步骤{{ testActionNextIndex + 1 }}</h3>
-                  <img :src="testActionNextItem.screenShot" style="width: 200px"/>
-                </div>
+            <div class="content" v-if="item.testActionsNext[0].screenShot != null">
+              <div>
+                <h3>步骤1-{{ item.testActionsNext.length }}</h3>
+                <img :src="item.testActionsNext[0].screenShot" style="width: 200px"/>
               </div>
             </div>
           </div>
@@ -76,47 +75,50 @@
           </div>
           <div style="clear:both"></div>
           <div>
-            <h3>前置条件</h3>
-            <div v-for="(testActionPreItem, testActionPreIndex) in testcaseToUserItem.testCase.testActionsPre"
-                 :key="testActionPreItem.id">
-              <div v-if="!testActionPreItem.same" :title="`${sameIndex = 0} ${stepIndex = testActionPreIndex + 1}`">
-                步骤{{ testActionPreIndex + 1 }}：{{ testActionPreItem.description }}
+            <div>
+              <h3>前置条件</h3>
+
+              <!--              <h1>{{testcaseToUserItem.testCase.testActionsPre}}</h1>-->
+              <!--              <div v-if="testcaseToUserItem.testCase.testActionsPre.length == 0">无</div>-->
+              <div :title="`${index = 0}`"></div>
+              <div v-for="(testActionPreItem) in testcaseToUserItem.testCase.testActionsPre"
+                   :key="testActionPreItem.id">
+                <div v-if="!testActionPreItem.same" :title="`${index++} ${sameIndex = 0}`">
+                  步骤{{ index }}：{{ testActionPreItem.description }}
+                </div>
+                <div v-else :value="`${sameIndex++}`">步骤{{ index }}.{{ sameIndex }}：{{
+                    testActionPreItem.description
+                  }}
+                </div>
               </div>
-              <div v-else :value="`${sameIndex++}`">步骤{{ stepIndex }}.{{ sameIndex }}：{{
-                  testActionPreItem.description
-                }}
+              <!--        <h3>前置条件截图</h3>-->
+              <div v-for="(testActionPreItem, testActionPreIndex) in testcaseToUserItem.testCase.testActionsPre"
+                   :key="testActionPreItem.id">
+                <div class="content" v-if="testActionPreItem.screenShot != null">
+                  <div v-if="!testActionPreItem.same">
+                    <h3 :title="`${sameIndex = 0} ${stepIndex = testActionPreIndex + 1}`">
+                      步骤{{ testActionPreIndex + 1 }}</h3>
+                    <img :src="testActionPreItem.screenShot" style="width: 200px"/>
+                  </div>
+                </div>
               </div>
             </div>
-            <!--        <h3>前置条件截图</h3>-->
-            <div v-for="(testActionPreItem, testActionPreIndex) in testcaseToUserItem.testCase.testActionsPre"
-                 :key="testActionPreItem.id">
-              <div class="content" v-if="testActionPreItem.screenShot != null">
-                <h3 v-if="!testActionPreItem.same" :title="`${sameIndex = 0} ${stepIndex = testActionPreIndex + 1}`">
-                  步骤{{ testActionPreIndex + 1 }}</h3>
-                <h3 v-else :value="`${sameIndex++}`">步骤{{ stepIndex }}.{{ sameIndex }}</h3>
-                <img :src="testActionPreItem.screenShot" style="width: 200px"/>
+            <div style="clear:both"></div>
+            <div>
+              <h3>用例步骤</h3>
+              <div v-for="(testActionNextItem, testActionNextIndex) in testcaseToUserItem.testCase.testActionsNext"
+                   :key="testActionNextItem.id">
+                <div>步骤{{ testActionNextIndex + 1 }}：{{ testActionNextItem.description }}</div>
               </div>
-            </div>
-          </div>
-          <div style="clear:both"></div>
-          <div>
-            <h3>用例步骤</h3>
-            <div v-for="(testActionNextItem, testActionNextIndex) in testcaseToUserItem.testCase.testActionsNext"
-                 :key="testActionNextItem.id">
-              <div>步骤{{ testActionNextIndex + 1 }}：{{ testActionNextItem.description }}</div>
-            </div>
-            <!--        <h3>用例步骤截图</h3>-->
-            <div v-for="(testActionNextItem, testActionNextIndex) in testcaseToUserItem.testCase.testActionsNext"
-                 :key="testActionNextItem.id">
-              <div class="content" v-if="testActionNextItem.screenShot != null">
+              <div class="content" v-if="testcaseToUserItem.testCase.testActionsNext[0].screenShot != null">
                 <div>
-                  <h3>步骤{{ testActionNextIndex + 1 }}</h3>
-                  <img :src="testActionNextItem.screenShot" style="width: 200px"/>
+                  <h3>步骤1-{{ testcaseToUserItem.testCase.testActionsNext.length }}</h3>
+                  <img :src="testcaseToUserItem.testCase.testActionsNext[0].screenShot" style="width: 200px"/>
                 </div>
               </div>
             </div>
+            <div style="clear:both"></div>
           </div>
-          <div style="clear:both"></div>
         </div>
       </div>
     </div>