修复 Token 使用趋势日期标签与迷你图对齐：日期均匀分布匹配数据点

web/bun.lock

@@ -6,6 +6,7 @@
       "name": "react-template",
       "dependencies": {
         "@douyinfe/semi-icons": "^2.63.1",
+        "@douyinfe/semi-illustrations": "^2.100.0",
         "@douyinfe/semi-ui": "^2.69.1",
         "@lobehub/icons": "^2.0.0",
         "@visactor/react-vchart": "~1.8.8",
@@ -171,7 +172,7 @@
 
     "@douyinfe/semi-icons": ["@douyinfe/semi-icons@2.94.0", "https://registry.npmmirror.com/@douyinfe/semi-icons/-/semi-icons-2.94.0.tgz", { "dependencies": { "classnames": "^2.2.6" }, "peerDependencies": { "react": ">=16.0.0" } }, "sha512-Hn6Bm8umITAxw5xZlslrFXf+UBUWU5OD9YSNDN46H+OKnZFwbnYV628DBWSewBrvCItxUGMXHnLal4h1ZIb6qQ=="],
 
-    "@douyinfe/semi-illustrations": ["@douyinfe/semi-illustrations@2.94.0", "https://registry.npmmirror.com/@douyinfe/semi-illustrations/-/semi-illustrations-2.94.0.tgz", { "peerDependencies": { "react": ">=16.0.0" } }, "sha512-nXi4bysh4GsO/DxoNUmCd5NlRYeYZb7pqXcGZFj+PpxbPoG7Qn4jqhrUUFrJNppvven9nS0SgabDAHnT3o+jaQ=="],
+    "@douyinfe/semi-illustrations": ["@douyinfe/semi-illustrations@2.100.0", "", { "peerDependencies": { "react": ">=16.0.0" } }, "sha512-SN7plpE328WGBohLHOVpYe6FwWSO6RLS7Xf6LhqEdtarwK52ircr4C/b+OyRqIwcLOzRYMgIoqcWnAQGmowcUw=="],
 
     "@douyinfe/semi-json-viewer-core": ["@douyinfe/semi-json-viewer-core@2.94.0", "https://registry.npmmirror.com/@douyinfe/semi-json-viewer-core/-/semi-json-viewer-core-2.94.0.tgz", { "dependencies": { "jsonc-parser": "^3.3.1" } }, "sha512-pi4+Oi2zvsc0S3smWz58RNbfB73NgfO68fntKsVbLV1lTwNFuDxSswT8n8SXDZhtKoYgPVMmE3eMTc2nkXnvng=="],
 
@@ -2261,6 +2262,8 @@
 
     "@ant-design/cssinjs-utils/@ant-design/cssinjs": ["@ant-design/cssinjs@1.24.0", "https://registry.npmmirror.com/@ant-design/cssinjs/-/cssinjs-1.24.0.tgz", { "dependencies": { "@babel/runtime": "^7.11.1", "@emotion/hash": "^0.8.0", "@emotion/unitless": "^0.7.5", "classnames": "^2.3.1", "csstype": "^3.1.3", "rc-util": "^5.35.0", "stylis": "^4.3.4" }, "peerDependencies": { "react": ">=16.0.0", "react-dom": ">=16.0.0" } }, "sha512-K4cYrJBsgvL+IoozUXYjbT6LHHNt+19a9zkvpBPxLjFHas1UpPM2A5MlhROb0BT8N8WoavM5VsP9MeSeNK/3mg=="],
 
+    "@douyinfe/semi-ui/@douyinfe/semi-illustrations": ["@douyinfe/semi-illustrations@2.94.0", "https://registry.npmmirror.com/@douyinfe/semi-illustrations/-/semi-illustrations-2.94.0.tgz", { "peerDependencies": { "react": ">=16.0.0" } }, "sha512-nXi4bysh4GsO/DxoNUmCd5NlRYeYZb7pqXcGZFj+PpxbPoG7Qn4jqhrUUFrJNppvven9nS0SgabDAHnT3o+jaQ=="],
+
     "@emotion/babel-plugin/@emotion/hash": ["@emotion/hash@0.9.2", "https://registry.npmmirror.com/@emotion/hash/-/hash-0.9.2.tgz", {}, "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g=="],
 
     "@emotion/babel-plugin/convert-source-map": ["convert-source-map@1.9.0", "https://registry.npmmirror.com/convert-source-map/-/convert-source-map-1.9.0.tgz", {}, "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A=="],

web/src/components/dashboard/BentoTrend.jsx

@@ -76,26 +76,25 @@ const BentoTrend = ({
       </div>
 
       <div className='flex items-center justify-between text-[11px]'>
-        <div className='flex items-center gap-1 tabular-nums'>
+        <div className='flex w-full items-center justify-between tabular-nums'>
           {dailyStats.map((d, i) => {
             const isPeak = d.count === peak && peak > 0;
             return (
-            <span
+              <span
-              key={i}
+                key={i}
-              className={`w-8 text-center text-xs ${
+                className={`text-center text-xs ${
-                isPeak
+                  isPeak
-                  ? 'font-semibold text-slate-900 dark:text-white'
+                    ? 'font-semibold text-slate-900 dark:text-white'
-                  : 'text-slate-500 dark:text-white/50'
+                    : 'text-slate-500 dark:text-white/50'
-              }`}
+                }`}
-              title={`${d.date.getMonth() + 1}月${d.date.getDate()}日 ${d.count} 次`}
+                title={`${d.date.getMonth() + 1}月${d.date.getDate()}日 ${d.count} 次`}
-            >
+              >
-              {formatMD(d.date)}
+                {formatMD(d.date)}
-            </span>
+              </span>
-          );
+            );
-        })}
+          })}
         </div>
-        </div>
+        <div className='ml-4 shrink-0 text-slate-500 tabular-nums dark:text-white/50'>
-        <div className='text-slate-500 tabular-nums dark:text-white/50'>
           峰值{' '}
           <span className='font-semibold text-slate-900 dark:text-white'>{peak}</span> 次
         </div>