diff --git a/frontend/src/business/components/api/definition/components/ApiCaseList.vue b/frontend/src/business/components/api/definition/components/ApiCaseList.vue
index 49ca3414de..aba85bd27e 100644
--- a/frontend/src/business/components/api/definition/components/ApiCaseList.vue
+++ b/frontend/src/business/components/api/definition/components/ApiCaseList.vue
@@ -78,7 +78,7 @@
       </el-header>
 
       <!-- 用例部分 -->
-      <el-main v-loading="loading">
+      <el-main v-loading="loading" style="overflow: auto">
         <div v-for="(item,index) in apiCaseList" :key="index">
           <el-card style="margin-top: 5px" @click.native="selectTestCase(item,$event)">
             <el-row>
@@ -188,6 +188,7 @@
       },
       loaded: Boolean,
       currentProject: {},
+      refreshSign: String,
     },
     data() {
       return {
@@ -213,6 +214,9 @@
       },
       currentProject() {
         this.getEnvironments();
+      },
+      refreshSign() {
+        this.getApiTest();
       }
     },
     created() {
diff --git a/frontend/src/business/components/api/definition/components/ApiList.vue b/frontend/src/business/components/api/definition/components/ApiList.vue
index d9e2a69201..2db3496969 100644
--- a/frontend/src/business/components/api/definition/components/ApiList.vue
+++ b/frontend/src/business/components/api/definition/components/ApiList.vue
@@ -1,12 +1,9 @@
 <template>
-
-
   <div id="svgBox" style="overflow: auto">
     <div id="svgTop" style="background-color: white">
       <el-card class="card-content">
-        <!--<ms-table-header :showCreate="false" :condition.sync="condition" @search="search"-->
-        <!--:title="$t('api_test.definition.api_title')"/>-->
         <el-input placeholder="搜索" @blur="search" style="float: right ;width: 300px;margin-bottom: 20px;margin-right: 20px" size="small" v-model="condition.name"/>
+
         <el-table border :data="tableData" row-key="id" class="test-content adjust-table"
                   @select-all="handleSelectAll"
                   @select="handleSelect" :height="screenHeight">
@@ -272,7 +269,6 @@
       },
       handleTestCase(testCase) {
         let h = window.screen.height;
-
         let svgTop = document.getElementById("svgTop");
         svgTop.style.height = h / 2 - 200 + "px";
 
diff --git a/frontend/src/business/components/api/definition/components/runtest/RunTestDubboPage.vue b/frontend/src/business/components/api/definition/components/runtest/RunTestDubboPage.vue
index 8d19575df8..6ad2e93844 100644
--- a/frontend/src/business/components/api/definition/components/runtest/RunTestDubboPage.vue
+++ b/frontend/src/business/components/api/definition/components/runtest/RunTestDubboPage.vue
@@ -19,7 +19,7 @@
 
       <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
       <!-- TCP 请求参数 -->
-      <ms-basis-parameters :request="currentRequest" :currentProject="currentProject" ref="requestForm"/>
+      <ms-basis-parameters :request="api.request" :currentProject="currentProject" ref="requestForm"/>
 
       <!--返回结果-->
       <!-- HTTP 请求返回数据 -->
@@ -29,11 +29,12 @@
     </el-card>
 
     <!-- 加载用例 -->
-    <ms-bottom-container v-bind:enableAsideHidden="isHide">
+    <el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
       <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api"
-                        :currentProject="currentProject" :loaded="loaded"
+                        :currentProject="currentProject" :loaded="loaded" :refreshSign="refreshSign"
                         ref="caseList"/>
-    </ms-bottom-container>
+    </el-drawer>
+    >
 
     <!-- 环境 -->
     <api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@@ -72,11 +73,12 @@
     },
     data() {
       return {
-        isHide: true,
+        visible: false,
         api: {},
         loaded: false,
         loading: false,
         currentRequest: {},
+        refreshSign: "",
         responseData: {type: 'HTTP', responseResult: {}, subRequestResults: []},
         reqOptions: REQ_METHOD,
         environments: [],
@@ -102,7 +104,7 @@
           case "save_as_api":
             return this.saveAsApi();
           default:
-           return this.runTest();
+            return this.runTest();
         }
       },
       runTest() {
@@ -122,11 +124,12 @@
         this.$emit('saveAs', this.api);
       },
       loadCase() {
+        this.refreshSign = getUUID();
         this.loaded = true;
-        this.isHide = false;
+        this.visible = true;
       },
       apiCaseClose() {
-        this.isHide = true;
+        this.visible = false;
       },
       getBodyUploadFiles() {
         let bodyUploadFiles = [];
@@ -150,7 +153,7 @@
         return bodyUploadFiles;
       },
       saveAsCase() {
-        this.isHide = false;
+        this.visible = false;
         this.loaded = false;
         this.$refs.caseList.addCase();
       },
