fix: 图表功能展示优化。

src/pages/health/statistic/doctorStatistic/index.vue

@@ -267,6 +267,8 @@
       :chartData="chartData"
       :opts="lineChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -278,6 +280,8 @@
       :chartData="chartData"
       :opts="columnChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -526,7 +530,7 @@ const lineChartOpts = computed(() => {
     color: ['#667eea'],
     padding: [15, 15, 30, 5],
     enableScroll: false,
-    enableMarkLine: true,
+    enableMarkLine: false,
     dataLabel: false,
     dataPointShape: true,
     legend: {
@@ -572,6 +576,30 @@ const lineChartOpts = computed(() => {
         linearOpacity: 0.2,
         onShadow: true,
         animation: true
+      },
+      tooltip: {
+        showBox: true,
+        showArrow: true,
+        showCategory: false,
+        bgColor: '#000000',
+        bgOpacity: 0.7,
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#CCCCCC',
+        fontColor: '#FFFFFF',
+        fontSize: 11,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
+        xAxisLabel: true,
+        yAxisLabel: true,
+        labelBgColor: '#000000',
+        labelBgOpacity: 0.7,
+        labelFontColor: '#FFFFFF'
       }
     }
   }
@@ -627,6 +655,30 @@ const columnChartOpts = computed(() => {
         linearType: 'none',
         barBorderCircle: true,
         seriesGap: 2
+      },
+      tooltip: {
+        showBox: true,
+        showArrow: true,
+        showCategory: false,
+        bgColor: '#000000',
+        bgOpacity: 0.7,
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#CCCCCC',
+        fontColor: '#FFFFFF',
+        fontSize: 11,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
+        xAxisLabel: true,
+        yAxisLabel: true,
+        labelBgColor: '#000000',
+        labelBgOpacity: 0.7,
+        labelFontColor: '#FFFFFF'
       }
     }
   }
