@gingkoo/pandora-metabase 1.0.23 → 1.0.25

package/lib/cjs/store/helper.js

@@ -4,10 +4,9 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.summarizeToSql = exports.restoreStructure = exports.getTemItem = exports.compressionStructure = exports.SummarizeAlias = void 0;
+exports.summarizeToSql = exports.restoreStructure = exports.compressionStructure = exports.SummarizeAlias = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
-var _types = require("./types");
 var _enum = require("./enum");
 var _excluded = ["children"],
   _excluded2 = ["metaKey"]; // import { SummarizeAlias } from './index';
@@ -422,78 +421,4 @@ var restoreStructure = exports.restoreStructure = function restoreStructure(data
   } catch (e) {
     return [];
   }
-};
-var getTemItem = exports.getTemItem = function getTemItem(type) {
-  var temItem;
-  // 字段
-  if (type === _types.AtomsTypeEnum.FIELD) {
-    temItem = {
-      fieldName: '',
-      // 字段名
-      fieldNameZh: '',
-      // 字段中文名
-      fieldAlias: '',
-      // 别名
-      fieldUuid: '',
-      // uuid
-      fieldId: '',
-      // 字段id
-      // quotes?: string; // 字段展示的 不知道有没有用
-      tableName: '',
-      // 表名
-      tableNameZh: '',
-      tableId: '',
-      // 表名
-      tableAlias: '',
-      // 别名
-      tableUuid: '',
-      // 表唯一标识
-      datasourceName: '',
-      // 数据源名
-      datasourceId: '',
-      // 数据源id
-      type: _types.AtomsTypeEnum.FIELD
-    };
-  }
-  // 表达式
-  else if (type === _types.AtomsTypeEnum.EXPRESSION || type === _types.AtomsTypeEnum.JOIN_DEFAULT) {
-    return {
-      lhs: [],
-      rhs: [],
-      condition: '',
-      quotes: '',
-      type: type
-    };
-  } else if (type === _types.AtomsTypeEnum.EXISTS || type === _types.AtomsTypeEnum.NOT_EXISTS) {
-    return {
-      quotes: '',
-      // 展示用户看的 组装的文字
-      notExists: [],
-      type: type
-    };
-  } else if (type === _types.AtomsTypeEnum.UNKNOWN) {
-    return {
-      // quotes: '', // 展示用户看的 组装的文字
-      // notExists: [],
-      val: '',
-      type: type
-    };
-  } else if (type === _types.AtomsTypeEnum.INPUT_NUMBER) {
-    return {
-      val: 0,
-      type: type
-    };
-  } else if (type === _types.AtomsTypeEnum.INPUT_NUMBER_LIST || type === _types.AtomsTypeEnum.INPUT_STRING_LIST) {
-    temItem = {
-      val: [],
-      type: type
-    };
-  } else {
-    // 其他
-    temItem = {
-      val: '',
-      type: type
-    };
-  }
-  return temItem;
 };

package/lib/cjs/store/types.d.ts

