[improvement][headless-fe] The view management functionality has been added. This feature allows users to create, edit, and manage different views within the system. (#717)

* [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.
2025-12-20 06:34:55 +00:00 · 2024-02-04 15:12:57 +08:00
parent 0c4c6d83ef
commit 2546d1c0e1
35 changed files with 949 additions and 1253 deletions
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/BindMeasuresTable.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/BindMeasuresTable.tsx
@@ -1,120 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { Button, Modal } from 'antd';
-import type { IDataSource } from '../data';
-import ProTable from '@ant-design/pro-table';
-import type { ActionType, ProColumns } from '@ant-design/pro-table';
-import { connect } from 'umi';
-import type { Dispatch } from 'umi';
-import type { StateType } from '../model';
-
-export type CreateFormProps = {
-  measuresList: any[];
-  selectedMeasuresList: any[];
-  onCancel: () => void;
-  onSubmit: (selectMeasuresList: any[]) => void;
-  createModalVisible: boolean;
-  projectManger: StateType;
-  dispatch: Dispatch;
-};
-
-const BindMeasuresTable: React.FC<CreateFormProps> = ({
-  measuresList = [],
-  selectedMeasuresList = [],
-  onSubmit,
-  onCancel,
-  createModalVisible,
-  projectManger,
-}) => {
-  const { searchParams = {} } = projectManger || {};
-  const actionRef = useRef<ActionType>();
-
-  const [selectedMeasuresKeys, setSelectedMeasuresKeys] = useState<string[]>(() => {
-    return selectedMeasuresList.map((item: any) => {
-      return item.bizName;
-    });
-  });
-  const [selectMeasuresList, setSelectMeasuresList] = useState<IDataSource.IMeasuresItem[]>([]);
-
-  const handleSubmit = async () => {
-    onSubmit?.(selectMeasuresList);
-  };
-
-  const findMeasureItemByName = (bizName: string) => {
-    return measuresList.find((item) => {
-      return item.bizName === bizName;
-    });
-  };
-
-  useEffect(() => {
-    const selectedMeasures: IDataSource.IMeasuresItem[] = selectedMeasuresKeys.map((bizName) => {
-      const item = findMeasureItemByName(bizName);
-      return item;
-    });
-    setSelectMeasuresList([...selectedMeasures]);
-  }, [selectedMeasuresKeys]);
-
-  useEffect(() => {}, []);
-
-  const columns: ProColumns[] = [
-    {
-      dataIndex: 'bizName',
-      title: '度量名称',
-    },
-    {
-      dataIndex: 'alias',
-      title: '别名',
-    },
-    {
-      dataIndex: 'agg',
-      title: '算子类型',
-    },
-  ];
-  const renderFooter = () => {
-    return (
-      <>
-        <Button onClick={onCancel}>取消</Button>
-        <Button type="primary" onClick={handleSubmit}>
-          添加度量
-        </Button>
-      </>
-    );
-  };
-
-  const rowSelection = {
-    selectedRowKeys: selectedMeasuresKeys,
-    onChange: (_selectedRowKeys: any[]) => {
-      setSelectedMeasuresKeys([..._selectedRowKeys]);
-    },
-  };
-
-  return (
-    <Modal
-      width={800}
-      destroyOnClose
-      title="度量添加"
-      open={createModalVisible}
-      footer={renderFooter()}
-      onCancel={() => {
-        onCancel();
-      }}
-    >
-      <ProTable
-        actionRef={actionRef}
-        rowKey="bizName"
-        rowSelection={rowSelection}
-        columns={columns}
-        params={{ ...searchParams }}
-        pagination={false}
-        dataSource={measuresList || []}
-        size="small"
-        search={false}
-        options={false}
-        scroll={{ y: 800 }}
-      />
-    </Modal>
-  );
-};
-
-export default connect(({ projectManger }: { projectManger: StateType }) => ({
-  projectManger,
-}))(BindMeasuresTable);
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DimensionInfoModal.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/DimensionInfoModal.tsx
@@ -279,7 +279,7 @@ const DimensionInfoModal: React.FC<CreateFormProps> = ({
        <FormItem
          name="expr"
          label="表达式"
-          tooltip="表达式中的字段必须在创建数据源的时候被标记为日期或者维度"
+          tooltip="表达式中的字段必须在创建模型的时候被标记为日期或者维度"
          rules={[{ required: true, message: '请输入表达式' }]}
        >
          <SqlEditor height={'150px'} />
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DefaultSettingForm.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/DefaultSettingForm.tsx
@@ -17,7 +17,7 @@ import TransTypeTag from '../TransTypeTag';
 type Props = {
  entityData: any;
  chatConfigKey: string;
-  chatConfigType: ChatConfigType.DETAIL | ChatConfigType.AGG;
+  chatConfigType: ChatConfigType.TAG | ChatConfigType.METRIC;
  metricList: ISemantic.IMetricItem[];
  dimensionList: ISemantic.IDimensionItem[];
  domainId: number;
@@ -59,7 +59,7 @@ const DefaultSettingForm: ForwardRefRenderFunction<any, Props> = (
      ...chatDefaultConfig,
      id,
    });
-    if (chatConfigType === ChatConfigType.DETAIL) {
+    if (chatConfigType === ChatConfigType.TAG) {
      initDataItemValue(chatDefaultConfig);
    }
  }, [entityData, dataItemListOptions]);
@@ -165,7 +165,7 @@ const DefaultSettingForm: ForwardRefRenderFunction<any, Props> = (
          <Input placeholder="id" />
        </FormItem>

-        {chatConfigType === ChatConfigType.DETAIL && (
+        {chatConfigType === ChatConfigType.TAG && (
          <FormItem name="dataItemIds" label="圈选结果展示字段">
            <Select
              mode="multiple"
@@ -193,7 +193,7 @@ const DefaultSettingForm: ForwardRefRenderFunction<any, Props> = (
          }
        >
          <Input.Group compact>
-            {chatConfigType === ChatConfigType.DETAIL ? (
+            {chatConfigType === ChatConfigType.TAG ? (
              <span
                style={{
                  display: 'inline-block',
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/EntitySection.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Entity/EntitySection.tsx
@@ -11,14 +11,14 @@ import type { IChatConfig } from '../../data';
 import { ChatConfigType } from '../../enum';

 type Props = {
-  chatConfigType: ChatConfigType.DETAIL | ChatConfigType.AGG;
+  chatConfigType: ChatConfigType.TAG | ChatConfigType.METRIC;
  onConfigSave?: () => void;
  dispatch: Dispatch;
  domainManger: StateType;
 };

 const EntitySection: React.FC<Props> = forwardRef(
-  ({ domainManger, chatConfigType = ChatConfigType.DETAIL, onConfigSave }, ref: Ref<any>) => {
+  ({ domainManger, chatConfigType = ChatConfigType.TAG, onConfigSave }, ref: Ref<any>) => {
    const { selectDomainId, selectModelId: modelId, dimensionList, metricList } = domainManger;

    const [entityData, setEntityData] = useState<IChatConfig.IChatRichConfig>();
@@ -34,10 +34,10 @@ const EntitySection: React.FC<Props> = forwardRef(

      if (code === 200) {
        const { chatAggRichConfig, chatDetailRichConfig, id, domainId, modelId } = data;
-        if (chatConfigType === ChatConfigType.DETAIL) {
+        if (chatConfigType === ChatConfigType.TAG) {
          setEntityData({ ...chatDetailRichConfig, id, domainId, modelId });
        }
-        if (chatConfigType === ChatConfigType.AGG) {
+        if (chatConfigType === ChatConfigType.METRIC) {
          setEntityData({ ...chatAggRichConfig, id, domainId, modelId });
        }
        return;
@@ -66,7 +66,7 @@ const EntitySection: React.FC<Props> = forwardRef(
              entityData={entityData || {}}
              chatConfigType={chatConfigType}
              chatConfigKey={
-                chatConfigType === ChatConfigType.DETAIL ? 'chatDetailConfig' : 'chatAggConfig'
+                chatConfigType === ChatConfigType.TAG ? 'chatDetailConfig' : 'chatAggConfig'
              }
              dimensionList={dimensionList.filter((item) => {
                const blackDimensionList = entityData?.visibility?.blackDimIdList;
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricFieldFormTable.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricFieldFormTable.tsx
@@ -14,7 +14,7 @@ type Props = {
  onSqlChange: (sql: string) => void;
 };

-const MetricMeasuresFormTable: React.FC<Props> = ({
+const MetricFieldFormTable: React.FC<Props> = ({
  typeParams,
  fieldList,
  onFieldChange,
@@ -80,7 +80,6 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
          rowKey="fieldName"
          columns={columns}
          dataSource={tableData}
-          pagination={false}
          search={false}
          toolbar={{
            search: {
@@ -97,6 +96,7 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
              },
            },
          }}
+          pagination={{ defaultPageSize: 10 }}
          size="small"
          options={false}
          tableAlertRender={false}
@@ -134,4 +134,4 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
  );
 };

-export default MetricMeasuresFormTable;
+export default MetricFieldFormTable;
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricInfoCreateForm.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricInfoCreateForm.tsx
@@ -122,14 +122,70 @@ const MetricInfoCreateForm: React.FC<CreateFormProps> = ({
  const backward = () => setCurrentStep(currentStep - 1);

  const queryModelDetail = async () => {
-    // const { code, data } = await getMeasureListByModelId(modelId);
    const { code, data } = await getModelDetail({ modelId: modelId || metricItem?.modelId });
    if (code === 200) {
      if (Array.isArray(data?.modelDetail?.fields)) {
-        setFieldList(data.modelDetail.fields);
+        if (Array.isArray(metricItem?.metricDefineByFieldParams?.fields)) {
+          const fieldList = data.modelDetail.fields.map((item: ISemantic.IFieldTypeParamsItem) => {
+            const { fieldName } = item;
+            if (
+              metricItem?.metricDefineByFieldParams?.fields.find(
+                (measureParamsItem: ISemantic.IFieldTypeParamsItem) =>
+                  measureParamsItem.fieldName === fieldName,
+              )
+            ) {
+              return {
+                ...item,
+                orderNumber: 9999,
+              };
+            }
+            return {
+              ...item,
+              orderNumber: 0,
+            };
+          });
+
+          const sortList = fieldList.sort(
+            (
+              a: ISemantic.IFieldTypeParamsItem & { orderNumber: number },
+              b: ISemantic.IFieldTypeParamsItem & { orderNumber: number },
+            ) => b.orderNumber - a.orderNumber,
+          );
+          setFieldList(sortList);
+        } else {
+          setFieldList(data.modelDetail.fields);
+        }
      }
      if (Array.isArray(data?.modelDetail?.measures)) {
-        setClassMeasureList(data.modelDetail.measures);
+        if (Array.isArray(metricItem?.metricDefineByMeasureParams?.measures)) {
+          const measureList = data.modelDetail.measures.map((item: ISemantic.IMeasure) => {
+            const { bizName } = item;
+            if (
+              metricItem?.metricDefineByMeasureParams?.measures.find(
+                (measureParamsItem: ISemantic.IMeasure) => measureParamsItem.bizName === bizName,
+              )
+            ) {
+              return {
+                ...item,
+                orderNumber: 9999,
+              };
+            }
+            return {
+              ...item,
+              orderNumber: 0,
+            };
+          });
+          const sortMeasureList = measureList.sort(
+            (
+              a: ISemantic.IMeasure & { orderNumber: number },
+              b: ISemantic.IMeasure & { orderNumber: number },
+            ) => b.orderNumber - a.orderNumber,
+          );
+          setClassMeasureList(sortMeasureList);
+        } else {
+          setClassMeasureList(data.modelDetail.measures);
+        }
+
        if (datasourceId) {
          const hasMeasures = data.some(
            (item: ISemantic.IMeasure) => item.datasourceId === datasourceId,
@@ -338,7 +394,6 @@ const MetricInfoCreateForm: React.FC<CreateFormProps> = ({
  const queryMetricTags = async () => {
    const { code, data } = await getMetricTags();
    if (code === 200) {
-      // form.setFieldValue('alias', Array.from(new Set([...formAlias, ...data])));
      setTagOptions(
        Array.isArray(data)
          ? data.map((tag: string) => {
@@ -355,7 +410,37 @@ const MetricInfoCreateForm: React.FC<CreateFormProps> = ({
      modelId: modelId || metricItem?.modelId,
    });
    if (code === 200) {
-      setCreateNewMetricList(data);
+      if (Array.isArray(metricItem?.metricDefineByMetricParams?.metrics)) {
+        const fieldList = data.map((item: ISemantic.IMetricTypeParamsItem) => {
+          const { bizName } = item;
+          if (
+            metricItem?.metricDefineByMetricParams?.metrics.find(
+              (measureParamsItem: ISemantic.IMetricTypeParamsItem) =>
+                measureParamsItem.bizName === bizName,
+            )
+          ) {
+            return {
+              ...item,
+              orderNumber: 9999,
+            };
+          }
+          return {
+            ...item,
+            orderNumber: 0,
+          };
+        });
+
+        const sortList = fieldList.sort(
+          (
+            a: ISemantic.IMetricTypeParamsItem & { orderNumber: number },
+            b: ISemantic.IMetricTypeParamsItem & { orderNumber: number },
+          ) => b.orderNumber - a.orderNumber,
+        );
+        setCreateNewMetricList(sortList);
+      } else {
+        setCreateNewMetricList(data);
+      }
+      // setCreateNewMetricList(data);
    } else {
      message.error('获取指标标签失败');
    }
@@ -417,15 +502,11 @@ const MetricInfoCreateForm: React.FC<CreateFormProps> = ({
          {defineType === METRIC_DEFINE_TYPE.METRIC && (
            <>
              <p className={styles.desc}>
-                通过
+                基于
                <Tag color="#2499ef14" className={styles.markerTag}>
-                  字段
+                  已有
                </Tag>
-                和
-                <Tag color="#2499ef14" className={styles.markerTag}>
-                  度量
-                </Tag>
-                创建的指标可用来创建新的指标
+                指标来衍生新的指标
              </p>

              <MetricMetricFormTable
@@ -701,7 +782,7 @@ const MetricInfoCreateForm: React.FC<CreateFormProps> = ({
        <>
          <Steps style={{ marginBottom: 28 }} size="small" current={currentStep}>
            <Step title="基本信息" />
-            <Step title="度量信息" />
+            <Step title="表达式" />
          </Steps>
          <Form
            {...formLayout}
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricMeasuresFormTable.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricMeasuresFormTable.tsx
@@ -1,9 +1,9 @@
 import React, { useState, useRef, useEffect } from 'react';
-import { Button, Input, Space, Tag } from 'antd';
+import { Input, Space, Tag } from 'antd';
 import ProTable from '@ant-design/pro-table';
 import ProCard from '@ant-design/pro-card';
 import SqlEditor from '@/components/SqlEditor';
-import BindMeasuresTable from './BindMeasuresTable';
+
 import FormLabelRequire from './FormLabelRequire';
 import styles from './style.less';
 import { ISemantic } from '../data';
@@ -26,7 +26,9 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
  onSqlChange,
 }) => {
  const actionRef = useRef<ActionType>();
-  const [measuresModalVisible, setMeasuresModalVisible] = useState<boolean>(false);
+
+  const [tableData, setTableData] = useState<any[]>([]);
+
  const [measuresParams, setMeasuresParams] = useState(
    typeParams || {
      expr: '',
@@ -34,6 +36,20 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
    },
  );

+  const [selectedKeys, setSelectedKeys] = useState<string[]>(() => {
+    return measuresParams?.measures.map((item: any) => {
+      return item.bizName;
+    });
+  });
+
+  useEffect(() => {
+    const datasource =
+      datasourceId && Array.isArray(measuresList)
+        ? measuresList.filter((item) => item.datasourceId === datasourceId)
+        : measuresList;
+    setTableData(datasource);
+  }, [measuresList]);
+
  useEffect(() => {
    setMeasuresParams({ ...typeParams });
  }, [typeParams]);
@@ -49,8 +65,9 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
    {
      dataIndex: 'constraint',
      title: '限定条件',
+      width: 250,
      tooltip:
-        '该限定条件用于在计算指标时限定口径，作用于度量，所用于过滤的维度必须在创建数据源的时候被标记为日期或者维度，不需要加where关键字。比如：维度A="值1" and 维度B="值2"',
+        '该限定条件用于在计算指标时限定口径，作用于度量，所用于过滤的维度必须在创建模型的时候被标记为日期或者维度，不需要加where关键字。比如：维度A="值1" and 维度B="值2"',
      render: (_: any, record: any) => {
        const { constraint, name } = record;
        const { measures } = measuresParams;
@@ -78,57 +95,59 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
    {
      dataIndex: 'agg',
      title: '聚合函数',
-    },
-
-    {
-      title: '操作',
-      dataIndex: 'x',
-      valueType: 'option',
-      render: (_: any, record: any) => {
-        const { bizName } = record;
-        return (
-          <Space>
-            <a
-              key="deleteBtn"
-              onClick={() => {
-                const { measures } = measuresParams;
-                const list = measures.filter((item: any) => {
-                  return item.bizName !== bizName;
-                });
-                onFieldChange?.(list);
-              }}
-            >
-              删除
-            </a>
-          </Space>
-        );
-      },
+      width: 80,
    },
  ];
+
+  const rowSelection = {
+    selectedRowKeys: selectedKeys,
+    onChange: (_selectedRowKeys: any[], items: ISemantic.IMeasure[]) => {
+      setSelectedKeys([..._selectedRowKeys]);
+
+      const measures = items.map(({ bizName, name, expr, datasourceId, agg }) => {
+        return {
+          bizName,
+          name,
+          expr,
+          agg,
+          datasourceId,
+        };
+      });
+      onFieldChange?.(measures);
+    },
+  };
+
  return (
    <>
      <Space direction="vertical" style={{ width: '100%' }}>
        <ProTable
          actionRef={actionRef}
          headerTitle={<FormLabelRequire title="度量列表" />}
-          rowKey="name"
+          rowKey="bizName"
          columns={columns}
-          dataSource={measuresParams?.measures || []}
-          pagination={false}
+          dataSource={tableData}
          search={false}
+          toolbar={{
+            search: {
+              placeholder: '请输入度量名称',
+              onSearch: (value: string) => {
+                setTableData(
+                  [...tableData].reduce((data: ISemantic.IMeasure[], item: ISemantic.IMeasure) => {
+                    if (item.bizName.includes(value)) {
+                      data.push(item);
+                    }
+                    return data;
+                  }, []),
+                );
+              },
+            },
+          }}
+          pagination={{ defaultPageSize: 10 }}
          size="small"
          options={false}
-          toolBarRender={() => [
-            <Button
-              key="create"
-              type="primary"
-              onClick={() => {
-                setMeasuresModalVisible(true);
-              }}
-            >
-              增加度量
-            </Button>,
-          ]}
+          tableAlertRender={false}
+          scroll={{ y: 500 }}
+          rowSelection={rowSelection}
        />
        <ProCard
          title={<FormLabelRequire title="度量表达式" />}
@@ -161,33 +180,6 @@ const MetricMeasuresFormTable: React.FC<Props> = ({
          />
        </ProCard>
      </Space>
-      {measuresModalVisible && (
-        <BindMeasuresTable
-          measuresList={
-            datasourceId && Array.isArray(measuresList)
-              ? measuresList.filter((item) => item.datasourceId === datasourceId)
-              : measuresList
-          }
-          selectedMeasuresList={measuresParams?.measures || []}
-          onSubmit={async (values: any[]) => {
-            const measures = values.map(({ bizName, name, expr, datasourceId, agg }) => {
-              return {
-                bizName,
-                name,
-                expr,
-                agg,
-                datasourceId,
-              };
-            });
-            onFieldChange?.(measures);
-            setMeasuresModalVisible(false);
-          }}
-          onCancel={() => {
-            setMeasuresModalVisible(false);
-          }}
-          createModalVisible={measuresModalVisible}
-        />
-      )}
    </>
  );
 };
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricMetricFormTable.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/MetricMetricFormTable.tsx
@@ -49,7 +49,7 @@ const MetricMetricFormTable: React.FC<Props> = ({

  // const [selectMeasuresList, setSelectMeasuresList] = useState<IDataSource.IMeasuresItem[]>([]);

-  const [selectedMeasuresKeys, setSelectedMeasuresKeys] = useState<string[]>(() => {
+  const [selectedKeys, setSelectedKeys] = useState<string[]>(() => {
    // return [];
    return defineTypeParams.metrics.map((item: any) => {
      return item.bizName;
@@ -68,9 +68,9 @@ const MetricMetricFormTable: React.FC<Props> = ({
  ];

  const rowSelection = {
-    selectedRowKeys: selectedMeasuresKeys,
+    selectedRowKeys: selectedKeys,
    onChange: (_selectedRowKeys: any[]) => {
-      setSelectedMeasuresKeys([..._selectedRowKeys]);
+      setSelectedKeys([..._selectedRowKeys]);
      onFieldChange(
        metricList.reduce(
          (metrics: ISemantic.IMetricTypeParamsItem[], item: ISemantic.IMetricItem) => {
@@ -97,7 +97,7 @@ const MetricMetricFormTable: React.FC<Props> = ({
          rowKey="bizName"
          columns={columns}
          dataSource={tableData}
-          pagination={false}
+          // pagination={false}
          search={false}
          toolbar={{
            search: {
@@ -117,6 +117,7 @@ const MetricMetricFormTable: React.FC<Props> = ({
              },
            },
          }}
+          pagination={{ defaultPageSize: 10 }}
          size="small"
          options={false}
          tableAlertRender={false}
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Permission/PermissionCreateDrawer.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/Permission/PermissionCreateDrawer.tsx
@@ -8,7 +8,7 @@ import type { StateType } from '../../model';
 import SqlEditor from '@/components/SqlEditor';
 import { TransType } from '../../enum';
 import DimensionMetricVisibleTransfer from '../Entity/DimensionMetricVisibleTransfer';
-import { wrapperTransTypeAndId } from '../Entity/utils';
+import { wrapperTransTypeAndId } from '../../utils';
 import styles from '../style.less';

 type Props = {
--- a/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/TransTypeTag.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/SemanticModel/components/TransTypeTag.tsx
@@ -15,7 +15,7 @@ const TransTypeTag: React.FC<Props> = ({ type }) => {
      ) : type === SemanticNodeType.METRIC ? (
        <Tag color="orange">{'指标'}</Tag>
      ) : type === SemanticNodeType.DATASOURCE ? (
-        <Tag color="green">{'数据源'}</Tag>
+        <Tag color="green">{'模型'}</Tag>
      ) : (
        <></>
      )}