semantic-fe visual modeling pr (#21)

* [improvement][semantic-fe] Added an editing component to set filtering rules for Q&A. Now, the SQL editor will be accompanied by a list for display and control, to resolve ambiguity when using comma-separated values.
[improvement][semantic-fe] Improved validation logic and prompt copywriting for data source/dimension/metric editing and creation.
[improvement][semantic-fe] Improved user experience for visual modeling. Now, when using the legend to control the display/hide of data sources and their associated metric dimensions, the canvas will be re-layout based on the activated data source in the legend.

* [improvement][semantic-fe] Submitted a new version of the visual modeling tool.
[improvement][semantic-fe] Fixed an issue with the initialization of YoY and MoM metrics in Q&A settings.
[improvement][semantic-fe] Added a version field to the database settings.
[improvement][semantic-fe] 1. Added the ability to set YoY and MoM metrics in Q&A settings.2. Moved dimension value editing from the dimension editing window to the dimension list.

---------

Co-authored-by: tristanliu <tristanliu@tencent.com>

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

@@ -8,6 +8,7 @@ import type { StateType } from '../model';
 import { SENSITIVE_LEVEL_ENUM } from '../constant';
 import { getDatasourceList, getDimensionList, deleteDimension } from '../service';
 import DimensionInfoModal from './DimensionInfoModal';
+import DimensionValueSettingModal from './DimensionValueSettingModal';
 import { ISemantic } from '../data';
 import moment from 'moment';
 import styles from './style.less';
@@ -22,6 +23,11 @@ const ClassDimensionTable: React.FC<Props> = ({ domainManger, dispatch }) => {
   const [createModalVisible, setCreateModalVisible] = useState<boolean>(false);
   const [dimensionItem, setDimensionItem] = useState<ISemantic.IDimensionItem>();
   const [dataSourceList, setDataSourceList] = useState<any[]>([]);
+  const [dimensionValueSettingList, setDimensionValueSettingList] = useState<
+    ISemantic.IDimensionValueSettingItem[]
+  >([]);
+  const [dimensionValueSettingModalVisible, setDimensionValueSettingModalVisible] =
+    useState<boolean>(false);
   const [pagination, setPagination] = useState({
     current: 1,
     pageSize: 20,
@@ -141,6 +147,20 @@ const ClassDimensionTable: React.FC<Props> = ({ domainManger, dispatch }) => {
             >
               编辑
             </a>
+            <a
+              key="classEditBtn"
+              onClick={() => {
+                setDimensionItem(record);
+                setDimensionValueSettingModalVisible(true);
+                if (Array.isArray(record.dimValueMaps)) {
+                  setDimensionValueSettingList(record.dimValueMaps);
+                } else {
+                  setDimensionValueSettingList([]);
+                }
+              }}
+            >
+              维度值设置
+            </a>
             <Popconfirm
               title="确认删除？"
               okText="是"
@@ -175,7 +195,7 @@ const ClassDimensionTable: React.FC<Props> = ({ domainManger, dispatch }) => {
       <ProTable
         className={`${styles.classTable} ${styles.classTableSelectColumnAlignLeft}`}
         actionRef={actionRef}
-        headerTitle="维度列表"
+        // headerTitle="维度列表"
         rowKey="id"
         columns={columns}
         request={queryDimensionList}
@@ -236,6 +256,26 @@ const ClassDimensionTable: React.FC<Props> = ({ domainManger, dispatch }) => {
           }}
         />
       )}
+      {dimensionValueSettingModalVisible && (
+        <DimensionValueSettingModal
+          dimensionValueSettingList={dimensionValueSettingList}
+          open={dimensionValueSettingModalVisible}
+          dimensionItem={dimensionItem}
+          onCancel={() => {
+            setDimensionValueSettingModalVisible(false);
+          }}
+          onSubmit={() => {
+            actionRef?.current?.reload();
+            dispatch({
+              type: 'domainManger/queryDimensionList',
+              payload: {
+                domainId: selectDomainId,
+              },
+            });
+            setDimensionValueSettingModalVisible(false);
+          }}
+        />
+      )}
     </>
   );
 };