diff --git a/frontend/src/business/components/common/components/graph/DependenciesList.vue b/frontend/src/business/components/common/components/graph/DependenciesList.vue
index ba5fd0db3a..6cdff06dd3 100644
--- a/frontend/src/business/components/common/components/graph/DependenciesList.vue
+++ b/frontend/src/business/components/common/components/graph/DependenciesList.vue
@@ -25,7 +25,7 @@
       </el-tooltip>
     </div>
 
-    <relationship-graph-drawer v-xpack v-permission :graph-data="graphData" ref="relationshipGraph"/>
+    <relationship-graph-drawer v-xpack v-permission :graph-data="graphData" @closeRelationGraph="closeRelationGraph" ref="relationshipGraph"/>
 
   </div>
 </template>
@@ -67,8 +67,12 @@ export default {
       getRelationshipGraph(this.resourceId, this.resourceType,  (data) => {
         this.graphData = data;
         this.$refs.relationshipGraph.open();
+        this.$emit("openDependGraphDrawer", true);
       });
     },
+    closeRelationGraph() {
+      this.$emit("openDependGraphDrawer", false);
+    },
     setPreCount(count) {
       this.preCount = count;
       this.$emit('setCount', this.preCount + this.postCount);
diff --git a/frontend/src/business/components/track/case/components/TestCaseEditOtherInfo.vue b/frontend/src/business/components/track/case/components/TestCaseEditOtherInfo.vue
index fbe5aa083d..120e42ebe9 100644
--- a/frontend/src/business/components/track/case/components/TestCaseEditOtherInfo.vue
+++ b/frontend/src/business/components/track/case/components/TestCaseEditOtherInfo.vue
@@ -55,6 +55,7 @@
         <tab-pane-count :title="$t('commons.relationship.name')" :count="relationshipCount"/>
       </template>
       <dependencies-list @setCount="setRelationshipCount" :read-only="readOnly" :resource-id="caseId"
+                         @openDependGraphDrawer="setRelationshipGraph"
                          :version-enable="versionEnable" resource-type="TEST_CASE" ref="relationship"/>
     </el-tab-pane>
 
@@ -195,7 +196,7 @@ export default {
       uploadFiles: [],
       relateFiles: [],
       unRelateFiles: [],
-      dumpFile: {},
+      dumpFile: {}
     };
   },
   computed: {
@@ -255,6 +256,9 @@ export default {
     setRelationshipCount(count) {
       this.relationshipCount = count;
     },
+    setRelationshipGraph(val) {
+      this.$emit("syncRelationGraphOpen", val);
+    },
     reset() {
       this.tabActiveName = "remark";
     },
diff --git a/frontend/src/business/components/track/plan/view/comonents/functional/FunctionalTestCaseEdit.vue b/frontend/src/business/components/track/plan/view/comonents/functional/FunctionalTestCaseEdit.vue
index 2f6d647776..645a8e077b 100644
--- a/frontend/src/business/components/track/plan/view/comonents/functional/FunctionalTestCaseEdit.vue
+++ b/frontend/src/business/components/track/plan/view/comonents/functional/FunctionalTestCaseEdit.vue
@@ -110,7 +110,7 @@
 
                       <el-form-item :label="$t('test_track.case.other_info')" :label-width="formLabelWidth">
                         <test-case-edit-other-info :plan-id="testCase.planId" v-if="otherInfoActive" @openTest="openTest"
-                                                   :is-test-plan-edit="true"
+                                                   :is-test-plan-edit="true" @syncRelationGraphOpen="syncRelationGraphOpen"
                                                    :read-only="true" :is-test-plan="true" :project-id="testCase.projectId"
                                                    :form="testCase" :case-id="testCase.caseId" ref="otherInfo"/>
                       </el-form-item >
@@ -121,7 +121,7 @@
               </el-card>
             </div>
           </el-col>
-          <el-col :span="7">
+          <el-col :span="7" v-if="!relationGraphOpen">
             <div class="comment-card">
               <test-plan-functional-execute
                 :test-case="testCase"
@@ -214,7 +214,8 @@ export default {
       isReadOnly: false,
       testCases: [],
       originalStatus: '',
-      titleWith: 0
+      titleWith: 0,
+      relationGraphOpen: false,
     };
   },
   props: {
@@ -506,6 +507,9 @@ export default {
         }
       }
     },
+    syncRelationGraphOpen(val) {
+      this.relationGraphOpen = val;
+    },
     setTitleWith() {
       this.$nextTick(() => {
         this.titleWith = 0;
@@ -629,7 +633,8 @@ p {
 }
 
 /deep/ .el-scrollbar__bar.is-vertical {
-  z-index: 3;
+  z-index: 0;
+  width: 0;
 }
 
 .head-bar {
diff --git a/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue b/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue
index 7e09cda4a8..2eab35ed7d 100644
--- a/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue
+++ b/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue
@@ -115,6 +115,7 @@
 
                     <el-form-item :label="$t('test_track.case.other_info')" :label-width="formLabelWidth">
                       <test-case-edit-other-info @openTest="openTest" :read-only="true"
+                                                 @syncRelationGraphOpen="syncRelationGraphOpen"
                                                  :project-id="projectId" :form="testCase" :case-id="testCase.caseId"
                                                  ref="otherInfo"/>
                     </el-form-item>
@@ -126,7 +127,7 @@
             </el-card>
           </div>
         </el-col>
-        <el-col :span="7">
+        <el-col :span="7" v-if="!relationGraphOpen">
             <div class="comment-card">
               <test-review-test-case-execute
                 :test-case="testCase"
@@ -219,7 +220,8 @@ export default {
       formLabelWidth: '100px',
       isCustomFiledActive: false,
       oldReviewStatus: '',
-      titleWith: 0
+      titleWith: 0,
+      relationGraphOpen: false,
     };
   },
   props: {
@@ -282,6 +284,9 @@ export default {
         }
       }
     },
+    syncRelationGraphOpen(val) {
+      this.relationGraphOpen = val;
+    },
     handleClose() {
       removeGoBackListener(this.handleClose);
       this.showDialog = false;
@@ -574,6 +579,7 @@ export default {
 }
 
 /deep/ .el-scrollbar__bar.is-vertical {
-  z-index: 3;
+  z-index: 0;
+  width: 0;
 }
 </style>