@@ -258,4 +261,8 @@
     border-left: 4px solid #783887;
     margin: 20px 0;
   }
+
+  /deep/ .el-drawer {
+    overflow: auto;
+  }
 </style>
diff --git a/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue b/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
index d06a7a409f..e2e9d140f0 100644
--- a/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
+++ b/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
@@ -70,11 +70,11 @@
     </el-card>
 
     <!-- 加载用例 -->
-    <ms-bottom-container v-bind:enableAsideHidden="isHide">
-      <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api"
+    <el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
+      <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api" :refreshSign="refreshSign"
                         :currentProject="currentProject" :loaded="loaded"
                         ref="caseList"/>
-    </ms-bottom-container>
+    </el-drawer>
 
     <!-- 环境 -->
     <api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@@ -90,7 +90,6 @@
   import {downloadFile, getUUID} from "@/common/js/utils";
   import MsApiCaseList from "../ApiCaseList";
   import MsContainer from "../../../../common/components/MsContainer";
-  import MsBottomContainer from "../BottomContainer";
   import {parseEnvironment} from "../../model/EnvironmentModel";
   import ApiEnvironmentConfig from "../environment/ApiEnvironmentConfig";
   import MsRequestResultTail from "../response/RequestResultTail";
@@ -104,18 +103,18 @@
       MsApiRequestForm,
       MsApiCaseList,
       MsContainer,
