mirror of
https://github.com/tencentmusic/supersonic.git
synced 2025-12-12 04:27:39 +00:00
[improvement][headless-fe] Added term management functionality. (#990)
* [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.
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
||||||
import { ProTable } from '@ant-design/pro-components';
|
import { ProTable } from '@ant-design/pro-components';
|
||||||
import { message, Space, Popconfirm, Tag, Spin, Tooltip } from 'antd';
|
import { message, Space, Popconfirm, Tag, Spin, Tooltip } from 'antd';
|
||||||
|
import MetricAddClass from './components/MetricAddClass';
|
||||||
import React, { useRef, useState, useEffect } from 'react';
|
import React, { useRef, useState, useEffect } from 'react';
|
||||||
import type { Dispatch } from 'umi';
|
import type { Dispatch } from 'umi';
|
||||||
import { connect, history, useModel } from 'umi';
|
import { connect, history, useModel } from 'umi';
|
||||||
@@ -66,6 +67,8 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
|
|||||||
|
|
||||||
const actionRef = useRef<ActionType>();
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
|
const [addClassVisible, setAddClassVisible] = useState<boolean>(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
queryMetricList(filterParams);
|
queryMetricList(filterParams);
|
||||||
}, []);
|
}, []);
|
||||||
@@ -382,6 +385,9 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
|
|||||||
case 'batchStop':
|
case 'batchStop':
|
||||||
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.OFFLINE);
|
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.OFFLINE);
|
||||||
break;
|
break;
|
||||||
|
case 'batchAddClass':
|
||||||
|
setAddClassVisible(true);
|
||||||
|
break;
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
@@ -400,6 +406,7 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
|
|||||||
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.DELETED);
|
queryBatchUpdateStatus(selectedRowKeys, StatusEnum.DELETED);
|
||||||
}}
|
}}
|
||||||
disabledList={hasAllPermission ? [] : ['batchStart', 'batchStop', 'batchDelete']}
|
disabledList={hasAllPermission ? [] : ['batchStart', 'batchStop', 'batchDelete']}
|
||||||
|
extenderList={['batchAddClass']}
|
||||||
onMenuClick={onMenuClick}
|
onMenuClick={onMenuClick}
|
||||||
onDownloadDateRangeChange={(searchDateRange, pickerType) => {
|
onDownloadDateRangeChange={(searchDateRange, pickerType) => {
|
||||||
downloadMetricQuery(selectedRowKeys, searchDateRange, pickerType);
|
downloadMetricQuery(selectedRowKeys, searchDateRange, pickerType);
|
||||||
@@ -509,6 +516,25 @@ const ClassMetricTable: React.FC<Props> = ({ domainManger, dispatch }) => {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
{addClassVisible && (
|
||||||
|
<MetricAddClass
|
||||||
|
ids={selectedRowKeys as number[]}
|
||||||
|
createModalVisible={addClassVisible}
|
||||||
|
onCancel={() => {
|
||||||
|
setAddClassVisible(false);
|
||||||
|
}}
|
||||||
|
onSuccess={() => {
|
||||||
|
setAddClassVisible(false);
|
||||||
|
queryMetricList(filterParams);
|
||||||
|
dispatch({
|
||||||
|
type: 'domainManger/queryMetricList',
|
||||||
|
payload: {
|
||||||
|
domainId: selectDomainId,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { Form, Input, Space, Row, Col, Switch } from 'antd';
|
import { Form, Input, Space, Row, Col, Switch, Flex, Tag } from 'antd';
|
||||||
import StandardFormRow from '@/components/StandardFormRow';
|
import StandardFormRow from '@/components/StandardFormRow';
|
||||||
import TagSelect from '@/components/TagSelect';
|
import TagSelect from '@/components/TagSelect';
|
||||||
import React, { ReactNode, useEffect } from 'react';
|
import React, { ReactNode, useEffect } from 'react';
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import { StatusEnum } from '../../enum';
|
|||||||
import type { Dispatch } from 'umi';
|
import type { Dispatch } from 'umi';
|
||||||
import { connect } from 'umi';
|
import { connect } from 'umi';
|
||||||
import type { StateType } from '../../model';
|
import type { StateType } from '../../model';
|
||||||
import { deleteView, updateView, getViewList } from '../../service';
|
import { deleteView, updateView, getViewList, getAllModelByDomainId } from '../../service';
|
||||||
import ViewCreateFormModal from './ViewCreateFormModal';
|
import ViewCreateFormModal from './ViewCreateFormModal';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
import styles from '../../components/style.less';
|
import styles from '../../components/style.less';
|
||||||
@@ -21,13 +21,14 @@ type Props = {
|
|||||||
domainManger: StateType;
|
domainManger: StateType;
|
||||||
};
|
};
|
||||||
|
|
||||||
const ViewTable: React.FC<Props> = ({ disabledEdit = false, modelList, domainManger }) => {
|
const DataSetTable: React.FC<Props> = ({ disabledEdit = false, domainManger }) => {
|
||||||
const { selectDomainId } = domainManger;
|
const { selectDomainId } = domainManger;
|
||||||
const [viewItem, setViewItem] = useState<ISemantic.IViewItem>();
|
const [viewItem, setViewItem] = useState<ISemantic.IViewItem>();
|
||||||
const [saveLoading, setSaveLoading] = useState<boolean>(false);
|
const [saveLoading, setSaveLoading] = useState<boolean>(false);
|
||||||
const [loading, setLoading] = useState<boolean>(false);
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
const [createDataSourceModalOpen, setCreateDataSourceModalOpen] = useState(false);
|
const [createDataSourceModalOpen, setCreateDataSourceModalOpen] = useState(false);
|
||||||
const [searchModalOpen, setSearchModalOpen] = useState(false);
|
const [searchModalOpen, setSearchModalOpen] = useState(false);
|
||||||
|
const [modelList, setModelList] = useState<ISemantic.IModelItem[]>([]);
|
||||||
const actionRef = useRef<ActionType>();
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
const updateViewStatus = async (modelData: ISemantic.IViewItem) => {
|
const updateViewStatus = async (modelData: ISemantic.IViewItem) => {
|
||||||
@@ -47,6 +48,7 @@ const ViewTable: React.FC<Props> = ({ disabledEdit = false, modelList, domainMan
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
queryViewList();
|
queryViewList();
|
||||||
|
queryDomainAllModel();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const queryViewList = async () => {
|
const queryViewList = async () => {
|
||||||
@@ -59,6 +61,16 @@ const ViewTable: React.FC<Props> = ({ disabledEdit = false, modelList, domainMan
|
|||||||
message.error(msg);
|
message.error(msg);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const queryDomainAllModel = async () => {
|
||||||
|
const { code, data, msg } = await getAllModelByDomainId(selectDomainId);
|
||||||
|
if (code === 200) {
|
||||||
|
setModelList(data);
|
||||||
|
} else {
|
||||||
|
message.error(msg);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const columnsConfig = ColumnsConfig();
|
const columnsConfig = ColumnsConfig();
|
||||||
|
|
||||||
const columns: ProColumns[] = [
|
const columns: ProColumns[] = [
|
||||||
@@ -230,7 +242,6 @@ const ViewTable: React.FC<Props> = ({ disabledEdit = false, modelList, domainMan
|
|||||||
<ViewSearchFormModal
|
<ViewSearchFormModal
|
||||||
domainId={selectDomainId}
|
domainId={selectDomainId}
|
||||||
viewItem={viewItem}
|
viewItem={viewItem}
|
||||||
modelList={modelList}
|
|
||||||
onSubmit={() => {
|
onSubmit={() => {
|
||||||
queryViewList();
|
queryViewList();
|
||||||
setSearchModalOpen(false);
|
setSearchModalOpen(false);
|
||||||
@@ -245,4 +256,4 @@ const ViewTable: React.FC<Props> = ({ disabledEdit = false, modelList, domainMan
|
|||||||
};
|
};
|
||||||
export default connect(({ domainManger }: { domainManger: StateType }) => ({
|
export default connect(({ domainManger }: { domainManger: StateType }) => ({
|
||||||
domainManger,
|
domainManger,
|
||||||
}))(ViewTable);
|
}))(DataSetTable);
|
||||||
@@ -5,7 +5,6 @@ import { message } from 'antd';
|
|||||||
import { formLayout } from '@/components/FormHelper/utils';
|
import { formLayout } from '@/components/FormHelper/utils';
|
||||||
import { createView, updateView, getDimensionList, queryMetric, getTagList } from '../../service';
|
import { createView, updateView, getDimensionList, queryMetric, getTagList } from '../../service';
|
||||||
import { ISemantic } from '../../data';
|
import { ISemantic } from '../../data';
|
||||||
import { isString } from 'lodash';
|
|
||||||
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
|
import FormItemTitle from '@/components/FormHelper/FormItemTitle';
|
||||||
import SelectTMEPerson from '@/components/SelectTMEPerson';
|
import SelectTMEPerson from '@/components/SelectTMEPerson';
|
||||||
import ViewModelConfigTransfer from './ViewModelConfigTransfer';
|
import ViewModelConfigTransfer from './ViewModelConfigTransfer';
|
||||||
@@ -81,21 +80,6 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// const queryTagList = async (modelId: number) => {
|
|
||||||
// const { code, data, msg } = await getTagList({
|
|
||||||
// modelIds: [modelId],
|
|
||||||
// pageSize: 9999,
|
|
||||||
// });
|
|
||||||
|
|
||||||
// const { list } = data || {};
|
|
||||||
// if (code === 200) {
|
|
||||||
// setTagList(list);
|
|
||||||
// } else {
|
|
||||||
// message.error(msg);
|
|
||||||
// setTagList([]);
|
|
||||||
// }
|
|
||||||
// };
|
|
||||||
|
|
||||||
const handleConfirm = async () => {
|
const handleConfirm = async () => {
|
||||||
const fieldsValue = await form.validateFields();
|
const fieldsValue = await form.validateFields();
|
||||||
const viewModelConfigsMap = configTableRef?.current.getViewModelConfigs() || {};
|
const viewModelConfigsMap = configTableRef?.current.getViewModelConfigs() || {};
|
||||||
@@ -204,7 +188,8 @@ const ViewCreateFormModal: React.FC<ModelCreateFormModalProps> = ({
|
|||||||
<span>切换模型: </span>
|
<span>切换模型: </span>
|
||||||
<Select
|
<Select
|
||||||
style={{
|
style={{
|
||||||
minWidth: 100,
|
minWidth: 150,
|
||||||
|
textAlign: 'left',
|
||||||
}}
|
}}
|
||||||
value={selectedModelItem?.id}
|
value={selectedModelItem?.id}
|
||||||
placeholder="请选择模型,获取当前模型下指标维度信息"
|
placeholder="请选择模型,获取当前模型下指标维度信息"
|
||||||
|
|||||||
@@ -7,13 +7,12 @@ import { createView, updateView, getDimensionList, queryMetric } from '../../ser
|
|||||||
import { ISemantic } from '../../data';
|
import { ISemantic } from '../../data';
|
||||||
import DefaultSettingForm from './DefaultSettingForm';
|
import DefaultSettingForm from './DefaultSettingForm';
|
||||||
import { isArrayOfValues } from '@/utils/utils';
|
import { isArrayOfValues } from '@/utils/utils';
|
||||||
import { ProCard } from '@ant-design/pro-components';
|
import { ProCard } from '@ant-design/pro-components';
|
||||||
import { ChatConfigType } from '../../enum';
|
import { ChatConfigType } from '../../enum';
|
||||||
|
|
||||||
export type ModelCreateFormModalProps = {
|
export type ModelCreateFormModalProps = {
|
||||||
domainId: number;
|
domainId: number;
|
||||||
viewItem: any;
|
viewItem: any;
|
||||||
modelList: ISemantic.IModelItem[];
|
|
||||||
onCancel: () => void;
|
onCancel: () => void;
|
||||||
onSubmit: (values: any) => void;
|
onSubmit: (values: any) => void;
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { ISemantic } from '../data';
|
|||||||
import { connect } from 'umi';
|
import { connect } from 'umi';
|
||||||
import type { Dispatch } from 'umi';
|
import type { Dispatch } from 'umi';
|
||||||
import type { StateType } from '../model';
|
import type { StateType } from '../model';
|
||||||
import ViewTable from './components/ViewTable';
|
import DataSetTable from './components/DataSetTable';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
disabledEdit?: boolean;
|
disabledEdit?: boolean;
|
||||||
@@ -16,7 +16,11 @@ type Props = {
|
|||||||
const View: React.FC<Props> = ({ modelList, disabledEdit = false, onModelChange }) => {
|
const View: React.FC<Props> = ({ modelList, disabledEdit = false, onModelChange }) => {
|
||||||
return (
|
return (
|
||||||
<div style={{ padding: '15px 20px' }}>
|
<div style={{ padding: '15px 20px' }}>
|
||||||
<ViewTable modelList={modelList} disabledEdit={disabledEdit} onModelChange={onModelChange} />
|
<DataSetTable
|
||||||
|
modelList={modelList}
|
||||||
|
disabledEdit={disabledEdit}
|
||||||
|
onModelChange={onModelChange}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import ClassMetricTable from './ClassMetricTable';
|
|||||||
import PermissionSection from './Permission/PermissionSection';
|
import PermissionSection from './Permission/PermissionSection';
|
||||||
// import ClassTagTable from '../Insights/components/ClassTagTable';
|
// import ClassTagTable from '../Insights/components/ClassTagTable';
|
||||||
import TagObjectTable from '../Insights/components/TagObjectTable';
|
import TagObjectTable from '../Insights/components/TagObjectTable';
|
||||||
|
import TermTable from '../components/Term/TermTable';
|
||||||
import OverView from './OverView';
|
import OverView from './OverView';
|
||||||
import styles from './style.less';
|
import styles from './style.less';
|
||||||
import type { StateType } from '../model';
|
import type { StateType } from '../model';
|
||||||
@@ -76,7 +76,7 @@ const DomainManagerTab: React.FC<Props> = ({
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '数据集管理',
|
label: '数据集管理',
|
||||||
key: 'dataSetManange',
|
key: 'dataSetManage',
|
||||||
hidden: !!domainData?.parentId,
|
hidden: !!domainData?.parentId,
|
||||||
children: (
|
children: (
|
||||||
<View
|
<View
|
||||||
@@ -89,10 +89,16 @@ const DomainManagerTab: React.FC<Props> = ({
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '标签对象管理',
|
label: '标签对象管理',
|
||||||
key: 'tagObjectManange',
|
key: 'tagObjectManage',
|
||||||
hidden: !!domainData?.parentId,
|
hidden: !!domainData?.parentId,
|
||||||
children: <TagObjectTable />,
|
children: <TagObjectTable />,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: '术语管理',
|
||||||
|
key: 'termManage',
|
||||||
|
hidden: !!domainData?.parentId,
|
||||||
|
children: <TermTable />,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
label: '画布',
|
label: '画布',
|
||||||
key: 'xflow',
|
key: 'xflow',
|
||||||
|
|||||||
@@ -0,0 +1,132 @@
|
|||||||
|
import React, { useEffect, useRef } from 'react';
|
||||||
|
import { Form, Button, Modal, Input, Select } from 'antd';
|
||||||
|
|
||||||
|
import { formLayout } from '@/components/FormHelper/utils';
|
||||||
|
import styles from '../style.less';
|
||||||
|
|
||||||
|
import { ISemantic } from '../../data';
|
||||||
|
|
||||||
|
export type CreateFormProps = {
|
||||||
|
createModalVisible: boolean;
|
||||||
|
termItem?: ISemantic.ITermItem;
|
||||||
|
onCancel?: () => void;
|
||||||
|
onSubmit?: (values: any) => void;
|
||||||
|
};
|
||||||
|
|
||||||
|
const FormItem = Form.Item;
|
||||||
|
const { TextArea } = Input;
|
||||||
|
|
||||||
|
const TermCreateForm: React.FC<CreateFormProps> = ({
|
||||||
|
onCancel,
|
||||||
|
createModalVisible,
|
||||||
|
termItem,
|
||||||
|
onSubmit,
|
||||||
|
}) => {
|
||||||
|
const isEdit = !!termItem?.name;
|
||||||
|
const formValRef = useRef({} as any);
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const updateFormVal = (val: any) => {
|
||||||
|
const formVal = {
|
||||||
|
...formValRef.current,
|
||||||
|
...val,
|
||||||
|
};
|
||||||
|
formValRef.current = formVal;
|
||||||
|
};
|
||||||
|
|
||||||
|
const initData = () => {
|
||||||
|
if (!termItem) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const initValue = {
|
||||||
|
...termItem,
|
||||||
|
};
|
||||||
|
const editInitFormVal = {
|
||||||
|
...formValRef.current,
|
||||||
|
...initValue,
|
||||||
|
};
|
||||||
|
|
||||||
|
updateFormVal(editInitFormVal);
|
||||||
|
form.setFieldsValue(initValue);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (isEdit) {
|
||||||
|
initData();
|
||||||
|
}
|
||||||
|
}, [termItem]);
|
||||||
|
|
||||||
|
const renderContent = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<FormItem name="name" label="名称" rules={[{ required: true, message: '请输入名称' }]}>
|
||||||
|
<Input placeholder="名称不可重复" />
|
||||||
|
</FormItem>
|
||||||
|
<FormItem
|
||||||
|
name="similarTerms"
|
||||||
|
label={'近义词'}
|
||||||
|
rules={[{ required: true, message: '请输入业务口径' }]}
|
||||||
|
>
|
||||||
|
<Select
|
||||||
|
mode="tags"
|
||||||
|
placeholder="输入近义词后回车确认,多近义词输入、复制粘贴支持英文逗号自动分隔"
|
||||||
|
tokenSeparators={[',']}
|
||||||
|
maxTagCount={9}
|
||||||
|
/>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem name="description" label={'描述'}>
|
||||||
|
<TextArea placeholder="请输入描述" />
|
||||||
|
</FormItem>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
const renderFooter = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Button onClick={onCancel}>取消</Button>
|
||||||
|
<Button
|
||||||
|
type="primary"
|
||||||
|
onClick={async () => {
|
||||||
|
const fieldsValue = await form.validateFields();
|
||||||
|
const submitForm = {
|
||||||
|
...formValRef.current,
|
||||||
|
...fieldsValue,
|
||||||
|
};
|
||||||
|
updateFormVal(submitForm);
|
||||||
|
onSubmit?.(submitForm);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
完成
|
||||||
|
</Button>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
return (
|
||||||
|
<Modal
|
||||||
|
forceRender
|
||||||
|
width={800}
|
||||||
|
style={{ top: 48 }}
|
||||||
|
destroyOnClose
|
||||||
|
title={`${isEdit ? '编辑' : '新建'}术语`}
|
||||||
|
maskClosable={false}
|
||||||
|
open={createModalVisible}
|
||||||
|
footer={renderFooter()}
|
||||||
|
onCancel={onCancel}
|
||||||
|
>
|
||||||
|
<>
|
||||||
|
<Form
|
||||||
|
{...formLayout}
|
||||||
|
form={form}
|
||||||
|
initialValues={{
|
||||||
|
...formValRef.current,
|
||||||
|
}}
|
||||||
|
className={styles.form}
|
||||||
|
>
|
||||||
|
{renderContent()}
|
||||||
|
</Form>
|
||||||
|
</>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default TermCreateForm;
|
||||||
@@ -0,0 +1,198 @@
|
|||||||
|
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
||||||
|
import { ProTable } from '@ant-design/pro-components';
|
||||||
|
import { message, Button, Space, Popconfirm, Typography } from 'antd';
|
||||||
|
import React, { useRef, useState, useEffect } from 'react';
|
||||||
|
import { connect } from 'umi';
|
||||||
|
import type { StateType } from '../../model';
|
||||||
|
import { getTermList, saveOrUpdate } from '../../service';
|
||||||
|
|
||||||
|
import styles from '../style.less';
|
||||||
|
import { ISemantic } from '../../data';
|
||||||
|
import { ColumnsConfig } from '../../components/TableColumnRender';
|
||||||
|
import TermCreateForm from './TermCreateForm';
|
||||||
|
|
||||||
|
const { Paragraph } = Typography;
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
domainManger: StateType;
|
||||||
|
};
|
||||||
|
|
||||||
|
const TermTable: React.FC<Props> = ({ domainManger }) => {
|
||||||
|
const { selectDomainId } = domainManger;
|
||||||
|
const [createModalVisible, setCreateModalVisible] = useState<boolean>(false);
|
||||||
|
const [termItem, setTermItem] = useState<ISemantic.ITermItem>();
|
||||||
|
|
||||||
|
const [tableData, setTableData] = useState<ISemantic.ITermItem[]>([]);
|
||||||
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
|
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
queryTagList();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const queryTagList = async () => {
|
||||||
|
setLoading(true);
|
||||||
|
const { code, data, msg } = await getTermList(selectDomainId);
|
||||||
|
setLoading(false);
|
||||||
|
if (code === 200) {
|
||||||
|
setTableData(data?.terms || []);
|
||||||
|
} else {
|
||||||
|
message.error(msg);
|
||||||
|
setTableData([]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const queryTermConfig = async (terms: ISemantic.ITermItem[]) => {
|
||||||
|
const { code, msg } = await saveOrUpdate({
|
||||||
|
domainId: selectDomainId,
|
||||||
|
terms,
|
||||||
|
});
|
||||||
|
setLoading(false);
|
||||||
|
if (code === 200) {
|
||||||
|
setTableData(terms);
|
||||||
|
} else {
|
||||||
|
message.error(msg);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const saveTermConfig = (termItem: ISemantic.ITermItem) => {
|
||||||
|
const hasTerm = tableData.find((item) => item.name === termItem.name);
|
||||||
|
let terms = [];
|
||||||
|
if (hasTerm) {
|
||||||
|
terms = tableData.map((item) => {
|
||||||
|
if (item.name === termItem.name) {
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
...termItem,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
terms = [...tableData, termItem];
|
||||||
|
}
|
||||||
|
queryTermConfig(terms);
|
||||||
|
};
|
||||||
|
|
||||||
|
const deleteTermConfig = (termItem: ISemantic.ITermItem) => {
|
||||||
|
const terms = tableData.filter((item) => item.name !== termItem.name);
|
||||||
|
queryTermConfig(terms);
|
||||||
|
};
|
||||||
|
|
||||||
|
const columnsConfig = ColumnsConfig();
|
||||||
|
|
||||||
|
const columns: ProColumns[] = [
|
||||||
|
{
|
||||||
|
dataIndex: 'name',
|
||||||
|
title: '名称',
|
||||||
|
search: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'similarTerms',
|
||||||
|
title: '近义词',
|
||||||
|
search: false,
|
||||||
|
render: (_: string[]) => {
|
||||||
|
const similarTerms = Array.isArray(_) ? _.join(',') : '-';
|
||||||
|
return (
|
||||||
|
<Paragraph
|
||||||
|
ellipsis={{ tooltip: similarTerms, rows: 3 }}
|
||||||
|
style={{ width: 350, marginBottom: 0 }}
|
||||||
|
>
|
||||||
|
{similarTerms}
|
||||||
|
</Paragraph>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
dataIndex: 'description',
|
||||||
|
title: '描述',
|
||||||
|
search: false,
|
||||||
|
render: columnsConfig.description.render,
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'x',
|
||||||
|
valueType: 'option',
|
||||||
|
width: 150,
|
||||||
|
render: (_, record) => {
|
||||||
|
return (
|
||||||
|
<Space className={styles.ctrlBtnContainer}>
|
||||||
|
<Button
|
||||||
|
type="link"
|
||||||
|
key="metricEditBtn"
|
||||||
|
onClick={() => {
|
||||||
|
setTermItem(record);
|
||||||
|
setCreateModalVisible(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
编辑
|
||||||
|
</Button>
|
||||||
|
<Popconfirm
|
||||||
|
title="确认删除?"
|
||||||
|
okText="是"
|
||||||
|
cancelText="否"
|
||||||
|
onConfirm={() => {
|
||||||
|
deleteTermConfig(record);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Button type="link" key="metricDeleteBtn">
|
||||||
|
删除
|
||||||
|
</Button>
|
||||||
|
</Popconfirm>
|
||||||
|
</Space>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<ProTable
|
||||||
|
className={`${styles.classTable} ${styles.disabledSearchTable} `}
|
||||||
|
actionRef={actionRef}
|
||||||
|
rowKey="id"
|
||||||
|
loading={loading}
|
||||||
|
search={false}
|
||||||
|
columns={columns}
|
||||||
|
dataSource={tableData}
|
||||||
|
tableAlertRender={() => {
|
||||||
|
return false;
|
||||||
|
}}
|
||||||
|
sticky={{ offsetHeader: 0 }}
|
||||||
|
size="large"
|
||||||
|
options={false}
|
||||||
|
toolBarRender={() => [
|
||||||
|
<Button
|
||||||
|
key="create"
|
||||||
|
type="primary"
|
||||||
|
onClick={() => {
|
||||||
|
setTermItem(undefined);
|
||||||
|
setCreateModalVisible(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
创建术语
|
||||||
|
</Button>,
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
{createModalVisible && (
|
||||||
|
<TermCreateForm
|
||||||
|
createModalVisible={createModalVisible}
|
||||||
|
termItem={termItem}
|
||||||
|
onSubmit={(termData) => {
|
||||||
|
saveTermConfig(termData);
|
||||||
|
setCreateModalVisible(false);
|
||||||
|
}}
|
||||||
|
onCancel={() => {
|
||||||
|
setCreateModalVisible(false);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default connect(({ domainManger }: { domainManger: StateType }) => ({
|
||||||
|
domainManger,
|
||||||
|
}))(TermTable);
|
||||||
@@ -434,6 +434,12 @@ export declare namespace ISemantic {
|
|||||||
domainId: number;
|
domainId: number;
|
||||||
ext: null;
|
ext: null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface ITermItem {
|
||||||
|
name: string;
|
||||||
|
description: string;
|
||||||
|
similarTerms: string[];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export declare namespace IChatConfig {
|
export declare namespace IChatConfig {
|
||||||
|
|||||||
@@ -429,6 +429,15 @@ export function getMetricsToCreateNewMetric(data: any): Promise<any> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function getAllModelByDomainId(domainId: number): Promise<any> {
|
||||||
|
return request(`${process.env.API_BASE_URL}model/getAllModelByDomainId`, {
|
||||||
|
method: 'GET',
|
||||||
|
params: {
|
||||||
|
domainId,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
export function createDictTask(data: any): Promise<any> {
|
export function createDictTask(data: any): Promise<any> {
|
||||||
return request(`${process.env.API_BASE_URL}knowledge/task`, {
|
return request(`${process.env.API_BASE_URL}knowledge/task`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
@@ -703,3 +712,32 @@ export function getTagObjectList(data: any): Promise<any> {
|
|||||||
data: { pageSize: 9999, status: 1, ...data },
|
data: { pageSize: 9999, status: 1, ...data },
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function getMetricClassifications(): Promise<any> {
|
||||||
|
return request(`${process.env.API_BASE_URL}metric/getMetricClassifications`, {
|
||||||
|
method: 'GET',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function batchUpdateClassifications(data: any): Promise<any> {
|
||||||
|
return request(`${process.env.API_BASE_URL}metric/batchUpdateClassifications`, {
|
||||||
|
method: 'POST',
|
||||||
|
data: { ...data },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getTermList(domainId: number): Promise<any> {
|
||||||
|
return request(`${process.env.API_BASE_URL}term`, {
|
||||||
|
method: 'GET',
|
||||||
|
params: {
|
||||||
|
domainId,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function saveOrUpdate(data: any): Promise<any> {
|
||||||
|
return request(`${process.env.API_BASE_URL}term/saveOrUpdate`, {
|
||||||
|
method: 'POST',
|
||||||
|
data: { ...data },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user