[improvement][semantic-fe] UI adjustment for metric details page. (#617)

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

webapp/packages/supersonic-fe/src/pages/SemanticModel/Metric/style.less

@@ -2,6 +2,7 @@
     margin: 20px;
     padding: 20px;
     border-radius: 10px;
+    padding-bottom: 5px;
     background: #fff;
 }
 
@@ -154,18 +155,27 @@
                 }
             }
         }
+        .siderContainer {
+            background-color: rgb(255, 255, 255);
+            width: 450px;
+            min-height: 100vh;
+            margin: 20px 20px 20px 0; 
+            border-radius: 6px;
+            box-shadow: rgba(0, 0, 0, 0.08) 6px 0px 16px 0px, rgba(0, 0, 0, 0.12) 3px 0px 6px -4px, rgba(0, 0, 0, 0.05) 9px 0px 28px 8px;
+        }
     }
 }
 .metricTrendSection {
     .sectionBox {
         margin: 20px;
-        padding: 20px;
+        padding: 10px;
         box-shadow: #888888 0px 0px 1px, rgba(29, 41, 57, 0.08) 0px 1px 3px;
         background-color: rgb(255, 255, 255);
         transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
         border-radius: 6px;
         background-image: none;
         overflow: hidden;
+        position: relative;
     }
 }
 
@@ -198,10 +208,22 @@
         display: block;
         color: #7b809a;
     }
+    .subTitle {
+        margin: 0px;
+        font-size: 14px;
+        line-height: 1.25;
+        letter-spacing: 0.03333em;
+        opacity: 1;
+        text-transform: uppercase;
+        vertical-align: unset;
+        text-decoration: none;
+        color: rgb(123, 128, 154);
+        font-weight: 700;
+    }
     .sectionContainer{
-        transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+        // transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
         border-radius: 6px;
-        box-shadow: #888888 0px 0px 1px, rgba(29, 41, 57, 0.08) 0px 1px 3px;
+        // box-shadow: #888888 0px 0px 1px, rgba(29, 41, 57, 0.08) 0px 1px 3px;
         background-image: none;
         margin-top: 20px;
         overflow: hidden;
@@ -231,19 +253,7 @@
                     font-weight: 600;
                 }
             }
-            .subTitle {
-                margin: 0px;
-                font-family: Roboto, Helvetica, Arial, sans-serif;
-                font-size: 14px;
-                line-height: 1.25;
-                letter-spacing: 0.03333em;
-                opacity: 1;
-                text-transform: uppercase;
-                vertical-align: unset;
-                text-decoration: none;
-                color: rgb(123, 128, 154);
-                font-weight: 700;
-            }
+
             .item {
                 display: flex;
                 padding-top: 8px;
@@ -284,7 +294,7 @@
         .hr {
             margin: 0px;
             flex-shrink: 0;
-            border-width: 0px 0px thin;
+            // border-width: 0px 0px thin;
             border-style: solid;
             border-color: rgb(242, 244, 247);
         }
@@ -329,7 +339,7 @@
                 }
                 .ctrlItemIcon {
                     flex-shrink: 0;
-                    font-size: 16px;
+                    font-size: 14px;
                     margin-right: 5px;
                     min-width: unset;
                 }