diff --git a/backend/src/main/java/io/dataease/controller/request/datasource/ApiDefinitionRequest.java b/backend/src/main/java/io/dataease/controller/request/datasource/ApiDefinitionRequest.java
index ef07542903..6f403541f5 100644
--- a/backend/src/main/java/io/dataease/controller/request/datasource/ApiDefinitionRequest.java
+++ b/backend/src/main/java/io/dataease/controller/request/datasource/ApiDefinitionRequest.java
@@ -1,16 +1,15 @@
 package io.dataease.controller.request.datasource;
 
-import com.google.gson.JsonObject;
+import com.alibaba.fastjson.JSONObject;
 import lombok.Data;
 import java.util.ArrayList;
-import java.util.HashMap;
 import java.util.List;
 import java.util.Map;
 
 @Data
 public class ApiDefinitionRequest {
     private List<Map<String, String>> headers = new ArrayList<>();
-    private Map<String, Object> body = new HashMap<>();
+    private JSONObject body = new JSONObject();
     private AuthManager authManager = new AuthManager();
 
 
diff --git a/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java b/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java
index 8953615172..e592d2c5a2 100644
--- a/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java
+++ b/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java
@@ -5,8 +5,9 @@ import com.alibaba.fastjson.JSON;
 import com.alibaba.fastjson.JSONArray;
 import com.alibaba.fastjson.JSONObject;
 import com.alibaba.fastjson.serializer.SerializerFeature;
-import com.google.gson.*;
-import com.google.gson.reflect.TypeToken;
+import com.google.common.reflect.TypeToken;
+import com.google.gson.Gson;
+import com.google.gson.JsonObject;
 import io.dataease.controller.sys.response.BasicInfo;
 import io.dataease.dto.dataset.DatasetTableFieldDTO;
 import io.dataease.plugins.common.dto.datasource.TableDesc;
@@ -161,11 +162,12 @@ public class ApiProvider extends Provider {
                 if (StringUtils.equalsAny(type, "Form_Data", "WWW_FORM")) {
                     if (apiDefinitionRequest.getBody().get("kvs") != null) {
                         Map<String, String> body = new HashMap<>();
-                        JsonArray kvsArr = JsonParser.parseString(apiDefinitionRequest.getBody().get("kvs").toString()).getAsJsonArray();
+                        JSONObject bodyObj = JSONObject.parseObject(apiDefinitionRequest.getBody().toString());
+                        JSONArray kvsArr = bodyObj.getJSONArray("kvs");
                         for (int i = 0; i < kvsArr.size(); i++) {
-                            JsonObject kv = kvsArr.get(i).getAsJsonObject();
-                            if (kv.get("name") != null) {
-                                body.put(kv.get("name").getAsString(), kv.get("value").getAsString());
+                            JSONObject kv = kvsArr.getJSONObject(i);
+                            if (kv.containsKey("name")) {
+                                body.put(kv.getString("name"), kv.getString("value"));
                             }
                         }
                         response = HttpClientUtil.post(apiDefinition.getUrl(), body, httpClientConfig);
@@ -195,6 +197,14 @@ public class ApiProvider extends Provider {
             rootPath = "$";
             handleStr(apiDefinition, response, fields, rootPath);
         }
+        for (JSONObject field : fields) {
+            if(field.containsKey("children") && CollectionUtils.isNotEmpty(field.getJSONArray("children"))){
+                field.put("disabled", false);
+            }
+            if(field.containsKey("children") && CollectionUtils.isEmpty(field.getJSONArray("children"))){
+                field.put("disabled", true);
+            }
+        }
         apiDefinition.setJsonFields(fields);
         return apiDefinition;
     }
@@ -216,14 +226,14 @@ public class ApiProvider extends Provider {
                     try {
                         JSONArray jsonArray = jsonObject.getJSONArray(s);
                         List<JSONObject> childrenField = new ArrayList<>();
-                        for (Object object: jsonArray) {
+                        for (Object object : jsonArray) {
                             JSONObject.parseObject(object.toString());
                             handleStr(apiDefinition, JSON.toJSONString(object, SerializerFeature.WriteMapNullValue), childrenField, rootPath + "." + s + "[*]");
                         }
                         o.put("children", childrenField);
                         o.put("childrenDataType", "LIST");
 
-                    }catch (Exception e){
+                    } catch (Exception e) {
                         JSONArray array = new JSONArray();
                         array.add(StringUtils.isNotEmpty(jsonObject.getString(s)) ? jsonObject.getString(s) : "");
                         o.put("value", array);
@@ -295,11 +305,11 @@ public class ApiProvider extends Provider {
     }
 
 
-    static void mergeField(JSONObject field, JSONObject item){
-        if(item.getJSONArray("children") != null ){
+    static void mergeField(JSONObject field, JSONObject item) {
+        if (item.getJSONArray("children") != null) {
             JSONArray itemChildren = item.getJSONArray("children");
             JSONArray fieldChildren = field.getJSONArray("children");
-            if(fieldChildren == null){
+            if (fieldChildren == null) {
                 fieldChildren = new JSONArray();
             }
             for (Object itemChild : itemChildren) {
@@ -307,12 +317,12 @@ public class ApiProvider extends Provider {
                 JSONObject itemChildObject = JSONObject.parseObject(itemChild.toString());
                 for (Object fieldChild : fieldChildren) {
                     JSONObject fieldChildObject = JSONObject.parseObject(fieldChild.toString());
-                    if(itemChildObject.getString("jsonPath").equals(fieldChildObject.getString("jsonPath"))){
+                    if (itemChildObject.getString("jsonPath").equals(fieldChildObject.getString("jsonPath"))) {
                         mergeField(fieldChildObject, itemChildObject);
                         hasKey = true;
                     }
                 }
-                if(!hasKey){
+                if (!hasKey) {
                     fieldChildren.add(itemChild);
                 }
             }
@@ -325,7 +335,7 @@ public class ApiProvider extends Provider {
             array.add(item.getJSONArray("value").get(0).toString());
             field.put("value", array);
         }
-        if(CollectionUtils.isNotEmpty(field.getJSONArray("children"))&&  CollectionUtils.isNotEmpty(item.getJSONArray("children"))){
+        if (CollectionUtils.isNotEmpty(field.getJSONArray("children")) && CollectionUtils.isNotEmpty(item.getJSONArray("children"))) {
             JSONArray fieldChildren = field.getJSONArray("children");
             JSONArray itemChildren = item.getJSONArray("children");
 
@@ -335,11 +345,11 @@ public class ApiProvider extends Provider {
                 JSONObject find = null;
                 for (Object itemChild : itemChildren) {
                     JSONObject itemObject = JSONObject.parseObject(itemChild.toString());
-                    if(jsonObject.getString("jsonPath").equals(itemObject.getString("jsonPath"))){
+                    if (jsonObject.getString("jsonPath").equals(itemObject.getString("jsonPath"))) {
                         find = itemObject;
                     }
                 }
-                if(find != null){
+                if (find != null) {
                     mergeValue(jsonObject, apiDefinition, find);
                 }
                 fieldArrayChildren.add(jsonObject);
diff --git a/backend/src/main/java/io/dataease/provider/query/sqlserver/SqlserverQueryProvider.java b/backend/src/main/java/io/dataease/provider/query/sqlserver/SqlserverQueryProvider.java
index 90d47de82d..2ea6ff8c10 100644
--- a/backend/src/main/java/io/dataease/provider/query/sqlserver/SqlserverQueryProvider.java
+++ b/backend/src/main/java/io/dataease/provider/query/sqlserver/SqlserverQueryProvider.java
@@ -1244,7 +1244,13 @@ public class SqlserverQueryProvider extends QueryProvider {
         } else {
             if (StringUtils.equalsIgnoreCase(y.getSummary(), "avg") || StringUtils.containsIgnoreCase(y.getSummary(), "pop")) {
                 String convert = String.format(SqlServerSQLConstants.CONVERT, y.getDeType() == DeTypeConstants.DE_INT ? SqlServerSQLConstants.DEFAULT_INT_FORMAT : SqlServerSQLConstants.DEFAULT_FLOAT_FORMAT, originField);
-                String agg = String.format(SqlServerSQLConstants.AGG_FIELD, y.getSummary(), convert);
+                String summary = y.getSummary();
+                if (StringUtils.equalsIgnoreCase(y.getSummary(), "stddev_pop")) {
+                    summary = "STDEVP";
+                } else if (StringUtils.equalsIgnoreCase(y.getSummary(), "var_pop")) {
+                    summary = "VARP";
+                }
+                String agg = String.format(SqlServerSQLConstants.AGG_FIELD, summary, convert);
                 fieldName = String.format(SqlServerSQLConstants.CONVERT, SqlServerSQLConstants.DEFAULT_FLOAT_FORMAT, agg);
             } else {
                 String convert = String.format(SqlServerSQLConstants.CONVERT, y.getDeType() == 2 ? SqlServerSQLConstants.DEFAULT_INT_FORMAT : SqlServerSQLConstants.DEFAULT_FLOAT_FORMAT, originField);
diff --git a/backend/src/main/java/io/dataease/service/chart/ChartViewService.java b/backend/src/main/java/io/dataease/service/chart/ChartViewService.java
index 867e0e0ccf..e29cf1e558 100644
--- a/backend/src/main/java/io/dataease/service/chart/ChartViewService.java
+++ b/backend/src/main/java/io/dataease/service/chart/ChartViewService.java
@@ -465,7 +465,7 @@ public class ChartViewService {
                 }
             } else if (StringUtils.equalsIgnoreCase(table.getType(), DatasetType.SQL.name())) {
                 String sql = dataTableInfoDTO.isBase64Encryption() ? new String(java.util.Base64.getDecoder().decode(dataTableInfoDTO.getSql())) : dataTableInfoDTO.getSql();
-                sql = handleVariable(sql, requestList, qp, table);
+                sql = handleVariable(sql, requestList, qp, table, ds);
                 if (StringUtils.equalsIgnoreCase("text", view.getType()) || StringUtils.equalsIgnoreCase("gauge", view.getType()) || StringUtils.equalsIgnoreCase("liquid", view.getType())) {
                     datasourceRequest.setQuery(qp.getSQLSummaryAsTmp(sql, yAxis, fieldCustomFilter, rowPermissionsTree, extFilterList, view));
                 } else if (StringUtils.containsIgnoreCase(view.getType(), "stack")) {
@@ -874,7 +874,7 @@ public class ChartViewService {
                 }
             } else if (StringUtils.equalsIgnoreCase(table.getType(), DatasetType.SQL.name())) {
                 String sql = dataTableInfoDTO.isBase64Encryption() ? new String(java.util.Base64.getDecoder().decode(dataTableInfoDTO.getSql())) : dataTableInfoDTO.getSql();
-                sql = handleVariable(sql, requestList, qp, table);
+                sql = handleVariable(sql, requestList, qp, table, ds);
                 if (StringUtils.equalsIgnoreCase("text", view.getType()) || StringUtils.equalsIgnoreCase("gauge", view.getType()) || StringUtils.equalsIgnoreCase("liquid", view.getType())) {
                     datasourceRequest.setQuery(qp.getSQLSummaryAsTmp(sql, yAxis, fieldCustomFilter, rowPermissionsTree, extFilterList, view));
                 } else if (StringUtils.containsIgnoreCase(view.getType(), "stack")) {
@@ -1590,7 +1590,7 @@ public class ChartViewService {
         chartViewMapper.updateByPrimaryKeySelective(chartView);
     }
 
-    private String handleVariable(String sql, ChartExtRequest requestList, QueryProvider qp, DataSetTableDTO table) throws Exception {
+    private String handleVariable(String sql, ChartExtRequest requestList, QueryProvider qp, DataSetTableDTO table, Datasource ds) throws Exception {
 
         List<SqlVariableDetails> sqlVariables = new Gson().fromJson(table.getSqlVariableDetails(), new TypeToken<List<SqlVariableDetails>>() {
         }.getType());
@@ -1614,7 +1614,7 @@ public class ChartViewService {
                 }
             }
         }
-        sql = dataSetTableService.removeVariables(sql);
+        sql = dataSetTableService.removeVariables(sql, ds.getType());
         return sql;
     }
 
diff --git a/backend/src/main/java/io/dataease/service/chart/ViewPluginBaseServiceImpl.java b/backend/src/main/java/io/dataease/service/chart/ViewPluginBaseServiceImpl.java
index 9e5cad8efa..a1160b5f42 100644
--- a/backend/src/main/java/io/dataease/service/chart/ViewPluginBaseServiceImpl.java
+++ b/backend/src/main/java/io/dataease/service/chart/ViewPluginBaseServiceImpl.java
@@ -113,7 +113,7 @@ public class ViewPluginBaseServiceImpl implements ViewPluginBaseService {
                     break;
                 case SQL:
                     String sql = dataTableInfoDTO.isBase64Encryption()? new String(java.util.Base64.getDecoder().decode(dataTableInfoDTO.getSql())): dataTableInfoDTO.getSql();
-                    tableName = dataSetTableService.handleVariableDefaultValue( sql, null);
+                    tableName = dataSetTableService.handleVariableDefaultValue(sql, null, pluginViewSet.getDsType());
 
                     tableName = "(" + sqlFix(tableName) + ")";
                     break;
diff --git a/backend/src/main/java/io/dataease/service/dataset/DataSetTableService.java b/backend/src/main/java/io/dataease/service/dataset/DataSetTableService.java
index 0baac40d72..219e7f8a34 100644
--- a/backend/src/main/java/io/dataease/service/dataset/DataSetTableService.java
+++ b/backend/src/main/java/io/dataease/service/dataset/DataSetTableService.java
@@ -673,7 +673,7 @@ public class DataSetTableService {
                 datasourceRequest.setDatasource(ds);
                 DataTableInfoDTO dataTableInfo = new Gson().fromJson(datasetTable.getInfo(), DataTableInfoDTO.class);
                 String sql = dataTableInfo.isBase64Encryption() ? new String(java.util.Base64.getDecoder().decode(dataTableInfo.getSql())) : dataTableInfo.getSql();
-                sql = handleVariableDefaultValue(sql, null);
+                sql = handleVariableDefaultValue(sql, null, ds.getType());
                 QueryProvider qp = ProviderFactory.getQueryProvider(ds.getType());
                 datasourceRequest.setQuery(
                         qp.createQuerySQLWithPage(sql, fields, page, pageSize, realSize, false, null, rowPermissionsTree));
@@ -1002,14 +1002,14 @@ public class DataSetTableService {
     }
 
 
-    public void checkVariable(final String sql) throws Exception {
-        String tmpSql = removeVariables(sql);
+    public void checkVariable(final String sql, String dsType) throws Exception {
+        String tmpSql = removeVariables(sql, dsType);
         if (tmpSql.contains(SubstitutedParams)) {
             throw new Exception(Translator.get("I18N_SQL_variable_limit"));
         }
     }
 
-    public String handleVariableDefaultValue(String sql, String sqlVariableDetails) {
+    public String handleVariableDefaultValue(String sql, String sqlVariableDetails, String dsType) {
         if (StringUtils.isEmpty(sql)) {
             DataEaseException.throwException(Translator.get("i18n_sql_not_empty"));
         }
@@ -1033,14 +1033,14 @@ public class DataSetTableService {
         }
 
         try {
-            sql = removeVariables(sql);
+            sql = removeVariables(sql, dsType);
         } catch (Exception e) {
             e.printStackTrace();
         }
         return sql;
     }
 
-    public String removeVariables(String sql) throws Exception {
+    public String removeVariables(String sql, String dsType) throws Exception {
         Pattern pattern = Pattern.compile(regex);
         Matcher matcher = pattern.matcher(sql);
         boolean hasVariables = false;
@@ -1060,15 +1060,19 @@ public class DataSetTableService {
         if (fromItem instanceof SubSelect) {
             SelectBody selectBody = ((SubSelect) fromItem).getSelectBody();
             SubSelect subSelect = new SubSelect();
-            Select subSelectTmp = (Select) CCJSqlParserUtil.parse(removeVariables(selectBody.toString()));
+            Select subSelectTmp = (Select) CCJSqlParserUtil.parse(removeVariables(selectBody.toString(), dsType));
             PlainSelect subPlainSelect = ((PlainSelect) subSelectTmp.getSelectBody());
             subSelect.setSelectBody(subPlainSelect);
-            subSelect.setAlias(new Alias(fromItem.getAlias().toString()));
+            if(dsType.equals(DatasourceTypes.oracle.getType())){
+                subSelect.setAlias(new Alias(fromItem.getAlias().toString(), false));
+            }else {
+                subSelect.setAlias(new Alias(fromItem.getAlias().toString()));
+            }
             plainSelect.setFromItem(subSelect);
         }
         Expression expr = plainSelect.getWhere();
         if (expr == null) {
-            return handleWith(plainSelect, select);
+            return handleWith(plainSelect, select, dsType);
         }
         StringBuilder stringBuilder = new StringBuilder();
         BinaryExpression binaryExpression = null;
@@ -1082,17 +1086,17 @@ public class DataSetTableService {
             expr.accept(getExpressionDeParser(stringBuilder));
         }
         plainSelect.setWhere(CCJSqlParserUtil.parseCondExpression(stringBuilder.toString()));
-        return handleWith(plainSelect, select);
+        return handleWith(plainSelect, select, dsType);
     }
 
-    private String handleWith(PlainSelect plainSelect, Select select) throws Exception {
+    private String handleWith(PlainSelect plainSelect, Select select, String dsType) throws Exception {
         StringBuilder builder = new StringBuilder();
         if (CollectionUtils.isNotEmpty(select.getWithItemsList())) {
             builder.append("WITH");
             builder.append(" ");
             for (Iterator<WithItem> iter = select.getWithItemsList().iterator(); iter.hasNext(); ) {
                 WithItem withItem = iter.next();
-                builder.append(withItem.getName() + " AS ( " + removeVariables(withItem.getSubSelect().toString()) + " ) ");
+                builder.append(withItem.getName() + " AS ( " + removeVariables(withItem.getSubSelect().toString(), dsType) + " ) ");
                 if (iter.hasNext()) {
                     builder.append(",");
                 }
@@ -1152,11 +1156,11 @@ public class DataSetTableService {
         datasourceRequest.setDatasource(ds);
         DataTableInfoDTO dataTableInfo = new Gson().fromJson(dataSetTableRequest.getInfo(), DataTableInfoDTO.class);
         String sql = dataTableInfo.isBase64Encryption() ? new String(java.util.Base64.getDecoder().decode(dataTableInfo.getSql())) : dataTableInfo.getSql();
-        sql = handleVariableDefaultValue(sql, dataSetTableRequest.getSqlVariableDetails());
+        sql = handleVariableDefaultValue(sql, dataSetTableRequest.getSqlVariableDetails(), ds.getType());
         if (StringUtils.isEmpty(sql)) {
             DataEaseException.throwException(Translator.get("i18n_sql_not_empty"));
         }
-        checkVariable(sql);
+        checkVariable(sql, ds.getType());
         QueryProvider qp = ProviderFactory.getQueryProvider(ds.getType());
         String sqlAsTable = qp.createSQLPreview(sql, null);
         datasourceRequest.setQuery(sqlAsTable);
@@ -1811,7 +1815,7 @@ public class DataSetTableService {
             QueryProvider qp = ProviderFactory.getQueryProvider(ds.getType());
             DataTableInfoDTO dataTableInfo = new Gson().fromJson(datasetTable.getInfo(), DataTableInfoDTO.class);
             String sql = dataTableInfo.isBase64Encryption() ? new String(java.util.Base64.getDecoder().decode(dataTableInfo.getSql())) : dataTableInfo.getSql();
-            sql = handleVariableDefaultValue(sql, null);
+            sql = handleVariableDefaultValue(sql, null, ds.getType());
             String sqlAsTable = qp.createSQLPreview(sql, null);
             datasourceRequest.setQuery(sqlAsTable);
             fields = datasourceProvider.fetchResultField(datasourceRequest);
diff --git a/backend/src/main/java/io/dataease/service/dataset/impl/direct/DirectFieldService.java b/backend/src/main/java/io/dataease/service/dataset/impl/direct/DirectFieldService.java
index 8834cce94e..411039126e 100644
--- a/backend/src/main/java/io/dataease/service/dataset/impl/direct/DirectFieldService.java
+++ b/backend/src/main/java/io/dataease/service/dataset/impl/direct/DirectFieldService.java
@@ -148,7 +148,7 @@ public class DirectFieldService implements DataSetFieldService {
                 if(dataTableInfoDTO.isBase64Encryption()){
                     sql = new String(java.util.Base64.getDecoder().decode(sql));
                 }
-                sql = dataSetTableService.removeVariables(sql);
+                sql = dataSetTableService.removeVariables(sql, ds.getType());
                 datasourceRequest.setQuery(qp.createQuerySQLAsTmp(sql, permissionFields, !needSort, customFilter, rowPermissionsTree, deSortFields));
             } else if (StringUtils.equalsIgnoreCase(datasetTable.getType(), DatasetType.CUSTOM.toString())) {
                 DataTableInfoDTO dt = new Gson().fromJson(datasetTable.getInfo(), DataTableInfoDTO.class);
diff --git a/backend/src/main/java/io/dataease/service/datasource/DatasourceService.java b/backend/src/main/java/io/dataease/service/datasource/DatasourceService.java
index 0f9993c2f7..9722ee5a1d 100644
--- a/backend/src/main/java/io/dataease/service/datasource/DatasourceService.java
+++ b/backend/src/main/java/io/dataease/service/datasource/DatasourceService.java
@@ -184,7 +184,7 @@ public class DatasourceService {
 
                     for (int i = 0; i < apiDefinitionList.size(); i++) {
                         String status = null;
-                        if(apiItemStatuses.get(apiDefinitionList.get(i).getName()) != null){
+                        if (apiItemStatuses.get(apiDefinitionList.get(i).getName()) != null) {
                             status = apiItemStatuses.get(apiDefinitionList.get(i).getName()).getAsString();
                         }
                         apiDefinitionList.get(i).setStatus(status);
@@ -304,9 +304,9 @@ public class DatasourceService {
                     return ResultHolder.success(datasourceDTO);
                 }
                 if (success > 0 && success < apiDefinitionList.size()) {
-                    return ResultHolder.error(Translator.get("I18N_DS_INVALID_TABLE") , datasourceDTO);
+                    return ResultHolder.error(Translator.get("I18N_DS_INVALID_TABLE"), datasourceDTO);
                 }
-                return ResultHolder.error(Translator.get("I18N_DS_INVALID") , datasourceDTO);
+                return ResultHolder.error(Translator.get("I18N_DS_INVALID"), datasourceDTO);
             }
             return ResultHolder.success(datasourceDTO);
         } catch (Exception e) {
@@ -530,7 +530,7 @@ public class DatasourceService {
         });
     }
 
-    public void updateDatasourceStatusJob(BasicInfo basicInfo, List<SystemParameter> parameters)  {
+    public void updateDatasourceStatusJob(BasicInfo basicInfo, List<SystemParameter> parameters) {
         String type = "";
         Integer interval = 30;
 
@@ -547,7 +547,7 @@ public class DatasourceService {
                 type = parameter.getParamValue();
             }
         }
-        if(!changeDsCheckTime){
+        if (!changeDsCheckTime) {
             return;
         }
         addJob(type, interval);
@@ -555,7 +555,7 @@ public class DatasourceService {
 
     private void addJob(String type, Integer interval) {
         String cron = "";
-        switch (type){
+        switch (type) {
             case "hour":
                 cron = "0 0 0/hour *  * ? *".replace("hour", interval.toString());
                 break;
@@ -572,12 +572,12 @@ public class DatasourceService {
         globalTask.setStartTime(System.currentTimeMillis());
         try {
             scheduleService.addSchedule(globalTask);
-        }catch (Exception e){
+        } catch (Exception e) {
             e.printStackTrace();
         }
     }
 
-    public void initDsCheckJob(){
+    public void initDsCheckJob() {
         BasicInfo basicInfo = systemParameterService.basicInfo();
         addJob(basicInfo.getDsCheckIntervalType(), Integer.valueOf(basicInfo.getDsCheckInterval()));
     }
diff --git a/frontend/src/components/dataease/DeOutWidget.vue b/frontend/src/components/dataease/DeOutWidget.vue
index b1c3bd26e5..14f1762054 100644
--- a/frontend/src/components/dataease/DeOutWidget.vue
+++ b/frontend/src/components/dataease/DeOutWidget.vue
@@ -1,7 +1,7 @@
 <template>
   <div ref="myContainer" class="my-container">
     <div ref="conditionMain" :style="outsideStyle" class="condition-main">
-      <div v-if="element.options.attrs.title" ref="deTitleContainer" :style="titleStyle" class="condition-title">
+      <div v-if="element.options.attrs.showTitle && element.options.attrs.title" ref="deTitleContainer" :style="titleStyle" class="condition-title">
         <div class="condition-title-absolute">
           <div class="first-title">
             <div class="span-container">
@@ -13,7 +13,7 @@
       <div
         ref="deContentContainer"
         class="condition-content"
-        :class="element.options.attrs.title ? '' : 'condition-content-default'"
+        :class="(element.options.attrs.showTitle && element.options.attrs.title) ? '' : 'condition-content-default'"
       >
         <div class="condition-content-container">
           <div class="first-element">
diff --git a/frontend/src/views/chart/components/component-style/MarginSelector.vue b/frontend/src/views/chart/components/component-style/MarginSelector.vue
index 41ebf2aa2a..d3aa542f23 100644
--- a/frontend/src/views/chart/components/component-style/MarginSelector.vue
+++ b/frontend/src/views/chart/components/component-style/MarginSelector.vue
@@ -11,25 +11,25 @@
         </el-form-item>
         <div v-show="showProperty('marginModel') && marginForm.marginModel !== 'auto'">
           <el-form-item v-show="showProperty('marginTop')" :label="$t('chart.text_pos_top')" class="form-item" prop="marginTop">
-            <el-input v-model="marginForm.marginTop" :placeholder="placeholder" oninput="value=value.replace(/[^\d]/g,'')" @change="changeMarginStyle(marginForm.marginTop, 'marginTop')">
+            <el-input v-model="marginForm.marginTop" :placeholder="placeholder" type="number" class="hide-icon-number" @change="changeMarginStyle(marginForm.marginTop, 'marginTop')">
               <template v-if="unitSuffix" slot="append">{{ unitSuffix }}</template>
             </el-input>
           </el-form-item>
 
           <el-form-item v-show="showProperty('marginBottom')" :label="$t('chart.text_pos_bottom')" class="form-item" prop="marginBottom">
-            <el-input v-model="marginForm.marginBottom" :placeholder="placeholder" oninput="value=value.replace(/[^\d]/g,'')" @change="changeMarginStyle(marginForm.marginBottom, 'marginBottom')">
+            <el-input v-model="marginForm.marginBottom" :placeholder="placeholder" type="number" class="hide-icon-number" @change="changeMarginStyle(marginForm.marginBottom, 'marginBottom')">
               <template v-if="unitSuffix" slot="append">{{ unitSuffix }}</template>
             </el-input>
           </el-form-item>
 
           <el-form-item v-show="showProperty('marginLeft')" :label="$t('chart.text_pos_left')" class="form-item" prop="marginLeft">
-            <el-input v-model="marginForm.marginLeft" :placeholder="placeholder" oninput="value=value.replace(/[^\d]/g,'')" @change="changeMarginStyle(marginForm.marginLeft, 'marginLeft')">
+            <el-input v-model="marginForm.marginLeft" :placeholder="placeholder" type="number" class="hide-icon-number" @change="changeMarginStyle(marginForm.marginLeft, 'marginLeft')">
               <template v-if="unitSuffix" slot="append">{{ unitSuffix }}</template>
             </el-input>
           </el-form-item>
 
           <el-form-item v-show="showProperty('marginRight')" :label="$t('chart.text_pos_right')" class="form-item" prop="marginRight">
-            <el-input v-model="marginForm.marginRight" :placeholder="placeholder" oninput="value=value.replace(/[^\d]/g,'')" @change="changeMarginStyle(marginForm.marginRight, 'marginRight')">
+            <el-input v-model="marginForm.marginRight" :placeholder="placeholder" type="number" class="hide-icon-number" @change="changeMarginStyle(marginForm.marginRight, 'marginRight')">
               <template v-if="unitSuffix" slot="append">{{ unitSuffix }}</template>
             </el-input>
           </el-form-item>
@@ -117,7 +117,11 @@ export default {
         }
         if (customStyle.margin) {
           this.marginForm = customStyle.margin
+        } else {
+          this.marginForm = JSON.parse(JSON.stringify(DEFAULT_MARGIN_STYLE))
         }
+      } else {
+        this.marginForm = JSON.parse(JSON.stringify(DEFAULT_MARGIN_STYLE))
       }
     },
 
@@ -196,4 +200,12 @@ export default {
   cursor: pointer;
   z-index: 1003;
 }
+::v-deep .hide-icon-number input::-webkit-outer-spin-button,
+::v-deep .hide-icon-number input::-webkit-inner-spin-button {
+  -webkit-appearance: none !important;
+}
+::v-deep .hide-icon-number input[type="number"] {
+  -moz-appearance: textfield !important;
+}
+
 </style>
diff --git a/frontend/src/views/dataset/add/AddSQL.vue b/frontend/src/views/dataset/add/AddSQL.vue
index 9038868b73..15cc962592 100644
--- a/frontend/src/views/dataset/add/AddSQL.vue
+++ b/frontend/src/views/dataset/add/AddSQL.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="dataset-sql" @mouseup="mouseupDrag" v-loading="loading">
+  <div v-loading="loading" class="dataset-sql" @mouseup="mouseupDrag">
     <div class="sql-editer">
       <el-row>
         <el-col :span="12">
@@ -69,7 +69,7 @@
             <svg-icon icon-class="reference-setting" />
             {{ $t('sql_variable.variable_mgm') }}
           </el-button>
-          <el-divider direction="vertical"></el-divider>
+          <el-divider direction="vertical" />
           <el-button
             class="de-text-btn"
             type="text"
@@ -83,28 +83,27 @@
       </el-row>
     </div>
     <div class="refrence-sql-table">
-      <div class="data-reference" v-if="dataReference">
+      <div v-if="dataReference" class="data-reference">
         <div class="table-database-name">
           <p>
             <span
+              v-if="showTable"
+              style="cursor: pointer"
               @click="
                 showTable = false
                 dataTable = ''
               "
-              style="cursor: pointer"
-              v-if="showTable"
-              ><i class="el-icon-arrow-left"></i> {{ $t('chart.back') }}</span
-            >
+            ><i class="el-icon-arrow-left" /> {{ $t('chart.back') }}</span>
             <span v-else>{{ $t('deDataset.data_reference') }}</span>
             <i
+              style="cursor: pointer"
+              class="el-icon-close"
               @click="
                 showTable = false
                 dataTable = ''
                 dataReference = false
               "
-              style="cursor: pointer"
-              class="el-icon-close"
-            ></i>
+            />
           </p>
           <p v-if="dataSource" style="margin-top: 16px">
             <span>
@@ -119,28 +118,24 @@
             </span>
           </p>
         </div>
-        <span class="no-select-datasource" v-if="!dataSource">{{
+        <span v-if="!dataSource" class="no-select-datasource">{{
           $t('deDataset.to_start_using')
         }}</span>
-        <div
-          v-loading="tableLoading"
-          v-else-if="dataSource && !dataTable"
-          class="item-list"
-        >
+        <div v-else-if="dataSource && !dataTable" v-loading="tableLoading" class="item-list">
           <div
-            @click="typeSwitch(ele)"
-            :key="ele.name"
             v-for="ele in tableData"
+            :key="ele.name"
             class="table-or-field"
+            @click="typeSwitch(ele)"
           >
             {{ ele.name }}
           </div>
         </div>
         <div v-else-if="dataSource && dataTable" class="item-list">
           <div
-            :key="ele.fieldName"
             v-for="ele in fieldData"
-            class="table-or-field field"
+            :key="ele.fieldName"
+            class="table-or-field"
           >
             {{ ele.fieldName }}
           </div>
@@ -168,23 +163,23 @@
               )})`
             }}</span>
 
-            <span @mousedown="mousedownDrag" class="drag"></span>
+            <span class="drag" @mousedown="mousedownDrag" />
           </div>
           <div class="table-sql">
             <el-empty
-              :image-size="125"
               v-if="initFlag"
+              :image-size="125"
               style="margin-top: 80px"
               :image="initImg"
               :description="$t('deDataset.to_run_query')"
-              >{{ $t('deDataset.the_running_results') }}
+            >{{ $t('deDataset.the_running_results') }}
             </el-empty>
             <el-empty
-              :image-size="60"
               v-else-if="errMsg"
+              :image-size="60"
               :image="errImg"
               :description="$t('deDataset.run_failed')"
-            ></el-empty>
+            />
             <ux-grid
               v-else
               ref="plxTable"
@@ -205,24 +200,23 @@
             </ux-grid>
           </div>
           <el-drawer
+            v-closePress
             :title="dialogTitle"
             :visible.sync="showVariableMgm"
             custom-class="user-drawer sql-dataset-drawer"
             size="840px"
-            v-closePress
             direction="rtl"
           >
             <div class="content">
-              <i class="el-icon-info"></i>
-              {{ $t('dataset.sql_variable_limit_1') }}<br />
-              {{ $t('dataset.sql_variable_limit_2') }}<br />
+              <i class="el-icon-info" />
+              {{ $t('dataset.sql_variable_limit_1') }}<br>
+              {{ $t('dataset.sql_variable_limit_2') }}<br>
             </div>
             <el-table :data="variablesTmp">
               <el-table-column
                 prop="variableName"
                 :label="$t('panel.param_name')"
-              >
-              </el-table-column>
+              />
               <el-table-column
                 width="200"
                 :label="$t('deDataset.parameter_type')"
@@ -234,8 +228,7 @@
                     class="select-type"
                     :options="fieldOptions"
                     @change="variableTypeChange(scope.row)"
-                  >
-                  </el-cascader>
+                  />
                   <span class="select-svg-icon">
                     <svg-icon
                       v-if="scope.row.type[0] === 'TEXT'"
@@ -269,21 +262,21 @@
               >
                 <template slot-scope="scope">
                   <el-input
-                    size="small"
                     v-if="scope.row.type[0] === 'TEXT'"
+                    v-model="scope.row.defaultValue"
+                    size="small"
                     type="text"
                     :placeholder="$t('fu.search_bar.please_input')"
-                    v-model="scope.row.defaultValue"
                   />
                   <el-input
-                    size="small"
                     v-if="
                       scope.row.type[0] === 'LONG' ||
-                      scope.row.type[0] === 'DOUBLE'
+                        scope.row.type[0] === 'DOUBLE'
                     "
+                    v-model="scope.row.defaultValue"
+                    size="small"
                     :placeholder="$t('fu.search_bar.please_input')"
                     type="number"
-                    v-model="scope.row.defaultValue"
                   />
 
                   <el-date-picker
@@ -293,8 +286,7 @@
                     size="small"
                     value-format="yyyy"
                     :placeholder="$t('dataset.select_year')"
-                  >
-                  </el-date-picker>
+                  />
 
                   <el-date-picker
                     v-if="scope.row.type[0] === 'DATETIME-YEAR-MONTH'"
@@ -304,8 +296,7 @@
                     :format="scope.row.type[1]"
                     :value-format="scope.row.type[1]"
                     :placeholder="$t('dataset.select_month')"
-                  >
-                  </el-date-picker>
+                  />
 
                   <el-date-picker
                     v-if="scope.row.type[0] === 'DATETIME-YEAR-MONTH-DAY'"
@@ -315,8 +306,7 @@
                     :format="scope.row.type[1]"
                     :value-format="scope.row.type[1]"
                     :placeholder="$t('dataset.select_date')"
-                  >
-                  </el-date-picker>
+                  />
 
                   <el-date-picker
                     v-if="scope.row.type[0] === 'DATETIME'"
@@ -326,8 +316,7 @@
                     :format="scope.row.type[1]"
                     :value-format="scope.row.type[1]"
                     :placeholder="$t('dataset.select_time')"
-                  >
-                  </el-date-picker>
+                  />
                 </template>
               </el-table-column>
             </el-table>
@@ -491,7 +480,7 @@ export default {
   },
   watch: {
     sqlHeight: {
-      handler: function () {
+      handler: function() {
         this.calHeight()
       }
     }
@@ -618,6 +607,8 @@ export default {
         return
       }
       this.parseVariable()
+      this.fields = []
+      this.$refs.plxTable.reloadData([])
       post('/dataset/table/sqlPreview', {
         dataSourceId: this.dataSource,
         type: 'sql',
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index 9ace4394e1..038c39dee8 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -366,12 +366,12 @@
           <svg-icon icon-class="warn-tre" style="width: 20px;height: 20px;float: right" />
         </el-col>
         <el-col :span="21">
-          <span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{$t('panel.panel_cache_use_tips')}}</span>
+          <span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{ $t('panel.panel_cache_use_tips') }}</span>
         </el-col>
       </el-row>
       <div slot="footer" class="dialog-footer">
-        <el-button size="mini" @click="useCache(false)">{{$t('panel.no')}}</el-button>
-        <el-button type="primary" size="mini" @click="useCache(true)">{{$t('panel.yes')}}</el-button>
+        <el-button size="mini" @click="useCache(false)">{{ $t('panel.no') }}</el-button>
+        <el-button type="primary" size="mini" @click="useCache(true)">{{ $t('panel.yes') }}</el-button>
       </div>
     </el-dialog>
 
@@ -387,7 +387,7 @@ import FilterGroup from '../filter'
 import SubjectSetting from '../SubjectSetting'
 import bus from '@/utils/bus'
 import Editor from '@/components/canvas/components/Editor/index'
-import {deepCopy, imgUrlTrans, matrixBaseChange} from '@/components/canvas/utils/utils'
+import { deepCopy, imgUrlTrans, matrixBaseChange } from '@/components/canvas/utils/utils'
 import componentList, {
   BASE_MOBILE_STYLE,
   COMMON_BACKGROUND,
@@ -562,7 +562,7 @@ export default {
         return false
       } else if (this.curComponent && this.showAttrComponent.includes(this.curComponent.type)) {
         // 过滤组件有标题才显示
-        if (this.curComponent.type === 'custom' && !this.curComponent.options.attrs.title) {
+        if (this.curComponent.type === 'custom' && (!this.curComponent.options.attrs.showTitle || !this.curComponent.options.attrs.title)) {
           return false
         } else {
           return true
@@ -721,8 +721,8 @@ export default {
       bus.$on('delete-condition', this.deleteCustomComponent)
       bus.$on('current-component-change', this.asideRefresh)
     },
-    asideRefresh(){
-      if(this.$refs['chartEditRef']){
+    asideRefresh() {
+      if (this.$refs['chartEditRef']) {
         this.$refs['chartEditRef'].resetChartData()
       }
     },
@@ -790,7 +790,7 @@ export default {
         setTimeout(() => {
           if (useCache) {
             _this.$store.commit('recordSnapshot', 'cache')
-            _this.$store.commit('recordChangeTimes' )
+            _this.$store.commit('recordChangeTimes')
           } else {
             _this.$store.commit('refreshSaveStatus')
           }
diff --git a/frontend/src/views/panel/filter/ButtonDialog.vue b/frontend/src/views/panel/filter/ButtonDialog.vue
index cddc9cf64b..8e5d7d2d04 100644
--- a/frontend/src/views/panel/filter/ButtonDialog.vue
+++ b/frontend/src/views/panel/filter/ButtonDialog.vue
@@ -76,7 +76,7 @@ export default {
         if (showName) {
           result = this.$t(showName)
         }
-        if (item.options.attrs.title) {
+        if (item.options.attrs.showTitle && item.options.attrs.title) {
           result += '【' + item.options.attrs.title + '】'
         }
 
diff --git a/frontend/src/views/panel/filter/filterMain/FilterControl.vue b/frontend/src/views/panel/filter/filterMain/FilterControl.vue
index 5a3ddecd48..2d6d8ecd2e 100644
--- a/frontend/src/views/panel/filter/filterMain/FilterControl.vue
+++ b/frontend/src/views/panel/filter/filterMain/FilterControl.vue
@@ -50,8 +50,13 @@
           </el-checkbox>
           <el-popover v-model="titlePopovervisible" placement="bottom-end" :disabled="!attrs.showTitle" width="200">
             <div style="width: 100%;overflow-y: auto;overflow-x: hidden;word-break: break-all;position: relative;">
-              <el-input v-model="attrs.title" :placeholder="$t('panel.input_title')" type="textarea" maxlength="15"
-                        show-word-limit/>
+              <el-input
+                v-model="attrs.title"
+                :placeholder="$t('panel.input_title')"
+                type="textarea"
+                maxlength="15"
+                show-word-limit
+              />
             </div>
 
             <i
@@ -75,7 +80,7 @@
                   class="de-checkbox"
                 >
                   <div class="span-div">
-                    <svg-icon :icon-class="item.type" class="chart-icon"/>
+                    <svg-icon :icon-class="item.type" class="chart-icon" />
                     <span v-if="item.name && item.name.length <= 7" style="margin-left: 6px">{{ item.name }}</span>
                     <el-tooltip v-else class="item" effect="dark" :content="item.name" placement="left">
                       <span style="margin-left: 6px">{{ item.name }}</span>
@@ -107,8 +112,10 @@
                   class="de-checkbox"
                 >
                   <div class="span-div">
-                    <span v-if="item.alias && item.alias.length <= 7"
-                          style="margin-left: 6px">{{ item.alias }}</span>
+                    <span
+                      v-if="item.alias && item.alias.length <= 7"
+                      style="margin-left: 6px"
+                    >{{ item.alias }}</span>
                     <el-tooltip v-else class="item" effect="dark" :content="item.alias" placement="left">
                       <span style="margin-left: 6px">{{ item.alias }}</span>
                     </el-tooltip>
@@ -164,9 +171,9 @@ export default {
       parametersVisible: false,
       timePopovervisible: false,
       accuracyOptions: [
-        {id: 'HH', name: 'HH'},
-        {id: 'HH:mm', name: 'HH:mm'},
-        {id: 'HH:mm:ss', name: 'HH:mm:ss'}
+        { id: 'HH', name: 'HH' },
+        { id: 'HH:mm', name: 'HH:mm' },
+        { id: 'HH:mm:ss', name: 'HH:mm:ss' }
 
       ]
 
@@ -179,62 +186,45 @@ export default {
     if ('timeYearWidget,timeMonthWidget,timeDateWidget,textSelectWidget,numberSelectWidget'.indexOf(this.widget.name) !== -1) {
       this.showParams = true
     }
-}
-,
-methods: {
-  multipleChange(value)
-  {
-    this.fillAttrs2Filter()
-  }
-,
-  showTimeChange(value)
-  {
-    this.attrs.accuracy = this.accuracyOptions[1].id
-    this.attrs.default.isDynamic = false
-    this.fillAttrs2Filter()
-  }
-,
-  checkedViewsChange(values)
-  {
-    this.fillAttrs2Filter()
-  }
-,
-  enableRangeChange(value)
-  {
-    if (!value) {
-      this.attrs.viewIds = []
-    }
-    this.fillAttrs2Filter()
-  }
-,
-  enableParametersChange(value)
-  {
-    if (!value) {
-      this.attrs.parameters = []
-    }
-    this.fillAttrs2Filter()
-  }
-,
-  showTitleChange(value)
-  {
-    if (!value) {
-      this.attrs.title = ''
-      this.element.style.backgroundColor = ''
-    }
-    this.fillAttrs2Filter()
-  }
-,
-  showVisualChange(value)
-  {
-    this.fillAttrs2Filter()
-  }
-,
+  },
+  methods: {
+    multipleChange(value) {
+      this.fillAttrs2Filter()
+    },
+    showTimeChange(value) {
+      this.attrs.accuracy = this.accuracyOptions[1].id
+      this.attrs.default.isDynamic = false
+      this.fillAttrs2Filter()
+    },
+    checkedViewsChange(values) {
+      this.fillAttrs2Filter()
+    },
+    enableRangeChange(value) {
+      if (!value) {
+        this.attrs.viewIds = []
+      }
+      this.fillAttrs2Filter()
+    },
+    enableParametersChange(value) {
+      if (!value) {
+        this.attrs.parameters = []
+      }
+      this.fillAttrs2Filter()
+    },
+    showTitleChange(value) {
+      if (!value) {
+        this.element.style.backgroundColor = ''
+      }
+      this.fillAttrs2Filter()
+    },
+    showVisualChange(value) {
+      this.fillAttrs2Filter()
+    },
 
-  fillAttrs2Filter()
-  {
+    fillAttrs2Filter() {
+    }
   }
 }
-}
 
 </script>
 
diff --git a/frontend/src/views/system/datasource/DsConfiguration.vue b/frontend/src/views/system/datasource/DsConfiguration.vue
index 7738935aa2..53be774885 100644
--- a/frontend/src/views/system/datasource/DsConfiguration.vue
+++ b/frontend/src/views/system/datasource/DsConfiguration.vue
@@ -16,21 +16,20 @@
             icon="el-icon-plus"
             type="primary"
             @click="addApiItem(undefined)"
-            >{{ $t('commons.add') }}</deBtn
-          >
+          >{{ $t('commons.add') }}</deBtn>
         </div>
         <el-empty
-          :image="noneImg"
           v-if="!form.apiConfiguration.length"
+          :image="noneImg"
           :description="$t('datasource.no_data_table')"
-        ></el-empty>
+        />
         <template v-else>
           <div
             v-for="api in form.apiConfiguration"
             :key="api.id"
-            @click="addApiItem(api)"
             :style="{ cursor: disabled ? 'not-allowed': 'pointer'}"
             class="api-card"
+            @click="addApiItem(api)"
           >
             <el-row>
               <el-col :span="12">
@@ -39,44 +38,41 @@
                   v-if="api.status === 'Error'"
                   class="de-tag"
                   style="color: #646a73; background: rgba(31, 35, 41, 0.1)"
-                  >{{ $t('datasource.invalid') }}</span
-                >
+                >{{ $t('datasource.invalid') }}</span>
                 <span
                   v-if="api.status === 'Success'"
                   class="de-tag"
                   style="color: green; background: rgba(52, 199, 36, 0.2)"
-                  >{{ $t('datasource.valid') }}</span
-                >
+                >{{ $t('datasource.valid') }}</span>
               </el-col>
               <el-col style="text-align: right" :span="12">
                 <svg-icon
-                  @click.stop="copyItem(api)"
                   icon-class="de-copy"
                   class="de-copy-icon"
+                  @click.stop="copyItem(api)"
                 />
 
                 <span @click.stop>
                   <el-popover
+                    :ref="`apiTable${api.name}`"
                     placement="top"
                     width="200"
-                    :ref="`apiTable${api.name}`"
                     popper-class="api-table-delete"
                     trigger="click"
                   >
-                    <i class="el-icon-warning"></i>
+                    <i class="el-icon-warning" />
                     <div class="tips">
                       {{ $t('datasource.delete_this_item') }}
                     </div>
                     <div class="foot">
-                      <deBtn class="small" @click="cancelItem(api)" secondary>{{
+                      <deBtn class="small" secondary @click="cancelItem(api)">{{
                         $t('fu.search_bar.cancel')
                       }}</deBtn>
                       <deBtn
                         class="small"
-                        @click="deleteItem(api)"
                         type="primary"
-                        >{{ $t('fu.search_bar.ok') }}</deBtn
-                      >
+                        @click="deleteItem(api)"
+                      >{{ $t('fu.search_bar.ok') }}</deBtn>
                     </div>
                     <svg-icon
                       slot="reference"
@@ -105,8 +101,8 @@
         prop="configuration.host"
       >
         <el-input
-          :placeholder="$t('datasource._ip_address')"
           v-model="form.configuration.host"
+          :placeholder="$t('datasource._ip_address')"
           autocomplete="off"
         />
       </el-form-item>
@@ -129,8 +125,8 @@
         prop="configuration.dataBase"
       >
         <el-input
-          :placeholder="$t('datasource.please_input_data_base')"
           v-model="form.configuration.dataBase"
+          :placeholder="$t('datasource.please_input_data_base')"
           autocomplete="off"
         />
       </el-form-item>
@@ -140,8 +136,10 @@
         :label="$t('datasource.connection_mode')"
         prop="configuration.connectionType"
       >
-        <el-radio v-model="form.configuration.connectionType" label="sid"
-          >{{ $t('datasource.oracle_sid') }}
+        <el-radio
+          v-model="form.configuration.connectionType"
+          label="sid"
+        >{{ $t('datasource.oracle_sid') }}
         </el-radio>
         <el-radio
           v-model="form.configuration.connectionType"
@@ -190,20 +188,19 @@
         v-if="
           form.type === 'hive' && form.configuration.authMethod === 'kerberos'
         "
-      >
-      </span>
+      />
 
       <el-form-item
         v-if="
           form.type !== 'es' &&
-          form.type !== 'api' &&
-          form.configuration.authMethod !== 'kerberos'
+            form.type !== 'api' &&
+            form.configuration.authMethod !== 'kerberos'
         "
         :label="$t('datasource.user_name')"
       >
         <el-input
-          :placeholder="$t('components.one_user_name')"
           v-model="form.configuration.username"
+          :placeholder="$t('components.one_user_name')"
           autocomplete="off"
         />
       </el-form-item>
@@ -211,14 +208,14 @@
       <el-form-item
         v-if="
           form.type !== 'es' &&
-          form.type !== 'api' &&
-          form.configuration.authMethod !== 'kerberos'
+            form.type !== 'api' &&
+            form.configuration.authMethod !== 'kerberos'
         "
         :label="$t('datasource.password')"
       >
         <dePwd
-          :placeholder="$t('components.input_a_password')"
           v-model="form.configuration.password"
+          :placeholder="$t('components.input_a_password')"
         />
       </el-form-item>
 
@@ -227,8 +224,8 @@
         :label="$t('datasource.user_name')"
       >
         <el-input
-          :placeholder="$t('components.one_user_name')"
           v-model="form.configuration.esUsername"
+          :placeholder="$t('components.one_user_name')"
           autocomplete="off"
         />
       </el-form-item>
@@ -238,8 +235,8 @@
         :label="$t('datasource.password')"
       >
         <dePwd
-          :placeholder="$t('components.input_a_password')"
           v-model="form.configuration.esPassword"
+          :placeholder="$t('components.input_a_password')"
         />
       </el-form-item>
 
@@ -279,7 +276,7 @@
             icon="el-icon-plus"
             size="small"
             @click="getSchema()"
-            >{{ $t('datasource.get_schema') }}
+          >{{ $t('datasource.get_schema') }}
           </el-button>
         </template>
         <el-select
@@ -337,12 +334,11 @@
 
       <span
         v-if="!['es', 'api', 'mongo'].includes(form.type)"
-        @click="showPriority = !showPriority"
         class="de-expand de-mar0"
-        >{{ $t('datasource.priority')
-        }}<i v-if="showPriority" class="el-icon-arrow-up"></i>
-        <i v-else class="el-icon-arrow-down"></i
-      ></span>
+        @click="showPriority = !showPriority"
+      >{{ $t('datasource.priority')
+       }}<i v-if="showPriority" class="el-icon-arrow-up" />
+        <i v-else class="el-icon-arrow-down" /></span>
 
       <template v-if="showPriority">
         <el-row :gutter="24">
@@ -352,8 +348,8 @@
               prop="configuration.initialPoolSize"
             >
               <el-input-number
-                controls-position="right"
                 v-model="form.configuration.initialPoolSize"
+                controls-position="right"
                 autocomplete="off"
                 type="number"
                 :min="0"
@@ -367,8 +363,8 @@
               prop="configuration.minPoolSize"
             >
               <el-input-number
-                controls-position="right"
                 v-model="form.configuration.minPoolSize"
+                controls-position="right"
                 autocomplete="off"
                 type="number"
                 :min="0"
@@ -383,8 +379,8 @@
               prop="configuration.maxPoolSize"
             >
               <el-input-number
-                controls-position="right"
                 v-model="form.configuration.maxPoolSize"
+                controls-position="right"
                 autocomplete="off"
                 type="number"
                 :min="0"
@@ -411,11 +407,11 @@
       </template>
     </el-form>
     <el-drawer
+      v-closePress
       :title="api_table_title"
       :visible.sync="edit_api_item"
       custom-class="api-datasource-drawer"
       size="840px"
-      v-closePress
       :before-close="closeEditItem"
       direction="rtl"
     >
@@ -423,13 +419,13 @@
         <el-step
           v-if="active === 1"
           :title="$t('datasource.api_step_1')"
-        ></el-step>
+        />
         <el-step
           v-else
           icon="el-icon-circle-check"
           :title="$t('datasource.api_step_1')"
-        ></el-step>
-        <el-step :title="$t('datasource.api_step_2')"></el-step>
+        />
+        <el-step :title="$t('datasource.api_step_2')" />
       </el-steps>
 
       <el-row v-show="active === 1">
@@ -450,14 +446,14 @@
 
           <el-form-item :label="$t('datasource.request')" prop="url">
             <el-input
-              :placeholder="$t('datasource.path_all_info')"
               v-model="apiItem.url"
+              :placeholder="$t('datasource.path_all_info')"
               class="input-with-select"
               size="small"
             >
               <el-select
-                v-model="apiItem.method"
                 slot="prepend"
+                v-model="apiItem.method"
                 style="width: 100px"
                 size="small"
               >
@@ -478,6 +474,7 @@
             <!-- HTTP 请求参数 -->
             <el-form-item>
               <api-http-request-form
+                v-if="edit_api_item"
                 :headers="apiItem.request.headers"
                 :request="apiItem.request"
                 :response="responseData"
@@ -500,10 +497,10 @@
           </div>
           <div class="table-container">
             <el-table
+              ref="apiItemTable"
               :data="apiItem.jsonFields"
               style="width: 100%"
               row-key="jsonPath"
-              ref="apiItemTable"
             >
               <el-table-column
                 class-name="checkbox-table"
@@ -514,8 +511,9 @@
               >
                 <template slot-scope="scope">
                   <el-checkbox
-                    v-model="scope.row.checked"
                     :key="scope.row.jsonPath"
+                    v-model="scope.row.checked"
+                    :disabled="scope.row.disabled"
                     @change="handleCheckAllChange(scope.row)"
                   >
                     {{ scope.row.originName }}
@@ -525,10 +523,10 @@
               <el-table-column prop="name" :label="$t('dataset.field_rename')">
                 <template slot-scope="scope">
                   <el-input
+                    v-model="scope.row.name"
                     :disabled="scope.row.children"
                     size="mini"
                     type="text"
-                    v-model="scope.row.name"
                     @change="fieldNameChange(scope.row)"
                   />
                 </template>
@@ -540,8 +538,8 @@
               >
                 <template slot-scope="scope">
                   <el-select
-                    :disabled="scope.row.children"
                     v-model="scope.row.deExtractType"
+                    :disabled="scope.row.children"
                     size="mini"
                     style="display: inline-block; width: 120px"
                     @change="fieldTypeChange(scope.row)"
@@ -566,8 +564,7 @@
                       </span>
                       <span
                         style="float: left; color: #8492a6; font-size: 12px"
-                        >{{ item.label }}</span
-                      >
+                      >{{ item.label }}</span>
                     </el-option>
                   </el-select>
                 </template>
@@ -626,26 +623,26 @@
           $t('commons.cancel')
         }}</el-button>
         <el-button
+          v-show="active === 1"
           class="btn"
           type="primary"
-          @click="next"
           :disabled="disabledNext"
-          v-show="active === 1"
-          >{{ $t('fu.steps.next') }}
+          @click="next"
+        >{{ $t('fu.steps.next') }}
         </el-button>
         <el-button
+          v-show="active === 2"
           class="btn"
           type="primary"
           @click="before"
-          v-show="active === 2"
-          >{{ $t('fu.steps.prev') }}
+        >{{ $t('fu.steps.prev') }}
         </el-button>
         <el-button
+          v-show="active === 2"
           class="btn"
           type="primary"
           @click="saveItem"
-          v-show="active === 2"
-          >{{ $t('commons.save') }}
+        >{{ $t('commons.save') }}
         </el-button>
       </div>
     </el-drawer>
@@ -660,11 +657,11 @@ import dePwd from '@/components/deCustomCm/dePwd.vue'
 import msgCfm from '@/components/msgCfm'
 export default {
   name: 'DsConfiguration',
-  mixins: [msgCfm],
   components: {
     ApiHttpRequestForm,
     dePwd
   },
+  mixins: [msgCfm],
   props: {
     disabled: {
       type: Boolean,
@@ -933,8 +930,8 @@ export default {
       certinKey: false
     }
   },
-  created() {},
   watch: {},
+  created() {},
   methods: {
     getSchema() {
       this.$refs.DsConfig.validate((valid) => {
@@ -1074,7 +1071,7 @@ export default {
         this.apiItem.serialNumber =
           this.form.apiConfiguration.length > 0
             ? this.form.apiConfiguration[this.form.apiConfiguration.length - 1]
-                .serialNumber + 1
+              .serialNumber + 1
             : 0
         this.api_table_title = this.$t('datasource.add_api_table')
       }
@@ -1135,7 +1132,7 @@ export default {
       }
     },
     previewData() {
-      let datas = []
+      const datas = []
       let maxPreviewNum = 0
       for (let j = 0; j < this.apiItem.fields.length; j++) {
         if (
@@ -1491,4 +1488,4 @@ export default {
     }
   }
 }
-</style>
\ No newline at end of file
+</style>