fix: 统一优化统计分析界面，图标样式等！

src/pages/statistic/accounts/openCardStatics/index.vue

@@ -1,6 +1,6 @@
 <template>
     <view class="container">
-        <u-sticky offsetTop="-10rpx" customNavHeight="0rpx">
+      <u-sticky offsetTop="0rpx" customNavHeight="0rpx">
       <view class="search-view">
         <u-input v-model="queryParams.time" border="false" type="select"  placeholder="" suffixIcon="calendar"
         suffixIconStyle="color: #909399" class="search-input">  
@@ -9,62 +9,7 @@
           <uni-icons type="list" size="18" color="#667eea"></uni-icons>
           <text>筛选</text>
         </view>
-        <u-transition :show="filterPanel" mode="fade">
-          <view class="filter-panel" :style="{ height: `${windowHeight - 42}px` }">
-            <view class="filter-panel-content">
-             
-              <view class="select-header">开户日期</view>
-            <view class="selcet-content" style="padding: 0 24rpx">
-              <u-input
-                :disabled="true"
-                :disabledColor="'#fff'"
-                class="dateInput"
-                border="surround"
-                v-model="queryParams.startTime"
-                placeholder="请选择开始时间"
-              >
-                <template v-slot:suffix>
-                  <u-icon name="calendar" @click="openOrCloseDate(true)"></u-icon>
-                </template>
-              </u-input>
-              <u-input
-                :disabled="true"
-                :disabledColor="'#fff'"
-                class="dateInput"
-                border="surround"
-                v-model="queryParams.endTime"
-                placeholder="请选择结束时间"
-              >
-                <template v-slot:suffix>
-                  <u-icon name="calendar" @click="openOrCloseDate(false)"></u-icon>
-                </template>
-              </u-input>
-            </view>
-            </view>
-            <view class="btn-box">
-              <view class="btn-reset" @click="resetQuery()">
-                <uni-icons type="reload" size="16" color="#909399"></uni-icons>
-                <text>重置</text>
-              </view>
-              <view class="btn-confirm" @click="searchSubmit()">
-                <uni-icons type="checkmarkempty" size="16" color="#ffffff"></uni-icons>
-                <text>确定</text>
-              </view>
-            </view>
-            <u-datetime-picker
-              :closeOnClickOverlay="true"
-              :show="timeShow"
-              v-model="time"
-              mode="date"
-              :minDate="-2209017600000"
-              @close="openOrCloseDate"
-              @cancel="openOrCloseDate"
-              @confirm="confirm"
-            ></u-datetime-picker>
-          </view>
-        </u-transition>
       </view>
-      </u-sticky>
         <div class="app-container">
         
     <div class="header-con" v-show ="oneCount>0" ref="searchHeightRef">
@@ -147,6 +92,61 @@
       </view>
     </view>
   </view>
+      </u-sticky>
+      <u-transition :show="filterPanel" mode="fade">
+          <view class="filter-panel" :style="{ height: `${windowHeight - 42}px` }">
+            <view class="filter-panel-content">
+             
+              <view class="select-header">开户日期</view>
+            <view class="selcet-content" style="padding: 0 24rpx">
+              <u-input
+                :disabled="true"
+                :disabledColor="'#fff'"
+                class="dateInput"
+                border="surround"
+                v-model="queryParams.startTime"
+                placeholder="请选择开始时间"
+              >
+                <template v-slot:suffix>
+                  <u-icon name="calendar" @click="openOrCloseDate(true)"></u-icon>
+                </template>
+              </u-input>
+              <u-input
+                :disabled="true"
+                :disabledColor="'#fff'"
+                class="dateInput"
+                border="surround"
+                v-model="queryParams.endTime"
+                placeholder="请选择结束时间"
+              >
+                <template v-slot:suffix>
+                  <u-icon name="calendar" @click="openOrCloseDate(false)"></u-icon>
+                </template>
+              </u-input>
+            </view>
+            </view>
+            <view class="btn-box">
+              <view class="btn-reset" @click="resetQuery()">
+                <uni-icons type="reload" size="16" color="#909399"></uni-icons>
+                <text>重置</text>
+              </view>
+              <view class="btn-confirm" @click="searchSubmit()">
+                <uni-icons type="checkmarkempty" size="16" color="#ffffff"></uni-icons>
+                <text>确定</text>
+              </view>
+            </view>
+            <u-datetime-picker
+              :closeOnClickOverlay="true"
+              :show="timeShow"
+              v-model="time"
+              mode="date"
+              :minDate="-2209017600000"
+              @close="openOrCloseDate"
+              @cancel="openOrCloseDate"
+              @confirm="confirm"
+            ></u-datetime-picker>
+          </view>
+        </u-transition>
   
   <!-- 曲线图展示 -->
   <view class="chart-container" v-if="listData.length>0 && viewMode === 'line'">
@@ -171,7 +171,7 @@
   </view>
   
   <!-- 列表展示 -->
-      <u-list  :spaceHeight="116" lowerThreshold="100" v-show="viewMode === 'list'">
+      <u-list  :spaceHeight="720" lowerThreshold="100" v-show="viewMode === 'list'">
         <u-list-item v-for="(item, index) in listData" :key="index">
           <view class="list-item">
             <view class="item-header">
@@ -261,6 +261,9 @@
   
   // 曲线图配置
   const lineChartOpts = computed(() => {
+    const dataCount = listData.value ? listData.value.length : 0
+    const showXAxisLabel = dataCount <= 10
+    
     // 计算数据范围以动态设置Y轴
     let minValue = 0
     let maxValue = 0
@@ -276,7 +279,7 @@
     
     return {
       color: ['#667eea'],
-      padding: [20, 15, 60, 15],
+      padding: [15, 15, 30, 5],
       enableScroll: false,
       enableMarkLine: true,
       dataLabel: false,
@@ -290,10 +293,11 @@
         axisLine: false,
         scrollShow: true,
         itemCount: 5,
-        fontSize: 10,
-        fontColor: '#999999',
+        fontSize: showXAxisLabel ? 10 : 0,
+        fontColor: showXAxisLabel ? '#999999' : 'transparent',
         rotateLabel: true,
-        rotateAngle: 30
+        rotateAngle: 30,
+        disabled: !showXAxisLabel
       },
       yAxis: {
         gridType: 'dash',
@@ -330,6 +334,9 @@
   
   // 柱状图配置
   const columnChartOpts = computed(() => {
+    const dataCount = listData.value ? listData.value.length : 0
+    const showXAxisLabel = dataCount <= 10
+    
     // 计算数据范围以动态设置Y轴
     let minValue = 0
     let maxValue = 0
@@ -352,7 +359,7 @@
     
     return {
       color: ['#667eea'],
-      padding: [15, 15, 80, 15],
+      padding: [15, 15, 30, 5],
       enableScroll: false,
       dataLabel: false,
       legend: {
@@ -364,10 +371,11 @@
         axisLine: false,
         scrollShow: true,
         itemCount: 5,
-        fontSize: 10,
-        fontColor: '#999999',
+        fontSize: showXAxisLabel ? 10 : 0,
+        fontColor: showXAxisLabel ? '#999999' : 'transparent',
         rotateLabel: true,
-        rotateAngle: 30
+        rotateAngle: 30,
+        disabled: !showXAxisLabel
       },
       yAxis: {
         gridType: 'dash',
@@ -528,7 +536,10 @@ function getList() {
   </script>
   
   <style lang="scss" scoped>
-
+page {
+  height: 100%;
+  overflow: auto;
+}
 .app-container {
   background-color: #f5f7fa;
   padding: 0;
@@ -613,6 +624,7 @@ function getList() {
   
   .section-title {
     display: flex;
+    margin-top: -20rpx;
     align-items: center;
     padding: 24rpx 32rpx 16rpx;
     background-color: #f5f7fa;
@@ -674,13 +686,13 @@ function getList() {
   }
   
   .chart-container {
-    margin: 16rpx 24rpx 160rpx;
+    margin: 16rpx 24rpx 60rpx;
     padding: 16rpx;
     background: linear-gradient(135deg, #ffffff 0%, #f8f9fb 100%);
     border-radius: 16rpx;
     box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
     width: calc(100% - 48rpx);
-    height: 850rpx;
+    height: 950rpx;
     overflow: visible;
     position: relative;
   }