@gingkoo/pandora-metabase 1.0.14 → 1.0.15

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

@@ -1,28 +1,16 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-var _excluded = ["notExistsToolbar", "toolbar"];
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import cx from 'classnames';
-import Metabase from '../../index';
-import { Modal2 } from '@gingkoo/pandora';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { __ } from '../../locale';
-import isEqual from 'lodash/isEqual';
 import cloneDeep from 'lodash/cloneDeep';
 import { uuidv4 } from '../../utils/helper';
-import { findIndex, getHelper, buildSqlQuery } from '../../utils';
+import { findIndex, getHelper } from '../../utils';
 import { TypeEnum, SQL_COLUMN_TYPE } from '../../store/enum';
-import SelectList from '../dialog/select-list';
-import { Filter_TypeEnum } from '../../store/types';
-import { Select } from '@gingkoo/pandora';
+import FormulaList from '../dialog/formula-list';
 import Wrapper from './components/Wrapper';
-import { AddIcon, CloseIcon } from '../icons';
 import NextDom from './components/meta-icon';
 import Header from './components/header';
-import { SelectFilter } from '../dialog';
-import arrow from './arrow.svg';
+import { customTypes, operatorList } from './enum/filter-enum';
 import { useStore } from '../../hooks/use-provider';
 var Filter = function Filter(props) {
   var meta = props.meta,
@@ -30,13 +18,10 @@ var Filter = function Filter(props) {
   var store = useStore();
   var filter = meta.filter;
   var notExistsColumns = store.preProps.notExistsColumns;
-  var filterCustomType = store.filterCustomType;
+  // const filterCustomType = store.filterCustomType;
   var index = findIndex(store.metaList[groupIndex].list, meta);
-  var notSelected = !meta.filter.length;
-  var _useState = useState(-1),
-    _useState2 = _slicedToArray(_useState, 2),
-    ind = _useState2[0],
-    setInd = _useState2[1];
+  // let notSelected = !meta.filter.length;
+  // const [ind, setInd] = useState(-1);
   function getColumns() {
     var _getHelper = getHelper(store.metaList[groupIndex].list, meta),
       ExistAboveGroupBy = _getHelper.ExistAboveGroupBy,
@@ -48,21 +33,23 @@ var Filter = function Filter(props) {
     if (ExistAboveGroupBy) {
       var _prevGroupBy$group, _prevGroupBy$by;
       var _data = {
-        table: prevGroupBy.alias,
-        tableId: prevGroupBy.alias,
-        tableUuid: prevGroupBy.tableUuid,
         alias: prevGroupBy.alias,
+        name: prevGroupBy.alias,
+        name_zh: prevGroupBy.alias,
+        // tableId: (prevGroupBy as MetaSummarize).alias,
+        id: prevGroupBy.alias,
+        tableUuid: prevGroupBy.tableUuid,
+        // alias: (prevGroupBy as MetaSummarize).alias,
         datasourceId: mainTable.table.datasourceId,
         datasourceName: mainTable.table.datasourceName,
         columns: []
       };
       if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$group = prevGroupBy.group) !== null && _prevGroupBy$group !== void 0 && _prevGroupBy$group.length) {
         _data.columns = _data.columns.concat(prevGroupBy.group.map(function (v) {
-          return _objectSpread(_objectSpread({
-            name_zh: v.quotes
-          }, v), {}, {
-            name: v.quotes,
-            // name_zh: '',
+          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,
             sql: v.sql,
             special_type: '',
@@ -72,11 +59,10 @@ var Filter = function Filter(props) {
       }
       if (prevGroupBy !== null && prevGroupBy !== void 0 && (_prevGroupBy$by = prevGroupBy.by) !== null && _prevGroupBy$by !== void 0 && _prevGroupBy$by.length) {
         _data.columns = _data.columns.concat(prevGroupBy.by.map(function (v) {
-          return _objectSpread(_objectSpread({
-            name_zh: v.quotes
-          }, v), {}, {
-            name: v.quotes,
-            // name_zh: '',
+          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,
             sql: v.sql,
             special_type: '',
@@ -98,8 +84,9 @@ var Filter = function Filter(props) {
         joinData.map(function (v) {
           return {
             alias: v.table2.alias,
-            table: v.table2.name,
-            tableId: v.table2.id,
+            name: v.table2.name,
+            name_zh: v.table2.name_zh,
+            id: v.table2.id,
             tableUuid: v.table2.tableUuid || uuidv4('table'),
             columns: v.columns,
             datasourceId: mainTable.table.datasourceId,
@@ -113,8 +100,11 @@ var Filter = function Filter(props) {
         if (v.type === TypeEnum.data) {
           return {
             alias: v.table.alias,
-            table: v.table.name,
-            tableId: v.table.id,
+            // table: v.table.name,
+            name: v.table.name,
+            name_zh: v.table.name_zh,
+            // tableId: v.table.id,
+            id: v.table.id,
             tableUuid: v.table.tableUuid || uuidv4('table'),
             columns: v.columns,
             datasourceId: mainTable.table.datasourceId,
@@ -123,8 +113,9 @@ var Filter = function Filter(props) {
         } else if (v.type === TypeEnum.joinData) {
           return {
             alias: v.table2.alias,
-            table: v.table2.name,
-            tableId: v.table2.id,
+            name: v.table2.name,
+            name_zh: v.table2.name_zh,
+            id: v.table2.id,
             tableUuid: v.table2.tableUuid || uuidv4('table'),
             columns: v.columns,
             datasourceId: mainTable.table.datasourceId,
@@ -136,331 +127,21 @@ var Filter = function Filter(props) {
           };
         }
       }).filter(function (v) {
-        return v.table;
+        return v.name;
       });
     }
     return data;
   }
-  function handleUpdate(e, i) {
-    var newMeta = store.metaList[groupIndex].list.slice();
-    var val = filter[i];
-    if (val.type === Filter_TypeEnum.NOT_EXISTS || val.type === Filter_TypeEnum.EXISTS) {
-      showNotExists(i, '', val.type);
-      return;
-    }
-    var data = [].concat(_toConsumableArray(getColumns()), _toConsumableArray(cloneDeep(notExistsColumns || [])));
-    store.setPopup({
-      visible: true,
-      node: e.currentTarget,
-      content: _jsx(SelectFilter, {
-        filterCustomType: filterCustomType,
-        data: data,
-        value: filter[i],
-        onChange: function onChange(data) {
-          newMeta[index].filter.splice(i, 1, data);
-          store.setMeta(newMeta, groupIndex);
-          closePopup();
-        }
-      })
-    });
-  }
-  function handleAdd(e) {
-    var node = e.currentTarget;
-    var newMeta = store.metaList[groupIndex].list.slice();
-    var data = [].concat(_toConsumableArray(getColumns()), _toConsumableArray(cloneDeep(notExistsColumns || [])));
-    var _index = Number(node.getAttribute('v-index'));
-    var _type = node.getAttribute('v-type');
-    var value = {
-      table: '',
-      // 表名
-      tableId: '',
-      // 表名
-      fieldUuid: '',
-      //  字段唯一id
-      fieldAlias: '',
-      //字段别名
-      tableUuid: '',
-      alias: '',
-      // 表的别名
-      name: '',
-      // 字段名
-      id: '',
-      // 字段名
-      database_type: '',
-      // 字段类型
-      condition: '',
-      // 选择条件
-      val: [],
-      // 选择结果 如果有两个 长度就为2
-      quotes: '',
-      // 前端显示用户看的文字
-      datasourceId: '',
-      datasourceName: '',
-      type: Filter_TypeEnum.EXPRESSION // 过滤类型
-    };
-    store.setPopup({
-      visible: true,
-      node: e.currentTarget,
-      content: _jsx(SelectFilter, {
-        filterCustomType: filterCustomType,
-        data: data,
-        value: value,
-        onChange: function onChange(val) {
-          if (_type) {
-            if (_type === 'before') {
-              newMeta[index].filter.splice(_index, 0, val);
-            } else {
-              console.log('🚀 ~ ', newMeta[index].filter);
-              newMeta[index].filter.splice(_index + 1, 0, val);
-            }
-          } else {
-            newMeta[index].filter.push(val);
-          }
-          store.setMeta(newMeta, groupIndex);
-          closePopup();
-        }
-      })
-    });
-  }
-  function handleDel(e, itemId) {
-    e.stopPropagation();
-    closePopup();
-    var newMeta = store.metaList[groupIndex].list.slice();
-    // @ts-ignore
-    newMeta[index].filter = filter.filter(function (_, i) {
-      return i !== itemId;
-    });
-    store.setMeta(newMeta, groupIndex);
-  }
   function closePopup() {
     store.setPopup({
       visible: false
     });
   }
-  var options = ['(', ')', 'AND', 'OR'];
-  var addOperator = function addOperator(val, i, type) {
+  var selectFilter = function selectFilter(val) {
     var newMeta = store.metaList[groupIndex].list.slice();
-    var _filter = filter.slice();
-    if (type === 'before') {
-      _filter.splice(i, 0, val);
-    } else {
-      _filter.splice(i + 1, 0, val);
-    }
-    newMeta[index].filter = _toConsumableArray(_filter);
-    setInd(-1);
-  };
-  // NotExists 窗口
-  var showNotExists = function showNotExists(i, position, type) {
-    var _newMeta$index$filter, _newMeta$index$filter2;
-    var _store$preProps = store.preProps,
-      notExistsToolbar = _store$preProps.notExistsToolbar,
-      toolbar = _store$preProps.toolbar,
-      other = _objectWithoutProperties(_store$preProps, _excluded);
-    var newMeta = store.metaList[groupIndex].list.slice();
-    var index = findIndex(store.metaList[groupIndex].list, meta);
-    var _value = position ? [] : ((_newMeta$index$filter = newMeta[index].filter[i]) === null || _newMeta$index$filter === void 0 ? void 0 : _newMeta$index$filter.notExists) || [];
-    var oldList = position ? [] : cloneDeep(((_newMeta$index$filter2 = newMeta[index].filter[i]) === null || _newMeta$index$filter2 === void 0 ? void 0 : _newMeta$index$filter2.notExists) || []);
-    var _toolbar = notExistsToolbar || toolbar;
-    _toolbar = _toolbar.filter(function (v) {
-      return v !== 'group';
-    }); // 子查询不需要分组
-    var notExistsColumns = getColumns();
-    var o = Modal2.openModal({
-      title: type === Filter_TypeEnum.EXISTS ? 'EXISTS' : 'NOT EXISTS',
-      transparentMask: true,
-      content: _jsx(_Fragment, {
-        children: _jsx(Metabase, _objectSpread(_objectSpread({}, other), {}, {
-          notExistsColumns: notExistsColumns,
-          showFields: false,
-          showSubquery: false,
-          toolbar: _toolbar,
-          btnText: __('SqlQueryBuilder.confirm'),
-          value: _value,
-          onOk: function onOk(newList) {
-            try {
-              // 子查询未改变不做操作
-              if (isEqual(newList, oldList)) {
-                o.close();
-                return;
-              }
-              var _tem = {
-                notExists: newList,
-                quotes: buildSqlQuery(newList, type),
-                condition: '',
-                table: '',
-                tableId: '',
-                fieldUuid: uuidv4('field'),
-                //  字段唯一id
-                fieldAlias: '',
-                //字段别名
-                tableUuid: uuidv4('table'),
-                alias: '',
-                name: '',
-                id: '',
-                database_type: '',
-                val: [],
-                datasourceId: '',
-                datasourceName: '',
-                type: type
-              };
-              // 新增
-              if (i === -1) {
-                // 如果是新增子查询
-                newMeta[index].filter.push(_tem);
-                o.close();
-              } else if (position) {
-                //新增
-                if (position === 'before') {
-                  newMeta[index].filter.splice(i, 0, _tem);
-                } else {
-                  newMeta[index].filter.splice(i + 1, 0, _tem);
-                }
-              } else {
-                // 编辑
-                newMeta[index].filter[i] = _tem;
-              }
-              store.setMeta(newMeta, groupIndex);
-              o.close();
-            } catch (e) {
-              console.warn(e);
-            } finally {
-              o.close();
-            }
-          }
-        }))
-      }),
-      onClose: function onClose() {}
-    });
+    newMeta[index].filter = val;
+    store.setMeta(newMeta, groupIndex);
   };
-  // 过滤类型，子查询为完整的查询语句，表达式为单个字段
-  // 目前只支持表达式和子查询两种类型
-  var filterType = [
-  // {
-  //   value: Filter_TypeEnum.FIELD,
-  //   label: __('customColumn.field'),
-  // },
-  // {
-  //   value: Filter_TypeEnum.INPUT,
-  //   label: __('SqlQueryBuilder.input'),
-  // },
-  {
-    value: Filter_TypeEnum.EXPRESSION,
-    label: __('customColumn.expression') //表达式
-  }, {
-    value: Filter_TypeEnum.EXISTS,
-    label: 'EXISTS'
-  }, {
-    value: Filter_TypeEnum.NOT_EXISTS,
-    label: 'NOT EXISTS'
-  }];
-  // 选择过滤类型
-  function addSelectType(e) {
-    var _e = cloneDeep(e);
-    var node = _e.currentTarget;
-    var _index = node.getAttribute('v-index') || -1;
-    var _type = node.getAttribute('v-type');
-    store.setPopup({
-      visible: true,
-      node: e.currentTarget,
-      content: _jsx(SelectList, {
-        className: 'purple',
-        list: filterType,
-        onChange: function onChange(type) {
-          closePopup();
-          // 如果是新增子查询
-          if (type === Filter_TypeEnum.EXPRESSION) {
-            handleAdd(_e);
-          } else if (type === Filter_TypeEnum.NOT_EXISTS || type === Filter_TypeEnum.EXISTS) {
-            showNotExists(_index, _type, type);
-          }
-        }
-      })
-    });
-  }
-  // const itemDom = (v: MetaFilter_Item, i: number) => {
-  //   if (typeof v === 'string') {
-  //     return (
-  //       <div className={`Sqb-TableName purple-name`} key={i}>
-  //         {v}
-  //         <span style={{ fontSize: 0 }} onClick={(e) => handleDel(e, i)}>
-  //           <CloseIcon />
-  //         </span>
-  //       </div>
-  //     );
-  //   }
-  //   if (v.type === Filter_TypeEnum.NOT_EXISTS) {
-  //     return (
-  //       <div className={`Sqb-TableName purple-name`} key={i} onClick={(e) => handleUpdate(e, i)}>
-  //         not exitis ( * )
-  //         <span style={{ fontSize: 0 }} onClick={(e) => handleDel(e, i)}>
-  //           <CloseIcon />
-  //         </span>
-  //       </div>
-  //     );
-  //   } else if (v.type === Filter_TypeEnum.EXPRESSION) {
-  //     return (
-  //       <div className={`Sqb-TableName purple-name`} key={i} onClick={(e) => handleUpdate(e, i)}>
-  //         {v.quotes}
-  //         <span style={{ fontSize: 0 }} onClick={(e) => handleDel(e, i)}>
-  //           <CloseIcon />
-  //         </span>
-  //       </div>
-  //     );
-  //   }
-  //   else if (v.type === Filter_TypeEnum.INPUT) {
-  //     // 输入框
-  //     return (
-  //       <div className={cx(`Sqb-TableName notSelected `)}>
-  //         <Input
-  //           className={':Sqb-Custom-input'}
-  //           value={v.operator}
-  //           placeholder={__('SqlQueryBuilder.pleaseEnter')}
-  //           size='large'
-  //           onChange={(val) => {
-  //             handleConstant(val, index);
-  //           }}
-  //         />
-  //         <span style={{ fontSize: 0 }} onClick={(e) => handleDel(e, index)}>
-  //           <CloseIcon />
-  //         </span>
-  //       </div>
-  //     );
-  //   } else if (v.type === Filter_TypeEnum.OPERATOR) {
-  //     //连接符
-  //     return (
-  //       <Select
-  //         triggerProps={{
-  //           clickToClose: true,
-  //         }}
-  //         value={v.operator}
-  //         triggerElement={(value) => {
-  //           return (
-  //             <div
-  //               className={cx(`Sqb-TableName `, {
-  //                 notSelected: !v.operator,
-  //               })}
-  //             >
-  //               {!v.operator && __('customColumn.selectOperator')}
-  //               {v.operator}
-  //               <span style={{ fontSize: 0 }} onClick={(e) => handleDel(e, index)}>
-  //                 <CloseIcon />
-  //               </span>
-  //             </div>
-  //           );
-  //         }}
-  //         onChange={(val) => {
-  //           handleConstant(val, index);
-  //         }}
-  //       >
-  //         {operatorList.map((option, index) => (
-  //           <Select.Option key={index + '' + ind} value={option}>
-  //             {option}
-  //           </Select.Option>
-  //         ))}
-  //       </Select>
-  //     );
-  //   }
-  // };
   return _jsx(Wrapper, {
     className: "Sqb-item",
     children: _jsxs("div", {
@@ -474,114 +155,15 @@ var Filter = function Filter(props) {
         }
       }) : null, _jsx("div", {
         className: "Sqb-item--content",
-        children: _jsxs("div", {
-          className: "Sqb-NotebookCell gray-bg",
-          children: [filter.map(function (v, i) {
-            return _jsxs("div", {
-              className: cx('Sqb-Filter-item', {
-                hover: ind === i
-              }),
-              onMouseEnter: function onMouseEnter(e) {
-                setInd(i);
-              },
-              onMouseLeave: function onMouseLeave() {
-                setInd(-1);
-              },
-              children: [_jsx(Select, {
-                trigger: 'hover',
-                triggerProps: {
-                  clickToClose: true
-                },
-                triggerElement: function triggerElement() {
-                  return _jsx("div", {
-                    className: 'left-arrow',
-                    onClick: addSelectType,
-                    "v-index": i,
-                    "v-type": 'before',
-                    children: _jsx("img", {
-                      src: arrow
-                    })
-                  });
-                },
-                onChange: function onChange(val) {
-                  addOperator(val, i, 'before');
-                },
-                children: options.map(function (option) {
-                  return _jsx(Select.Option, {
-                    value: option,
-                    children: option
-                  }, option);
-                })
-              }), typeof v === 'string' ? _jsxs("div", {
-                className: "Sqb-TableName purple-name",
-                children: [v, _jsx("span", {
-                  style: {
-                    fontSize: 0
-                  },
-                  onClick: function onClick(e) {
-                    return handleDel(e, i);
-                  },
-                  children: _jsx(CloseIcon, {})
-                })]
-              }, i) : _jsxs("div", {
-                className: "Sqb-TableName purple-name",
-                onClick: function onClick(e) {
-                  return handleUpdate(e, i);
-                },
-                children: [v.type === Filter_TypeEnum.NOT_EXISTS ? 'not exitis ( * )' : v.type === Filter_TypeEnum.EXISTS ? 'exitis ( * )' : v.quotes, _jsx("span", {
-                  style: {
-                    fontSize: 0
-                  },
-                  onClick: function onClick(e) {
-                    return handleDel(e, i);
-                  },
-                  children: _jsx(CloseIcon, {})
-                })]
-              }, i), _jsx(Select, {
-                trigger: 'hover',
-                triggerProps: {
-                  clickToClose: true
-                },
-                triggerElement: function triggerElement(value) {
-                  return _jsx("div", {
-                    className: 'right-arrow',
-                    onClick: addSelectType,
-                    "v-index": i,
-                    "v-type": 'after',
-                    children: _jsx("img", {
-                      src: arrow
-                    })
-                  });
-                },
-                onChange: function onChange(val) {
-                  addOperator(val, i, 'after');
-                },
-                children: options.map(function (option) {
-                  return _jsx(Select.Option, {
-                    value: option,
-                    children: option
-                  }, option);
-                })
-              })]
-            }, i);
-          }), _jsx("div", {
-            className: cx("Sqb-TableName purple-name", {
-              notSelected: notSelected
-            }),
-            onClick: addSelectType,
-            children: notSelected ? __('filter.addFiltersToNarrowDownYourAnswers') : _jsx(AddIcon, {})
-          }), Array.from(filter).length > 0 && _jsxs("p", {
-            className: 'Sqb-NotebookCell-preview',
-            children: ["\u9884\u89C8\uFF1A", filter.map(function (v, i) {
-              if (typeof v === 'string') {
-                return v;
-              } else if (v.type === Filter_TypeEnum.NOT_EXISTS || v.type === Filter_TypeEnum.EXISTS) {
-                return "".concat(buildSqlQuery(v.notExists, v.type));
-              } else {
-                return v.quotes;
-              }
-            }).join(' ')]
-          })]
+        children: _jsx(FormulaList, {
+          customTypes: customTypes,
+          operatorList: operatorList,
+          value: filter,
+          data: [].concat(_toConsumableArray(getColumns()), _toConsumableArray(cloneDeep(notExistsColumns || []))),
+          exitData: getColumns(),
+          onChange: function onChange(val) {
+            selectFilter(val);
+          }
         })
       }), _jsx(NextDom, {
         meta: meta,