feat: 添加交易状况组件并优化统计数据展示，支持环比增长率显示

packages/effects/common-ui/src/ui/dashboard/analysis/analysis-overview.vue

@@ -52,6 +52,24 @@ const gridColumnsClass = computed(() => {
     'lg:grid-cols-6': colNum === 6,
   };
 });
+
+// 计算环比增长率
+const calculateGrowthRate = (
+  currentValue: number,
+  previousValue: number,
+): { isPositive: boolean; rate: number } => {
+  if (previousValue === 0) {
+    return { rate: currentValue > 0 ? 100 : 0, isPositive: currentValue >= 0 };
+  }
+
+  const rate = ((currentValue - previousValue) / previousValue) * 100;
+  return { rate: Math.abs(rate), isPositive: rate >= 0 };
+};
+
+// 格式化增长率显示
+const formatGrowthRate = (rate: number): string => {
+  return rate.toFixed(1);
+};
 </script>
 
 <template>
@@ -60,22 +78,62 @@ const gridColumnsClass = computed(() => {
       <Card :title="item.title" class="w-full">
         <CardHeader>
           <CardTitle class="text-xl">
-            <div class="flex items-center">
-              <span>{{ item.title }}</span>
-              <span v-if="item.tooltip" class="ml-1 inline-block">
-                <TooltipProvider>
-                  <Tooltip>
-                    <TooltipTrigger>
-                      <div
-                        class="inline-flex h-4 w-4 translate-y-[-3px] items-center justify-center rounded-full bg-gray-200 text-xs font-bold text-gray-600"
-                      >
-                        !
-                      </div>
-                    </TooltipTrigger>
-                    <TooltipContent>{{ item.tooltip }}</TooltipContent>
-                  </Tooltip>
-                </TooltipProvider>
-              </span>
+            <div class="flex items-center justify-between">
+              <div class="flex items-center">
+                <span>{{ item.title }}</span>
+                <span v-if="item.tooltip" class="ml-1 inline-block">
+                  <TooltipProvider>
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <div
+                          class="inline-flex h-4 w-4 translate-y-[-3px] items-center justify-center rounded-full bg-gray-200 text-xs font-bold text-gray-600"
+                        >
+                          !
+                        </div>
+                      </TooltipTrigger>
+                      <TooltipContent>{{ item.tooltip }}</TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
+                </span>
+              </div>
+
+              <!-- 环比增长率显示在右上角 -->
+              <div
+                v-if="item.showGrowthRate && item.totalValue !== undefined"
+                class="flex items-center space-x-1"
+              >
+                <VbenIcon
+                  :icon="
+                    calculateGrowthRate(item.value, item.totalValue).isPositive
+                      ? 'lucide:trending-up'
+                      : 'lucide:trending-down'
+                  "
+                  class="size-4"
+                  :class="[
+                    calculateGrowthRate(item.value, item.totalValue).isPositive
+                      ? 'text-green-500'
+                      : 'text-red-500',
+                  ]"
+                />
+                <span
+                  class="text-sm font-medium"
+                  :class="[
+                    calculateGrowthRate(item.value, item.totalValue).isPositive
+                      ? 'text-green-500'
+                      : 'text-red-500',
+                  ]"
+                >
+                  {{
+                    calculateGrowthRate(item.value, item.totalValue).isPositive
+                      ? '+'
+                      : '-'
+                  }}{{
+                    formatGrowthRate(
+                      calculateGrowthRate(item.value, item.totalValue).rate,
+                    )
+                  }}%
+                </span>
+              </div>
             </div>
           </CardTitle>
         </CardHeader>

packages/effects/common-ui/src/ui/dashboard/typing.ts

@@ -7,6 +7,8 @@ interface AnalysisOverviewItem {
   totalValue?: number;
   value: number;
   tooltip?: string;
+  // 环比增长相关字段
+  showGrowthRate?: boolean; // 是否显示环比增长率，默认为false
 }
 
 interface WorkbenchProjectItem {