fix(测试跟踪): 依赖关系列表布局问题 (#18276)

--bug=1017158 --user=宋昌昌 【接口测试】接口定义-添加接口的前后置依赖关系后列表显示不对齐 https://www.tapd.cn/55049933/s/1251401

Co-authored-by: song-cc-rock <changchang.song@fit2cloud.com>

frontend/src/business/components/common/components/graph/DependenciesList.vue

@@ -1,10 +1,7 @@
 <template>
   <div class="dependencies-container">
 
-    <el-tooltip v-xpack class="item" effect="dark" :content="$t('commons.relationship.graph')" placement="left">
-      <font-awesome-icon class="graph-icon" :icon="['fas', 'sitemap']" size="lg" @click="openGraph"/>
-    </el-tooltip>
-
+    <div class="right-list">
       <relationship-list
         class="pre-list"
         :read-only="readOnly" :title="resourceType === 'TEST_CASE' ? $t('commons.relationship.pre_case') : $t('commons.relationship.pre_api')"
@@ -20,6 +17,13 @@
         relationship-type="POST" :resource-id="resourceId"
         @setCount="setPostCount"
         :resource-type="resourceType" ref="postRelationshipList"/>
+    </div>
+
+    <div class="left-icon">
+      <el-tooltip v-xpack class="item" effect="dark" :content="$t('commons.relationship.graph')" placement="left">
+        <font-awesome-icon class="graph-icon" :icon="['fas', 'sitemap']" size="lg" @click="openGraph"/>
+      </el-tooltip>
+    </div>
 
     <relationship-graph-drawer v-xpack v-permission :graph-data="graphData" ref="relationshipGraph"/>
 
@@ -84,7 +88,19 @@ export default {
 
 .graph-icon {
   float: right;
-  margin-right: 20px;
+  margin-right: 8px;
   color: var(--primary_color);
 }
+
+.right-list {
+  width: 96%;
+  display: inline-block;
+}
+
+.left-icon {
+  width: 4%;
+  display: inline-block;
+  position: absolute;
+  top: 25px;
+}
 </style>