topdog/supersonic
1
0
Fork 0
mirror of https://github.com/tencentmusic/supersonic.git synced 2026-04-20 21:54:19 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

[improvement][semantic-fe] Refactor database settings functionality.

Browse Source
This commit is contained in:
tristanliu
2023-09-04 12:29:07 +08:00
parent d5c5c63a75
commit f5a7068d5e
34 changed files with 1222 additions and 441 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
webapp/packages/supersonic-fe/src/pages/SemanticModel/Metric/components/MetricFilter.tsx
View File

@@ -1,4 +1,4 @@
import { Form, Input } from 'antd';
import { Form, Input, Space, Row, Col } from 'antd';
import StandardFormRow from '@/components/StandardFormRow';
import TagSelect from '@/components/TagSelect';
import React, { useEffect } from 'react';
@@ -32,17 +32,17 @@ const MetricFilter: React.FC<Props> = ({ filterValues = {}, onFiltersChange }) =
};
const filterList = [
{
title: '指标类型',
key: 'type',
options: [
{
value: 'ATOMIC',
label: '原子指标',
},
{ value: 'DERIVED', label: '衍生指标' },
],
},
// {
// title: '指标类型',
// key: 'type',
// options: [
// {
// value: 'ATOMIC',
// label: '原子指标',
// },
// { value: 'DERIVED', label: '衍生指标' },
// ],
// },
{
title: '敏感度',
key: 'sensitiveLevel',
@@ -56,7 +56,7 @@ const MetricFilter: React.FC<Props> = ({ filterValues = {}, onFiltersChange }) =
form={form}
colon={false}
onValuesChange={(value, values) => {
if (value.name) {
if (value.key) {
return;
}
handleValuesChange(value, values);
@@ -64,38 +64,60 @@ const MetricFilter: React.FC<Props> = ({ filterValues = {}, onFiltersChange }) =
>
<StandardFormRow key="search" block>
<div className={styles.searchBox}>
<FormItem name={'key'} noStyle>
<div className={styles.searchInput}>
<Input.Search
placeholder="请输入需要查询指标的ID、指标名称、字段名称"
enterButton={<SearchOutlined style={{ marginTop: 5 }} />}
onSearch={onSearch}
/>
</div>
</FormItem>
<Row>
<Col flex="100px">
<span
style={{
fontSize: '18px',
fontWeight: 'bold',
position: 'relative',
top: '12px',
}}
>
指标搜索
</span>
</Col>
<Col flex="auto">
<FormItem name="key" noStyle>
<div className={styles.searchInput}>
<Input.Search
placeholder="请输入需要查询指标的ID、指标名称、字段名称"
enterButton={<SearchOutlined style={{ marginTop: 5 }} />}
onSearch={(value) => {
onSearch(value);
}}
/>
</div>
</FormItem>
</Col>
</Row>
</div>
</StandardFormRow>
{filterList.map((item) => {
const { title, key, options } = item;
return (
<StandardFormRow key={key} title={title} block>
<FormItem name={key}>
<TagSelect reverseCheckAll single>
{options.map((item: any) => (
<TagSelect.Option key={item.value} value={item.value}>
{item.label}
</TagSelect.Option>
))}
</TagSelect>
</FormItem>
</StandardFormRow>
);
})}
<StandardFormRow key="domainIds" title="所属主题域" block>
<FormItem name="domainIds">
<DomainTreeSelect />
</FormItem>
</StandardFormRow>
<Space size={80}>
<StandardFormRow key="domainIds" title="所属主题域" block>
<FormItem name="domainIds">
<DomainTreeSelect />
</FormItem>
</StandardFormRow>
{filterList.map((item) => {
const { title, key, options } = item;
return (
<StandardFormRow key={key} title={title} block>
<div style={{ marginLeft: -30 }}>
<FormItem name={key}>
<TagSelect reverseCheckAll single>
{options.map((item: any) => (
<TagSelect.Option key={item.value} value={item.value}>
{item.label}
</TagSelect.Option>
))}
</TagSelect>
</FormItem>
</div>
</StandardFormRow>
);
})}
</Space>
</Form>
);
};

51
webapp/packages/supersonic-fe/src/pages/SemanticModel/Metric/index.tsx
View File

@@ -28,7 +28,7 @@ type QueryMetricListParams = {
};
const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
const { selectDomainId } = domainManger;
const { selectDomainId, selectModelId: modelId } = domainManger;
const [createModalVisible, setCreateModalVisible] = useState<boolean>(false);
const [pagination, setPagination] = useState({
current: 1,
@@ -45,13 +45,17 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
queryMetricList();
}, []);
const queryMetricList = async (params: QueryMetricListParams = {}) => {
setLoading(true);
const queryMetricList = async (params: QueryMetricListParams = {}, disabledLoading = false) => {
if (!disabledLoading) {
setLoading(true);
}
const { code, data, msg } = await queryMetric({
...pagination,
...params,
});
setLoading(false);
if (!disabledLoading) {
setLoading(false);
}
const { list, pageSize, current, total } = data || {};
let resData: any = {};
if (code === 200) {
@@ -86,15 +90,15 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
dataIndex: 'name',
title: '指标名称',
},
{
dataIndex: 'alias',
title: '别名',
search: false,
},
{
dataIndex: 'bizName',
title: '字段名称',
},
// {
// dataIndex: 'alias',
// title: '别名',
// search: false,
// },
// {
// dataIndex: 'bizName',
// title: '字段名称',
// },
{
dataIndex: 'modelName',
title: '所属模型',
@@ -114,14 +118,14 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
title: '描述',
search: false,
},
{
dataIndex: 'type',
title: '指标类型',
valueEnum: {
ATOMIC: '原子指标',
DERIVED: '衍生指标',
},
},
// {
// dataIndex: 'type',
// title: '指标类型',
// valueEnum: {
// ATOMIC: '原子指标',
// DERIVED: '衍生指标',
// },
// },
{
dataIndex: 'updatedAt',
@@ -178,7 +182,7 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
];
const handleFilterChange = async (filterParams: {
name: string;
key: string;
sensitiveLevel: string;
type: string;
}) => {
@@ -190,7 +194,7 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
params.sensitiveLevel = sensitiveLevelValue;
params.type = typeValue;
setFilterParams(params);
await queryMetricList(params);
await queryMetricList(params, filterParams.key ? false : true);
};
return (
@@ -231,6 +235,7 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
<MetricInfoCreateForm
domainId={Number(selectDomainId)}
createModalVisible={createModalVisible}
modelId={modelId}
metricItem={metricItem}
onSubmit={() => {
setCreateModalVisible(false);