-      MsBottomContainer,
       MsRequestResultTail,
       ApiEnvironmentConfig,
       MsRun
     },
     data() {
       return {
-        isHide: true,
+        visible: false,
         api: {},
         loaded: false,
         loading: false,
         currentRequest: {},
+        refreshSign:"",
         responseData: {type: 'HTTP', responseResult: {}, subRequestResults: []},
         reqOptions: REQ_METHOD,
         environments: [],
@@ -166,11 +165,12 @@
         this.$emit('saveAs', this.api);
       },
       loadCase() {
+        this.refreshSign = getUUID();
         this.loaded = true;
-        this.isHide = false;
+        this.visible = true;
       },
       apiCaseClose() {
-        this.isHide = true;
+        this.visible = false;
       },
       getBodyUploadFiles() {
         let bodyUploadFiles = [];
@@ -194,9 +194,8 @@
         return bodyUploadFiles;
       },
       saveAsCase() {
-        this.isHide = false;
+        this.visible = false;
         this.loaded = false;
-        this.$refs.caseList.addCase();
       },
       saveAsApi() {
         let data = {};
@@ -303,4 +302,7 @@
     border-left: 4px solid #783887;
     margin: 20px 0;
   }
+  /deep/.el-drawer{
+    overflow: auto;
+  }
 </style>
diff --git a/frontend/src/business/components/api/definition/components/runtest/RunTestSQLPage.vue b/frontend/src/business/components/api/definition/components/runtest/RunTestSQLPage.vue
index 9ab3d6ddac..bd0fcfc525 100644
--- a/frontend/src/business/components/api/definition/components/runtest/RunTestSQLPage.vue
+++ b/frontend/src/business/components/api/definition/components/runtest/RunTestSQLPage.vue
@@ -19,7 +19,7 @@
 
       <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
       <!-- TCP 请求参数 -->
-      <ms-basis-parameters :request="currentRequest" @callback="runTest" :currentProject="currentProject" ref="requestForm"/>
+      <ms-basis-parameters :request="api.request" @callback="runTest" :currentProject="currentProject" ref="requestForm"/>
 
       <!--返回结果-->
       <!-- HTTP 请求返回数据 -->
@@ -29,11 +29,11 @@
     </el-card>
 
     <!-- 加载用例 -->
-    <ms-bottom-container v-bind:enableAsideHidden="isHide">
-      <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api"
+    <el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
+      <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api" :refreshSign="refreshSign"
                         :currentProject="currentProject" :loaded="loaded"
                         ref="caseList"/>
-    </ms-bottom-container>
+    </el-drawer>>
 
     <!-- 环境 -->
     <api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@@ -72,13 +72,14 @@
     },
     data() {
       return {
-        isHide: true,
+        visible: false,
         api: {},
         loaded: false,
         loading: false,
         currentRequest: {},
         responseData: {type: 'HTTP', responseResult: {}, subRequestResults: []},
         reqOptions: REQ_METHOD,
+        refreshSign: "",
         environments: [],
         rules: {
           method: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
@@ -122,11 +123,12 @@
         this.$emit('saveAs', this.api);
       },
       loadCase() {
+        this.refreshSign = getUUID();
         this.loaded = true;
-        this.isHide = false;
+        this.visible = true;
       },
       apiCaseClose() {
-        this.isHide = true;
+        this.visible = false;
       },
       getBodyUploadFiles() {
         let bodyUploadFiles = [];
@@ -150,7 +152,7 @@
         return bodyUploadFiles;
       },
       saveAsCase() {
-        this.isHide = false;
+        this.visible = false;
         this.loaded = false;
         this.$refs.caseList.addCase();
       },
@@ -258,4 +260,7 @@
     border-left: 4px solid #783887;
     margin: 20px 0;
   }
+  /deep/.el-drawer{
+    overflow: auto;
+  }
 </style>
diff --git a/frontend/src/business/components/api/definition/components/runtest/RunTestTCPPage.vue b/frontend/src/business/components/api/definition/components/runtest/RunTestTCPPage.vue
index 191249affe..c775a39ada 100644
--- a/frontend/src/business/components/api/definition/components/runtest/RunTestTCPPage.vue
+++ b/frontend/src/business/components/api/definition/components/runtest/RunTestTCPPage.vue
@@ -19,7 +19,7 @@
 
       <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
       <!-- TCP 请求参数 -->
-      <ms-basis-parameters :request="currentRequest" @callback="runTest" :currentProject="currentProject" ref="requestForm"/>
+      <ms-basis-parameters :request="api.request" @callback="runTest" :currentProject="currentProject" ref="requestForm"/>
 
       <!--返回结果-->
       <!-- HTTP 请求返回数据 -->
@@ -29,11 +29,12 @@
     </el-card>
 
     <!-- 加载用例 -->
-    <ms-bottom-container v-bind:enableAsideHidden="isHide">
-      <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api"
+    <el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
+      <ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :api="api" :refreshSign="refreshSign"
                         :currentProject="currentProject" :loaded="loaded"
                         ref="caseList"/>
-    </ms-bottom-container>
+    </el-drawer>
+    >
 
     <!-- 环境 -->
     <api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@@ -72,7 +73,7 @@
     },
     data() {
       return {
-        isHide: true,
+        visible: false,
         api: {},
         loaded: false,
         loading: false,
@@ -80,6 +81,7 @@
         responseData: {type: 'HTTP', responseResult: {}, subRequestResults: []},
         reqOptions: REQ_METHOD,
         environments: [],
+        refreshSign: "",
         rules: {
           method: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
           url: [{required: true, message: this.$t('api_test.definition.request.path_info'), trigger: 'blur'}],
@@ -122,11 +124,12 @@
         this.$emit('saveAs', this.api);
       },
       loadCase() {
+        this.refreshSign = getUUID();
         this.loaded = true;
-        this.isHide = false;
+        this.visible = true;
       },
       apiCaseClose() {
-        this.isHide = true;
+        this.visible = false;
       },
       getBodyUploadFiles() {
         let bodyUploadFiles = [];
@@ -150,7 +153,7 @@
         return bodyUploadFiles;
       },
       saveAsCase() {
-        this.isHide = false;
+        this.visible = false;
         this.loaded = false;
         this.$refs.caseList.addCase();
       },
@@ -258,4 +261,8 @@
     border-left: 4px solid #783887;
     margin: 20px 0;
   }
+
+  /deep/ .el-drawer {
+    overflow: auto;
+  }
 </style>