diff --git a/backend/src/main/java/io/metersphere/api/service/ApiDefinitionService.java b/backend/src/main/java/io/metersphere/api/service/ApiDefinitionService.java
index a73d6f1c6c..f75c94201a 100644
--- a/backend/src/main/java/io/metersphere/api/service/ApiDefinitionService.java
+++ b/backend/src/main/java/io/metersphere/api/service/ApiDefinitionService.java
@@ -215,7 +215,6 @@ public class ApiDefinitionService {
         ApiDefinitionExample example = new ApiDefinitionExample();
         if (request.getProtocol().equals(RequestType.HTTP)) {
             example.createCriteria().andMethodEqualTo(request.getMethod()).andStatusNotEqualTo("Trash")
-                    .andProtocolEqualTo(request.getProtocol()).andPathEqualTo(request.getPath())
                     .andProjectIdEqualTo(request.getProjectId()).andIdNotEqualTo(request.getId());
             return apiDefinitionMapper.selectByExample(example);
         } else {
diff --git a/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.java b/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.java
index 5ed9e3a7fa..17ae2078b3 100644
--- a/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.java
+++ b/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.java
@@ -71,5 +71,10 @@ public interface ExtTestCaseMapper {
 
     List<TrackCountResult> countRelevanceMaintainer(@Param("projectId") String projectId);
 
+    int getTestPlanBug(@Param("planId") String planId);
+    int getTestPlanCase(@Param("planId") String planId);
+    int getTestPlanPassCase(@Param("planId") String planId);
+
+
 
 }
diff --git a/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.xml b/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.xml
index 17d5c37a6e..72d3a06e38 100644
--- a/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.xml
+++ b/backend/src/main/java/io/metersphere/base/mapper/ext/ExtTestCaseMapper.xml
@@ -342,8 +342,9 @@
     </select>
 
     <select id="countCoverage" resultType="io.metersphere.track.response.TrackCountResult">
-        SELECT count(test_case.id) AS countNumber, if(test_case.test_id is null,"uncoverage","coverage") AS groupField
-        FROM test_case WHERE test_case.project_id=#{projectId} GROUP BY groupField
+        SELECT count(test_case.id) AS countNumber,
+               if(test_case.test_id is null,"uncoverage","coverage") AS groupField
+        FROM test_case WHERE test_case.project_id=#{projectId} and test_case.type != 'functional' GROUP BY groupField
     </select>
     <select id="countFuncMaintainer" resultType="io.metersphere.track.response.TrackCountResult">
         select count(tc.id) as countNumber, user.name as groupField from test_case tc right join user on tc.maintainer = user.id
@@ -355,6 +356,50 @@
         where tc.project_id = #{projectId} and tc.test_id is not null
         group by tc.maintainer
     </select>
+    <select id="getTestPlanBug" resultType="int">
+        select count(tci.issues_id) from test_plan_test_case tptc join test_case_issues tci on tptc.case_id = tci.test_case_id
+        where tptc.plan_id = #{planId};
+    </select>
+    <select id="getTestPlanCase" resultType="int">
+        select count(s)
+        from (
+                 select id as s
+                 from test_plan_test_case tptc
+                 where tptc.plan_id = #{planId}
+                 union all
+                 select id as s
+                 from test_plan_api_scenario tpas
+                 where tpas.test_plan_id = #{planId}
+                 union all
+                 select id as s
+                 from test_plan_api_case tpac
+                 where tpac.test_plan_id = #{planId}
+                 union all
+                 select id as s
+                 from test_plan_load_case tplc
+                 where tplc.test_plan_id = #{planId}
+             ) as temp
+    </select>
+    <select id="getTestPlanPassCase" resultType="int">
+        select count(s)
+        from (
+                 select id as s
+                 from test_plan_test_case tptc
+                 where tptc.plan_id = #{planId} and tptc.status = 'Pass'
+                 union all
+                 select id as s
+                 from test_plan_api_scenario tpas
+                 where tpas.test_plan_id = #{planId} and tpas.last_result = 'Success'
+                 union all
+                 select id as s
+                 from test_plan_api_case tpac
+                 where tpac.test_plan_id = #{planId} and tpac.status = 'success'
+                 union all
+                 select id as s
+                 from test_plan_load_case tplc
+                 where tplc.test_plan_id = #{planId} and tplc.status = 'success'
+             ) as temp
+    </select>
 
 
 </mapper>
\ No newline at end of file
diff --git a/backend/src/main/java/io/metersphere/commons/utils/ShiroUtils.java b/backend/src/main/java/io/metersphere/commons/utils/ShiroUtils.java
index 61f73dd9ad..79ad0b6f70 100644
--- a/backend/src/main/java/io/metersphere/commons/utils/ShiroUtils.java
+++ b/backend/src/main/java/io/metersphere/commons/utils/ShiroUtils.java
@@ -48,6 +48,7 @@ public class ShiroUtils {
 
     public static void ignoreCsrfFilter(Map<String, String> filterChainDefinitionMap) {
         filterChainDefinitionMap.put("/", "apikey, authc"); // 跳转到 / 不用校验 csrf
+        filterChainDefinitionMap.put("/language", "apikey, authc");// 跳转到 /language 不用校验 csrf
         filterChainDefinitionMap.put("/document", "apikey, authc"); // 跳转到 /document 不用校验 csrf
     }
 
diff --git a/backend/src/main/java/io/metersphere/performance/parse/xml/reader/jmx/JmeterDocumentParser.java b/backend/src/main/java/io/metersphere/performance/parse/xml/reader/jmx/JmeterDocumentParser.java
index 13ffc9a34e..09fbda18a5 100644
--- a/backend/src/main/java/io/metersphere/performance/parse/xml/reader/jmx/JmeterDocumentParser.java
+++ b/backend/src/main/java/io/metersphere/performance/parse/xml/reader/jmx/JmeterDocumentParser.java
@@ -676,6 +676,13 @@ public class JmeterDocumentParser implements DocumentParser {
             ((List<?>) durations).remove(0);
             duration = o.toString();
         }
+        Object units = context.getProperty("unit");
+        String unit = "S";
+        if (units instanceof List) {
+            Object o = ((List<?>) units).get(0);
+            ((List<?>) units).remove(0);
+            unit = o.toString();
+        }
         Object deleteds = context.getProperty("deleted");
         String deleted = "false";
         if (deleteds instanceof List) {
@@ -691,6 +698,17 @@ public class JmeterDocumentParser implements DocumentParser {
             enabled = o.toString();
         }
 
+        switch (unit) {
+            case "M":
+                duration = String.valueOf(Long.parseLong(duration) * 60);
+                break;
+            case "H":
+                duration = String.valueOf(Long.parseLong(duration) * 60 * 60);
+                break;
+            default:
+                break;
+        }
+
         threadGroup.setAttribute("enabled", enabled);
         if (BooleanUtils.toBoolean(deleted)) {
             threadGroup.setAttribute("enabled", "false");
@@ -761,6 +779,13 @@ public class JmeterDocumentParser implements DocumentParser {
             ((List<?>) holds).remove(0);
             hold = o.toString();
         }
+        Object units = context.getProperty("unit");
+        String unit = "S";
+        if (units instanceof List) {
+            Object o = ((List<?>) units).get(0);
+            ((List<?>) units).remove(0);
+            unit = o.toString();
+        }
         Object deleteds = context.getProperty("deleted");
         String deleted = "false";
         if (deleteds instanceof List) {
@@ -776,6 +801,17 @@ public class JmeterDocumentParser implements DocumentParser {
             enabled = o.toString();
         }
 
+        switch (unit) {
+            case "M":
+                hold = String.valueOf(Long.parseLong(hold) * 60);
+                break;
+            case "H":
+                hold = String.valueOf(Long.parseLong(hold) * 60 * 60);
+                break;
+            default:
+                break;
+        }
+
         threadGroup.setAttribute("enabled", enabled);
         if (BooleanUtils.toBoolean(deleted)) {
             threadGroup.setAttribute("enabled", "false");
@@ -928,10 +964,10 @@ public class JmeterDocumentParser implements DocumentParser {
     }
 
     private Element createStringProp(Document document, String name, String value) {
-        Element unit = document.createElement(STRING_PROP);
-        unit.setAttribute("name", name);
-        unit.appendChild(document.createTextNode(value));
-        return unit;
+        Element element = document.createElement(STRING_PROP);
+        element.setAttribute("name", name);
+        element.appendChild(document.createTextNode(value));
+        return element;
     }
 
     private void processThreadGroupName(Element threadGroup) {
diff --git a/backend/src/main/java/io/metersphere/track/controller/TrackController.java b/backend/src/main/java/io/metersphere/track/controller/TrackController.java
index 2b0d66bfb0..c010d94bc2 100644
--- a/backend/src/main/java/io/metersphere/track/controller/TrackController.java
+++ b/backend/src/main/java/io/metersphere/track/controller/TrackController.java
@@ -87,7 +87,7 @@ public class TrackController {
     }
 
     @GetMapping("/bug/count/{projectId}")
-    public BugStatustics getBugStatustics(@PathVariable String projectId) {
-        return trackService.getBugStatustics(projectId);
+    public BugStatustics getBugStatistics(@PathVariable String projectId) {
+        return trackService.getBugStatistics(projectId);
     }
 }
diff --git a/backend/src/main/java/io/metersphere/track/response/TestPlanBugCount.java b/backend/src/main/java/io/metersphere/track/response/TestPlanBugCount.java
index 4c8a75b272..6802673d16 100644
--- a/backend/src/main/java/io/metersphere/track/response/TestPlanBugCount.java
+++ b/backend/src/main/java/io/metersphere/track/response/TestPlanBugCount.java
@@ -8,7 +8,7 @@ import lombok.Setter;
 public class TestPlanBugCount {
     private int index;
     private String planName;
-    private long creatTime;
+    private long createTime;
     private String status;
     private int caseSize;
     private int bugSize;
diff --git a/backend/src/main/java/io/metersphere/track/response/TrackStatisticsDTO.java b/backend/src/main/java/io/metersphere/track/response/TrackStatisticsDTO.java
index cb3aeffc88..264e0cf9cb 100644
--- a/backend/src/main/java/io/metersphere/track/response/TrackStatisticsDTO.java
+++ b/backend/src/main/java/io/metersphere/track/response/TrackStatisticsDTO.java
@@ -144,20 +144,22 @@ public class TrackStatisticsDTO {
 
     public void countRelevance(List<TrackCountResult> relevanceResults) {
         for (TrackCountResult countResult : relevanceResults) {
-            switch (countResult.getGroupField().toUpperCase()){
+            switch (countResult.getGroupField()){
                 case TrackCount.API:
                     this.apiCaseCount += countResult.getCountNumber();
+                    this.allRelevanceCaseCount += countResult.getCountNumber();
                     break;
                 case TrackCount.PERFORMANCE:
                     this.performanceCaseCount += countResult.getCountNumber();
+                    this.allRelevanceCaseCount += countResult.getCountNumber();
                     break;
                 case TrackCount.AUTOMATION:
                     this.scenarioCaseCount += countResult.getCountNumber();
+                    this.allRelevanceCaseCount += countResult.getCountNumber();
                     break;
                 default:
                     break;
             }
-            this.allRelevanceCaseCount += countResult.getCountNumber();
         }
     }
 
diff --git a/backend/src/main/java/io/metersphere/track/service/TrackService.java b/backend/src/main/java/io/metersphere/track/service/TrackService.java
index b2a01371bd..3bcdf1cf79 100644
--- a/backend/src/main/java/io/metersphere/track/service/TrackService.java
+++ b/backend/src/main/java/io/metersphere/track/service/TrackService.java
@@ -12,6 +12,7 @@ import org.springframework.stereotype.Service;
 import org.springframework.transaction.annotation.Transactional;
 import javax.annotation.Resource;
 import java.math.BigDecimal;
+import java.text.DecimalFormat;
 import java.util.ArrayList;
 import java.util.Date;
 import java.util.List;
@@ -110,59 +111,58 @@ public class TrackService {
         return charts;
     }
 
-    public BugStatustics getBugStatustics(String projectId) {
+    public BugStatustics getBugStatistics(String projectId) {
         TestPlanExample example = new TestPlanExample();
         example.createCriteria().andProjectIdEqualTo(projectId);
         List<TestPlan> plans = testPlanMapper.selectByExample(example);
         List<TestPlanBugCount> list = new ArrayList<>();
         BugStatustics bugStatustics = new BugStatustics();
         int index = 1;
+        int totalBugSize = 0;
+        int totalCaseSize = 0;
         for (TestPlan plan : plans) {
             TestPlanBugCount testPlanBug = new TestPlanBugCount();
             testPlanBug.setIndex(index++);
             testPlanBug.setPlanName(plan.getName());
-            testPlanBug.setCreatTime(plan.getCreateTime());
+            testPlanBug.setCreateTime(plan.getCreateTime());
             testPlanBug.setStatus(plan.getStatus());
-            testPlanBug.setCaseSize(getPlanCaseSize(plan.getId()));
-            testPlanBug.setBugSize(getPlanBugSize(plan.getId()));
-            testPlanBug.setPassRage(getPlanPassRage(plan.getId()));
+
+            int planCaseSize = getPlanCaseSize(plan.getId());
+            testPlanBug.setCaseSize(planCaseSize);
+
+            int planBugSize = getPlanBugSize(plan.getId());
+            testPlanBug.setBugSize(planBugSize);
+            testPlanBug.setPassRage(getPlanPassRage(plan.getId(), planCaseSize));
             list.add(testPlanBug);
+
+            totalBugSize += planBugSize;
+            totalCaseSize += planCaseSize;
         }
 
-        // todo
         bugStatustics.setList(list);
-        bugStatustics.setRage("1");
-        bugStatustics.setBugTotalSize(2);
+        float rage =totalCaseSize == 0 ? 0 : (float) totalBugSize * 100 / totalCaseSize;
+        DecimalFormat df = new DecimalFormat("0.0");
+        bugStatustics.setRage(df.format(rage) + "%");
+        bugStatustics.setBugTotalSize(totalBugSize);
         return bugStatustics;
     }
 
     private int getPlanCaseSize(String planId) {
-        TestPlanTestCaseExample testPlanTestCaseExample = new TestPlanTestCaseExample();
-        testPlanTestCaseExample.createCriteria().andPlanIdEqualTo(planId);
-        List<TestPlanTestCase> testPlanTestCases = testPlanTestCaseMapper.selectByExample(testPlanTestCaseExample);
-
-        TestPlanApiCaseExample testPlanApiCaseExample = new TestPlanApiCaseExample();
-        testPlanApiCaseExample.createCriteria().andTestPlanIdEqualTo(planId);
-        List<TestPlanApiCase> testPlanApiCases = testPlanApiCaseMapper.selectByExample(testPlanApiCaseExample);
-
-        TestPlanLoadCaseExample example = new TestPlanLoadCaseExample();
-        example.createCriteria().andTestPlanIdEqualTo(planId);
-        List<TestPlanLoadCase> testPlanLoadCases = testPlanLoadCaseMapper.selectByExample(example);
-
-        TestPlanApiScenarioExample testPlanApiScenarioExample = new TestPlanApiScenarioExample();
-        testPlanApiCaseExample.createCriteria().andTestPlanIdEqualTo(planId);
-        List<TestPlanApiScenario> testPlanApiScenarios = testPlanApiScenarioMapper.selectByExample(testPlanApiScenarioExample);
-
-
-        return testPlanTestCases.size() + testPlanApiCases.size() + testPlanLoadCases.size() + testPlanApiScenarios.size();
+        return extTestCaseMapper.getTestPlanCase(planId);
 
     }
 
     private int getPlanBugSize(String planId) {
-        return 1;
+        return extTestCaseMapper.getTestPlanBug(planId);
     }
 
-    private String getPlanPassRage(String planId) {
-        return "10%";
+    private String getPlanPassRage(String planId, int totalSize) {
+        if (totalSize == 0) {
+            return "-";
+        }
+        int passSize = extTestCaseMapper.getTestPlanPassCase(planId);
+        float rage = (float) passSize * 100 / totalSize;
+        DecimalFormat df = new DecimalFormat("0.0");
+        return df.format(rage) + "%";
     }
 }
diff --git a/frontend/src/business/components/api/automation/scenario/EditApiScenario.vue b/frontend/src/business/components/api/automation/scenario/EditApiScenario.vue
index cfebd0feb7..38aaf8c4bb 100644
--- a/frontend/src/business/components/api/automation/scenario/EditApiScenario.vue
+++ b/frontend/src/business/components/api/automation/scenario/EditApiScenario.vue
@@ -114,12 +114,13 @@
                 <el-col :span="3" class="ms-col-one ms-font">
                   <el-checkbox v-model="enableCookieShare">共享cookie</el-checkbox>
                 </el-col>
-                <el-col :span="7">
+                <el-col :span="6">
                   <env-popover :env-map="projectEnvMap" :project-ids="projectIds" @setProjectEnvMap="setProjectEnvMap"
                                :project-list="projectList" ref="envPopover"/>
                 </el-col>
-                <el-col :span="2">
+                <el-col :span="3">
                   <el-button :disabled="scenarioDefinition.length < 1" size="small" type="primary" v-prevent-re-click @click="runDebug">{{$t('api_test.request.debug')}}</el-button>
+                  <font-awesome-icon class="alt-ico" :icon="['fa', 'expand-alt']" size="lg" @click="fullScreen"/>
                 </el-col>
               </el-row>
             </div>
@@ -192,6 +193,17 @@
                         class="ms-sc-variable-header"/>
       <!--外部导入-->
       <api-import v-if="type!=='detail'" ref="apiImport" :saved="false" @refresh="apiImport"/>
+
+      <!--步骤最大化-->
+      <ms-drawer :visible="drawer" :size="100" @close="close" direction="right" :show-full-screen="false" :is-show-close="false" style="overflow: hidden">
+        <template v-slot:header>
+          <scenario-header :currentScenario="currentScenario" :projectEnvMap="projectEnvMap" :projectIds="projectIds" :projectList="projectList" :scenarioDefinition="scenarioDefinition" :enableCookieShare="enableCookieShare"
+                           @closePage="close" @showAllBtn="showAllBtn" @runDebug="runDebug" @showScenarioParameters="showScenarioParameters" ref="maximizeHeader"/>
+        </template>
+
+        <maximize-scenario :scenario-definition="scenarioDefinition" :moduleOptions="moduleOptions" :currentScenario="currentScenario" :type="type" ref="maximizeScenario"/>
+      </ms-drawer>
+
     </div>
   </el-card>
 </template>
@@ -224,6 +236,9 @@
   import MsComponentConfig from "./component/ComponentConfig";
   import {handleCtrlSEvent} from "../../../../../common/js/utils";
   import EnvPopover from "@/business/components/api/automation/scenario/EnvPopover";
+  import MaximizeScenario from "./maximize/MaximizeScenario";
+  import ScenarioHeader from "./maximize/ScenarioHeader";
+  import MsDrawer from "../../../common/components/MsDrawer";
 
   let jsonPath = require('jsonpath');
   export default {
@@ -243,7 +258,10 @@
       MsApiCustomize,
       ApiImport,
       MsComponentConfig,
-      EnvPopover
+      EnvPopover,
+      MaximizeScenario,
+      ScenarioHeader,
+      MsDrawer
     },
     data() {
       return {
@@ -293,6 +311,7 @@
         projectEnvMap: new Map,
         projectList: [],
         debugResult: new Map,
+        drawer: false,
       }
     },
     created() {
@@ -423,6 +442,9 @@
       }
     },
     methods: {
+      showAllBtn() {
+        this.$refs.maximizeScenario.showAll();
+      },
       addListener() {
         document.addEventListener("keydown", this.createCtrlSHandle);
         // document.addEventListener("keydown", (even => handleCtrlSEvent(even, this.$refs.httpApi.saveApi)));
@@ -443,6 +465,7 @@
           // 直接更新场景防止编辑内容丢失
           this.editScenario();
         }
+        this.$refs.maximizeHeader.getVariableSize();
         this.reload();
       },
       showButton(...names) {
@@ -697,8 +720,7 @@
         }
         this.sort();
         this.reload();
-      }
-      ,
+      },
       reload() {
         this.loading = true
         this.$nextTick(() => {
@@ -1046,7 +1068,14 @@
         // 把执行结果分发给各个请求
         this.debugResult = result;
         this.sort()
+      },
+      fullScreen() {
+        this.drawer = true;
+      },
+      close() {
+        this.drawer = false;
       }
+
     }
   }
 </script>
@@ -1112,7 +1141,7 @@
   }
 
   /deep/ .el-card__body {
-    padding: 15px;
+    padding: 10px;
   }
 
   /deep/ .el-drawer__body {
@@ -1182,4 +1211,17 @@
   .ms-sc-variable-header >>> .el-dialog__body {
     padding: 0px 20px;
   }
+
+  .alt-ico {
+    font-size: 15px;
+    margin: 0px 10px 0px;
+    color: #8c939d;
+  }
+
+  .alt-ico:hover {
+    color: black;
+    cursor: pointer;
+    font-size: 18px;
+  }
+
 </style>
diff --git a/frontend/src/business/components/api/automation/scenario/Setting.js b/frontend/src/business/components/api/automation/scenario/Setting.js
index 9ddffe168a..28d54980b6 100644
--- a/frontend/src/business/components/api/automation/scenario/Setting.js
+++ b/frontend/src/business/components/api/automation/scenario/Setting.js
@@ -16,6 +16,9 @@ export const ELEMENTS = new Map([
   ['Extract', []],
   ['JmeterElement', []],
   ['CustomizeReq', ["ConstantTimer", "JSR223PreProcessor", "JSR223PostProcessor", "Assertions", "Extract"]],
+  ['MaxSamplerProxy', ["JSR223PreProcessor", "JSR223PostProcessor", "Assertions", "Extract"]],
+  ['AllSamplerProxy', ["HTTPSamplerProxy", "DubboSampler", "JDBCSampler", "TCPSampler"]],
+
 ])
 
 export const ELEMENT_TYPE = {
diff --git a/frontend/src/business/components/api/automation/scenario/common/ApiBaseComponent.vue b/frontend/src/business/components/api/automation/scenario/common/ApiBaseComponent.vue
index 1090ac3b5b..dbd1d4102b 100644
--- a/frontend/src/business/components/api/automation/scenario/common/ApiBaseComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/common/ApiBaseComponent.vue
@@ -1,47 +1,46 @@
 <template>
   <el-card class="api-component">
-
     <div class="header" @click="active(data)">
-
       <slot name="beforeHeaderLeft">
         <div v-if="data.index" class="el-step__icon is-text" style="margin-right: 10px;" :style="{'color': color, 'background-color': backgroundColor}">
           <div class="el-step__icon-inner">{{data.index}}</div>
         </div>
-        <el-button class="ms-left-buttion" size="small" :style="{'color': color, 'background-color': backgroundColor}">{{title}}</el-button>
+        <el-button class="ms-left-buttion" size="mini" :style="{'color': color, 'background-color': backgroundColor}">{{title}}</el-button>
+        <el-tag size="mini" v-if="data.method">{{data.method}}</el-tag>
       </slot>
 
       <span @click.stop>
         <slot name="headerLeft">
           <i class="icon el-icon-arrow-right" :class="{'is-active': data.active}"
-             @click="active(data)" v-if="data.type!='scenario'"/>
-          <el-input :draggable="draggable" v-if="isShowInput && isShowNameInput" size="small" v-model="data.name" class="name-input"
+             @click="active(data)" v-if="data.type!='scenario'  && !isMax "/>
+          <el-input :draggable="draggable" v-if="isShowInput && isShowNameInput" size="mini" v-model="data.name" class="name-input"
                     @blur="isShowInput = false" :placeholder="$t('commons.input_name')" ref="nameEdit" :disabled="data.disabled"/>
+          <span v-else-if="isMax">
+             <el-tooltip :content="data.name" placement="top">
+              <span>{{data.name}}</span>
+            </el-tooltip>
+          </span>
           <span v-else>
             {{data.name}}
             <i class="el-icon-edit" style="cursor:pointer" @click="editName" v-tester v-if="data.referenced!='REF' && !data.disabled"/>
           </span>
         </slot>
-        <slot name="behindHeaderLeft"></slot>
+        <slot name="behindHeaderLeft" v-if="!isMax"></slot>
       </span>
 
       <div class="header-right" @click.stop>
         <slot name="message"></slot>
-        <el-tooltip :content="$t('test_resource_pool.enable_disable')" placement="top">
+        <el-tooltip :content="$t('test_resource_pool.enable_disable')" placement="top" v-if="showBtn">
           <el-switch v-model="data.enable" class="enable-switch"/>
         </el-tooltip>
         <slot name="button"></slot>
-        <el-tooltip content="Copy" placement="top">
-          <el-button size="mini" icon="el-icon-copy-document" circle @click="copyRow" :disabled="data && data.disabled"/>
-        </el-tooltip>
-        <el-tooltip :content="$t('commons.remove')" placement="top">
-          <el-button size="mini" icon="el-icon-delete" type="danger" circle @click="remove" :disabled="data && data.disabled"/>
-        </el-tooltip>
+        <step-extend-btns style="display: contents" @copy="copyRow" @remove="remove" v-if="showBtn"/>
       </div>
 
     </div>
-    <div class="header">
+    <div class="header" v-if="!isMax">
       <fieldset :disabled="data.disabled" class="ms-fieldset">
-        <el-collapse-transition>
+        <el-collapse-transition>6.
           <div v-if="data.active && showCollapse" :draggable="draggable">
             <el-divider></el-divider>
             <slot></slot>
@@ -54,8 +53,11 @@
 </template>
 
 <script>
+  import StepExtendBtns from "../component/StepExtendBtns";
+
   export default {
     name: "ApiBaseComponent",
+    components: {StepExtendBtns},
     data() {
       return {
         isShowInput: false
@@ -63,6 +65,14 @@
     },
     props: {
       draggable: Boolean,
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       data: {
         type: Object,
         default() {
@@ -104,6 +114,9 @@
           this.$refs.nameEdit.focus();
         });
       }
+      if (this.data && this.data.type === "JmeterElement") {
+        this.data.active = false;
+      }
     },
     methods: {
       active() {
@@ -146,14 +159,26 @@
   }
 
   .header-right {
-    margin-right: 20px;
+    margin-top: 5px;
     float: right;
+    z-index: 1;
   }
 
   .enable-switch {
     margin-right: 10px;
   }
 
+  .node-title {
+    display: inline-block;
+    margin: 0px;
+    overflow-x: hidden;
+    padding-bottom: 0;
+    text-overflow: ellipsis;
+    vertical-align: middle;
+    white-space: nowrap;
+    width: 100px;
+  }
+
   fieldset {
     padding: 0px;
     margin: 0px;
diff --git a/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue b/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
index 368ef166ae..f0b258f4e0 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
@@ -9,6 +9,8 @@
     :draggable="true"
     :color="displayColor.color"
     :background-color="displayColor.backgroundColor"
+    :is-max="isMax"
+    :show-btn="showBtn"
     :title="displayTitle">
 
     <template v-slot:behindHeaderLeft>
@@ -71,6 +73,7 @@
   import ApiBaseComponent from "../common/ApiBaseComponent";
   import ApiResponseComponent from "./ApiResponseComponent";
   import CustomizeReqInfo from "@/business/components/api/automation/scenario/common/CustomizeReqInfo";
+  import {ELEMENTS} from "../Setting";
 
   export default {
     name: "MsApiComponent",
@@ -82,6 +85,14 @@
         type: Boolean,
         default: false,
       },
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       currentEnvironmentId: String,
       projectList: Array,
       envMap: Map
@@ -122,6 +133,11 @@
           }
         }
       }
+      // if (this.isMax && this.request && ELEMENTS.get("AllSamplerProxy").indexOf(this.request.type) != -1
+      //   && this.request.hashTree && this.request.hashTree != null && this.request.hashTree.length > 0) {
+      //   this.request.hashTrees = JSON.parse(JSON.stringify(this.request.hashTree));
+      //   this.request.hashTree = undefined;
+      // }
     },
     computed: {
       displayColor() {
@@ -220,6 +236,12 @@
               if (!this.request.projectId) {
                 this.request.projectId = response.data.projectId;
               }
+              // if (this.isMax && this.request && ELEMENTS.get("AllSamplerProxy").indexOf(this.request.type) != -1) {
+              //   this.request.hashTrees = [];
+              //   Object.assign(this.request.hashTrees, this.request.hashTree);
+              //   this.request.hashTree = [];
+              // }
+
               this.reload();
               this.sort();
             } else {
diff --git a/frontend/src/business/components/api/automation/scenario/component/ApiScenarioComponent.vue b/frontend/src/business/components/api/automation/scenario/component/ApiScenarioComponent.vue
index 10603a5173..529f6909d9 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ApiScenarioComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ApiScenarioComponent.vue
@@ -8,6 +8,8 @@
     :show-collapse="false"
     :is-show-name-input="!isDeletedOrRef"
     :is-disabled="true"
+    :is-max="isMax"
+    :show-btn="showBtn"
     color="#606266"
     background-color="#F4F4F5"
     :title="$t('api_test.automation.scenario_import')">
@@ -36,6 +38,14 @@
     props: {
       scenario: {},
       node: {},
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       draggable: {
         type: Boolean,
         default: false,
diff --git a/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue b/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue
index 4b5d93a5f2..4061381817 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="request-form">
-    <component :is="component" :scenario="scenario" :controller="scenario" :timer="scenario" :assertions="scenario" :extract="scenario" :jsr223-processor="scenario" :request="scenario" :currentScenario="currentScenario" :currentEnvironmentId="currentEnvironmentId" :node="node"
+    <component :is="component" :isMax="isMax" :show-btn="showBtn"
+               :scenario="scenario" :controller="scenario" :timer="scenario" :assertions="scenario" :extract="scenario" :jsr223-processor="scenario" :request="scenario" :currentScenario="currentScenario" :currentEnvironmentId="currentEnvironmentId" :node="node"
                :draggable="true" :title="title" :color="titleColor" :background-color="backgroundColor" @suggestClick="suggestClick(node)" :response="response"
                @remove="remove" @copyRow="copyRow" @refReload="refReload" :project-list="projectList" :env-map="envMap"/>
   </div>
@@ -24,6 +25,14 @@
     props: {
       type: String,
       scenario: {},
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       currentScenario: {},
       currentEnvironmentId: String,
       response: {},
diff --git a/frontend/src/business/components/api/automation/scenario/component/ConstantTimer.vue b/frontend/src/business/components/api/automation/scenario/component/ConstantTimer.vue
index 48e3a94be4..d70b221e90 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ConstantTimer.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ConstantTimer.vue
@@ -5,6 +5,7 @@
     :data="timer"
     :draggable="true"
     :show-collapse="false"
+    :is-max="isMax"
     color="#67C23A"
     background-color="#F2F9EE"
     :title="$t('api_test.automation.wait_controller')">
@@ -26,6 +27,14 @@
     props: {
       timer: {},
       node: {},
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       draggable: {
         type: Boolean,
         default: false,
diff --git a/frontend/src/business/components/api/automation/scenario/component/IfController.vue b/frontend/src/business/components/api/automation/scenario/component/IfController.vue
index f43f375886..866d8fd8d7 100644
--- a/frontend/src/business/components/api/automation/scenario/component/IfController.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/IfController.vue
@@ -5,6 +5,8 @@
     :data="controller"
     :show-collapse="false"
     :draggable="true"
+    :is-max="isMax"
+    :show-btn="showBtn"
     color="#E6A23C"
     background-color="#FCF6EE"
     :title="$t('api_test.automation.if_controller')">
@@ -33,6 +35,14 @@
     props: {
       controller: {},
       node: {},
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       index: Object,
       draggable: {
         type: Boolean,
diff --git a/frontend/src/business/components/api/automation/scenario/component/JmeterElementComponent.vue b/frontend/src/business/components/api/automation/scenario/component/JmeterElementComponent.vue
index 5a2f0502e1..28cb9a1843 100644
--- a/frontend/src/business/components/api/automation/scenario/component/JmeterElementComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/JmeterElementComponent.vue
@@ -5,6 +5,8 @@
     :data="request"
     :draggable="draggable"
     :color="defColor"
+    :is-max="isMax"
+    :show-btn="showBtn"
     :background-color="defBackgroundColor"
     :title="request.elementType">
 
@@ -31,6 +33,14 @@
         default:
           false
       },
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       request: {
         type: Object,
       },
diff --git a/frontend/src/business/components/api/automation/scenario/component/Jsr233Processor.vue b/frontend/src/business/components/api/automation/scenario/component/Jsr233Processor.vue
index 596be87e76..d5dad36dfd 100644
--- a/frontend/src/business/components/api/automation/scenario/component/Jsr233Processor.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/Jsr233Processor.vue
@@ -6,6 +6,8 @@
     :data="jsr223Processor"
     :draggable="draggable"
     :color="color"
+    :is-max="isMax"
+    :show-btn="showBtn"
     :background-color="backgroundColor"
     :title="title" v-loading="loading">
 
@@ -33,6 +35,14 @@ export default {
       type: Boolean,
       default: false,
     },
+    isMax: {
+      type: Boolean,
+      default: false,
+    },
+    showBtn: {
+      type: Boolean,
+      default: true,
+    },
     isReadOnly: {
       type: Boolean,
       default:
diff --git a/frontend/src/business/components/api/automation/scenario/component/LoopController.vue b/frontend/src/business/components/api/automation/scenario/component/LoopController.vue
index 99cf8699fd..ed3c0b7e31 100644
--- a/frontend/src/business/components/api/automation/scenario/component/LoopController.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/LoopController.vue
@@ -7,12 +7,14 @@
       @remove="remove"
       :data="controller"
       :draggable="true"
+      :is-max="isMax"
+      :show-btn="showBtn"
       color="#02A7F0"
       background-color="#F4F4F5"
       :title="$t('api_test.automation.loop_controller')" v-loading="loading">
 
       <template v-slot:headerLeft>
-        <i class="icon el-icon-arrow-right" :class="{'is-active': controller.active}" @click="active(controller)" style="margin-right: 10px"/>
+        <i class="icon el-icon-arrow-right" :class="{'is-active': controller.active}" @click="active(controller)" style="margin-right: 10px" v-if="!isMax"/>
         <el-radio @change="changeRadio" class="ms-radio" v-model="controller.loopType" label="LOOP_COUNT">{{$t('loop.loops_title')}}</el-radio>
         <el-radio @change="changeRadio" class="ms-radio" v-model="controller.loopType" label="FOREACH">{{$t('loop.foreach')}}</el-radio>
         <el-radio @change="changeRadio" class="ms-radio" v-model="controller.loopType" label="WHILE">{{$t('loop.while')}}</el-radio>
@@ -97,6 +99,14 @@ export default {
     currentEnvironmentId: String,
     currentScenario: {},
     node: {},
+    isMax: {
+      type: Boolean,
+      default: false,
+    },
+    showBtn: {
+      type: Boolean,
+      default: true,
+    },
     index: Object,
     draggable: {
       type: Boolean,
diff --git a/frontend/src/business/components/api/automation/scenario/component/StepExtendBtns.vue b/frontend/src/business/components/api/automation/scenario/component/StepExtendBtns.vue
new file mode 100644
index 0000000000..7b840ba742
--- /dev/null
+++ b/frontend/src/business/components/api/automation/scenario/component/StepExtendBtns.vue
@@ -0,0 +1,98 @@
+<template>
+  <div>
+    <el-dropdown @command="handleCommand" class="scenario-ext-btn">
+      <el-link type="primary" :underline="false">
+        <el-icon class="el-icon-more"></el-icon>
+      </el-link>
+      <el-dropdown-menu slot="dropdown">
+        <el-dropdown-item command="copy">复制步骤</el-dropdown-item>
+        <el-dropdown-item command="remove" v-tester>删除步骤</el-dropdown-item>
+        <el-dropdown-item command="scenarioVar" v-tester>查看场景变量</el-dropdown-item>
+        <el-dropdown-item command="openScenario" v-tester>打开场景</el-dropdown-item>
+        <el-dropdown-item command="saveAs" v-tester>另存为接口定义</el-dropdown-item>
+        <!--<el-tooltip content="Copy" placement="top">-->
+        <!--<el-button size="mini" icon="el-icon-copy-document" circle @click="copyRow" :disabled="data && data.disabled"/>-->
+        <!--</el-tooltip>-->
+        <!--<el-tooltip :content="$t('commons.remove')" placement="top">-->
+        <!--<el-button size="mini" icon="el-icon-delete" type="danger" circle @click="remove" :disabled="data && data.disabled"/>-->
+        <!--</el-tooltip>-->
+
+      </el-dropdown-menu>
+    </el-dropdown>
+    <ms-reference-view @openScenario="openScenario" ref="viewRef"/>
+    <ms-schedule-maintain ref="scheduleMaintain" @refreshTable="refreshTable"/>
+
+  </div>
+</template>
+
+<script>
+  import MsReferenceView from "@/business/components/api/automation/scenario/ReferenceView";
+  import MsScheduleMaintain from "@/business/components/api/automation/schedule/ScheduleMaintain"
+  import {getCurrentProjectID, getUUID} from "@/common/js/utils";
+
+  export default {
+    name: "StepExtendBtns",
+    components: {MsReferenceView, MsScheduleMaintain},
+    props: {
+      row: Object
+    },
+    methods: {
+      handleCommand(cmd) {
+        switch (cmd) {
+          case  "copy":
+            this.$emit('copy');
+            break;
+          case "remove":
+            this.$emit('remove');
+            break;
+          case "scenarioVar":
+            this.$emit('copy');
+            break;
+          case "openScenario":
+            this.$emit('copy');
+            break;
+          case "saveAs":
+            this.$emit('copy');
+            break;
+        }
+      },
+      createPerformance(row) {
+        this.infoDb = false;
+        let url = "/api/automation/genPerformanceTestJmx";
+        let run = {};
+        let scenarioIds = [];
+        scenarioIds.push(row.id);
+        run.projectId = getCurrentProjectID();
+        run.ids = scenarioIds;
+        run.id = getUUID();
+        run.name = row.name;
+        this.$post(url, run, response => {
+          let jmxObj = {};
+          jmxObj.name = response.data.name;
+          jmxObj.xml = response.data.xml;
+          jmxObj.attachFiles = response.data.attachFiles;
+          jmxObj.attachByteFiles = response.data.attachByteFiles;
+          this.$store.commit('setTest', {
+            name: row.name,
+            jmx: jmxObj
+          })
+          this.$router.push({
+            path: "/performance/test/create"
+          })
+        });
+      },
+      openScenario(item) {
+        this.$emit('openScenario', item)
+      },
+      refreshTable() {
+
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .scenario-ext-btn {
+    margin-left: 10px;
+  }
+</style>
diff --git a/frontend/src/business/components/api/automation/scenario/maximize/MaximizeScenario.vue b/frontend/src/business/components/api/automation/scenario/maximize/MaximizeScenario.vue
new file mode 100644
index 0000000000..ea3127afe3
--- /dev/null
+++ b/frontend/src/business/components/api/automation/scenario/maximize/MaximizeScenario.vue
@@ -0,0 +1,1050 @@
+<template>
+  <div>
+    <!-- 场景步骤-->
+    <ms-container>
+      <ms-aside-container width="600px" class="scenario-aside">
+        <!-- 场景步骤内容 -->
+        <div v-loading="loading">
+          <el-tree node-key="resourceId" :props="props" :data="scenarioDefinition"
+                   :default-expanded-keys="expandedNode"
+                   :expand-on-click-node="false"
+                   highlight-current
+                   @node-expand="nodeExpand"
+                   @node-collapse="nodeCollapse"
+                   :allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick" v-if="!loading" draggable>
+                    <span class="custom-tree-node father" slot-scope="{ node, data}">
+                      <!-- 步骤组件-->
+                       <ms-component-config :isMax="true" :type="data.type" :scenario="data" :response="response" :currentScenario="currentScenario"
+                                            :currentEnvironmentId="currentEnvironmentId" :node="node" :project-list="projectList" :env-map="projectEnvMap"
+                                            @remove="remove" @copyRow="copyRow" @suggestClick="suggestClick" @refReload="refReload"/>
+                    </span>
+          </el-tree>
+
+          <div @click="fabClick">
+            <vue-fab id="fab" mainBtnColor="#783887" size="small" :global-options="globalOptions"
+                     :click-auto-close="false">
+              <fab-item
+                v-for="(item, index) in buttons"
+                :key="index"
+                :idx="getIdx(index)"
+                :title="item.title"
+                :title-bg-color="item.titleBgColor"
+                :title-color="item.titleColor"
+                :color="item.titleColor"
+                :icon="item.icon"
+                @clickItem="item.click"/>
+            </vue-fab>
+          </div>
+
+        </div>
+      </ms-aside-container>
+
+      <ms-main-container>
+        <!-- 第一层当前节点内容-->
+        <ms-component-config :isMax="false" :showBtn="false" :type="selectedTreeNode.type" :scenario="selectedTreeNode" :response="response" :currentScenario="currentScenario"
+                             :currentEnvironmentId="currentEnvironmentId" :node="selectedNode" :project-list="projectList" :env-map="projectEnvMap"
+                             @remove="remove" @copyRow="copyRow" @suggestClick="suggestClick" @refReload="refReload" v-if="selectedTreeNode && selectedNode"/>
+        <!-- 请求下还有的子步骤-->
+        <div v-if="selectedTreeNode && selectedTreeNode.hashTree && showNode(selectedTreeNode)">
+          <div v-for="item in selectedTreeNode.hashTree" :key="item.id" class="ms-col-one">
+            <ms-component-config :showBtn="false" :isMax="false" :type="item.type" :scenario="item" :response="response" :currentScenario="currentScenario"
+                                 :currentEnvironmentId="currentEnvironmentId" :project-list="projectList" :env-map="projectEnvMap"
+                                 @remove="remove" @copyRow="copyRow" @suggestClick="suggestClick" @refReload="refReload" v-if="selectedTreeNode && selectedNode"/>
+
+          </div>
+        </div>
+
+      </ms-main-container>
+    </ms-container>
+
+    <!--接口列表-->
+    <scenario-api-relevance @save="pushApiOrCase" ref="scenarioApiRelevance" v-if="type!=='detail'"/>
+
+    <!--自定义接口-->
+    <el-drawer v-if="type!=='detail'" :visible.sync="customizeVisible" :destroy-on-close="true" direction="ltr"
+               :withHeader="false" :title="$t('api_test.automation.customize_req')" style="overflow: auto"
+               :modal="false" size="90%">
+      <ms-api-customize :request="customizeRequest" @addCustomizeApi="addCustomizeApi"/>
+    </el-drawer>
+    <!--场景导入 -->
+    <scenario-relevance v-if="type!=='detail'" @save="addScenario" ref="scenarioRelevance"/>
+
+    <!-- 环境 -->
+    <api-environment-config v-if="type!=='detail'" ref="environmentConfig" @close="environmentConfigClose"/>
+
+    <!--执行组件-->
+    <ms-run :debug="true" v-if="type!=='detail'" :environment="projectEnvMap" :reportId="reportId"
+            :run-data="debugData"
+            @runRefresh="runRefresh" ref="runTest"/>
+    <!-- 调试结果 -->
+    <el-drawer v-if="type!=='detail'" :visible.sync="debugVisible" :destroy-on-close="true" direction="ltr"
+               :withHeader="true" :modal="false" size="90%">
+      <ms-api-report-detail :report-id="reportId" :debug="true" :currentProjectId="projectId" @refresh="detailRefresh"/>
+    </el-drawer>
+
+    <!--场景公共参数-->
+    <ms-variable-list v-if="type!=='detail'" @setVariables="setVariables" ref="scenarioParameters"
+                      class="ms-sc-variable-header"/>
+    <!--外部导入-->
+    <api-import v-if="type!=='detail'" ref="apiImport" :saved="false" @refresh="apiImport"/>
+  </div>
+</template>
+
+<script>
+  import {API_STATUS, PRIORITY} from "../../../definition/model/JsonData";
+  import {WORKSPACE_ID} from '@/common/js/constants';
+  import {
+    Assertions,
+    ConstantTimer,
+    Extract,
+    IfController,
+    JSR223Processor,
+    LoopController
+  } from "../../../definition/model/ApiTestModel";
+  import {parseEnvironment} from "../../../definition/model/EnvironmentModel";
+  import {ELEMENT_TYPE, ELEMENTS} from "../Setting";
+  import MsApiCustomize from "../ApiCustomize";
+  import {getCurrentProjectID, getUUID, objToStrMap, strMapToObj} from "@/common/js/utils";
+  import ApiEnvironmentConfig from "../../../definition/components/environment/ApiEnvironmentConfig";
+  import MsInputTag from "../MsInputTag";
+  import MsRun from "../DebugRun";
+  import MsApiReportDetail from "../../report/ApiReportDetail";
+  import MsVariableList from "../variable/VariableList";
+  import ApiImport from "../../../definition/components/import/ApiImport";
+  import "@/common/css/material-icons.css"
+  import OutsideClick from "@/common/js/outside-click";
+  import ScenarioApiRelevance from "../api/ApiRelevance";
+  import ScenarioRelevance from "../api/ScenarioRelevance";
+  import MsComponentConfig from "../component/ComponentConfig";
+  import {handleCtrlSEvent} from "../../../../../../common/js/utils";
+  import EnvPopover from "@/business/components/api/automation/scenario/EnvPopover";
+  import MsContainer from "../../../../common/components/MsContainer";
+  import MsMainContainer from "../../../../common/components/MsMainContainer";
+  import MsAsideContainer from "../../../../common/components/MsAsideContainer";
+
+  let jsonPath = require('jsonpath');
+  export default {
+    name: "MaximizeScenario",
+    props: {
+      moduleOptions: Array,
+      currentScenario: {},
+      type: String,
+      scenarioDefinition: Array,
+    },
+    components: {
+      MsVariableList,
+      ScenarioRelevance,
+      ScenarioApiRelevance,
+      ApiEnvironmentConfig,
+      MsApiReportDetail,
+      MsInputTag, MsRun,
+      MsApiCustomize,
+      ApiImport,
+      MsComponentConfig,
+      EnvPopover,
+      MsContainer,
+      MsMainContainer,
+      MsAsideContainer
+    },
+    data() {
+      return {
+        props: {
+          label: "label",
+          children: "hashTree"
+        },
+        rules: {
+          name: [
+            {required: true, message: this.$t('test_track.case.input_name'), trigger: 'blur'},
+            {max: 100, message: this.$t('test_track.length_less_than') + '100', trigger: 'blur'}
+          ],
+          userId: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
+          apiScenarioModuleId: [{required: true, message: this.$t('test_track.case.input_module'), trigger: 'change'}],
+          status: [{required: true, message: this.$t('commons.please_select'), trigger: 'change'}],
+          principal: [{required: true, message: this.$t('api_test.definition.request.responsible'), trigger: 'change'}],
+        },
+        environments: [],
+        currentEnvironmentId: "",
+        maintainerOptions: [],
+        value: API_STATUS[0].id,
+        options: API_STATUS,
+        levels: PRIORITY,
+        scenario: {},
+        loading: false,
+        apiListVisible: false,
+        customizeVisible: false,
+        scenarioVisible: false,
+        debugVisible: false,
+        customizeRequest: {protocol: "HTTP", type: "API", hashTree: [], referenced: 'Created', active: false},
+        operatingElements: [],
+        currentRow: {cases: [], apis: [], referenced: true},
+        selectedTreeNode: undefined,
+        selectedNode: undefined,
+        expandedNode: [],
+        path: "/api/automation/create",
+        debugData: {},
+        reportId: "",
+        projectId: "",
+        enableCookieShare: false,
+        globalOptions: {
+          spacing: 30
+        },
+        response: {},
+        projectIds: new Set,
+        projectEnvMap: new Map,
+        projectList: [],
+        debugResult: new Map,
+      }
+    },
+    created() {
+      if (!this.currentScenario.apiScenarioModuleId) {
+        this.currentScenario.apiScenarioModuleId = "";
+      }
+      this.projectId = getCurrentProjectID();
+      this.operatingElements = ELEMENTS.get("ALL");
+    },
+    directives: {OutsideClick},
+    computed: {
+      buttons() {
+        let buttons = [
+          {
+            title: this.$t('api_test.definition.request.extract_param'),
+            show: this.showButton("Extract"),
+            titleColor: "#015478",
+            titleBgColor: "#E6EEF2",
+            icon: "colorize",
+            click: () => {
+              this.addComponent('Extract')
+            }
+          },
+          {
+            title: this.$t('api_test.definition.request.post_script'),
+            show: this.showButton("JSR223PostProcessor"),
+            titleColor: "#783887",
+            titleBgColor: "#F2ECF3",
+            icon: "skip_next",
+            click: () => {
+              this.addComponent('JSR223PostProcessor')
+            }
+          },
+          {
+            title: this.$t('api_test.definition.request.pre_script'),
+            show: this.showButton("JSR223PreProcessor"),
+            titleColor: "#B8741A",
+            titleBgColor: "#F9F1EA",
+            icon: "skip_previous",
+            click: () => {
+              this.addComponent('JSR223PreProcessor')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.customize_script'),
+            show: this.showButton("JSR223Processor"),
+            titleColor: "#7B4D12",
+            titleBgColor: "#F1EEE9",
+            icon: "code",
+            click: () => {
+              this.addComponent('JSR223Processor')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.if_controller'),
+            show: this.showButton("IfController"),
+            titleColor: "#E6A23C",
+            titleBgColor: "#FCF6EE",
+            icon: "alt_route",
+            click: () => {
+              this.addComponent('IfController')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.loop_controller'),
+            show: this.showButton("LoopController"),
+            titleColor: "#02A7F0",
+            titleBgColor: "#F4F4F5",
+            icon: "next_plan",
+            click: () => {
+              this.addComponent('LoopController')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.wait_controller'),
+            show: this.showButton("ConstantTimer"),
+            titleColor: "#67C23A",
+            titleBgColor: "#F2F9EE",
+            icon: "access_time",
+            click: () => {
+              this.addComponent('ConstantTimer')
+            }
+          },
+          {
+            title: this.$t('api_test.definition.request.assertions_rule'),
+            show: this.showButton("Assertions"),
+            titleColor: "#A30014",
+            titleBgColor: "#F7E6E9",
+            icon: "next_plan",
+            click: () => {
+              this.addComponent('Assertions')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.customize_req'),
+            show: this.showButton("CustomizeReq"),
+            titleColor: "#008080",
+            titleBgColor: "#EBF2F2",
+            icon: "tune",
+            click: () => {
+              this.addComponent('CustomizeReq')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.scenario_import'),
+            show: this.showButton("scenario"),
+            titleColor: "#606266",
+            titleBgColor: "#F4F4F5",
+            icon: "movie",
+            click: () => {
+              this.addComponent('scenario')
+            }
+          },
+          {
+            title: this.$t('api_test.automation.api_list_import'),
+            show: this.showButton("HTTPSamplerProxy", "DubboSampler", "JDBCSampler", "TCPSampler"),
+            titleColor: "#F56C6C",
+            titleBgColor: "#FCF1F1",
+            icon: "api",
+            click: this.apiListImport
+          }
+        ];
+        return buttons.filter(btn => btn.show);
+      }
+    },
+    methods: {
+      removeListener() {
+        document.removeEventListener("keydown", this.createCtrlSHandle);
+      },
+      createCtrlSHandle(event) {
+        handleCtrlSEvent(event, this.editScenario);
+      },
+      getIdx(index) {
+        return index - 0.33
+      },
+      setVariables(v, headers) {
+        this.currentScenario.variables = v;
+        this.currentScenario.headers = headers;
+        if (this.path.endsWith("/update")) {
+          // 直接更新场景防止编辑内容丢失
+          this.editScenario();
+        }
+        this.reload();
+      },
+      showButton(...names) {
+        for (const name of names) {
+          if (name && this.operatingElements && this.operatingElements.includes(name)) {
+            return true;
+          }
+        }
+        return false;
+      },
+      outsideClick(e) {
+        e.stopPropagation();
+        this.showAll();
+      },
+      fabClick() {
+        if (this.operatingElements.length < 1) {
+          this.$info("引用的场景或接口无法添加配置");
+        }
+      },
+      showNode(node) {
+        node.active = true;
+        if (node && ELEMENTS.get("AllSamplerProxy").indexOf(node.type) != -1) {
+          return true;
+        }
+        return false;
+      },
+      addComponent(type) {
+        switch (type) {
+          case ELEMENT_TYPE.IfController:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new IfController()) :
+              this.scenarioDefinition.push(new IfController());
+            break;
+          case ELEMENT_TYPE.ConstantTimer:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new ConstantTimer()) :
+              this.scenarioDefinition.push(new ConstantTimer());
+            break;
+          case ELEMENT_TYPE.JSR223Processor:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new JSR223Processor()) :
+              this.scenarioDefinition.push(new JSR223Processor());
+            break;
+          case ELEMENT_TYPE.JSR223PreProcessor:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new JSR223Processor({type: "JSR223PreProcessor"})) :
+              this.scenarioDefinition.push(new JSR223Processor({type: "JSR223PreProcessor"}));
+            break;
+          case ELEMENT_TYPE.JSR223PostProcessor:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new JSR223Processor({type: "JSR223PostProcessor"})) :
+              this.scenarioDefinition.push(new JSR223Processor({type: "JSR223PostProcessor"}));
+            break;
+          case ELEMENT_TYPE.Assertions:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new Assertions()) :
+              this.scenarioDefinition.push(new Assertions());
+            break;
+          case ELEMENT_TYPE.Extract:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new Extract()) :
+              this.scenarioDefinition.push(new Extract());
+            break;
+          case ELEMENT_TYPE.CustomizeReq:
+            this.customizeRequest = {protocol: "HTTP", type: "API", hashTree: [], referenced: 'Created', active: false};
+            this.customizeVisible = true;
+            break;
+          case  ELEMENT_TYPE.LoopController:
+            this.selectedTreeNode != undefined ? this.selectedTreeNode.hashTree.push(new LoopController()) :
+              this.scenarioDefinition.push(new LoopController());
+            break;
+          case ELEMENT_TYPE.scenario:
+            this.$refs.scenarioRelevance.open();
+            break;
+          default:
+            this.$refs.apiImport.open();
+            break;
+        }
+        if (this.selectedNode) {
+          this.selectedNode.expanded = true;
+        }
+        this.sort();
+      },
+      nodeClick(data, node) {
+        if (data.referenced != 'REF' && data.referenced != 'Deleted' && !data.disabled) {
+          this.operatingElements = ELEMENTS.get(data.type);
+        } else {
+          this.operatingElements = [];
+        }
+        if (data && data.type != "JmeterElement") {
+          data.active = true;
+          if (data.hashTree) {
+            data.hashTree.forEach(item => {
+              if (item && item.type != "JmeterElement") {
+                item.active = true;
+              }
+            })
+          }
+        } else {
+          data.active = false;
+        }
+        this.selectedTreeNode = data;
+        this.selectedNode = node;
+      },
+      suggestClick(node) {
+        this.response = {};
+        if (node.parent && node.parent.data.requestResult) {
+          this.response = node.parent.data.requestResult;
+        }
+      },
+      showAll() {
+        if (!this.customizeVisible) {
+          this.operatingElements = ELEMENTS.get("ALL");
+          this.selectedTreeNode = undefined;
+        }
+      },
+      apiListImport() {
+        this.$refs.scenarioApiRelevance.open();
+      },
+      recursiveSorting(arr) {
+        for (let i in arr) {
+          arr[i].index = Number(i) + 1;
+          if (arr[i].type === ELEMENT_TYPE.LoopController && arr[i].hashTree && arr[i].hashTree.length > 1) {
+            arr[i].countController.proceed = true;
+          }
+          if (!arr[i].projectId) {
+            arr[i].projectId = getCurrentProjectID();
+          }
+          if (arr[i].hashTree != undefined && arr[i].hashTree.length > 0) {
+            this.recursiveSorting(arr[i].hashTree);
+          }
+          // 添加debug结果
+          if (this.debugResult && this.debugResult.get(arr[i].id)) {
+            arr[i].requestResult = this.debugResult.get(arr[i].id);
+          }
+        }
+      },
+      sort() {
+        for (let i in this.scenarioDefinition) {
+          // 排序
+          this.scenarioDefinition[i].index = Number(i) + 1;
+          // 设置循环控制
+          if (this.scenarioDefinition[i].type === ELEMENT_TYPE.LoopController && this.scenarioDefinition[i].hashTree
+            && this.scenarioDefinition[i].hashTree.length > 1) {
+            this.scenarioDefinition[i].countController.proceed = true;
+          }
+          // 设置项目ID
+          if (!this.scenarioDefinition[i].projectId) {
+            this.scenarioDefinition[i].projectId = getCurrentProjectID();
+          }
+          if (this.scenarioDefinition[i].hashTree != undefined && this.scenarioDefinition[i].hashTree.length > 0) {
+            this.recursiveSorting(this.scenarioDefinition[i].hashTree);
+          }
+          // 添加debug结果
+          if (this.debugResult && this.debugResult.get(this.scenarioDefinition[i].id)) {
+            this.scenarioDefinition[i].requestResult = this.debugResult.get(this.scenarioDefinition[i].id);
+          }
+        }
+      },
+      addCustomizeApi(request) {
+        this.customizeVisible = false;
+        request.enable === undefined ? request.enable = true : request.enable;
+        if (this.selectedTreeNode != undefined) {
+          this.selectedTreeNode.hashTree.push(request);
+        } else {
+          this.scenarioDefinition.push(request);
+        }
+        this.customizeRequest = {};
+        this.sort();
+        this.reload();
+        this.initProjectIds();
+      },
+      addScenario(arr) {
+        if (arr && arr.length > 0) {
+          arr.forEach(item => {
+            if (item.id === this.currentScenario.id) {
+              this.$error("不能引用或复制自身！");
+              return;
+            }
+            if (!item.hashTree) {
+              item.hashTree = [];
+            }
+            item.enable === undefined ? item.enable = true : item.enable;
+            this.scenarioDefinition.push(item);
+          })
+        }
+        this.sort();
+        this.reload();
+        this.initProjectIds();
+        this.scenarioVisible = false;
+      },
+      setApiParameter(item, refType, referenced) {
+        let request = {};
+        if (Object.prototype.toString.call(item.request).indexOf("String") > 0) {
+          request = JSON.parse(item.request);
+        } else {
+          request = item.request;
+        }
+        if (item.protocol) {
+          request.protocol = item.protocol;
+        }
+        if (request.protocol === "DUBBO") {
+          request.protocol = "dubbo://";
+        }
+        request.id = item.id;
+        request.name = item.name;
+        request.refType = refType;
+        request.referenced = referenced;
+        request.enable === undefined ? request.enable = true : request.enable;
+        request.active = false;
+        request.resourceId = getUUID();
+        request.projectId = item.projectId;
+        if (!request.url) {
+          request.url = "";
+        }
+        if (referenced === 'REF' || !request.hashTree) {
+          request.hashTree = [];
+        }
+        if (this.selectedTreeNode != undefined) {
+          this.selectedTreeNode.hashTree.push(request);
+        } else {
+          this.scenarioDefinition.push(request);
+        }
+      },
+      pushApiOrCase(data, refType, referenced) {
+        data.forEach(item => {
+          this.setApiParameter(item, refType, referenced);
+        });
+        this.sort();
+        this.reload();
+        this.initProjectIds();
+      },
+      openTagConfig() {
+        if (!this.projectId) {
+          this.$error(this.$t('api_test.select_project'));
+          return;
+        }
+        this.$refs.tag.open();
+      },
+      remove(row, node) {
+        let name = row === undefined || row.name === undefined ? "" : row.name;
+        this.$alert(this.$t('api_test.definition.request.delete_confirm_step') + ' ' + name + " ？", '', {
+          confirmButtonText: this.$t('commons.confirm'),
+          callback: (action) => {
+            if (action === 'confirm') {
+              const parent = node.parent
+              const hashTree = parent.data.hashTree || parent.data;
+              const index = hashTree.findIndex(d => d.resourceId != undefined && row.resourceId != undefined && d.resourceId === row.resourceId)
+              hashTree.splice(index, 1);
+              this.sort();
+              this.reload();
+              this.initProjectIds();
+            }
+          }
+        });
+      },
+      copyRow(row, node) {
+        if (!row || !node) {
+          return;
+        }
+        const parent = node.parent
+        const hashTree = parent.data.hashTree || parent.data;
+        // 深度复制
+        let obj = JSON.parse(JSON.stringify(row));
+        obj.resourceId = getUUID();
+        if (obj.name) {
+          obj.name = obj.name + '_copy';
+        }
+        const index = hashTree.findIndex(d => d.resourceId === row.resourceId);
+        if (index != -1) {
+          hashTree.splice(index + 1, 0, obj);
+        } else {
+          hashTree.push(obj);
+        }
+        this.sort();
+        this.reload();
+      }
+      ,
+      reload() {
+        this.loading = true
+        this.$nextTick(() => {
+          this.loading = false
+        })
+      },
+      runDebug() {
+        /*触发执行操作*/
+        let sign = this.$refs.envPopover.checkEnv();
+        if (!sign) {
+          return;
+        }
+        this.$refs['currentScenario'].validate((valid) => {
+          if (valid) {
+            Promise.all([
+              this.editScenario()]).then(val => {
+              if (val) {
+                this.debugData = {
+                  id: this.currentScenario.id,
+                  name: this.currentScenario.name,
+                  type: "scenario",
+                  variables: this.currentScenario.variables,
+                  referenced: 'Created',
+                  enableCookieShare: this.enableCookieShare,
+                  headers: this.currentScenario.headers,
+                  environmentMap: this.projectEnvMap,
+                  hashTree: this.scenarioDefinition
+                };
+                this.reportId = getUUID().substring(0, 8);
+              }
+            });
+          }
+        })
+      },
+      getEnvironments() {
+        if (this.projectId) {
+          this.$get('/api/environment/list/' + this.projectId, response => {
+            this.environments = response.data;
+            this.environments.forEach(environment => {
+              parseEnvironment(environment);
+            });
+            let hasEnvironment = false;
+            for (let i in this.environments) {
+              if (this.environments[i].id === this.currentEnvironmentId) {
+                hasEnvironment = true;
+                break;
+              }
+            }
+            if (!hasEnvironment) {
+              this.currentEnvironmentId = '';
+            }
+            //检查场景是否需要先进行保存
+            this.checkDataIsCopy();
+          });
+        }
+      },
+
+      checkDataIsCopy() {
+        //  如果是复制按钮创建的场景，直接进行保存
+        if (this.currentScenario.copy) {
+          this.editScenario(false);
+        }
+      },
+
+      openEnvironmentConfig() {
+        if (!this.projectId) {
+          this.$error(this.$t('api_test.select_project'));
+          return;
+        }
+        this.$refs.environmentConfig.open(this.projectId);
+      },
+      environmentConfigClose() {
+        this.getEnvironments();
+      },
+      allowDrop(draggingNode, dropNode, dropType) {
+        if (dropType != "inner") {
+          return true;
+        }
+        else if (dropType === "inner" && dropNode.data.referenced != 'REF' && dropNode.data.referenced != 'Deleted'
+          && ELEMENTS.get(dropNode.data.type).indexOf(draggingNode.data.type) != -1) {
+          return true;
+        }
+        return false;
+      },
+      allowDrag(draggingNode, dropNode, dropType) {
+        if (dropNode && draggingNode && dropType) {
+          this.sort();
+          this.reload();
+        }
+      },
+      nodeExpand(data) {
+        if (data.resourceId) {
+          this.expandedNode.push(data.resourceId);
+        }
+      },
+      nodeCollapse(data) {
+        if (data.resourceId) {
+          this.expandedNode.splice(this.expandedNode.indexOf(data.resourceId), 1);
+        }
+      },
+      getPath(id) {
+        if (id === null) {
+          return null;
+        }
+        let path = this.moduleOptions.filter(function (item) {
+          return item.id === id ? item.path : "";
+        });
+        return path[0].path;
+      },
+      setFiles(item, bodyUploadFiles, obj) {
+        if (item.body) {
+          if (item.body.kvs) {
+            item.body.kvs.forEach(param => {
+              if (param.files) {
+                param.files.forEach(item => {
+                  if (item.file) {
+                    if (!item.id) {
+                      let fileId = getUUID().substring(0, 12);
+                      item.name = item.file.name;
+                      item.id = fileId;
+                    }
+                    obj.bodyUploadIds.push(item.id);
+                    bodyUploadFiles.push(item.file);
+                  }
+                });
+              }
+            });
+          }
+          if (item.body.binary) {
+            item.body.binary.forEach(param => {
+              if (param.files) {
+                param.files.forEach(item => {
+                  if (item.file) {
+                    if (!item.id) {
+                      let fileId = getUUID().substring(0, 12);
+                      item.name = item.file.name;
+                      item.id = fileId;
+                    }
+                    obj.bodyUploadIds.push(item.id);
+                    bodyUploadFiles.push(item.file);
+                  }
+                });
+              }
+            });
+          }
+        }
+      },
+      recursiveFile(arr, bodyUploadFiles, obj) {
+        arr.forEach(item => {
+          this.setFiles(item, bodyUploadFiles, obj);
+          if (item.hashTree != undefined && item.hashTree.length > 0) {
+            this.recursiveFile(item.hashTree, bodyUploadFiles, obj);
+          }
+        });
+      },
+      getBodyUploadFiles(obj) {
+        let bodyUploadFiles = [];
+        obj.bodyUploadIds = [];
+        this.scenarioDefinition.forEach(item => {
+          this.setFiles(item, bodyUploadFiles, obj);
+          if (item.hashTree != undefined && item.hashTree.length > 0) {
+            this.recursiveFile(item.hashTree, bodyUploadFiles, obj);
+          }
+        })
+        // 场景变量csv 文件
+        if (this.currentScenario.variables) {
+          this.currentScenario.variables.forEach(param => {
+            if (param.type === 'CSV' && param.files) {
+              param.files.forEach(item => {
+                if (item.file) {
+                  if (!item.id) {
+                    let fileId = getUUID().substring(0, 12);
+                    item.name = item.file.name;
+                    item.id = fileId;
+                  }
+                  obj.bodyUploadIds.push(item.id);
+                  bodyUploadFiles.push(item.file);
+                }
+              })
+            }
+          })
+        }
+        return bodyUploadFiles;
+      },
+      editScenario() {
+        return new Promise((resolve, reject) => {
+          document.getElementById("inputDelay").focus();  //  保存前在input框自动失焦，以免保存失败
+          this.$refs['currentScenario'].validate((valid) => {
+            if (valid) {
+              this.setParameter();
+              let bodyFiles = this.getBodyUploadFiles(this.currentScenario);
+              this.$fileUpload(this.path, null, bodyFiles, this.currentScenario, response => {
+                this.$success(this.$t('commons.save_success'));
+                this.path = "/api/automation/update";
+                if (response.data) {
+                  this.currentScenario.id = response.data.id;
+                }
+                if (this.currentScenario.tags instanceof String) {
+                  this.currentScenario.tags = JSON.parse(this.currentScenario.tags);
+                }
+                this.$emit('refresh', this.currentScenario);
+                resolve();
+              })
+            }
+          })
+        });
+      },
+
+      setParameter() {
+        this.currentScenario.stepTotal = this.scenarioDefinition.length;
+        this.currentScenario.projectId = getCurrentProjectID();
+        this.currentScenario.modulePath = this.getPath(this.currentScenario.apiScenarioModuleId);
+        // 构建一个场景对象 方便引用处理
+        let scenario = {
+          id: this.currentScenario.id,
+          enableCookieShare: this.enableCookieShare,
+          name: this.currentScenario.name,
+          type: "scenario",
+          variables: this.currentScenario.variables,
+          headers: this.currentScenario.headers,
+          referenced: 'Created',
+          environmentMap: strMapToObj(this.projectEnvMap),
+          hashTree: this.scenarioDefinition,
+          projectId: this.projectId,
+        };
+        this.currentScenario.scenarioDefinition = scenario;
+        if (this.currentScenario.tags instanceof Array) {
+          this.currentScenario.tags = JSON.stringify(this.currentScenario.tags);
+        }
+        if (this.currentModule != null) {
+          this.currentScenario.modulePath = this.currentModule.method !== undefined ? this.currentModule.method : null;
+          this.currentScenario.apiScenarioModuleId = this.currentModule.id;
+        }
+        this.currentScenario.projectId = this.projectId;
+      }
+      ,
+      runRefresh() {
+        this.debugVisible = true;
+        this.loading = false;
+      },
+      showScenarioParameters() {
+        this.$refs.scenarioParameters.open(this.currentScenario.variables, this.currentScenario.headers);
+      },
+      apiImport(importData) {
+        if (importData && importData.data) {
+          importData.data.forEach(item => {
+            this.setApiParameter(item, "API", "OT_IMPORT");
+          })
+          this.sort();
+          this.reload();
+        }
+      },
+      getVariableSize() {
+        let size = 0;
+        if (this.currentScenario.variables) {
+          size += this.currentScenario.variables.length;
+        }
+        if (this.currentScenario.headers && this.currentScenario.headers.length > 1) {
+          size += this.currentScenario.headers.length - 1;
+        }
+        return size;
+      },
+      handleEnv() {
+        this.$refs.apiScenarioEnv.open();
+      },
+      setProjectEnvMap(projectEnvMap) {
+        this.projectEnvMap = projectEnvMap;
+      },
+      refReload() {
+        this.initProjectIds();
+        this.reload();
+      },
+      initProjectIds() {
+        // 加载环境配置
+        this.$nextTick(() => {
+          this.projectIds.clear();
+          this.scenarioDefinition.forEach(data => {
+            let arr = jsonPath.query(data, "$..projectId");
+            arr.forEach(a => this.projectIds.add(a));
+          })
+        })
+      },
+      detailRefresh(result) {
+        // 把执行结果分发给各个请求
+        this.debugResult = result;
+        this.sort()
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .card-content {
+    height: calc(100vh - 196px);
+    overflow-y: auto;
+  }
+
+  .ms-scenario-input {
+    width: 100%;
+  }
+
+  .ms-main-div {
+    background-color: white;
+  }
+
+  .ms-debug-div {
+    border: 1px #DCDFE6 solid;
+    border-radius: 4px;
+    margin-right: 20px;
+  }
+
+  .ms-scenario-button {
+    margin-left: 20px;
+    padding: 7px;
+  }
+
+  .tip {
+    padding: 3px 5px;
+    font-size: 16px;
+    border-radius: 4px;
+    border-left: 4px solid #783887;
+  }
+
+  .ms-api-col {
+    background-color: #7C3985;
+    border-color: #7C3985;
+    margin-right: 10px;
+    color: white;
+  }
+
+  .ms-font {
+    color: #303133;
+    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
+    font-size: 13px;
+  }
+
+  .ms-col-one {
+    margin-top: 10px;
+  }
+
+  #fab {
+    left: 100px;
+    z-index: 5;
+  }
+
+  /deep/ .el-tree-node__content {
+    height: 100%;
+    margin-top: 8px;
+    vertical-align: center;
+  }
+
+  /deep/ .el-card__body {
+    padding: 5px;
+  }
+
+  /deep/ .el-drawer__body {
+    overflow: auto;
+  }
+
+  /deep/ .el-step__icon.is-text {
+    border: 1px solid;
+  }
+
+  /deep/ .el-drawer__header {
+    margin-bottom: 0px;
+  }
+
+  /deep/ .el-link {
+    font-weight: normal;
+  }
+
+  /deep/ .el-checkbox {
+    color: #303133;
+    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
+    font-size: 13px;
+    font-weight: normal;
+  }
+
+  /deep/ .el-checkbox__label {
+    padding-left: 5px;
+  }
+
+  .head {
+    border-bottom: 1px solid #303133;
+    color: #303133;
+    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
+    font-size: 13px;
+  }
+
+  .ms-opt-btn {
+    position: fixed;
+    right: 50px;
+    z-index: 1;
+  }
+
+  .ms-tree >>> .el-tree-node__expand-icon.expanded {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+
+  .ms-tree >>> .el-icon-caret-right:before {
+    content: '\e723';
+    font-size: 20px;
+  }
+
+  .ms-tree >>> .el-tree-node__expand-icon.is-leaf {
+    color: transparent;
+  }
+
+  .ms-tree >>> .el-tree-node__expand-icon {
+    color: #7C3985;
+  }
+
+  .ms-tree >>> .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
+    color: #7C3985;
+    content: "\e722";
+    font-size: 20px;
+  }
+
+  .ms-sc-variable-header >>> .el-dialog__body {
+    padding: 0px 20px;
+  }
+
+  .custom-tree-node {
+    width: 1000px;
+  }
+
+  .father .child {
+    display: none;
+  }
+
+  .scenario-aside {
+    position: relative;
+    border-radius: 4px;
+    border: 1px solid #EBEEF5;
+    box-sizing: border-box;
+  }
+
+  .father:hover .child {
+    display: block;
+  }
+</style>
diff --git a/frontend/src/business/components/api/automation/scenario/maximize/ScenarioHeader.vue b/frontend/src/business/components/api/automation/scenario/maximize/ScenarioHeader.vue
new file mode 100644
index 0000000000..d957231385
--- /dev/null
+++ b/frontend/src/business/components/api/automation/scenario/maximize/ScenarioHeader.vue
@@ -0,0 +1,146 @@
+<template>
+  <div class="ms-header" @click="showAll">
+    <el-row>
+      <div class="ms-div" v-loading="loading">
+        <!-- 调试部分 -->
+        <el-row style="margin: 5px">
+          <el-col :span="6" class="ms-col-one ms-font">
+            {{$t('api_test.automation.step_total')}}：{{scenarioDefinition.length}}
+          </el-col>
+          <el-col :span="6" class="ms-col-one ms-font">
+            <el-link class="head" @click="showScenarioParameters">{{$t('api_test.automation.scenario_total')}}</el-link>
+            ：{{varSize }}
+          </el-col>
+          <el-col :span="5" class="ms-col-one ms-font">
+            <el-checkbox v-model="enableCookieShare">共享cookie</el-checkbox>
+          </el-col>
+          <el-col :span="7">
+            <env-popover :env-map="envMap" :project-ids="projectIds" @setProjectEnvMap="setProjectEnvMap"
+                         :project-list="projectList" ref="envPopover" style="margin-top: 0px"/>
+          </el-col>
+        </el-row>
+      </div>
+      <div class="ms-header-right">
+        <el-button :disabled="scenarioDefinition.length < 1" size="small" type="primary" v-prevent-re-click @click="runDebug">{{$t('api_test.request.debug')}}</el-button>
+        ｜
+        <i class="el-icon-close alt-ico" @click="close"/>
+      </div>
+    </el-row>
+  </div>
+</template>
+
+<script>
+  import {checkoutTestManagerOrTestUser, exportPdf} from "@/common/js/utils";
+  import html2canvas from 'html2canvas';
+  import EnvPopover from "../../scenario/EnvPopover";
+
+  export default {
+    name: "ScenarioHeader",
+    components: {EnvPopover},
+    props: {currentScenario: {}, scenarioDefinition: Array, enableCookieShare: Boolean, projectEnvMap: Map, projectIds: Set, projectList: Array},
+    data() {
+      return {
+        envMap: new Map,
+        loading: false,
+        varSize: 0,
+      }
+    },
+    mounted() {
+      this.envMap = this.projectEnvMap;
+      this.getVariableSize();
+    },
+    methods: {
+      handleExport() {
+        let name = this.$t('commons.report_statistics.test_case_analysis');
+        this.$nextTick(function () {
+          setTimeout(() => {
+            html2canvas(document.getElementById('reportAnalysis'), {
+              scale: 2
+            }).then(function (canvas) {
+              exportPdf(name, [canvas]);
+            });
+          }, 1000);
+        });
+      },
+      showAll() {
+        this.$emit('showAllBtn');
+      },
+      close() {
+        this.$emit('closePage');
+      },
+      runDebug() {
+        this.$emit('runDebug');
+      },
+      showScenarioParameters() {
+        this.$emit('showScenarioParameters');
+      },
+      getVariableSize() {
+        let size = 0;
+        if (this.currentScenario.variables) {
+          size += this.currentScenario.variables.length;
+        }
+        if (this.currentScenario.headers && this.currentScenario.headers.length > 1) {
+          size += this.currentScenario.headers.length - 1;
+        }
+        this.varSize = size;
+        this.reload();
+      },
+      reload() {
+        this.loading = true
+        this.$nextTick(() => {
+          this.loading = false
+        })
+      },
+      setProjectEnvMap(projectEnvMap) {
+        this.envMap = projectEnvMap;
+      }
+    },
+  }
+</script>
+
+<style scoped>
+  .ms-header {
+    border-bottom: 1px solid #E6E6E6;
+    height: 65px;
+    background-color: #FFF;
+  }
+
+  .ms-div {
+    float: left;
+    width: 80%;
+    margin-left: 20px;
+    margin-top: 12px;
+  }
+
+  .ms-span {
+    margin: 0px 10px 10px;
+  }
+
+  .ms-header-right {
+    float: right;
+    margin-bottom: 10px;
+    margin-top: 10px;
+    margin-right: 20px;
+  }
+
+  .alt-ico {
+    font-size: 18px;
+    margin: 10px 0px 0px;
+  }
+
+  .alt-ico:hover {
+    color: black;
+    cursor: pointer;
+    font-size: 18px;
+  }
+
+  .ms-font {
+    color: #303133;
+    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
+    font-size: 13px;
+  }
+
+  .ms-col-one {
+    margin-top: 5px;
+  }
+</style>
diff --git a/frontend/src/business/components/api/definition/components/assertion/ApiAssertions.vue b/frontend/src/business/components/api/definition/components/assertion/ApiAssertions.vue
index 17a7d5d5a2..190d4bdc9e 100644
--- a/frontend/src/business/components/api/definition/components/assertion/ApiAssertions.vue
+++ b/frontend/src/business/components/api/definition/components/assertion/ApiAssertions.vue
@@ -6,6 +6,8 @@
     @active="active"
     :data="assertions"
     :draggable="draggable"
+    :is-max="isMax"
+    :show-btn="showBtn"
     color="#A30014"
     background-color="#F7E6E9"
     :title="$t('api_test.definition.request.assertions_rule')">
@@ -87,6 +89,14 @@
         type: Boolean,
         default: false,
       },
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
       assertions: {},
       node: {},
       request: {},
diff --git a/frontend/src/business/components/api/definition/components/extract/ApiExtract.vue b/frontend/src/business/components/api/definition/components/extract/ApiExtract.vue
index edd56731f9..3b8fab00a6 100644
--- a/frontend/src/business/components/api/definition/components/extract/ApiExtract.vue
+++ b/frontend/src/business/components/api/definition/components/extract/ApiExtract.vue
@@ -5,6 +5,8 @@
     @active="active"
     :data="extract"
     :draggable="draggable"
+    :is-max="isMax"
+    :show-btn="showBtn"
     color="#015478"
     background-color="#E6EEF2"
     :title="$t('api_test.definition.request.extract_param')">
@@ -41,26 +43,26 @@
 </template>
 
 <script>
-import {EXTRACT_TYPE} from "../../model/ApiTestModel";
-import MsApiExtractEdit from "./ApiExtractEdit";
-import MsApiExtractCommon from "./ApiExtractCommon";
-import {getUUID} from "@/common/js/utils";
-import ApiJsonPathSuggestButton from "../assertion/ApiJsonPathSuggestButton";
-import MsApiJsonpathSuggest from "../assertion/ApiJsonpathSuggest";
-import {ExtractJSONPath} from "../../../test/model/ScenarioModel";
-import ApiBaseComponent from "../../../automation/scenario/common/ApiBaseComponent";
+  import {EXTRACT_TYPE} from "../../model/ApiTestModel";
+  import MsApiExtractEdit from "./ApiExtractEdit";
+  import MsApiExtractCommon from "./ApiExtractCommon";
+  import {getUUID} from "@/common/js/utils";
+  import ApiJsonPathSuggestButton from "../assertion/ApiJsonPathSuggestButton";
+  import MsApiJsonpathSuggest from "../assertion/ApiJsonpathSuggest";
+  import {ExtractJSONPath} from "../../../test/model/ScenarioModel";
+  import ApiBaseComponent from "../../../automation/scenario/common/ApiBaseComponent";
 
-export default {
-  name: "MsApiExtract",
-  components: {
-    ApiBaseComponent,
-    MsApiJsonpathSuggest,
-    ApiJsonPathSuggestButton,
-    MsApiExtractCommon,
-    MsApiExtractEdit,
-  },
-  props: {
-    extract: {},
+  export default {
+    name: "MsApiExtract",
+    components: {
+      ApiBaseComponent,
+      MsApiJsonpathSuggest,
+      ApiJsonPathSuggestButton,
+      MsApiExtractCommon,
+      MsApiExtractEdit,
+    },
+    props: {
+      extract: {},
       response: {},
       node: {},
       customizeStyle: {
@@ -74,7 +76,15 @@ export default {
       draggable: {
         type: Boolean,
         default: false,
-      }
+      },
+      isMax: {
+        type: Boolean,
+        default: false,
+      },
+      showBtn: {
+        type: Boolean,
+        default: true,
+      },
     },
     data() {
       return {
diff --git a/frontend/src/business/components/performance/report/components/PerformancePressureConfig.vue b/frontend/src/business/components/performance/report/components/PerformancePressureConfig.vue
index 2157353b8d..633b28f122 100644
--- a/frontend/src/business/components/performance/report/components/PerformancePressureConfig.vue
+++ b/frontend/src/business/components/performance/report/components/PerformancePressureConfig.vue
@@ -37,6 +37,13 @@
                     @change="calculateChart(threadGroup)"
                     size="mini"/>
                 </el-form-item>
+                <el-form-item>
+                  <el-radio-group v-model="threadGroup.unit" :disabled="true">
+                    <el-radio label="S">{{ $t('schedule.cron.seconds') }}</el-radio>
+                    <el-radio label="M">{{ $t('schedule.cron.minutes') }}</el-radio>
+                    <el-radio label="H">{{ $t('schedule.cron.hours') }}</el-radio>
+                  </el-radio-group>
+                </el-form-item>
                 <br>
                 <el-form-item :label="$t('load_test.rps_limit')">
                   <el-switch v-model="threadGroup.rpsLimitEnable" @change="calculateTotalChart()"/>
@@ -59,7 +66,7 @@
                       @change="calculateChart(threadGroup)"
                       size="mini"/>
                   </el-form-item>
-                  <el-form-item :label="$t('load_test.ramp_up_time_minutes')">
+                  <el-form-item :label="$t('load_test.ramp_up_time_minutes', [getUnitLabel(threadGroup)])">
                     <el-input-number
                       :disabled="true"
                       :min="1"
@@ -79,7 +86,7 @@
                       v-model="threadGroup.rampUpTime"
                       size="mini"/>
                   </el-form-item>
-                  <el-form-item :label="$t('load_test.ramp_up_time_seconds')"/>
+                  <el-form-item :label="$t('load_test.ramp_up_time_seconds', [getUnitLabel(threadGroup)])"/>
                 </div>
 
               </div>
@@ -112,7 +119,7 @@
                     @change="calculateChart(threadGroup)"
                     size="mini"/>
                 </el-form-item>
-                <el-form-item :label="$t('load_test.ramp_up_time_seconds')"/>
+                <el-form-item :label="$t('load_test.ramp_up_time_seconds', [getUnitLabel(threadGroup)])"/>
               </div>
             </el-form>
           </el-col>
@@ -137,6 +144,7 @@ const TARGET_LEVEL = "TargetLevel";
 const RAMP_UP = "RampUp";
 const STEPS = "Steps";
 const DURATION = "duration";
+const UNIT = "unit";
 const RPS_LIMIT = "rpsLimit";
 const RPS_LIMIT_ENABLE = "rpsLimitEnable";
 const THREAD_TYPE = "threadType";
@@ -196,11 +204,10 @@ export default {
               this.threadGroups[i].iterateRampUp = item.value;
               break;
             case DURATION:
-              if (item.unit) {
-                this.threadGroups[i].duration = item.value;
-              } else {
-                this.threadGroups[i].duration = item.value * 60;
-              }
+              this.threadGroups[i].duration = item.value;
+              break;
+            case UNIT:
+              this.threadGroups[i].unit = item.value;
               break;
             case STEPS:
               this.threadGroups[i].step = item.value;
@@ -506,6 +513,18 @@ export default {
       }
       this.calculateTotalChart();
     },
+    getUnitLabel(tg) {
+      if (tg.unit === 'S') {
+        return this.$t('schedule.cron.seconds');
+      }
+      if (tg.unit === 'M') {
+        return this.$t('schedule.cron.minutes');
+      }
+      if (tg.unit === 'H') {
+        return this.$t('schedule.cron.hours');
+      }
+      return this.$t('schedule.cron.seconds');
+    },
   },
   watch: {
     report: {
diff --git a/frontend/src/business/components/performance/report/components/TestOverview.vue b/frontend/src/business/components/performance/report/components/TestOverview.vue
index 50574c67d4..f1cd9df364 100644
--- a/frontend/src/business/components/performance/report/components/TestOverview.vue
+++ b/frontend/src/business/components/performance/report/components/TestOverview.vue
@@ -467,7 +467,8 @@ export default {
         let items = {
           name: name,
           type: 'line',
-          data: d
+          data: d,
+          smooth: true
         };
         let seriesArrayNames = seriesArray.map(m => m.name);
         if (seriesArrayNames.includes(name)) {
diff --git a/frontend/src/business/components/performance/test/components/PerformanceAdvancedConfig.vue b/frontend/src/business/components/performance/test/components/PerformanceAdvancedConfig.vue
index 5a835228bd..fcacb7434e 100644
--- a/frontend/src/business/components/performance/test/components/PerformanceAdvancedConfig.vue
+++ b/frontend/src/business/components/performance/test/components/PerformanceAdvancedConfig.vue
@@ -130,7 +130,7 @@
                 <el-table :data="granularityData">
                   <el-table-column property="start" :label="$t('load_test.duration')">
                     <template v-slot:default="scope">
-                      <span>{{ scope.row.start }} - {{ scope.row.end }}</span>
+                      <span>{{ scope.row.start }}S - {{ scope.row.end }}S</span>
                     </template>
                   </el-table-column>
                   <el-table-column property="granularity" :label="$t('load_test.granularity')"/>
diff --git a/frontend/src/business/components/performance/test/components/PerformancePressureConfig.vue b/frontend/src/business/components/performance/test/components/PerformancePressureConfig.vue
index c800972a24..29df9f4e18 100644
--- a/frontend/src/business/components/performance/test/components/PerformancePressureConfig.vue
+++ b/frontend/src/business/components/performance/test/components/PerformancePressureConfig.vue
@@ -47,10 +47,17 @@
                     :disabled="isReadOnly"
                     v-model="threadGroup.duration"
                     :min="1"
-                    :max="172800"
+                    :max="99999"
                     @change="calculateChart(threadGroup)"
                     size="mini"/>
                 </el-form-item>
+                <el-form-item>
+                  <el-radio-group v-model="threadGroup.unit">
+                    <el-radio label="S">{{ $t('schedule.cron.seconds') }}</el-radio>
+                    <el-radio label="M">{{ $t('schedule.cron.minutes') }}</el-radio>
+                    <el-radio label="H">{{ $t('schedule.cron.hours') }}</el-radio>
+                  </el-radio-group>
+                </el-form-item>
                 <br>
                 <el-form-item :label="$t('load_test.rps_limit')">
                   <el-switch v-model="threadGroup.rpsLimitEnable" @change="calculateTotalChart()"/>
@@ -74,7 +81,7 @@
                       @change="calculateChart(threadGroup)"
                       size="mini"/>
                   </el-form-item>
-                  <el-form-item :label="$t('load_test.ramp_up_time_minutes')">
+                  <el-form-item :label="$t('load_test.ramp_up_time_minutes', [getUnitLabel(threadGroup)])">
                     <el-input-number
                       :disabled="isReadOnly"
                       :min="1"
@@ -95,7 +102,7 @@
                       @change="calculateChart(threadGroup)"
                       size="mini"/>
                   </el-form-item>
-                  <el-form-item :label="$t('load_test.ramp_up_time_seconds')"/>
+                  <el-form-item :label="$t('load_test.ramp_up_time_seconds', [getUnitLabel(threadGroup)])"/>
                 </div>
 
               </div>
@@ -128,7 +135,7 @@
                     v-model="threadGroup.iterateRampUp"
                     size="mini"/>
                 </el-form-item>
-                <el-form-item :label="$t('load_test.ramp_up_time_seconds')"/>
+                <el-form-item :label="$t('load_test.ramp_up_time_seconds', [getUnitLabel(threadGroup)])"/>
               </div>
             </el-form>
           </el-col>
@@ -154,6 +161,7 @@ const RAMP_UP = "RampUp";
 const ITERATE_RAMP_UP = "iterateRampUpTime";
 const STEPS = "Steps";
 const DURATION = "duration";
+const UNIT = "unit";
 const RPS_LIMIT = "rpsLimit";
 const RPS_LIMIT_ENABLE = "rpsLimitEnable";
 const HOLD = "Hold";
@@ -253,11 +261,10 @@ export default {
                   this.threadGroups[i].iterateRampUp = item.value;
                   break;
                 case DURATION:
-                  if (item.unit) {
-                    this.threadGroups[i].duration = item.value;
-                  } else {
-                    this.threadGroups[i].duration = item.value * 60;
-                  }
+                  this.threadGroups[i].duration = item.value;
+                  break;
+                case UNIT:
+                  this.threadGroups[i].unit = item.value;
                   break;
                 case STEPS:
                   this.threadGroups[i].step = item.value;
@@ -290,6 +297,7 @@ export default {
                   break;
               }
               //
+              this.$set(this.threadGroups[i], "unit", this.threadGroups[i].unit || 'S');
               this.$set(this.threadGroups[i], "threadType", this.threadGroups[i].threadType || 'DURATION');
               this.$set(this.threadGroups[i], "iterateNum", this.threadGroups[i].iterateNum || 1);
               this.$set(this.threadGroups[i], "iterateRampUp", this.threadGroups[i].iterateRampUp || 10);
@@ -576,6 +584,18 @@ export default {
 
       return true;
     },
+    getUnitLabel(tg) {
+      if (tg.unit === 'S') {
+        return this.$t('schedule.cron.seconds');
+      }
+      if (tg.unit === 'M') {
+        return this.$t('schedule.cron.minutes');
+      }
+      if (tg.unit === 'H') {
+        return this.$t('schedule.cron.hours');
+      }
+      return this.$t('schedule.cron.seconds');
+    },
     convertProperty() {
       /// todo：下面4个属性是jmeter ConcurrencyThreadGroup plugin的属性，这种硬编码不太好吧，在哪能转换这种属性？
       let result = [];
@@ -585,7 +605,8 @@ export default {
           {key: TARGET_LEVEL, value: this.threadGroups[i].threadNumber},
           {key: RAMP_UP, value: this.threadGroups[i].rampUpTime},
           {key: STEPS, value: this.threadGroups[i].step},
-          {key: DURATION, value: this.threadGroups[i].duration, unit: 'S'},
+          {key: DURATION, value: this.threadGroups[i].duration, unit: this.threadGroups[i].unit},
+          {key: UNIT, value: this.threadGroups[i].unit},
           {key: RPS_LIMIT, value: this.threadGroups[i].rpsLimit},
           {key: RPS_LIMIT_ENABLE, value: this.threadGroups[i].rpsLimitEnable},
           {key: HOLD, value: this.threadGroups[i].duration - this.threadGroups[i].rampUpTime},
diff --git a/frontend/src/business/components/performance/test/model/ThreadGroup.js b/frontend/src/business/components/performance/test/model/ThreadGroup.js
index b4656c8af5..2d44f13c5a 100644
--- a/frontend/src/business/components/performance/test/model/ThreadGroup.js
+++ b/frontend/src/business/components/performance/test/model/ThreadGroup.js
@@ -31,6 +31,7 @@ export function findThreadGroup(jmxContent, handler) {
     tg.enabled = tg.attributes.enabled;
     tg.tgType = tg.name;
     tg.threadType = 'DURATION';
+    tg.unit = 'S';
   })
   return threadGroups;
 }
diff --git a/frontend/src/business/components/track/home/components/BugCountCard.vue b/frontend/src/business/components/track/home/components/BugCountCard.vue
index 6f5efb8dd1..d0e09fcbe4 100644
--- a/frontend/src/business/components/track/home/components/BugCountCard.vue
+++ b/frontend/src/business/components/track/home/components/BugCountCard.vue
@@ -15,18 +15,19 @@
             {{ $t('api_test.home_page.unit_of_measurement') }}
           </span>
           <div>
-            占比:
-            <el-link type="info" @click="redirectPage('thisWeekCount')" target="_blank" style="color: #000000">{{ rage }}
-            </el-link>
+            占比
+            <span class="rage">
+                {{rage}}
+            </span>
           </div>
         </div>
       </el-aside>
       <el-table border :data="tableData" class="adjust-table table-content" height="300">
         <el-table-column prop="index" label="序号"
-                         width="100" show-overflow-tooltip/>
+                         width="60" show-overflow-tooltip/>
         <el-table-column prop="planName" label="测试计划名称"
                          width="130" show-overflow-tooltip/>
-        <el-table-column prop="createTime" :label="$t('commons.create_time')" width="130">
+        <el-table-column prop="createTime" :label="$t('commons.create_time')" width="180" show-overflow-tooltip>
           <template v-slot:default="scope">
             <span>{{ scope.row.createTime | timestampFormatDate }}</span>
           </template>
@@ -35,6 +36,7 @@
           prop="status"
           column-key="status"
           :label="$t('test_track.plan.plan_status')"
+          width="100"
           show-overflow-tooltip>
           <template v-slot:default="scope">
           <span @click.stop="clickt = 'stop'">
@@ -106,6 +108,12 @@ export default {
   color: var(--count_number);
 }
 
+.rage {
+  font-family: 'ArialMT', 'Arial', sans-serif;
+  font-size: 18px;
+  color: var(--count_number);
+}
+
 .main-number-show {
   width: 100px;
   height: 100px;
diff --git a/frontend/src/i18n/en-US.js b/frontend/src/i18n/en-US.js
index 91e69c74ce..2e69834217 100644
--- a/frontend/src/i18n/en-US.js
+++ b/frontend/src/i18n/en-US.js
@@ -481,7 +481,7 @@ export default {
     delete_file: "The file already exists, please delete the file with the same name first!",
     thread_num: 'Concurrent users:',
     input_thread_num: 'Please enter the number of threads',
-    duration: 'Duration time (seconds)',
+    duration: 'Duration time',
     granularity: 'Aggregation time (seconds)',
     input_duration: 'Please enter a duration',
     rps_limit: 'RPS Limit:',
diff --git a/frontend/src/i18n/zh-CN.js b/frontend/src/i18n/zh-CN.js
index db08f19989..232b611f71 100644
--- a/frontend/src/i18n/zh-CN.js
+++ b/frontend/src/i18n/zh-CN.js
@@ -478,14 +478,14 @@ export default {
     delete_file: "文件已存在，请先删除同名文件！",
     thread_num: '并发用户数：',
     input_thread_num: '请输入线程数',
-    duration: '压测时长（秒）',
+    duration: '压测时长',
     granularity: '聚合时间（秒）',
     input_duration: '请输入时长',
     rps_limit: 'RPS上限：',
     input_rps_limit: '请输入限制',
     ramp_up_time_within: '在',
-    ramp_up_time_minutes: '秒内，分',
-    ramp_up_time_seconds: '秒内增加并发用户',
+    ramp_up_time_minutes: '{0}内，分',
+    ramp_up_time_seconds: '{0}内增加并发用户',
     iterate_num: '迭代次数 (次): ',
     by_iteration: '按迭代次数',
     by_duration: '按持续时间',
diff --git a/frontend/src/i18n/zh-TW.js b/frontend/src/i18n/zh-TW.js
index ccbc5805d6..17cd3fb05e 100644
--- a/frontend/src/i18n/zh-TW.js
+++ b/frontend/src/i18n/zh-TW.js
@@ -478,7 +478,7 @@ export default {
     delete_file: "文件已存在，請先刪除同名文件！",
     thread_num: '並發用戶數：',
     input_thread_num: '請輸入線程數',
-    duration: '壓測時長（秒）',
+    duration: '壓測時長',
     granularity: '聚合時間（秒）',
     input_duration: '請輸入時長',
     rps_limit: 'RPS上限：',