@gingkoo/pandora-metabase 1.0.14 → 1.0.16

package/lib/es/components/dialog/formula-list/utils.js

@@ -1,5 +1,5 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import { OptionsTypeEnum } from './enum';
+import { AtomsTypeEnum } from '../../../store/types';
 /**
  *
  * @param type 当前选择的类型
@@ -16,71 +16,102 @@ export var getTemplate = function getTemplate(oldType, type, list, index) {
   }
   if (type === 'case') {
     temList = [{
-      operator: 'when',
-      type: OptionsTypeEnum.OTHER,
-      expression: ''
+      val: 'when',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: '',
-      type: '',
-      expression: ''
+      val: '',
+      type: AtomsTypeEnum.UNKNOWN
     }, {
-      operator: 'then',
-      type: OptionsTypeEnum.OTHER,
-      expression: ''
+      val: 'then',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: '',
-      type: '',
-      expression: ''
+      val: '',
+      type: AtomsTypeEnum.UNKNOWN
     }, {
-      operator: 'end',
-      type: OptionsTypeEnum.OTHER,
-      expression: ''
+      val: 'end',
+      type: AtomsTypeEnum.OPERATOR
     }];
   }
   if (type === 'when') {
     temList = [{
-      operator: '',
-      type: '',
-      expression: ''
+      val: '',
+      type: AtomsTypeEnum.UNKNOWN
     }, {
-      operator: 'then',
-      type: OptionsTypeEnum.OTHER,
-      expression: ''
+      val: 'then',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: '',
-      type: '',
-      expression: ''
+      val: '',
+      type: AtomsTypeEnum.UNKNOWN
     }];
   }
   if (type === 'RANK()' || type === 'DENSE_RANK()' || type === 'ROW_NUMBER()') {
     temList = [{
-      operator: 'OVER',
-      type: OptionsTypeEnum.OPERATOR,
-      expression: ''
+      val: 'OVER',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: '(',
-      type: OptionsTypeEnum.OPERATOR,
-      expression: ''
+      val: '(',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: 'PARTITION BY',
-      type: OptionsTypeEnum.OPERATOR,
-      expression: ''
+      val: 'PARTITION BY',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: '',
-      type: OptionsTypeEnum.FIELD,
-      expression: ''
+      fieldName: '',
+      // 字段名
+      fieldNameZh: '',
+      // 字段中文名
+      fieldAlias: '',
+      // 别名
+      fieldUuid: '',
+      // uuid
+      fieldId: '',
+      // 字段id
+      // quotes?: string; // 字段展示的 不知道有没有用
+      tableName: '',
+      // 表名
+      tableNameZh: '',
+      tableId: '',
+      // 表名
+      tableAlias: '',
+      // 别名
+      tableUuid: '',
+      // 表唯一标识
+      datasourceName: '',
+      // 数据源名
+      datasourceId: '',
+      // 数据源id
+      type: AtomsTypeEnum.FIELD
     }, {
-      operator: 'ORDER BY',
-      type: OptionsTypeEnum.OPERATOR,
-      expression: ''
+      val: 'ORDER BY',
+      type: AtomsTypeEnum.OPERATOR
     }, {
-      operator: '',
-      type: OptionsTypeEnum.FIELD,
-      expression: ''
+      fieldName: '',
+      // 字段名
+      fieldNameZh: '',
+      // 字段中文名
+      fieldAlias: '',
+      // 别名
+      fieldUuid: '',
+      // uuid
+      fieldId: '',
+      // 字段id
+      // quotes?: string; // 字段展示的 不知道有没有用
+      tableName: '',
+      // 表名
+      tableNameZh: '',
+      tableId: '',
+      // 表名
+      tableAlias: '',
+      // 别名
+      tableUuid: '',
+      // 表唯一标识
+      datasourceName: '',
+      // 数据源名
+      datasourceId: '',
+      // 数据源id
+      type: AtomsTypeEnum.FIELD
     }, {
-      operator: ')',
-      type: OptionsTypeEnum.OPERATOR,
-      expression: ''
+      val: ')',
+      type: AtomsTypeEnum.OPERATOR
     }];
   }
   list.splice.apply(list, [index + 1, 0].concat(_toConsumableArray(temList)));

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

@@ -1,10 +1,10 @@
 export { default as CustomColumnPopup } from './custom-column/index';
 export { default as SelectColumn } from './select-column/index';
 export { default as SelectJoinColumn } from './select-join-column/index';
-export { default as SelectJoinColumnMultiple } from './select-join-column-multiple/index';
-export { default as SelectFilter } from './select-filter/index';
+export { default as SelectColumnMultiple } from './select-column-multiple/index';
 export { default as SelectSummarize } from './select-summarize/index';
 export { default as SelectJoin } from './select-join/index';
 export { default as SelectTable } from './select-table/index';
 export { default as SelectPermissionTable } from './select-permission-table/index';
 export { default as FormulaList } from './formula-list/index';
+export { default as Expression } from './expression/index';

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

@@ -1,10 +1,10 @@
 export { default as CustomColumnPopup } from './custom-column/index';
 export { default as SelectColumn } from './select-column/index';
 export { default as SelectJoinColumn } from './select-join-column/index';
-export { default as SelectJoinColumnMultiple } from './select-join-column-multiple/index';
-export { default as SelectFilter } from './select-filter/index';
+export { default as SelectColumnMultiple } from './select-column-multiple/index';
 export { default as SelectSummarize } from './select-summarize/index';
 export { default as SelectJoin } from './select-join/index';
 export { default as SelectTable } from './select-table/index';
 export { default as SelectPermissionTable } from './select-permission-table/index';
-export { default as FormulaList } from './formula-list/index';
+export { default as FormulaList } from './formula-list/index'; // 自定义公式列表
+export { default as Expression } from './expression/index'; // 表达式编辑器

package/lib/es/components/dialog/select-column/index.js

@@ -1,5 +1,7 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * 选择保留哪些表字段
@@ -11,7 +13,7 @@ import './index.less';
 import { useEffect, useMemo, useState } from 'react';
 import cloneDeep from 'lodash/cloneDeep';
 import cx from 'classnames';
-import { Button, Modal, Input, Tooltip } from '@gingkoo/pandora';
+import { Button, Modal, Input, Tooltip, Toast } from '@gingkoo/pandora';
 import { __ } from '../../../locale';
 import { NotSelectIcon, SelectIcon } from '../../icons';
 import { useStore } from '../../../hooks/use-provider';
@@ -92,18 +94,47 @@ var SelectColumn = function SelectColumn(_ref) {
           fieldAlias = val;
         }
       }),
-      onOk: function onOk() {
-        var newColumns = cloneDeep(columns);
-        var newMetaList = store.metaList[groupIndex].list.slice();
-        newColumns[i].fieldAlias = fieldAlias;
-        newColumns[i].fieldUuid = newColumns[i].fieldUuid || uuidv4('field');
-        newMetaList = changeFieldAlias(newMetaList, newColumns[i]);
-        store.setMeta(newMetaList, groupIndex);
-        onSelect(newColumns);
-        setTimeout(function () {
-          store.setClosable(true);
-        }, 0);
-      },
+      onOk: function () {
+        var _onOk = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+          var newColumns, newMetaList;
+          return _regeneratorRuntime.wrap(function (_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                if (fieldAlias) {
+                  _context.next = 1;
+                  break;
+                }
+                Toast.warning(__('SqlQueryBuilder.aliasCannotEmpty'));
+                return _context.abrupt("return", false);
+              case 1:
+                if (!(fieldAlias.length > 30)) {
+                  _context.next = 2;
+                  break;
+                }
+                Toast.warning('别名长度不能超过30');
+                return _context.abrupt("return", false);
+              case 2:
+                newColumns = cloneDeep(columns);
+                newMetaList = store.metaList[groupIndex].list.slice();
+                newColumns[i].fieldAlias = fieldAlias;
+                newColumns[i].fieldUuid = newColumns[i].fieldUuid || uuidv4('field');
+                newMetaList = changeFieldAlias(newMetaList, newColumns[i]);
+                store.setMeta(newMetaList, groupIndex);
+                onSelect(newColumns);
+                setTimeout(function () {
+                  store.setClosable(true);
+                }, 0);
+              case 3:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        function onOk() {
+          return _onOk.apply(this, arguments);
+        }
+        return onOk;
+      }(),
       onCancel: function onCancel() {
         setTimeout(function () {
           store.setClosable(true);

package/lib/es/components/dialog/select-column-multiple/index.d.ts

@@ -0,0 +1,54 @@
+/**
+ * 选择表字段当条件
+ * 谁在用？
+ * 1、关联模块
+ * 2、过滤器模块
+ * 3、聚合模块
+ * 4、排序模块
+ */
+import './index.less';
+import { ColumnsPopupThemeEnum, SQL_COLUMN_TYPE } from '../../../store/enum';
+import { MetaData_ColumnsType, MetaJoin_TalbeType, AtomsField } from '../../../store/types';
+import { DatasourceType } from '../../../types';
+export declare const DATE_GROUP_MAP: Map<string, string>;
+export declare const NUMBER_GROUP_MAP: Map<string, string>;
+export interface ColumnType {
+    fieldUuid: string;
+    fieldAlias: string;
+    alias: string;
+    name: string;
+    database_type: SQL_COLUMN_TYPE | string;
+    sql?: string;
+    id: string;
+    datasourceId: string;
+    datasourceName: string;
+    table2?: Omit<MetaJoin_TalbeType, 'column' | 'column_id'> | null;
+}
+export interface ColumnGroupType {
+    condition: string;
+}
+export type DataType = Partial<DatasourceType> & {
+    name: string;
+    id: string;
+    name_zh: string;
+    tableUuid: string;
+    alias: string;
+    columns: MetaData_ColumnsType[];
+};
+interface PropsType {
+    data: DataType[];
+    value: AtomsField[];
+    theme: ColumnsPopupThemeEnum;
+    isGroup?: boolean;
+    onSelect?: (fields: AtomsField[], quotes: string) => void;
+    onGroup?: (record: ColumnType & ColumnGroupType & {
+        realName?: string;
+    }) => void;
+    didUpdate?: Function;
+    multiple?: boolean;
+    showNextBtn?: boolean;
+    nextBtnText?: string;
+    onNextStep?: () => void;
+}
+declare const SelectJoinColumn: ({ data, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, showNextBtn, nextBtnText, onNextStep, }: PropsType) => import("react/jsx-runtime").JSX.Element;
+export default SelectJoinColumn;

