[improvement][semantic-fe] Adding batch operations for indicators/dimensions/models (#313)

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

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

@@ -10,6 +10,7 @@ import type { StateType } from '../model';
 import { formatNumber } from '../../../utils/utils';
 import { deleteModel } from '../service';
 import ModelCreateFormModal from './ModelCreateFormModal';
+import ModelTable from './ModelTable';
 import styles from './style.less';
 
 type Props = {
@@ -26,85 +27,86 @@ const OverView: React.FC<Props> = ({
   onModelChange,
   domainManger,
 }) => {
-  const { selectDomainId, selectModelId } = domainManger;
-  const [currentModel, setCurrentModel] = useState<any>({});
-  const [modelCreateFormModalVisible, setModelCreateFormModalVisible] = useState<boolean>(false);
+  // const { selectDomainId, selectModelId } = domainManger;
+  // const [currentModel, setCurrentModel] = useState<any>({});
+  // const [modelCreateFormModalVisible, setModelCreateFormModalVisible] = useState<boolean>(false);
 
-  const descNode = (model: ISemantic.IDomainItem) => {
-    const { metricCnt, dimensionCnt } = model;
-    return (
-      <div className={styles.overviewExtraContainer}>
-        <div className={styles.extraWrapper}>
-          <div className={styles.extraStatistic}>
-            <div className={styles.extraTitle}>维度数</div>
-            <div className={styles.extraValue}>
-              <span className="ant-statistic-content-value">{formatNumber(dimensionCnt || 0)}</span>
-            </div>
-          </div>
-        </div>
-        <div className={styles.extraWrapper}>
-          <div className={styles.extraStatistic}>
-            <div className={styles.extraTitle}>指标数</div>
-            <div className={styles.extraValue}>
-              <span className="ant-statistic-content-value">{formatNumber(metricCnt || 0)}</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    );
-  };
+  // const descNode = (model: ISemantic.IDomainItem) => {
+  //   const { metricCnt, dimensionCnt } = model;
+  //   return (
+  //     <div className={styles.overviewExtraContainer}>
+  //       <div className={styles.extraWrapper}>
+  //         <div className={styles.extraStatistic}>
+  //           <div className={styles.extraTitle}>维度数</div>
+  //           <div className={styles.extraValue}>
+  //             <span className="ant-statistic-content-value">{formatNumber(dimensionCnt || 0)}</span>
+  //           </div>
+  //         </div>
+  //       </div>
+  //       <div className={styles.extraWrapper}>
+  //         <div className={styles.extraStatistic}>
+  //           <div className={styles.extraTitle}>指标数</div>
+  //           <div className={styles.extraValue}>
+  //             <span className="ant-statistic-content-value">{formatNumber(metricCnt || 0)}</span>
+  //           </div>
+  //         </div>
+  //       </div>
+  //     </div>
+  //   );
+  // };
 
-  const extraNode = (model: ISemantic.IDomainItem) => {
-    return (
-      <Dropdown
-        placement="top"
-        menu={{
-          onClick: ({ key, domEvent }) => {
-            domEvent.stopPropagation();
-            if (key === 'edit') {
-              setCurrentModel(model);
-              setModelCreateFormModalVisible(true);
-            }
-          },
-          items: [
-            {
-              label: '编辑',
-              key: 'edit',
-            },
-            {
-              label: (
-                <Popconfirm
-                  title="确认删除？"
-                  okText="是"
-                  cancelText="否"
-                  onConfirm={async () => {
-                    const { code, msg } = await deleteModel(model.id);
-                    if (code === 200) {
-                      onModelChange?.();
-                    } else {
-                      message.error(msg);
-                    }
-                  }}
-                >
-                  <a key="modelDeleteBtn">删除</a>
-                </Popconfirm>
-              ),
-              key: 'delete',
-            },
-          ],
-        }}
-      >
-        <EllipsisOutlined
-          style={{ fontSize: 22, color: 'rgba(0,0,0,0.5)' }}
-          onClick={(e) => e.stopPropagation()}
-        />
-      </Dropdown>
-    );
-  };
+  // const extraNode = (model: ISemantic.IDomainItem) => {
+  //   return (
+  //     <Dropdown
+  //       placement="top"
+  //       menu={{
+  //         onClick: ({ key, domEvent }) => {
+  //           domEvent.stopPropagation();
+  //           if (key === 'edit') {
+  //             setCurrentModel(model);
+  //             setModelCreateFormModalVisible(true);
+  //           }
+  //         },
+  //         items: [
+  //           {
+  //             label: '编辑',
+  //             key: 'edit',
+  //           },
+  //           {
+  //             label: (
+  //               <Popconfirm
+  //                 title="确认删除？"
+  //                 okText="是"
+  //                 cancelText="否"
+  //                 onConfirm={async () => {
+  //                   const { code, msg } = await deleteModel(model.id);
+  //                   if (code === 200) {
+  //                     onModelChange?.();
+  //                   } else {
+  //                     message.error(msg);
+  //                   }
+  //                 }}
+  //               >
+  //                 <a key="modelDeleteBtn">删除</a>
+  //               </Popconfirm>
+  //             ),
+  //             key: 'delete',
+  //           },
+  //         ],
+  //       }}
+  //     >
+  //       <EllipsisOutlined
+  //         style={{ fontSize: 22, color: 'rgba(0,0,0,0.5)' }}
+  //         onClick={(e) => e.stopPropagation()}
+  //       />
+  //     </Dropdown>
+  //   );
+  // };
 
   return (
     <div style={{ padding: '0px 20px 20px' }}>
-      {!disabledEdit && (
+      <ModelTable modelList={modelList} disabledEdit={disabledEdit} onModelChange={onModelChange} />
+      {/* {!disabledEdit && (
         <div style={{ paddingBottom: '20px' }}>
           <Button
             onClick={() => {
@@ -135,8 +137,8 @@ const OverView: React.FC<Props> = ({
               />
             );
           })}
-      </CheckCard.Group>
-      {modelCreateFormModalVisible && (
+      </CheckCard.Group> */}
+      {/* {modelCreateFormModalVisible && (
         <ModelCreateFormModal
           domainId={selectDomainId}
           basicInfo={currentModel}
@@ -148,7 +150,7 @@ const OverView: React.FC<Props> = ({
             setModelCreateFormModalVisible(false);
           }}
         />
-      )}
+      )} */}
     </div>
   );
 };