@@ -12,7 +12,9 @@ export declare enum AtomsTypeEnum {
     INPUT_NUMBER = "inputNumber",// 数字输入框
     CONSTANT = "constant",//  常量
     OPERATOR = "operator",// 运算符
-    UNKNOWN = "unknown"
+    UNKNOWN = "unknown",//未选具体类型
+    FORMULA = "FORMULA",
+    COLLECTION = "collection"
 }
 export interface AtomsNotExists {
     quotes: string;
@@ -24,6 +26,21 @@ export interface AtomsExists {
     notExists?: MetaListType[];
     type: AtomsTypeEnum.EXISTS;
 }
+export type Arity = {
+    exact: number;
+} | {
+    min: number;
+} | {
+    min: number;
+    max: number;
+};
+export interface AtomsFormula {
+    args: AtomsItem[];
+    arity?: Arity;
+    quotes: string;
+    name: string;
+    type: AtomsTypeEnum.FORMULA;
+}
 export interface AtomsExpression {
     lhs: AtomsItem[];
     rhs: AtomsItem[];
@@ -82,7 +99,12 @@ export interface AtomsUnknown {
     val: string;
     type: AtomsTypeEnum.UNKNOWN;
 }
-export type AtomsItem = AtomsNotExists | AtomsExists | AtomsJoinDefault | AtomsExpression | AtomsField | AtomsInputString | AtomsInputStringList | AtomsInputNumberList | AtomsInputNumber | AtomsOprator | AtomsConstant | AtomsUnknown;
+export interface AtomsCollection {
+    list: AtomsItem[];
+    quotes: string;
+    type: AtomsTypeEnum.COLLECTION;
+}
+export type AtomsItem = AtomsNotExists | AtomsExists | AtomsJoinDefault | AtomsExpression | AtomsFormula | AtomsField | AtomsInputString | AtomsInputStringList | AtomsInputNumberList | AtomsInputNumber | AtomsOprator | AtomsConstant | AtomsUnknown | AtomsCollection;
 export type ToolbarType = TypeEnum | 'filter' | 'summarize' | 'joinData' | 'permissionTable' | 'customColumn' | 'sort' | 'rowLimit' | 'union';
 export type MetaListType = MetaData | MetaJoin | MetaCustom | MetaFilter | MetaSummarize | MetaSort | MetaLimit | MetaPermissionTable | MetaUnion;
 export type initColumnsType = MetaData_ColumnsType;
@@ -293,10 +315,22 @@ export interface ParamsType {
     code: string;
 }
 export interface PopupData {
+    container?: any;
     visible: boolean;
     node?: any;
     content?: any;
 }
+export interface FormulaTemplatesItem {
+    name: string;
+    args: {
+        type: AtomsTypeEnum;
+        check?: string | null;
+    }[];
+    arity?: Arity;
+    output?: string;
+    description?: string;
+    example?: string;
+}
 export {};
 /**
 let a = {

package/lib/cjs/store/types.js

@@ -12,6 +12,7 @@ var AtomsTypeEnum;
   AtomsTypeEnum["NOT_EXISTS"] = "notExists";
   AtomsTypeEnum["FIELD"] = "field";
   AtomsTypeEnum["EXPRESSION"] = "expression";
+  // FUNCTION = 'function', // 函数
   AtomsTypeEnum["INPUT_STRING"] = "inputString";
   AtomsTypeEnum["INPUT_STRING_LIST"] = "inputStringList";
   AtomsTypeEnum["INPUT_NUMBER_LIST"] = "inputNumberList";
@@ -19,6 +20,8 @@ var AtomsTypeEnum;
   AtomsTypeEnum["CONSTANT"] = "constant";
   AtomsTypeEnum["OPERATOR"] = "operator";
   AtomsTypeEnum["UNKNOWN"] = "unknown";
+  AtomsTypeEnum["FORMULA"] = "FORMULA";
+  AtomsTypeEnum["COLLECTION"] = "collection";
 })(AtomsTypeEnum || (exports.AtomsTypeEnum = AtomsTypeEnum = {}));
 // ----------- 第五个模块 聚合模块 ------------
 var MetaSummarize_Enum;

package/lib/cjs/types.d.ts

@@ -1,4 +1,4 @@
-import type { MetaListType, ToolbarType } from './store/types';
+import type { MetaListType, ToolbarType, FormulaTemplatesItem } from './store/types';
 import { UnionEnum } from './store/enum';
 import { DataType } from './components/dialog/select-join-column';
 export interface MetaListProps {
@@ -32,6 +32,7 @@ export interface MetabaseProps {
     ignoreGroupByType?: boolean;
     filterCustomType?: boolean;
     notExistsColumns?: DataType[];
+    formulaTemplates?: FormulaTemplatesItem[];
 }
 export interface OptionItem {
     value?: string;

package/lib/cjs/utils.d.ts

@@ -14,6 +14,7 @@ interface HelperResultType {
 }
 export declare const getHelper: (list: MetaListType[], item: MetaListType) => HelperResultType;
 export declare const getSubColumns: (metaList: any) => DataType[];
+export declare function isValidSQLAlias(str: string): boolean;
 export declare const changeTableAlias: (list: MetaListType[] | [], curObj: Pick<MetaData_TableType, "tableUuid" | "alias">) => MetaListType[];
 export declare const changeFieldAlias: (list: MetaListType[], curObj: Pick<MetaData_ColumnsType, "fieldUuid" | "fieldAlias">) => MetaListType[];
 export declare function splitByUnion(data: any): any[];

package/lib/cjs/utils.js

@@ -4,7 +4,9 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.patchData = exports.getSubColumns = exports.getHelper = exports.findIndex = exports.changeTableAlias = exports.changeFieldAlias = exports.buildSqlQuery = void 0;
+exports.getSubColumns = exports.getHelper = exports.findIndex = exports.changeTableAlias = exports.changeFieldAlias = exports.buildSqlQuery = void 0;
+exports.isValidSQLAlias = isValidSQLAlias;
+exports.patchData = void 0;
 exports.reassembleByUnion = reassembleByUnion;
 exports.splitByUnion = splitByUnion;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
@@ -250,11 +252,22 @@ var _changeAlias = function changeAlias(items, val, type) {
         });
       }
       return v;
+    } else if (v.type === _types.AtomsTypeEnum.FORMULA) {
+      v.args = _changeAlias(v.args, val, type);
+      return v;
+    } else if (v.type === _types.AtomsTypeEnum.COLLECTION) {
+      v.list = _changeAlias(v.list, val, type);
+      return v;
     } else {
       return v;
     }
   });
 };
+function isValidSQLAlias(str) {
+  if (!str) return false;
+  var regex = /^[A-Za-z_][A-Za-z0-9_]{0,29}$/;
+  return regex.test(str);
+}
 var changeTableAlias = exports.changeTableAlias = function changeTableAlias(list, curObj) {
   var _cloneDeep = (0, _cloneDeep3["default"])(curObj),
     tableUuid = _cloneDeep.tableUuid,
@@ -448,6 +461,7 @@ function splitByUnion(data) {
   return result;
 }
 var patchData = exports.patchData = function patchData(metas) {
+  return metas;
   var mainTable = metas[0] || {};
   var version = (mainTable === null || mainTable === void 0 ? void 0 : mainTable.patchVersion) || '';
   if (version != '1.0.0') {
@@ -593,7 +607,7 @@ var buildSqlQuery = exports.buildSqlQuery = function buildSqlQuery() {
       var filterStrings = item.filter.map(function (f) {
         if (f.type === _types.AtomsTypeEnum.FIELD) {
           return f.fieldName;
-        } else if (f.type === _types.AtomsTypeEnum.EXPRESSION || f.type === _types.AtomsTypeEnum.EXISTS || f.type === _types.AtomsTypeEnum.NOT_EXISTS) {
+        } else if (f.type === _types.AtomsTypeEnum.EXPRESSION || f.type === _types.AtomsTypeEnum.EXISTS || f.type === _types.AtomsTypeEnum.NOT_EXISTS || f.type === _types.AtomsTypeEnum.FORMULA || f.type === _types.AtomsTypeEnum.COLLECTION) {
           return f.quotes;
         } else if (f.type === _types.AtomsTypeEnum.JOIN_DEFAULT) {
           return '';

package/lib/es/common/SplitView/index.js

@@ -51,17 +51,17 @@ var SplitView = React.forwardRef(function (props, ref) {
     hMaximum = _useState8[0],
     setHMaximum = _useState8[1];
   var _useState9 = useState(false),
-    _useState0 = _slicedToArray(_useState9, 2),
-    vMinimum = _useState0[0],
-    setVMinimum = _useState0[1];
-  var _useState1 = useState(false),
-    _useState10 = _slicedToArray(_useState1, 2),
-    vMaximum = _useState10[0],
-    setVMaximum = _useState10[1];
-  var _useState11 = useState(0),
+    _useState10 = _slicedToArray(_useState9, 2),
+    vMinimum = _useState10[0],
+    setVMinimum = _useState10[1];
+  var _useState11 = useState(false),
     _useState12 = _slicedToArray(_useState11, 2),
-    bottomHeight = _useState12[0],
-    setBottomHeight = _useState12[1];
+    vMaximum = _useState12[0],
+    setVMaximum = _useState12[1];
+  var _useState13 = useState(0),
+    _useState14 = _slicedToArray(_useState13, 2),
+    bottomHeight = _useState14[0],
+    setBottomHeight = _useState14[1];
   React.useImperativeHandle(ref, function () {
     return {
       open: function open() {

package/lib/es/components/dialog/custom-editor/index.js

@@ -6,6 +6,7 @@ import { useState, useMemo, useRef } from 'react';
 import cx from 'classnames';
 import './index.less';
 import FormulaList from '../formula-list';
+import { isOk } from '../formula-list/utils';
 import { __ } from '../../../locale';
 // import { getTemplate } from './utils';
 import Styled from 'styled-components';
@@ -30,7 +31,7 @@ var CaseEditor = function CaseEditor(props) {
   var ref = useRef(null);
   // 提交按钮是否可用
   var usable = useMemo(function () {
-    return Array.from(caseList).length > 0 && name;
+    return isOk(caseList) && name;
   }, [caseList, name]);
   // 取消
   var _onClose = function _onClose() {

package/lib/es/components/dialog/expression/index.js

@@ -79,18 +79,18 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
     special_type = _useState8[0],
     setSpecial_type = _useState8[1];
   var _useState9 = useState(value.formula || {}),
-    _useState0 = _slicedToArray(_useState9, 2),
-    formula = _useState0[0],
-    setFormula = _useState0[1];
+    _useState10 = _slicedToArray(_useState9, 2),
+    formula = _useState10[0],
+    setFormula = _useState10[1];
   var store = useStore();
-  var _useState1 = useState(false),
-    _useState10 = _slicedToArray(_useState1, 2),
-    popupVisible = _useState10[0],
-    setPopupVisible = _useState10[1];
-  var _useState11 = useState((value === null || value === void 0 || (_value$lhs = value.lhs) === null || _value$lhs === void 0 ? void 0 : _value$lhs.length) > 0 || false),
+  var _useState11 = useState(false),
     _useState12 = _slicedToArray(_useState11, 2),
-    isNext = _useState12[0],
-    setIsNext = _useState12[1];
+    popupVisible = _useState12[0],
+    setPopupVisible = _useState12[1];
+  var _useState13 = useState((value === null || value === void 0 || (_value$lhs = value.lhs) === null || _value$lhs === void 0 ? void 0 : _value$lhs.length) > 0 || false),
+    _useState14 = _slicedToArray(_useState13, 2),
+    isNext = _useState14[0],
+    setIsNext = _useState14[1];
   var table2Selected = Boolean(rhsVal && (rhsVal === null || rhsVal === void 0 ? void 0 : rhsVal.length) > 0);
   var disabled = useMemo(function () {
     if (!condition) return true;
@@ -620,7 +620,7 @@ var SelectFilterColumn = function SelectFilterColumn(_ref) {
         value: '',
         list: [{
           value: AtomsTypeEnum.INPUT_STRING,
-          label: __('SqlQueryBuilder.input')
+          label: __('customColumn.input')
         }, {
           value: AtomsTypeEnum.CONSTANT,
           label: __('customColumn.constant')

package/lib/es/components/dialog/formula/index.d.ts

@@ -0,0 +1,10 @@
+import './index.less';
+import { AtomsFormula } from '../../../store/types';
+interface PropsType {
+    value: AtomsFormula;
+    data: any;
+    onOk: Function;
+    onCancel: Function;
+}
+declare const CaseEditor: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
+export default CaseEditor;

package/lib/es/components/dialog/formula/index.js

@@ -0,0 +1,236 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState, useMemo, useRef } from 'react';
+import cx from 'classnames';
+import './index.less';
+import FormulaList from '../formula-list';
+import { AddIcon, CloseIcon } from '../../icons';
+import { isOk } from '../formula-list/utils';
+import { __ } from '../../../locale';
+import { getTemArgs, getObjTem, getParamActions } from './utils';
+import Styled from 'styled-components';
+// import { OptionsTypeEnum, customTypes, otherList, operatorList, functionList } from './enum';
+import { AtomsTypeEnum } from '../../../store/types';
+import { Select, Button } from '@gingkoo/pandora';
+import cloneDeep from 'lodash/cloneDeep';
+import { useStore } from '../../../hooks/use-provider';
+var VisualBox = Styled.div.attrs({
+  className: 'visual-box'
+})(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
+var CaseEditor = function CaseEditor(props) {
+  var _store$formulaTemplat, _fun$args;
+  var store = useStore();
+  var value = props.value,
+    data = props.data,
+    onOk = props.onOk,
+    onCancel = props.onCancel;
+  var _useState = useState(value),
+    _useState2 = _slicedToArray(_useState, 2),
+    fun = _useState2[0],
+    setFun = _useState2[1];
+  var _useState3 = useState(getObjTem(store.formulaTemplates)),
+    _useState4 = _slicedToArray(_useState3, 2),
+    formulaList = _useState4[0],
+    setFunctionList = _useState4[1];
+  var _useState5 = useState({
+      canAdd: true,
+      canDel: true
+    }),
+    _useState6 = _slicedToArray(_useState5, 2),
+    formulaOpr = _useState6[0],
+    setFormulaOpr = _useState6[1];
+  useEffect(function () {
+    setFormulaOpr(getParamActions(fun.args, fun.arity));
+  }, [fun]);
+  var ref = useRef(null);
+  // EXPRESSION = 'expression', // 表达式
+  // // FUNCTION = 'function', // 函数
+  // INPUT_STRING = 'inputString', // 字符串输入框
+  // INPUT_STRING_LIST = 'inputStringList', // 字符串输入框
+  // INPUT_NUMBER_LIST = 'inputNumberList', // 数字输入框
+  // INPUT_NUMBER = 'inputNumber', // 数字输入框
+  // CONSTANT = 'constant', //  常量
+  // OPERATOR = 'operator', // 运算符
+  // UNKNOWN = 'unknown', //未选具体类型
+  // FORMULA = 'FORMULA',
+  // COLLECTION = 'collection',
+  // 提交按钮是否可用
+  var usable = useMemo(function () {
+    return fun.name && isOk(fun.args);
+  }, [fun]);
+  // 取消
+  var _onClose = function _onClose() {
+    onCancel === null || onCancel === void 0 || onCancel();
+  };
+  // 确定
+  var _onOk = function _onOk() {
+    typeof onOk === 'function' && (onOk === null || onOk === void 0 ? void 0 : onOk(fun));
+  };
+  // 选择公式名
+  var handleFunName = function handleFunName(name) {
+    var _formulaList$name;
+    formulaList === null || formulaList === void 0 || formulaList[name].args;
+    setFun(_objectSpread(_objectSpread({}, fun), {}, {
+      args: getTemArgs(formulaList === null || formulaList === void 0 ? void 0 : formulaList[name].args),
+      arity: formulaList === null || formulaList === void 0 || (_formulaList$name = formulaList[name]) === null || _formulaList$name === void 0 ? void 0 : _formulaList$name.arity,
+      name: name
+    }));
+  };
+  var addParams = function addParams(index) {
+    var _args = cloneDeep(fun.args);
+    var tem = getTemArgs(formulaList === null || formulaList === void 0 ? void 0 : formulaList[fun.name].args)[index + 1] || {
+      type: AtomsTypeEnum.COLLECTION,
+      list: []
+    };
+    _args.splice(index + 1, 0, tem);
+    setFun(_objectSpread(_objectSpread({}, fun), {}, {
+      args: _args
+    }));
+  };
+  var delParams = function delParams(index) {
+    var _args = cloneDeep(fun.args);
+    _args.splice(index, 1);
+    setFun(_objectSpread(_objectSpread({}, fun), {}, {
+      args: _args
+    }));
+  };
+  return _jsxs("div", {
+    className: 'function-box',
+    ref: ref,
+    children: [_jsx(VisualBox, {
+      children: _jsx("div", {
+        className: "Sqb-item Sqb-case-editor mb-2 mt-2",
+        children: _jsxs("div", {
+          className: "Sqb-item--content",
+          children: [_jsxs("div", {
+            className: 'Sqb-NotebookCell-header',
+            children: [_jsx("div", {
+              className: "mb-2 font-bold uppercase tracking-wider",
+              style: {
+                fontSize: 12,
+                color: '#949aab'
+              },
+              children: "\u8BF7\u5148\u9009\u62E9\u516C\u5F0F\uFF0C\u5207\u6362\u516C\u5F0F\u65F6\u4F1A\u91CD\u7F6E\u53C2\u6570"
+            }), _jsx("div", {
+              className: 'Sqb-NotebookCell formula-name',
+              children: _jsx(Select, {
+                triggerProps: {
+                  clickToClose: true
+                },
+                value: fun.name,
+                triggerElement: function triggerElement(value) {
+                  return _jsx("div", {
+                    className: cx("Sqb-TableName Sqb-TableName-OPERATOR", {
+                      notSelected: !fun.name
+                    }),
+                    children: fun.name ? fun.name : __('customColumn.selectFormula')
+                  });
+                },
+                onChange: function onChange(val) {
+                  handleFunName(val);
+                },
+                children: (_store$formulaTemplat = store.formulaTemplates) === null || _store$formulaTemplat === void 0 ? void 0 : _store$formulaTemplat.map(function (option, index) {
+                  return _jsx(Select.Option, {
+                    value: option.name,
+                    children: option.name
+                  }, index);
+                })
+              })
+            }), fun.name && _jsxs("div", {
+              className: "mb-2 font-bold uppercase tracking-wider",
+              style: {
+                fontSize: 12,
+                color: '#949aab'
+              },
+              children: [_jsxs("p", {
+                children: ["\u63CF\u8FF0\uFF1A", formulaList[fun.name].description]
+              }), _jsxs("p", {
+                children: ["\u6848\u4F8B\uFF1A", formulaList[fun.name].example]
+              })]
+            })]
+          }), fun === null || fun === void 0 || (_fun$args = fun.args) === null || _fun$args === void 0 ? void 0 : _fun$args.map(function (v, i) {
+            if (v.type === AtomsTypeEnum.COLLECTION) {
+              var _formulaList$fun$name;
+              return _jsxs("div", {
+                className: 'Sqb-item-formula-args',
+                children: [_jsxs("div", {
+                  className: 'Sqb-item-formula',
+                  children: [_jsxs("div", {
+                    className: "mb-2 font-bold uppercase tracking-wider",
+                    style: {
+                      fontSize: 12,
+                      color: '#949aab'
+                    },
+                    children: ["\u53C2\u6570", i + 1, ":"]
+                  }), _jsx(FormulaList, {
+                    check: (formulaList === null || formulaList === void 0 || (_formulaList$fun$name = formulaList[fun.name]) === null || _formulaList$fun$name === void 0 || (_formulaList$fun$name = _formulaList$fun$name.args) === null || _formulaList$fun$name === void 0 || (_formulaList$fun$name = _formulaList$fun$name[i]) === null || _formulaList$fun$name === void 0 ? void 0 : _formulaList$fun$name.check) || '',
+                    value: v.list,
+                    data: data,
+                    ref: ref,
+                    onChange: function onChange(data, _quotes) {
+                      var _args = cloneDeep(fun.args);
+                      _args[i].list = data;
+                      _args[i].quotes = _quotes || '';
+                      var quotes = _args.map(function (v) {
+                        return v.quotes;
+                      }).join(' , ');
+                      setFun(_objectSpread(_objectSpread({}, fun), {}, {
+                        quotes: fun.name + ' ( ' + quotes + ' ) ',
+                        args: _args
+                      }));
+                    }
+                  })]
+                }), _jsxs("div", {
+                  className: 'Sqb-item-opr',
+                  children: [_jsx(Button, {
+                    primary: true,
+                    disabled: !formulaOpr.canAdd,
+                    shape: 'square',
+                    icon: _jsx(AddIcon, {}),
+                    onClick: function onClick() {
+                      addParams(i);
+                    }
+                  }), _jsx(Button, {
+                    primary: true,
+                    level: 'danger',
+                    shape: 'square',
+                    icon: _jsx(CloseIcon, {}),
+                    disabled: !formulaOpr.canDel,
+                    onClick: function onClick() {
+                      delParams(i);
+                    }
+                  })]
+                })]
+              }, i);
+            }
+          })]
+        })
+      })
+    }), _jsx("div", {
+      className: "btns p-4",
+      children: _jsxs("div", {
+        style: {
+          marginLeft: 'auto'
+        },
+        children: [_jsx("button", {
+          className: "btn",
+          onClick: function onClick() {
+            return _onClose();
+          },
+          children: __('customColumn.cancel')
+        }), _jsx("button", {
+          className: cx("btn ml-4", {
+            usable: usable
+          }),
+          disabled: !usable,
+          onClick: _onOk,
+          children: __('customColumn.complete')
+        })]
+      })
+    })]
+  });
+};
+export default CaseEditor;

package/lib/es/components/dialog/formula/index.less

@@ -0,0 +1,81 @@
+.function-box {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+  .visual-box {
+    flex: 1;
+  }
+
+  .Sqb-case-editor {
+    padding: 20px 20px 50px;
+    .Sqb-item--content {
+      width: 100%;
+      height: 100%;
+      .Sqb-item-formula-args {
+        display: flex;
+        align-items: center;
+        margin: 20px 0;
+        .Sqb-item-formula {
+          flex: 1;
+        }
+        .Sqb-item-opr {
+          display: flex;
+          gap: 10px;
+          margin-left: 10px;
+        }
+      }
+    }
+  }
+
+  .btns {
+    flex-direction: row;
+    align-items: center;
+    display: flex;
+    border-top: 1px solid #f0f0f0;
+    // position: absolute;
+    width: 100%;
+    bottom: 0;
+    z-index: 3;
+    background-color: #fff;
+    .btn {
+      padding: 0.75rem 1rem;
+
+      display: inline-block;
+      box-sizing: border-box;
+      text-decoration: none;
+      background: transparent;
+      border: 1px solid rgb(228, 228, 228);
+      color: #4c5773;
+      cursor: pointer;
+      text-decoration: none;
+      font-weight: bold;
+      font-family: 'Lato', sans-serif;
+      border-radius: 6px;
+
+      outline: none;
+
+      &:disabled {
+        opacity: 0.5;
+        cursor: not-allowed;
+      }
+      &:not(:disabled):hover {
+        color: #509ee3;
+        border-color: rgb(214, 214, 214);
+        background: #f9fbfc;
+        transition: all 200ms linear;
+      }
+
+      &.usable {
+        color: #ffffff;
+        background: #509ee3;
+        border: 1px solid #509ee3;
+        &:hover {
+          color: #ffffff;
+          border-color: #509ee3;
+          background-color: rgba(80, 158, 227, 0.88);
+        }
+      }
+    }
+  }
+}

package/lib/es/components/dialog/formula/utils.d.ts

@@ -0,0 +1,7 @@
+import { Arity, AtomsItem, AtomsCollection } from '../../../store/types';
+export declare const getObjTem: (arr: any[]) => any;
+export declare const getTemArgs: (temArgs: any[]) => AtomsCollection[];
+export declare function getParamActions(params: AtomsItem[], arity?: Arity): {
+    canAdd: boolean;
+    canDel: boolean;
+};