Merge branch 'dev' into pr@dev_dataset_source

2025-02-25 03:52:59 +08:00 · 2022-09-27 18:16:24 +08:00 · 2022-09-27 18:16:24 +08:00 · 5b2af3bba3
commit 5b2af3bba3
parent e5f4656a91 3600b007ea
15 changed files with 244 additions and 235 deletions
--- 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();


--- 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;
    }
--- 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);
--- 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;
    }

--- 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;
--- 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);
+            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);
--- 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);
--- 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">
--- 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>
--- 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-else-if="dataSource && !dataTable" v-loading="tableLoading" class="item-list">
          <div
-          v-loading="tableLoading"
-          v-else-if="dataSource && !dataTable"
-          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') }}
            </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'
                    "
+                    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>
@ -618,6 +607,8 @@ export default {
        return
      }
      this.parseVariable()
+      this.fields = []
+      this.$refs.plxTable.reloadData([])
      post('/dataset/table/sqlPreview', {
        dataSourceId: this.dataSource,
        type: 'sql',
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@ -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
--- 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 + '】'
        }

--- 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
@ -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>
@ -179,59 +186,42 @@ export default {
    if ('timeYearWidget,timeMonthWidget,timeDateWidget,textSelectWidget,numberSelectWidget'.indexOf(this.widget.name) !== -1) {
      this.showParams = true
    }
-}
-,
+  },
  methods: {
-  multipleChange(value)
-  {
+    multipleChange(value) {
      this.fillAttrs2Filter()
-  }
-,
-  showTimeChange(value)
-  {
+    },
+    showTimeChange(value) {
      this.attrs.accuracy = this.accuracyOptions[1].id
      this.attrs.default.isDynamic = false
      this.fillAttrs2Filter()
-  }
-,
-  checkedViewsChange(values)
-  {
+    },
+    checkedViewsChange(values) {
      this.fillAttrs2Filter()
-  }
-,
-  enableRangeChange(value)
-  {
+    },
+    enableRangeChange(value) {
      if (!value) {
        this.attrs.viewIds = []
      }
      this.fillAttrs2Filter()
-  }
-,
-  enableParametersChange(value)
-  {
+    },
+    enableParametersChange(value) {
      if (!value) {
        this.attrs.parameters = []
      }
      this.fillAttrs2Filter()
-  }
-,
-  showTitleChange(value)
-  {
+    },
+    showTitleChange(value) {
      if (!value) {
-      this.attrs.title = ''
        this.element.style.backgroundColor = ''
      }
      this.fillAttrs2Filter()
-  }
-,
-  showVisualChange(value)
-  {
+    },
+    showVisualChange(value) {
      this.fillAttrs2Filter()
-  }
-,
+    },

-  fillAttrs2Filter()
-  {
+    fillAttrs2Filter() {
    }
  }
 }
--- 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,7 +136,9 @@
        :label="$t('datasource.connection_mode')"
        prop="configuration.connectionType"
      >
-        <el-radio v-model="form.configuration.connectionType" label="sid"
+        <el-radio
+          v-model="form.configuration.connectionType"
+          label="sid"
        >{{ $t('datasource.oracle_sid') }}
        </el-radio>
        <el-radio
@ -190,8 +188,7 @@
        v-if="
          form.type === 'hive' && form.configuration.authMethod === 'kerberos'
        "
-      >
-      </span>
+      />

      <el-form-item
        v-if="
@ -202,8 +199,8 @@
        :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>
@ -217,8 +214,8 @@
        :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>

@ -337,12 +334,11 @@

      <span
        v-if="!['es', 'api', 'mongo'].includes(form.type)"
-        @click="showPriority = !showPriority"
        class="de-expand de-mar0"
+        @click="showPriority = !showPriority"
      >{{ $t('datasource.priority')
-        }}<i v-if="showPriority" class="el-icon-arrow-up"></i>
-        <i v-else class="el-icon-arrow-down"></i
-      ></span>
+       }}<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,25 +623,25 @@
          $t('commons.cancel')
        }}</el-button>
        <el-button
+          v-show="active === 1"
          class="btn"
          type="primary"
-          @click="next"
          :disabled="disabledNext"
-          v-show="active === 1"
+          @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') }}
        </el-button>
        <el-button
+          v-show="active === 2"
          class="btn"
          type="primary"
          @click="saveItem"
-          v-show="active === 2"
        >{{ $t('commons.save') }}
        </el-button>
      </div>
@ -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) => {
@ -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 (