sea-chart 2.0.40 → 2.0.43

package/dist/utils/sql/chart-data-sql.js

@@ -33,31 +33,31 @@ class ChartDataSQL {
     };
     this._get_sql_order_by = (sortType, groupName) => {
       if (!sortType) {
-        return "ORDER BY ".concat(groupName);
+        return `ORDER BY ${groupName}`;
       }
       return '';
     };
     this._update_filter_sql = (include_empty, column, method) => {
       const column_name = (column === null || column === void 0 ? void 0 : column.name) || '';
       if (!include_empty) {
-        const sql_column_name = method ? "".concat(method, "(`").concat(column_name, "`)") : "`".concat(column_name, "`");
-        const not_include_empty_sql = "".concat(sql_column_name, " IS NOT NULL");
+        const sql_column_name = method ? `${method}(\`${column_name}\`)` : `\`${column_name}\``;
+        const not_include_empty_sql = `${sql_column_name} IS NOT NULL`;
         if (this.filter_sql) {
           if (this.filter_sql.startsWith('WHERE')) {
             this.filter_sql = this.filter_sql.slice(5);
           }
-          this.filter_sql = "WHERE ".concat(not_include_empty_sql, " AND ").concat(this.filter_sql);
+          this.filter_sql = `WHERE ${not_include_empty_sql} AND ${this.filter_sql}`;
         } else {
-          this.filter_sql = "WHERE ".concat(not_include_empty_sql);
+          this.filter_sql = `WHERE ${not_include_empty_sql}`;
         }
       }
     };
     this._summary_column_2_sql = (summary_method, column) => {
       const column_name = (column === null || column === void 0 ? void 0 : column.name) || '';
-      const valid_column_name = "`".concat(column_name, "`");
-      if (summary_method === 'DISTINCT_VALUES') return "COUNT(DISTINCT ".concat(valid_column_name, ")");
-      if (summary_method === 'ROW_COUNT') return "COUNT(".concat(valid_column_name, ")");
-      return "".concat(_constants.DTABLE_DB_SUMMARY_METHOD[summary_method], "(").concat(valid_column_name, ")");
+      const valid_column_name = `\`${column_name}\``;
+      if (summary_method === 'DISTINCT_VALUES') return `COUNT(DISTINCT ${valid_column_name})`;
+      if (summary_method === 'ROW_COUNT') return `COUNT(${valid_column_name})`;
+      return `${_constants.DTABLE_DB_SUMMARY_METHOD[summary_method]}(${valid_column_name})`;
     };
     this._basic_statistic_2_sql = () => {
       let x_axis_column_key, x_axis_date_granularity, x_axis_geolocation_granularity, x_axis_include_empty_cells, y_axis_summary_type, y_axis_summary_method, y_axis_summary_column_key;
@@ -102,9 +102,9 @@ class ChartDataSQL {
         }
       }
       if (summary_column_name) {
-        return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT ".concat(groupby_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._heat_map_statistic_2_sql = () => {
       const {
@@ -131,7 +131,7 @@ class ChartDataSQL {
         }
         summary_column_name = this._summary_column_2_sql(summary_method.toUpperCase(), summary_column);
       }
-      return "SELECT ".concat(column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(column_name, " LIMIT 0, 5000");
+      return `SELECT ${column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${column_name} LIMIT 0, 5000`;
     };
     this._mirror_map_statistic_2_sql = () => {
       const {
@@ -163,7 +163,7 @@ class ChartDataSQL {
         }
         summary_column_name = this._summary_column_2_sql(summary_method.toUpperCase(), summary_column);
       }
-      return "SELECT ".concat(column_name, ", ").concat(column_groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(column_name, ", ").concat(column_groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${column_name}, ${column_groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${column_name}, ${column_groupby_column_name} LIMIT 0, 5000`;
     };
     this._trend_map_statistic_2_sql = () => {
       const {
@@ -191,7 +191,7 @@ class ChartDataSQL {
         }
         summary_column_name = this._summary_column_2_sql(summary_method.toUpperCase(), summary_column);
       }
-      return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._grouping_statistic_2_sql = () => {
       let x_axis_column_key, x_axis_date_granularity, x_axis_geolocation_granularity, x_axis_include_empty_cells, y_axis_summary_type, y_axis_summary_method, y_axis_summary_column_key;
@@ -236,7 +236,7 @@ class ChartDataSQL {
           'geolocation_granularity': column_groupby_geolocation_granularity
         });
         const summary_column_name = this._summary_column_2_sql('COUNT', groupby_column);
-        return "SELECT ".concat(groupby_column_name, ", ").concat(column_groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, ", ").concat(column_groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${column_groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name}, ${column_groupby_column_name} LIMIT 0, 5000`;
       }
       if (column_groupby_multiple_numeric_column) {
         let column_groupby_numeric_columns = summary_columns.slice(0);
@@ -257,7 +257,7 @@ class ChartDataSQL {
           column_groupby_numeric_column_names.push(summary_column_name);
         }
         const column_groupby_numeric_column_names_string = column_groupby_numeric_column_names.join(', ');
-        return "SELECT ".concat(groupby_column_name, ", ").concat(column_groupby_numeric_column_names_string, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${column_groupby_numeric_column_names_string} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
       const summary_column = this._get_column_by_key(y_axis_summary_column_key);
       if (!summary_column) return this._basic_statistic_2_sql();
@@ -265,13 +265,13 @@ class ChartDataSQL {
       const column_groupby_column = this._get_column_by_key(column_groupby_column_key);
       const summary_column_name = this._summary_column_2_sql(summary_method, summary_column);
       if (!column_groupby_column) {
-        return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
       const column_groupby_column_name = this._chart_column_name_to_sql(column_groupby_column, {
         'date_granularity': column_groupby_date_granularity,
         'geolocation_granularity': column_groupby_geolocation_granularity
       });
-      return "SELECT ".concat(groupby_column_name, ", ").concat(column_groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, ", ").concat(column_groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name}, ${column_groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name}, ${column_groupby_column_name} LIMIT 0, 5000`;
     };
     this._custom_statistic_2_sql = () => {
       const {
@@ -310,7 +310,7 @@ class ChartDataSQL {
             const numeric_column = this._get_column_by_key(item.column_key);
             group_methods.push(this._summary_column_2_sql(_constants.DTABLE_DB_SUMMARY_METHOD[item.summary_method.toUpperCase()], numeric_column));
           });
-          sql = "SELECT ".concat(groupby_column_name, ", ").concat(group_methods.join(','), " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 5000");
+          sql = `SELECT ${groupby_column_name}, ${group_methods.join(',')} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 5000`;
         }
         SQLs.push(sql);
       }
@@ -359,9 +359,9 @@ class ChartDataSQL {
         filter_sql = this.filter_sql.length === 0 ? 'where ' : this.filter_sql + ' AND';
         const formattedXAxisDateRangeEnd = (0, _dayjs.default)(x_axis_date_range_end).add(1, 'days').format('YYYY-MM-DD');
         const formattedXAxisComparedDateRangeEnd = (0, _dayjs.default)(x_axis_compared_date_range_end).add(1, 'days').format('YYYY-MM-DD');
-        filter_sql = filter_sql + " ((".concat(groupby_column.name, " >= '").concat(x_axis_date_range_start, "' AND ").concat(groupby_column.name, " < '").concat(formattedXAxisDateRangeEnd, "') Or (").concat(groupby_column.name, " >= '").concat(x_axis_compared_date_range_start, "' AND ").concat(groupby_column.name, " < '").concat(formattedXAxisComparedDateRangeEnd, "'))");
+        filter_sql = filter_sql + ` ((${groupby_column.name} >= '${x_axis_date_range_start}' AND ${groupby_column.name} < '${formattedXAxisDateRangeEnd}') Or (${groupby_column.name} >= '${x_axis_compared_date_range_start}' AND ${groupby_column.name} < '${formattedXAxisComparedDateRangeEnd}'))`;
       }
-      return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._combination_chart_statistic_2_sql = () => {
       const x_axis_column_key = this.chart['x_axis_column_key'] || '';
@@ -392,13 +392,13 @@ class ChartDataSQL {
         let summary_column_name = '';
         if (right_summary_type === 'COUNT') {
           summary_column_name = this._summary_column_2_sql('COUNT', groupby_column);
-          return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+          return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
         } else {
           const right_summary_column = this._get_column_by_key(y_axis_right_summary_column);
           if (right_summary_column) {
             const right_summary_method = y_axis_right_summary_method.toUpperCase();
             summary_column_name = this._summary_column_2_sql(right_summary_method, right_summary_column);
-            return "SELECT ".concat(groupby_column_name, ", COUNT(").concat(groupby_column_name, "), ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+            return `SELECT ${groupby_column_name}, COUNT(${groupby_column_name}), ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
           }
         }
       }
@@ -438,7 +438,7 @@ class ChartDataSQL {
           }
         }
         const column_groupby_numeric_column_names_string = column_groupby_numeric_column_names.join(', ');
-        return "SELECT ".concat(groupby_column_name, ", ").concat(column_groupby_numeric_column_names_string, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${column_groupby_numeric_column_names_string} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
       const summary_column = this._get_column_by_key(y_axis_left_summary_column);
       const summary_method = y_axis_left_summary_method.toUpperCase();
@@ -455,11 +455,11 @@ class ChartDataSQL {
       }
       if (right_summary_column_name) {
         if (left_summary_column_name === right_summary_column_name) {
-          return "SELECT ".concat(groupby_column_name, ", ").concat(left_summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+          return `SELECT ${groupby_column_name}, ${left_summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
         }
-        return "SELECT ".concat(groupby_column_name, ", ").concat(right_summary_column_name, ", ").concat(left_summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${right_summary_column_name}, ${left_summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT ".concat(groupby_column_name, ", ").concat(left_summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name}, ${left_summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._summary_columns_2_sql = (summary_columns, summary_column_key, groupby_column, summary_method) => {
       const summary_column = this._get_column_by_key(summary_column_key);
@@ -516,11 +516,11 @@ class ChartDataSQL {
       summary_type = summary_type.toUpperCase();
       if (summary_type === 'COUNT') {
         const summary_column_name = this._summary_column_2_sql('COUNT', groupby_column);
-        return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
       if (summary_columns) {
         const summary_column_names_str = this._summary_columns_2_sql(summary_columns, summary_column_key, groupby_column, summary_method);
-        return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_names_str, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${summary_column_names_str} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
       summary_method = summary_method.toUpperCase();
       let new_numeric_column_keys = [summary_column_key];
@@ -533,9 +533,9 @@ class ChartDataSQL {
         }
       });
       if (numeric_column_names.length > 0) {
-        return "SELECT ".concat(groupby_column_name, ", ").concat(numeric_column_names.join(', '), " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${numeric_column_names.join(', ')} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT ".concat(groupby_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._two_dimension_statistic_table_2_sql = () => {
       const groupby_column_key = this.chart['groupby_column_key'] || '';
@@ -584,7 +584,7 @@ class ChartDataSQL {
           summary_column_names_str = this._summary_columns_2_sql(summary_columns, summary_column_key, groupby_column, summary_method);
         }
       }
-      return "SELECT ".concat(groupby_column_name, ", ").concat(column_groupby_column_name, ", ").concat(summary_column_names_str, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, ", ").concat(column_groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name}, ${column_groupby_column_name}, ${summary_column_names_str} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name}, ${column_groupby_column_name} LIMIT 0, 5000`;
     };
     this._pie_chart_statistic_2_sql = () => {
       const groupby_column_key = this.chart['groupby_column_key'] || '';
@@ -620,14 +620,14 @@ class ChartDataSQL {
         }
       }
       if (summary_column_name) {
-        return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT ".concat(groupby_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._basic_number_card_chart_statistic_2_sql = () => {
       const summary_type = this.chart['summary_type'];
       if (summary_type === _constants.CHART_Y_GROUP_TYPE.COUNT) {
-        return "SELECT COUNT(*) FROM ".concat(this.table_name, " ").concat(this.filter_sql, " LIMIT 0, 5000");
+        return `SELECT COUNT(*) FROM ${this.table_name} ${this.filter_sql} LIMIT 0, 5000`;
       }
       const numeric_column_key = this.chart['numeric_column_key'] || '';
       let summary_method = this.chart['summary_method'] || '';
@@ -643,7 +643,7 @@ class ChartDataSQL {
       this._update_filter_sql(true, numeric_column);
       summary_method = summary_method.toUpperCase();
       const summary_column_name = this._summary_column_2_sql(summary_method, numeric_column);
-      return "SELECT ".concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " LIMIT 0, 5000");
+      return `SELECT ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} LIMIT 0, 5000`;
     };
     this._dashboard_chart_statistic_2_sql = () => {
       const target_column_key = this.chart['target_value_column_key'] || '';
@@ -673,7 +673,7 @@ class ChartDataSQL {
       this._update_filter_sql(true, target_column);
       total_summary_method = total_summary_method.toUpperCase();
       const total_summary_column_name = this._summary_column_2_sql(total_summary_method, total_column);
-      return "SELECT ".concat(target_summary_column_name, ", ").concat(total_summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " LIMIT 0, 5000");
+      return `SELECT ${target_summary_column_name}, ${total_summary_column_name} FROM ${this.table_name} ${this.filter_sql} LIMIT 0, 5000`;
     };
     this._completeness_chart_statistic_2_sql = () => {
       const groupby_column_key = this.chart['groupby_column_key'];
@@ -712,9 +712,9 @@ class ChartDataSQL {
           'date_granularity': date_granularity,
           'geolocation_granularity': geolocation_granularity
         });
-        return "SELECT `".concat(groupby_column_name, "`, ").concat(column_groupby_column_name, ", SUM(`").concat(target_column_name, "`), SUM(`").concat(completed_column_name, "`) FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY `").concat(groupby_column_name, "`, ").concat(column_groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT \`${groupby_column_name}\`, ${column_groupby_column_name}, SUM(\`${target_column_name}\`), SUM(\`${completed_column_name}\`) FROM ${this.table_name} ${this.filter_sql} GROUP BY \`${groupby_column_name}\`, ${column_groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT `".concat(groupby_column_name, "`, `").concat(target_column_name, "`, `").concat(completed_column_name, "` FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY `").concat(groupby_column_name, "`, `").concat(target_column_name, "`, `").concat(completed_column_name, "` LIMIT 0, 5000");
+      return `SELECT \`${groupby_column_name}\`, \`${target_column_name}\`, \`${completed_column_name}\` FROM ${this.table_name} ${this.filter_sql} GROUP BY \`${groupby_column_name}\`, \`${target_column_name}\`, \`${completed_column_name}\` LIMIT 0, 5000`;
     };
     this._scatter_statistic_2_sql = () => {
       const x_axis_column_key = this.chart['x_axis_column_key'];
@@ -754,9 +754,9 @@ class ChartDataSQL {
           'date_granularity': date_granularity,
           'geolocation_granularity': geolocation_granularity
         });
-        return "SELECT `".concat(xAxisColumnName, "`, `").concat(yAxisColumnName, "`, ").concat(column_groupby_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY `").concat(xAxisColumnName, "`, `").concat(yAxisColumnName, "`, ").concat(column_groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT \`${xAxisColumnName}\`, \`${yAxisColumnName}\`, ${column_groupby_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY \`${xAxisColumnName}\`, \`${yAxisColumnName}\`, ${column_groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT `".concat(xAxisColumnName, "`, `").concat(yAxisColumnName, "` FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY `").concat(xAxisColumnName, "`, `").concat(yAxisColumnName, "` LIMIT 0, 5000");
+      return `SELECT \`${xAxisColumnName}\`, \`${yAxisColumnName}\` FROM ${this.table_name} ${this.filter_sql} GROUP BY \`${xAxisColumnName}\`, \`${yAxisColumnName}\` LIMIT 0, 5000`;
     };
     this._map_statistic_2_sql = () => {
       const {
@@ -792,9 +792,9 @@ class ChartDataSQL {
         }
       }
       if (summary_column_name) {
-        return "SELECT ".concat(groupby_column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+        return `SELECT ${groupby_column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
       }
-      return "SELECT ".concat(groupby_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(groupby_column_name, " LIMIT 0, 5000");
+      return `SELECT ${groupby_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${groupby_column_name} LIMIT 0, 5000`;
     };
     this._world_map_basic_statistic_2_sql = () => {
       const {
@@ -822,7 +822,7 @@ class ChartDataSQL {
         }
         summary_column_name = this._summary_column_2_sql(summary_method.toUpperCase(), summary_column);
       }
-      return "SELECT ".concat(column_name, ", ").concat(summary_column_name, " FROM ").concat(this.table_name, " ").concat(this.filter_sql, " GROUP BY ").concat(column_name, " LIMIT 0, 5000");
+      return `SELECT ${column_name}, ${summary_column_name} FROM ${this.table_name} ${this.filter_sql} GROUP BY ${column_name} LIMIT 0, 5000`;
     };
     this.to_sql = () => {
       if (this.error) {
@@ -979,7 +979,7 @@ class ChartDataSQL {
         type
       } = column || {};
       if (type === _dtableUtils.CellType.SINGLE_SELECT || type === _dtableUtils.CellType.MULTIPLE_SELECT) {
-        return "'".concat(name, "'");
+        return `'${name}'`;
       }
       if (type === _dtableUtils.CellType.NUMBER) {
         const newName = Number(name);
@@ -992,7 +992,7 @@ class ChartDataSQL {
       if (typeof newName === 'number') {
         return newName;
       }
-      return "'".concat(newName, "'");
+      return `'${newName}'`;
     };
     this.get_statistic_record_sql = (statItem, statisticRecord, _ref2) => {
       let {
@@ -1032,36 +1032,36 @@ class ChartDataSQL {
       }
       let sqlString;
       if (type === _constants.CHART_TYPE.TABLE) {
-        let pivotGroupName = "".concat(isGroup ? "".concat(columnGroupName, "=").concat(sqlGroupName) : '');
+        let pivotGroupName = `${isGroup ? `${columnGroupName}=${sqlGroupName}` : ''}`;
         if (isColumn) {
           if (this.filter_sql && pivotGroupName) {
-            sqlString = "select * from ".concat(this.table_name, " ").concat(this.filter_sql, " and ").concat(pivotGroupName, " limit 5000");
+            sqlString = `select * from ${this.table_name} ${this.filter_sql} and ${pivotGroupName} limit 5000`;
           } else if (groupName && !this.filter_sql) {
-            sqlString = "select * from ".concat(this.table_name, " where ").concat(pivotGroupName, " limit 5000");
+            sqlString = `select * from ${this.table_name} where ${pivotGroupName} limit 5000`;
           } else {
-            sqlString = "select * from ".concat(this.table_name, " ").concat(this.filter_sql, " limit 5000");
+            sqlString = `select * from ${this.table_name} ${this.filter_sql} limit 5000`;
           }
           return sqlString;
         }
         if (isRow) {
           if (groupName && this.filter_sql) {
-            sqlString = "select * from ".concat(this.table_name, " ").concat(this.filter_sql, " and ").concat(groupName, "=").concat(sqlName, " limit 5000");
+            sqlString = `select * from ${this.table_name} ${this.filter_sql} and ${groupName}=${sqlName} limit 5000`;
           } else if (groupName && !this.filter_sql) {
-            sqlString = "select * from ".concat(this.table_name, " where ").concat(groupName, "=").concat(sqlName, " limit 5000");
+            sqlString = `select * from ${this.table_name} where ${groupName}=${sqlName} limit 5000`;
           } else {
-            sqlString = "select * from ".concat(this.table_name, " ").concat(this.filter_sql, " limit 5000");
+            sqlString = `select * from ${this.table_name} ${this.filter_sql} limit 5000`;
           }
           return sqlString;
         }
-        sqlString = "select * from ".concat(this.table_name, " limit 5000");
+        sqlString = `select * from ${this.table_name} limit 5000`;
         return sqlString;
       }
       if (groupName && this.filter_sql) {
-        sqlString = "select * from ".concat(this.table_name, " ").concat(this.filter_sql, " and ").concat(groupName, "=").concat(sqlName, " ").concat(isGroup ? "and ".concat(columnGroupName, "=").concat(sqlGroupName) : '', " limit 5000");
+        sqlString = `select * from ${this.table_name} ${this.filter_sql} and ${groupName}=${sqlName} ${isGroup ? `and ${columnGroupName}=${sqlGroupName}` : ''} limit 5000`;
       } else if (groupName && !this.filter_sql) {
-        sqlString = "select * from ".concat(this.table_name, " where ").concat(groupName, "=").concat(sqlName, " ").concat(isGroup ? "and ".concat(columnGroupName, "=").concat(sqlGroupName) : '', " limit 5000");
+        sqlString = `select * from ${this.table_name} where ${groupName}=${sqlName} ${isGroup ? `and ${columnGroupName}=${sqlGroupName}` : ''} limit 5000`;
       } else {
-        sqlString = "select * from ".concat(this.table_name, " ").concat(this.filter_sql, " limit 5000");
+        sqlString = `select * from ${this.table_name} ${this.filter_sql} limit 5000`;
       }
       return sqlString;
     };
@@ -1071,7 +1071,7 @@ class ChartDataSQL {
     this.chart = (chart === null || chart === void 0 ? void 0 : chart.config) || {};
     this.username = username;
     const table_name = (table === null || table === void 0 ? void 0 : table.name) || '';
-    this.table_name = "`".concat(table_name, "`");
+    this.table_name = `\`${table_name}\``;
     this.userId = userId;
     this.userDepartmentIdsMap = userDepartmentIdsMap;
     this.chart_type = (chart === null || chart === void 0 ? void 0 : (_chart$config = chart.config) === null || _chart$config === void 0 ? void 0 : _chart$config.type) || '';

package/dist/utils/sql/column-2-sql-column.js

@@ -21,7 +21,7 @@ const column2SqlColumn = function (column) {
     name,
     key
   } = column;
-  const validColumnName = "`".concat(name, "`");
+  const validColumnName = `\`${name}\``;
   const startOfWeek = (0, _index.getFirstDayOfWeekForGroupby)('app').toLowerCase();
   switch (true) {
     case (0, _columnUtils.isDateColumn)(column):
@@ -29,48 +29,48 @@ const column2SqlColumn = function (column) {
       {
         const validDateGranularity = dateGranularity && dateGranularity.toUpperCase();
         if (['DAY', 'DAYS_7', 'DAYS_30'].includes(validDateGranularity)) {
-          const sqlColumnName = "ISODATE(".concat(validColumnName, ")");
+          const sqlColumnName = `ISODATE(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validDateGranularity === 'WEEK') {
-          const sqlColumnName = "ISODATE(STARTOFWEEK(".concat(validColumnName, ", \"").concat(startOfWeek, "\"))");
+          const sqlColumnName = `ISODATE(STARTOFWEEK(${validColumnName}, "${startOfWeek}"))`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validDateGranularity === 'MONTH') {
-          const sqlColumnName = "ISOMONTH(".concat(validColumnName, ")");
+          const sqlColumnName = `ISOMONTH(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validDateGranularity === 'QUARTER') {
-          const sqlColumnName = "CONCATENATE(year(".concat(validColumnName, "), \"-Q\", quarter(").concat(validColumnName, "))");
+          const sqlColumnName = `CONCATENATE(year(${validColumnName}), "-Q", quarter(${validColumnName}))`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validDateGranularity === 'YEAR') {
-          const sqlColumnName = "YEAR(".concat(validColumnName, ")");
+          const sqlColumnName = `YEAR(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validDateGranularity === 'MAX' || validDateGranularity === 'MIN') {
-          const sqlColumnName = "".concat(validDateGranularity, "(").concat(validColumnName, ")");
+          const sqlColumnName = `${validDateGranularity}(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
-        const sqlColumnName = "ISOMONTH(".concat(validColumnName, ")");
+        const sqlColumnName = `ISOMONTH(${validColumnName})`;
         return {
           name: sqlColumnName,
           key: sqlColumnName
@@ -80,21 +80,21 @@ const column2SqlColumn = function (column) {
       {
         const validGeolocationGranularity = geolocationGranularity && geolocationGranularity.toUpperCase();
         if (validGeolocationGranularity === 'PROVINCE') {
-          const sqlColumnName = "PROVINCE(".concat(validColumnName, ")");
+          const sqlColumnName = `PROVINCE(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validGeolocationGranularity === 'CITY') {
-          const sqlColumnName = "CITY(".concat(validColumnName, ")");
+          const sqlColumnName = `CITY(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
           };
         }
         if (validGeolocationGranularity === 'DISTRICT') {
-          const sqlColumnName = "DISTRICT(".concat(validColumnName, ")");
+          const sqlColumnName = `DISTRICT(${validColumnName})`;
           return {
             name: sqlColumnName,
             key: sqlColumnName
@@ -120,13 +120,13 @@ const summaryMethodColumn2SqlColumn = function (summaryMethod) {
   const columnName = column.name || '';
   if (summaryMethod === _constants.DTABLE_DB_SUMMARY_METHOD.DISTINCT_VALUES) {
     return {
-      name: "".concat(_constants.DTABLE_DB_SUMMARY_METHOD.COUNT, "(DISTINCT ").concat(columnName, ")"),
-      key: "".concat(_constants.DTABLE_DB_SUMMARY_METHOD.COUNT, "(DISTINCT ").concat(columnName, ")")
+      name: `${_constants.DTABLE_DB_SUMMARY_METHOD.COUNT}(DISTINCT ${columnName})`,
+      key: `${_constants.DTABLE_DB_SUMMARY_METHOD.COUNT}(DISTINCT ${columnName})`
     };
   }
   return {
-    name: "".concat(_constants.DTABLE_DB_SUMMARY_METHOD[summaryMethod], "(`").concat(columnName, "`)"),
-    key: "".concat(_constants.DTABLE_DB_SUMMARY_METHOD[summaryMethod], "(").concat(columnName, ")")
+    name: `${_constants.DTABLE_DB_SUMMARY_METHOD[summaryMethod]}(\`${columnName}\`)`,
+    key: `${_constants.DTABLE_DB_SUMMARY_METHOD[summaryMethod]}(${columnName})`
   };
 };
 exports.summaryMethodColumn2SqlColumn = summaryMethodColumn2SqlColumn;
@@ -958,7 +958,7 @@ const getDatabaseGroupName = (statItem, selectedTable) => {
           time_column_key
         } = statItem;
         selectedColumn = (0, _dtableUtils.getTableColumnByKey)(selectedTable, time_column_key);
-        groupName = "ISODATE(".concat(selectedColumn.name, ")");
+        groupName = `ISODATE(${selectedColumn.name})`;
         break;
       }
     case _constants.CHART_TYPE.SCATTER:
@@ -1007,7 +1007,7 @@ const getDatabaseGroupName = (statItem, selectedTable) => {
         } = statItem;
         selectedColumn = (0, _dtableUtils.getTableColumnByKey)(selectedTable, x_axis_column_key);
         if (!selectedColumn) return [];
-        groupName = "`".concat(selectedColumn.name, "`");
+        groupName = `\`${selectedColumn.name}\``;
         if ([_dtableUtils.CellType.CTIME, _dtableUtils.CellType.MTIME, _dtableUtils.CellType.DATE].includes(selectedColumn.type)) {
           const {
             name
@@ -1047,7 +1047,7 @@ const getDatabaseGroupName = (statItem, selectedTable) => {
           groupby_column_key
         } = statItem;
         selectedColumn = (0, _dtableUtils.getTableColumnByKey)(selectedTable, groupby_column_key);
-        groupName = "`".concat(selectedColumn.name, "`");
+        groupName = `\`${selectedColumn.name}\``;
         break;
       }
     case _constants.CHART_TYPE.DASHBOARD:

package/dist/view/index.js

@@ -308,13 +308,13 @@ class View extends _react.default.PureComponent {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: validClassName
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('sea-chart-formatter-container', "sea-chart-".concat(chart === null || chart === void 0 ? void 0 : (_chart$config3 = chart.config) === null || _chart$config3 === void 0 ? void 0 : _chart$config3.type, "-formatter-container"), {
+      className: (0, _classnames.default)('sea-chart-formatter-container', `sea-chart-${chart === null || chart === void 0 ? void 0 : (_chart$config3 = chart.config) === null || _chart$config3 === void 0 ? void 0 : _chart$config3.type}-formatter-container`, {
         'big_screen_plugin': isBigScreenPlugin
       })
     }, !hideTitle && /*#__PURE__*/_react.default.createElement(_title.default, {
       chart: chart
     }), /*#__PURE__*/_react.default.createElement("div", {
-      id: "sea-chart-cavans-container-".concat(chart.id),
+      id: `sea-chart-cavans-container-${chart.id}`,
       className: (0, _classnames.default)('sea-chart-cavans-container')
     }, /*#__PURE__*/_react.default.createElement(_wrapper.default, {
       chart: chart,

package/dist/view/title/index.js

@@ -19,7 +19,7 @@ const Title = _ref => {
   const getTitleStyle = (0, _react.useCallback)(() => {
     var _chart$style_config, _chart$style_config2;
     let style = {
-      fontSize: "".concat(_constants.DEFAULT_CHART_TITLE_FONT_SIZE, "px"),
+      fontSize: `${_constants.DEFAULT_CHART_TITLE_FONT_SIZE}px`,
       fontWeight: _constants.DEFAULT_CHART_FONT_WEIGHT
     };
     if (!chart || !chart.style_config || !((_chart$style_config = chart.style_config) !== null && _chart$style_config !== void 0 && _chart$style_config.title)) {
@@ -32,7 +32,7 @@ const Title = _ref => {
       horizontal_align
     } = (_chart$style_config2 = chart.style_config) === null || _chart$style_config2 === void 0 ? void 0 : _chart$style_config2.title;
     if ((0, _dtableUtils.isNumber)(font_size)) {
-      style.fontSize = font_size < 0 ? 0 : "".concat(font_size, "px");
+      style.fontSize = font_size < 0 ? 0 : `${font_size}px`;
     }
     if (_constants.CHART_SUPPORT_FONT_WEIGHTS.includes(font_weight)) {
       style.fontWeight = font_weight;

package/dist/view/wrapper/area-group.js

@@ -96,12 +96,12 @@ class AreaGroup extends _chartComponent.default {
       // Y axis
       const niceEnd = d3.nice(0, d3.max(data, d => d.value), 5)[1];
       const y = d3.scaleLinear().domain(y_axis_auto_range ? [0, niceEnd] : [y_axis_min || 0, y_axis_max || niceEnd]).range([chartHeight - insertPadding, insertPadding + marginTop]);
-      this.chart.append('g').attr('class', 'y-axis-wrapper').attr('transform', "translate(".concat(insertPadding, ", 0)")).call(d3.axisLeft(y).tickSizeInner(0).ticks(5).tickFormat(d => _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, d, y_axis_summary_method))).call(g => this.drawYaxis(g, theme));
+      this.chart.append('g').attr('class', 'y-axis-wrapper').attr('transform', `translate(${insertPadding}, 0)`).call(d3.axisLeft(y).tickSizeInner(0).ticks(5).tickFormat(d => _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, d, y_axis_summary_method))).call(g => this.drawYaxis(g, theme));
 
       // X axis
       const xDomain = data.map(item => item.name);
       const x = d3.scaleBand().domain(xDomain).range([insertPadding + this.horizontalOverflowOffset, chartWidth - insertPadding]).paddingInner(0.5).paddingOuter(0.1);
-      this.chart.append('g').attr('class', 'x-axis-wrapper').attr('transform', "translate(0, ".concat(chartHeight - insertPadding, ")")).call(d3.axisBottom(x).tickSizeOuter(0).tickSizeInner(5)).call(g => {
+      this.chart.append('g').attr('class', 'x-axis-wrapper').attr('transform', `translate(0, ${chartHeight - insertPadding})`).call(d3.axisBottom(x).tickSizeOuter(0).tickSizeInner(5)).call(g => {
         this.ticksAddName(g);
         g.selectAll('.domain').attr('stroke', theme.XAxisColor);
         g.selectAll('.tick line').attr('stroke', theme.XAxisColor);
@@ -164,7 +164,7 @@ class AreaGroup extends _chartComponent.default {
                   } = g.node().getBoundingClientRect();
                   const translateX = Number(curCircleEl.getAttribute('cx')) - width / 2;
                   const translateY = Number(curCircleEl.getAttribute('cy')) - 10;
-                  g.attr('transform', "translate(".concat(translateX, ", ").concat(translateY, ")"));
+                  g.attr('transform', `translate(${translateX}, ${translateY})`);
                 });
               }
             }).on('click', (event, data) => {