topdog/supersonic
1
0
Fork 0
mirror of https://github.com/tencentmusic/supersonic.git synced 2025-12-10 19:18:23 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[improvement][headless-fe] Revamped the dimension value settings in the assistant module. (#1842)

Browse Source 
* [improvement][semantic-fe] Fixing the logic error in the dimension value setting.

* [improvement][semantic-fe] Fixing the synchronization issue with the question and answer settings information.

* [improvement][semantic-fe] Optimizing the canvas functionality for better performance and user experience.

* [improvement][semantic-fe] Optimizing the update process for drawing model relationship edges in the canvas.

* [improvement][semantic-fe] Changing the line type for canvas connections.

* [improvement][semantic-fe] Replacing the initialization variable from "semantic" to "headless".

* [improvement][semantic-fe] Fixing the missing migration issue for default drill-down dimension configuration in model editing. Additionally, optimizing the data retrieval method for initializing fields in the model.

* [improvement][semantic-fe] Updating the logic for the fieldName.

* [improvement][semantic-fe] Adjusting the position of the metrics tab.

* [improvement][semantic-fe] Changing the 字段名称 to 英文名称.

* [improvement][semantic-fe] Fix metric measurement deletion.

* [improvement][semantic-fe] UI optimization for metric details page.

* [improvement][semantic-fe] UI optimization for metric details page.

* [improvement][semantic-fe] UI adjustment for metric details page.

* [improvement][semantic-fe] The granularity field in the time type of model editing now supports setting it as empty.

* [improvement][semantic-fe] Added field type and metric type to the metric creation options.

* [improvement][semantic-fe] The organization structure selection feature has been added to the permission management.

* [improvement][semantic-fe] Improved user experience for the metric list.

* [improvement][semantic-fe] fix update the metric list.

* [improvement][headless-fe] Added view management functionality.

* [improvement][headless-fe] The view management functionality has been added. This feature allows users to create, edit, and manage different views within the system.

* [improvement][headless-fe] Added model editing side effect detection.

* [improvement][headless-fe] Fixed the logic error in view editing.

* [improvement][headless-fe] Fixed the issue with initializing dimension associations in metric settings.

* [improvement][headless-fe] Added the ability to hide the Q&A settings entry point.

* [improvement][headless-fe] Fixed the issue with selecting search results in metric field creation.

* [improvement][headless-fe] Added search functionality to the field list in model editing.

* [improvement][headless-fe] fix the field list in model editing

* [improvement][headless-fe] Restructured the data for the dimension value settings interface.

* [improvement][headless-fe] Added dynamic variable functionality to model creation based on SQL scripts.

* [improvement][headless-fe] Added support for passing dynamic variables as parameters in the executeSql function.

* [improvement][headless-fe] Resolved the issue where users were unable to select all options for dimensions, metrics, and fields in the metric generation process.

* [improvement][headless-fe] Replaced the term "view" with "dataset"

* [improvement][headless-fe] Added the ability to export metrics and dimensions to a specific target.

* [improvement][headless-fe] Enhanced dataset creation to support the tag mode.

* [improvement][headless-fe] Added tag value setting.

* [improvement][headless-fe] Optimized the tag setting system.

* [improvement][headless-fe] Optimized the tag setting system.

* [improvement][headless-fe] Updated the data initialization for model editing to use API requests instead.

* [improvement][headless-fe] Added search functionality to model management.

* [improvement][headless-fe] Removed field null validation during model editing.

* [improvement][headless-fe] Updated the batch operation button component.

* [improvement][headless-fe] Optimized the logic for initializing indicators in dimension value settings.

* [improvement][headless-fe] Adjusted the length of the input field for model editing names.

* [improvement][headless-fe]  Lock the version of the @ant-design/pro-table component and replace it with @ant-design/pro-components.

* [improvement][headless-fe] Optimized the style of the metrics market and tags market.

* [improvement][headless-fe] The quick creation of model fields now defaults to using the "comment" field for filling.

* [improvement][headless-fe] The quick creation of model fields now defaults to using the "comment" field for filling

* [improvement][headless-fe] The quick creation of model fields now defaults to using the "comment" field for filling.

* [improvement][headless-fe] Fixed the issue where the conditions for metric measurement creation were not being saved correctly.

* [improvement][headless-fe] Default value setting for hiding dimensions.

* [improvement][headless-fe] Updated the file imports in the project.

* [improvement][headless-fe] Adjusted the logic for displaying the tab in the theme domain.

* [improvement][headless-fe] Added term management functionality.

* [improvement][headless-fe] When creating a model, the current metric operator now allows for clearance.

* [improvement][headless-fe] Term management interface transformation

* [improvement][headless-fe] Migrating scaffold version to @umi/max

* [improvement][headless-fe] remove modle column

* [improvement][headless-fe] 1.Added configuration for the large language model in the agent; 2.upgraded React version from 17 to 18; 3.modified some UI effects.

* [improvement][headless-fe] Added a simplified mode to the question-answering system.

* [improvement][headless-fe] remove pnpm-lock

* [improvement][headless-fe] add pnpm-lock

* [improvement][headless-fe] Fixed the issue with passing the modelId during initialization.

* [improvement][headless-fe] Fixed the issue with abnormal comments during model creation.

* [improvement][headless-fe] fix  build bugs

* [improvement][headless-fe]  change build config

* [improvement][headless-fe] route config change

* [improvement][headless-fe] Optimized data updating when switching domains.

* [improvement][headless-fe] css change

* [improvement][semantic-fe] logo css change

* [improvement][semantic-fe] system config add defaultValue support

* [improvement][semantic-fe] tag mode wording change

* [improvement][semantic-fe] fix metric edit page init error

* [improvement][supersonic-fe] Updated the way chat projects are imported in supersonic-fe.

* [improvement][chat-engine] Added a background silent mode for watching chat projects.

* [improvement][supersonic-fe] fix proxy url

* [improvement][headless-fe] agent setting update

* [improvement][headless-fe] Agent configuration: Added connectivity testing for large models.

* [improvement][headless-fe] Chat: Enabled integration with agent configuration.

* [improvement][headless-fe] SQL formatter: Updated the import method.

* [improvement][headless-fe] login fixed

* [improvement][headless-fe] Agent: Optimized the logic for saving.

* [improvement][headless-fe] Model management: Integrated into the main theme domain.

* [improvement][headless-fe] Sensitivity: Added bulk modification functionality.

* [improvement][headless-fe] wording change

* [improvement][headless-fe] Prompt configuration: Added the ability to configure prompts.

* [improvement][headless-fe] Added the ability to configure embedding models.

* [improvement][headless-fe] hidden configure embedding models.

* [improvement][headless-fe] Connection test prompt update for large language model settings.

* [improvement][headless-fe]  add memory review config

* [improvement][headless-fe] Rollback of data structure for large language model configuration.

* [improvement][headless-fe] Added dependency relationships between various items in system configuration.

* [improvement][headless-fe] Added password parsing to the generation rules of system settings.

* [improvement][headless-fe] Added slider parsing to the generation rules of system settings.

* [improvement][headless-fe] Optimized the logic for initializing values in system settings.

* [improvement][headless-fe] Optimized the time format

* [improvement][headless-fe] Unified the SQL generation method for data sets to ensure consistency and improve efficiency.

* [improvement][headless-fe] Added support for data sets with non-partitioned time fields

* [improvement][headless-fe] Added support for editing time formats in dimension settings

* [improvement][headless-fe] Rolled back the time parameter in the metric details page to its previous state

* [improvement][headless-fe] Fixed the issue with hidden field validation when editing dimensions

* [improvement][headless-fe] Added a connectivity test for large models in the system settings

* [improvement][headless-fe] Changed the METRIC type in ChatContextType queryType to AGGREGATE

* [improvement][headless-fe] Added query and batch delete operations to the terminology management feature

* [improvement][headless-fe] Enhanced the memory management feature by adding sorting functionality and other optimization features.

* [improvement][headless-fe] Resolved the compatibility issue with the backend service where the updatedAt and other time fields were not being properly converted to the updated_at format for sorting purposes.

* [improvement][headless-fe] Added a configuration interface for large language models

* [improvement][headless-fe] Introduced a new configuration option in the assistant module specifically for large model applications.

* [improvement][headless-fe] Replaced the agentConfig with toolConfig

* [improvement][headless-fe] Resolved the issue with the test connection parameters for the large model configuration.

* [improvement][headless-fe] Implemented a new feature where the tool configuration types can be fetched from the backend API

* [improvement][headless-fe] Updated the dimension value settings to retrieve and display values from a dictionary.

* [improvement][headless-fe] Adjusted the pageSize of the dimension value settings list to 20.

* [improvement][headless-fe] Introduced a revamped configuration for the large model in the assistant module.

* [improvement][headless-fe] Added new functionality to the assistant's memory management system

* [improvement][headless-fe] Optimized the management of CSS styles in the assistant module.

* [improvement][headless] fixed build config

* [improvement][headless-fe] Revamped the dimension value settings in the assistant module.

