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

[improvement][headless-fe] Added support for user confirmation mode in the question-answering dialogue of the assistant module. (#1853)

Browse Source 
* [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.

* [improvement][headless-fe] Optimized the initialization process of dimension value settings in the assistant module.

* [improvement][headless-fe] Added support for user confirmation mode in the question-answering dialogue of the assistant module.

---------

Co-authored-by: tristanliu <tristanliu@tencent.com>
This commit is contained in:
tristanliu
2024-10-29 11:26:10 +08:00
committed by GitHub
parent 414aaaa0b6
commit b01751afdb
21 changed files with 16904 additions and 13218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
webapp/packages/chat-sdk/src/Chat/MessageContainer/index.tsx
View File

@@ -69,7 +69,7 @@ const MessageContainer: React.FC<Props> = ({
return (
<div id={id} className={messageContainerClass}>
<div className={styles.messageList}>
{messageList.map((msgItem: MessageItem) => {
{messageList.map((msgItem: MessageItem, index: number) => {
const {
id: msgId,
modelId,
@@ -96,6 +96,7 @@ const MessageContainer: React.FC<Props> = ({
<Text position="right" data={msg} />
{identityMsg && <Text position="left" data={identityMsg} />}
<ChatItem
currentAgent={currentAgent}
isSimpleMode={isSimpleMode}
isDebugMode={isDebugMode}
msg={msgValue || msg || ''}
@@ -115,6 +116,7 @@ const MessageContainer: React.FC<Props> = ({
}}
onUpdateMessageScroll={updateMessageContainerScroll}
onSendMsg={onSendMsg}
isLastMessage={index === messageList.length - 1}
/>
</>
)}

1
webapp/packages/chat-sdk/src/Chat/index.tsx
View File

@@ -405,6 +405,7 @@ const Chat: ForwardRefRenderFunction<any, Props> = (
<div className={styles.chatHeaderTip}>{currentAgent.description}</div>
<Tooltip title="精简模式下，问答结果将以文本形式输出">
<Switch
key={currentAgent.id}
style={{ position: 'relative', top: -1 }}
size="small"
value={isSimpleMode}

1
webapp/packages/chat-sdk/src/Chat/type.ts
View File

@@ -89,6 +89,7 @@ export type AgentType = {
createdAt: string;
updatedAt: string;
enableSearch: number;
enableFeedback: number;
toolConfig: string;
modelConfig: {
provider: string;

2
webapp/packages/chat-sdk/src/common/type.ts
View File

@@ -83,7 +83,7 @@ export type SqlInfoType = {
export type ChatContextType = {
id: number;
queryId: number;
queryId?: number;
aggType: string;
modelId: number;
modelName: string;

86
webapp/packages/chat-sdk/src/components/ChatItem/ExecuteItem.tsx
View File

@@ -1,19 +1,18 @@
import { Spin, Switch, Button } from 'antd';
import { CheckCircleFilled, DownloadOutlined } from '@ant-design/icons';
import { Spin, Switch } from 'antd';
import { CheckCircleFilled } from '@ant-design/icons';
import { PREFIX_CLS, MsgContentTypeEnum } from '../../common/constants';
import { MsgDataType } from '../../common/type';
import ChatMsg from '../ChatMsg';
import WebPage from '../ChatMsg/WebPage';
import Loading from './Loading';
import React, { ReactNode, useState } from 'react';
import { exportCsvFile } from '../../utils/utils';
type Props = {
queryId?: number;
question: string;
queryMode?: string;
executeLoading: boolean;
entitySwitchLoading: boolean;
entitySwitchLoading?: boolean;
chartIndex: number;
executeTip?: string;
executeItemNode?: ReactNode;
@@ -29,7 +28,7 @@ const ExecuteItem: React.FC<Props> = ({
question,
queryMode,
executeLoading,
entitySwitchLoading,
entitySwitchLoading = false,
chartIndex,
executeTip,
executeItemNode,
@@ -60,20 +59,6 @@ const ExecuteItem: React.FC<Props> = ({
);
};
const onExportData = () => {
const { queryColumns, queryResults } = data || {};
if (!!queryResults) {
const exportData = queryResults.map(item => {
return Object.keys(item).reduce((result, key) => {
const columnName = queryColumns?.find(column => column.nameEn === key)?.name || key;
result[columnName] = item[key];
return result;
}, {});
});
exportCsvFile(exportData);
}
};
if (executeLoading) {
return getNodeTip(`${titlePrefix}查询中`);
}
@@ -96,41 +81,40 @@ const ExecuteItem: React.FC<Props> = ({
return (
<>
<div className={`${prefixCls}-title-bar`}>
<CheckCircleFilled className={`${prefixCls}-step-icon`} />
<div
className={`${prefixCls}-step-title ${prefixCls}-execute-title-bar`}
style={{ width: '100%' }}
>
<div>
{titlePrefix}查询
{!!data?.queryTimeCost && isDeveloper && (
<span className={`${prefixCls}-title-tip`}>(耗时: {data.queryTimeCost}ms)</span>
)}
</div>
<div>
{[MsgContentTypeEnum.METRIC_TREND, MsgContentTypeEnum.METRIC_BAR].includes(
msgContentType as MsgContentTypeEnum
) && (
<Switch
checkedChildren="表格"
unCheckedChildren="表格"
onChange={checked => {
setShowMsgContentTable(checked);
}}
/>
)}
{!!data?.queryColumns?.length && (
<Button className={`${prefixCls}-export-data`} size="small" onClick={onExportData}>
<DownloadOutlined />
导出数据
</Button>
)}
{!isSimpleMode && (
<div className={`${prefixCls}-title-bar`}>
<CheckCircleFilled className={`${prefixCls}-step-icon`} />
<div
className={`${prefixCls}-step-title ${prefixCls}-execute-title-bar`}
style={{ width: '100%' }}
>
<div>
{titlePrefix}查询
{!!data?.queryTimeCost && isDeveloper && (
<span className={`${prefixCls}-title-tip`}>(耗时: {data.queryTimeCost}ms)</span>
)}
</div>
<div>
{[MsgContentTypeEnum.METRIC_TREND, MsgContentTypeEnum.METRIC_BAR].includes(
msgContentType as MsgContentTypeEnum
) && (
<Switch
checkedChildren="表格"
unCheckedChildren="表格"
onChange={checked => {
setShowMsgContentTable(checked);
}}
/>
)}
</div>
</div>
</div>
</div>
)}
<div
className={`${prefixCls}-content-container`}
className={`${prefixCls}-content-container ${
isSimpleMode ? `${prefixCls}-content-container-simple` : ''
}`}
style={{ borderLeft: queryMode === 'PLAIN_TEXT' ? 'none' : undefined }}
>
<Spin spinning={entitySwitchLoading}>

261
webapp/packages/chat-sdk/src/components/ChatItem/ExpandParseTip.tsx Normal file
View File

@@ -0,0 +1,261 @@
import React, { ReactNode } from 'react';
import { ChatContextType, DateInfoType, EntityInfoType, FilterItemType } from '../../common/type';
import { Button, DatePicker, Row, Col, Tag } from 'antd';
import { CheckCircleFilled, CloseCircleFilled, ReloadOutlined } from '@ant-design/icons';
import Loading from './Loading';
import FilterItem from './FilterItem';
import classNames from 'classnames';
import { isMobile } from '../../utils/utils';
import dayjs, { Dayjs } from 'dayjs';
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
import { prefixCls, getTipNode } from './ParseTipUtils';
import 'dayjs/locale/zh-cn';
dayjs.extend(quarterOfYear);
dayjs.locale('zh-cn');
const { RangePicker } = DatePicker;
type Props = {
parseLoading: boolean;
parseInfoOptions: ChatContextType[];
parseTip: string;
currentParseInfo?: ChatContextType;
agentId?: number;
dimensionFilters: FilterItemType[];
dateInfo: DateInfoType;
entityInfo: EntityInfoType;
integrateSystem?: string;
parseTimeCost?: number;
isDeveloper?: boolean;
onSelectParseInfo: (parseInfo: ChatContextType) => void;
onSwitchEntity: (entityId: string) => void;
onFiltersChange: (filters: FilterItemType[]) => void;
onDateInfoChange: (dateRange: any) => void;
onRefresh: (parseInfo: ChatContextType) => void;
handlePresetClick: any;
};
type RangeValue = [Dayjs, Dayjs];
type RangeKeys = '近7日' | '近14日' | '近30日' | '本周' | '本月' | '上月' | '本季度' | '本年';
const ExpandParseTip: React.FC<Props> = ({
parseLoading,
parseInfoOptions,
parseTip,
currentParseInfo,
agentId,
dimensionFilters,
dateInfo,
entityInfo,
integrateSystem,
parseTimeCost,
isDeveloper,
onSelectParseInfo,
onSwitchEntity,
onFiltersChange,
onDateInfoChange,
onRefresh,
handlePresetClick,
}) => {
const ranges: Record<RangeKeys, RangeValue> = {
近7日: [dayjs().subtract(7, 'day'), dayjs()],
近14日: [dayjs().subtract(14, 'day'), dayjs()],
近30日: [dayjs().subtract(30, 'day'), dayjs()],
本周: [dayjs().startOf('week'), dayjs().endOf('week')],
本月: [dayjs().startOf('month'), dayjs().endOf('month')],
上月: [
dayjs().subtract(1, 'month').startOf('month'),
dayjs().subtract(1, 'month').endOf('month'),
],
本季度: [dayjs().startOf('quarter'), dayjs().endOf('quarter')], // 使用 quarterOfYear 插件
本年: [dayjs().startOf('year'), dayjs().endOf('year')],
};
const getNode = (tipTitle: ReactNode, tipNode?: ReactNode, failed?: boolean) => {
return (
<div className={`${prefixCls}-parse-tip`}>
<div className={`${prefixCls}-title-bar`}>
{!failed ? (
<CheckCircleFilled className={`${prefixCls}-step-icon`} />
) : (
<CloseCircleFilled className={`${prefixCls}-step-error-icon`} />
)}
<div className={`${prefixCls}-step-title`}>
{tipTitle}
{tipNode === undefined && <Loading />}
</div>
</div>
{(tipNode || tipNode === null) && (
<div
className={classNames(
`${prefixCls}-content-container`,
tipNode === null && `${prefixCls}-empty-content-container`,
failed && `${prefixCls}-content-container-failed`
)}
>
{tipNode}
</div>
)}
</div>
);
};
if (parseLoading) {
return getNode('意图解析中');
}
if (parseTip) {
return getNode(
<>
意图解析失败
{!!parseTimeCost && isDeveloper && (
<span className={`${prefixCls}-title-tip`}>(耗时: {parseTimeCost}ms)</span>
)}
</>,
parseTip,
true
);
}
if (parseInfoOptions.length === 0) {
return null;
}
const { modelId, queryMode, entity, nativeQuery } = currentParseInfo || {};
const entityAlias = entity?.alias?.[0]?.split('.')?.[0];
const getFilterContent = (filters: any) => {
const itemValueClass = `${prefixCls}-tip-item-value`;
const { startDate, endDate } = dateInfo || {};
const tipItemOptionClass = classNames(`${prefixCls}-tip-item-option`, {
[`${prefixCls}-mobile-tip-item-option`]: isMobile,
});
return (
<div className={`${prefixCls}-tip-item-filter-content`}>
{!!dateInfo && (
<div className={tipItemOptionClass}>
<span className={`${prefixCls}-tip-item-filter-name`}>数据时间：</span>
{nativeQuery ? (
<span className={itemValueClass}>
{startDate === endDate ? startDate : `${startDate} ~ ${endDate}`}
</span>
) : (
<RangePicker
value={[dayjs(startDate), dayjs(endDate)]}
onChange={onDateInfoChange}
format="YYYY-MM-DD"
renderExtraFooter={() => (
<Row gutter={[28, 28]}>
{Object.keys(ranges).map(key => (
<Col key={key}>
<Button
size="small"
onClick={() => handlePresetClick(ranges[key as RangeKeys])}
>
{key}
</Button>
</Col>
))}
</Row>
)}
/>
)}
</div>
)}
{filters?.map((filter: any, index: number) => (
<FilterItem
modelId={modelId!}
filters={filters}
filter={filter}
index={index}
chatContext={currentParseInfo!}
entityAlias={entityAlias}
agentId={agentId}
integrateSystem={integrateSystem}
onFiltersChange={onFiltersChange}
onSwitchEntity={onSwitchEntity}
key={`${filter.name}_${index}`}
/>
))}
</div>
);
};
const getFiltersNode = parseInfo => {
return (
<>
{(!!dateInfo || !!dimensionFilters?.length) && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>筛选条件：</div>
<div className={`${prefixCls}-tip-item-content`}>
{getFilterContent(dimensionFilters)}
</div>
</div>
)}
</>
);
};
return getNode(
<div className={`${prefixCls}-title-bar`}>
<div>
意图解析
{!!parseTimeCost && isDeveloper && (
<span className={`${prefixCls}-title-tip`}>(耗时: {parseTimeCost}ms)</span>
)}
</div>
</div>,
queryMode === 'PLAIN_TEXT' ? null : (
<>
<div>
{parseInfoOptions.map((parseInfo, index) => {
const { queryMode, properties } = parseInfo || {};
const { type: agentType } = properties || {};
return (
<div style={{ marginBottom: 10, paddingBottom: 10, borderBottom: '1px solid #eee' }}>
<div style={{ marginBottom: 10, height: '30px', lineHeight: '30px' }}>
<span className={`${prefixCls}-content-parser-options-title`}>
解析{index + 1}:
</span>
</div>
<div className={`${prefixCls}-tip`}>
{getTipNode({ parseInfo, dimensionFilters, entityInfo })}
{!(!!agentType && queryMode !== 'LLM_S2SQL') && getFiltersNode(parseInfo)}
</div>
</div>
);
})}
{parseInfoOptions?.length > 1 && (
<div className={`${prefixCls}-content-parser-container`}>
<div className={`${prefixCls}-content-options`}>
<span className={`${prefixCls}-breathing-text`}>
请选择适合的解析意图，并进行下一步:
</span>
{parseInfoOptions.map((parseInfo, index) => (
<div
className={`${prefixCls}-content-option ${
parseInfo.id === currentParseInfo?.id
? `${prefixCls}-content-option-active`
: ''
}`}
onClick={() => {
onSelectParseInfo(parseInfo);
}}
key={parseInfo.id}
>
解析{index + 1}
</div>
))}
</div>
</div>
)}
</div>
</>
)
);
};
export default ExpandParseTip;

134
webapp/packages/chat-sdk/src/components/ChatItem/ParseTip.tsx
View File

@@ -1,5 +1,4 @@
import React, { ReactNode } from 'react';
import { AGG_TYPE_MAP, PREFIX_CLS } from '../../common/constants';
import { ChatContextType, DateInfoType, EntityInfoType, FilterItemType } from '../../common/type';
import { Button, DatePicker, Row, Col } from 'antd';
import { CheckCircleFilled, CloseCircleFilled, ReloadOutlined } from '@ant-design/icons';
@@ -9,8 +8,8 @@ import MarkDown from '../ChatMsg/MarkDown';
import classNames from 'classnames';
import { isMobile } from '../../utils/utils';
import dayjs, { Dayjs } from 'dayjs';
import { ChatContextTypeQueryTypeEnum } from '../../common/constants';
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
import { prefixCls, getTipNode } from './ParseTipUtils';
import 'dayjs/locale/zh-cn';
@@ -40,8 +39,6 @@ type Props = {
handlePresetClick: any;
};
const MAX_OPTION_VALUES_COUNT = 2;
type RangeValue = [Dayjs, Dayjs];
type RangeKeys = '近7日' | '近14日' | '近30日' | '本周' | '本月' | '上月' | '本季度' | '本年';
@@ -79,8 +76,6 @@ const ParseTip: React.FC<Props> = ({
本年: [dayjs().startOf('year'), dayjs().endOf('year')],
};
const prefixCls = `${PREFIX_CLS}-item`;
const getNode = (tipTitle: ReactNode, tipNode?: ReactNode, failed?: boolean) => {
return (
<div className={`${prefixCls}-parse-tip`}>
@@ -133,122 +128,15 @@ const ParseTip: React.FC<Props> = ({
const {
modelId,
dataSet,
dimensions,
metrics,
aggType,
queryMode,
queryType,
properties,
entity,
elementMatches,
nativeQuery,
textInfo = '',
} = currentParseInfo || {};
const entityAlias = entity?.alias?.[0]?.split('.')?.[0];
const getTipNode = () => {
const dimensionItems = dimensions?.filter(item => item.type === 'DIMENSION');
const itemValueClass = `${prefixCls}-tip-item-value`;
const entityId = dimensionFilters?.length > 0 ? dimensionFilters[0].value : undefined;
const entityAlias = entity?.alias?.[0]?.split('.')?.[0];
const entityName = elementMatches?.find(item => item.element?.type === 'ID')?.element.name;
const { type: agentType, name: agentName } = properties || {};
const fields =
queryMode === 'TAG_DETAIL' ? dimensionItems?.concat(metrics || []) : dimensionItems;
return (
<div className={`${prefixCls}-tip-content`}>
{!!agentType && queryMode !== 'LLM_S2SQL' ? (
<div className={`${prefixCls}-tip-item`}>
将由{agentType === 'plugin' ? '插件' : '内置'}工具
<span className={itemValueClass}>{agentName}</span>来解答
</div>
) : (
<>
{(queryMode?.includes('ENTITY') || queryMode === 'LLM_S2SQL') &&
typeof entityId === 'string' &&
!!entityAlias &&
!!entityName ? (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>{entityAlias}：</div>
<div className={itemValueClass}>{entityName}</div>
</div>
) : (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>数据集：</div>
<div className={itemValueClass}>{dataSet?.name}</div>
</div>
)}
{(queryType === ChatContextTypeQueryTypeEnum.AGGREGATE ||
queryType === 'METRIC_TAG' ||
queryType === 'DETAIL') && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>查询模式：</div>
<div className={itemValueClass}>
{queryType === ChatContextTypeQueryTypeEnum.AGGREGATE ||
queryType === 'METRIC_TAG'
? '聚合模式'
: '明细模式'}
</div>
</div>
)}
{queryType !== 'DETAIL' &&
metrics &&
metrics.length > 0 &&
!dimensions?.some(item => item.bizName?.includes('_id')) && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>指标：</div>
<div className={itemValueClass}>
{queryType === ChatContextTypeQueryTypeEnum.AGGREGATE || queryType === 'ID'
? metrics[0].name
: metrics.map(metric => metric.name).join('、')}
</div>
</div>
)}
{['METRIC_GROUPBY', 'METRIC_ORDERBY', 'TAG_DETAIL', 'LLM_S2SQL'].includes(queryMode!) &&
fields &&
fields.length > 0 && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>
{queryType === 'DETAIL' ? '查询字段' : '下钻维度'}：
</div>
<div className={itemValueClass}>
{fields
.slice(0, MAX_OPTION_VALUES_COUNT)
.map(field => field.name)
.join('、')}
{fields.length > MAX_OPTION_VALUES_COUNT && '...'}
</div>
</div>
)}
{queryMode !== 'TAG_ID' &&
!dimensions?.some(item => item.bizName?.includes('_id')) &&
entityInfo?.dimensions
?.filter(dimension => dimension.value != null)
.map(dimension => (
<div className={`${prefixCls}-tip-item`} key={dimension.itemId}>
<div className={`${prefixCls}-tip-item-name`}>{dimension.name}：</div>
<div className={itemValueClass}>{dimension.value}</div>
</div>
))}
{(queryMode === 'METRIC_ORDERBY' || queryMode === 'METRIC_MODEL') &&
aggType &&
aggType !== 'NONE' && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>聚合方式：</div>
<div className={itemValueClass}>{AGG_TYPE_MAP[aggType]}</div>
</div>
)}
</>
)}
</div>
);
};
const getFilterContent = (filters: any) => {
const itemValueClass = `${prefixCls}-tip-item-value`;
const { startDate, endDate } = dateInfo || {};
@@ -329,7 +217,7 @@ const ParseTip: React.FC<Props> = ({
const tipNode = (
<div className={`${prefixCls}-tip`}>
{getTipNode()}
{getTipNode({ parseInfo: currentParseInfo, dimensionFilters, entityInfo })}
{!(!!agentType && queryMode !== 'LLM_S2SQL') && getFiltersNode()}
</div>
);
@@ -341,25 +229,7 @@ const ParseTip: React.FC<Props> = ({
{!!parseTimeCost && isDeveloper && (
<span className={`${prefixCls}-title-tip`}>(耗时: {parseTimeCost}ms)</span>
)}
{parseInfoOptions?.length > 1 ? '：' : ''}
</div>
{!isSimpleMode && parseInfoOptions?.length > 1 && (
<div className={`${prefixCls}-content-options`}>
{parseInfoOptions.map((parseInfo, index) => (
<div
className={`${prefixCls}-content-option ${
parseInfo.id === currentParseInfo?.id ? `${prefixCls}-content-option-active` : ''
}`}
onClick={() => {
onSelectParseInfo(parseInfo);
}}
key={parseInfo.id}
>
解析{index + 1}
</div>
))}
</div>
)}
</div>,
isSimpleMode ? <MarkDown markdown={textInfo} /> : queryMode === 'PLAIN_TEXT' ? null : tipNode
);

119
webapp/packages/chat-sdk/src/components/ChatItem/ParseTipUtils.tsx Normal file
View File

@@ -0,0 +1,119 @@
import { ChatContextTypeQueryTypeEnum } from '../../common/constants';
import { AGG_TYPE_MAP, PREFIX_CLS } from '../../common/constants';
export const MAX_OPTION_VALUES_COUNT = 2;
export const prefixCls = `${PREFIX_CLS}-item`;
export const getTipNode = ({ parseInfo, dimensionFilters, entityInfo }) => {
const {
dataSet,
dimensions,
metrics,
aggType,
queryMode,
queryType,
properties,
entity,
elementMatches,
} = parseInfo || {};
const dimensionItems = dimensions?.filter(item => item.type === 'DIMENSION');
const itemValueClass = `${prefixCls}-tip-item-value`;
const entityId = dimensionFilters?.length > 0 ? dimensionFilters[0].value : undefined;
const entityAlias = entity?.alias?.[0]?.split('.')?.[0];
const entityName = elementMatches?.find(item => item.element?.type === 'ID')?.element.name;
const { type: agentType, name: agentName } = properties || {};
const fields =
queryMode === 'TAG_DETAIL' ? dimensionItems?.concat(metrics || []) : dimensionItems;
return (
<div className={`${prefixCls}-tip-content`}>
{!!agentType && queryMode !== 'LLM_S2SQL' ? (
<div className={`${prefixCls}-tip-item`}>
将由{agentType === 'plugin' ? '插件' : '内置'}工具
<span className={itemValueClass}>{agentName}</span>来解答
</div>
) : (
<>
{(queryMode?.includes('ENTITY') || queryMode === 'LLM_S2SQL') &&
typeof entityId === 'string' &&
!!entityAlias &&
!!entityName ? (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>{entityAlias}：</div>
<div className={itemValueClass}>{entityName}</div>
</div>
) : (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>数据集：</div>
<div className={itemValueClass}>{dataSet?.name}</div>
</div>
)}
{(queryType === ChatContextTypeQueryTypeEnum.AGGREGATE ||
queryType === 'METRIC_TAG' ||
queryType === 'DETAIL') && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>查询模式：</div>
<div className={itemValueClass}>
{queryType === ChatContextTypeQueryTypeEnum.AGGREGATE || queryType === 'METRIC_TAG'
? '聚合模式'
: '明细模式'}
</div>
</div>
)}
{queryType !== 'DETAIL' &&
metrics &&
metrics.length > 0 &&
!dimensions?.some(item => item.bizName?.includes('_id')) && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>指标：</div>
<div className={itemValueClass}>
{metrics.map(metric => metric.name).join('、')}
</div>
</div>
)}
{[
'METRIC_GROUPBY',
'METRIC_ORDERBY',
'TAG_DETAIL',
'LLM_S2SQL',
'METRIC_FILTER',
].includes(queryMode!) &&
fields &&
fields.length > 0 && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>
{queryType === 'DETAIL' ? '查询字段' : '下钻维度'}：
</div>
<div className={itemValueClass}>
{fields
.slice(0, MAX_OPTION_VALUES_COUNT)
.map(field => field.name)
.join('、')}
{fields.length > MAX_OPTION_VALUES_COUNT && '...'}
</div>
</div>
)}
{queryMode !== 'TAG_ID' &&
!dimensions?.some(item => item.bizName?.includes('_id')) &&
entityInfo?.dimensions
?.filter(dimension => dimension.value != null)
.map(dimension => (
<div className={`${prefixCls}-tip-item`} key={dimension.itemId}>
<div className={`${prefixCls}-tip-item-name`}>{dimension.name}：</div>
<div className={itemValueClass}>{dimension.value}</div>
</div>
))}
{(queryMode === 'METRIC_ORDERBY' || queryMode === 'METRIC_MODEL') &&
aggType &&
aggType !== 'NONE' && (
<div className={`${prefixCls}-tip-item`}>
<div className={`${prefixCls}-tip-item-name`}>聚合方式：</div>
<div className={itemValueClass}>{AGG_TYPE_MAP[aggType]}</div>
</div>
)}
</>
)}
</div>
);
};

30
webapp/packages/chat-sdk/src/components/ChatItem/SimilarQuestionItem.tsx
View File

@@ -57,19 +57,23 @@ const SimilarQuestions: React.FC<Props> = ({
<div className={prefixCls}>
{expanded && (
<div className={`${prefixCls}-content`}>
{similarQuestions?.slice(0, 5).map((question, index) => {
return (
<div
className={`${prefixCls}-question`}
key={question.queryText}
onClick={() => {
onSelectQuestion(question);
}}
>
{index + 1}. {question.queryText}
</div>
);
})}
{Array.isArray(similarQuestions) && similarQuestions.length > 0 ? (
similarQuestions?.slice(0, 5).map((question, index) => {
return (
<div
className={`${prefixCls}-question`}
key={question.queryText}
onClick={() => {
onSelectQuestion(question);
}}
>
{index + 1}. {question.queryText}
</div>
);
})
) : (
<>暂无推荐</>
)}
</div>
)}
</div>

225
webapp/packages/chat-sdk/src/components/ChatItem/index.tsx
View File

@@ -10,9 +10,11 @@ import {
SimilarQuestionType,
} from '../../common/type';
import { useEffect, useState } from 'react';
import { chatExecute, chatParse, queryData, switchEntity } from '../../service';
import { chatExecute, chatParse, queryData, deleteQuery, switchEntity } from '../../service';
import { PARSE_ERROR_TIP, PREFIX_CLS, SEARCH_EXCEPTION_TIP } from '../../common/constants';
import { Spin } from 'antd';
import IconFont from '../IconFont';
import ExpandParseTip from './ExpandParseTip';
import ParseTip from './ParseTip';
import ExecuteItem from './ExecuteItem';
import { isMobile } from '../../utils/utils';
@@ -20,7 +22,9 @@ import classNames from 'classnames';
import Tools from '../Tools';
import SqlItem from './SqlItem';
import SimilarQuestionItem from './SimilarQuestionItem';
import { AgentType } from '../../Chat/type';
import dayjs, { Dayjs } from 'dayjs';
import { exportCsvFile } from '../../utils/utils';
type Props = {
msg: string;
@@ -39,6 +43,8 @@ type Props = {
renderCustomExecuteNode?: boolean;
isSimpleMode?: boolean;
isDebugMode?: boolean;
currentAgent?: AgentType;
isLastMessage?: boolean;
onMsgDataLoaded?: (data: MsgDataType, valid: boolean, isRefresh?: boolean) => void;
onUpdateMessageScroll?: () => void;
onSendMsg?: (msg: string) => void;
@@ -60,7 +66,9 @@ const ChatItem: React.FC<Props> = ({
executeItemNode,
renderCustomExecuteNode,
isSimpleMode,
currentAgent,
isDebugMode,
isLastMessage,
onMsgDataLoaded,
onUpdateMessageScroll,
onSendMsg,
@@ -82,6 +90,23 @@ const ChatItem: React.FC<Props> = ({
const [dataCache, setDataCache] = useState<Record<number, { tip: string; data?: MsgDataType }>>(
{}
);
const [isParserError, setIsParseError] = useState<boolean>(false);
const resetState = () => {
setParseLoading(false);
setParseTimeCost(undefined);
setParseInfo(undefined);
setParseInfoOptions([]);
setParseTip('');
setExecuteMode(false);
setDimensionFilters([]);
setData(undefined);
setExecuteErrorMsg('');
setDateInfo({} as DateInfoType);
setEntityInfo({} as EntityInfoType);
setDataCache({});
setIsParseError(false);
};
const prefixCls = `${PREFIX_CLS}-item`;
@@ -121,7 +146,8 @@ const ChatItem: React.FC<Props> = ({
const onExecute = async (
parseInfoValue: ChatContextType,
parseInfos?: ChatContextType[],
isSwitchParseInfo?: boolean
isSwitchParseInfo?: boolean,
isRefresh = false
) => {
setExecuteMode(true);
if (isSwitchParseInfo) {
@@ -138,7 +164,8 @@ const ChatItem: React.FC<Props> = ({
parseInfos,
queryId: parseInfoValue.queryId,
},
valid
valid,
isRefresh
);
} catch (e) {
const tip = SEARCH_EXCEPTION_TIP;
@@ -168,7 +195,13 @@ const ChatItem: React.FC<Props> = ({
const sendMsg = async () => {
setParseLoading(true);
const parseData: any = await chatParse(msg, conversationId, modelId, agentId, filter);
const parseData: any = await chatParse({
queryText: msg,
chatId: conversationId,
modelId,
agentId,
filters: filter,
});
setParseLoading(false);
const { code, data } = parseData || {};
const { state, selectedParses, candidateParses, queryId, parseTimeCost, errorMsg } = data || {};
@@ -180,6 +213,7 @@ const ChatItem: React.FC<Props> = ({
(!parses[0]?.properties?.type && !parses[0]?.queryMode)
) {
setParseTip(state === ParseStateEnum.FAILED && errorMsg ? errorMsg : PARSE_ERROR_TIP);
setParseInfo({ queryId } as any);
return;
}
@@ -188,20 +222,22 @@ const ChatItem: React.FC<Props> = ({
...item,
queryId,
}));
setParseInfoOptions(parseInfos || []);
const parseInfoValue = parseInfos[0];
setParseInfo(parseInfoValue);
if (!(currentAgent?.enableFeedback === 1 && parseInfos.length > 1)) {
setParseInfo(parseInfoValue);
}
setParseTimeCost(parseTimeCost);
setEntityInfo(parseInfoValue.entityInfo || {});
updateDimensionFitlers(parseInfoValue?.dimensionFilters || []);
setDateInfo(parseInfoValue?.dateInfo);
onExecute(parseInfoValue, parseInfos);
if (parseInfos.length === 1) {
onExecute(parseInfoValue, parseInfos);
}
};
useEffect(() => {
if (data !== undefined || executeTip !== '' || parseLoading) {
return;
}
const initChatItem = (msg, msgData) => {
if (msgData) {
const parseInfoOptionsValue =
parseInfos && parseInfos.length > 0
@@ -218,6 +254,13 @@ const ChatItem: React.FC<Props> = ({
} else if (msg) {
sendMsg();
}
};
useEffect(() => {
if (data !== undefined || executeTip !== '' || parseLoading) {
return;
}
initChatItem(msg, msgData);
}, [msg, msgData]);
const onSwitchEntity = async (entityId: string) => {
@@ -261,9 +304,9 @@ const ChatItem: React.FC<Props> = ({
});
};
const onRefresh = async () => {
const onRefresh = async (parseInfoValue?: ChatContextType) => {
setEntitySwitchLoading(true);
const { dimensions, metrics, id, queryId } = parseInfo || {};
const { dimensions, metrics, id, queryId } = parseInfoValue || parseInfo || {};
const chatContextValue = {
dimensions,
metrics,
@@ -290,6 +333,14 @@ const ChatItem: React.FC<Props> = ({
}
};
const deleteQueryInfo = async (queryId: number) => {
const { code, data } = await deleteQuery(queryId);
if (code === 200) {
resetState();
initChatItem(msg, undefined);
}
};
const onSelectParseInfo = async (parseInfoValue: ChatContextType) => {
setParseInfo(parseInfoValue);
updateDimensionFitlers(parseInfoValue.dimensionFilters || []);
@@ -315,6 +366,67 @@ const ChatItem: React.FC<Props> = ({
}
};
const onExpandSelectParseInfo = async (parseInfoValue: ChatContextType) => {
setParseInfo(parseInfoValue);
if (dataCache[parseInfoValue.id!]) {
const { tip, data } = dataCache[parseInfoValue.id!];
setExecuteTip(tip);
setData(data);
onMsgDataLoaded?.(
{
...(data as any),
parseInfos,
queryId: parseInfoValue.queryId,
},
true,
true
);
} else {
const { id: parseId, queryId } = parseInfoValue;
setExecuteMode(true);
setEntitySwitchLoading(true);
const { code, data }: any = await chatParse({
queryText: msg,
chatId: conversationId,
modelId,
agentId,
filters: filter,
parseId,
queryId,
parseInfo: parseInfoValue,
});
setEntitySwitchLoading(false);
if (code === 200) {
setParseTimeCost(data.parseTimeCost);
const parseInfo = data.selectedParses[0];
parseInfo.queryId = data.queryId;
setParseInfoOptions([parseInfo]);
setParseInfo(parseInfo);
updateDimensionFitlers(parseInfo.dimensionFilters || []);
setDateInfo(parseInfo.dateInfo);
if (parseInfo.entityInfo) {
setEntityInfo(parseInfo.entityInfo);
}
onExecute(parseInfo, [parseInfo], true, true);
}
}
};
const onExportData = () => {
const { queryColumns, queryResults } = data || {};
if (!!queryResults) {
const exportData = queryResults.map(item => {
return Object.keys(item).reduce((result, key) => {
const columnName = queryColumns?.find(column => column.nameEn === key)?.name || key;
result[columnName] = item[key];
return result;
}, {});
});
exportCsvFile(exportData);
}
};
const onSelectQuestion = (question: SimilarQuestionType) => {
onSendMsg?.(question.queryText);
};
@@ -326,7 +438,7 @@ const ChatItem: React.FC<Props> = ({
const { llmReq, llmResp } = parseInfo?.properties?.CONTEXT || {};
return (
<div className={prefixCls}>
<div className={prefixCls} key={parseInfo?.queryId}>
{!isMobile && <IconFont type="icon-zhinengsuanfa" className={`${prefixCls}-avatar`} />}
<div className={isMobile ? `${prefixCls}-mobile-msg-card` : ''}>
<div className={`${prefixCls}-time`}>
@@ -335,28 +447,56 @@ const ChatItem: React.FC<Props> = ({
: ''}
</div>
<div className={contentClass}>
<ParseTip
isSimpleMode={isSimpleMode}
parseLoading={parseLoading}
parseInfoOptions={parseInfoOptions}
parseTip={parseTip}
currentParseInfo={parseInfo}
agentId={agentId}
dimensionFilters={dimensionFilters}
dateInfo={dateInfo}
entityInfo={entityInfo}
integrateSystem={integrateSystem}
parseTimeCost={parseTimeCost?.parseTime}
isDeveloper={isDeveloper}
onSelectParseInfo={onSelectParseInfo}
onSwitchEntity={onSwitchEntity}
onFiltersChange={onFiltersChange}
onDateInfoChange={onDateInfoChange}
onRefresh={onRefresh}
handlePresetClick={handlePresetClick}
/>
{executeMode && (
{!isSimpleMode && (
<>
{currentAgent?.enableFeedback === 1 && parseInfoOptions.length > 1 ? (
<ExpandParseTip
parseLoading={parseLoading}
parseInfoOptions={parseInfoOptions}
parseTip={parseTip}
currentParseInfo={parseInfo}
agentId={agentId}
dimensionFilters={dimensionFilters}
dateInfo={dateInfo}
entityInfo={entityInfo}
integrateSystem={integrateSystem}
parseTimeCost={parseTimeCost?.parseTime}
isDeveloper={isDeveloper}
onSelectParseInfo={onExpandSelectParseInfo}
onSwitchEntity={onSwitchEntity}
onFiltersChange={onFiltersChange}
onDateInfoChange={onDateInfoChange}
onRefresh={onRefresh}
handlePresetClick={handlePresetClick}
/>
) : (
<ParseTip
parseLoading={parseLoading}
parseInfoOptions={parseInfoOptions}
parseTip={parseTip}
currentParseInfo={parseInfo}
agentId={agentId}
dimensionFilters={dimensionFilters}
dateInfo={dateInfo}
entityInfo={entityInfo}
integrateSystem={integrateSystem}
parseTimeCost={parseTimeCost?.parseTime}
isDeveloper={isDeveloper}
onSelectParseInfo={onSelectParseInfo}
onSwitchEntity={onSwitchEntity}
onFiltersChange={onFiltersChange}
onDateInfoChange={onDateInfoChange}
onRefresh={() => {
onRefresh();
}}
handlePresetClick={handlePresetClick}
/>
)}
</>
)}
{executeMode && (
<Spin spinning={entitySwitchLoading}>
{!isMobile && parseInfo?.sqlInfo && isDeveloper && isDebugMode && !isSimpleMode && (
<SqlItem
agentId={agentId}
@@ -377,7 +517,7 @@ const ChatItem: React.FC<Props> = ({
question={msg}
queryMode={parseInfo?.queryMode}
executeLoading={executeLoading}
entitySwitchLoading={entitySwitchLoading}
// entitySwitchLoading={entitySwitchLoading}
executeTip={executeTip}
chartIndex={0}
data={data}
@@ -386,7 +526,7 @@ const ChatItem: React.FC<Props> = ({
isDeveloper={isDeveloper}
renderCustomExecuteNode={renderCustomExecuteNode}
/>
</>
</Spin>
)}
{executeMode &&
!executeLoading &&
@@ -402,7 +542,18 @@ const ChatItem: React.FC<Props> = ({
</div>
{(parseTip !== '' || (executeMode && !executeLoading)) &&
parseInfo?.queryMode !== 'PLAIN_TEXT' && (
<Tools queryId={parseInfo?.queryId || 0} scoreValue={score} />
<Tools
isLastMessage={isLastMessage}
queryId={parseInfo?.queryId || 0}
scoreValue={score}
isParserError={isParserError}
onExportData={() => {
onExportData();
}}
onReExecute={queryId => {
deleteQueryInfo(queryId);
}}
/>
)}
</div>
</div>

52
webapp/packages/chat-sdk/src/components/ChatItem/style.less
View File

@@ -10,6 +10,43 @@
display: flex;
width: 100%;
// @keyframes breathing-text {
// 0% { font-size: 20px; color: #4c96f6; }
// 50% { font-size: 20px; color: #dce0f0; }
// 100% { font-size: 20px; color: #0000ff; }
// }
// &-breathing-text {
// font-family: Arial, sans-serif;
// animation: breathing-text 3s infinite;
// }
&-breathing-text {
--bg-size: 400%;
--color-one: hsl(235, 87%, 34%);
--color-two: hsl(203, 95%, 55%);
font-size: 14px;
background: linear-gradient(
90deg,
var(--color-one),
var(--color-two),
var(--color-one)
) 0 0 / var(--bg-size) 100%;
color: transparent;
background-clip: text;
-webkit-background-clip: text;
animation: move-bg 8s infinite linear;
}
@keyframes move-bg {
to {
background-position: var(--bg-size) 0;
}
}
&-loading {
display: inline-block;
width: 60px;
@@ -53,6 +90,16 @@
}
}
&-content-parser-container {
margin: 20px 0 0 10px;
}
&-content-parser-options-title {
margin-right: 8px;
color: var(--text-color);
font-weight: 500;
}
&-content-options {
display: flex;
align-items: center;
@@ -182,6 +229,11 @@
padding-bottom: 10px;
}
&-content-container-simple {
border-left: none;
padding: 0;
}
&-empty-content-container {
padding-bottom: 0;
}

71
webapp/packages/chat-sdk/src/components/Tools/index.tsx
View File

@@ -1,5 +1,6 @@
import { isMobile } from '../../utils/utils';
import { DislikeOutlined, LikeOutlined } from '@ant-design/icons';
import { DislikeOutlined, LikeOutlined, DownloadOutlined, RedoOutlined } from '@ant-design/icons';
import { Button } from 'antd';
import { CLS_PREFIX } from '../../common/constants';
import { useState } from 'react';
import classNames from 'classnames';
@@ -9,11 +10,21 @@ type Props = {
queryId: number;
scoreValue?: number;
isLastMessage?: boolean;
isParserError?: boolean;
onExportData?: () => void;
onReExecute?: (queryId: number) => void;
};
const Tools: React.FC<Props> = ({ queryId, scoreValue, isLastMessage }) => {
const Tools: React.FC<Props> = ({
queryId,
scoreValue,
isLastMessage,
isParserError = false,
onExportData,
onReExecute,
}) => {
const [score, setScore] = useState(scoreValue || 0);
const [exportLoading, setExportLoading] = useState<boolean>(false);
const prefixCls = `${CLS_PREFIX}-tools`;
const like = () => {
@@ -37,15 +48,51 @@ const Tools: React.FC<Props> = ({ queryId, scoreValue, isLastMessage }) => {
<div className={prefixCls}>
{!isMobile && (
<div className={`${prefixCls}-feedback`}>
<div>这个回答正确吗？</div>
<LikeOutlined className={likeClass} onClick={like} />
<DislikeOutlined
className={dislikeClass}
onClick={e => {
e.stopPropagation();
dislike();
}}
/>
{/* <div>这个回答正确吗？</div> */}
<div className={`${prefixCls}-feedback-left`}>
{!isParserError && (
<>
<Button
size="small"
onClick={() => {
setExportLoading(true);
onExportData?.();
setTimeout(() => {
setExportLoading(false);
}, 1000);
}}
type="text"
loading={exportLoading}
>
<DownloadOutlined />
<span className={`${prefixCls}-font-style`}>导出数据</span>
</Button>
{isLastMessage && (
<Button
size="small"
onClick={() => {
onReExecute?.(queryId);
}}
type="text"
>
<RedoOutlined />
<span className={`${prefixCls}-font-style`}>再试一次</span>
</Button>
)}
</>
)}
</div>
<div className={`${prefixCls}-feedback-left`}>
<LikeOutlined className={likeClass} onClick={like} style={{ marginRight: 10 }} />
<DislikeOutlined
className={dislikeClass}
onClick={e => {
e.stopPropagation();
dislike();
}}
/>
</div>
</div>
)}
</div>

14
webapp/packages/chat-sdk/src/components/Tools/style.less
View File

@@ -11,11 +11,14 @@
&-feedback {
display: flex;
align-items: center;
margin-left: 4px;
justify-content: space-between;
width: 100%;
padding: 0 10px 0 10px;
color: var(--text-color-third);
column-gap: 6px;
column-gap: 20px;
}
&-like {
margin-right: 4px;
}
@@ -54,4 +57,11 @@
font-weight: 500;
color: var(--text-color);
}
&-font-style {
font-size: 12px;
color: grey;
font-style: italic;
text-align: center;
}
}

33
webapp/packages/chat-sdk/src/service/index.ts
View File

@@ -40,18 +40,33 @@ export function chatQuery(queryText: string, chatId?: number, modelId?: number,
});
}
export function chatParse(
queryText: string,
chatId?: number,
modelId?: number,
agentId?: number,
filters?: any[]
) {
export function chatParse({
queryText,
chatId,
modelId,
agentId,
parseId,
queryId,
filters,
parseInfo,
}: {
queryText: string;
chatId?: number;
modelId?: number;
agentId?: number;
queryId?: number;
parseId?: number;
filters?: any[];
parseInfo?: ChatContextType;
}) {
return axios.post<ParseDataType>(`${prefix}/chat/query/parse`, {
queryText,
chatId: chatId || DEFAULT_CHAT_ID,
dataSetId: modelId,
agentId,
parseId,
queryId,
selectedParse: parseInfo,
queryFilters: filters
? {
filters,
@@ -102,6 +117,10 @@ export function querySimilarQuestions(queryId: number) {
return axios.get<HistoryMsgItemType>(`${prefix}/chat/manage/getChatQuery/${queryId}`);
}
export function deleteQuery(queryId: number) {
return axios.delete<any>(`${prefix}/chat/manage/${queryId}`);
}
export function queryEntities(entityId: string | number, modelId: number) {
return axios.post<any>(`${prefix}/chat/query/choice`, {
entityId,

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

@@ -183,5 +183,5 @@ export default defineConfig({
alias: {
'supersonic-chat-sdk': path.resolve(__dirname, '../../chat-sdk/src/'),
},
esbuildMinifyIIFE: true,
// esbuildMinifyIIFE: true,
});

3
webapp/packages/supersonic-fe/config/proxy.ts
View File

@@ -1,7 +1,8 @@
export default {
dev: {
'/api/': {
target: 'http://127.0.0.1:9080',
// target: 'http://localhost:9080',
target: 'http://10.91.217.39:9080',
changeOrigin: true,
},
},

12
webapp/packages/supersonic-fe/config/routes.ts
View File

@@ -42,12 +42,12 @@ const ROUTES = [
component: './Agent',
envEnableList: [ENV_KEY.CHAT],
},
// {
// path: '/plugin',
// name: 'plugin',
// component: './ChatPlugin',
// envEnableList: [ENV_KEY.CHAT],
// },
{
path: '/plugin',
name: 'plugin',
component: './ChatPlugin',
envEnableList: [ENV_KEY.CHAT],
},
{
path: '/model/metric/edit/:metricId',
name: 'metricEdit',

2
webapp/packages/supersonic-fe/src/locales/zh-CN/menu.ts
View File

@@ -16,7 +16,7 @@ export default {
'menu.database': '数据库管理',
'menu.llm': '大模型管理',
'menu.chatSetting': '问答设置',
'menu.plugin': '工具管理',
'menu.plugin': '插件管理',
'menu.login': '登录',
'menu.system': '系统设置',
'menu.chat': '问答对话',

8
webapp/packages/supersonic-fe/src/pages/SemanticModel/Datasource/constants.ts
View File

@@ -61,10 +61,10 @@ export const TYPE_OPTIONS = [
label: '主键',
value: EnumDataSourceType.PRIMARY,
},
// {
// label: '外键',
// value: EnumDataSourceType.FOREIGN,
// },
{
label: '外键',
value: EnumDataSourceType.FOREIGN,
},
];
export const AGG_OPTIONS = [

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

@@ -52,11 +52,13 @@ const DimensionValueFilterModal: React.FC<Props> = ({
{[DimensionValueListType.BLACK_LIST, DimensionValueListType.WHITE_LIST].includes(
listType,
) && (
<DimensionValueFilterTable
dataSource={knowledgeConfig?.config?.[listType]}
listType={listType}
onMenuClick={onMenuClick}
/>
<div key={listType}>
<DimensionValueFilterTable
dataSource={knowledgeConfig?.config?.[listType]}
listType={listType}
onMenuClick={onMenuClick}
/>
</div>
)}
{DimensionValueListType.RULE_LIST === listType && (
<div style={{ marginTop: 20 }}>

29050
webapp/pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff