@gingkoo/pandora-metabase 1.0.27 → 1.0.28

package/lib/es/components/modules/join-data.js

@@ -17,7 +17,8 @@ import { findIndex, getSubColumns } from '../../utils';
 import { TypeEnum, ColumnsPopupThemeEnum, JoinEnum, SQL_COLUMN_TYPE } from '../../store/enum';
 import { AtomsTypeEnum } from '../../store/types';
 import { SummarizeAlias } from '../../store/helper';
-import { getHelper, changeTableAlias, isValidSQLAlias } from '../../utils';
+import { getHelper, changeTableAlias, isValidSQLAlias, isError } from '../../utils';
+import ItemName from './components/item-name';
 import Wrapper from './components/Wrapper';
 import NextDom from './components/meta-icon';
 import Header from './components/header';
@@ -60,7 +61,7 @@ var menuOperator = operators.map(function (v) {
   };
 });
 var JoinData = function JoinData(props) {
-  var _meta$subquery, _meta$subquery2, _meta$subquery3, _meta$table2, _meta$table3, _meta$table5, _meta$table6, _meta$table7, _meta$table8, _meta$expressions, _meta$table9, _meta$table10, _meta$expressions2, _store$showMainColumn, _store$showMainColumn2;
+  var _meta$subquery, _meta$subquery2, _meta$subquery3, _meta$table2, _meta$table3, _meta$table5, _meta$table6, _meta$table7, _meta$table8, _meta$expressions, _meta$table9, _meta$table0, _meta$expressions2, _store$showMainColumn, _store$showMainColumn2;
   var meta = props.meta,
     groupIndex = props.groupIndex;
   var store = useStore();
@@ -71,6 +72,8 @@ var JoinData = function JoinData(props) {
   var table2Selected = Boolean(meta.table2.name);
   var subQuerySelected = Boolean((_meta$subquery = meta.subquery) === null || _meta$subquery === void 0 || (_meta$subquery = _meta$subquery[0]) === null || _meta$subquery === void 0 || (_meta$subquery = _meta$subquery.table) === null || _meta$subquery === void 0 ? void 0 : _meta$subquery.name);
   var columnsSelected = meta.table1.name && meta.table2.name;
+  var _getHelper = getHelper(store.metaList[groupIndex].list, meta),
+    prevTables = _getHelper.prevTables;
   // const ref = useRef(null);
   // useEffect(() => {
   //   let newMetaList = store.metaList[groupIndex].list.slice();
@@ -80,10 +83,10 @@ var JoinData = function JoinData(props) {
   // 获取表格列
   var getTableColumns = function getTableColumns() {
     var data = [];
-    var _getHelper = getHelper(store.metaList[groupIndex].list, meta),
-      ExistAboveGroupBy = _getHelper.ExistAboveGroupBy,
-      prevList = _getHelper.prevList,
-      prevGroupBy = _getHelper.prevGroupBy;
+    var _getHelper2 = getHelper(store.metaList[groupIndex].list, meta),
+      ExistAboveGroupBy = _getHelper2.ExistAboveGroupBy,
+      prevList = _getHelper2.prevList,
+      prevGroupBy = _getHelper2.prevGroupBy;
     // 获取左侧表
     if (ExistAboveGroupBy) {
       var _prevGroupBy$group, _prevGroupBy$by;
@@ -216,10 +219,10 @@ var JoinData = function JoinData(props) {
     var index = findIndex(store.metaList[groupIndex].list, meta);
     var table_type = FlagLocation.TABLE_1;
     var data = [];
-    var _getHelper2 = getHelper(store.metaList[groupIndex].list, meta),
-      ExistAboveGroupBy = _getHelper2.ExistAboveGroupBy,
-      prevList = _getHelper2.prevList,
-      prevGroupBy = _getHelper2.prevGroupBy;
+    var _getHelper3 = getHelper(store.metaList[groupIndex].list, meta),
+      ExistAboveGroupBy = _getHelper3.ExistAboveGroupBy,
+      prevList = _getHelper3.prevList,
+      prevGroupBy = _getHelper3.prevGroupBy;
     if (ExistAboveGroupBy) {
       var _prevGroupBy$group2, _prevGroupBy$by2;
       var _data = {
@@ -328,12 +331,12 @@ var JoinData = function JoinData(props) {
         data: data,
         value: newMeta[index][table_type],
         onChange: function onChange(data) {
-          if (table_type === FlagLocation.TABLE_1) {
-            if (newMeta[index][table_type].datasourceId !== data.datasourceId || newMeta[index][table_type].name !== data.name) {
-              newMeta[index][table_type] = data;
-              initExpressions();
-            }
+          // if (table_type === FlagLocation.TABLE_1) {
+          if (newMeta[index][table_type].datasourceId !== data.datasourceId || newMeta[index][table_type].name !== data.name) {
+            newMeta[index][table_type] = data;
+            initExpressions();
           }
+          // }
           store.setMeta(newMeta, groupIndex);
           store.setPopup({
             visible: false
@@ -378,10 +381,8 @@ var JoinData = function JoinData(props) {
             store.fetchColumns(_table2, data.datasourceId, [], function (columns) {
               newMeta[index].columns = columns;
               // 关联表变了 下面模块全部删除
-              newMeta = newMeta.filter(function (v, i) {
-                return i <= index;
-              });
-              store.setMeta(newMeta, groupIndex);
+              // newMeta = newMeta.filter((v: MetaListType, i: number) => i <= index);
+              // store.setMeta(newMeta, groupIndex);
             });
           }
           store.setPopup({
@@ -393,8 +394,10 @@ var JoinData = function JoinData(props) {
   }
   // 切换表后重置数据
   function initExpressions() {
-    console.log(11);
     var newMeta = store.metaList[groupIndex].list.slice();
+    if (newMeta[index].expressions && newMeta[index].expressions.length > 0) {
+      return;
+    }
     newMeta[index].expressions = [{
       lhs: [{
         fieldName: '',
@@ -481,6 +484,120 @@ var JoinData = function JoinData(props) {
       })
     });
   }
+  function getColumns(_position) {
+    var data = [];
+    var _getHelper4 = getHelper(store.metaList[groupIndex].list, meta),
+      ExistAboveGroupBy = _getHelper4.ExistAboveGroupBy,
+      prevList = _getHelper4.prevList,
+      prevGroupBy = _getHelper4.prevGroupBy;
+    if (_position === ExpressionsEnum.LEFT) {
+      if (ExistAboveGroupBy) {
+        var _prevGroupBy$group3, _prevGroupBy$by3;
+        var _data = {
+          name: prevGroupBy.alias,
+          name_zh: prevGroupBy.alias,
+          id: prevGroupBy.alias,
+          tableUuid: prevGroupBy.tableUuid || uuidv4('table'),
+          alias: prevGroupBy.alias,
+          datasourceId: '',
+          datasourceName: '',
+          columns: []
+        };
+        if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$group3 = prevGroupBy.group) !== null && _prevGroupBy$group3 !== void 0 && _prevGroupBy$group3.length) {
+          _data.columns = _data.columns.concat(prevGroupBy.group.map(function (v) {
+            return _objectSpread(_objectSpread({}, v), {}, {
+              name: v.name || v.quotes,
+              name_zh: v.name_zh || v.quotes,
+              id: v.id || v.fieldId,
+              database_type: (v === null || v === void 0 ? void 0 : v.database_type) || SQL_COLUMN_TYPE.FLOAT,
+              special_type: '',
+              sql: v.sql,
+              select: true
+            });
+          }));
+        }
+        if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$by3 = prevGroupBy.by) !== null && _prevGroupBy$by3 !== void 0 && _prevGroupBy$by3.length) {
+          _data.columns = _data.columns.concat(prevGroupBy.by.map(function (v) {
+            return _objectSpread(_objectSpread({}, v), {}, {
+              name: v.name || v.quotes,
+              name_zh: v.name_zh || v.quotes,
+              id: v.id || v.fieldId,
+              database_type: (v === null || v === void 0 ? void 0 : v.database_type) || SQL_COLUMN_TYPE.FLOAT,
+              special_type: '',
+              sql: v.sql,
+              select: true
+            });
+          }));
+        }
+        data = [_data];
+        var joinData = prevList.filter(function (v) {
+          return v.type === TypeEnum.joinData;
+        }).filter(function (v) {
+          return v && v.table2.name;
+        });
+        if (joinData !== null && joinData !== void 0 && joinData.length) {
+          data = data.concat(joinData.map(function (v) {
+            return {
+              alias: v.table2.alias,
+              name: v.table2.name,
+              name_zh: v.table2.name_zh,
+              id: v.table2.id,
+              tableUuid: v.table2.tableUuid || uuidv4('table'),
+              datasourceId: v.table2.datasourceId,
+              datasourceName: v.table2.datasourceName,
+              columns: v.columns
+            };
+          }));
+        }
+      } else {
+        data = store.metaList[groupIndex].list.slice(0, index).reduce(function (mo, v) {
+          if (v.type === TypeEnum.data) {
+            mo.push({
+              alias: v.table.alias,
+              name: v.table.name,
+              name_zh: v.table.name_zh,
+              id: v.table.id,
+              tableUuid: v.table.tableUuid || uuidv4('table'),
+              columns: v.columns,
+              datasourceId: v.table.datasourceId,
+              datasourceName: v.table.datasourceName
+            });
+          } else if (v.type === TypeEnum.joinData) {
+            mo.push({
+              alias: v.table2.alias,
+              name: v.table2.name,
+              name_zh: v.table2.name_zh,
+              id: v.table2.id,
+              tableUuid: v.table2.tableUuid || uuidv4('table'),
+              columns: v.columns,
+              datasourceId: v.table2.datasourceId,
+              datasourceName: v.table2.datasourceName
+            });
+          }
+          return mo;
+        }, []);
+      }
+      // 过滤为table1选中的表
+      var newMeta = store.metaList[groupIndex].list.slice();
+      if (newMeta[index][FlagLocation.TABLE_1].name) {
+        data = data.filter(function (v) {
+          return newMeta[index][FlagLocation.TABLE_1].tableUuid == v.tableUuid || newMeta[index][FlagLocation.TABLE_1].name === SummarizeAlias && newMeta[index][FlagLocation.TABLE_1].id == v.id;
+        });
+      }
+    } else {
+      data = [{
+        alias: meta.table2.alias,
+        name: meta.table2.name,
+        name_zh: meta.table2.name_zh,
+        id: meta.table2.id,
+        tableUuid: meta.table2.tableUuid || uuidv4('table'),
+        datasourceId: meta.table2.datasourceId,
+        datasourceName: meta.table2.datasourceName,
+        columns: meta.columns
+      }];
+    }
+    return data;
+  }
   function selectMoreJoinColumn(e) {
     var node = e.currentTarget;
     var _position = node.getAttribute('v-position');
@@ -488,13 +605,13 @@ var JoinData = function JoinData(props) {
     var _ind2 = Number(node.getAttribute('v-index2'));
     var index = findIndex(store.metaList[groupIndex].list, meta);
     var data = [];
-    var _getHelper3 = getHelper(store.metaList[groupIndex].list, meta),
-      ExistAboveGroupBy = _getHelper3.ExistAboveGroupBy,
-      prevList = _getHelper3.prevList,
-      prevGroupBy = _getHelper3.prevGroupBy;
+    var _getHelper5 = getHelper(store.metaList[groupIndex].list, meta),
+      ExistAboveGroupBy = _getHelper5.ExistAboveGroupBy,
+      prevList = _getHelper5.prevList,
+      prevGroupBy = _getHelper5.prevGroupBy;
     if (_position === ExpressionsEnum.LEFT) {
       if (ExistAboveGroupBy) {
-        var _prevGroupBy$group3, _prevGroupBy$by3;
+        var _prevGroupBy$group4, _prevGroupBy$by4;
         var _data = {
           name: prevGroupBy.alias,
           name_zh: prevGroupBy.alias,
@@ -505,7 +622,7 @@ var JoinData = function JoinData(props) {
           datasourceName: '',
           columns: []
         };
-        if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$group3 = prevGroupBy.group) !== null && _prevGroupBy$group3 !== void 0 && _prevGroupBy$group3.length) {
+        if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$group4 = prevGroupBy.group) !== null && _prevGroupBy$group4 !== void 0 && _prevGroupBy$group4.length) {
           _data.columns = _data.columns.concat(prevGroupBy.group.map(function (v) {
             return _objectSpread(_objectSpread({}, v), {}, {
               name: v.name || v.quotes,
@@ -518,7 +635,7 @@ var JoinData = function JoinData(props) {
             });
           }));
         }
-        if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$by3 = prevGroupBy.by) !== null && _prevGroupBy$by3 !== void 0 && _prevGroupBy$by3.length) {
+        if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$by4 = prevGroupBy.by) !== null && _prevGroupBy$by4 !== void 0 && _prevGroupBy$by4.length) {
           _data.columns = _data.columns.concat(prevGroupBy.by.map(function (v) {
             return _objectSpread(_objectSpread({}, v), {}, {
               name: v.name || v.quotes,
@@ -583,7 +700,7 @@ var JoinData = function JoinData(props) {
       var newMeta = store.metaList[groupIndex].list.slice();
       if (newMeta[index][FlagLocation.TABLE_1].name) {
         data = data.filter(function (v) {
-          return newMeta[index][FlagLocation.TABLE_1].tableUuid == v.tableUuid || newMeta[index][FlagLocation.TABLE_1].name === SummarizeAlias;
+          return newMeta[index][FlagLocation.TABLE_1].tableUuid == v.tableUuid || newMeta[index][FlagLocation.TABLE_1].name === SummarizeAlias && newMeta[index][FlagLocation.TABLE_1].id == v.id;
         });
       }
     } else {
@@ -784,7 +901,7 @@ var JoinData = function JoinData(props) {
           showSubquery: store._showSubquery,
           toolbar: _toolbar,
           btnText: __('SqlQueryBuilder.confirm'),
-          value: val,
+          value: cloneDeep(val),
           onOk: function onOk(newList) {
             try {
               // 子查询未改变不做操作
@@ -804,9 +921,7 @@ var JoinData = function JoinData(props) {
               newMeta[index].columns = newColumns;
               initExpressions();
               // 关联表变了 下面模块全部删除
-              newMeta = newMeta.filter(function (v, i) {
-                return i <= index;
-              });
+              // newMeta = newMeta.filter((v: MetaListType, i: number) => i <= index);
               store.setMeta(newMeta, groupIndex);
               o.close();
             } catch (e) {
@@ -825,24 +940,19 @@ var JoinData = function JoinData(props) {
     var index = findIndex(store.metaList[groupIndex].list, meta);
     var newMeta = store.metaList[groupIndex].list.slice();
     newMeta[index].isSubquery = !newMeta[index].isSubquery;
-    newMeta[index].table2 = {
-      quotes: '',
-      name: '',
-      // 表名
-      name_zh: '',
-      // 表名
-      tableUuid: '',
-      id: '',
-      // 表名
-      alias: '',
-      // 表别名
-      datasourceName: '',
-      // 数据源名
-      datasourceId: '' // 数据源id
-      // groupSql: '', //如果table1 是结果集 那么这个字段 就有值，放结果集的别名
-    };
-    newMeta[index].expressions = [];
-    newMeta[index].subquery = [];
+    // (newMeta[index] as MetaJoin).table2 = {
+    //   quotes: '',
+    //   name: '', // 表名
+    //   name_zh: '', // 表名
+    //   tableUuid: '',
+    //   id: '', // 表名
+    //   alias: '', // 表别名
+    //   datasourceName: '', // 数据源名
+    //   datasourceId: '', // 数据源id
+    //   // groupSql: '', //如果table1 是结果集 那么这个字段 就有值，放结果集的别名
+    // };
+    // (newMeta[index] as MetaJoin).expressions = [];
+    // (newMeta[index] as MetaJoin).subquery = [];
     store.setMeta(newMeta, groupIndex);
   };
   var onChangeTableAlias = function onChangeTableAlias(val) {
@@ -859,22 +969,22 @@ var JoinData = function JoinData(props) {
       onOk: function () {
         var _onOk = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
           var index, newMeta;
-          return _regeneratorRuntime.wrap(function _callee$(_context) {
+          return _regeneratorRuntime.wrap(function (_context) {
             while (1) switch (_context.prev = _context.next) {
               case 0:
                 if (isValidSQLAlias(alias)) {
-                  _context.next = 3;
+                  _context.next = 1;
                   break;
                 }
                 Toast.warning(__('SqlQueryBuilder.aliasForRules'));
                 return _context.abrupt("return", false);
-              case 3:
+              case 1:
                 index = findIndex(store.metaList[groupIndex].list, meta);
                 newMeta = store.metaList[groupIndex].list.slice();
                 newMeta[index].table2.alias = alias;
                 newMeta = changeTableAlias(newMeta, newMeta[index].table2);
                 store.setMeta(newMeta, groupIndex);
-              case 8:
+              case 2:
               case "end":
                 return _context.stop();
             }
@@ -1011,21 +1121,31 @@ var JoinData = function JoinData(props) {
       return '';
     }
   };
+  var leftTableIsError = function leftTableIsError() {
+    var _prevTables$meta$tabl;
+    if (!meta.table1.datasourceId || !meta.table1.id || meta.table1.datasourceId === SummarizeAlias) {
+      return false;
+    }
+    return !(prevTables !== null && prevTables !== void 0 && (_prevTables$meta$tabl = prevTables[meta.table1.datasourceId]) !== null && _prevTables$meta$tabl !== void 0 && _prevTables$meta$tabl[meta.table1.id]);
+  };
   var renderItem = function renderItem(items, type, i) {
     var _items$;
     if ((items === null || items === void 0 || (_items$ = items[0]) === null || _items$ === void 0 ? void 0 : _items$.type) === AtomsTypeEnum.FIELD) {
       var _items$2, _items$3;
-      return _jsx("div", {
-        className: cx("Sqb-TableName", {
-          notSelected: !((_items$2 = items[0]) !== null && _items$2 !== void 0 && _items$2.fieldName)
-        }),
-        "v-position": type,
-        "v-index": i,
-        "v-index2": index,
-        onClick: selectMoreJoinColumn,
-        children: (_items$3 = items[0]) !== null && _items$3 !== void 0 && _items$3.fieldName ? items.map(function (field) {
-          return field.fieldName;
-        }).join(' || ') : __('SqlQueryBuilder.pickTable')
+      return _jsx(ItemName, {
+        isError: isError(items, getColumns(type)),
+        children: _jsx("div", {
+          className: cx("Sqb-TableName", {
+            notSelected: !((_items$2 = items[0]) !== null && _items$2 !== void 0 && _items$2.fieldName)
+          }),
+          "v-position": type,
+          "v-index": i,
+          "v-index2": index,
+          onClick: selectMoreJoinColumn,
+          children: (_items$3 = items[0]) !== null && _items$3 !== void 0 && _items$3.fieldName ? items.map(function (field) {
+            return field.fieldName;
+          }).join(' || ') : __('SqlQueryBuilder.pickTable')
+        })
       }, type + i);
     } else {
       return items === null || items === void 0 ? void 0 : items.map(function (item, index) {
@@ -1096,12 +1216,15 @@ var JoinData = function JoinData(props) {
         className: cx("Sqb-item--content"),
         children: _jsxs("div", {
           className: cx("Sqb-NotebookCell"),
-          children: [_jsx("div", {
-            className: cx("Sqb-TableName", {
-              notSelected: !table1Selected
-            }),
-            onClick: selectLeftTable,
-            children: getTable1Name() || __('SqlQueryBuilder.pickTable')
+          children: [_jsx(ItemName, {
+            isError: leftTableIsError(),
+            children: _jsx("div", {
+              className: cx("Sqb-TableName", {
+                notSelected: !table1Selected
+              }),
+              onClick: selectLeftTable,
+              children: getTable1Name() || __('SqlQueryBuilder.pickTable')
+            })
           }), _jsx("div", {
             onClick: selectJoin,
             children: meta.joinType === JoinEnum.left ? _jsx(LeftJoinIcon, {
@@ -1304,15 +1427,18 @@ var JoinData = function JoinData(props) {
                 children: [i == 0 && _jsx("span", {
                   className: 'ml-2 mr-4 text-gray-500',
                   children: "on"
-                }), _jsx("div", {
-                  className: cx("Sqb-TableName purple-name", {
-                    notSelected: !v.quotes
-                  }),
-                  onClick: function onClick(e) {
-                    return changeExpression(e, i);
-                  },
-                  children: v.quotes || __('joinData.selectExpression')
-                }, i), _jsx(Tooltip, {
+                }), _jsx(ItemName, {
+                  isError: isError(v, getTableColumns()),
+                  children: _jsx("div", {
+                    className: cx("Sqb-TableName purple-name", {
+                      notSelected: !v.quotes
+                    }),
+                    onClick: function onClick(e) {
+                      return changeExpression(e, i);
+                    },
+                    children: v.quotes || __('joinData.selectExpression')
+                  }, i)
+                }), _jsx(Tooltip, {
                   title: __('SqlQueryBuilder.add'),
                   children: _jsx(Dropdown, {
                     trigger: ['click'],
@@ -1398,7 +1524,7 @@ var JoinData = function JoinData(props) {
                 })]
               }, i);
             }
-          })), ((_meta$table9 = meta.table2) === null || _meta$table9 === void 0 ? void 0 : _meta$table9.name) && ((_meta$table10 = meta.table1) === null || _meta$table10 === void 0 ? void 0 : _meta$table10.name) && (((_meta$expressions2 = meta.expressions) === null || _meta$expressions2 === void 0 ? void 0 : _meta$expressions2.length) || 0) < 1 && _jsx(Tooltip, {
+          })), ((_meta$table9 = meta.table2) === null || _meta$table9 === void 0 ? void 0 : _meta$table9.name) && ((_meta$table0 = meta.table1) === null || _meta$table0 === void 0 ? void 0 : _meta$table0.name) && (((_meta$expressions2 = meta.expressions) === null || _meta$expressions2 === void 0 ? void 0 : _meta$expressions2.length) || 0) < 1 && _jsx(Tooltip, {
             title: __('SqlQueryBuilder.add'),
             children: _jsx(Dropdown, {
               trigger: ['click'],

package/lib/es/components/modules/permission-table.js

@@ -10,17 +10,21 @@ import NextDom from './components/meta-icon';
 import Header from './components/header';
 import { useStore } from '../../hooks/use-provider';
 import { uuidv4 } from '../../utils/helper';
+import ItemName from './components/item-name';
+import { SummarizeAlias } from '../../store/helper';
 var PrevResult = 'Previous results';
 var PermissionTable = function PermissionTable(props) {
   var meta = props.meta,
     groupIndex = props.groupIndex;
   var store = useStore();
   var index = findIndex(store.metaList[groupIndex].list, meta);
+  var _getHelper = getHelper(store.metaList[groupIndex].list, meta),
+    prevTables = _getHelper.prevTables;
   function selectTable(e) {
-    var _getHelper = getHelper(store.metaList[groupIndex].list, meta),
-      ExistAboveGroupBy = _getHelper.ExistAboveGroupBy,
-      prevList = _getHelper.prevList,
-      prevGroupBy = _getHelper.prevGroupBy;
+    var _getHelper2 = getHelper(store.metaList[groupIndex].list, meta),
+      ExistAboveGroupBy = _getHelper2.ExistAboveGroupBy,
+      prevList = _getHelper2.prevList,
+      prevGroupBy = _getHelper2.prevGroupBy;
     var data = [];
     if (ExistAboveGroupBy) {
       var _data = {
@@ -95,6 +99,13 @@ var PermissionTable = function PermissionTable(props) {
     });
   }
   var selected = Boolean(meta.table.name);
+  var tableIsError = function tableIsError() {
+    var _prevTables$meta$tabl;
+    if (!meta.table.datasourceId && !meta.table.id) {
+      return false;
+    }
+    return !(prevTables !== null && prevTables !== void 0 && (_prevTables$meta$tabl = prevTables[meta.table.datasourceId]) !== null && _prevTables$meta$tabl !== void 0 && _prevTables$meta$tabl[meta.table.id]);
+  };
   return _jsx(Wrapper, {
     className: "Sqb-item",
     children: _jsxs("div", {
@@ -109,12 +120,15 @@ var PermissionTable = function PermissionTable(props) {
         className: "Sqb-item--content",
         children: _jsx("div", {
           className: "Sqb-NotebookCell gray-bg",
-          children: _jsx("div", {
-            className: cx("Sqb-TableName", {
-              notSelected: !selected
-            }),
-            onClick: selectTable,
-            children: selected ? "".concat(meta.table.datasourceName ? "".concat(meta.table.datasourceName, ".") : '').concat(meta.table.name === 'source' ? PrevResult : meta.table.name) : __('SqlQueryBuilder.pickPermissionTable')
+          children: _jsx(ItemName, {
+            isError: tableIsError(),
+            children: _jsx("div", {
+              className: cx("Sqb-TableName", {
+                notSelected: !selected
+              }),
+              onClick: selectTable,
+              children: selected ? "".concat(meta.table.datasourceName ? "".concat(meta.table.datasourceName, ".") : '').concat(meta.table.name === SummarizeAlias ? PrevResult : meta.table.name) : __('SqlQueryBuilder.pickPermissionTable')
+            })
           })
         })
       }), _jsx(NextDom, {

package/lib/es/components/modules/sort.js

@@ -3,7 +3,7 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cx from 'classnames';
 import { __ } from '../../locale';
-import { findIndex, getHelper } from '../../utils';
+import { findIndex, getHelper, isError } from '../../utils';
 import { ColumnsPopupThemeEnum, TypeEnum, SortEnum, SQL_COLUMN_TYPE } from '../../store/enum';
 import { AtomsTypeEnum } from '../../store/types';
 import { uuidv4 } from '../../utils/helper';
@@ -13,6 +13,7 @@ import Wrapper from './components/Wrapper';
 import NextDom from './components/meta-icon';
 import Header from './components/header';
 import { useStore } from '../../hooks/use-provider';
+import ItemName from './components/item-name';
 var Sort = function Sort(props) {
   var meta = props.meta,
     groupIndex = props.groupIndex;
@@ -243,20 +244,23 @@ var Sort = function Sort(props) {
         children: _jsxs("div", {
           className: cx("Sqb-NotebookCell gray-bg"),
           children: [sort.map(function (v, i) {
-            return _jsxs("div", {
-              className: "Sqb-TableName gray-name",
-              onClick: function onClick() {
-                return handleSort(i);
-              },
-              children: [v.sort === SortEnum.asc ? _jsx(UpArrowIcon, {}) : _jsx(DownArrowIcon, {}), getName(v.expression), _jsx("span", {
-                style: {
-                  fontSize: 0
+            return _jsx(ItemName, {
+              isError: isError(v.expression, getColumns()),
+              children: _jsxs("div", {
+                className: "Sqb-TableName gray-name",
+                onClick: function onClick() {
+                  return handleSort(i);
                 },
-                onClick: function onClick(e) {
-                  return delSortColumn(e, i);
-                },
-                children: _jsx(CloseIcon, {})
-              })]
+                children: [v.sort === SortEnum.asc ? _jsx(UpArrowIcon, {}) : _jsx(DownArrowIcon, {}), getName(v.expression), _jsx("span", {
+                  style: {
+                    fontSize: 0
+                  },
+                  onClick: function onClick(e) {
+                    return delSortColumn(e, i);
+                  },
+                  children: _jsx(CloseIcon, {})
+                })]
+              }, i)
             }, i);
           }), _jsx("div", {
             className: "Sqb-TableName gray-name",