[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. (#404)

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

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

@@ -1,6 +1,6 @@
-import { Tabs, Button } from 'antd';
+import { Tabs, Breadcrumb, Space } from 'antd';
 import React from 'react';
-import { connect } from 'umi';
+import { connect, history } from 'umi';
 
 import ClassDataSourceTable from './ClassDataSourceTable';
 import ClassDimensionTable from './ClassDimensionTable';
@@ -11,7 +11,7 @@ import ChatSettingSection from '../ChatSetting/ChatSettingSection';
 import OverView from './OverView';
 import styles from './style.less';
 import type { StateType } from '../model';
-import { LeftOutlined } from '@ant-design/icons';
+import { HomeOutlined, FundViewOutlined } from '@ant-design/icons';
 import { ISemantic } from '../data';
 import SemanticGraphCanvas from '../SemanticGraphCanvas';
 import RecommendedQuestionsSection from '../components/Entity/RecommendedQuestionsSection';
@@ -39,7 +39,9 @@ const DomainManagerTab: React.FC<Props> = ({
   onMenuChange,
 }) => {
   const defaultTabKey = 'xflow';
-  const { selectDomainId, domainList, selectModelId } = domainManger;
+  const { selectDomainId, domainList, selectModelId, selectModelName, selectDomainName } =
+    domainManger;
+
   const tabItem = [
     {
       label: '模型管理',
@@ -126,40 +128,49 @@ const DomainManagerTab: React.FC<Props> = ({
 
   return (
     <>
+      <Breadcrumb
+        className={styles.breadcrumb}
+        separator=""
+        items={[
+          {
+            path: `/webapp/model/${selectDomainId}/0/overview`,
+            title: (
+              <Space
+                onClick={() => {
+                  onBackDomainBtnClick?.();
+                }}
+                style={selectModelName ? {} : { color: '#296df3', fontWeight: 'bold' }}
+              >
+                <HomeOutlined />
+                <span>{selectDomainName}</span>
+              </Space>
+            ),
+          },
+          {
+            type: 'separator',
+            separator: selectModelName ? '/' : '',
+          },
+          {
+            title: selectModelName ? (
+              <Space
+                onClick={() => {
+                  history.push(`/model/${selectDomainId}/${selectModelId}/`);
+                }}
+                style={{ color: '#296df3' }}
+              >
+                <FundViewOutlined style={{ position: 'relative', top: '2px' }} />
+                <span>{selectModelName}</span>
+              </Space>
+            ) : undefined,
+          },
+        ]}
+      />
       <Tabs
         className={styles.tab}
         items={!isModel ? tabItem : isModelItem}
         activeKey={activeKey || defaultTabKey}
         destroyInactiveTabPane
         size="large"
-        tabBarExtraContent={{
-          left: (
-            <>
-              {!!selectModelId && (
-                <div
-                  className={styles.backBtn}
-                  onClick={() => {
-                    onBackDomainBtnClick?.();
-                  }}
-                >
-                  <LeftOutlined />
-                </div>
-              )}
-            </>
-          ),
-          // right: isModel ? (
-          //   <Button
-          //     type="primary"
-          //     icon={<LeftOutlined />}
-          //     onClick={() => {
-          //       onBackDomainBtnClick?.();
-          //     }}
-          //     style={{ marginRight: 10, marginBottom: 5 }}
-          //   >
-          //     返回主题域
-          //   </Button>
-          // ) : undefined,
-        }}
         onChange={(menuKey: string) => {
           onMenuChange?.(menuKey);
         }}