mirror of
https://github.com/tencentmusic/supersonic.git
synced 2025-12-12 20:51:48 +00:00
[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. (#1049)
* [improvement][semantic-fe] Add model alias setting & Add view permission restrictions to the model permission management tab. [improvement][semantic-fe] Add permission control to the action buttons for the main domain; apply high sensitivity filtering to the authorization of metrics/dimensions. [improvement][semantic-fe] Optimize the editing mode in the dimension/metric/datasource components to use the modelId stored in the database for data, instead of relying on the data from the state manager. * [improvement][semantic-fe] Add time granularity setting in the data source configuration. * [improvement][semantic-fe] Dictionary import for dimension values supported in Q&A visibility * [improvement][semantic-fe] Modification of data source creation prompt wording" * [improvement][semantic-fe] metric market experience optimization * [improvement][semantic-fe] enhance the analysis of metric trends * [improvement][semantic-fe] optimize the presentation of metric trend permissions * [improvement][semantic-fe] add metric trend download functionality * [improvement][semantic-fe] fix the dimension initialization issue in metric correlation * [improvement][semantic-fe] Fix the issue of database changes not taking effect when creating based on an SQL data source. * [improvement][semantic-fe] Optimizing pagination logic and some CSS styles * [improvement][semantic-fe] Fixing the API for the indicator list by changing "current" to "pageNum" * [improvement][semantic-fe] Fixing the default value setting for the indicator list * [improvement][semantic-fe] Adding batch operations for indicators/dimensions/models * [improvement][semantic-fe] Replacing the single status update API for indicators/dimensions with a batch update API * [improvement][semantic-fe] Redesigning the indicator homepage to incorporate trend charts and table functionality for indicators * [improvement][semantic-fe] Optimizing the logic for setting dimension values and editing data sources, and adding system settings functionality * [improvement][semantic-fe] Upgrading antd version to 5.x, extracting the batch operation button component, optimizing the interaction for system settings, and expanding the configuration generation types for list-to-select component. * [improvement][semantic-fe] Adding the ability to filter dimensions based on whether they are tags or not. * [improvement][semantic-fe] Adding the ability to edit relationships between models in the canvas. * [improvement][semantic-fe] Updating the datePicker component to use dayjs instead. * [improvement][semantic-fe] Fixing the issue with passing the model ID for dimensions in the indicator market. * [improvement][semantic-fe] Fixing the abnormal state of the popup when creating a model. * [improvement][semantic-fe] Adding permission logic for bulk operations in the indicator market. * [improvement][semantic-fe] Adding the ability to download and transpose data. * [improvement][semantic-fe] Fixing the initialization issue with the date selection component in the indicator details page when switching time granularity. * [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.
This commit is contained in:
tristanliu
@@ -1,6 +1,6 @@
|
||||
import { Settings as LayoutSettings } from '@ant-design/pro-layout';
|
||||
import { ProLayoutProps } from '@ant-design/pro-components';
|
||||
|
||||
const Settings: LayoutSettings & {
|
||||
const Settings: ProLayoutProps & {
|
||||
pwa?: boolean;
|
||||
logo?: string;
|
||||
} = {
|
||||
@@ -14,11 +14,11 @@ const Settings: LayoutSettings & {
|
||||
title: '',
|
||||
pwa: false,
|
||||
iconfontUrl: '//at.alicdn.com/t/c/font_4120566_x5c4www9bqm.js',
|
||||
splitMenus: true,
|
||||
menu: {
|
||||
autoClose: false,
|
||||
ignoreFlatMenu: true,
|
||||
},
|
||||
// splitMenus: true,
|
||||
// menu: {
|
||||
// autoClose: false,
|
||||
// ignoreFlatMenu: true,
|
||||
// },
|
||||
};
|
||||
export const publicPath = '/webapp/';
|
||||
|
||||
|
||||
@@ -57,7 +57,6 @@
|
||||
"dependencies": {
|
||||
"@ant-design/icons": "^5.2.6",
|
||||
"@ant-design/pro-components": "2.7.0",
|
||||
"@ant-design/pro-layout": "^7.17.15",
|
||||
"@antv/dom-util": "^2.0.4",
|
||||
"@antv/g6": "^4.8.23",
|
||||
"@antv/g6-core": "^0.8.23",
|
||||
@@ -83,22 +82,20 @@
|
||||
"jsencrypt": "^3.0.1",
|
||||
"lodash": "^4.17.11",
|
||||
"moment": "^2.29.1",
|
||||
"nprogress": "^0.2.0",
|
||||
"numeral": "^2.0.6",
|
||||
"omit.js": "^2.0.2",
|
||||
"path-to-regexp": "^2.4.0",
|
||||
"qs": "^6.9.0",
|
||||
"query-string": "^9.0.0",
|
||||
"react": "^17.0.0",
|
||||
"react": "^18.3.1",
|
||||
"react-ace": "^9.4.1",
|
||||
"react-dev-inspector": "^1.8.4",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-fast-marquee": "^1.6.0",
|
||||
"react-helmet-async": "^1.0.4",
|
||||
"react-spinners": "^0.10.6",
|
||||
"react-dom": "^18.3.1",
|
||||
"react-spinners": "^0.13.8",
|
||||
"react-split-pane": "^2.0.3",
|
||||
"react-syntax-highlighter": "^15.4.3",
|
||||
"sql-formatter": "^2.3.3",
|
||||
"supersonic-chat-sdk": "^1.1.6",
|
||||
"supersonic-chat-sdk": "^1.1.7",
|
||||
"supersonic-insights-flow-components": "^1.4.9",
|
||||
"umi-request": "1.4.0"
|
||||
},
|
||||
@@ -114,11 +111,11 @@
|
||||
"@types/lodash": "^4.14.144",
|
||||
"@types/pinyin": "^2.8.3",
|
||||
"@types/qs": "^6.5.3",
|
||||
"@types/react": "^17.0.0",
|
||||
"@types/react-dom": "^17.0.0",
|
||||
"@types/react": "18.3.1",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"@types/react-helmet": "^6.1.0",
|
||||
"@umijs/max": "^4.2.5",
|
||||
"@umijs/fabric": "^4.0.1",
|
||||
"@umijs/max": "^4.2.5",
|
||||
"@umijs/plugin-model": "^2.6.2",
|
||||
"carlo": "^0.9.46",
|
||||
"cross-port-killer": "^1.1.1",
|
||||
@@ -141,7 +138,7 @@
|
||||
"node": ">=16.0.0 <20.0.0"
|
||||
},
|
||||
"resolutions": {
|
||||
"@types/react": "17.0.0"
|
||||
"@types/react": "18.3.1"
|
||||
},
|
||||
"__npminstall_done": false
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
import RightContent from '@/components/RightContent';
|
||||
import S2Icon, { ICON } from '@/components/S2Icon';
|
||||
import type { Settings as LayoutSettings } from '@ant-design/pro-layout';
|
||||
import type { Settings as LayoutSettings } from '@ant-design/pro-components';
|
||||
import { Space, Spin, ConfigProvider } from 'antd';
|
||||
import ScaleLoader from 'react-spinners/ScaleLoader';
|
||||
import { history, RunTimeLayoutConfig } from '@umijs/max';
|
||||
@@ -13,6 +13,7 @@ import { Copilot } from 'supersonic-chat-sdk';
|
||||
import { configProviderTheme } from '../config/themeSettings';
|
||||
export { request } from './services/request';
|
||||
import { ROUTE_AUTH_CODES } from '../config/routes';
|
||||
import AppPage from './pages/index';
|
||||
|
||||
const replaceRoute = '/';
|
||||
|
||||
@@ -145,7 +146,8 @@ export const layout: RunTimeLayoutConfig = (params) => {
|
||||
height: location.pathname.includes('chat') ? 'calc(100vh - 56px)' : undefined,
|
||||
}}
|
||||
>
|
||||
{dom}
|
||||
<AppPage dom={dom} />
|
||||
{/* {dom} */}
|
||||
{history.location.pathname !== '/chat' && !isMobile && (
|
||||
<Copilot token={getToken() || ''} isDeveloper />
|
||||
)}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
.title {
|
||||
font-family: var(--tencent-font-family);
|
||||
margin-bottom: 5px;
|
||||
// margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.subTitleContainer {
|
||||
|
||||
@@ -96,42 +96,35 @@ ol {
|
||||
}
|
||||
}
|
||||
|
||||
.ant-card-body {
|
||||
padding: 24px !important;
|
||||
}
|
||||
// .ant-card-body {
|
||||
// padding: 24px !important;
|
||||
// }
|
||||
|
||||
.ant-modal-body {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.ant-pro-page-container-children-content {
|
||||
margin: 12px 12px 0 !important;
|
||||
}
|
||||
// .ant-pro-page-container-children-content {
|
||||
// margin: 12px 12px 0 !important;
|
||||
// }
|
||||
|
||||
// .ant-page-header {
|
||||
// padding-bottom: 10px !important;
|
||||
// }
|
||||
|
||||
.ant-spin-spinning {
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
}
|
||||
// .ant-spin-spinning {
|
||||
// display: flex !important;
|
||||
// align-items: center !important;
|
||||
// justify-content: center !important;
|
||||
// }
|
||||
|
||||
// .ant-table-selection-extra {
|
||||
// .ant-dropdown-trigger {
|
||||
// display: none !important;
|
||||
// }
|
||||
// }
|
||||
|
||||
.ant-table-selection-extra {
|
||||
.ant-dropdown-trigger {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.initialLoading {
|
||||
.ant-spin-spinning {
|
||||
max-height: none !important;
|
||||
}
|
||||
.loadingPlaceholder {
|
||||
height: 100vh;
|
||||
}
|
||||
}
|
||||
.ant-pro-layout .ant-pro-layout-bg-list {
|
||||
background: #fafafb;
|
||||
}
|
||||
@@ -146,57 +139,40 @@ ol {
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// .ant-menu-root>.ant-menu-item,
|
||||
// .ant-menu-root>.ant-menu-submenu {
|
||||
// font-weight: bold;
|
||||
// font-size: 14px;
|
||||
// &>span>a,
|
||||
// &>a {
|
||||
// color: white;
|
||||
// &:hover {
|
||||
// color: white;
|
||||
// }
|
||||
// }
|
||||
// &:hover {
|
||||
// background-color: #296DF3!important;
|
||||
// }
|
||||
// }
|
||||
.ant-table-wrapper {
|
||||
.ant-spin .ant-spin-dot {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-root>.ant-menu-item.ant-menu-item-selected {
|
||||
// background-color: #296DF3!important;
|
||||
color: var(--tme-primary-color);
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.ant-menu-light.ant-menu-horizontal >.ant-menu-item-selected::after {
|
||||
.ant-menu-light.ant-menu-horizontal >.ant-menu-item:hover {
|
||||
background: #f0f5ff;
|
||||
}
|
||||
.ant-menu-light .ant-menu-item:not(.ant-menu-item-selected):not(.ant-menu-submenu-selected):hover {
|
||||
color: var(--tme-primary-color);
|
||||
}
|
||||
|
||||
.ant-menu-light.ant-menu-horizontal >.ant-menu-item-selected:hover::after {
|
||||
border-bottom-color: var(--tme-primary-color);
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
.ant-menu-light.ant-menu-horizontal >.ant-menu-item-selected::after {
|
||||
border-bottom-color: var(--tme-primary-color);
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
|
||||
.ant-menu-light.ant-menu-horizontal >.ant-menu-item:hover::after {
|
||||
border-bottom-color: var(--tme-primary-color);
|
||||
}
|
||||
|
||||
// .ant-menu-light.ant-menu-horizontal >.ant-menu-item-selected::hover {
|
||||
// border-bottom-width: 2px;
|
||||
// border-bottom-color: var(--tme-primary-color);
|
||||
// }
|
||||
|
||||
.ant-pro-top-nav-header-logo h1 {
|
||||
// font-size: 18px;
|
||||
color: var(--tme-primary-color)
|
||||
.ant-pro-table-list-toolbar-container-mobile {
|
||||
flex-direction: unset;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// .ant-pro-top-nav-header-main-left {
|
||||
// min-width: 100px !important;
|
||||
// }
|
||||
|
||||
// .ant-pro-top-nav-header-logo {
|
||||
// min-width: 100px !important;
|
||||
// }
|
||||
|
||||
|
||||
.logo {
|
||||
position: relative;
|
||||
color: #fff;
|
||||
@@ -291,4 +267,50 @@ ol {
|
||||
color: rgb(38, 38, 38);
|
||||
}
|
||||
}
|
||||
|
||||
.ant-form-item .ant-form-item-label > label {
|
||||
font-family: "tencentFont", sans-serif;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.supersonicForm {
|
||||
padding: 0 20px;
|
||||
:global {
|
||||
.ant-input-search .ant-input-search-button {
|
||||
height: 42px;
|
||||
}
|
||||
.ant-switch.ant-switch-checked {
|
||||
background: var(--tme-primary-color);
|
||||
}
|
||||
.ant-form-item .ant-form-item-label > label {
|
||||
color:#262626;
|
||||
}
|
||||
.ant-form-item-label {
|
||||
font-family: "tencentFont", sans-serif;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.ant-input {
|
||||
padding: 9px 14px 9px 12px;
|
||||
}
|
||||
.ant-select {
|
||||
&.ant-select-single {
|
||||
height: auto;
|
||||
}
|
||||
&.ant-select-multiple {
|
||||
.ant-select-selector {
|
||||
padding: 6px 14px 6px 12px;
|
||||
}
|
||||
}
|
||||
.ant-select-selector {
|
||||
padding: 5px 14px 5px 12px;
|
||||
.ant-select-selection-placeholder {
|
||||
padding: 0px 8px 0px 8px;
|
||||
}
|
||||
.ant-select-selection-overflow-item {
|
||||
.ant-select-selection-item {
|
||||
color: rgb(22, 119, 255);
|
||||
background-color: rgb(230, 244, 255);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,9 +1,23 @@
|
||||
import { Form, Modal, Input, Button, Switch } from 'antd';
|
||||
import {
|
||||
Form,
|
||||
Modal,
|
||||
Input,
|
||||
Button,
|
||||
Switch,
|
||||
Tabs,
|
||||
Slider,
|
||||
InputNumber,
|
||||
Select,
|
||||
Row,
|
||||
Col,
|
||||
Space,
|
||||
} from 'antd';
|
||||
import { AgentType } from './type';
|
||||
import { useEffect, useState } from 'react';
|
||||
import styles from './style.less';
|
||||
import { DeleteOutlined, PlusOutlined } from '@ant-design/icons';
|
||||
import { uuid } from '@/utils/utils';
|
||||
import globalStyles from '@/global.less';
|
||||
|
||||
const FormItem = Form.Item;
|
||||
const { TextArea } = Input;
|
||||
@@ -17,6 +31,7 @@ type Props = {
|
||||
const AgentModal: React.FC<Props> = ({ editAgent, onSaveAgent, onCancel }) => {
|
||||
const [saveLoading, setSaveLoading] = useState(false);
|
||||
const [examples, setExamples] = useState<{ id: string; question?: string }[]>([]);
|
||||
const [formData, setFormData] = useState<any>({});
|
||||
const [form] = Form.useForm();
|
||||
|
||||
useEffect(() => {
|
||||
@@ -32,7 +47,8 @@ const AgentModal: React.FC<Props> = ({ editAgent, onSaveAgent, onCancel }) => {
|
||||
|
||||
const layout = {
|
||||
labelCol: { span: 6 },
|
||||
wrapperCol: { span: 14 },
|
||||
wrapperCol: { span: 16 },
|
||||
// layout: 'vertical',
|
||||
};
|
||||
|
||||
const onOk = async () => {
|
||||
@@ -48,22 +64,48 @@ const AgentModal: React.FC<Props> = ({ editAgent, onSaveAgent, onCancel }) => {
|
||||
setSaveLoading(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title={editAgent ? '编辑助理' : '新建助理'}
|
||||
confirmLoading={saveLoading}
|
||||
width={800}
|
||||
onOk={onOk}
|
||||
onCancel={onCancel}
|
||||
const formTabList = [
|
||||
{
|
||||
label: '基本信息',
|
||||
children: (
|
||||
<>
|
||||
<FormItem
|
||||
name="name"
|
||||
label="名称"
|
||||
rules={[{ required: true, message: '请输入助理名称' }]}
|
||||
>
|
||||
<Form {...layout} form={form} initialValues={{ enableSearch: true }}>
|
||||
<FormItem name="name" label="名称" rules={[{ required: true, message: '请输入助理名称' }]}>
|
||||
<Input placeholder="请输入助理名称" />
|
||||
</FormItem>
|
||||
{/* <FormItem name={['visualConfig', 'defaultShowType']} label="问答默认格式">
|
||||
<Select
|
||||
placeholder=""
|
||||
options={[
|
||||
{
|
||||
label: '文本',
|
||||
value: 'TEXT',
|
||||
},
|
||||
{
|
||||
label: '表格',
|
||||
value: 'TABLE',
|
||||
},
|
||||
{
|
||||
label: '图表',
|
||||
value: 'WIDGET',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</FormItem> */}
|
||||
<FormItem name="enableSearch" label="支持联想" valuePropName="checked">
|
||||
<Switch checkedChildren="开启" unCheckedChildren="关闭" />
|
||||
<Switch />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
name={['multiTurnConfig', 'enableMultiTurn']}
|
||||
label="开启多轮"
|
||||
valuePropName="checked"
|
||||
>
|
||||
<Switch />
|
||||
</FormItem>
|
||||
|
||||
<FormItem name="examples" label="示例问题">
|
||||
<div className={styles.paramsSection}>
|
||||
{examples.map((example) => {
|
||||
@@ -101,6 +143,91 @@ const AgentModal: React.FC<Props> = ({ editAgent, onSaveAgent, onCancel }) => {
|
||||
<FormItem name="description" label="描述">
|
||||
<TextArea placeholder="请输入助理描述" />
|
||||
</FormItem>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: '大模型配置',
|
||||
children: (
|
||||
<>
|
||||
<FormItem name={['llmConfig', 'provider']} label="模型提供方式">
|
||||
<Select placeholder="">
|
||||
{['OPEN_AI'].map((item) => (
|
||||
<Select.Option key={item} value={item}>
|
||||
{item}
|
||||
</Select.Option>
|
||||
))}
|
||||
</Select>
|
||||
</FormItem>
|
||||
<FormItem name={['llmConfig', 'modelName']} label="大模型名称">
|
||||
<Input placeholder="请输入大模型名称" />
|
||||
</FormItem>
|
||||
<FormItem name={['llmConfig', 'baseUrl']} label="Base URL">
|
||||
<Input placeholder="请输入Base URL" />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
name={['llmConfig', 'apiKey']}
|
||||
label="API KEY"
|
||||
// hidden={formData?.llmConfig?.provider === 'LOCAL_AI'}
|
||||
>
|
||||
<Input placeholder="请输入API KEY" />
|
||||
</FormItem>
|
||||
|
||||
<FormItem name={['llmConfig', 'temperature']} label="回复随机性">
|
||||
<Slider
|
||||
min={0}
|
||||
max={1}
|
||||
step={0.1}
|
||||
marks={{
|
||||
0: '精准',
|
||||
1: '随机',
|
||||
}}
|
||||
defaultValue={0}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem name={['llmConfig', 'timeOut']} label="超时时间(秒)">
|
||||
<InputNumber />
|
||||
</FormItem>
|
||||
</>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title={editAgent ? '编辑助理' : '新建助理'}
|
||||
confirmLoading={saveLoading}
|
||||
width={800}
|
||||
onOk={onOk}
|
||||
onCancel={onCancel}
|
||||
>
|
||||
<Form
|
||||
{...layout}
|
||||
form={form}
|
||||
initialValues={{
|
||||
enableSearch: true,
|
||||
llmConfig: {
|
||||
timeOut: 60,
|
||||
provider: 'OPEN_AI',
|
||||
},
|
||||
}}
|
||||
onValuesChange={(value, values) => {
|
||||
setFormData(values);
|
||||
}}
|
||||
className={globalStyles.supersonicForm}
|
||||
>
|
||||
<Tabs
|
||||
tabPosition={'left'}
|
||||
items={formTabList.map((item) => {
|
||||
const { label, children } = item;
|
||||
return {
|
||||
label,
|
||||
key: label,
|
||||
children,
|
||||
};
|
||||
})}
|
||||
/>
|
||||
</Form>
|
||||
</Modal>
|
||||
);
|
||||
|
||||
@@ -93,19 +93,50 @@ const ToolsSection: React.FC<Props> = ({ currentAgent, onSaveAgent, onEditAgent,
|
||||
onEditAgent(currentAgent);
|
||||
}}
|
||||
>
|
||||
修改基本信息
|
||||
修改信息
|
||||
</Button>
|
||||
</div>
|
||||
<div className={styles.infoContent}>
|
||||
<div className={styles.infoItem}>
|
||||
示例问题：
|
||||
<span className={styles.label}> 示例问题：</span>
|
||||
<Space>
|
||||
{currentAgent?.examples?.map((item) => (
|
||||
<Tag key={item}>{item}</Tag>
|
||||
))}
|
||||
</Space>
|
||||
</div>
|
||||
<div className={styles.infoItem}>描述：{currentAgent?.description}</div>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}> 描述： </span>
|
||||
{currentAgent?.description}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.basicInfo}>
|
||||
<div className={styles.basicInfoTitle}>大模型信息</div>
|
||||
<div className={styles.infoContent}>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}> 模型提供方式：</span>
|
||||
{currentAgent?.llmConfig?.provider}
|
||||
</div>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}>大模型名称:</span>
|
||||
{currentAgent?.llmConfig?.modelName}
|
||||
</div>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}>Base URL: </span>
|
||||
{currentAgent?.llmConfig?.baseUrl}
|
||||
</div>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}>API KEY:</span>
|
||||
{currentAgent?.llmConfig?.apiKey}
|
||||
</div>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}>回复随机性: </span>
|
||||
{currentAgent?.llmConfig?.temperature}
|
||||
</div>
|
||||
<div className={styles.infoItem}>
|
||||
<span className={styles.label}>超时时间(秒): </span> {currentAgent?.llmConfig?.timeOut}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.toolSection}>
|
||||
|
||||
@@ -15,13 +15,13 @@
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 20px;
|
||||
// margin-top: 20px;
|
||||
.searchBar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 30px;
|
||||
margin-bottom: 40px;
|
||||
|
||||
margin-bottom: 20px;
|
||||
justify-content: right;
|
||||
.searchControl {
|
||||
width: 500px;
|
||||
}
|
||||
@@ -195,6 +195,14 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 12px;
|
||||
.infoItem {
|
||||
margin-bottom: 10px;
|
||||
.label {
|
||||
font-family: var(--tencent-font-family);
|
||||
margin-right: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -27,7 +27,7 @@ export const AGENT_TOOL_TYPE_LIST = [
|
||||
|
||||
export enum QueryModeEnum {
|
||||
METRIC = 'METRIC',
|
||||
TAG = 'TAG',
|
||||
DETAIL = 'DETAIL',
|
||||
}
|
||||
|
||||
export const QUERY_MODE_LIST = [
|
||||
@@ -36,8 +36,8 @@ export const QUERY_MODE_LIST = [
|
||||
value: QueryModeEnum.METRIC,
|
||||
},
|
||||
{
|
||||
label: '标签模式',
|
||||
value: QueryModeEnum.TAG,
|
||||
label: '明细模式',
|
||||
value: QueryModeEnum.DETAIL,
|
||||
},
|
||||
];
|
||||
|
||||
@@ -56,6 +56,22 @@ export type AgentConfigType = {
|
||||
tools: AgentToolType[];
|
||||
};
|
||||
|
||||
export type LlmConfigType = {
|
||||
provider: string;
|
||||
baseUrl: string;
|
||||
apiKey: string;
|
||||
modelName: string;
|
||||
temperature: number;
|
||||
timeOut: number;
|
||||
};
|
||||
|
||||
export type MultiTurnConfig = {
|
||||
enableMultiTurn: boolean;
|
||||
};
|
||||
export type VisualConfig = {
|
||||
defaultShowType: string;
|
||||
};
|
||||
|
||||
export type AgentType = {
|
||||
id?: number;
|
||||
name?: string;
|
||||
@@ -68,6 +84,9 @@ export type AgentType = {
|
||||
status?: 0 | 1;
|
||||
enableSearch?: 0 | 1;
|
||||
agentConfig?: AgentConfigType;
|
||||
llmConfig?: LlmConfigType;
|
||||
multiTurnConfig?: MultiTurnConfig;
|
||||
visualConfig?: VisualConfig;
|
||||
};
|
||||
|
||||
export type ModelType = {
|
||||
|
||||
@@ -191,6 +191,17 @@ const ModelBasicForm: React.FC<Props> = ({
|
||||
<FormItem name="description" label="模型描述">
|
||||
<TextArea placeholder="请输入模型描述" />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
name={['ext', 'usId']}
|
||||
label="上游任务ID"
|
||||
>
|
||||
<Select
|
||||
mode="tags"
|
||||
placeholder="输入ID后回车确认，多ID输入、复制粘贴支持英文逗号自动分隔"
|
||||
tokenSeparators={[',']}
|
||||
maxTagCount={9}
|
||||
/>
|
||||
</FormItem>
|
||||
</Spin>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -337,26 +337,10 @@ const ModelCreateForm: React.FC<CreateFormProps> = ({
|
||||
};
|
||||
|
||||
const formatterInitData = (columns: any[], extendParams: Record<string, any> = {}) => {
|
||||
const {
|
||||
id,
|
||||
name,
|
||||
bizName,
|
||||
description,
|
||||
modelDetail,
|
||||
databaseId,
|
||||
filterSql,
|
||||
alias,
|
||||
drillDownDimensions = [],
|
||||
} = modelItem;
|
||||
const { modelDetail, filterSql, drillDownDimensions = [] } = modelItem;
|
||||
const { dimensions, identifiers, measures } = modelDetail || {};
|
||||
const initValue = {
|
||||
id,
|
||||
name,
|
||||
bizName,
|
||||
description,
|
||||
databaseId,
|
||||
filterSql,
|
||||
alias,
|
||||
...modelItem,
|
||||
drillDownDimensions: Array.isArray(drillDownDimensions)
|
||||
? drillDownDimensions.map((item) => {
|
||||
return item.dimensionId;
|
||||
|
||||
@@ -34,7 +34,7 @@ const ClassMetricTable: React.FC<Props> = ({}) => {
|
||||
total: 0,
|
||||
};
|
||||
const [pagination, setPagination] = useState(defaultPagination);
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [loading, setLoading] = useState<boolean>(true);
|
||||
const [dataSource, setDataSource] = useState<ISemantic.ITagItem[]>([]);
|
||||
const [tagItem, setTagItem] = useState<ISemantic.ITagItem>();
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
||||
|
||||
@@ -23,9 +23,7 @@ import { ISemantic } from '../data';
|
||||
import BatchCtrlDropDownButton from '@/components/BatchCtrlDropDownButton';
|
||||
import { ColumnsConfig } from '../components/TableColumnRender';
|
||||
|
||||
type Props = {
|
||||
|
||||
};
|
||||
type Props = {};
|
||||
|
||||
type QueryMetricListParams = {
|
||||
id?: string;
|
||||
@@ -46,7 +44,7 @@ const ClassMetricTable: React.FC<Props> = ({ }) => {
|
||||
total: 0,
|
||||
};
|
||||
const [pagination, setPagination] = useState(defaultPagination);
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [loading, setLoading] = useState<boolean>(true);
|
||||
const [dataSource, setDataSource] = useState<ISemantic.IMetricItem[]>([]);
|
||||
const [metricItem, setMetricItem] = useState<ISemantic.IMetricItem>();
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
||||
@@ -154,8 +152,9 @@ const ClassMetricTable: React.FC<Props> = ({ }) => {
|
||||
};
|
||||
|
||||
const handleMetricEdit = (metricItem: ISemantic.IMetricItem) => {
|
||||
setMetricItem(metricItem);
|
||||
setCreateModalVisible(true);
|
||||
// setMetricItem(metricItem);
|
||||
// setCreateModalVisible(true);
|
||||
history.push(`/model/metric/edit/${metricItem.id}`);
|
||||
};
|
||||
|
||||
const queryBatchUpdatePublish = async (ids: React.Key[], status: boolean) => {
|
||||
@@ -458,4 +457,4 @@ const ClassMetricTable: React.FC<Props> = ({ }) => {
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ClassMetricTable
|
||||
export default ClassMetricTable;
|
||||
|
||||
@@ -38,6 +38,7 @@ import { createMetric, updateMetric, mockMetricAlias, getMetricTags } from '../.
|
||||
import { MetricSettingKey, MetricSettingWording } from '../constants';
|
||||
import { ISemantic } from '../../data';
|
||||
import { history } from '@umijs/max';
|
||||
import globalStyles from '@/global.less';
|
||||
|
||||
export type CreateFormProps = {
|
||||
datasourceId?: number;
|
||||
@@ -868,7 +869,7 @@ const MetricInfoCreateForm: React.FC<CreateFormProps> = ({
|
||||
</div>
|
||||
<div className={styles.infoCardContainer}>
|
||||
<Form
|
||||
className={styles.supersonicForm}
|
||||
className={globalStyles.supersonicForm}
|
||||
{...formLayout}
|
||||
form={form}
|
||||
initialValues={{
|
||||
|
||||
@@ -124,7 +124,6 @@ const OverviewContainer: React.FC<Props> = ({ mode }) => {
|
||||
};
|
||||
|
||||
const handleModelChange = (model?: ISemantic.IModelItem) => {
|
||||
console.log(model, 1111);
|
||||
if (!model) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -167,19 +167,6 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
|
||||
return (
|
||||
<>
|
||||
<div style={{ display: currentStep === 1 ? 'block' : 'none' }}>
|
||||
{/* <div style={{ marginBottom: 10, paddingLeft: 12 }}>
|
||||
<Radio.Group
|
||||
buttonStyle="solid"
|
||||
value={queryType}
|
||||
onChange={(e) => {
|
||||
setQueryType(e.target.value);
|
||||
}}
|
||||
>
|
||||
<Radio.Button value="METRIC">指标模式</Radio.Button>
|
||||
<Radio.Button value="TAG">标签模式</Radio.Button>
|
||||
</Radio.Group>
|
||||
</div> */}
|
||||
|
||||
<ViewModelConfigTransfer
|
||||
key={queryType}
|
||||
queryType={queryType}
|
||||
|
||||
@@ -141,7 +141,7 @@ const ViewSearchFormModal: React.FC<ModelCreateFormModalProps> = ({
|
||||
)}
|
||||
|
||||
{viewItem?.queryType === TransType.TAG && (
|
||||
<ProCard title="标签模式">
|
||||
<ProCard title="明细模式">
|
||||
<DefaultSettingForm form={form} tagList={tagList} chatConfigType={ChatConfigType.TAG} />
|
||||
</ProCard>
|
||||
)}
|
||||
|
||||
@@ -57,14 +57,13 @@ const DomainManagerTab: React.FC<Props> = ({
|
||||
children:
|
||||
showModelType === 'list' ? (
|
||||
<OverView
|
||||
key={selectDomainId}
|
||||
modelList={modelList}
|
||||
onModelChange={(model) => {
|
||||
handleModelChange(model);
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<div style={{ width: '100%' }}>
|
||||
<div style={{ width: '100%' }} key={selectDomainId}>
|
||||
<SemanticGraphCanvas />
|
||||
{/* <HeadlessFlows /> */}
|
||||
</div>
|
||||
@@ -208,6 +207,7 @@ const DomainManagerTab: React.FC<Props> = ({
|
||||
className={styles.tab}
|
||||
items={!isModel ? tabItem : isModelItem}
|
||||
activeKey={getActiveKey()}
|
||||
// destroyInactiveTabPane
|
||||
tabBarExtraContent={{
|
||||
right:
|
||||
getActiveKey() === 'overview' ? (
|
||||
|
||||
@@ -2,7 +2,7 @@ import { Space, Tag, Typography } from 'antd';
|
||||
import { StatusEnum } from '../enum';
|
||||
import { SENSITIVE_LEVEL_ENUM, SENSITIVE_LEVEL_COLOR } from '../constant';
|
||||
import { TagsOutlined, ReadOutlined } from '@ant-design/icons';
|
||||
import { history } from 'umi';
|
||||
import { history } from '@umijs/max';
|
||||
import { ISemantic } from '../data';
|
||||
import { isString } from 'lodash';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
@@ -445,43 +445,5 @@
|
||||
}
|
||||
}
|
||||
|
||||
.supersonicForm {
|
||||
padding: 0 20px;
|
||||
:global {
|
||||
.ant-input-search .ant-input-search-button {
|
||||
height: 42px;
|
||||
}
|
||||
.ant-form-item .ant-form-item-label > label {
|
||||
color:#262626;
|
||||
}
|
||||
.ant-form-item-label {
|
||||
font-family: "tencentFont", sans-serif;
|
||||
}
|
||||
.ant-input {
|
||||
padding: 9px 14px 9px 12px;
|
||||
}
|
||||
.ant-select {
|
||||
&.ant-select-single {
|
||||
height: auto;
|
||||
}
|
||||
&.ant-select-multiple {
|
||||
.ant-select-selector {
|
||||
padding: 6px 14px 6px 12px;
|
||||
}
|
||||
}
|
||||
.ant-select-selector {
|
||||
padding: 5px 14px 5px 12px;
|
||||
.ant-select-selection-placeholder {
|
||||
padding: 0px 8px 0px 8px;
|
||||
}
|
||||
.ant-select-selection-overflow-item {
|
||||
.ant-select-selection-item {
|
||||
color: rgb(22, 119, 255);
|
||||
background-color: rgb(230, 244, 255);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
39
webapp/packages/supersonic-fe/src/pages/index.tsx
Normal file
39
webapp/packages/supersonic-fe/src/pages/index.tsx
Normal file
@@ -0,0 +1,39 @@
|
||||
import { useEffect, useTransition } from 'react';
|
||||
import { useLocation } from '@umijs/max';
|
||||
import NProgress from 'nprogress';
|
||||
import 'nprogress/nprogress.css';
|
||||
|
||||
NProgress.configure({ showSpinner: false });
|
||||
|
||||
const startProgress = () => {
|
||||
NProgress.start();
|
||||
};
|
||||
|
||||
const stopProgress = () => {
|
||||
NProgress.done();
|
||||
};
|
||||
|
||||
const Page = ({ dom }) => {
|
||||
const [isPending, startTransition] = useTransition();
|
||||
const location = useLocation();
|
||||
|
||||
useEffect(() => {
|
||||
startTransition(() => {
|
||||
startProgress();
|
||||
});
|
||||
|
||||
return () => {
|
||||
stopProgress();
|
||||
};
|
||||
}, [location]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isPending) {
|
||||
stopProgress();
|
||||
}
|
||||
}, [isPending]);
|
||||
|
||||
return <>{dom}</>;
|
||||
};
|
||||
|
||||
export default Page;
|
||||
3756
webapp/pnpm-lock.yaml
generated
3756
webapp/pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user