@gingkoo/pandora-metabase 1.0.14 → 1.0.16

package/lib/cjs/components/dialog/{select-filter → expression}/index.js

@@ -1,6 +1,7 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -10,19 +11,20 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _jsxRuntime = require("react/jsx-runtime");
 require("./index.less");
-var _react = require("react");
+var _react = _interopRequireWildcard(require("react"));
 var _pandoraIcons = require("@gingkoo/pandora-icons");
 var _pandora = require("@gingkoo/pandora");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _locale = require("../../../locale");
 var _enum = require("../../../store/enum");
-var _helper = require("../../../store/helper");
+var _types = require("../../../store/types");
 var _const = require("../const");
 var _selectList = _interopRequireDefault(require("../select-list"));
-var _index2 = require("../index");
+var _selectColumnMultiple = _interopRequireDefault(require("../select-column-multiple"));
 var _icons = require("../../icons");
 var _useProvider = require("../../../hooks/use-provider");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 /**
  * 关联模块 选择表字段
  */
@@ -40,7 +42,7 @@ var typeList = [{
   label: _enum.SQL_COLUMN_TYPE.STRING
 }, {
   key: _enum.SQL_COLUMN_TYPE.FLOAT,
-  label: _enum.SQL_COLUMN_TYPE.FLOAT
+  label: 'NUMBER'
 }, {
   key: _enum.SQL_COLUMN_TYPE.DATE,
   label: _enum.SQL_COLUMN_TYPE.DATE
@@ -52,7 +54,7 @@ var typeList = [{
 //   };
 // });
 var SelectFilterColumn = function SelectFilterColumn(_ref) {
-  var _curColumn$table;
+  var _value$lhs;
   var _ref$data = _ref.data,
     data = _ref$data === void 0 ? [] : _ref$data,
     value = _ref.value,
@@ -68,67 +70,95 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     curColumn = _useState2[0],
     setCurColumn = _useState2[1];
-  var _useState3 = (0, _react.useState)(value.condition),
+  var _useState3 = (0, _react.useState)(value.condition || ''),
     _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
     condition = _useState4[0],
     setCondition = _useState4[1];
-  var _useState5 = (0, _react.useState)(value.valType || 'string'),
+  var _useState5 = (0, _react.useState)(value.rhs || []),
     _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
-    valType = _useState6[0],
-    setValType = _useState6[1];
-  var _useState7 = (0, _react.useState)(value.val),
+    rhsVal = _useState6[0],
+    setRhsVal = _useState6[1];
+  // const [valType, setValType] = useState<'string' | 'constant' | 'field' | ''>(
+  //   value.valType || 'string',
+  // );
+  // const [constantName, setConstantName] = useState<string>(value.constantName || '');
+  var _useState7 = (0, _react.useState)((value === null || value === void 0 ? void 0 : value.database_type) || _enum.SQL_COLUMN_TYPE.STRING),
     _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
-    curVal = _useState8[0],
-    setVal = _useState8[1];
-  var _useState9 = (0, _react.useState)(value.constantName || ''),
-    _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
-    constantName = _useState10[0],
-    setConstantName = _useState10[1];
-  var _useState11 = (0, _react.useState)(value.database_type || _enum.SQL_COLUMN_TYPE.STRING),
-    _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
-    special_type = _useState12[0],
-    setSpecial_type = _useState12[1];
-  var _useState13 = (0, _react.useState)(value.formula || {}),
-    _useState14 = (0, _slicedToArray2["default"])(_useState13, 2),
-    formula = _useState14[0],
-    setFormula = _useState14[1];
+    special_type = _useState8[0],
+    setSpecial_type = _useState8[1];
+  var _useState9 = (0, _react.useState)(value.formula || {}),
+    _useState0 = (0, _slicedToArray2["default"])(_useState9, 2),
+    formula = _useState0[0],
+    setFormula = _useState0[1];
   var store = (0, _useProvider.useStore)();
-  var _useState15 = (0, _react.useState)(false),
-    _useState16 = (0, _slicedToArray2["default"])(_useState15, 2),
-    popupVisible = _useState16[0],
-    setPopupVisible = _useState16[1];
-  var table2Selected = Boolean((_curColumn$table = curColumn.table2) === null || _curColumn$table === void 0 ? void 0 : _curColumn$table.name);
+  var _useState1 = (0, _react.useState)(false),
+    _useState10 = (0, _slicedToArray2["default"])(_useState1, 2),
+    popupVisible = _useState10[0],
+    setPopupVisible = _useState10[1];
+  var _useState11 = (0, _react.useState)((value === null || value === void 0 || (_value$lhs = value.lhs) === null || _value$lhs === void 0 ? void 0 : _value$lhs.length) > 0 || false),
+    _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
+    isNext = _useState12[0],
+    setIsNext = _useState12[1];
+  var table2Selected = Boolean(rhsVal && (rhsVal === null || rhsVal === void 0 ? void 0 : rhsVal.length) > 0);
   var disabled = (0, _react.useMemo)(function () {
-    var _curColumn$table2;
     if (!condition) return true;
     if (~['无需结果'].indexOf(condition)) {
       return false;
     }
-    if ((_curColumn$table2 = curColumn.table2) !== null && _curColumn$table2 !== void 0 && _curColumn$table2.id && ~['等于', '不等于', '早于', '晚于'].indexOf(condition)) {
-      return false;
-    }
     if (~['为空', '不为空', '是空的', '不是空的'].indexOf(condition)) {
       return false;
-    } else if (~['前', '下一个', '介于之间'].indexOf(condition)) {
-      if (curVal[0] && curVal[1]) {
-        return false;
-      }
-    } else if (curVal.length && curVal.join(',')) {
-      return false;
     }
+    var isOk = rhsVal.every(function (v) {
+      if (v.type === _types.AtomsTypeEnum.INPUT_STRING || v.type === _types.AtomsTypeEnum.CONSTANT) {
+        return v.val;
+      }
+      if (v.type === _types.AtomsTypeEnum.INPUT_STRING_LIST) {
+        return v.val.every(function (vv) {
+          return vv;
+        });
+      }
+      if (v.type === _types.AtomsTypeEnum.FIELD) {
+        return v.fieldName;
+      }
+    });
+    return !isOk;
+    // console.log('🚀 ~ disabled ~ a:', a);
+    // if ((rhsVal[0] as AtomsString).val && ~['等于', '不等于', '早于', '晚于'].indexOf(condition)) {
+    //   return false;
+    // }
+    // if (~['为空', '不为空', '是空的', '不是空的'].indexOf(condition)) {
+    //   return false;
+    // }
+    // else if (~['前', '下一个', '介于之间'].indexOf(condition)) {
+    //   if ((rhsVal[0] as AtomsStringList).val[0] && (rhsVal[0] as AtomsStringList).val[1]) {
+    //     return false;
+    //   }
+    // } else if (rhsVal.length && (rhsVal as AtomsString[]).map((v) => v.val).join(',')) {
+    //   return false;
+    // }
     return true;
-  }, [curVal, condition, curColumn, isCustom]);
+  }, [rhsVal, condition, curColumn]);
   (0, _react.useEffect)(function () {
     didUpdate === null || didUpdate === void 0 || didUpdate();
   }, [condition]);
-  var getQuotesName = function getQuotesName(name) {
+  var getAtomsQuotesName = function getAtomsQuotesName(items) {
+    var names = items.map(function (v) {
+      if ((v === null || v === void 0 ? void 0 : v.type) === _types.AtomsTypeEnum.FIELD) {
+        return v.fieldName;
+      } else {
+        return v.val;
+      }
+    });
+    return names.join(' || ');
+  };
+  var getQuotesName = function getQuotesName(items) {
     var _formula$params, _formula$params2;
+    var names = getAtomsQuotesName(items);
     switch (formula.type) {
       case 'SUBSTR':
-        // let str = formula.params?.join(',');
-        return "SUBSTR(".concat(name, ",").concat(formula === null || formula === void 0 || (_formula$params = formula.params) === null || _formula$params === void 0 ? void 0 : _formula$params[1], ",").concat(formula === null || formula === void 0 || (_formula$params2 = formula.params) === null || _formula$params2 === void 0 ? void 0 : _formula$params2[2], ")");
+        return "SUBSTR(".concat(names, ",").concat(formula === null || formula === void 0 || (_formula$params = formula.params) === null || _formula$params === void 0 ? void 0 : _formula$params[1], ",").concat(formula === null || formula === void 0 || (_formula$params2 = formula.params) === null || _formula$params2 === void 0 ? void 0 : _formula$params2[2], ")");
       default:
-        return name;
+        return names;
     }
   };
   var getText = function getText(v) {
@@ -158,151 +188,147 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
     }[v];
   };
   function generateQuotes(val, curColumn) {
-    var _val = (0, _slicedToArray2["default"])(val, 2),
-      _val$ = _val[0],
-      firstVal = _val$ === void 0 ? '' : _val$,
-      _val$2 = _val[1],
-      secondVal = _val$2 === void 0 ? '' : _val$2;
+    var _val = val[0];
+    var firstVal = '',
+      secondVal = '';
+    if (_val.type === _types.AtomsTypeEnum.INPUT_STRING) {
+      firstVal = _val.val;
+    }
+    if (_val.type === _types.AtomsTypeEnum.INPUT_STRING_LIST) {
+      firstVal = _val.val[0] || '';
+      secondVal = _val.val[1] || '';
+    }
+    // let [first = { val: '', type: AtomsTypeEnum.INPUT }] = val as AtomsString[];
+    // let firstVal = first.val || '';
+    // let secondVal = second.val || '';
     var quotes = '';
     if (condition === '以...开始') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "startWith ".concat(firstVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "startWith ".concat(firstVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4EE5 ".concat(firstVal, " \u5F00\u59CB");
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4EE5 ".concat(firstVal, " \u5F00\u59CB");
       }
     } else if (condition === '不以...开始') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "not startWith ".concat(firstVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "not startWith ".concat(firstVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4E0D\u4EE5 ".concat(firstVal, " \u5F00\u59CB");
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4E0D\u4EE5 ".concat(firstVal, " \u5F00\u59CB");
       }
     } else if (condition === '以...结束') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "endWith ".concat(firstVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "endWith ".concat(firstVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4EE5 ".concat(firstVal, " \u7ED3\u675F");
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4EE5 ".concat(firstVal, " \u7ED3\u675F");
       }
     } else if (condition === '不以...结束') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "not endWith ".concat(firstVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "not endWith ".concat(firstVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4E0D\u4EE5 ".concat(firstVal, " \u7ED3\u675F");
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4E0D\u4EE5 ".concat(firstVal, " \u7ED3\u675F");
       }
     } else if (condition === '介于之间') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "Between ".concat(firstVal, " and ").concat(secondVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "Between ".concat(firstVal, " and ").concat(secondVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4ECB\u4E8E".concat(firstVal, "\u548C").concat(secondVal, "\u4E4B\u95F4");
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4ECB\u4E8E".concat(firstVal, "\u548C").concat(secondVal, "\u4E4B\u95F4");
       }
     } else if (condition === '前') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "previous ".concat(firstVal).concat(secondVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "previous ".concat(firstVal).concat(secondVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4E0A\u4E00\u4E2A".concat(firstVal).concat(secondVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4E0A\u4E00\u4E2A".concat(firstVal).concat(secondVal);
       }
     } else if (condition === '下一个') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' ' + "next ".concat(firstVal).concat(secondVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "next ".concat(firstVal).concat(secondVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + "\u4E0B\u4E00\u4E2A".concat(firstVal).concat(secondVal);
+        quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4E0B\u4E00\u4E2A".concat(firstVal).concat(secondVal);
       }
     } else if (condition === '在') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' is ' + firstVal;
+        quotes = getQuotesName(curColumn.lhs) + ' is ' + firstVal;
       } else {
-        quotes = getQuotesName(curColumn.name) + ' 是 ' + firstVal;
+        quotes = getQuotesName(curColumn.lhs) + ' 是 ' + firstVal;
       }
     } else if (condition === '是空的') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' is empty';
+        quotes = getQuotesName(curColumn.lhs) + ' is empty';
       } else {
-        quotes = getQuotesName(curColumn.name) + ' 为空';
+        quotes = getQuotesName(curColumn.lhs) + ' 为空';
       }
     } else if (condition === '不是空的') {
       if (_locale.isEn) {
-        quotes = getQuotesName(curColumn.name) + ' not empty';
+        quotes = getQuotesName(curColumn.lhs) + ' not empty';
       } else {
-        quotes = getQuotesName(curColumn.name) + ' 不为空';
+        quotes = getQuotesName(curColumn.lhs) + ' 不为空';
       }
     } else if (condition === '当前') {
       if (firstVal === '天') {
         if (_locale.isEn) {
-          quotes = getQuotesName(curColumn.name) + ' ' + "today";
+          quotes = getQuotesName(curColumn.lhs) + ' ' + "today";
         } else {
-          quotes = getQuotesName(curColumn.name) + ' ' + "\u4ECA\u5929";
+          quotes = getQuotesName(curColumn.lhs) + ' ' + "\u4ECA\u5929";
         }
       } else {
         if (_locale.isEn) {
-          quotes = getQuotesName(curColumn.name) + ' ' + "this is ".concat(firstVal);
+          quotes = getQuotesName(curColumn.lhs) + ' ' + "this is ".concat(firstVal);
         } else {
-          quotes = getQuotesName(curColumn.name) + ' ' + "\u8FD9\u4E2A".concat(firstVal);
+          quotes = getQuotesName(curColumn.lhs) + ' ' + "\u8FD9\u4E2A".concat(firstVal);
         }
       }
     } else if (condition === 'In') {
       var cond = (0, _locale.__)('filter.within');
-      quotes = getQuotesName(curColumn.name) + ' ' + cond + ' ' + "(".concat(firstVal, ")");
+      quotes = getQuotesName(curColumn.lhs) + ' ' + cond + ' ' + "(".concat(firstVal, ")");
     } else if (condition === 'Not In') {
       var _cond = (0, _locale.__)('filter.withnotin');
-      quotes = getQuotesName(curColumn.name) + ' ' + _cond + ' ' + "(".concat(firstVal, ")");
+      quotes = getQuotesName(curColumn.lhs) + ' ' + _cond + ' ' + "(".concat(firstVal, ")");
     } else {
-      var _curColumn$table3;
       var _cond2 = (0, _locale.__)(getText(condition));
-      if ((_curColumn$table3 = curColumn.table2) !== null && _curColumn$table3 !== void 0 && _curColumn$table3.id) {
-        quotes = getQuotesName(curColumn.name) + ' ' + _cond2 + ' ' + curColumn.table2.name;
+      if (rhsVal !== null && rhsVal !== void 0 && rhsVal.length) {
+        quotes = getQuotesName(curColumn.lhs) + ' ' + _cond2 + ' ' + getQuotesName(rhsVal);
       } else {
-        quotes = getQuotesName(curColumn.name) + ' ' + _cond2 + ' ' + firstVal;
+        quotes = getQuotesName(curColumn.lhs) + ' ' + _cond2 + ' ' + firstVal;
       }
     }
     return quotes;
   }
   function addFilter() {
     if (disabled) return void 0;
-    var quotes = generateQuotes(curVal, curColumn);
+    var quotes = generateQuotes(rhsVal, curColumn);
     typeof onChange === 'function' && onChange((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, curColumn), {}, {
       formula: formula,
-      val: curVal,
-      // 选择结果 如果有两个 长度就为2
-      constantName: constantName,
-      //变量字段
-      valType: valType,
-      //是否是选择字段
+      rhs: rhsVal,
       condition: condition,
       // 选择条件
       quotes: quotes,
       // 前端显示用户看的文字
-      database_type: filterCustomType ? special_type : '',
-      // 自定义类型
-      groupSql: curColumn.alias === _helper.SummarizeAlias ? curColumn.sql : ''
+      database_type: filterCustomType ? special_type : '' // 自定义类型
+      // groupSql: curColumn.alias === SummarizeAlias ? curColumn.sql : '',
     }));
   }
   function goPrevPage() {
-    setCurColumn({
-      table: '',
-      // 表名
-      tableId: '',
-      // 表名
-      tableUuid: '',
-      // 表名
-      fieldAlias: '',
-      fieldUuid: '',
-      alias: '',
-      // 表的别名
-      name: '',
-      // 字段名
-      id: '',
-      // 字段名
-      sql: '',
-      datasourceId: '',
-      datasourceName: '',
-      database_type: '' // 字段类型
-    });
-    setCondition('');
-    setFormula({});
-    setVal([]);
+    // setCurColumn({
+    //   lhs: [],
+    //   rhs: [],
+    //   database_type: '', // 字段类型
+    //   condition: '', // 条件 聚合by过来的会有这个
+    //   quotes: '', // 展示用户看的 组装的文字
+    //   type: AtomsTypeEnum.EXPRESSION, // 连接类型
+    // });
+    setIsNext(false);
+    // setCondition('');
+    // setFormula({});
+    // setRhsVal([
+    //   {
+    //     val: '',
+    //     type: AtomsTypeEnum.INPUT,
+    //   },
+    // ]);
   }
   function getData(data) {
-    var database_type = data.database_type;
-    var columnType = filterCustomType ? special_type : database_type.toUpperCase();
+    var _data$database_type = data.database_type,
+      database_type = _data$database_type === void 0 ? '' : _data$database_type;
+    var columnType = filterCustomType ? special_type : database_type === null || database_type === void 0 ? void 0 : database_type.toUpperCase();
     var conditions = STRING_LIST;
     var type = _enum.SQL_GROUP_TYPE.STRING;
     if (_const.NUMBER_GROUP.includes(columnType)) {
@@ -325,9 +351,16 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
     };
   }
   function renderFilter(type, conditionText) {
-    var _curVal = (0, _slicedToArray2["default"])(curVal, 2),
-      firstVal = _curVal[0],
-      secondVal = _curVal[1];
+    var _val = rhsVal[0];
+    var firstVal = '',
+      secondVal = '';
+    if (_val.type === _types.AtomsTypeEnum.INPUT_STRING) {
+      firstVal = _val.val;
+    }
+    if (_val.type === _types.AtomsTypeEnum.INPUT_STRING_LIST) {
+      firstVal = _val.val[0] || '';
+      secondVal = _val.val[1] || '';
+    }
     if (~['为空', '不为空', '是空的', '不是空的'].indexOf(conditionText)) {
       return null;
     } else if (conditionText === '介于之间') {
@@ -342,18 +375,18 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
             placeholder: (0, _locale.__)('filter.enterANumber'),
             value: firstVal || '',
             onInput: function onInput(e) {
-              var newVal = curVal.slice();
-              newVal[0] = e.target.value;
-              setVal(newVal);
+              var newVal = rhsVal.slice();
+              newVal[0].val[0] = e.target.value;
+              setRhsVal(newVal);
             }
           }), (0, _jsxRuntime.jsx)(_pandora.Input, {
             className: 'input',
             placeholder: (0, _locale.__)('filter.enterANumber'),
             value: secondVal || '',
             onInput: function onInput(e) {
-              var newVal = curVal.slice();
-              newVal[1] = e.target.value;
-              setVal(newVal);
+              var newVal = rhsVal.slice();
+              newVal[0].val[1] = e.target.value;
+              setRhsVal(newVal);
             }
           })]
         });
@@ -370,7 +403,10 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
             value: firstVal ? [(0, _dayjs["default"])(firstVal !== null && firstVal !== void 0 ? firstVal : undefined), (0, _dayjs["default"])(secondVal !== null && secondVal !== void 0 ? secondVal : undefined)] : [],
             onChange: function onChange(val) {
               // @ts-ignore
-              val && setVal([(0, _dayjs["default"])(val[0]).format('YYYY-MM-DD HH:mm'), (0, _dayjs["default"])(val[1]).format('YYYY-MM-DD HH:mm')]);
+              val && setRhsVal([{
+                type: _types.AtomsTypeEnum.INPUT_STRING_LIST,
+                val: [(0, _dayjs["default"])(val[0]).format('YYYY-MM-DD HH:mm'), (0, _dayjs["default"])(val[1]).format('YYYY-MM-DD HH:mm')]
+              }]);
             }
           })
         });
@@ -380,7 +416,10 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
         children: (0, _jsxRuntime.jsx)(_pandora.Dropdown, {
           trigger: ['click'],
           onChange: function onChange(key) {
-            setVal([key]);
+            setRhsVal([{
+              type: _types.AtomsTypeEnum.INPUT_STRING,
+              val: key
+            }]);
           },
           droplist: [{
             key: '天',
@@ -412,9 +451,10 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
           placeholder: (0, _locale.__)('filter.enterANumber'),
           value: firstVal || '',
           onInput: function onInput(e) {
-            var newVal = curVal.slice();
-            newVal[0] = e.target.value;
-            setVal(newVal);
+            var newVal = rhsVal.slice();
+            // (newVal as AtomsStringList[])[0].val[0] = e.target.value;
+            newVal[0].val = e.target.value;
+            setRhsVal(newVal);
           }
         }), (0, _jsxRuntime.jsx)(_pandora.Dropdown, {
           trigger: ['click'],
@@ -438,9 +478,10 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
             label: (0, _locale.__)('filter.year')
           }],
           onChange: function onChange(key) {
-            var newVal = curVal.slice();
-            newVal[1] = key;
-            setVal(newVal);
+            var newVal = rhsVal.slice();
+            newVal[1].val = key;
+            // (newVal as AtomsStringList[])[0].val[1] = key;
+            setRhsVal(newVal);
           },
           children: (0, _jsxRuntime.jsxs)(_pandora.Button, {
             className: 'operator-btn',
@@ -462,9 +503,19 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
           value: firstVal ? (0, _dayjs["default"])(firstVal) : '',
           onChange: function onChange(val) {
             if (val) {
-              setVal([(0, _dayjs["default"])(val).format('YYYY-MM-DD HH:mm')]);
+              setRhsVal([{
+                type: _types.AtomsTypeEnum.INPUT_STRING,
+                val: (0, _dayjs["default"])(val).format('YYYY-MM-DD HH:mm')
+              }, {
+                type: _types.AtomsTypeEnum.INPUT_STRING,
+                val: (0, _dayjs["default"])(val).format('YYYY-MM-DD HH:mm')
+              }]);
             } else {
-              setVal([]);
+              setRhsVal([{
+                val: '',
+                type: _types.AtomsTypeEnum.INPUT_STRING
+              }]);
+              // setVal([]);
             }
           }
         })
@@ -480,9 +531,15 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
           value: firstVal ? (0, _dayjs["default"])(firstVal) : '',
           onChange: function onChange(val) {
             if (val) {
-              setVal([(0, _dayjs["default"])(val).format('YYYY-MM-DD HH:mm')]);
+              setRhsVal([{
+                type: _types.AtomsTypeEnum.INPUT_STRING,
+                val: (0, _dayjs["default"])(val).format('YYYY-MM-DD HH:mm')
+              }]);
             } else {
-              setVal([]);
+              setRhsVal([{
+                val: '',
+                type: _types.AtomsTypeEnum.INPUT_STRING
+              }]);
             }
           }
         })
@@ -497,7 +554,10 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
           multiple: true,
           value: options,
           onChange: function onChange(val) {
-            setVal([val.join(',')]);
+            setRhsVal([{
+              type: _types.AtomsTypeEnum.INPUT_STRING,
+              val: val.join(',')
+            }]);
           },
           popupVisible: popupVisible,
           onBlur: function onBlur() {
@@ -521,9 +581,9 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
           placeholder: (0, _locale.__)('filter.pleaseEnter'),
           value: firstVal || '',
           onInput: function onInput(e) {
-            var newVal = curVal.slice();
-            newVal[0] = e.target.value;
-            setVal(newVal);
+            var newVal = rhsVal.slice();
+            newVal[0].val = e.target.value;
+            setRhsVal(newVal);
           }
         })
       });
@@ -538,25 +598,22 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
   // 选择变量
   var selectConstant = function selectConstant(e) {
     store.setClosable(false);
+    var node = e.currentTarget;
+    var _type = Number(node.getAttribute('v-type'));
     store.setPopup2({
       visible: true,
       node: e.currentTarget,
       container: container,
       content: (0, _jsxRuntime.jsx)(_selectList["default"], {
-        value: valType,
+        value: _type,
         list: store.constantList || [],
         onChange: function onChange(val) {
           closePopup2();
-          var curObj = store.constantList.filter(function (v) {
-            return v.value === val;
-          })[0];
-          var newVal = curVal.slice();
-          newVal[0] = val;
-          setVal(newVal);
-          setConstantName(curObj.label);
+          // let curObj = store.constantList.filter((v: any) => v.value === val)[0];
+          var newVal = rhsVal.slice();
+          newVal[0].val = val;
+          setRhsVal(newVal);
           store.setClosable(true);
-          // (newMeta[index] as MetaJoin).expressions[_ind][`${position}_type`] = type;
-          // store.setMeta(newMeta, groupIndex);
         }
       })
     });
@@ -568,48 +625,85 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
       node: e.currentTarget,
       container: container,
       content: (0, _jsxRuntime.jsx)(_selectList["default"], {
-        value: valType,
+        value: '',
         list: [{
-          value: 'string',
+          value: _types.AtomsTypeEnum.INPUT_STRING,
           label: (0, _locale.__)('SqlQueryBuilder.input')
         }, {
-          value: 'constant',
+          value: _types.AtomsTypeEnum.CONSTANT,
           label: (0, _locale.__)('customColumn.constant')
         }, {
-          value: 'field',
+          value: _types.AtomsTypeEnum.FIELD,
           label: (0, _locale.__)('SqlQueryBuilder.columns')
         }],
         onChange: function onChange(type) {
           closePopup2();
-          setConstantName('');
-          setValType(type);
-          setVal([]);
-          setCurColumn((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, curColumn), {}, {
-            table2: null
-          }));
+          if (type === _types.AtomsTypeEnum.INPUT_STRING || type === _types.AtomsTypeEnum.CONSTANT) {
+            setRhsVal([{
+              val: '',
+              type: type
+            }]);
+          }
+          if (type === _types.AtomsTypeEnum.FIELD) {
+            setRhsVal([{
+              fieldName: '',
+              // 字段名
+              fieldNameZh: '',
+              // 字段中文名
+              fieldAlias: '',
+              // 别名
+              fieldUuid: '',
+              // uuid
+              fieldId: '',
+              // 字段id
+              // quotes?: string; // 字段展示的 不知道有没有用
+              tableName: '',
+              // 表名
+              tableNameZh: '',
+              tableId: '',
+              // 表名
+              tableAlias: '',
+              // 别名
+              tableUuid: '',
+              // 表唯一标识
+              datasourceName: '',
+              // 数据源名
+              datasourceId: '',
+              // 数据源id
+              type: _types.AtomsTypeEnum.FIELD
+            }]);
+          }
           store.setClosable(true);
-          // (newMeta[index] as MetaJoin).expressions[_ind][`${position}_type`] = type;
-          // store.setMeta(newMeta, groupIndex);
         }
       })
     });
   };
