fix(接口测试): 修复JDBC请求步骤所属环境未随公共环境变动问题

--bug=1011789 --user=赵勇【接口测试】场景-引用场景为sql接口-更换运行环境-调试-返回结果后查看数据源名称-仍显示之前的数据源源名称 https://www.tapd.cn/55049933/s/1128715
2022-04-01 14:25:05 +08:00 · 2022-04-01 14:25:05 +08:00 · 4770c59958
parent d55ea34dba
commit 4770c59958
6 changed files with 257 additions and 373 deletions
--- a/backend/src/main/java/io/metersphere/api/exec/api/ApiCaseExecuteService.java
+++ b/backend/src/main/java/io/metersphere/api/exec/api/ApiCaseExecuteService.java
@ -178,6 +178,7 @@ public class ApiCaseExecuteService {
            }
        }
    }
+
    /**
     * 接口定义case执行
     *
@ -199,6 +200,8 @@ public class ApiCaseExecuteService {
        ServiceUtils.getSelectAllIds(request, request.getCondition(),
                (query) -> extApiTestCaseMapper.selectIdsByQuery((ApiTestCaseRequest) query));

+        List<MsExecResponseDTO> responseDTOS = new LinkedList<>();
+
        ApiTestCaseExample example = new ApiTestCaseExample();
        example.createCriteria().andIdIn(request.getIds());
        List<ApiTestCaseWithBLOBs> caseList = apiTestCaseMapper.selectByExampleWithBLOBs(example);
@ -222,6 +225,7 @@ public class ApiCaseExecuteService {

            apiScenarioReportStructureService.save(serialReportId, new ArrayList<>());
            apiCaseResultService.batchSave(executeQueue);
+            responseDTOS.add(new MsExecResponseDTO(JSON.toJSONString(request.getIds()), report.getId(), request.getTriggerMode()));
        }

        if (request.getConfig() != null && request.getConfig().getMode().equals(RunModeConstants.SERIAL.toString())) {
@ -238,7 +242,6 @@ public class ApiCaseExecuteService {
            request.setTriggerMode(ApiRunMode.DEFINITION.name());
        }

-        List<MsExecResponseDTO> responseDTOS = new LinkedList<>();
        Map<String, ApiDefinitionExecResult> executeQueue = new LinkedHashMap<>();
        String status = request.getConfig().getMode().equals(RunModeConstants.SERIAL.toString()) ? APITestStatus.Waiting.name() : APITestStatus.Running.name();

@ -254,7 +257,9 @@ public class ApiCaseExecuteService {
                report.setIntegratedReportId(serialReportId);
            }
            executeQueue.put(caseWithBLOBs.getId(), report);
-            responseDTOS.add(new MsExecResponseDTO(caseWithBLOBs.getId(), report.getId(), request.getTriggerMode()));
+            if (!StringUtils.equals(request.getConfig().getReportType(), RunModeConstants.SET_REPORT.toString())) {
+                responseDTOS.add(new MsExecResponseDTO(caseWithBLOBs.getId(), report.getId(), request.getTriggerMode()));
+            }
        }

        apiCaseResultService.batchSave(executeQueue);
--- a/backend/src/main/java/io/metersphere/api/service/ApiScenarioReportService.java
+++ b/backend/src/main/java/io/metersphere/api/service/ApiScenarioReportService.java
@ -339,6 +339,7 @@ public class ApiScenarioReportService {
            execResultExample.createCriteria().andIntegratedReportIdEqualTo(reportId).andStatusEqualTo("Error");
            long size = definitionExecResultMapper.countByExample(execResultExample);
            result.setStatus(size > 0 ? ScenarioStatus.Error.name() : ScenarioStatus.Success.name());
+            result.setEndTime(System.currentTimeMillis());
            definitionExecResultMapper.updateByPrimaryKeySelective(result);
        } else {
            ApiScenarioReport report = apiScenarioReportMapper.selectByPrimaryKey(reportId);
@ -375,9 +376,9 @@ public class ApiScenarioReportService {
            }

            long successSize = requestResults.stream().filter(requestResult -> StringUtils.equalsIgnoreCase(requestResult.getStatus(), ScenarioStatus.Success.name())).count();
-            if(requestResults.size() == 0){
+            if (requestResults.size() == 0) {
                scenario.setPassRate("0%");
-            }else {
+            } else {
                scenario.setPassRate(new DecimalFormat("0%").format((float) successSize / requestResults.size()));
            }

--- a/backend/src/main/java/io/metersphere/api/service/MsHashTreeService.java
+++ b/backend/src/main/java/io/metersphere/api/service/MsHashTreeService.java
@ -58,6 +58,8 @@ public class MsHashTreeService {
    private static final String BODY = "body";
    private static final String ARGUMENTS = "arguments";
    private static final String AUTH_MANAGER = "authManager";
+    private static final String PROJECT_ID = "projectId";
+    private static final String ACTIVE = "active";

    public void setHashTree(JSONArray hashTree) {
        // 将引用转成复制
@ -187,11 +189,12 @@ public class MsHashTreeService {
                    element.put(REST, refElement.get(REST));
                    element.put(PATH, refElement.get(PATH));
                    element.put(BODY, refElement.get(BODY));
-                    element.put("active", false);
+                    element.put(ACTIVE, false);
                    element.put(AUTH_MANAGER, refElement.get(AUTH_MANAGER));
                    element.put(ARGUMENTS, refElement.get(ARGUMENTS));
+                    element.put(PROJECT_ID, apiTestCase.getProjectId());
                    if (array != null) {
-                        JSONArray sourceHashTree = element.getJSONArray("hashTree");
+                        JSONArray sourceHashTree = element.getJSONArray(HASH_TREE);
                        Map<String, List<JSONObject>> groupMap = ElementUtil.group(sourceHashTree);
                        Map<String, List<JSONObject>> targetGroupMap = ElementUtil.group(refElement.getJSONArray(HASH_TREE));

@ -208,7 +211,7 @@ public class MsHashTreeService {
                        if (CollectionUtils.isNotEmpty(rules)) {
                            step.addAll(rules);
                        }
-                        element.put("hashTree", step);
+                        element.put(HASH_TREE, step);
                    }
                    element.put(REFERENCED, REF);
                    element.put(DISABLED, true);
--- a/frontend/src/business/components/api/automation/scenario/EditApiScenario.vue
+++ b/frontend/src/business/components/api/automation/scenario/EditApiScenario.vue
@ -733,11 +733,6 @@ export default {
              this.getEnvDomain(data.hashTree, domainMap);
              this.margeDomain(this.scenarioDefinition, domainMap);
              this.cancelBatchProcessing();
-              if (this.$store.state.currentApiCase) {
-                this.$store.state.currentApiCase.resetDataSource = getUUID();
-              } else {
-                this.$store.state.currentApiCase = {resetDataSource: getUUID()};
-              }
            }
          }
        })
--- a/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
@ -270,32 +270,16 @@ export default {
    if (requireComponent != null && JSON.stringify(esbDefinition) != '{}' && JSON.stringify(esbDefinitionResponse) != '{}') {
      this.showXpackCompnent = true;
    }
-    this.getEnvironments(this.environmentGroupId);
  },
  watch: {
-    envMap(val) {
-      this.getEnvironments();
-      this.environmentMap = val;
-    },
    message() {
      this.forStatus();
      this.reload();
    },
-    environmentGroupId(val) {
-      this.getEnvironments(val);
-    },
-    environmentType(val) {
-      this.envType = val;
-    },
    '$store.state.currentApiCase.debugLoop'() {
      this.forStatus();
      this.reload();
    },
-    '$store.state.currentApiCase.resetDataSource'() {
-      if (this.request.id && this.request.referenced !== 'REF') {
-        this.initDataSource();
-      }
-    },
  },
  computed: {
    displayColor() {
@ -391,50 +375,7 @@ export default {
        this.response = this.request.requestResult[0];
      }
    },
-    initDataSource() {
-      let databaseConfigsOptions = [];
-      if (this.request.protocol === 'SQL' || this.request.type === 'JDBCSampler') {
-        if (this.environment && this.environment.config) {
-          let config = JSON.parse(this.environment.config);
-          if (config && config.databaseConfigs) {
-            config.databaseConfigs.forEach(item => {
-              databaseConfigsOptions.push(item);
-            });
-          }
-        }
-      }
-      if (databaseConfigsOptions.length > 0 && this.request.environmentId !== this.environment.id) {
-        this.request.dataSourceId = databaseConfigsOptions[0].id;
-        this.request.environmentId = this.environment.id;
-      }
-    },
-    getEnvironments(groupId) {
-      this.environment = {};
-      let id = undefined;
-      if (groupId) {
-        this.$get("/environment/group/project/map/" + groupId, res => {
-          let data = res.data;
-          if (data) {
-            this.environmentMap = new Map(Object.entries(data));
-            id = new Map(Object.entries(data)).get(this.request.projectId);
-            if (id) {
-              this.$get('/api/environment/get/' + id, response => {
-                this.environment = response.data;
-                this.initDataSource();
-              });
-            }
-          }
-        })
-      } else {
-        id = this.envMap.get(this.request.projectId);
-        if (id) {
-          this.$get('/api/environment/get/' + id, response => {
-            this.environment = response.data;
-            this.initDataSource();
-          });
-        }
-      }
-    },
+
    remove() {
      this.$emit('remove', this.request, this.node);
    },
@ -454,78 +395,6 @@ export default {
        }
      }
    },
-    getApiInfo() {
-      if (this.request.id && this.request.referenced === 'REF') {
-        let requestResult = this.request.requestResult;
-        let enable = this.request.enable;
-        this.$get("/api/testcase/get/" + this.request.id, response => {
-          if (response.data) {
-            let hashTree = [];
-            if (this.request.hashTree) {
-              hashTree = JSON.parse(JSON.stringify(this.request.hashTree));
-            }
-            Object.assign(this.request, JSON.parse(response.data.request));
-            this.request.name = response.data.name;
-            this.request.referenced = "REF";
-            this.request.enable = enable;
-            if (response.data.path && response.data.path != null) {
-              this.request.path = response.data.path;
-              this.request.url = response.data.url;
-            }
-            if (response.data.method && response.data.method != null) {
-              this.request.method = response.data.method;
-            }
-            if (requestResult && Object.prototype.toString.call(requestResult) !== '[object Array]') {
-              this.request.requestResult = [requestResult];
-            } else {
-              this.request.requestResult = requestResult;
-            }
-            if (response.data.num) {
-              this.request.num = response.data.num;
-            }
-            this.request.id = response.data.id;
-            this.request.disabled = true;
-            this.request.root = true;
-            this.request.projectId = response.data.projectId;
-            this.request.versionName = response.data.versionName;
-            this.request.versionEnable = response.data.versionEnable;
-            let req = JSON.parse(response.data.request);
-            if (req && this.request) {
-              this.request.hashTree = hashTree;
-              this.mergeHashTree(req.hashTree);
-            }
-            this.initDataSource();
-            this.forStatus();
-            this.sort();
-            this.reload();
-          }
-        })
-      } else if (this.request.id && this.request.referenced === 'Copy') {
-        if (this.request.refType === 'CASE') {
-          this.$get("/api/testcase/get/" + this.request.id, response => {
-            if (response.data) {
-              if (response.data.num) {
-                this.request.num = response.data.num;
-              }
-              this.request.id = response.data.id;
-              this.request.versionName = response.data.versionName;
-              this.request.versionEnable = response.data.versionEnable;
-            }
-          })
-        } else if (this.request.refType === 'API') {
-          this.$get("/api/definition/get/" + this.request.id, response => {
-            if (response.data) {
-              if (response.data.num) {
-                this.request.num = response.data.num;
-              }
-              this.request.id = response.data.id;
-              this.request.versionName = response.data.versionName;
-              this.request.versionEnable = response.data.versionEnable;
-            }
-          })
-        }
-      }
-    },
    mergeHashTree(targetHashTree) {
      let sourceHashTree = this.request.hashTree;
      // 历史数据兼容
--- a/frontend/src/business/components/api/definition/components/request/database/BasisParameters.vue
+++ b/frontend/src/business/components/api/definition/components/request/database/BasisParameters.vue
@ -108,252 +108,263 @@
 </template>

 <script>
-  import MsApiKeyValue from "../../ApiKeyValue";
-  import MsApiAssertions from "../../assertion/ApiAssertions";
-  import MsApiExtract from "../../extract/ApiExtract";
-  import ApiRequestMethodSelect from "../../collapse/ApiRequestMethodSelect";
-  import MsCodeEdit from "../../../../../common/components/MsCodeEdit";
-  import MsApiScenarioVariables from "../../ApiScenarioVariables";
-  import {createComponent} from "../../jmeter/components";
-  import {Assertions, Extract} from "../../../model/ApiTestModel";
-  import {parseEnvironment} from "../../../model/EnvironmentModel";
-  import ApiEnvironmentConfig from "@/business/components/api/test/components/ApiEnvironmentConfig";
-  import {getCurrentProjectID} from "@/common/js/utils";
-  import {getUUID} from "@/common/js/utils";
-  import MsJsr233Processor from "../../../../automation/scenario/component/Jsr233Processor";
-  import MsJmxStep from "../../step/JmxStep";
-  import {stepCompute, hisDataProcessing} from "@/business/components/api/definition/api-definition";
+import MsApiKeyValue from "../../ApiKeyValue";
+import MsApiAssertions from "../../assertion/ApiAssertions";
+import MsApiExtract from "../../extract/ApiExtract";
+import ApiRequestMethodSelect from "../../collapse/ApiRequestMethodSelect";
+import MsCodeEdit from "../../../../../common/components/MsCodeEdit";
+import MsApiScenarioVariables from "../../ApiScenarioVariables";
+import {createComponent} from "../../jmeter/components";
+import {Assertions, Extract} from "../../../model/ApiTestModel";
+import {parseEnvironment} from "../../../model/EnvironmentModel";
+import ApiEnvironmentConfig from "@/business/components/api/test/components/ApiEnvironmentConfig";
+import {getCurrentProjectID} from "@/common/js/utils";
+import {getUUID} from "@/common/js/utils";
+import MsJsr233Processor from "../../../../automation/scenario/component/Jsr233Processor";
+import MsJmxStep from "../../step/JmxStep";
+import {stepCompute, hisDataProcessing} from "@/business/components/api/definition/api-definition";


-  export default {
-    name: "MsDatabaseConfig",
-    components: {
-      MsJsr233Processor,
-      MsApiScenarioVariables,
-      MsCodeEdit,
-      ApiRequestMethodSelect, MsApiExtract, MsApiAssertions, MsApiKeyValue, ApiEnvironmentConfig,
-      MsJmxStep
+export default {
+  name: "MsDatabaseConfig",
+  components: {
+    MsJsr233Processor,
+    MsApiScenarioVariables,
+    MsCodeEdit,
+    ApiRequestMethodSelect, MsApiExtract, MsApiAssertions, MsApiKeyValue, ApiEnvironmentConfig,
+    MsJmxStep
+  },
+  props: {
+    request: {},
+    basisData: {},
+    response: {},
+    moduleOptions: Array,
+    showScript: {
+      type: Boolean,
+      default: true,
    },
-    props: {
-      request: {},
-      basisData: {},
-      response: {},
-      moduleOptions: Array,
-      showScript: {
-        type: Boolean,
-        default: true,
-      },
-      isReadOnly: {
-        type: Boolean,
-        default: false
-      },
+    isReadOnly: {
+      type: Boolean,
+      default: false
    },
-    data() {
-      return {
-        spanNum: 24,
-        environments: [],
-        isBodyShow: true,
-        currentEnvironment: {},
-        databaseConfigsOptions: [],
-        isReloadData: false,
-        activeName: "variables",
-        rules: {},
-      }
-    },
-    watch: {
-      'request.dataSourceId'() {
-        this.setDataSource();
-      },
-      'request.hashTree': {
-        handler(v) {
-          this.initStepSize(this.request.hashTree);
-        },
-        deep: true
-      }
-    },
-    created() {
-      this.getEnvironments();
-      if (this.request.hashTree) {
+  },
+  data() {
+    return {
+      spanNum: 24,
+      environments: [],
+      isBodyShow: true,
+      currentEnvironment: {},
+      databaseConfigsOptions: [],
+      isReloadData: false,
+      activeName: "variables",
+      rules: {},
+    }
+  },
+  watch: {
+    'request.hashTree': {
+      handler(v) {
        this.initStepSize(this.request.hashTree);
-        this.historicalDataProcessing(this.request.hashTree);
-      }
+      },
+      deep: true
    },
-    computed: {
-      projectId() {
-        return getCurrentProjectID();
-      },
-    },
-    methods: {
-      tabClick() {
-        if (this.activeName === 'preOperate') {
-          this.$refs.preStep.filter();
-        }
-        if (this.activeName === 'postOperate') {
-          this.$refs.postStep.filter();
-        }
-        if (this.activeName === 'assertionsRule') {
-          this.$refs.assertionsRule.filter();
-        }
-      },
-      historicalDataProcessing(array) {
-        hisDataProcessing(array, this.request);
-      },
-      initStepSize(array) {
-        stepCompute(array, this.request);
-        this.reloadBody();
-      },
-      reloadBody() {
-        // 解决修改请求头后 body 显示错位
-        this.isBodyShow = false;
-        this.$nextTick(() => {
-          this.isBodyShow = true;
-        });
-      },
-      remove(row) {
-        let index = this.request.hashTree.indexOf(row);
-        this.request.hashTree.splice(index, 1);
-        this.reload();
-      },
-      copyRow(row) {
-        let obj = JSON.parse(JSON.stringify(row));
-        obj.id = getUUID();
-        this.request.hashTree.push(obj);
-        this.reload();
-      },
-      reload() {
-        this.isReloadData = true
-        this.$nextTick(() => {
-          this.isReloadData = false
-        })
-      },
-      validate() {
-        this.$refs['request'].validate((valid) => {
-          if (valid) {
-            this.$emit('callback');
-          }
-        })
-      },
-      saveApi() {
-        this.basisData.method = this.basisData.protocol;
-        this.$emit('saveApi', this.basisData);
-      },
-      runTest() {
-
-      },
-      getEnvironments() {
-        this.environments = [];
-        let id = this.request.projectId ? this.request.projectId : this.projectId;
-        this.$get('/api/environment/list/' + id, response => {
-          this.environments = response.data;
-          this.environments.forEach(environment => {
-            parseEnvironment(environment);
-          });
-          if (!this.request.environmentId) {
-            this.request.environmentId = this.$store.state.useEnvironment;
-          }
-          let hasEnvironment = false;
-          for (let i in this.environments) {
-            if (this.environments[i].id === this.request.environmentId) {
-              hasEnvironment = true;
-              break;
-            }
-          }
-          if (!hasEnvironment) {
-            this.request.environmentId = undefined;
-          }
-          if (!this.request.environmentId) {
-            this.request.dataSourceId = undefined;
-          }
-          this.initDataSource();
-        });
-      },
-      openEnvironmentConfig() {
-        this.$refs.environmentConfig.open(getCurrentProjectID());
-      },
-      initDataSource() {
-        let flag = false;
-        for (let i in this.environments) {
-          if (this.environments[i].id === this.request.environmentId) {
-            this.databaseConfigsOptions = [];
-            this.environments[i].config.databaseConfigs.forEach(item => {
-              if (item.id === this.request.dataSourceId) {
-                flag = true;
-              }
-              this.databaseConfigsOptions.push(item);
-            });
-            break;
-          }
-        }
-        if (!flag) {
-          this.request.dataSourceId = "";
-        }
-      },
-      setDataSource() {
-        this.initDataSource();
-
-        for (let item of this.databaseConfigsOptions) {
-          if (this.request.dataSourceId === item.id) {
-            this.request.dataSource = item;
-            break;
-          }
-        }
-      },
-      environmentChange(value) {
-        this.request.dataSource = undefined;
-        this.request.dataSourceId = "";
-        for (let i in this.environments) {
-          if (this.environments[i].id === value) {
-            this.databaseConfigsOptions = [];
-            this.environments[i].config.databaseConfigs.forEach(item => {
-              this.databaseConfigsOptions.push(item);
-            })
-            break;
-          }
-        }
-      },
-      environmentConfigClose() {
+    '$store.state.scenarioEnvMap': {
+      handler(v) {
        this.getEnvironments();
      },
+      deep: true
    }
+  },
+  created() {
+    this.getEnvironments();
+    if (this.request.hashTree) {
+      this.initStepSize(this.request.hashTree);
+      this.historicalDataProcessing(this.request.hashTree);
+    }
+  },
+  computed: {
+    projectId() {
+      return getCurrentProjectID();
+    },
+  },
+  methods: {
+    tabClick() {
+      if (this.activeName === 'preOperate') {
+        this.$refs.preStep.filter();
+      }
+      if (this.activeName === 'postOperate') {
+        this.$refs.postStep.filter();
+      }
+      if (this.activeName === 'assertionsRule') {
+        this.$refs.assertionsRule.filter();
+      }
+    },
+    historicalDataProcessing(array) {
+      hisDataProcessing(array, this.request);
+    },
+    initStepSize(array) {
+      stepCompute(array, this.request);
+      this.reloadBody();
+    },
+    reloadBody() {
+      // 解决修改请求头后 body 显示错位
+      this.isBodyShow = false;
+      this.$nextTick(() => {
+        this.isBodyShow = true;
+      });
+    },
+    remove(row) {
+      let index = this.request.hashTree.indexOf(row);
+      this.request.hashTree.splice(index, 1);
+      this.reload();
+    },
+    copyRow(row) {
+      let obj = JSON.parse(JSON.stringify(row));
+      obj.id = getUUID();
+      this.request.hashTree.push(obj);
+      this.reload();
+    },
+    reload() {
+      this.isReloadData = true
+      this.$nextTick(() => {
+        this.isReloadData = false
+      })
+    },
+    validate() {
+      this.$refs['request'].validate((valid) => {
+        if (valid) {
+          this.$emit('callback');
+        }
+      })
+    },
+    saveApi() {
+      this.basisData.method = this.basisData.protocol;
+      this.$emit('saveApi', this.basisData);
+    },
+    runTest() {

+    },
+    getEnvironments() {
+      this.environments = [];
+      let id = this.request.projectId ? this.request.projectId : this.projectId;
+      this.$get('/api/environment/list/' + id, 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.request.environmentId) {
+            if (this.$store.state.scenarioEnvMap && this.$store.state.scenarioEnvMap instanceof Map) {
+              if (this.$store.state.scenarioEnvMap.has(this.projectId) &&
+                this.$store.state.scenarioEnvMap.get(this.projectId) === this.request.environmentId) {
+                hasEnvironment = true;
+              }
+            } else {
+              hasEnvironment = true;
+            }
+            break;
+          }
+        }
+        if (!hasEnvironment) {
+          if (this.$store.state.scenarioEnvMap && this.$store.state.scenarioEnvMap instanceof Map
+            && this.$store.state.scenarioEnvMap.has(this.projectId)) {
+            this.request.environmentId = this.$store.state.scenarioEnvMap.get(this.projectId);
+          }
+        }
+        if (!this.request.environmentId) {
+          this.request.dataSourceId = undefined;
+        }
+        this.initDataSource();
+      });
+    },
+    openEnvironmentConfig() {
+      this.$refs.environmentConfig.open(getCurrentProjectID());
+    },
+    initDataSource() {
+      let flag = false;
+      let environment = {};
+      for (let i in this.environments) {
+        if (this.environments[i].id === this.request.environmentId) {
+          environment = this.environments[i];
+          break;
+        }
+      }
+
+      this.databaseConfigsOptions = [];
+      if (environment.config && environment.config.databaseConfigs) {
+        environment.config.databaseConfigs.forEach(item => {
+          if (item.id === this.request.dataSourceId) {
+            flag = true;
+          }
+          this.databaseConfigsOptions.push(item);
+        });
+        if (!flag && environment.config.databaseConfigs.length > 0) {
+          this.request.dataSourceId = environment.config.databaseConfigs[0].id;
+          flag = true;
+        }
+      }
+      if (!flag) {
+        this.request.dataSourceId = "";
+      }
+    },
+    setDataSource() {
+      this.initDataSource();
+
+      for (let item of this.databaseConfigsOptions) {
+        if (this.request.dataSourceId === item.id) {
+          this.request.dataSource = item;
+          break;
+        }
+      }
+    },
+    environmentChange(value) {
+      this.request.dataSource = undefined;
+      this.request.dataSourceId = "";
+      for (let i in this.environments) {
+        if (this.environments[i].id === value) {
+          this.databaseConfigsOptions = [];
+          this.environments[i].config.databaseConfigs.forEach(item => {
+            this.databaseConfigsOptions.push(item);
+          })
+          break;
+        }
+      }
+    },
+    environmentConfigClose() {
+      this.getEnvironments();
+    },
  }
+
+}
 </script>

 <style scoped>
-  .sql-content {
-    height: calc(100vh - 570px);
-  }
+.sql-content {
+  height: calc(100vh - 570px);
+}

-  .one-row .el-form-item {
-    display: inline-block;
-  }
+.one-row .el-form-item {
+  display: inline-block;
+}

-  .one-row .el-form-item:nth-child(2) {
-    margin-left: 60px;
-  }
+.one-row .el-form-item:nth-child(2) {
+  margin-left: 60px;
+}

-  .ms-left-cell {
-    margin-top: 40px;
-  }
+.ms-header {
+  background: #783887;
+  color: white;
+  height: 18px;
+  font-size: xx-small;
+  border-radius: 50%;
+}

-  .ms-header {
-    background: #783887;
-    color: white;
-    height: 18px;
-    font-size: xx-small;
-    border-radius: 50%;
-  }
+.environment-button {
+  margin-left: 20px;
+  padding: 7px;
+}

-  .environment-button {
-    margin-left: 20px;
-    padding: 7px;
-  }
-
-  .ms-left-buttion {
-    margin: 6px 0px 8px 30px;
-  }
-
-  /deep/ .el-form-item {
-    margin-bottom: 15px;
-  }
+/deep/ .el-form-item {
+  margin-bottom: 15px;
+}
 </style>