[improvement][semantic-fe] Redesigning the indicator homepage to incorporate trend charts and table functionality for indicators (#347)

* [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
2026-04-21 22:34:28 +08:00 · 2023-11-09 05:37:36 -06:00
parent 4e139c837a
commit 18aa14118c
27 changed files with 1654 additions and 916 deletions
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/Metric/components/Table.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/Metric/components/Table.tsx
@@ -0,0 +1,74 @@
+import { Table } from 'antd';
+import type { ColumnsType } from 'antd/es/table';
+import React, { useEffect, useState } from 'react';
+import moment from 'moment';
+import styles from '../style.less';
+import { ColumnConfig } from '../data';
+
+type Props = {
+  columnConfig?: ColumnConfig[];
+  dataSource: any;
+  metricFieldName: string;
+  dateFieldName?: string;
+  loading?: boolean;
+};
+
+const MetricTable: React.FC<Props> = ({
+  columnConfig,
+  dataSource,
+  dateFieldName = 'sys_imp_date',
+  metricFieldName,
+  loading = false,
+}) => {
+  const [columns, setColumns] = useState<ColumnsType<any>>([]);
+  useEffect(() => {
+    if (Array.isArray(columnConfig)) {
+      const config: ColumnsType<any> = columnConfig.map((item: ColumnConfig) => {
+        const { name, nameEn } = item;
+        if (nameEn === dateFieldName) {
+          return {
+            title: '日期',
+            dataIndex: nameEn,
+            key: nameEn,
+            width: 120,
+            fixed: 'left',
+            defaultSortOrder: 'descend',
+            sorter: (a, b) => moment(a[nameEn]).valueOf() - moment(b[nameEn]).valueOf(),
+          };
+        }
+        if (nameEn === metricFieldName) {
+          return {
+            title: name,
+            dataIndex: nameEn,
+            key: nameEn,
+            sortDirections: ['descend'],
+            sorter: (a, b) => a[nameEn] - b[nameEn],
+          };
+        }
+        return {
+          title: name,
+          key: nameEn,
+          dataIndex: nameEn,
+        };
+      });
+      setColumns(config);
+    }
+  }, [columnConfig]);
+
+  return (
+    <div style={{ height: '100%' }}>
+      {Array.isArray(columns) && columns.length > 0 && (
+        <Table
+          columns={columns}
+          dataSource={dataSource}
+          scroll={{ x: 200, y: 700 }}
+          // pagination={{ defaultPageSize: 20 }}
+          loading={loading}
+          onChange={() => {}}
+        />
+      )}
+    </div>
+  );
+};
+
+export default MetricTable;