@gingkoo/pandora-metabase 0.0.1-alpha.3 → 0.0.1-alpha.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +58 -26
- package/lib/es/index.js +36 -20
- package/lib/es/index.js.map +1 -1
- package/lib/es/metabase.d.ts +2 -2
- package/lib/es/store/index.d.ts +5 -0
- package/lib/es/store/types.d.ts +1 -0
- package/lib/es/types.d.ts +8 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
|
|
7
7
|
### 主要功能
|
|
8
8
|
|
|
9
|
-
- **动态获取表字段**：使用 `
|
|
9
|
+
- **动态获取表字段**：使用 `getColumns` 方法可以动态获取指定表的最新字段信息。
|
|
10
10
|
- **可视化 SQL 构建**：通过 `MetaBase` 组件，用户能够以图形化的方式构建 SQL 查询，支持多种元数据类型，如 `MetaData`, `MetaJoin`, `MetaFilter` 等。
|
|
11
11
|
- **灵活扩展**：提供了丰富的接口和类型定义，便于根据具体需求进行定制和扩展。
|
|
12
12
|
|
|
@@ -22,11 +22,7 @@ export type MetaListType =
|
|
|
22
22
|
| MetaSort
|
|
23
23
|
| MetaLimit;
|
|
24
24
|
|
|
25
|
-
|
|
26
|
-
name: string; // 表名
|
|
27
|
-
alias: string; // 别名
|
|
28
|
-
}
|
|
29
|
-
|
|
25
|
+
// Columns 集合
|
|
30
26
|
export interface MetaData_ColumnsType {
|
|
31
27
|
name: string; // 字段名
|
|
32
28
|
name_zh: string; // 字段中文名称
|
|
@@ -34,18 +30,34 @@ export interface MetaData_ColumnsType {
|
|
|
34
30
|
special_type: SpecialType | string; // 特殊类型，如主键、外键等
|
|
35
31
|
select: boolean; // 是否在查询中选中该字段
|
|
36
32
|
}
|
|
37
|
-
|
|
38
|
-
|
|
33
|
+
export type ToolbarType =
|
|
34
|
+
| 'filter'
|
|
35
|
+
| 'summarize'
|
|
36
|
+
| 'joinData'
|
|
37
|
+
| 'permissionTable'
|
|
38
|
+
| 'customColumn'
|
|
39
|
+
| 'sort'
|
|
40
|
+
| 'rowLimit';
|
|
39
41
|
|
|
40
42
|
export interface MetaBaseProps {
|
|
41
43
|
loading?: boolean; // 加载状态
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
44
|
+
btnText?: string; //按钮文字
|
|
45
|
+
showPermissionTable?: boolean; // 是否显示权限表
|
|
46
|
+
showFields?:boolean ; //是否显示字段
|
|
47
|
+
/**
|
|
48
|
+
* 工具栏列表
|
|
49
|
+
* 默认 ['filter','summarize','joinData','permissionTable','customColumn','sort','rowLimit']
|
|
50
|
+
*/
|
|
51
|
+
toolbar?:ToolbarType[]｜false;
|
|
52
|
+
readonly?: boolean; //是否只读
|
|
53
|
+
getTables: (datasourceId: string) => Promise<any>; //获取表
|
|
54
|
+
getColumns: (table: string, datasourceId: string) => Promise<any>;//获取数据源
|
|
55
|
+
onOk: (params: any) => Promise<void>;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
export interface SqlVisionBuilderRef {
|
|
59
|
+
setDatasource: (list: DatasourceType[]) => void; // 设置数据源列表
|
|
60
|
+
setPreData: (data: MetaListType[]) => void; // 设置回显数据
|
|
49
61
|
}
|
|
50
62
|
|
|
51
63
|
```
|
|
@@ -58,21 +70,41 @@ export interface MetaBaseProps {
|
|
|
58
70
|
|
|
59
71
|
<MetaBase
|
|
60
72
|
value={value}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
73
|
+
showFields={false}
|
|
74
|
+
toolbar={[
|
|
75
|
+
'filter',
|
|
76
|
+
'summarize',
|
|
77
|
+
'joinData',
|
|
78
|
+
'permissionTable',
|
|
79
|
+
'customColumn',
|
|
80
|
+
'sort',
|
|
81
|
+
'rowLimit',
|
|
82
|
+
]}
|
|
83
|
+
getTables={async (id: string) => {
|
|
84
|
+
let tables = [
|
|
85
|
+
'YBT_PM_BHJQTDBXY',
|
|
86
|
+
];
|
|
87
|
+
|
|
88
|
+
return tables.map((item) => {
|
|
89
|
+
return {
|
|
90
|
+
name: item,
|
|
91
|
+
alias: item,
|
|
92
|
+
};
|
|
93
|
+
});
|
|
94
|
+
}}
|
|
95
|
+
getColumns={async (name: string) => {
|
|
64
96
|
let data: MetaData_ColumnsType[] = [
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
97
|
+
{
|
|
98
|
+
database_type: 'STRING',
|
|
99
|
+
name: 'C_RSV5',
|
|
100
|
+
select: true,
|
|
101
|
+
special_type: '',
|
|
102
|
+
name_zh: '备用字段（项目组可使用）',
|
|
103
|
+
},
|
|
72
104
|
];
|
|
73
105
|
return data;
|
|
74
106
|
}}
|
|
75
|
-
|
|
107
|
+
onOk={(v) => {
|
|
76
108
|
console.log(v);
|
|
77
109
|
}}
|
|
78
110
|
/>
|
package/lib/es/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @gingkoo/pandora-metabase v0.0.1-alpha.
|
|
2
|
+
* @gingkoo/pandora-metabase v0.0.1-alpha.5
|
|
3
3
|
*/
|
|
4
4
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
5
5
|
import * as React from 'react';
|
|
@@ -336,7 +336,7 @@ const Loading = ({
|
|
|
336
336
|
});
|
|
337
337
|
};
|
|
338
338
|
|
|
339
|
-
var css_248z$b = ".mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.m-2 {\n margin: 0.5rem;\n}\n.mx-2 {\n margin-left: 0.5rem;\n margin-right: 0.5rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.ml-4 {\n margin-left: 1rem;\n}\n.mr-4 {\n margin-right: 1rem;\n}\n.mr-2 {\n margin-right: 0.5rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.block {\n display: block;\n}\n.w-full {\n width: 100%;\n}\n.font-bold {\n font-weight: 700;\n}\n.uppercase {\n text-transform: uppercase;\n}\n.tracking-wider {\n letter-spacing: 0.05em;\n}\n.relative {\n position: relative;\n}\n.absolute {\n position: absolute;\n}\n.top-0 {\n top: 0px;\n}\n.left-0 {\n left: 0;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.text-gray-500 {\n color: #6b7280;\n}\n.flex {\n display: flex;\n}\n.items-center {\n align-items: center;\n}\n.justify-center {\n justify-content: center;\n}\n.visual-box {\n position: relative;\n width: 100%;\n height: 100%;\n overflow-y: scroll;\n overflow-x: hidden;\n transition: all 0.3s;\n z-index: 3;\n background-color: #fff;\n}\n.Sqb {\n padding: 0 20px 50px;\n}\n.Sqb-list {\n padding-top: 1.5rem;\n}\n.Sqb-hover-parent {\n margin-bottom: 16px;\n padding-bottom: 16px;\n}\n.Sqb-item {\n font-size: 14px;\n}\n.Sqb-item--text {\n color: #509ee3;\n width: 66.6667%;\n box-sizing: border-box;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n font-weight: 600;\n}\n.Sqb-item--text.purple-text {\n color: #7172ad;\n}\n.Sqb-item--text.gray-text {\n color: #93a1ab;\n}\n.Sqb-item--text.green-text {\n color: #88bf4d;\n}\n.Sqb-item-close {\n width: 16px;\n height: 16px;\n color: #b8bbc3;\n margin-left: auto;\n visibility: hidden;\n cursor: pointer;\n}\n.Sqb-item--content {\n width: 66.6667%;\n box-sizing: border-box;\n}\n.Sqb-item--content .Sqb-NotebookCell {\n box-sizing: border-box;\n padding: 16px 16px 8px;\n color: #509ee3;\n display: flex;\n flex-wrap: wrap;\n -webkit-box-align: center;\n align-items: center;\n border-radius: 8px;\n background-color: rgba(80, 158, 227, 0.1);\n}\n.Sqb-item--content .Sqb-NotebookCell.gray-bg {\n background-color: rgba(147, 161, 171, 0.1);\n}\n.Sqb-item--content .Sqb-NotebookCell.green-bg {\n background-color: rgba(136, 191, 77, 0.1);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName {\n border: 2px solid transparent;\n border-radius: 6px;\n color: white;\n background-color: #509ee3;\n transition: background 300ms linear 0s
|
|
339
|
+
var css_248z$b = ".mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.m-2 {\n margin: 0.5rem;\n}\n.mx-2 {\n margin-left: 0.5rem;\n margin-right: 0.5rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.ml-4 {\n margin-left: 1rem;\n}\n.mr-4 {\n margin-right: 1rem;\n}\n.mr-2 {\n margin-right: 0.5rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.block {\n display: block;\n}\n.w-full {\n width: 100%;\n}\n.font-bold {\n font-weight: 700;\n}\n.uppercase {\n text-transform: uppercase;\n}\n.tracking-wider {\n letter-spacing: 0.05em;\n}\n.relative {\n position: relative;\n}\n.absolute {\n position: absolute;\n}\n.top-0 {\n top: 0px;\n}\n.left-0 {\n left: 0;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.text-gray-500 {\n color: #6b7280;\n}\n.flex {\n display: flex;\n}\n.items-center {\n align-items: center;\n}\n.justify-center {\n justify-content: center;\n}\n.visual-box {\n position: relative;\n width: 100%;\n height: 100%;\n overflow-y: scroll;\n overflow-x: hidden;\n transition: all 0.3s;\n z-index: 3;\n background-color: #fff;\n}\n.Sqb {\n padding: 0 20px 50px;\n}\n.Sqb-list {\n padding-top: 1.5rem;\n}\n.Sqb-hover-parent {\n margin-bottom: 16px;\n padding-bottom: 16px;\n}\n.Sqb-item {\n font-size: 14px;\n}\n.Sqb-item--text {\n color: #509ee3;\n width: 66.6667%;\n box-sizing: border-box;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n font-weight: 600;\n}\n.Sqb-item--text.purple-text {\n color: #7172ad;\n}\n.Sqb-item--text.gray-text {\n color: #93a1ab;\n}\n.Sqb-item--text.green-text {\n color: #88bf4d;\n}\n.Sqb-item-close {\n width: 16px;\n height: 16px;\n color: #b8bbc3;\n margin-left: auto;\n visibility: hidden;\n cursor: pointer;\n}\n.Sqb-item--content {\n width: 66.6667%;\n box-sizing: border-box;\n}\n.Sqb-item--content .Sqb-NotebookCell {\n box-sizing: border-box;\n padding: 16px 16px 8px;\n color: #509ee3;\n display: flex;\n flex-wrap: wrap;\n -webkit-box-align: center;\n align-items: center;\n border-radius: 8px;\n background-color: rgba(80, 158, 227, 0.1);\n}\n.Sqb-item--content .Sqb-NotebookCell.gray-bg {\n background-color: rgba(147, 161, 171, 0.1);\n}\n.Sqb-item--content .Sqb-NotebookCell.green-bg {\n background-color: rgba(136, 191, 77, 0.1);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName {\n border: 2px solid transparent;\n border-radius: 6px;\n color: white;\n background-color: #509ee3;\n transition: background 300ms linear 0s,\n border 300ms linear 0s;\n box-sizing: border-box;\n margin-bottom: 8px;\n margin-right: 8px;\n padding: 8px;\n display: flex;\n -webkit-box-align: center;\n align-items: center;\n cursor: pointer;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName::selection {\n color: #ffffff;\n background-color: #d489ac;\n text-shadow: none;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName:hover {\n background-color: rgba(80, 158, 227, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.noClick {\n cursor: default;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.noClick:hover {\n background-color: #509ee3;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.notSelected {\n border: 2px solid rgba(80, 158, 227, 0.25);\n color: #509ee3;\n background-color: transparent;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.notSelected:hover {\n border-color: rgba(80, 158, 227, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.purple-name {\n color: white;\n background-color: #7172ad;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.purple-name:hover {\n background-color: rgba(113, 114, 173, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.purple-name svg.closeIcon {\n opacity: 0.6;\n margin-left: 8px;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.purple-name.notSelected {\n border: 2px solid rgba(113, 114, 173, 0.25);\n color: #7172ad;\n background-color: transparent;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.purple-name.notSelected:hover {\n border-color: rgba(113, 114, 173, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.gray-name {\n color: white;\n background-color: #93a1ab;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.gray-name:hover {\n background-color: rgba(147, 161, 171, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.gray-name svg.sort-arrow {\n margin-right: 0.5rem;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.gray-name svg.closeIcon {\n opacity: 0.6;\n margin-left: 8px;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.green-name {\n color: white;\n background-color: #88bf4d;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.green-name:hover {\n background-color: rgba(136, 191, 77, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.green-name svg.closeIcon {\n opacity: 0.6;\n margin-left: 8px;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.green-name.notSelected {\n border: 2px solid rgba(136, 191, 77, 0.25);\n color: #88bf4d;\n background-color: transparent;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableName.green-name.notSelected:hover {\n border-color: rgba(136, 191, 77, 0.8);\n}\n.Sqb-item--content .Sqb-NotebookCell .ant-input-number {\n margin-bottom: 0.5rem;\n}\n.Sqb-item--content .Sqb-NotebookCell .ant-input-number .ant-input-number-input {\n height: 32px;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-where {\n box-sizing: border-box;\n display: flex;\n -webkit-box-align: center;\n align-items: center;\n}\n.Sqb-item--content .Sqb-NotebookCell .Sqb-TableColumns {\n font-weight: 600;\n margin-bottom: 0.5rem;\n margin-left: auto;\n cursor: pointer;\n}\n.Sqb-item--content .flex-row {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n align-items: center;\n flex-direction: row;\n}\n.Sqb-item--content .flex-row .Sqb-NotebookCell {\n width: 50%;\n}\n.Sqb-item--content .flex-row .pass {\n color: #88bf4d;\n margin: 4px 16px;\n font-size: 600;\n}\n.Sqb-item--func {\n box-sizing: border-box;\n margin-top: 8px;\n}\n.Sqb-item--func .Sqb-button {\n display: inline-block;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n font-weight: bold;\n padding: 12px 16px;\n border-radius: 6px;\n margin-right: 16px;\n margin-top: 16px;\n border: none;\n transition: background 300ms ease 0s;\n flex-shrink: 0;\n color: #93a1ab;\n background-color: #ffffff;\n}\n.Sqb-item--func .Sqb-button:hover {\n color: #7e8f9b;\n background-color: #eceff0;\n}\n.Sqb-item--func .Sqb-button > div {\n min-width: 60px;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n display: flex;\n}\n.Sqb-item--func .Sqb-button > div svg {\n flex-shrink: 0;\n}\n.Sqb-item--func .Sqb-button > div div {\n margin-top: 0.5rem;\n}\n.Sqb-item--func .Sqb-button.filter {\n color: #7172ad;\n background-color: #e0e0ed;\n}\n.Sqb-item--func .Sqb-button.filter:hover {\n color: #5d5ea0;\n background-color: #cccce1;\n}\n.Sqb-item--func .Sqb-button.summarize {\n color: #88bf4d;\n background-color: #d8eac5;\n}\n.Sqb-item--func .Sqb-button.summarize:hover {\n color: #79ae3f;\n background-color: #cae2af;\n}\n.Sqb-item--func .Sqb-button.joinData {\n color: #509ee3;\n background-color: #f1f7fd;\n}\n.Sqb-item--func .Sqb-button.joinData:hover {\n color: #328dde;\n background-color: #d4e7f8;\n}\n.Sqb-item--func .Sqb-button.small {\n margin-right: 8px;\n margin-top: 0;\n padding: 0.5rem;\n}\n.Sqb-item--func .Sqb-button.small > div {\n min-width: 0;\n}\n.Sqb-item--func .Sqb-button.small > div svg {\n width: 14px;\n height: 14px;\n}\n.Sqb-item--func .Sqb-button.small > div div {\n display: none;\n}\n.Sqb-item:hover .Sqb-item-close {\n visibility: visible;\n}\n.Sqb > .Sqb-btn {\n min-width: 220px;\n height: 36px;\n border-radius: 6px;\n color: #ffffff;\n background: #509ee3;\n border: 1px solid #509ee3;\n}\n.Sqb > .Sqb-btn:hover {\n background-color: rgba(80, 158, 227, 0.8) !important;\n}\n";
|
|
340
340
|
styleInject(css_248z$b);
|
|
341
341
|
|
|
342
342
|
var SortEnum;
|
|
@@ -2165,6 +2165,9 @@ class SqlVisionStore {
|
|
|
2165
2165
|
makeAutoObservable(this);
|
|
2166
2166
|
}
|
|
2167
2167
|
showPermissionTable = false; // 开启权限表
|
|
2168
|
+
showFields = true; // 开启权限表
|
|
2169
|
+
//工具列表
|
|
2170
|
+
toolbar = ['filter', 'summarize', 'joinData', 'permissionTable', 'customColumn', 'sort', 'rowLimit'];
|
|
2168
2171
|
sourceList = []; // 数据源列表
|
|
2169
2172
|
_cacheSource2TableMap = {}; // 数据源id 对应数据集列表
|
|
2170
2173
|
_cacheColumnsMap = {};
|
|
@@ -2364,6 +2367,12 @@ class SqlVisionStore {
|
|
|
2364
2367
|
setShowPermissionTable(show) {
|
|
2365
2368
|
this.showPermissionTable = show;
|
|
2366
2369
|
}
|
|
2370
|
+
setShowFields(show) {
|
|
2371
|
+
this.showFields = show;
|
|
2372
|
+
}
|
|
2373
|
+
setToolbar(toolbar) {
|
|
2374
|
+
this.toolbar = toolbar;
|
|
2375
|
+
}
|
|
2367
2376
|
}
|
|
2368
2377
|
const sqlVisionStore = new SqlVisionStore();
|
|
2369
2378
|
const Store = /*#__PURE__*/React__default.createContext(sqlVisionStore);
|
|
@@ -4317,19 +4326,23 @@ const IconTypeMap = new Map([[TypeEnum.filter, {
|
|
|
4317
4326
|
}], [TypeEnum.joinData, {
|
|
4318
4327
|
name: __('SqlQueryBuilder.joinData'),
|
|
4319
4328
|
icon: jsx(JoinDataIcon, {}),
|
|
4320
|
-
className: '
|
|
4329
|
+
className: 'joinData'
|
|
4321
4330
|
}], [TypeEnum.permissionTable, {
|
|
4322
4331
|
name: __('SqlQueryBuilder.permissionTable'),
|
|
4323
|
-
icon: jsx(PermissionTableIcon, {})
|
|
4332
|
+
icon: jsx(PermissionTableIcon, {}),
|
|
4333
|
+
className: 'permissionTable'
|
|
4324
4334
|
}], [TypeEnum.customColumn, {
|
|
4325
4335
|
name: __('SqlQueryBuilder.customColumn'),
|
|
4326
|
-
icon: jsx(CustomColumnIcon, {})
|
|
4336
|
+
icon: jsx(CustomColumnIcon, {}),
|
|
4337
|
+
className: 'customColumn'
|
|
4327
4338
|
}], [TypeEnum.sort, {
|
|
4328
4339
|
name: __('SqlQueryBuilder.sort'),
|
|
4329
|
-
icon: jsx(SortIcon, {})
|
|
4340
|
+
icon: jsx(SortIcon, {}),
|
|
4341
|
+
className: 'sort'
|
|
4330
4342
|
}], [TypeEnum.rowLimit, {
|
|
4331
4343
|
name: __('SqlQueryBuilder.rowLimit'),
|
|
4332
|
-
icon: jsx(RowLimitIcon, {})
|
|
4344
|
+
icon: jsx(RowLimitIcon, {}),
|
|
4345
|
+
className: 'rowLimit'
|
|
4333
4346
|
}]]);
|
|
4334
4347
|
// 前端展示的icon顺序 随便改不影响逻辑
|
|
4335
4348
|
const DisplayOrder = [TypeEnum.filter, TypeEnum.summarize, TypeEnum.joinData, TypeEnum.permissionTable, TypeEnum.customColumn, TypeEnum.sort, TypeEnum.rowLimit];
|
|
@@ -4587,7 +4600,7 @@ const NextDom = props => {
|
|
|
4587
4600
|
const MetaIconDom = metaIcon(size, handleClick);
|
|
4588
4601
|
return jsx("div", {
|
|
4589
4602
|
className: `Sqb-item--func`,
|
|
4590
|
-
children: sortList(available).map(v => jsx(MetaIconDom, {
|
|
4603
|
+
children: sortList(available).filter(v => ~store.toolbar.indexOf(v)).map(v => jsx(MetaIconDom, {
|
|
4591
4604
|
type: v
|
|
4592
4605
|
}, v))
|
|
4593
4606
|
});
|
|
@@ -4671,7 +4684,7 @@ const TableData = props => {
|
|
|
4671
4684
|
}),
|
|
4672
4685
|
onClick: selectTable,
|
|
4673
4686
|
children: selected ? `${meta.table.datasourceName}.${meta.table.name}` : __('SqlQueryBuilder.pickTable')
|
|
4674
|
-
}), selected && store.showMainColumn && jsx("div", {
|
|
4687
|
+
}), selected && store.showMainColumn && store.showFields && jsx("div", {
|
|
4675
4688
|
className: `Sqb-TableColumns`,
|
|
4676
4689
|
onClick: selectColumns,
|
|
4677
4690
|
children: __('SqlQueryBuilder.columns')
|
|
@@ -4991,7 +5004,7 @@ const JoinData = props => {
|
|
|
4991
5004
|
onClick: selectJoinColumn,
|
|
4992
5005
|
children: meta.table2.column ? meta.table2.column : __('SqlQueryBuilder.pickTable')
|
|
4993
5006
|
})]
|
|
4994
|
-
}), columnsSelected && jsx("div", {
|
|
5007
|
+
}), columnsSelected && store.showFields && jsx("div", {
|
|
4995
5008
|
className: `Sqb-TableColumns`,
|
|
4996
5009
|
onClick: selectColumns,
|
|
4997
5010
|
children: __('SqlQueryBuilder.columns')
|
|
@@ -6545,6 +6558,7 @@ const VisualBox = Styled.div.attrs({
|
|
|
6545
6558
|
const Metabase = observer(props => {
|
|
6546
6559
|
let {
|
|
6547
6560
|
btnText = '',
|
|
6561
|
+
readonly = false,
|
|
6548
6562
|
onOk
|
|
6549
6563
|
} = props;
|
|
6550
6564
|
const store = useStore();
|
|
@@ -6576,7 +6590,7 @@ const Metabase = observer(props => {
|
|
|
6576
6590
|
meta: meta
|
|
6577
6591
|
}, metaKey);
|
|
6578
6592
|
})
|
|
6579
|
-
}), jsx(Button, {
|
|
6593
|
+
}), !readonly && typeof onOk === 'function' ? jsx(Button, {
|
|
6580
6594
|
type: 'primary',
|
|
6581
6595
|
className: `Sqb-btn`,
|
|
6582
6596
|
icon: saveLoading ? jsx(LoadingOutlined, {}) : null,
|
|
@@ -6587,11 +6601,11 @@ const Metabase = observer(props => {
|
|
|
6587
6601
|
}
|
|
6588
6602
|
if (saveLoading) return null;
|
|
6589
6603
|
setSaveLoading(true);
|
|
6590
|
-
await onOk
|
|
6604
|
+
await onOk(toJS(store.metaList));
|
|
6591
6605
|
setSaveLoading(false);
|
|
6592
6606
|
},
|
|
6593
6607
|
children: btnText || __('SqlQueryBuilder.visualize')
|
|
6594
|
-
}), popupContainer.current && jsx(Popup, {
|
|
6608
|
+
}) : null, popupContainer.current && jsx(Popup, {
|
|
6595
6609
|
container: popupContainer.current,
|
|
6596
6610
|
visible: store.popupData.visible,
|
|
6597
6611
|
node: store.popupData.node,
|
|
@@ -6617,24 +6631,26 @@ const Metabase = observer(props => {
|
|
|
6617
6631
|
const SqlVisionBuilder = /*#__PURE__*/React__default.forwardRef((props, ref) => {
|
|
6618
6632
|
let {
|
|
6619
6633
|
loading = false,
|
|
6620
|
-
showPermissionTable,
|
|
6634
|
+
showPermissionTable = false,
|
|
6635
|
+
showFields = true,
|
|
6621
6636
|
getTables,
|
|
6622
|
-
getColumns
|
|
6637
|
+
getColumns,
|
|
6638
|
+
toolbar = ['filter', 'summarize', 'joinData', 'permissionTable', 'customColumn', 'sort', 'rowLimit']
|
|
6623
6639
|
} = props;
|
|
6624
6640
|
const store = useStore();
|
|
6625
6641
|
useEffect(() => {
|
|
6626
6642
|
getTables && store.setFetchDatasetFn(getTables);
|
|
6627
6643
|
getColumns && store.setFetchColumnsFn(getColumns);
|
|
6628
|
-
if (showPermissionTable) {
|
|
6629
|
-
store.setShowPermissionTable(showPermissionTable);
|
|
6630
|
-
}
|
|
6631
6644
|
}, []);
|
|
6645
|
+
useEffect(() => {
|
|
6646
|
+
store.setShowPermissionTable(showPermissionTable);
|
|
6647
|
+
store.setShowFields(showFields);
|
|
6648
|
+
store.setToolbar(toolbar || []);
|
|
6649
|
+
}, [showFields, showPermissionTable, toolbar]);
|
|
6632
6650
|
React__default.useImperativeHandle(ref, () => ({
|
|
6633
|
-
// 设置数据源列表
|
|
6634
6651
|
setDatasource: list => {
|
|
6635
6652
|
store.setSourceList(list);
|
|
6636
6653
|
},
|
|
6637
|
-
// 设置回显数据
|
|
6638
6654
|
setPreData: data => {
|
|
6639
6655
|
store.setPreData(data);
|
|
6640
6656
|
}
|