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][semantic-fe] Adding the ability to filter dimensions based on whether they are tags or not. (#417)

Browse Source 
* [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.
This commit is contained in:
tristanliu
2023-11-23 16:29:10 +08:00
committed by GitHub
parent c168925f03
commit 30bb9a1dc0
28 changed files with 309 additions and 604 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
webapp/packages/supersonic-fe/src/components/FormHelper/FormItemTitle.tsx
View File

@@ -1,15 +1,43 @@
import { Space } from 'antd';
import { Space, Typography } from 'antd';
import { ReactNode } from 'react';
import styles from './index.less';
export interface IProps {
title: string | ReactNode;
subTitle?: string;
subTitleEditable?: boolean;
onSubTitleChange?: (title: string) => void;
}
const FormItemTitle: React.FC<IProps> = ({ title, subTitle }) => {
const { Paragraph } = Typography;
const FormItemTitle: React.FC<IProps> = ({
title,
subTitle,
subTitleEditable = false,
onSubTitleChange,
}) => {
return (
<Space direction="vertical" size={2}>
<span>{title}</span>
{subTitle && <span style={{ fontSize: '12px', color: '#6a6a6a' }}>{subTitle}</span>}
// <div style={{ display: 'block' }}>
// </div>
<Space direction="vertical" size={2} style={{ width: '100%' }}>
<div>{title}</div>
<div className={styles.subTitleContainer}>
{subTitleEditable ? (
<Paragraph
editable={{
// editing: true,
onChange: (title: string) => {
onSubTitleChange?.(title);
},
}}
>
{subTitle || '添加描述'}
</Paragraph>
) : (
subTitle && <span style={{ fontSize: '12px', color: '#6a6a6a' }}>{subTitle}</span>
)}
</div>
</Space>
);
};

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

@@ -1,39 +1,13 @@
.normalState {
position: static;
height: 100%;
.backNormal {
display: none;
}
}
.maxState {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 999;
.innerWrap {
position: absolute;
right: 0;
bottom: 0;
left: 0;
background: #fff;
}
.backNormal {
display: block;
height: 30px;
padding-right: 20px;
color: #02a7f0;
font-size: 22px;
line-height: 30px;
text-align: right;
.fullscreenExitIcon {
cursor: pointer;
.subTitleContainer {
width: 500px;
:global {
.ant-typography{
font-size: 12px;
color: #6a6a6a;
}
.ant-typography-edit-content {
margin-left: 12px;
margin-top: 8px;
}
}
}
}

4
webapp/packages/supersonic-fe/src/global.less
View File

@@ -88,6 +88,10 @@ ol {
padding: 24px !important;
}
.ant-modal-body {
padding: 24px;
}
.ant-pro-page-container-children-content {
margin: 12px 12px 0 !important;
}

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

@@ -54,7 +54,7 @@ const ForgetPwdForm: React.FC<RegisterFormProps> = (props) => {
return (
<Modal
width={600}
bodyStyle={{ padding: '32px 40px 48px' }}
styles={{ padding: '32px 40px 48px' }}
destroyOnClose
title="忘记密码"
open={createModalVisible}

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

@@ -56,7 +56,7 @@ const RegisterForm: React.FC<RegisterFormProps> = (props) => {
return (
<Modal
width={600}
bodyStyle={{ padding: '32px 40px 48px' }}
styles={{ padding: '32px 40px 48px' }}
destroyOnClose
title="用户注册"
open={createModalVisible}

30
webapp/packages/supersonic-fe/src/pages/SemanticModel/ChatSetting/ChatSettingSection.tsx
View File

@@ -1,12 +1,8 @@
// import { Tabs } from 'antd';
import React from 'react';
import { connect } from 'umi';
// import styles from '../components/style.less';
import type { StateType } from '../model';
import ProCard from '@ant-design/pro-card';
import EntitySection from '../components/Entity/EntitySection';
// import RecommendedQuestionsSection from '../components/Entity/RecommendedQuestionsSection';
import { ChatConfigType } from '../enum';
import type { Dispatch } from 'umi';
@@ -16,36 +12,12 @@ type Props = {
};
const ChatSettingSection: React.FC<Props> = () => {
// const isModelItem = [
// {
// label: '指标模式',
// key: 'metric',
// children: <EntitySection chatConfigType={ChatConfigType.AGG} />,
// },
// {
// label: '实体模式',
// key: 'dimenstion',
// children: <EntitySection chatConfigType={ChatConfigType.DETAIL} />,
// },
// {
// label: '推荐问题',
// key: 'recommendedQuestions',
// children: <RecommendedQuestionsSection />,
// },
// ];
return (
<div style={{ width: 900, margin: '20px auto' }}>
{/* <Tabs
className={styles.chatSettingSectionTab}
items={isModelItem}
destroyInactiveTabPane
tabPosition="left"
/> */}
<ProCard bordered title="指标模式" style={{ marginBottom: 20 }}>
<EntitySection chatConfigType={ChatConfigType.AGG} />
</ProCard>
<ProCard bordered title="实体模式" style={{ marginBottom: 20 }}>
<ProCard bordered title="标签模式" style={{ marginBottom: 20 }}>
<EntitySection chatConfigType={ChatConfigType.DETAIL} />
</ProCard>
</div>

2
webapp/packages/supersonic-fe/src/pages/SemanticModel/ChatSetting/ChatSettingTab.tsx
View File

@@ -41,7 +41,7 @@ const ChatSetting: React.FC<Props> = ({
children: <EntitySection chatConfigType={ChatConfigType.AGG} />,
},
{
label: '实体模式',
label: '标签模式',
key: 'dimenstion',
children: <EntitySection chatConfigType={ChatConfigType.DETAIL} />,
},

12
webapp/packages/supersonic-fe/src/pages/SemanticModel/Datasource/components/DataSourceCreateForm.tsx
View File

@@ -1,7 +1,7 @@
import React, { ReactNode, useEffect, useRef, useState } from 'react';
import React, { useEffect, useRef, useState } from 'react';
import { Form, Button, Modal, Steps, message } from 'antd';
import DataSourceBasicForm from './DataSourceBasicForm';
import FieldForm from './DataSourceFieldForm';
import DataSourceFieldForm from './DataSourceFieldForm';
import { formLayout } from '@/components/FormHelper/utils';
import { EnumDataSourceType } from '../constants';
import styles from '../style.less';
@@ -94,6 +94,8 @@ const DataSourceCreateForm: React.FC<CreateFormProps> = ({
name,
isCreateMetric: createMetric,
dateFormat,
entityNames,
isTag,
} = item;
const isCreateDimension = createDimension ? 1 : 0;
const isCreateMetric = createMetric ? 1 : 0;
@@ -104,6 +106,7 @@ const DataSourceCreateForm: React.FC<CreateFormProps> = ({
type,
isCreateDimension,
name,
isTag: isTag ? 1 : 0,
});
break;
case EnumDataSourceType.TIME:
@@ -125,6 +128,7 @@ const DataSourceCreateForm: React.FC<CreateFormProps> = ({
bizName,
name,
type,
entityNames,
});
break;
case EnumDataSourceType.MEASURES:
@@ -325,7 +329,7 @@ const DataSourceCreateForm: React.FC<CreateFormProps> = ({
return (
<>
<div style={{ display: currentStep === 1 ? 'block' : 'none' }}>
<FieldForm
<DataSourceFieldForm
fields={fields}
onFieldChange={handleFieldChange}
onSqlChange={(sql) => {
@@ -410,7 +414,7 @@ const DataSourceCreateForm: React.FC<CreateFormProps> = ({
<Modal
forceRender
width={1300}
styles={{ padding: '32px 40px 48px' }}
// styles={{ padding: '32px 40px 48px' }}
destroyOnClose
title={`${isEdit ? '编辑' : '新建'}数据源`}
maskClosable={false}

50
webapp/packages/supersonic-fe/src/pages/SemanticModel/Datasource/components/DataSourceFieldForm.tsx
View File

@@ -1,5 +1,5 @@
import React from 'react';
import { Table, Select, Checkbox, Input, Alert, Space, Tooltip, Form } from 'antd';
import { Table, Select, Checkbox, Input, Alert, Space, Tooltip, Form, Switch } from 'antd';
import TableTitleTooltips from '../../components/TableTitleTooltips';
import { isUndefined } from 'lodash';
import { ExclamationCircleOutlined } from '@ant-design/icons';
@@ -22,6 +22,8 @@ type FieldItem = {
checked?: number;
dateFormat?: string;
timeGranularity?: string;
entityNames?: string[];
isTag?: number;
};
const FormItem = Form.Item;
@@ -42,7 +44,6 @@ const getCreateFieldName = (type: EnumDataSourceType) => {
? 'isCreateDimension'
: 'isCreateMetric';
return isCreateName;
// const editState = !isUndefined(record[isCreateName]) ? !!record[isCreateName] : true;
};
const FieldForm: React.FC<Props> = ({ fields, sql, onFieldChange, onSqlChange }) => {
@@ -117,9 +118,31 @@ const FieldForm: React.FC<Props> = ({ fields, sql, onFieldChange, onSqlChange })
{
title: '扩展配置',
dataIndex: 'extender',
width: 180,
width: 185,
render: (_: any, record: FieldItem) => {
const { type } = record;
if (type === EnumDataSourceType.PRIMARY) {
const entityNames =
fields.find((field) => field.bizName === record.bizName)?.entityNames || [];
return (
<Space>
<Select
style={{ minWidth: 345 }}
mode="tags"
value={entityNames}
placeholder="输入实体名称后回车确认，支持英文逗号自动分隔"
tokenSeparators={[',']}
onChange={(value) => {
handleFieldChange(record, 'entityNames', value);
}}
maxTagCount={9}
/>
<Tooltip title="主键可以作为一个实体，在此设置一个或多个实体名称">
<ExclamationCircleOutlined />
</Tooltip>
</Space>
);
}
if (type === EnumDataSourceType.MEASURES) {
const agg = fields.find((field) => field.bizName === record.bizName)?.agg;
return (
@@ -140,6 +163,25 @@ const FieldForm: React.FC<Props> = ({ fields, sql, onFieldChange, onSqlChange })
</Select>
);
}
if (type === EnumDataSourceType.CATEGORICAL) {
const isTag = fields.find((field) => field.bizName === record.bizName)?.isTag;
return (
<Space>
<span>设为标签</span>
<Switch
defaultChecked
size="small"
checked={!!isTag}
onChange={(value) => {
handleFieldChange(record, 'isTag', value);
}}
/>
<Tooltip title="如果勾选，代表维度的取值都是一种“标签”，可用作对实体的圈选">
<ExclamationCircleOutlined />
</Tooltip>
</Space>
);
}
if (type === EnumDataSourceType.TIME) {
const dateFormat = fields.find((field) => field.bizName === record.bizName)?.dateFormat;
const timeGranularity = fields.find(
@@ -222,7 +264,6 @@ const FieldForm: React.FC<Props> = ({ fields, sql, onFieldChange, onSqlChange })
[isCreateName]: value,
});
} else {
// handleFieldChange(record, isCreateName, value);
onFieldChange(record.bizName, {
...record,
checked: value,
@@ -237,7 +278,6 @@ const FieldForm: React.FC<Props> = ({ fields, sql, onFieldChange, onSqlChange })
disabled={!editState}
onChange={(e) => {
const value = e.target.value;
// handleFieldChange(record, 'name', value);
onFieldChange(record.bizName, {
...record,
name: value,

71
webapp/packages/supersonic-fe/src/pages/SemanticModel/OverviewContainer.tsx
View File

@@ -5,7 +5,7 @@ import DomainListTree from './components/DomainList';
import styles from './components/style.less';
import type { StateType } from './model';
import { DownOutlined, LeftOutlined } from '@ant-design/icons';
import { LeftOutlined, RightOutlined } from '@ant-design/icons';
import { ISemantic } from './data';
import { getDomainList, getModelList } from './service';
import ChatSettingTab from './ChatSetting/ChatSettingTab';
@@ -24,17 +24,12 @@ const OverviewContainer: React.FC<Props> = ({ mode, domainManger, dispatch }) =>
const modelId = params.modelId;
const menuKey = params.menuKey ? params.menuKey : !Number(modelId) ? 'overview' : '';
const { selectDomainId, selectModelId, selectDomainName, selectModelName, domainList } =
domainManger;
const { selectDomainId, selectModelId, domainList } = domainManger;
const [modelList, setModelList] = useState<ISemantic.IModelItem[]>([]);
const [isModel, setIsModel] = useState<boolean>(false);
const [open, setOpen] = useState(false);
const [collapsedState, setCollapsedState] = useState(true);
const [activeKey, setActiveKey] = useState<string>(menuKey);
const handleOpenChange = (newOpen: boolean) => {
setOpen(newOpen);
};
const initSelectedDomain = (domainList: ISemantic.IDomainItem[]) => {
const targetNode = domainList.filter((item: any) => {
return `${item.id}` === domainId;
@@ -198,39 +193,43 @@ const OverviewContainer: React.FC<Props> = ({ mode, domainManger, dispatch }) =>
});
};
const handleCollapsedBtn = () => {
setCollapsedState(!collapsedState);
};
return (
<div className={styles.projectBody}>
<Helmet title={'语义模型-超音数'} />
<div className={styles.projectManger}>
<div className={styles.sider}>
{/* <div className={styles.domainTitle}>
<Space>
{selectDomainName ? `${selectDomainName}` : '主题域信息'}
{selectModelName && (
<>
<span style={{ position: 'relative' }}> | </span>
<span style={{ fontSize: 16, color: '#296DF3' }}>{selectModelName}</span>
</>
)}
</Space>
</div> */}
<DomainListTree
createDomainBtnVisible={mode === 'domain' ? true : false}
onTreeSelected={(domainData) => {
setOpen(false);
const { id, name } = domainData;
cleanModelInfo(id);
dispatch({
type: 'domainManger/setSelectDomain',
selectDomainId: id,
selectDomainName: name,
domainData,
});
<div className={`${styles.sider} ${!collapsedState ? styles.siderCollapsed : ''}`}>
<div className={styles.treeContainer}>
<DomainListTree
createDomainBtnVisible={mode === 'domain' ? true : false}
onTreeSelected={(domainData) => {
const { id, name } = domainData;
cleanModelInfo(id);
dispatch({
type: 'domainManger/setSelectDomain',
selectDomainId: id,
selectDomainName: name,
domainData,
});
}}
onTreeDataUpdate={() => {
initProjectTree();
}}
/>
</div>
<div
className={styles.siderCollapsedButton}
onClick={() => {
handleCollapsedBtn();
}}
onTreeDataUpdate={() => {
initProjectTree();
}}
/>
>
{collapsedState ? <LeftOutlined /> : <RightOutlined />}
</div>
{/* <RightOutlined /> */}
</div>
<div className={styles.content}>
{selectDomainId ? (

1
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/ClassDataSourceTable.tsx
View File

@@ -55,6 +55,7 @@ const ClassDataSourceTable: React.FC<Props> = ({ dispatch, domainManger }) => {
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 100,
render: (_, record) => {
return (
<Space>

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

@@ -8,6 +8,7 @@ import { excuteSql } from '../service';
import type { StateType } from '../model';
import DataSource from '../Datasource';
import { IDataSource } from '../data';
import styles from './style.less';
const { Meta } = Card;
type Props = {
@@ -95,6 +96,7 @@ const ClassDataSourceTypeModal: React.FC<Props> = ({
return (
<>
<Modal
className={styles.classDataSourceTypeModal}
open={createDataSourceModalOpen}
onCancel={() => {
setCreateDataSourceModalOpen(false);

28
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/ClassDimensionTable.tsx
View File

@@ -1,6 +1,6 @@
import type { ActionType, ProColumns } from '@ant-design/pro-table';
import ProTable from '@ant-design/pro-table';
import { message, Button, Space, Popconfirm, Input, Tag, Dropdown } from 'antd';
import { message, Button, Space, Popconfirm, Input, Tag, Select } from 'antd';
import React, { useRef, useState, useEffect } from 'react';
import type { Dispatch } from 'umi';
import { connect } from 'umi';
@@ -168,6 +168,31 @@ const ClassDimensionTable: React.FC<Props> = ({ domainManger, dispatch }) => {
width: 80,
valueEnum: SENSITIVE_LEVEL_ENUM,
},
{
dataIndex: 'isTag',
title: '是否为标签',
// search: false,
renderFormItem: () => (
<Select
placeholder="请选择标签状态"
allowClear
options={[
{ value: 1, label: '是' },
{ value: 0, label: '否' },
]}
/>
),
render: (isTag) => {
switch (isTag) {
case 0:
return '否';
case 1:
return <span style={{ color: '#1677ff' }}>是</span>;
default:
return <Tag color="default">未知</Tag>;
}
},
},
{
dataIndex: 'status',
title: '状态',
@@ -220,6 +245,7 @@ const ClassDimensionTable: React.FC<Props> = ({ domainManger, dispatch }) => {
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 200,
render: (_, record) => {
return (
<Space className={styles.ctrlBtnContainer}>

1
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/ClassMetricTable.tsx
View File

@@ -190,6 +190,7 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 150,
render: (_, record) => {
return (
<Space className={styles.ctrlBtnContainer}>

1
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Database/DatabaseTable.tsx
View File

@@ -72,6 +72,7 @@ const DatabaseTable: React.FC<Props> = ({}) => {
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 100,
render: (_, record) => {
if (!record.hasEditPermission) {
return <></>;

23
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DimensionInfoModal.tsx
View File

@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { Button, Form, Input, Modal, Select, Row, Col, Space, Tooltip } from 'antd';
import { Button, Form, Input, Modal, Select, Row, Col, Space, Tooltip, Switch } from 'antd';
import { SENSITIVE_LEVEL_OPTIONS } from '../constant';
import { formLayout } from '@/components/FormHelper/utils';
import SqlEditor from '@/components/SqlEditor';
@@ -7,6 +7,7 @@ import InfoTagList from './InfoTagList';
import { ISemantic } from '../data';
import { InfoCircleOutlined } from '@ant-design/icons';
import { createDimension, updateDimension, mockDimensionAlias } from '../service';
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
import { message } from 'antd';
@@ -231,6 +232,26 @@ const DimensionInfoModal: React.FC<CreateFormProps> = ({
<FormItem name="defaultValues" label="默认值">
<InfoTagList />
</FormItem>
<Form.Item
label={
<FormItemTitle
title={`设为标签`}
subTitle={`如果勾选，代表维度的取值都是一种'标签'，可用作对实体的圈选`}
/>
}
name="isTag"
valuePropName="checked"
getValueFromEvent={(value) => {
return value === true ? 1 : 0;
}}
getValueProps={(value) => {
return {
checked: value === 1,
};
}}
>
<Switch />
</Form.Item>
<FormItem
name="description"
label="维度描述"

21
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DomainList.tsx
View File

@@ -10,7 +10,6 @@ import { createDomain, updateDomain, deleteDomain } from '../service';
import { treeParentKeyLists } from '../utils';
import ProjectInfoFormProps from './ProjectInfoForm';
import { constructorClassTreeFromList, addPathInTreeData } from '../utils';
import { PlusCircleOutlined } from '@ant-design/icons';
import styles from './style.less';
import { ISemantic } from '../data';
@@ -180,19 +179,17 @@ const DomainListTree: FC<DomainListProps> = ({
return (
<div className={styles.domainList}>
<div className={styles.searchContainer}>
<Row>
<Col flex="1 1 auto">
{/* <Space> */}
<Row style={{ gap: 20 }}>
<Col flex="1 1 215px">
<Search
allowClear
className={styles.search}
placeholder="请输入主题域名称进行查询"
placeholder="请输入主题域名称"
onSearch={onSearch}
/>
{/* </Space> */}
</Col>
{createDomainBtnVisible && (
<Col flex="0 0 40px" style={{ display: 'flex', alignItems: 'center' }}>
<Col flex="0 0 45px" style={{ display: 'flex', alignItems: 'center' }}>
<Tooltip title="新增顶级域">
<Button
type="primary"
@@ -205,16 +202,6 @@ const DomainListTree: FC<DomainListProps> = ({
}}
/>
</Tooltip>
{/* <Tooltip title="新增顶级域">
<PlusCircleOutlined
onClick={() => {
setProjectInfoParams({ type: 'top', modelType: 'add' });
setProjectInfoModalVisible(true);
onCreateDomainBtnClick?.();
}}
className={styles.addBtn}
/>
</Tooltip> */}
</Col>
)}
</Row>

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

@@ -6,7 +6,7 @@ import ClassDataSourceTable from './ClassDataSourceTable';
import ClassDimensionTable from './ClassDimensionTable';
import ClassMetricTable from './ClassMetricTable';
import PermissionSection from './Permission/PermissionSection';
import EntitySettingSection from './Entity/EntitySettingSection';
// import EntitySettingSection from './Entity/EntitySettingSection';
import ChatSettingSection from '../ChatSetting/ChatSettingSection';
import OverView from './OverView';
import styles from './style.less';
@@ -99,11 +99,11 @@ const DomainManagerTab: React.FC<Props> = ({
key: 'metric',
children: <ClassMetricTable />,
},
{
label: '实体',
key: 'entity',
children: <EntitySettingSection />,
},
// {
// label: '实体',
// key: 'entity',
// children: <EntitySettingSection />,
// },
{
label: '权限管理',
key: 'permissonSetting',

56
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DefaultSettingForm.tsx
View File

@@ -163,7 +163,7 @@ const DefaultSettingForm: ForwardRefRenderFunction<any, Props> = (
</FormItem>
{chatConfigType === ChatConfigType.DETAIL && (
<FormItem name="dataItemIds" label="展示维度/指标">
<FormItem name="dataItemIds" label="圈选结果展示字段">
<Select
mode="multiple"
allowClear
@@ -176,63 +176,11 @@ const DefaultSettingForm: ForwardRefRenderFunction<any, Props> = (
}
return false;
}}
placeholder="请选择展示维度/指标信息"
placeholder="请选择圈选结果展示字段"
options={dataItemListOptions}
/>
</FormItem>
)}
{chatConfigType === ChatConfigType.AGG && (
<>
{/* <FormItem
name="metricIds"
label={
<FormItemTitle
title={'指标'}
subTitle={'问答搜索结果选择中，如果没有指定指标，将会采用默认指标进行展示'}
/>
}
>
<Select
mode="multiple"
allowClear
style={{ width: '100%' }}
filterOption={(inputValue: string, item: any) => {
const { label } = item;
if (label.includes(inputValue)) {
return true;
}
return false;
}}
placeholder="请选择展示指标信息"
options={metricListOptions}
/>
</FormItem>
<FormItem
name="ratioMetricIds"
label={
<FormItemTitle
title={'同环比指标'}
subTitle={'问答搜索含有指定的指标，将会同时计算该指标最后一天的同环比'}
/>
}
>
<Select
mode="multiple"
allowClear
style={{ width: '100%' }}
filterOption={(inputValue: string, item: any) => {
const { label } = item;
if (label.includes(inputValue)) {
return true;
}
return false;
}}
placeholder="请选择同环比指标"
options={metricListOptions}
/>
</FormItem> */}
</>
)}
<FormItem
label={
<FormItemTitle

218
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DimensionMetricVisibleTableTransfer.tsx
View File

@@ -1,19 +1,13 @@
import { Table, Transfer, Checkbox, Button, Space, message, Tooltip } from 'antd';
import { Table, Transfer } from 'antd';
import type { ColumnsType, TableRowSelection } from 'antd/es/table/interface';
import type { TransferItem } from 'antd/es/transfer';
import type { CheckboxChangeEvent } from 'antd/es/checkbox';
import difference from 'lodash/difference';
import React, { useState, useEffect } from 'react';
import React from 'react';
import { connect } from 'umi';
import type { StateType } from '../../model';
import type { IChatConfig } from '../../data';
import DimensionValueSettingModal from './DimensionValueSettingModal';
import TransTypeTag from '../TransTypeTag';
import TableTitleTooltips from '../../components/TableTitleTooltips';
import { RedoOutlined } from '@ant-design/icons';
import { SemanticNodeType, DictTaskState, TransType } from '../../enum';
import { createDictTask, searchDictLatestTaskList } from '@/pages/SemanticModel/service';
import styles from '../style.less';
import { SemanticNodeType, TransType } from '../../enum';
interface RecordType {
id: number;
key: string;
@@ -29,105 +23,14 @@ type Props = {
[key: string]: any;
};
type TaskStateMap = Record<string, DictTaskState>;
// type TaskStateMap = Record<string, DictTaskState>;
const DimensionMetricVisibleTableTransfer: React.FC<Props> = ({
domainManger,
// domainManger,
knowledgeInfosMap,
onKnowledgeInfosMapChange,
// onKnowledgeInfosMapChange,
...restProps
}) => {
// const { selectModelId: modelId } = domainManger;
// const [dimensionValueSettingModalVisible, setDimensionValueSettingModalVisible] =
// useState<boolean>(false);
// const [currentRecord, setCurrentRecord] = useState<RecordType>({} as RecordType);
// const [currentDimensionSettingFormData, setCurrentDimensionSettingFormData] =
// useState<IChatConfig.IKnowledgeConfig>();
// const [recordLoadingMap, setRecordLoadingMap] = useState<Record<string, boolean>>({});
// const [taskStateMap, setTaskStateMap] = useState<TaskStateMap>({});
// useEffect(() => {
// queryDictLatestTaskList();
// }, []);
// const updateKnowledgeInfosMap = (record: RecordType, updateData: Record<string, any>) => {
// const { bizName, id } = record;
// const knowledgeMap = {
// ...knowledgeInfosMap,
// };
// const target = knowledgeMap[bizName];
// if (target) {
// knowledgeMap[bizName] = {
// ...target,
// ...updateData,
// };
// } else {
// knowledgeMap[bizName] = {
// itemId: id,
// bizName,
// ...updateData,
// };
// }
// onKnowledgeInfosMapChange?.(knowledgeMap);
// };
// const queryDictLatestTaskList = async () => {
// const { code, data } = await searchDictLatestTaskList({
// modelId,
// });
// if (code !== 200) {
// message.error('获取字典导入任务失败!');
// return;
// }
// const tastMap = data.reduce(
// (stateMap: TaskStateMap, item: { dimId: number; status: DictTaskState }) => {
// const { dimId, status } = item;
// stateMap[dimId] = status;
// return stateMap;
// },
// {},
// );
// setTaskStateMap(tastMap);
// };
// const createDictTaskQuery = async (recordData: RecordType) => {
// setRecordLoadingMap({
// ...recordLoadingMap,
// [recordData.id]: true,
// });
// const { code } = await createDictTask({
// updateMode: 'REALTIME_ADD',
// modelAndDimPair: {
// [modelId]: [recordData.id],
// },
// });
// setRecordLoadingMap({
// ...recordLoadingMap,
// [recordData.id]: false,
// });
// if (code !== 200) {
// message.error('字典导入任务创建失败!');
// return;
// }
// setTimeout(() => {
// queryDictLatestTaskList();
// }, 2000);
// };
// const deleteDictTask = async (recordData: RecordType) => {
// const { code } = await createDictTask({
// updateMode: 'REALTIME_DELETE',
// modelAndDimPair: {
// [modelId]: [recordData.id],
// },
// });
// if (code !== 200) {
// message.error('删除字典导入任务创建失败!');
// }
// };
let rightColumns: ColumnsType<RecordType> = [
{
dataIndex: 'name',
@@ -141,104 +44,6 @@ const DimensionMetricVisibleTableTransfer: React.FC<Props> = ({
return <TransTypeTag type={type} />;
},
},
// {
// dataIndex: 'y',
// title: (
// <TableTitleTooltips
// title="维度值可见"
// tooltips="勾选可见后，维度值将在搜索时可以被联想出来"
// />
// ),
// width: 120,
// render: (_: any, record: RecordType) => {
// const { type, bizName } = record;
// return type === TransType.DIMENSION ? (
// <Checkbox
// checked={knowledgeInfosMap?.[bizName]?.searchEnable}
// onChange={(e: CheckboxChangeEvent) => {
// updateKnowledgeInfosMap(record, { searchEnable: e.target.checked });
// if (!e.target.checked) {
// deleteDictTask(record);
// }
// }}
// onClick={(event) => {
// event.stopPropagation();
// }}
// />
// ) : (
// <></>
// );
// },
// },
// {
// dataIndex: 'taskState',
// width: 130,
// title: (
// <Space>
// 导入字典状态
// <span
// className={styles.taskStateRefreshIcon}
// onClick={() => {
// queryDictLatestTaskList();
// }}
// >
// <Tooltip title="刷新字典任务状态">
// <RedoOutlined />
// </Tooltip>
// </span>
// </Space>
// ),
// render: (_, record) => {
// const { id, type } = record;
// const target = taskStateMap[id];
// if (type === TransType.DIMENSION && target) {
// return DictTaskState[target] || '未知状态';
// }
// return '--';
// },
// },
// {
// title: '操作',
// dataIndex: 'x',
// render: (_: any, record: RecordType) => {
// const { type, bizName, id } = record;
// return type === TransType.DIMENSION ? (
// <Space>
// <Button
// style={{ padding: 0 }}
// key="importDictBtn"
// type="link"
// disabled={!knowledgeInfosMap?.[bizName]?.searchEnable}
// loading={!!recordLoadingMap[id]}
// onClick={(event) => {
// createDictTaskQuery(record);
// event.stopPropagation();
// }}
// >
// 导入字典
// </Button>
// <Button
// style={{ padding: 0 }}
// key="editable"
// type="link"
// disabled={!knowledgeInfosMap?.[bizName]?.searchEnable}
// onClick={(event) => {
// setCurrentRecord(record);
// setCurrentDimensionSettingFormData(
// knowledgeInfosMap?.[bizName]?.knowledgeAdvancedConfig,
// );
// setDimensionValueSettingModalVisible(true);
// event.stopPropagation();
// }}
// >
// 可见维度值设置
// </Button>
// </Space>
// ) : (
// <></>
// );
// },
// },
];
const leftColumns: ColumnsType<RecordType> = [
@@ -299,17 +104,6 @@ const DimensionMetricVisibleTableTransfer: React.FC<Props> = ({
);
}}
</Transfer>
{/* <DimensionValueSettingModal
visible={dimensionValueSettingModalVisible}
initialValues={currentDimensionSettingFormData}
onSubmit={(formValues) => {
updateKnowledgeInfosMap(currentRecord, { knowledgeAdvancedConfig: formValues });
setDimensionValueSettingModalVisible(false);
}}
onCancel={() => {
setDimensionValueSettingModalVisible(false);
}}
/> */}
</>
);
};

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

@@ -209,7 +209,7 @@ const DimensionValueSettingForm: ForwardRefRenderFunction<any, Props> = (
className={styles.form}
>
<FormItem
style={{ marginTop: 15, marginBottom: -30 }}
style={{ marginTop: 15 }}
label={
<FormItemTitle
title={
@@ -272,11 +272,11 @@ const DimensionValueSettingForm: ForwardRefRenderFunction<any, Props> = (
</FormItem>
{dimensionVisible && (
<>
<Divider
{/* <Divider
style={{
marginBottom: 35,
}}
/>
/> */}
<div style={{ padding: 20, border: '1px solid #eee', borderRadius: 10 }}>
<div
style={{

115
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/EntityCreateForm.tsx
View File

@@ -1,115 +0,0 @@
import { useEffect, useState, forwardRef, useImperativeHandle } from 'react';
import type { ForwardRefRenderFunction } from 'react';
import { message, Form, Input, Select, Button } from 'antd';
import { updateModel } from '../../service';
import type { ISemantic } from '../../data';
import { formLayout } from '@/components/FormHelper/utils';
import styles from '../style.less';
type Props = {
modelData?: ISemantic.IModelItem;
dimensionList: ISemantic.IDimensionList;
modelId: number;
onSubmit: () => void;
};
const FormItem = Form.Item;
const EntityCreateForm: ForwardRefRenderFunction<any, Props> = (
{ modelData, dimensionList, modelId, onSubmit },
ref,
) => {
const [form] = Form.useForm();
const [dimensionListOptions, setDimensionListOptions] = useState<any>([]);
const getFormValidateFields = async () => {
return await form.validateFields();
};
useEffect(() => {
form.resetFields();
if (!modelData?.entity) {
return;
}
const { entity } = modelData;
form.setFieldsValue({
...entity,
name: entity.names.join(','),
});
}, [modelData]);
useImperativeHandle(ref, () => ({
getFormValidateFields,
}));
useEffect(() => {
const dimensionEnum = dimensionList.map((item: ISemantic.IDimensionItem) => {
return {
label: item.name,
value: item.id,
};
});
setDimensionListOptions(dimensionEnum);
}, [dimensionList]);
const saveEntity = async () => {
const values = await form.validateFields();
const { name = '' } = values;
const { code, msg, data } = await updateModel({
...modelData,
entity: {
...values,
names: name.split(','),
},
id: modelId,
modelId,
});
if (code === 200) {
form.setFieldValue('id', data);
onSubmit?.();
message.success('保存成功');
return;
}
message.error(msg);
};
return (
<>
<Form {...formLayout} form={form} layout="vertical" className={styles.form}>
<FormItem hidden={true} name="id" label="ID">
<Input placeholder="id" />
</FormItem>
<FormItem name="name" label="实体别名">
<Input placeholder="请输入实体别名,多个名称以英文逗号分隔" />
</FormItem>
<FormItem name="entityId" label="唯一标识">
<Select
allowClear
style={{ width: '100%' }}
// filterOption={(inputValue: string, item: any) => {
// const { label } = item;
// if (label.includes(inputValue)) {
// return true;
// }
// return false;
// }}
placeholder="请选择主体标识"
options={dimensionListOptions}
/>
</FormItem>
<FormItem>
<Button
type="primary"
onClick={() => {
saveEntity();
}}
>
保 存
</Button>
</FormItem>
</Form>
</>
);
};
export default forwardRef(EntityCreateForm);

67
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/EntitySettingSection.tsx
View File

@@ -1,67 +0,0 @@
import { message, Space } from 'antd';
import React, { useState, useEffect, useRef } from 'react';
import type { Dispatch } from 'umi';
import { connect } from 'umi';
import type { StateType } from '../../model';
import { getModelDetail } from '../../service';
import ProCard from '@ant-design/pro-card';
import EntityCreateForm from './EntityCreateForm';
import type { ISemantic } from '../../data';
type Props = {
dispatch: Dispatch;
domainManger: StateType;
};
const EntitySettingSection: React.FC<Props> = ({ domainManger }) => {
const { dimensionList, selectModelId: modelId } = domainManger;
const [modelData, setModelData] = useState<ISemantic.IModelItem>();
const entityCreateRef = useRef<any>({});
const queryDomainData: any = async () => {
const { code, data } = await getModelDetail({
modelId,
});
if (code === 200) {
setModelData(data);
return;
}
message.error('获取问答设置信息失败');
};
const initPage = async () => {
queryDomainData();
};
useEffect(() => {
initPage();
}, [modelId]);
return (
<div style={{ width: 800, margin: '20px auto' }}>
<Space direction="vertical" style={{ width: '100%' }} size={20}>
{
<ProCard title="实体" bordered>
<EntityCreateForm
ref={entityCreateRef}
modelId={Number(modelId)}
modelData={modelData}
dimensionList={dimensionList}
onSubmit={() => {
queryDomainData();
}}
/>
</ProCard>
}
</Space>
</div>
);
};
export default connect(({ domainManger }: { domainManger: StateType }) => ({
domainManger,
}))(EntitySettingSection);

1
webapp/packages/supersonic-fe/src/pages/SemanticModel/components/ModelTable.tsx
View File

@@ -133,6 +133,7 @@ const ModelTable: React.FC<Props> = ({
title: '操作',
dataIndex: 'x',
valueType: 'option',
width: 150,
render: (_, record) => {
return (
<Space className={styles.ctrlBtnContainer}>

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

@@ -12,9 +12,45 @@
display: flex;
position: relative;
.sider {
flex: 0 0 350px;
flex: 0 0 auto;
width: 285px;
border-right: 5px solid #eee;
position: relative;
transition: all 0.2s,background 0s;
.treeContainer {
width: 100%;
opacity: 1;
transition: all 0.2s,background 0s;
}
&.siderCollapsed {
width: 20px;
& .treeContainer{
opacity: 0;
}
}
.siderCollapsedButton {
position: absolute;
inset-block-start: 17px;
border: 1px solid #eee;
cursor: pointer;
z-index: 101;
width: 24px;
height: 24px;
text-align: center;
border-radius: 40px;
inset-inline-end: -13px;
transition: transform 0.3s;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: rgba(0, 0, 0, 0.25);
background-color: #ffffff;
box-shadow: 0 2px 8px -2px rgba(0,0,0,0.05), 0 1px 4px -1px rgba(25,15,15,0.07), 0 0 1px 0 rgba(0,0,0,0.08);
&:hover {
color: rgba(0, 0, 0, 0.75);
}
}
.domainTitle {
margin-bottom: 0;
font-size: 20px;
@@ -49,8 +85,9 @@
}
.search {
width: calc(100% - 60px);
margin: 10px 0 10px 35px;
// width: calc(100% - 100px);
width: 100%;
margin: 10px 0 10px 10px;
}
.tree {
@@ -190,6 +227,7 @@
width: 100%;
overflow: hidden;
.searchContainer {
width: 280px;
padding:3px 0;
border-bottom: 1px solid #eee;
}
@@ -327,7 +365,8 @@
.breadcrumb{
font-size: 18px;
margin: 20px 0 0 20px;
margin: 17px 0 0 20px;
padding-bottom: 3px;
:global {
.ant-breadcrumb-link {
height: 28px;
@@ -336,4 +375,12 @@
font-size: 18px;
}
}
}
.classDataSourceTypeModal {
:global {
.ant-modal-body{
padding: 0px;
}
}
}

5
webapp/packages/supersonic-fe/src/pages/SemanticModel/constant.ts
View File

@@ -30,6 +30,11 @@ export const SENSITIVE_LEVEL_ENUM = SENSITIVE_LEVEL_OPTIONS.reduce(
{},
);
export const IS_TAG_ENUM = {
1: '是',
0: '否',
};
export const SENSITIVE_LEVEL_COLOR = {
[SENSITIVE_LEVEL.LOW]: 'lime',
[SENSITIVE_LEVEL.MID]: 'warning',

39
webapp/packages/supersonic-fe/src/pages/System/index.tsx
View File

@@ -18,6 +18,7 @@ import { getSystemConfig, saveSystemConfig } from '@/services/user';
import ProCard from '@ant-design/pro-card';
import SelectTMEPerson from '@/components/SelectTMEPerson';
import { SystemConfigParametersItem, SystemConfig } from './types';
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
import { groupBy } from 'lodash';
const FormItem = Form.Item;
@@ -30,6 +31,7 @@ const System: React.FC = () => {
[],
);
const [configSource, setConfigSource] = useState<SystemConfig>();
const [paramDescMap, setParamDescMap] = useState<Record<string, string>>({});
useEffect(() => {
querySystemConfig();
@@ -37,8 +39,8 @@ const System: React.FC = () => {
const [form] = Form.useForm();
const querySystemConfig = async () => {
const { code, data, msg } = await getSystemConfig();
if (code === 200) {
const { parameters, admins } = data;
if (code === 200 && data) {
const { parameters = [], admins = [] } = data;
const groupByConfig = groupBy(parameters, 'module');
const anchor = Object.keys(groupByConfig).map((key: string) => {
return {
@@ -50,12 +52,24 @@ const System: React.FC = () => {
setAnchorItems(anchor);
setSystemConfig(groupByConfig);
setInitData(admins, parameters);
initDescMap(parameters);
setConfigSource(data);
} else {
message.error(msg);
}
};
const initDescMap = (systemConfigParameters: SystemConfigParametersItem[]) => {
const descData = systemConfigParameters.reduce(
(descMap: Record<string, string>, item: SystemConfigParametersItem) => {
descMap[item.name] = item.description;
return descMap;
},
{},
);
setParamDescMap(descData);
};
const setInitData = (admins: string[], systemConfigParameters: SystemConfigParametersItem[]) => {
const fieldsValue = systemConfigParameters.reduce(
(fields, item) => {
@@ -81,6 +95,7 @@ const System: React.FC = () => {
return {
...item,
value: submitData[name],
description: paramDescMap[name],
};
}
return item;
@@ -158,7 +173,7 @@ const System: React.FC = () => {
</FormItem>
);
case 'list': {
const { candidateValues } = item;
const { candidateValues = [] } = item;
const options = candidateValues.map((value) => {
return { label: value, value };
});
@@ -170,7 +185,23 @@ const System: React.FC = () => {
break;
}
return (
<FormItem name={name} label={comment} key={name}>
<FormItem
name={name}
key={name}
label={
<FormItemTitle
title={comment}
subTitle={paramDescMap[name]}
// subTitleEditable={true}
onSubTitleChange={(title) => {
setParamDescMap({
...paramDescMap,
[name]: title,
});
}}
/>
}
>
{defaultItem}
</FormItem>
);

1
webapp/packages/supersonic-fe/src/pages/System/types.ts
View File

@@ -4,6 +4,7 @@ export type SystemConfigParametersItem = {
comment: string;
value: string;
candidateValues: string[];
description: string;
};
export type SystemConfig = {