@@ -1122,7 +1174,7 @@ page {
   left: 0;
   top: 270rpx;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999;
+  z-index: 9999;
 
   .filter-panel-content {
     background-color: #ffffff;
@@ -1315,7 +1367,7 @@ page {
   border-radius: 16rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
   width: calc(100% - 48rpx);
-  height: 500rpx;
+  height: 750rpx;
   overflow: visible;
   position: relative;
 }
@@ -1467,19 +1519,18 @@ page {
   .info-row {
     display: flex;
     flex-wrap: wrap;
-    gap: 24rpx;
+    margin: 0 -12rpx;
-    margin-bottom: 0;
 
     .info-item {
-      flex: 0 0 calc(50% - 12rpx);
+      width: 50%;
+      padding: 0 12rpx;
+      box-sizing: border-box;
       display: flex;
       flex-direction: column;
-      gap: 4rpx;
+      margin-bottom: 20rpx;
-      min-width: 0;
-      margin-bottom: -5rpx;
       
       &.info-item-full {
-        flex: 0 0 100%;
+        width: 100%;
       }
 
       .info-label {
@@ -1490,6 +1541,7 @@ page {
         padding: 6rpx 12rpx;
         border-radius: 8rpx;
         align-self: flex-start;
+        margin-bottom: 8rpx;
       }
 
       .info-value {

src/pages/health/statistic/healthStatistic/index.vue

@@ -271,6 +271,8 @@
       :chartData="chartData"
       :opts="lineChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -282,6 +284,8 @@
       :chartData="chartData"
       :opts="columnChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -416,7 +420,7 @@ const lineChartOpts = computed(() => {
     color: ['#667eea'],
     padding: [15, 15, 30, 5],
     enableScroll: false,
-    enableMarkLine: true,
+    enableMarkLine: false,
     dataLabel: false,
     dataPointShape: true,
     legend: {
@@ -461,15 +465,21 @@ const lineChartOpts = computed(() => {
       tooltip: {
         showBox: true,
         showArrow: true,
-        showCategory: true,
+        showCategory: false,
         bgColor: '#000000',
         bgOpacity: 0.7,
         gridType: 'dash',
         dashLength: 4,
         gridColor: '#CCCCCC',
         fontColor: '#FFFFFF',
-        splitLine: true,
+        fontSize: 11,
-        horizentalLine: true,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
         xAxisLabel: true,
         yAxisLabel: true,
         labelBgColor: '#000000',
@@ -546,15 +556,21 @@ const columnChartOpts = computed(() => {
       tooltip: {
         showBox: true,
         showArrow: true,
-        showCategory: true,
+        showCategory: false,
         bgColor: '#000000',
         bgOpacity: 0.7,
         gridType: 'dash',
         dashLength: 4,
         gridColor: '#CCCCCC',
         fontColor: '#FFFFFF',
-        splitLine: true,
+        fontSize: 11,
-        horizentalLine: true,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
         xAxisLabel: true,
         yAxisLabel: true,
         labelBgColor: '#000000',
@@ -811,6 +827,7 @@ function settingCancel() {
   }
 
 
+
 </script>
 
 <style lang="scss" scoped>
@@ -1005,11 +1022,16 @@ page {
 
 .filter-panel {
   width: 100%;
-  position: absolute;
+  position: fixed;
   left: 0;
-  top: 270rpx;
+  top: 0;
+  bottom: 0;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999;
+  z-index: 9999;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  padding-top: 270rpx;
 
   .filter-panel-content {
     background-color: #ffffff;
@@ -1202,7 +1224,7 @@ page {
   border-radius: 16rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
   width: calc(100% - 48rpx);
-  height: 450rpx;
+  height: 500rpx;
   overflow: visible;
   position: relative;
 }
@@ -1296,19 +1318,18 @@ page {
   .info-row {
     display: flex;
     flex-wrap: wrap;
-    gap: 24rpx;
+    margin: 0 -12rpx;
-    margin-bottom: 0;
 
     .info-item {
-      flex: 0 0 calc(50% - 12rpx);
+      width: 50%;
+      padding: 0 12rpx;
+      box-sizing: border-box;
       display: flex;
       flex-direction: column;
-      gap: 4rpx;
+      margin-bottom: 20rpx;
-      min-width: 0;
-      margin-bottom: -5rpx;
       
       &.info-item-full {
-        flex: 0 0 100%;
+        width: 100%;
       }
 
       .info-label {
@@ -1319,6 +1340,7 @@ page {
         padding: 6rpx 12rpx;
         border-radius: 8rpx;
         align-self: flex-start;
+        margin-bottom: 8rpx;
       }
 
       .info-value {

src/pages/health/statistic/marStatistic/index.vue

@@ -365,6 +365,8 @@
       :chartData="chartData"
       :opts="lineChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -376,6 +378,8 @@
       :chartData="chartData"
       :opts="columnChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -488,7 +492,7 @@ const lineChartOpts = computed(() => {
     color: ['#667eea'],
     padding: [15, 15, 30, 5],
     enableScroll: false,
-    enableMarkLine: true,
+    enableMarkLine: false,
     dataLabel: false,
     dataPointShape: true,
     legend: {
@@ -531,6 +535,30 @@ const lineChartOpts = computed(() => {
         linearOpacity: 0.2,
         onShadow: true,
         animation: true
+      },
+      tooltip: {
+        showBox: true,
+        showArrow: true,
+        showCategory: false,
+        bgColor: '#000000',
+        bgOpacity: 0.7,
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#CCCCCC',
+        fontColor: '#FFFFFF',
+        fontSize: 11,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
+        xAxisLabel: true,
+        yAxisLabel: true,
+        labelBgColor: '#000000',
+        labelBgOpacity: 0.7,
+        labelFontColor: '#FFFFFF'
       }
     }
   }
@@ -583,6 +611,30 @@ const columnChartOpts = computed(() => {
         linearType: 'none',
         barBorderCircle: true,
         seriesGap: 2
+      },
+      tooltip: {
+        showBox: true,
+        showArrow: true,
+        showCategory: false,
+        bgColor: '#000000',
+        bgOpacity: 0.7,
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#CCCCCC',
+        fontColor: '#FFFFFF',
+        fontSize: 11,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
+        xAxisLabel: true,
+        yAxisLabel: true,
+        labelBgColor: '#000000',
+        labelBgOpacity: 0.7,
+        labelFontColor: '#FFFFFF'
       }
     }
   }
@@ -996,7 +1048,7 @@ page {
   left: 0;
   top: 270rpx;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999;
+  z-index: 9999;
 
   .filter-panel-content {
     background-color: #ffffff;
@@ -1169,7 +1221,7 @@ page {
   border-radius: 16rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
   width: calc(100% - 48rpx);
-  height: 480rpx;
+  height: 520rpx;
   overflow: visible;
   position: relative;
 }
@@ -1263,19 +1315,18 @@ page {
   .info-row {
     display: flex;
     flex-wrap: wrap;
-    gap: 24rpx;
+    margin: 0 -12rpx;
-    margin-bottom: 0;
 
     .info-item {
-      flex: 0 0 calc(50% - 12rpx);
+      width: 50%;
+      padding: 0 12rpx;
+      box-sizing: border-box;
       display: flex;
       flex-direction: column;
-      gap: 4rpx;
+      margin-bottom: 20rpx;
-      min-width: 0;
-      margin-bottom: -5rpx;
       
       &.info-item-full {
-        flex: 0 0 100%;
+        width: 100%;
       }
 
       .info-label {
@@ -1286,6 +1337,7 @@ page {
         padding: 6rpx 12rpx;
         border-radius: 8rpx;
         align-self: flex-start;
+        margin-bottom: 8rpx;
       }
 
       .info-value {

src/pages/health/statistic/milkPowderStatistic/index.vue

@@ -245,6 +245,8 @@
       :chartData="chartData"
       :opts="lineChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -256,6 +258,8 @@
       :chartData="chartData"
       :opts="columnChartOpts"
       :loadingType="1"
+      :ontouch="true"
+      :inScrollView="true"
     />
   </view>
   
@@ -325,7 +329,7 @@ const lineChartOpts = computed(() => {
     color: ['#667eea'],
     padding: [15, 15, 30, 5],
     enableScroll: false,
-    enableMarkLine: true,
+    enableMarkLine: false,
     dataLabel: false,
     dataPointShape: true,
     legend: {
@@ -372,15 +376,21 @@ const lineChartOpts = computed(() => {
       tooltip: {
         showBox: true,
         showArrow: true,
-        showCategory: true,
+        showCategory: false,
         bgColor: '#000000',
         bgOpacity: 0.7,
         gridType: 'dash',
         dashLength: 4,
         gridColor: '#CCCCCC',
         fontColor: '#FFFFFF',
-        splitLine: true,
+        fontSize: 11,
-        horizentalLine: true,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
         xAxisLabel: true,
         yAxisLabel: true,
         labelBgColor: '#000000',
@@ -442,15 +452,21 @@ const columnChartOpts = computed(() => {
       tooltip: {
         showBox: true,
         showArrow: true,
-        showCategory: true,
+        showCategory: false,
         bgColor: '#000000',
         bgOpacity: 0.7,
         gridType: 'dash',
         dashLength: 4,
         gridColor: '#CCCCCC',
         fontColor: '#FFFFFF',
-        splitLine: true,
+        fontSize: 11,
-        horizentalLine: true,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
         xAxisLabel: true,
         yAxisLabel: true,
         labelBgColor: '#000000',
@@ -890,7 +906,7 @@ page {
   border-radius: 16rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
   width: calc(100% - 48rpx);
-  height: 500rpx;
+  height: 600rpx;
   overflow: visible;
   position: relative;
 }
@@ -901,7 +917,7 @@ page {
   left: 0;
   top: 184rpx;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999;
+  z-index: 9999;
 
   .filter-panel-content {
     background-color: #ffffff;

src/pages/health/statistic/temperatureStatistic/index.vue

@@ -247,9 +247,11 @@
         :chartData="chartData"
         :opts="lineChartOpts"
         :loadingType="1"
+        :ontouch="true"
+        :inScrollView="true"
       />
     </view>
-    
+      
     <!-- 柱状图展示 -->
     <view class="chart-container" v-if="hasSecondListData && viewMode === 'column'">
       <qiun-data-charts 
@@ -258,6 +260,8 @@
         :chartData="chartData"
         :opts="columnChartOpts"
         :loadingType="1"
+        :ontouch="true"
+        :inScrollView="true"
       />
     </view>
     <!-- 列表展示 -->
@@ -368,7 +372,7 @@ const lineChartOpts = computed(() => {
     color: ['#667eea'],
     padding: [15, 15, 30, 5],
     enableScroll: false,
-    enableMarkLine: true,
+    enableMarkLine: false,
     dataLabel: false,
     dataPointShape: true,
     legend: {
@@ -412,6 +416,30 @@ const lineChartOpts = computed(() => {
         onShadow: true,
         animation: true
       },
+      tooltip: {
+        showBox: true,
+        showArrow: true,
+        showCategory: false,
+        bgColor: '#000000',
+        bgOpacity: 0.7,
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#CCCCCC',
+        fontColor: '#FFFFFF',
+        fontSize: 11,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
+        xAxisLabel: true,
+        yAxisLabel: true,
+        labelBgColor: '#000000',
+        labelBgOpacity: 0.7,
+        labelFontColor: '#FFFFFF'
+      },
       markLine: {
         type: 'dash',
         dashLength: 5,
@@ -495,6 +523,30 @@ const columnChartOpts = computed(() => {
         barBorderCircle: true,
         seriesGap: 2
       },
+      tooltip: {
+        showBox: true,
+        showArrow: true,
+        showCategory: false,
+        bgColor: '#000000',
+        bgOpacity: 0.7,
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#CCCCCC',
+        fontColor: '#FFFFFF',
+        fontSize: 11,
+        lineHeight: 16,
+        borderRadius: 4,
+        borderWidth: 0,
+        borderColor: '#000000',
+        padding: [8, 10, 8, 10],
+        splitLine: false,
+        horizentalLine: false,
+        xAxisLabel: true,
+        yAxisLabel: true,
+        labelBgColor: '#000000',
+        labelBgOpacity: 0.7,
+        labelFontColor: '#FFFFFF'
+      },
       markLine: {
         type: 'dash',
         dashLength: 5,
@@ -902,7 +954,7 @@ page {
   border-radius: 16rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
   width: calc(100% - 48rpx);
-  height: 500rpx;
+  height: 550rpx;
   overflow: visible;
   position: relative;
 }
@@ -1002,7 +1054,7 @@ page {
   left: 0;
   top: 270rpx;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999;
+  z-index: 9999;
 
   .filter-panel-content {
     background-color: #ffffff;