-  var nextPage = !!curColumn.name;
   var selectTable = function selectTable(e) {
     store.setClosable(false);
+    var node = e.currentTarget;
+    var _index = Number(node.getAttribute('v-index'));
     store.setPopup2({
       visible: true,
       node: e.currentTarget,
       container: container,
-      content: (0, _jsxRuntime.jsx)(_index2.SelectJoinColumn, {
+      content: (0, _jsxRuntime.jsx)(_selectColumnMultiple["default"], {
         data: (0, _toConsumableArray2["default"])(data),
-        value: value,
+        multiple: false,
+        value: rhsVal,
         theme: _enum.ColumnsPopupThemeEnum.purple,
         didUpdate: didUpdate,
-        onSelect: function onSelect(record) {
-          setCurColumn((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, curColumn), {}, {
-            table2: record
-          }));
+        showNextBtn: true,
+        nextBtnText: (0, _locale.__)('metabase.nextOk'),
+        onNextStep: function onNextStep() {
+          store.setPopup2({
+            visible: false
+          });
+        },
+        onSelect: function onSelect(fields, quotes) {
+          var newR = (0, _toConsumableArray2["default"])(rhsVal);
+          newR = fields;
+          // (newR[_index] as AtomsField).quotes = quotes;
+          setRhsVal(newR);
           store.setPopup2({
             visible: false
           });
@@ -618,10 +712,10 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
       })
     });
   };
-  if (nextPage) {
-    var _curColumn$table4;
+  if (isNext) {
+    // SQL_GROUP_TYPE
     var _getData = getData(curColumn),
-      type = _getData.type,
+      fieldType = _getData.type,
       conditions = _getData.conditions;
     var menu = conditions.map(function (v) {
       return {
@@ -632,7 +726,13 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
     var changeFormula = function changeFormula(val) {
       var params = [];
       if (val === 'SUBSTR') {
-        params[0] = curColumn.name;
+        var names = [];
+        curColumn.lhs.filter(function (v) {
+          return v.type === _types.AtomsTypeEnum.FIELD;
+        }).map(function (v) {
+          names.push(v.fieldName);
+        });
+        params[0] = names.join(' || ');
       }
       setFormula({
         type: val,
@@ -666,12 +766,13 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
         })
       });
     };
-    var getName = function getName(name) {
+    var getName = function getName(items) {
       var _formula$params3, _formula$params4;
+      var names = getAtomsQuotesName(items);
       switch (formula.type) {
         case 'SUBSTR':
           return (0, _jsxRuntime.jsxs)("div", {
-            children: ["SUBSTR(", name, ",", (0, _jsxRuntime.jsx)(_pandora.InputNumber, {
+            children: ["SUBSTR(", names, ",", (0, _jsxRuntime.jsx)(_pandora.InputNumber, {
               className: 'left-info-formula-input',
               hideControl: true,
               placeholder: '',
@@ -701,7 +802,7 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
             }), ")"]
           });
         default:
-          return name;
+          return names;
       }
     };
     return (0, _jsxRuntime.jsxs)("div", {
@@ -713,7 +814,7 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
           children: [(0, _jsxRuntime.jsxs)("span", {
             className: 'span-name',
             onClick: goPrevPage,
-            children: [(0, _jsxRuntime.jsx)(_icons.LeftArrowIcon, {}), getName(curColumn.name)]
+            children: [(0, _jsxRuntime.jsx)(_icons.LeftArrowIcon, {}), getName(curColumn.lhs)]
           }), leftFormula()]
         }), (0, _jsxRuntime.jsxs)("div", {
           className: 'right-info',
@@ -721,7 +822,12 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
             trigger: ['click'],
             onChange: function onChange(key) {
               setCondition('');
-              setValType('string');
+              setCurColumn((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, curColumn), {}, {
+                rhs: [{
+                  val: '',
+                  type: _types.AtomsTypeEnum.INPUT_STRING
+                }]
+              }));
               setTimeout(function () {
                 setSpecial_type(key);
               }, 0);
@@ -733,15 +839,12 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
                 width: 104,
                 marginRight: 8
               },
-              children: [special_type || (0, _locale.__)('filter.selectType'), (0, _jsxRuntime.jsx)(_pandoraIcons.ChevronODown, {})]
+              children: [(special_type === _enum.SQL_COLUMN_TYPE.FLOAT ? 'NUMBER' : special_type) || (0, _locale.__)('filter.selectType'), (0, _jsxRuntime.jsx)(_pandoraIcons.ChevronODown, {})]
             })
           }), (0, _jsxRuntime.jsx)(_pandora.Dropdown, {
             trigger: ['click'],
             onChange: function onChange(key) {
-              setValType('string');
-              setCurColumn((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, curColumn), {}, {
-                table2: null
-              }));
+              setCurColumn((0, _objectSpread2["default"])({}, curColumn));
               setDefaultVal(key);
             },
             droplist: menu,
@@ -756,21 +859,32 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
         })]
       }), (0, _jsxRuntime.jsxs)("div", {
         className: 'content',
-        children: [(valType === 'field' || !valType) && (0, _jsxRuntime.jsx)("div", {
-          className: (0, _classnames["default"])("Sqb-TableName purple-name", {
-            notSelected: !table2Selected
-          }),
-          onClick: selectTable,
-          children: table2Selected ? "".concat((_curColumn$table4 = curColumn.table2) === null || _curColumn$table4 === void 0 ? void 0 : _curColumn$table4.name) : (0, _locale.__)('SqlQueryBuilder.pickTable')
-        }), valType === 'constant' && (0, _jsxRuntime.jsx)("div", {
-          className: (0, _classnames["default"])("Sqb-TableName purple-name", {
-            notSelected: !curVal[0]
-          }),
-          onClick: selectConstant,
-          children: constantName ? "".concat(constantName) : (0, _locale.__)('SqlQueryBuilder.pickConstant')
-        }), valType === 'string' && (0, _jsxRuntime.jsx)("div", {
-          className: 'content_l',
-          children: renderFilter(type, condition)
+        children: [rhsVal === null || rhsVal === void 0 ? void 0 : rhsVal.map(function (v, i) {
+          if (v.type === _types.AtomsTypeEnum.FIELD) {
+            return (0, _jsxRuntime.jsx)("div", {
+              className: (0, _classnames["default"])("Sqb-TableName purple-name", {
+                notSelected: !v.fieldName
+              }),
+              "v-index": i,
+              onClick: selectTable,
+              children: v.fieldName || (0, _locale.__)('SqlQueryBuilder.pickTable')
+            }, i);
+          }
+          if (v.type === _types.AtomsTypeEnum.CONSTANT) {
+            return (0, _jsxRuntime.jsx)("div", {
+              className: (0, _classnames["default"])("Sqb-TableName purple-name", {
+                notSelected: !v.val
+              }),
+              "v-type": v.type,
+              onClick: selectConstant,
+              children: v.val ? "".concat(v.val) : (0, _locale.__)('SqlQueryBuilder.pickConstant')
+            }, i);
+          }
+          if (v.type === _types.AtomsTypeEnum.INPUT_STRING || v.type === _types.AtomsTypeEnum.INPUT_STRING_LIST) {
+            return (0, _jsxRuntime.jsx)(_react["default"].Fragment, {
+              children: renderFilter(fieldType, condition)
+            }, i);
+          }
         }), ~['等于', '不等于', '早于', '晚于'].indexOf(condition) ? (0, _jsxRuntime.jsx)(_pandora.Tooltip, {
           title: (0, _locale.__)('SqlQueryBuilder.switch'),
           children: (0, _jsxRuntime.jsx)(_pandora.Button, {
@@ -798,29 +912,54 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
   function setDefaultVal(_condition) {
     setCondition(_condition);
     if (~['前', '下一个'].indexOf(_condition)) {
-      setVal(['30', '天']);
+      setRhsVal([{
+        val: ['30', '天'],
+        type: _types.AtomsTypeEnum.INPUT_STRING_LIST
+      }]);
+    } else if (~['介于之间'].indexOf(_condition)) {
+      setRhsVal([{
+        val: ['', ''],
+        type: _types.AtomsTypeEnum.INPUT_STRING_LIST
+      }]);
     } else if (~['当前'].indexOf(_condition)) {
-      setVal(['天']);
+      setRhsVal([{
+        val: '天',
+        type: _types.AtomsTypeEnum.INPUT_STRING
+      }]);
     } else if (~['早于', '晚于', '在'].indexOf(_condition)) {
-      setVal([(0, _dayjs["default"])().format('YYYY-MM-DD HH:mm')]);
+      setRhsVal([{
+        val: (0, _dayjs["default"])().format('YYYY-MM-DD HH:mm'),
+        type: _types.AtomsTypeEnum.INPUT_STRING
+      }]);
     } else {
-      setVal([]);
+      setRhsVal([{
+        val: '',
+        type: _types.AtomsTypeEnum.INPUT_STRING
+      }]);
     }
   }
   return (0, _jsxRuntime.jsx)("div", {
-    children: (0, _jsxRuntime.jsx)(_index2.SelectJoinColumn, {
+    children: (0, _jsxRuntime.jsx)(_selectColumnMultiple["default"], {
       data: data,
-      value: value,
+      value: curColumn === null || curColumn === void 0 ? void 0 : curColumn.lhs,
       theme: _enum.ColumnsPopupThemeEnum.purple,
       didUpdate: didUpdate,
-      onSelect: function onSelect(record) {
-        setCurColumn(record);
+      showNextBtn: true,
+      onNextStep: function onNextStep() {
+        setIsNext(true);
+      },
+      onSelect: function onSelect(fields, quotes) {
+        // const { columns, ...other } = tableInfo;
+        setCurColumn((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, curColumn), {}, {
+          lhs: fields
+        }));
+        // setCurColumn(record);
         /**
          * 这里默认帮用户选好一部分数据
          * 不至于让用户每一个都自己选、
          * 比如说：条件字段 默认我们帮他选好第一个...
          */
-        var _getData2 = getData(record),
+        var _getData2 = getData(curColumn),
           conditions = _getData2.conditions;
         setDefaultVal(conditions[0]);
       }