package/lib/es/components/dialog/select-column-multiple/index.js

@@ -0,0 +1,335 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * 选择表字段当条件
+ * 谁在用？
+ * 1、关联模块
+ * 2、过滤器模块
+ * 3、聚合模块
+ * 4、排序模块
+ */
+import './index.less';
+import { useEffect, useState } from 'react';
+import { Button } from '@gingkoo/pandora';
+import cloneDeep from 'lodash/cloneDeep';
+import cx from 'classnames';
+import { ColumnsPopupThemeEnum, SQL_GROUP_TYPE } from '../../../store/enum';
+import { SummarizeAlias } from '../../../store/helper';
+import {
+// AtomsField,
+AtomsTypeEnum } from '../../../store/types';
+import { __ } from '../../../locale';
+import { NUMBER_GROUP, DATE_GROUP } from '../const';
+import { useStore } from '../../../hooks/use-provider';
+import { replaceTpl } from '../../../utils/helper';
+import { SearchIcon, TableIcon, CircleIcon, LetterAaIcon, CalendarIcon, WellIcon, ForeignKeyIcon, UpArrowIcon2, DownArrowIcon2 } from '../../icons';
+export var DATE_GROUP_MAP = new Map([['分', '分'], ['时', '时'], ['天', '天'], ['周', '周'], ['月', '月'], ['季度', '季度'], ['一小时内的分钟数', '一小时内的分钟数'], ['一天内的小时数', '一天内的小时数'], ['一周内的天数', '一周内的天数'], ['一月内的天数', '一月内的天数'], ['一年内的天数', '一年内的天数'], ['一年的星期数', '一年的星期数'], ['一年的月数', '一年的月数']]);
+export var NUMBER_GROUP_MAP = new Map([['自动间隔', '自动分组'], ['10个刻度间隔', '10 刻度间隔'], ['间隔50', '50 刻度间隔'], ['间隔100', '100 刻度间隔'], ['无间隔', '']]);
+var IconMap = {
+  CHAR: _jsx(LetterAaIcon, {}),
+  VARCHAR: _jsx(LetterAaIcon, {}),
+  CLOB: _jsx(LetterAaIcon, {}),
+  DOUBLE: _jsx(WellIcon, {}),
+  SMALLINT: _jsx(WellIcon, {}),
+  BIGINT: _jsx(WellIcon, {}),
+  INTEGER: _jsx(WellIcon, {}),
+  TIMESTAMP: _jsx(CalendarIcon, {}),
+  PK: _jsx(CircleIcon, {}),
+  FK: _jsx(ForeignKeyIcon, {})
+};
+var OPEN_GROUP = false; // mr.chen 说不弄这块 弄个开关防止后面要用
+var SelectJoinColumn = function SelectJoinColumn(_ref) {
+  var _value$;
+  var _ref$data = _ref.data,
+    data = _ref$data === void 0 ? [] : _ref$data,
+    _value = _ref.value,
+    _ref$theme = _ref.theme,
+    theme = _ref$theme === void 0 ? ColumnsPopupThemeEnum.skyBlue : _ref$theme,
+    onSelect = _ref.onSelect,
+    isGroup = _ref.isGroup,
+    onGroup = _ref.onGroup,
+    didUpdate = _ref.didUpdate,
+    _ref$multiple = _ref.multiple,
+    multiple = _ref$multiple === void 0 ? true : _ref$multiple,
+    _ref$showNextBtn = _ref.showNextBtn,
+    showNextBtn = _ref$showNextBtn === void 0 ? false : _ref$showNextBtn,
+    _ref$nextBtnText = _ref.nextBtnText,
+    nextBtnText = _ref$nextBtnText === void 0 ? __('metabase.nextBtn') : _ref$nextBtnText,
+    onNextStep = _ref.onNextStep;
+  var store = useStore();
+  var _useState = useState(_value),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1]; // 当前选择的字段
+  var _useState3 = useState(_value === null || _value === void 0 || (_value$ = _value[0]) === null || _value$ === void 0 ? void 0 : _value$.tableUuid),
+    _useState4 = _slicedToArray(_useState3, 2),
+    curTable = _useState4[0],
+    setCurTable = _useState4[1]; // 当前选择的表
+  // const [curColumn, setCurColumn] = useState(_value); // 当前选择的字段
+  var _useState5 = useState(data.map(function (v, i) {
+      var open = !i && !curTable ? true : v.tableUuid === curTable; // TODO.这里只判断表名相等 没有用了 因为表上面加了一层数据源 先这样吧
+      return _objectSpread(_objectSpread({}, v), {}, {
+        open: open,
+        searchText: '',
+        columns: v.columns.slice()
+      });
+    })),
+    _useState6 = _slicedToArray(_useState5, 2),
+    tableList = _useState6[0],
+    setTableList = _useState6[1];
+  // useEffect(() => {
+  //   setCurTable(tableInfo);
+  // }, [tableInfo]);
+  useEffect(function () {
+    // setCurColumn(_value);
+    setValue(_value);
+  }, [_value]);
+  var isActive = function isActive(fieldUuid) {
+    return (value === null || value === void 0 ? void 0 : value.filter(function (v) {
+      return v.fieldUuid === fieldUuid;
+    }).length) > 0;
+  };
+  useEffect(function () {
+    setTableList(data.map(function (v, i) {
+      var open = !i && !curTable ? true : v.tableUuid === curTable; // TODO.这里只判断表名相等 没有用了 因为表上面加了一层数据源 先这样吧
+      return _objectSpread(_objectSpread({}, v), {}, {
+        open: open,
+        searchText: '',
+        columns: v.columns.slice()
+      });
+    }));
+  }, [data, curTable]);
+  useEffect(function () {
+    didUpdate === null || didUpdate === void 0 || didUpdate();
+  }, [tableList]);
+  function _onInput(val, tableAlias) {
+    var newData = cloneDeep(tableList).map(function (v, i) {
+      if (v.alias === tableAlias) {
+        var _data$i;
+        return _objectSpread(_objectSpread({}, v), {}, {
+          columns: (_data$i = data[i]) === null || _data$i === void 0 ? void 0 : _data$i.columns.filter(function (v) {
+            return ~(v.name + (v.name_zh || '')).toLocaleLowerCase().indexOf(val.toLocaleLowerCase());
+          }),
+          searchText: val
+        });
+      }
+      return v;
+    });
+    setTableList(newData);
+  }
+  var getQuotes = function getQuotes(items) {
+    return items.map(function (v) {
+      return v.fieldName;
+    }).join(' || ');
+  };
+  var changeValue = function changeValue(tableUuid, val) {
+    var _value$filter;
+    if (!multiple) {
+      var _data = val ? [val] : [];
+      setValue(_data);
+      setCurTable(tableUuid);
+      onSelect === null || onSelect === void 0 || onSelect(_data, getQuotes(_data));
+      return;
+    }
+    var isHas = (value === null || value === void 0 || (_value$filter = value.filter(function (v) {
+      return v.fieldUuid === (val === null || val === void 0 ? void 0 : val.fieldUuid);
+    })) === null || _value$filter === void 0 ? void 0 : _value$filter.length) > 0;
+    var _value = value;
+    if (tableUuid != curTable) {
+      _value = [];
+    }
+    if (!isHas && val) {
+      _value.push(val);
+    } else {
+      _value = _value.filter(function (v) {
+        return v.fieldUuid != (val === null || val === void 0 ? void 0 : val.fieldUuid);
+      });
+    }
+    setValue(_value);
+    setCurTable(tableUuid);
+    onSelect === null || onSelect === void 0 || onSelect(_value, getQuotes(_value));
+  };
+  // const _condition = value?.condition || '';
+  return _jsxs(_Fragment, {
+    children: [_jsx("div", {
+      className: cx("Sqb-SelectColumns--box ".concat(theme)),
+      children: _jsx("div", {
+        style: {
+          width: 300
+        },
+        children: tableList.map(function (tableItem) {
+          var tableAlias = tableItem.alias,
+            tableName = tableItem.name,
+            columns = tableItem.columns,
+            open = tableItem.open,
+            searchText = tableItem.searchText,
+            _tableItem$datasource = tableItem.datasourceName,
+            datasourceName = _tableItem$datasource === void 0 ? '' : _tableItem$datasource,
+            _tableItem$datasource2 = tableItem.datasourceId,
+            datasourceId = _tableItem$datasource2 === void 0 ? '' : _tableItem$datasource2,
+            _tableItem$tableUuid = tableItem.tableUuid,
+            tableUuid = _tableItem$tableUuid === void 0 ? '' : _tableItem$tableUuid;
+          var isMultiple = tableList.length > 1;
+          var isSummarize = tableAlias === SummarizeAlias;
+          return _jsxs("div", {
+            children: [!isSummarize && _jsx("div", {
+              className: cx("Sqb-List-section"),
+              children: _jsx("div", {
+                className: cx("Sqb-List-title mx-4 pb-4 pt-4", {
+                  shrink: isMultiple,
+                  active: open
+                }),
+                onClick: function onClick() {
+                  if (isGroup) {
+                    changeValue(tableUuid);
+                  }
+                  if (!isMultiple) return void 0;
+                  var newTables = cloneDeep(tableList);
+                  if (open) {
+                    setTableList(newTables.map(function (v) {
+                      return _objectSpread(_objectSpread({}, v), {}, {
+                        open: tableUuid === v.tableUuid ? false : v.open
+                      });
+                    }));
+                  } else {
+                    setTableList(newTables.map(function (v) {
+                      return _objectSpread(_objectSpread({}, v), {}, {
+                        open: tableUuid === v.tableUuid || v.alias === SummarizeAlias
+                      });
+                    }));
+                  }
+                },
+                children: _jsxs("div", {
+                  className: 'List-item',
+                  children: [_jsx("span", {
+                    className: 'List-item-icon',
+                    children: _jsx(TableIcon, {})
+                  }), _jsx("div", {
+                    style: {
+                      overflow: 'hidden'
+                    },
+                    children: _jsx("h3", {
+                      className: 'List-item-title ml-2',
+                      title: datasourceName ? "".concat(datasourceName, ".").concat(tableAlias || tableName) : tableAlias || tableName,
+                      children: datasourceName ? "".concat(datasourceName, ".").concat(tableAlias || tableName) : tableAlias || tableName
+                    })
+                  }), isMultiple && !isGroup && _jsx("span", {
+                    className: 'List-title-arrow',
+                    children: open ? _jsx(UpArrowIcon2, {}) : _jsx(DownArrowIcon2, {})
+                  })]
+                })
+              })
+            }), (open || isSummarize) && _jsxs(_Fragment, {
+              children: [!isSummarize && !isGroup && _jsx("div", {
+                className: cx("Sqb-List-section"),
+                children: _jsxs("div", {
+                  className: cx("Sqb-List-search m-2 rounded-lg"),
+                  children: [_jsx("span", {
+                    className: 'px-2',
+                    children: _jsx(SearchIcon, {})
+                  }), _jsx("input", {
+                    type: 'text',
+                    className: 'p-2',
+                    autoFocus: true,
+                    value: searchText,
+                    placeholder: __('joinData.search'),
+                    onChange: function onChange() {},
+                    onInput: function onInput(e) {
+                      return _onInput(e.target.value, tableAlias);
+                    }
+                  })]
+                })
+              }), Array.isArray(columns) && columns.map(function (v, i) {
+                var special_type = v.special_type,
+                  _v$database_type = v.database_type,
+                  database_type = _v$database_type === void 0 ? '' : _v$database_type,
+                  name = v.name,
+                  _v$realName = v.realName,
+                  realName = _v$realName === void 0 ? '' : _v$realName,
+                  fieldId = v.id;
+                var groupe = SQL_GROUP_TYPE.STRING;
+                // @ts-ignore
+                if (~NUMBER_GROUP.indexOf(database_type)) {
+                  groupe = SQL_GROUP_TYPE.NUMBER;
+                }
+                // @ts-ignore
+                if (~DATE_GROUP.indexOf(database_type)) {
+                  groupe = SQL_GROUP_TYPE.DATE;
+                }
+                // let showCondition =
+                //   curColumn === name && curTable === tableUuid && _condition;
+                return _jsx("div", {
+                  className: cx("Sqb-List-section"),
+                  children: _jsx("div", {
+                    className: cx("Sqb-List-item mx-2", {
+                      active: isActive(v.fieldUuid)
+                    }),
+                    onClick: function onClick() {
+                      if (isSummarize) {
+                        // console.log(v, 'v');
+                      }
+                      console.log('🚀 ~ SelectJoinColumn ~ tableItem:', tableItem);
+                      changeValue(tableUuid, {
+                        tableName: tableItem.name,
+                        tableId: tableItem.id,
+                        tableNameZh: tableItem.name_zh,
+                        tableAlias: tableItem.alias,
+                        tableUuid: tableItem.tableUuid,
+                        datasourceName: tableItem.datasourceName || '',
+                        datasourceId: tableItem.datasourceId || '',
+                        fieldName: v.name,
+                        fieldId: v.id,
+                        fieldNameZh: v.name_zh || '',
+                        fieldAlias: v.fieldAlias,
+                        fieldUuid: v.fieldUuid,
+                        type: AtomsTypeEnum.FIELD
+                        // quotes: v.fieldAlias || v.name,
+                      });
+                      // setCurTable(tableUuid);
+                      // typeof onSelect === 'function' &&
+                      //   onSelect({
+                      //     ...v,
+                      //     table,
+                      //     tableId,
+                      //     alias: tableAlias,
+                      //     name,
+                      //     database_type,
+                      //     sql: v.sql || '',
+                      //     datasourceId,
+                      //     datasourceName,
+                      //     realName,
+                      //   });
+                    },
+                    children: _jsxs("div", {
+                      className: 'p-2 List-item',
+                      children: [_jsx("span", {
+                        className: 'List-item-icon',
+                        children: IconMap[special_type || database_type] || _jsx(LetterAaIcon, {})
+                      }), _jsx("div", {
+                        children: _jsx("h4", {
+                          className: 'List-item-title ml-2',
+                          children: replaceTpl(store.fieldNameTpl, v)
+                        })
+                      })]
+                    })
+                  })
+                }, i);
+              })]
+            })]
+          }, tableUuid || tableAlias);
+        })
+      })
+    }), showNextBtn && multiple && _jsx(Button, {
+      block: true,
+      disabled: (value === null || value === void 0 ? void 0 : value.length) < 1,
+      primary: true,
+      className: 'mt-4 :Sqb-SelectColumns-btn',
+      onClick: function onClick() {
+        return onNextStep === null || onNextStep === void 0 ? void 0 : onNextStep();
+      },
+      children: nextBtnText
+    })]
+  });
+};
+export default SelectJoinColumn;