---------

Co-authored-by: tristanliu <tristanliu@tencent.com>
This commit is contained in:
tristanliu
2024-10-23 15:24:34 +08:00
committed by GitHub
parent c792543d19
commit 5eefeb85a3
22 changed files with 1088 additions and 780 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
webapp/packages/supersonic-fe/config/defaultSettings.ts
View File

@@ -21,6 +21,6 @@ const Settings: ProLayoutProps & {
// },
};
export const publicPath = '/webapp/';
export const basePath = '/';
export const basePath = '/webapp/';
export default Settings;

24
webapp/packages/supersonic-fe/src/components/BatchCtrlDropDownButton/index.tsx
View File

@@ -65,6 +65,30 @@ const BatchCtrlDropDownButton: FC<BatchCtrlDropDownButtonProps> = ({
icon: <FormOutlined />,
disabled: disabledList?.includes('batchSensitiveLevel'),
},
batchDimensionValueBlackList: {
key: 'batchDimensionValueBlackList',
label: '批量导入黑名单',
icon: <FormOutlined />,
disabled: disabledList?.includes('batchDimensionValueBlackList'),
},
batchDimensionValueWhiteList: {
key: 'batchDimensionValueWhiteList',
label: '批量导入白名单',
icon: <FormOutlined />,
disabled: disabledList?.includes('batchDimensionValueWhiteList'),
},
batchRemoveDimensionValueBlackList: {
key: 'batchRemoveDimensionValueBlackList',
label: '批量移除黑名单',
icon: <DeleteOutlined />,
disabled: disabledList?.includes('batchRemoveDimensionValueBlackList'),
},
batchRemoveDimensionValueWhiteList: {
key: 'batchRemoveDimensionValueWhiteList',
label: '批量移除白名单',
icon: <DeleteOutlined />,
disabled: disabledList?.includes('batchRemoveDimensionValueWhiteList'),
},
};
const extenderButtonList: any[] = extenderList.reduce((list: any[], key) => {

2
webapp/packages/supersonic-fe/src/components/FormHelper/index.less
View File

@@ -1,6 +1,8 @@
.title {
font-family: var(--tencent-font-family);
// margin-bottom: 5px;
color: #667085;
font-size: 16px;
}
.subTitleContainer {

1
webapp/packages/supersonic-fe/src/components/TableHeaderFilter/index.less
View File

@@ -1,5 +1,4 @@
.tableHeaderTitle {
margin-left: 10px;
.headerTitleLabel {
color: #667085;
font-size: 14px;

5
webapp/packages/supersonic-fe/src/components/TableHeaderFilter/index.tsx
View File

@@ -5,7 +5,7 @@ import styles from './index.less';
type Props = {
components: {
label: string;
label?: string;
component: ReactNode;
}[];
};
@@ -16,7 +16,8 @@ const TableHeaderFilter: React.FC<Props> = ({ components }) => {
<Space className={styles.tableHeaderTitle} size={20}>
{components.map(({ label, component }) => (
<Space size={8} key={`TableHeaderFilter-${label}`}>
<span className={styles.headerTitleLabel}>{label}:</span>
{label && <span className={styles.headerTitleLabel}>{label}:</span>}
{component}
</Space>
))}

13
webapp/packages/supersonic-fe/src/pages/Agent/AgentForm.tsx
View File

@@ -135,7 +135,7 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
const layout = {
labelCol: { span: 8 },
wrapperCol: { span: 12 },
wrapperCol: { span: 16 },
};
const onOk = async () => {
@@ -187,10 +187,10 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
>
<Input placeholder="请输入助理名称" />
</FormItem>
<FormItem name="enableSearch" label="开启输入联想" valuePropName="checked">
<FormItem name="enableSearch" label="开启输入联想" valuePropName="checked" htmlFor="">
<Switch />
</FormItem>
<FormItem name="enableFeedback" label="开启用户确认" valuePropName="checked">
<FormItem name="enableFeedback" label="开启用户确认" valuePropName="checked" htmlFor="">
<Switch />
</FormItem>
{/* <FormItem
@@ -208,6 +208,7 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
label="开启精简模式"
tooltip="精简模式下不可调整查询条件、不显示调试信息、不显示可视化组件"
valuePropName="checked"
htmlFor=""
>
<Switch />
</FormItem>
@@ -218,6 +219,7 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
hidden={formData?.toolConfig?.simpleMode === true}
tooltip="包含Schema映射、SQL生成每阶段的关键信息"
valuePropName="checked"
htmlFor=""
>
<Switch />
</FormItem>
@@ -275,7 +277,7 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
<Space style={{ alignItems: 'start' }}>
{/* <Row> */}
{/* <Col flex="400px"> */}
<div style={{ width: 400 }}>
<div style={{ width: 350 }}>
{modelTypeOptions.map((item) => {
return (
<div
@@ -291,6 +293,7 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
label={item.label}
valuePropName="checked"
tooltip={item.description}
htmlFor=""
>
<Switch />
</FormItem>
@@ -300,7 +303,7 @@ const AgentForm: React.FC<Props> = ({ editAgent, onSaveAgent, onCreateToolBtnCli
</div>
{/* </Col>
<Col flex="auto"> */}
<div style={{ width: 800 }}>
<div style={{ width: 900 }}>
{modelTypeOptions.map((item) => {
return (
<div

2
webapp/packages/supersonic-fe/src/pages/Login/index.tsx
View File

@@ -12,7 +12,7 @@ import type { RegisterFormDetail } from './components/types';
import { postUserLogin, userRegister } from './services';
import { AUTH_TOKEN_KEY } from '@/common/constants';
import { queryCurrentUser } from '@/services/user';
import { history, useModel } from 'umi';
import { history, useModel } from '@umijs/max';
import CryptoJS from 'crypto-js';
import { encryptPassword } from '@/utils/utils';

371
webapp/packages/supersonic-fe/src/pages/SemanticModel/Insights/components/ClassTagTable.tsx
View File

@@ -1,371 +0,0 @@
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { ProTable } from '@ant-design/pro-components';
import { message, Button, Space, Popconfirm, Input, Select } from 'antd';
import React, { useRef, useState, useEffect } from 'react';
import { StatusEnum } from '../../enum';
import { useModel } from '@umijs/max';
import { SENSITIVE_LEVEL_ENUM, SENSITIVE_LEVEL_OPTIONS } from '../../constant';
import { getTagList, deleteTag, batchUpdateTagStatus } from '../../service';
import TagInfoCreateForm from './TagInfoCreateForm';
import BatchCtrlDropDownButton from '@/components/BatchCtrlDropDownButton';
import TableHeaderFilter from '../../components/TableHeaderFilter';
import moment from 'moment';
import styles from '../style.less';
import { ISemantic } from '../../data';
import { ColumnsConfig } from '../../components/TableColumnRender';
import TagValueSettingModal from './TagValueSettingModal';
type Props = {};
const ClassTagTable: React.FC<Props> = ({}) => {
const domainModel = useModel('SemanticModel.domainData');
const modelModel = useModel('SemanticModel.modelData');
const { selectDomainId } = domainModel;
const { selectModelId: modelId } = modelModel;
const [createModalVisible, setCreateModalVisible] = useState<boolean>(false);
const [tagItem, setTagItem] = useState<ISemantic.ITagItem>();
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
const [tableData, setTableData] = useState<ISemantic.ITagItem[]>([]);
const [loading, setLoading] = useState<boolean>(false);
const defaultPagination = {
current: 1,
pageSize: 20,
total: 0,
};
const [pagination, setPagination] = useState(defaultPagination);
const [filterParams, setFilterParams] = useState<Record<string, any>>({});
const [tagValueSettingModalVisible, setTagValueSettingModalVisible] = useState<boolean>(false);
const actionRef = useRef<ActionType>();
const queryBatchUpdateStatus = async (ids: React.Key[], status: StatusEnum) => {
if (Array.isArray(ids) && ids.length === 0) {
return;
}
const { code, msg } = await batchUpdateTagStatus({
ids,
status,
});
if (code === 200) {
queryTagList({ ...filterParams, ...defaultPagination });
return;
}
message.error(msg);
};
useEffect(() => {
queryTagList({ ...filterParams, ...defaultPagination });
}, [filterParams]);
const queryTagList = async (params: any) => {
setLoading(true);
const { code, data, msg } = await getTagList({
...pagination,
...params,
modelIds: [modelId],
});
setLoading(false);
const { list, pageSize, pageNum, total } = data || {};
if (code === 200) {
setPagination({
...pagination,
pageSize: Math.min(pageSize, 100),
current: pageNum,
total,
});
setTableData(list);
} else {
message.error(msg);
setTableData([]);
}
};
const columnsConfig = ColumnsConfig();
const columns: ProColumns[] = [
{
dataIndex: 'id',
title: 'ID',
width: 80,
fixed: 'left',
search: false,
},
{
dataIndex: 'name',
title: '标签',
width: 280,
fixed: 'left',
// width: '30%',
search: false,
render: columnsConfig.indicatorInfo.render,
},
{
dataIndex: 'key',
title: '标签搜索',
hideInTable: true,
},
{
dataIndex: 'sensitiveLevel',
title: '敏感度',
width: 160,
valueEnum: SENSITIVE_LEVEL_ENUM,
render: columnsConfig.sensitiveLevel.render,
},
{
dataIndex: 'description',
title: '描述',
width: 300,
search: false,
render: columnsConfig.description.render,
},
{
dataIndex: 'status',
title: '状态',
width: 160,
search: false,
render: columnsConfig.state.render,
},
{
dataIndex: 'createdBy',
title: '创建人',
width: 150,
search: false,
},
{
dataIndex: 'updatedAt',
title: '更新时间',
width: 180,
search: false,
render: (value: any) => {
return value && value !== '-' ? moment(value).format('YYYY-MM-DD HH:mm:ss') : '-';
},
},
{
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 150,
render: (_, record) => {
return (
<Space className={styles.ctrlBtnContainer}>
<Button
type="link"
key="metricEditBtn"
onClick={() => {
setTagItem(record);
setCreateModalVisible(true);
}}
>
编辑
</Button>
<Button
key="tagValueEditBtn"
type="link"
onClick={() => {
setTagItem(record);
setTagValueSettingModalVisible(true);
}}
>
标签值设置
</Button>
{record.status === StatusEnum.ONLINE ? (
<Button
type="link"
key="editStatusOfflineBtn"
onClick={() => {
queryBatchUpdateStatus([record.id], StatusEnum.OFFLINE);
}}
>
停用
</Button>
) : (
<Button
type="link"
key="editStatusOnlineBtn"
onClick={() => {
queryBatchUpdateStatus([record.id], StatusEnum.ONLINE);
}}
>
启用
</Button>
)}
<Popconfirm
title="确认删除？"
okText="是"
cancelText="否"
onConfirm={async () => {
const { code, msg } = await deleteTag(record.id);
if (code === 200) {
setTagItem(undefined);
queryTagList({ ...filterParams, ...defaultPagination });
} else {
message.error(msg);
}
}}
>
<Button
type="link"
key="metricDeleteBtn"
onClick={() => {
setTagItem(record);
}}
>
删除
</Button>
</Popconfirm>
</Space>
);
},
},
];
const rowSelection = {
onChange: (selectedRowKeys: React.Key[]) => {
setSelectedRowKeys(selectedRowKeys);
},
};
const onMenuClick = (key: string) => {
switch (key) {
case 'batchStart':
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.ONLINE);
break;
case 'batchStop':
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.OFFLINE);
break;
default:
break;
}
};
return (
<>
<ProTable
className={`${styles.classTable} ${styles.classTableSelectColumnAlignLeft} ${styles.disabledSearchTable} `}
actionRef={actionRef}
headerTitle={
<TableHeaderFilter
components={[
{
label: '标签搜索',
component: (
<Input.Search
style={{ width: 280 }}
placeholder="请输入ID/标签名称/英文名称"
onSearch={(value) => {
setFilterParams((preState) => {
return {
...preState,
key: value,
};
});
}}
/>
),
},
{
label: '敏感度',
component: (
<Select
style={{ width: 140 }}
options={SENSITIVE_LEVEL_OPTIONS}
placeholder="请选择敏感度"
allowClear
onChange={(value) => {
setFilterParams((preState) => {
return {
...preState,
sensitiveLevel: value,
};
});
}}
/>
),
},
]}
/>
}
rowKey="id"
loading={loading}
search={false}
rowSelection={{
type: 'checkbox',
...rowSelection,
}}
columns={columns}
params={{ modelId }}
dataSource={tableData}
pagination={pagination}
tableAlertRender={() => {
return false;
}}
onChange={(data: any) => {
const { current, pageSize, total } = data;
const currentPagin = {
current,
pageSize,
total,
};
setPagination(currentPagin);
queryTagList({ ...filterParams, ...currentPagin });
}}
scroll={{ x: 1500 }}
sticky={{ offsetHeader: 0 }}
size="large"
options={{ reload: false, density: false, fullScreen: false }}
toolBarRender={() => [
<Button
key="create"
type="primary"
onClick={() => {
setTagItem(undefined);
setCreateModalVisible(true);
}}
>
创建标签
</Button>,
<BatchCtrlDropDownButton
key="ctrlBtnList"
onDeleteConfirm={() => {
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.DELETED);
}}
onMenuClick={onMenuClick}
hiddenList={['batchDownload']}
/>,
]}
/>
{createModalVisible && (
<TagInfoCreateForm
domainId={selectDomainId}
modelId={Number(modelId)}
createModalVisible={createModalVisible}
tagItem={tagItem}
onSubmit={() => {
setCreateModalVisible(false);
queryTagList({ ...filterParams, ...defaultPagination });
}}
onCancel={() => {
setCreateModalVisible(false);
}}
/>
)}
{tagValueSettingModalVisible && (
<TagValueSettingModal
open={tagValueSettingModalVisible}
tagItem={tagItem}
onCancel={() => {
setTagValueSettingModalVisible(false);
}}
onSubmit={() => {
setTagValueSettingModalVisible(false);
}}
/>
)}
</>
);
};
export default ClassTagTable;

15
webapp/packages/supersonic-fe/src/pages/SemanticModel/Insights/components/TagObjectTable.tsx
View File

@@ -10,7 +10,6 @@ import TagObjectCreateForm from './TagObjectCreateForm';
import styles from '../style.less';
import { ISemantic } from '../../data';
import { ColumnsConfig } from '../../components/TableColumnRender';
import TagValueSettingModal from './TagValueSettingModal';
type Props = {};
@@ -25,8 +24,6 @@ const TagObjectTable: React.FC<Props> = ({}) => {
const [tableData, setTableData] = useState<ISemantic.ITagItem[]>([]);
const [loading, setLoading] = useState<boolean>(false);
const [tagValueSettingModalVisible, setTagValueSettingModalVisible] = useState<boolean>(false);
const actionRef = useRef<ActionType>();
useEffect(() => {
@@ -182,18 +179,6 @@ const TagObjectTable: React.FC<Props> = ({}) => {
}}
/>
)}
{tagValueSettingModalVisible && (
<TagValueSettingModal
open={tagValueSettingModalVisible}
tagItem={tagItem}
onCancel={() => {
setTagValueSettingModalVisible(false);
}}
onSubmit={() => {
setTagValueSettingModalVisible(false);
}}
/>
)}
</>
);
};

16
webapp/packages/supersonic-fe/src/pages/SemanticModel/View/components/DataSetTable.tsx
View File

@@ -28,6 +28,7 @@ const DataSetTable: React.FC<Props> = ({ dataSetList, disabledEdit = false }) =>
const [searchModalOpen, setSearchModalOpen] = useState(false);
const [modelList, setModelList] = useState<ISemantic.IModelItem[]>([]);
const actionRef = useRef<ActionType>();
const [editFormStep, setEditFormStep] = useState<number>(0);
const updateViewStatus = async (modelData: ISemantic.IDatasetItem) => {
setSaveLoading(true);
@@ -86,6 +87,19 @@ const DataSetTable: React.FC<Props> = ({ dataSetList, disabledEdit = false }) =>
dataIndex: 'name',
title: '数据集名称',
search: false,
render: (name, record) => {
return (
<a
onClick={() => {
setEditFormStep(1);
setViewItem(record);
setCreateDataSourceModalOpen(true);
}}
>
{name}
</a>
);
},
},
{
dataIndex: 'bizName',
@@ -130,6 +144,7 @@ const DataSetTable: React.FC<Props> = ({ dataSetList, disabledEdit = false }) =>
<a
key="metricEditBtn"
onClick={() => {
setEditFormStep(0);
setViewItem(record);
setCreateDataSourceModalOpen(true);
}}
@@ -227,6 +242,7 @@ const DataSetTable: React.FC<Props> = ({ dataSetList, disabledEdit = false }) =>
/>
{createDataSourceModalOpen && (
<ViewCreateFormModal
step={editFormStep}
domainId={selectDomainId}
viewItem={viewItem}
modelList={modelList}

95
webapp/packages/supersonic-fe/src/pages/SemanticModel/View/components/ViewCreateFormModal.tsx
View File

@@ -1,9 +1,9 @@
import React, { useState, useEffect, useRef } from 'react';
import { Form, Button, Modal, Input, Select, Steps, Radio, Space } from 'antd';
import { Form, Button, Modal, Input, Select, Steps, Spin, Space } from 'antd';
import styles from '../../components/style.less';
import { message } from 'antd';
import { formLayout } from '@/components/FormHelper/utils';
import { createView, updateView, getDimensionList, queryMetric, getTagList } from '../../service';
import { createView, updateView, getDimensionList, queryMetric } from '../../service';
import { ISemantic } from '../../data';
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
import SelectTMEPerson from '@/components/SelectTMEPerson';
@@ -12,6 +12,7 @@ import ViewModelConfigTransfer from './ViewModelConfigTransfer';
const FormItem = Form.Item;
export type ModelCreateFormModalProps = {
step: number;
domainId: number;
viewItem: any;
modelList: ISemantic.IModelItem[];
@@ -20,13 +21,19 @@ export type ModelCreateFormModalProps = {
};
const { Step } = Steps;
const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
step = 0,
viewItem,
domainId,
onCancel,
onSubmit,
modelList,
}) => {
const [currentStep, setCurrentStep] = useState(0);
const stepWidth: Record<string, number> = {
'0': 800,
'1': 1200,
'2': 800,
};
const [currentStep, setCurrentStep] = useState(step);
const [formVals, setFormVals] = useState<ISemantic.IModelItem>({
...viewItem,
@@ -36,7 +43,8 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
const [queryType, setQueryType] = useState<string>('METRIC');
const [saveLoading, setSaveLoading] = useState<boolean>(false);
const [modalWidth, setModalWidth] = useState<number>(800);
const [dimensionLoading, setDimensionLoading] = useState<boolean>(false);
const [modalWidth, setModalWidth] = useState<number>(stepWidth[`${currentStep}`]);
const [selectedModelItem, setSelectedModelItem] = useState<ISemantic.IModelItem | undefined>(
modelList[0],
);
@@ -63,7 +71,9 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
}, [selectedModelItem]);
const queryDimensionList = async (modelId: number) => {
setDimensionLoading(true);
const { code, data, msg } = await getDimensionList({ modelId });
setDimensionLoading(false);
if (code === 200 && Array.isArray(data?.list)) {
setDimensionList(data.list);
} else {
@@ -104,12 +114,6 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
}
};
const stepWidth: any = {
'0': 800,
'1': 1200,
'2': 800,
};
const forward = () => {
setModalWidth(stepWidth[`${currentStep + 1}`]);
setCurrentStep(currentStep + 1);
@@ -131,11 +135,9 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
<Button style={{ float: 'left' }} onClick={backward}>
上一步
</Button>
{/* <Button type="primary" onClick={handleNext}>
下一步
</Button> */}
<Button
type="primary"
loading={saveLoading}
onClick={() => {
handleConfirm();
}}
@@ -153,6 +155,7 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
</Button>
<Button
type="primary"
loading={saveLoading}
onClick={() => {
handleConfirm();
}}
@@ -167,40 +170,40 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
return (
<>
<div style={{ display: currentStep === 1 ? 'block' : 'none' }}>
<ViewModelConfigTransfer
key={queryType}
queryType={queryType}
toolbarSolt={
<Space>
<span>切换模型: </span>
<Select
style={{
minWidth: 150,
textAlign: 'left',
}}
value={selectedModelItem?.id}
placeholder="请选择模型，获取当前模型下指标维度信息"
onChange={(val) => {
setDimensionList(undefined);
setMetricList(undefined);
const modelItem = modelList.find((item) => item.id === val);
setSelectedModelItem(modelItem);
}}
options={modelList.map((item) => {
return { label: item.name, value: item.id };
})}
/>
</Space>
}
dimensionList={dimensionList}
metricList={metricList}
// tagList={tagList}
modelItem={selectedModelItem}
viewItem={viewItem}
ref={configTableRef}
/>
<Spin spinning={dimensionLoading}>
<ViewModelConfigTransfer
key={queryType}
queryType={queryType}
toolbarSolt={
<Space>
<span>切换模型: </span>
<Select
style={{
minWidth: 150,
textAlign: 'left',
}}
value={selectedModelItem?.id}
placeholder="请选择模型，获取当前模型下指标维度信息"
onChange={(val) => {
setDimensionList(undefined);
setMetricList(undefined);
const modelItem = modelList.find((item) => item.id === val);
setSelectedModelItem(modelItem);
}}
options={modelList.map((item) => {
return { label: item.name, value: item.id };
})}
/>
</Space>
}
dimensionList={dimensionList}
metricList={metricList}
modelItem={selectedModelItem}
viewItem={viewItem}
ref={configTableRef}
/>
</Spin>
</div>
<div style={{ display: currentStep === 0 ? 'block' : 'none' }}>
<FormItem
name="name"

18
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/CommonEditList/index.tsx
View File

@@ -1,16 +1,16 @@
import React, { useState, useEffect } from 'react';
import React, { useState, useEffect, ReactNode } from 'react';
import { List, Collapse, Button } from 'antd';
import { uuid } from '@/utils/utils';
import SqlEditor from '@/components/SqlEditor';
import styles from './style.less';
const { Panel } = Collapse;
type Props = {
title?: string;
title?: string | ReactNode;
defaultCollapse?: boolean;
value?: string[];
createBtnType?: 'link' | 'primary';
onChange?: (list: string[]) => void;
};
@@ -21,7 +21,13 @@ type ListItem = {
type List = ListItem[];
const CommonEditList: React.FC<Props> = ({ title, defaultCollapse = false, value, onChange }) => {
const CommonEditList: React.FC<Props> = ({
title,
defaultCollapse = false,
value,
createBtnType = 'link',
onChange,
}) => {
const [listDataSource, setListDataSource] = useState<List>([]);
const [currentSql, setCurrentSql] = useState<string>('');
const [activeKey, setActiveKey] = useState<string>();
@@ -61,7 +67,7 @@ const CommonEditList: React.FC<Props> = ({ title, defaultCollapse = false, value
activeKey ? (
<Button
key="saveBtn"
type="link"
type={createBtnType}
onClick={() => {
if (!currentRecord && !currentSql) {
setActiveKey(undefined);
@@ -98,7 +104,7 @@ const CommonEditList: React.FC<Props> = ({ title, defaultCollapse = false, value
</Button>
) : (
<Button
type="link"
type={createBtnType}
key="createBtn"
onClick={() => {
setCurrentRecord(undefined);

382
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DimensionValueSettingModal.tsx
View File

@@ -1,10 +1,20 @@
import React, { useEffect, useState } from 'react';
import { Button, Modal, message, Space, Tooltip, Tabs, Input } from 'antd';
import { Button, Modal, message, Tabs, Input, Form, Divider } from 'antd';
import TableHeaderFilter from '@/components/TableHeaderFilter';
import { ISemantic } from '../data';
import CommonEditTable from './CommonEditTable';
import { updateDimension, getDictData } from '../service';
import { KnowledgeConfigTypeEnum, KnowledgeConfigStatusEnum } from '../enum';
import BatchCtrlDropDownButton from '@/components/BatchCtrlDropDownButton';
import {
updateDimension,
getDictData,
searchKnowledgeConfigQuery,
editDictConfig,
} from '../service';
import { uniqueArray } from '@/utils/utils';
import DimensionValueSettingForm from './Entity/DimensionValueSettingForm';
import DimensionValueFilterModal from './Entity/DimensionValueFilterModal';
export type CreateFormProps = {
dimensionValueSettingList: ISemantic.IDimensionValueSettingItem[];
@@ -14,7 +24,7 @@ export type CreateFormProps = {
onSubmit: (values?: any) => void;
};
type TableDataSource = { techName: string; bizName: string; alias?: string[] };
type TableDataSource = { value: string; bizName: string; alias?: string[] };
const DimensionValueSettingModal: React.FC<CreateFormProps> = ({
onCancel,
@@ -25,16 +35,29 @@ const DimensionValueSettingModal: React.FC<CreateFormProps> = ({
}) => {
const [tableDataSource, setTableDataSource] = useState<TableDataSource[]>([]);
const [dimValueMaps, setDimValueMaps] = useState<ISemantic.IDimensionValueSettingItem[]>([]);
const [form] = Form.useForm();
const [refreshLoading, setRefreshLoading] = useState<boolean>(false);
const [knowledgeConfig, setKnowledgeConfig] = useState<ISemantic.IDictKnowledgeConfigItem>();
const [dimensionVisibleState, setDimensionVisibleState] = useState<KnowledgeConfigStatusEnum>(
KnowledgeConfigStatusEnum.OFFLINE,
);
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
const [llmLoading, setLlmLoading] = useState<boolean>(false);
const [filterParams, setFilterParams] = useState<Record<string, any>>({});
const [menuKey, setMenuKey] = useState<string>('default');
const [saveLoading, setSaveLoading] = useState<boolean>(false);
const [dimensionValueFilterModalVisible, setDimensionValueFilterModalVisible] =
useState<boolean>(false);
const defaultPagination = {
current: 1,
pageSize: 20,
pageSize: 10,
total: 0,
};
const [pagination, setPagination] = useState(defaultPagination);
useEffect(() => {
searchKnowledgeConfig();
queryDictData();
setDimValueMaps(dimensionValueSettingList);
}, [dimensionValueSettingList]);
@@ -59,6 +82,54 @@ const DimensionValueSettingModal: React.FC<CreateFormProps> = ({
message.error(msg);
};
const editConfigQuery = async (config: Record<string, any>) => {
if (!knowledgeConfig?.id) {
message.success('配置不存在!');
return;
}
setSaveLoading(true);
const queryConfig = {
...knowledgeConfig,
config: {
...knowledgeConfig.config,
...config,
},
};
const { code } = await editDictConfig(queryConfig);
setSaveLoading(false);
if (code === 200) {
searchKnowledgeConfig();
message.success('维度值设置保存成功!');
return;
}
message.error('维度值设置保存失败!');
};
const searchKnowledgeConfig = async () => {
setRefreshLoading(true);
const { code, data } = await searchKnowledgeConfigQuery({
type: KnowledgeConfigTypeEnum.DIMENSION,
itemId: dimensionItem.id,
});
setRefreshLoading(false);
if (code !== 200) {
message.error('获取字典导入配置失败!');
return;
}
const configItem = data[0];
if (configItem) {
const { status, config } = configItem;
setDimensionVisibleState(status);
form.setFieldsValue({
...config,
});
setKnowledgeConfig(configItem);
} else {
}
};
const queryDictData = async (params = {}) => {
setLlmLoading(true);
const { code, data } = await getDictData({
@@ -139,30 +210,11 @@ const DimensionValueSettingModal: React.FC<CreateFormProps> = ({
],
},
},
// {
// title: '业务名称',
// dataIndex: 'bizName',
// width: 200,
// tooltip:
// '查询完成后,最终返回给用户的维度值信息。比如将技术名称kw转换成酷我平台,最终返回给用户是酷我平台',
// fieldProps: {
// placeholder: '请填写业务名称',
// },
// formItemProps: {
// rules: [
// {
// required: true,
// whitespace: true,
// message: '此项是必填项',
// },
// ],
// },
// },
{
title: '别名',
dataIndex: 'alias',
valueType: 'select',
width: 500,
width: 480,
tooltip:
'解析用户查询意图时,支持别名到技术名称的转换。比如用户输入kw、kuwo、酷我,完成设置后,都可以将其转换成技术名称kw',
fieldProps: {
@@ -172,95 +224,235 @@ const DimensionValueSettingModal: React.FC<CreateFormProps> = ({
tokenSeparators: [','],
},
},
];
const tabItem = [
{
label: '维度值管理',
key: 'default',
children: (
<CommonEditTable
tableDataSource={tableDataSource}
columnList={columns}
onDataSourceChange={(tableData) => {
const dimValueMaps = tableData.map((item: TableDataSource) => {
return {
...item,
};
});
setDimValueMaps(dimValueMaps);
}}
hideCtrlBtn={['deleteBtn']}
editableProTableProps={{
recordCreatorProps: false,
pagination: pagination,
headerTitle: (
<TableHeaderFilter
components={[
{
label: '维度值搜索',
component: (
<Input.Search
style={{ width: 280 }}
placeholder="请输入维度值名称"
onSearch={(value) => {
setFilterParams((preState) => {
return {
...preState,
keyValue: value,
};
});
queryDictData({ keyValue: value });
}}
/>
),
},
]}
/>
),
onTableChange: (data: any) => {
const { current, pageSize, total } = data;
setPagination({
current,
pageSize,
total,
});
queryDictData({ current, pageSize });
},
}}
/>
),
title: '黑名单',
dataIndex: 'black',
width: 80,
editable: false,
render: (_, record: TableDataSource) => {
const list = knowledgeConfig?.config?.blackList;
if (Array.isArray(list) && list.includes(record.value)) {
return <span style={{ color: '#1677ff' }}>是</span>;
}
return '-';
},
},
{
label: '维度值设置',
key: 'setting',
children: <DimensionValueSettingForm dataItem={dimensionItem} />,
title: '白名单',
dataIndex: 'white',
width: 80,
editable: false,
render: (_, record: TableDataSource) => {
const list = knowledgeConfig?.config?.whiteList;
if (Array.isArray(list) && list.includes(record.value)) {
return <span style={{ color: '#1677ff' }}>是</span>;
}
return '-';
},
},
];
const handleMenuChange = (key: string) => {
setMenuKey(key);
const rowSelection = {
onChange: (selectedRowKeys: React.Key[]) => {
setSelectedRowKeys(selectedRowKeys);
},
};
const onMenuClick = (key: string, selectedKeys: React.Key[]) => {
if (selectedKeys.length === 0) {
message.error('请选择至少一个维度值');
return;
}
switch (key) {
case 'batchDimensionValueBlackList': {
const configBlackList = knowledgeConfig?.config?.blackList || [];
const blackList = uniqueArray([...selectedKeys, ...configBlackList]);
editConfigQuery({
blackList,
});
break;
}
case 'batchDimensionValueWhiteList': {
const configWhiteList = knowledgeConfig?.config?.whiteList || [];
const whiteList = uniqueArray([...selectedKeys, ...configWhiteList]);
editConfigQuery({
whiteList,
});
break;
}
case 'batchRemoveDimensionValueBlackList': {
const configBlackList = knowledgeConfig?.config?.blackList || [];
const blackList = configBlackList.filter((item) => {
return !selectedKeys.includes(item);
});
editConfigQuery({
blackList,
});
break;
}
case 'batchRemoveDimensionValueWhiteList':
{
const configWhiteList = knowledgeConfig?.config?.whiteList || [];
const whiteList = configWhiteList.filter((item) => {
return !selectedKeys.includes(item);
});
editConfigQuery({
whiteList,
});
}
break;
case 'batchAddRuleList':
{
editConfigQuery({
ruleList: selectedKeys,
});
}
break;
default:
break;
}
};
// const refreshTableData = () => {
// queryDictData({
// ...pagination,
// ...filterParams,
// });
// };
// const tabItem = [
// {
// label: '维度值管理',
// key: 'default',
// children: (
// ),
// },
// {
// label: '维度值设置',
// key: 'setting',
// children: <DimensionValueSettingForm dataItem={dimensionItem} />,
// },
// ];
// const handleMenuChange = (key: string) => {
// setMenuKey(key);
// };
return (
<Modal
width={1200}
destroyOnClose
title="维度值设置"
title={`维度值设置[${dimensionItem?.name}]`}
style={{ top: 48 }}
maskClosable={false}
open={open}
footer={renderFooter()}
onCancel={onCancel}
>
<Tabs
items={tabItem}
size="large"
activeKey={menuKey}
onChange={(menuKey: string) => {
handleMenuChange(menuKey);
}}
/>
<div>
<DimensionValueSettingForm
dataItem={dimensionItem}
knowledgeConfig={knowledgeConfig}
onVisibleChange={(state) => {
setDimensionVisibleState(state);
}}
/>
{dimensionVisibleState === KnowledgeConfigStatusEnum.ONLINE && (
<>
<Divider style={{ margin: 10 }} />
<CommonEditTable
rowKey="value"
tableDataSource={tableDataSource}
columnList={columns}
onDataSourceChange={(tableData) => {
const dimValueMaps = tableData.map((item: TableDataSource) => {
return {
...item,
};
});
setDimValueMaps(dimValueMaps);
}}
hideCtrlBtn={['deleteBtn']}
editableProTableProps={{
toolBarRender: () => [
<Button
key="3"
type="primary"
onClick={() => {
setDimensionValueFilterModalVisible(true);
}}
>
维度值过滤
</Button>,
<BatchCtrlDropDownButton
key="ctrlBtnList"
hiddenList={['batchStart', 'batchStop', 'batchDownload', 'batchDelete']}
extenderList={[
'batchDimensionValueBlackList',
'batchDimensionValueWhiteList',
'batchRemoveDimensionValueBlackList',
'batchRemoveDimensionValueWhiteList',
]}
onMenuClick={(key) => {
onMenuClick(key, selectedRowKeys);
}}
/>,
],
rowSelection: {
type: 'checkbox',
...rowSelection,
},
recordCreatorProps: false,
pagination: pagination,
headerTitle: (
<TableHeaderFilter
components={[
{
label: '维度值搜索',
component: (
<Input.Search
style={{ width: 280 }}
placeholder="请输入维度值名称"
onSearch={(value) => {
setFilterParams((preState) => {
return {
...preState,
keyValue: value,
};
});
queryDictData({ keyValue: value });
}}
/>
),
},
]}
/>
),
onTableChange: (data: any) => {
const { current, pageSize, total } = data;
setPagination({
current,
pageSize,
total,
});
queryDictData({ current, pageSize });
},
}}
/>
</>
)}
</div>
{dimensionValueFilterModalVisible && (
<DimensionValueFilterModal
config={knowledgeConfig!}
onCancel={() => {
setDimensionValueFilterModalVisible(false);
}}
onMenuClick={onMenuClick}
/>
)}
</Modal>
);
};

268
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DimensionValueSettingModal_backup.tsx Normal file
View File

@@ -0,0 +1,268 @@
import React, { useEffect, useState } from 'react';
import { Button, Modal, message, Space, Tooltip, Tabs, Input } from 'antd';
import TableHeaderFilter from '@/components/TableHeaderFilter';
import { ISemantic } from '../data';
import CommonEditTable from './CommonEditTable';
import { updateDimension, getDictData } from '../service';
import DimensionValueSettingForm from './Entity/DimensionValueSettingForm';
export type CreateFormProps = {
dimensionValueSettingList: ISemantic.IDimensionValueSettingItem[];
onCancel: () => void;
dimensionItem: ISemantic.IDimensionItem;
open: boolean;
onSubmit: (values?: any) => void;
};
type TableDataSource = { techName: string; bizName: string; alias?: string[] };
const DimensionValueSettingModal: React.FC<CreateFormProps> = ({
onCancel,
open,
dimensionItem,
dimensionValueSettingList,
onSubmit,
}) => {
const [tableDataSource, setTableDataSource] = useState<TableDataSource[]>([]);
const [dimValueMaps, setDimValueMaps] = useState<ISemantic.IDimensionValueSettingItem[]>([]);
const [llmLoading, setLlmLoading] = useState<boolean>(false);
const [filterParams, setFilterParams] = useState<Record<string, any>>({});
const [menuKey, setMenuKey] = useState<string>('default');
const defaultPagination = {
current: 1,
pageSize: 20,
total: 0,
};
const [pagination, setPagination] = useState(defaultPagination);
useEffect(() => {
queryDictData();
setDimValueMaps(dimensionValueSettingList);
}, [dimensionValueSettingList]);
const handleSubmit = async () => {
await saveDimension({ dimValueMaps });
onSubmit?.(dimValueMaps);
};
const saveDimension = async (fieldsValue: any) => {
if (!dimensionItem?.id) {
return;
}
const queryParams = {
...dimensionItem,
...fieldsValue,
};
const { code, msg } = await updateDimension(queryParams);
if (code === 200) {
return;
}
message.error(msg);
};
const queryDictData = async (params = {}) => {
setLlmLoading(true);
const { code, data } = await getDictData({
modelId: dimensionItem.modelId,
itemId: dimensionItem.id,
...filterParams,
...defaultPagination,
...params,
});
setLlmLoading(false);
if (code === 200) {
const { list, total, pageSize, current } = data;
setPagination({
current,
pageSize,
total,
});
if (Array.isArray(list)) {
setTableDataSource(list);
}
} else {
message.error('大语言模型解析异常');
}
};
const renderFooter = () => {
return (
<>
<Button onClick={onCancel}>取消</Button>
{menuKey === 'default' && (
<>
{/* <Button
type="primary"
loading={llmLoading}
onClick={() => {
generatorDimensionValue();
}}
>
<Space>
智能填充
<Tooltip title="智能填充将根据维度相关信息，使用大语言模型获取可能被使用的维度值">
<InfoCircleOutlined />
</Tooltip>
</Space>
</Button> */}
<Button
type="primary"
onClick={() => {
handleSubmit();
}}
>
完成
</Button>
</>
)}
</>
);
};
const columns = [
{
title: '维度值',
dataIndex: 'value',
width: 200,
editable: false,
tooltip: '数据库中存储的维度值数据。 比如数据库中维度平台的维度值有kw、qy等',
formItemProps: {
fieldProps: {
placeholder: '请填写维度值',
},
rules: [
{
required: true,
whitespace: true,
message: '此项是必填项',
},
],
},
},
// {
// title: '业务名称',
// dataIndex: 'bizName',
// width: 200,
// tooltip:
// '查询完成后,最终返回给用户的维度值信息。比如将技术名称kw转换成酷我平台,最终返回给用户是酷我平台',
// fieldProps: {
// placeholder: '请填写业务名称',
// },
// formItemProps: {
// rules: [
// {
// required: true,
// whitespace: true,
// message: '此项是必填项',
// },
// ],
// },
// },
{
title: '别名',
dataIndex: 'alias',
valueType: 'select',
width: 500,
tooltip:
'解析用户查询意图时,支持别名到技术名称的转换。比如用户输入kw、kuwo、酷我,完成设置后,都可以将其转换成技术名称kw',
fieldProps: {
placeholder: '输入别名后回车确认，多别名输入、复制粘贴支持英文逗号自动分隔',
mode: 'tags',
maxTagCount: 5,
tokenSeparators: [','],
},
},
];
const tabItem = [
{
label: '维度值管理',
key: 'default',
children: (
<CommonEditTable
tableDataSource={tableDataSource}
columnList={columns}
onDataSourceChange={(tableData) => {
const dimValueMaps = tableData.map((item: TableDataSource) => {
return {
...item,
};
});
setDimValueMaps(dimValueMaps);
}}
hideCtrlBtn={['deleteBtn']}
editableProTableProps={{
recordCreatorProps: false,
pagination: pagination,
headerTitle: (
<TableHeaderFilter
components={[
{
label: '维度值搜索',
component: (
<Input.Search
style={{ width: 280 }}
placeholder="请输入维度值名称"
onSearch={(value) => {
setFilterParams((preState) => {
return {
...preState,
keyValue: value,
};
});
queryDictData({ keyValue: value });
}}
/>
),
},
]}
/>
),
onTableChange: (data: any) => {
const { current, pageSize, total } = data;
setPagination({
current,
pageSize,
total,
});
queryDictData({ current, pageSize });
},
}}
/>
),
},
{
label: '维度值设置',
key: 'setting',
children: <DimensionValueSettingForm dataItem={dimensionItem} />,
},
];
const handleMenuChange = (key: string) => {
setMenuKey(key);
};
return (
<Modal
width={1200}
destroyOnClose
title="维度值设置"
style={{ top: 48 }}
maskClosable={false}
open={open}
footer={renderFooter()}
onCancel={onCancel}
>
<Tabs
items={tabItem}
size="large"
activeKey={menuKey}
onChange={(menuKey: string) => {
handleMenuChange(menuKey);
}}
/>
</Modal>
);
};
export default DimensionValueSettingModal;

2
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DomainManagerTab.tsx
View File

@@ -192,7 +192,7 @@ const DomainManagerTab: React.FC<Props> = ({
activeKey={getActiveKey()}
tabBarExtraContent={{
right:
getActiveKey() === 'overview' ? (
getActiveKey() === 'modelManage' ? (
<Radio.Group
buttonStyle="solid"
value={showModelType}

84
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DimensionValueFilterModal.tsx Normal file
View File

@@ -0,0 +1,84 @@
import { useState } from 'react';
import { Modal, Radio } from 'antd';
import DimensionValueFilterTable from './DimensionValueFilterTable';
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
import { KnowledgeConfigTypeEnum, DimensionValueListType } from '../../enum';
import type { ISemantic } from '../../data';
import CommonEditList from '../../components/CommonEditList';
type Props = {
config: ISemantic.IDictKnowledgeConfigItem;
type?: KnowledgeConfigTypeEnum;
onSubmit?: () => void;
onCancel?: () => void;
onMenuClick?: (key: string, selectedKes: React.Key[]) => void;
};
const DimensionValueFilterModal: React.FC<Props> = ({
config: knowledgeConfig,
onCancel,
onMenuClick,
}) => {
const [listType, setListType] = useState(DimensionValueListType.BLACK_LIST);
const [filterRulesList, setFilterRulesList] = useState<string[]>([]);
return (
<>
<Modal
width={800}
destroyOnClose
title={`维度值过滤`}
style={{ top: 48 }}
maskClosable={false}
open={true}
onCancel={onCancel}
>
<div>
<Radio.Group
buttonStyle="solid"
value={listType}
onChange={(e) => {
setListType(e.target.value);
}}
>
<Radio.Button value={DimensionValueListType.BLACK_LIST}>黑名单</Radio.Button>
<Radio.Button value={DimensionValueListType.WHITE_LIST}>白名单</Radio.Button>
<Radio.Button value={DimensionValueListType.RULE_LIST}>自定义过滤规则</Radio.Button>
</Radio.Group>
<div>
{[DimensionValueListType.BLACK_LIST, DimensionValueListType.WHITE_LIST].includes(
listType,
) && (
<DimensionValueFilterTable
dataSource={knowledgeConfig?.config?.[listType]}
listType={listType}
onMenuClick={onMenuClick}
/>
)}
{DimensionValueListType.RULE_LIST === listType && (
<div style={{ marginTop: 20 }}>
<CommonEditList
title={
<FormItemTitle
title={`过滤规则`}
subTitle={`将尚不存在的维度值以自定义的方式`}
/>
}
createBtnType="primary"
onChange={(list) => {
setFilterRulesList(list);
onMenuClick?.('batchAddRuleList', list);
}}
value={filterRulesList}
/>
</div>
)}
</div>
</div>
</Modal>
</>
);
};
export default DimensionValueFilterModal;

199
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DimensionValueFilterTable.tsx Normal file
View File

@@ -0,0 +1,199 @@
import { useState, useEffect } from 'react';
import { Select, Popconfirm, Space, Button, Input } from 'antd';
import BatchCtrlDropDownButton from '@/components/BatchCtrlDropDownButton';
import TableHeaderFilter from '@/components/TableHeaderFilter';
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
import { ProTable } from '@ant-design/pro-components';
import { DimensionValueListType } from '../../enum';
import styles from '../style.less';
import { PlusOutlined } from '@ant-design/icons';
type Props = {
listType: DimensionValueListType;
dataSource: string[];
onSubmit?: () => void;
onCancel?: () => void;
onMenuClick?: (key: string, selectedKes: React.Key[]) => void;
};
const DimensionValueFilterModal: React.FC<Props> = ({
listType,
dataSource,
onCancel,
onMenuClick,
}) => {
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
const [tableData, setTableData] = useState<any[]>([]);
const [importValues, setImportValues] = useState<string[]>([]);
const typeMap: any = {
[DimensionValueListType.BLACK_LIST]: {
label: '黑名单',
tableSubTitle: '设置进入黑名单后，在搜索结果中维度值将会被过滤',
dropDownExtenderList: ['batchRemoveDimensionValueBlackList'],
addKey: 'batchDimensionValueBlackList',
removeKey: 'batchRemoveDimensionValueBlackList',
},
[DimensionValueListType.WHITE_LIST]: {
label: '白名单',
tableSubTitle: '设置进入白名单后，将会在搜索结果展示出维度值',
dropDownExtenderList: ['batchRemoveDimensionValueWhiteList'],
addKey: 'batchDimensionValueWhiteList',
removeKey: 'batchRemoveDimensionValueWhiteList',
},
};
useEffect(() => {
if (Array.isArray(dataSource)) {
const data = dataSource.map((item) => {
return {
value: item,
};
});
setTableData(data);
} else {
setTableData([]);
}
}, [dataSource]);
const columns = [
{
title: '维度值',
dataIndex: 'value',
tooltip: '数据库中存储的维度值数据。 比如数据库中维度平台的维度值有kw、qy等',
width: 200,
},
{
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 150,
render: (_, record) => {
return (
<Space className={styles.ctrlBtnContainer}>
<Popconfirm
title="确认移除？"
okText="是"
cancelText="否"
onConfirm={() => {
onMenuClick?.(typeMap[listType].removeKey, [record.value]);
}}
>
<Button type="link" key="metricDeleteBtn">
移除
</Button>
</Popconfirm>
</Space>
);
},
},
];
return (
<>
<div>
<div style={{ padding: '20px 0px', width: '100%' }}>
<FormItemTitle
title={`导入自定义维度值`}
subTitle={`将尚不存在的维度值以自定义的方式导入${typeMap[listType].label}中`}
/>
<Space.Compact style={{ marginTop: 10 }}>
<Select
style={{ width: '500px' }}
mode="tags"
placeholder={`输入维度值后回车确认，多维度值输入、复制粘贴支持英文逗号自动分隔`}
tokenSeparators={[',']}
maxTagCount={9}
value={importValues}
onChange={(values) => {
setImportValues(values);
}}
/>
<Button
key="importBtn"
type="primary"
onClick={() => {
setImportValues([]);
onMenuClick?.(typeMap[listType].addKey, importValues);
}}
>
<Space>
<PlusOutlined /> 导入
</Space>
</Button>
</Space.Compact>
</div>
<FormItemTitle
title={`${typeMap[listType].label}维度值列表`}
subTitle={`${typeMap[listType].tableSubTitle}`}
/>
<ProTable
className={`${styles.dimensionValueFilterTable}`}
rowKey="value"
size="small"
// loading={loading}
pagination={{ defaultPageSize: 10, showSizeChanger: true }}
search={false}
columns={columns}
dataSource={tableData}
tableAlertRender={() => {
return false;
}}
scroll={{ y: 500 }}
toolBarRender={() => {
return [
<BatchCtrlDropDownButton
key="ctrlBtnList"
hiddenList={['batchStart', 'batchStop', 'batchDownload', 'batchDelete']}
extenderList={typeMap[listType].dropDownExtenderList}
onMenuClick={(key) => {
onMenuClick?.(key, selectedRowKeys);
}}
/>,
];
}}
headerTitle={
<TableHeaderFilter
components={[
{
component: (
<Input.Search
style={{ width: 280 }}
placeholder="请输入维度值名称"
allowClear
onSearch={(value) => {
const data = dataSource
.filter((item) => {
return item.includes(value);
})
.map((item) => {
return {
value: item,
};
});
setTableData(data);
}}
/>
),
},
]}
/>
}
rowSelection={{
type: 'checkbox',
onChange: (selectedRowKeys: React.Key[]) => {
setSelectedRowKeys(selectedRowKeys);
},
}}
sticky={{ offsetHeader: 0 }}
options={false}
/>
</div>
</>
);
};
export default DimensionValueFilterModal;

265
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DimensionValueSettingForm.tsx
View File

@@ -3,9 +3,7 @@ import { Form, Switch, Space, Button, Tooltip, message, Select } from 'antd';
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
import { useModel } from '@umijs/max';
import { RedoOutlined, InfoCircleOutlined } from '@ant-design/icons';
import DisabledWheelNumberInput from '@/components/DisabledWheelNumberInput';
import { formLayout } from '@/components/FormHelper/utils';
import { ProCard } from '@ant-design/pro-components';
import {
DictTaskState,
KnowledgeConfigTypeEnum,
@@ -13,32 +11,30 @@ import {
KnowledgeConfigTypeWordingMap,
} from '../../enum';
import {
searchKnowledgeConfigQuery,
searchDictLatestTaskList,
createDictTask,
editDictConfig,
createDictConfig,
deleteDictTask,
queryMetric,
getModelList,
getMetricData,
} from '../../service';
import type { ISemantic } from '../../data';
import type { StateType } from '../../model';
import styles from '../style.less';
import CommonEditList from '../../components/CommonEditList';
type Props = {
dataItem: ISemantic.IDimensionItem | ISemantic.ITagItem;
dataItem: ISemantic.IDimensionItem;
type?: KnowledgeConfigTypeEnum;
knowledgeConfig?: ISemantic.IDictKnowledgeConfigItem;
onSubmit?: () => void;
onVisibleChange?: (visible: KnowledgeConfigStatusEnum) => void;
};
const FormItem = Form.Item;
const DimensionValueSettingForm: React.FC<Props> = ({
dataItem,
knowledgeConfig,
type = KnowledgeConfigTypeEnum.DIMENSION,
onVisibleChange,
}) => {
const [form] = Form.useForm();
const domainModel = useModel('SemanticModel.domainData');
@@ -47,46 +43,32 @@ const DimensionValueSettingForm: React.FC<Props> = ({
const [taskItemState, setTaskItemState] = useState<ISemantic.IDictKnowledgeTaskItem>();
const [saveLoading, setSaveLoading] = useState<boolean>(false);
const [refreshLoading, setRefreshLoading] = useState<boolean>(false);
const [knowledgeConfig, setKnowledgeConfig] = useState<ISemantic.IDictKnowledgeConfigItem>();
const [modelList, setModelList] = useState<ISemantic.IModelItem[]>([]);
const [deleteLoading, setDeleteLoading] = useState<boolean>(false);
const [importDictState, setImportDictState] = useState<boolean>(false);
const [metricList, setMetricList] = useState<ISemantic.IMetricItem[]>();
const defaultKnowledgeConfig: ISemantic.IDictKnowledgeConfigItemConfig = {
blackList: [],
whiteList: [],
ruleList: [],
};
useEffect(() => {
searchKnowledgeConfig();
// searchKnowledgeConfig();
queryDictLatestTaskList();
}, []);
useEffect(() => {
if (!selectDomainId) {
if (!knowledgeConfig) {
return;
}
queryModelList(selectDomainId);
}, [selectDomainId]);
const queryModelList = async (domainId: number) => {
const { code, data } = await getModelList(domainId);
if (code === 200) {
setModelList(data);
const configItem = knowledgeConfig;
// if (configItem) {
const { status, config } = configItem;
if (status === KnowledgeConfigStatusEnum.ONLINE) {
setDimensionVisible(true);
} else {
message.error('获取模型列表失败!');
setDimensionVisible(false);
}
};
const queryMetricList = async (modelId: number) => {
const { code, data, msg } = await queryMetric({ modelId });
if (code === 200 && Array.isArray(data?.list)) {
setMetricList(data.list);
} else {
message.error(msg);
}
};
form.setFieldsValue({
...config,
});
}, [knowledgeConfig]);
const taskRender = () => {
if (taskItemState?.taskStatus) {
@@ -99,42 +81,6 @@ const DimensionValueSettingForm: React.FC<Props> = ({
return '--';
};
const searchKnowledgeConfig = async () => {
setRefreshLoading(true);
const { code, data } = await searchKnowledgeConfigQuery({
type,
itemId: dataItem.id,
});
setRefreshLoading(false);
if (code !== 200) {
message.error('获取字典导入配置失败!');
return;
}
const configItem = data[0];
if (configItem) {
const { status, config } = configItem;
if (status === KnowledgeConfigStatusEnum.ONLINE) {
setDimensionVisible(true);
} else {
setDimensionVisible(false);
}
form.setFieldsValue({
...config,
});
setKnowledgeConfig(configItem);
const { metricId } = config;
if (metricId) {
queryMetricData(metricId);
}
} else {
form.setFieldsValue({
...defaultKnowledgeConfig,
});
createDictConfigQuery(dataItem, defaultKnowledgeConfig);
}
};
const queryDictLatestTaskList = async () => {
setRefreshLoading(true);
const { code, data } = await searchDictLatestTaskList({
@@ -155,35 +101,6 @@ const DimensionValueSettingForm: React.FC<Props> = ({
}
};
const queryMetricData = async (metricId: string) => {
const { code, data, msg } = await getMetricData(metricId);
if (code === 200) {
const { modelId } = data;
queryMetricList(modelId);
form.setFieldValue('modelId', modelId);
return;
}
message.error(msg);
};
const createDictConfigQuery = async (
dimension: ISemantic.IDimensionItem,
config: ISemantic.IDictKnowledgeConfigItemConfig,
) => {
const { code, data } = await createDictConfig({
type,
itemId: dimension.id,
config,
status: 1,
});
if (code !== 200) {
message.error('字典导入配置创建失败!');
return;
}
setKnowledgeConfig(data);
};
const createDictTaskQuery = async (dimension: ISemantic.IDimensionItem) => {
setImportDictState(true);
const { code } = await createDictTask({
@@ -218,10 +135,10 @@ const DimensionValueSettingForm: React.FC<Props> = ({
});
setSaveLoading(false);
if (code === 200) {
message.success('字典导入配置保存成功!');
message.success('维度值设置保存成功!');
return;
}
message.error('字典导入配置保存失败!');
message.error('维度值设置保存失败!');
};
const deleteDictTaskQuery = async (dimension: ISemantic.IDimensionItem) => {
@@ -242,23 +159,13 @@ const DimensionValueSettingForm: React.FC<Props> = ({
<Form
{...formLayout}
form={form}
style={{ margin: '0 30px 30px 30px' }}
style={{ marginTop: '20px' }}
layout="vertical"
className={styles.form}
onValuesChange={(value, values) => {
if (value.modelId === undefined && values.modelId == undefined) {
setMetricList([]);
form.setFieldValue('metricId', undefined);
return;
}
if (value.modelId) {
form.setFieldValue('metricId', undefined);
queryMetricList(value.modelId);
}
}}
onValuesChange={(value, values) => {}}
>
<FormItem
style={{ marginTop: 15 }}
style={{ margin: 0 }}
label={
<FormItemTitle
title={
@@ -272,12 +179,12 @@ const DimensionValueSettingForm: React.FC<Props> = ({
size="small"
checked={dimensionVisible}
onChange={(value) => {
editDictTaskQuery(
value
? KnowledgeConfigStatusEnum.ONLINE
: KnowledgeConfigStatusEnum.OFFLINE,
);
const state = value
? KnowledgeConfigStatusEnum.ONLINE
: KnowledgeConfigStatusEnum.OFFLINE;
editDictTaskQuery(state);
setDimensionVisible(value);
onVisibleChange?.(state);
}}
/>
</Space>
@@ -323,7 +230,7 @@ const DimensionValueSettingForm: React.FC<Props> = ({
>
导入状态
<Space>
<RedoOutlined />: <span>{taskRender(dataItem)}</span>
<RedoOutlined />: <span>{taskRender()}</span>
</Space>
</Button>
</Space>
@@ -353,120 +260,6 @@ const DimensionValueSettingForm: React.FC<Props> = ({
</Space>
)}
</FormItem>
{dimensionVisible && (
<>
<ProCard
title={
<span
style={{
color: '#2f374c',
fontSize: 16,
fontWeight: 400,
}}
>
指标设置
</span>
}
bordered
extra={
<Button
type="primary"
onClick={() => {
editDictTaskQuery();
}}
loading={saveLoading}
>
保 存
</Button>
}
style={{ marginBottom: 20 }}
>
<FormItem
label={
<FormItemTitle
title="参考指标"
subTitle="字典中维度值的重要性参照指标值大小，指标值越大，维度值最越重要"
/>
}
>
<Space.Compact>
<FormItem noStyle name="modelId">
<Select
allowClear
showSearch
style={{ minWidth: 300 }}
optionFilterProp="label"
placeholder={`请选择所属model`}
options={modelList?.map((item) => {
return {
value: item.id,
label: item.name,
};
})}
/>
</FormItem>
<FormItem name="metricId" noStyle>
<Select
allowClear
showSearch
optionFilterProp="label"
style={{ minWidth: 300 }}
placeholder={`请选择参考指标`}
options={metricList?.map((item) => {
return {
value: item.id,
label: item.name,
};
})}
/>
</FormItem>
</Space.Compact>
</FormItem>
<FormItem
name="limit"
label={
<FormItemTitle title="最大维度值个数" subTitle="维度写入字典的维度值的最大个数" />
}
>
<DisabledWheelNumberInput placeholder={`请输入维度值`} style={{ minWidth: 200 }} />
</FormItem>
<div>
<div
style={{
color: '#2f374c',
fontSize: 16,
display: 'flex',
marginBottom: 10,
}}
>
<span style={{ flex: 'auto' }}>{KnowledgeConfigTypeWordingMap[type]}值过滤</span>
</div>
<FormItem name="blackList" label="黑名单">
<Select
mode="tags"
placeholder={`输入${KnowledgeConfigTypeWordingMap[type]}值后回车确认，多别名输入、复制粘贴支持英文逗号自动分隔`}
tokenSeparators={[',']}
maxTagCount={9}
/>
</FormItem>
<FormItem name="whiteList" label="白名单">
<Select
mode="tags"
placeholder={`输入${KnowledgeConfigTypeWordingMap[type]}值后回车确认，多别名输入、复制粘贴支持英文逗号自动分隔`}
tokenSeparators={[',']}
maxTagCount={9}
/>
</FormItem>
<FormItem name="ruleList">
<CommonEditList title="过滤规则" />
</FormItem>
</div>
</ProCard>
</>
)}
</Form>
</>
);

87
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/RecommendedQuestionsSection.tsx Normal file
View File

@@ -0,0 +1,87 @@
import { message } from 'antd';
import React, { useState, useEffect } from 'react';
import { useModel } from '@umijs/max';
import type { StateType } from '../../model';
import { getDomainExtendConfig, addDomainExtend, editDomainExtend } from '../../service';
import { ProCard } from '@ant-design/pro-components';
import TextAreaCommonEditList from '../../components/CommonEditList/TextArea';
type Props = {};
const RecommendedQuestionsSection: React.FC<Props> = ({}) => {
const modelModel = useModel('SemanticModel.modelData');
const { selectModelId: modelId } = modelModel;
const [questionData, setQuestionData] = useState<string[]>([]);
const [currentRecordId, setCurrentRecordId] = useState<number>(0);
const queryThemeListData: any = async () => {
const { code, data } = await getDomainExtendConfig({
modelId,
});
if (code === 200) {
const target = data?.[0] || {};
if (Array.isArray(target.recommendedQuestions)) {
setQuestionData(
target.recommendedQuestions.map((item: { question: string }) => {
return item.question;
}),
);
setCurrentRecordId(target.id || 0);
} else {
setQuestionData([]);
setCurrentRecordId(0);
}
return;
}
message.error('获取问答设置信息失败');
};
const saveEntity = async (list: string[]) => {
let saveDomainExtendQuery = addDomainExtend;
if (currentRecordId) {
saveDomainExtendQuery = editDomainExtend;
}
const { code, msg } = await saveDomainExtendQuery({
recommendedQuestions: list.map((question: string) => {
return { question };
}),
id: currentRecordId,
modelId,
});
if (code === 200) {
return;
}
message.error(msg);
};
const initPage = async () => {
queryThemeListData();
};
useEffect(() => {
if (!modelId) {
return;
}
initPage();
}, [modelId]);
return (
<div style={{ width: 800, margin: '20px auto' }}>
<ProCard bordered title="问题推荐列表">
<TextAreaCommonEditList
value={questionData}
onChange={(list) => {
saveEntity(list);
setQuestionData(list);
}}
/>
</ProCard>
</div>
);
};
export default RecommendedQuestionsSection;

7
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/style.less
View File

@@ -442,3 +442,10 @@
.dimensionValueFilterTable {
:global {
.ant-pro-card-body {
padding:0
}
}
}

6
webapp/packages/supersonic-fe/src/pages/SemanticModel/enum.ts
View File

@@ -93,3 +93,9 @@ export enum DatePeriod {
MONTH = 'MONTH',
YEAR = 'YEAR',
}
export enum DimensionValueListType {
BLACK_LIST = 'blackList',
WHITE_LIST = 'whiteList',
RULE_LIST = 'ruleList',
}

4
webapp/packages/supersonic-fe/src/utils/utils.ts
View File

@@ -498,3 +498,7 @@ export function decryptPassword(encryptPassword: string) {
});
return CryptoJS.enc.Utf8.stringify(decrypt).toString();
}
export function uniqueArray(arr: any[]) {
return Array.from(new Set(arr));
}