feat(图表组件): 替换原生canvas为qiun-data-charts实现折线图

- 使用qiun-data-charts组件替代原生canvas实现图表功能
- 新增opts配置项和updateChartsData方法处理图表数据
- 移除不必要的overflow样式和原生canvas事件处理

pages/cbd/components/pestEchart.vue

@@ -33,7 +33,7 @@
 
       <!-- 图表区域 -->
       <view class="chart-container">
-        <canvas
+        <!-- <canvas
           canvas-id="pestChart"
           id="pestChart"
           class="charts"
@@ -42,7 +42,8 @@
           @touchmove="moveChart($event)"
           @touchend="touchEndChart($event)"
           disable-scroll=true
-        ></canvas>
+        ></canvas> -->
+        <qiun-data-charts type="line" :chartData="chartData" :opts="opts" :canvas2d="true" :inScrollView="true" :ontouch="true" />
       </view>
     </view>
   </view>
@@ -94,6 +95,30 @@ export default {
       cWidth: 650,
       cHeight: 400,
       pixelRatio: 1,
+      opts: {
+        type: 'line',
+        xAxis: {
+          disableGrid: true,
+          itemCount: 4,
+          scrollShow: true
+        },
+        yAxis: {
+          disableGrid: true,
+          data: [
+            {
+              min: 0
+            }
+          ]
+        },
+        extra: {
+          line: {
+            type: 'curve'
+          }
+        },
+        legend: {
+        },
+        enableScroll: true
+      },
     };
   },
   watch:{
@@ -180,7 +205,7 @@ export default {
     initChart() {
       this.$nextTick(() => {
         setTimeout(() => {
-          this.drawChart(0);
+          this.updateChartsData(0);
         }, 100);
       });
     },
@@ -264,8 +289,24 @@ export default {
       this.getPestNameDetail(name);
       this.setChartData();
       this.$nextTick(() => {
-        this.drawChart(index);
+        this.updateChartsData(index);
       });
+    },
+    updateChartsData(index){
+      const dayData = this.day || [];
+      this.dayData = dayData;
+      const pestData = this.pest[index];
+      const lineData = {
+        categories: dayData,
+        series: [
+          {
+            name: '',
+            data: pestData
+          }
+        ]
+      };
+      
+      this.chartData = lineData;
     }
   }
 };
@@ -273,7 +314,6 @@ export default {
 
 <style lang="scss" scoped>
 .pest-echart {
-  overflow: hidden;
   margin-top: 24rpx;
   &__header{
     margin-bottom: 24rpx;
@@ -356,7 +396,6 @@ export default {
   width: 100%;
   height: 400rpx;
   border-radius: 12rpx;
-  overflow: hidden;
 }
 
 .charts {