feat: 更新交易视图，添加成交量数据支持并优化用户界面

src/ui/tabs/index.vue

@@ -337,7 +337,7 @@ const stickyStyle = computed(() => {
 
 /* 导航包装器 */
 .ui-tabs__nav-wrapper {
-  @apply relative;
+  @apply relative w-fit mb-4;
 }
 
 /* Sticky 布局 */
@@ -374,7 +374,7 @@ const stickyStyle = computed(() => {
 }
 
 .ui-tabs__nav--segment {
-  @apply gap-1 p-1 rounded-lg;
+  @apply gap-1 p-1 rounded-full;
   background-color: var(--ion-color-light, #f8f9fa);
 }
 
@@ -427,11 +427,12 @@ const stickyStyle = computed(() => {
 
 /* Segment 类型 */
 .ui-tab--segment {
-  @apply px-3 py-2 rounded-md;
+  @apply px-3 py-2 rounded-full;
 }
 
 .ui-tab--segment.ui-tab--active {
   background-color: var(--ui-tabs-background);
+  color: var(--ui-tabs-text, "black");
   box-shadow:
     0 1px 3px 0 rgba(0, 0, 0, 0.1),
     0 1px 2px 0 rgba(0, 0, 0, 0.06);
@@ -448,7 +449,11 @@ const stickyStyle = computed(() => {
 }
 
 .ui-tab--small.ui-tab--segment {
-  @apply px-2 py-1;
+  @apply px-5 py-1;
+}
+
+.ui-tab--medium.ui-tab--segment {
+  @apply px-8 py-1;
 }
 
 .ui-tab--large {
@@ -461,7 +466,7 @@ const stickyStyle = computed(() => {
 }
 
 .ui-tab--large.ui-tab--segment {
-  @apply px-4 py-3;
+  @apply px-8 py-3;
 }
 
 /* Tab Label */