diff --git a/frontend/src/business/components/api/automation/scenario/ApiScenarioList.vue b/frontend/src/business/components/api/automation/scenario/ApiScenarioList.vue
index 93ad585913..f1a1d269ec 100644
--- a/frontend/src/business/components/api/automation/scenario/ApiScenarioList.vue
+++ b/frontend/src/business/components/api/automation/scenario/ApiScenarioList.vue
@@ -122,7 +122,7 @@
         <!--测试计划-->
         <el-drawer :visible.sync="planVisible" :destroy-on-close="true" direction="ltr" :withHeader="false"
                    :title="$t('test_track.plan_view.test_result')" :modal="false" size="90%">
-          <ms-test-plan-list @addTestPlan="addTestPlan"/>
+          <ms-test-plan-list @addTestPlan="addTestPlan" @cancel="cancel"/>
         </el-drawer>
       </div>
     </el-card>
@@ -426,6 +426,9 @@
           });
         });
       },
+      cancel(){
+        this.planVisible = false;
+      },
       addTestPlan(plans) {
         let obj = {planIds: plans, scenarioIds: this.selection};
 
diff --git a/frontend/src/business/components/api/automation/scenario/testplan/TestPlanList.vue b/frontend/src/business/components/api/automation/scenario/testplan/TestPlanList.vue
index 6e0bc6dee4..8df9a38cf7 100644
--- a/frontend/src/business/components/api/automation/scenario/testplan/TestPlanList.vue
+++ b/frontend/src/business/components/api/automation/scenario/testplan/TestPlanList.vue
@@ -127,7 +127,7 @@
     </ms-delete-confirm>
 
     <ms-dialog-footer style="float: right;margin: 20px"
-                      @confirm="confirm">
+                      @confirm="confirm" @cancel="cancel">
     </ms-dialog-footer>
 
   </el-card>
@@ -206,6 +206,9 @@
         }
         this.$emit('addTestPlan', this.selection);
       },
+      cancel(){
+        this.$emit('cancel');
+      },
       select(selection) {
         this.selection = selection.map(s => s.id);
         this.$emit('selection', selection);