feat: Update SiderBar and Detail components for improved navigation and data visualization

- Removed the '模型价格' (Pricing) link from the SiderBar for a cleaner interface.
- Added a new '数据看板' (Data Dashboard) link to the SiderBar, enhancing navigation options.
- Refactored the Detail component to include user context and style context for better state management.
- Introduced new state variables to track token consumption and updated data handling for charts.
- Enhanced the layout with additional cards and tabs for displaying user quota and usage statistics.
- Improved data processing logic for pie and line charts, ensuring accurate representation of user data.

web/src/components/SiderBar.js

@@ -74,12 +74,6 @@ const SiderBar = () => {
         icon: <IconCommentStroked />,
       },
       {
-        text: '模型价格',
-        itemKey: 'pricing',
-        to: '/pricing',
-        icon: <IconPriceTag />,
-      },
-      {
         text: '渠道',
         itemKey: 'channel',
         to: '/channel',
@@ -103,6 +97,16 @@ const SiderBar = () => {
         icon: <IconKey />,
       },
       {
+        text: '数据看板',
+        itemKey: 'detail',
+        to: '/detail',
+        icon: <IconCalendarClock />,
+        className:
+          localStorage.getItem('enable_data_export') === 'true'
+            ? 'semi-navigation-item-normal'
+            : 'tableHiddle',
+      },
+      {
         text: '兑换码',
         itemKey: 'redemption',
         to: '/redemption',
@@ -129,16 +133,6 @@ const SiderBar = () => {
         icon: <IconHistogram />,
       },
       {
-        text: '数据看板',
-        itemKey: 'detail',
-        to: '/detail',
-        icon: <IconCalendarClock />,
-        className:
-          localStorage.getItem('enable_data_export') === 'true'
-            ? 'semi-navigation-item-normal'
-            : 'tableHiddle',
-      },
-      {
         text: '绘图',
         itemKey: 'midjourney',
         to: '/midjourney',