From 632b5b6f6d9bd9896d8f51ea51f3cff7a1eda32f Mon Sep 17 00:00:00 2001
From: claw_bot <claw@jb18cm.plus>
Date: Sun, 15 Mar 2026 07:07:36 +0000
Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=94=B9=E7=94=A8=20uni=5Fmodules?=
 =?UTF-8?q?=20=E6=96=B9=E5=BC=8F=E5=BC=95=E5=85=A5=20qiun-data-charts?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 移除 npm @qiun/ucharts 依赖
- 改用 qiun-data-charts 组件（需从插件市场安装）
- 恢复 computed chartData 和 ref chartOpts 配置
---
 package-lock.json       |   7 ---
 package.json            |   1 -
 pages/detail/detail.vue | 125 +++++++++++++++++-----------------------
 3 files changed, 52 insertions(+), 81 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 3946601..a9f9f73 100755
--- a/package-lock.json
+++ b/package-lock.json
@@ -5,16 +5,9 @@
   "packages": {
     "": {
       "dependencies": {
-        "@qiun/ucharts": "^2.5.0-20230101",
         "uview-plus": "^3.7.13"
       }
     },
-    "node_modules/@qiun/ucharts": {
-      "version": "2.5.0-20230101",
-      "resolved": "https://registry.npmjs.org/@qiun/ucharts/-/ucharts-2.5.0-20230101.tgz",
-      "integrity": "sha512-C7ccBgfPuGF6dxTRuMW0NPPMSCf1k/kh3I9zkRVBc5PaivudX/rPL+jd2Wty6gn5ya5L3Ob+YmYe09V5xw66Cw==",
-      "license": "Apache"
-    },
     "node_modules/uview-plus": {
       "version": "3.7.13",
       "resolved": "https://registry.npmjs.org/uview-plus/-/uview-plus-3.7.13.tgz",
diff --git a/package.json b/package.json
index 85cfe1d..ef03121 100755
--- a/package.json
+++ b/package.json
@@ -1,6 +1,5 @@
 {
   "dependencies": {
-    "@qiun/ucharts": "^2.5.0-20230101",
     "uview-plus": "^3.7.13"
   }
 }
diff --git a/pages/detail/detail.vue b/pages/detail/detail.vue
index 7976fc3..a02b780 100755
--- a/pages/detail/detail.vue
+++ b/pages/detail/detail.vue
@@ -81,12 +81,13 @@
         
         <!-- 收益曲线 -->
         <view v-else class="nav-chart-wrapper">
-          <canvas 
-            canvas-id="navChartCanvas"
-            id="navChartCanvas"
-            class="nav-canvas"
-            type="2d"
-          ></canvas>
+          <qiun-data-charts 
+            type="line"
+            :opts="chartOpts"
+            :chartData="chartData"
+            :canvas2d="true"
+            canvasId="navChartCanvas"
+          />
         </view>
         
         <!-- 统计指标 -->
@@ -433,11 +434,8 @@
 </template>
 
 <script setup>
-import { ref, onMounted, getCurrentInstance, computed, nextTick } from 'vue';
+import { ref, onMounted, getCurrentInstance, computed } from 'vue';
 import { api } from '../../utils/api';
-import uCharts from '@qiun/ucharts/u-charts.js';
-
-let chartInstance = null;
 
 // 获取 u-toast 实例
 const { proxy } = getCurrentInstance();
@@ -485,60 +483,51 @@ const navPeriod = ref('30d');
 const navHistory = ref([]);
 const navStatistics = ref(null);
 
-// 绘制图表
-const drawChart = () => {
-  if (!navHistory.value || navHistory.value.length === 0) return;
+// 图表数据
+const chartData = computed(() => {
+  if (!navHistory.value || navHistory.value.length === 0) {
+    return { categories: [], series: [] };
+  }
   
-  nextTick(() => {
-    const data = navHistory.value;
-    
-    const chartData = {
-      categories: data.map(item => item.date.split('-').slice(1).join('/')),
-      series: [{
-        name: '净值',
-        data: data.map(item => item.nav)
-      }]
-    };
-    
-    chartInstance = new uCharts({
-      type: 'line',
-      canvas: uni.createCanvasContext('navChartCanvas'),
-      width: uni.upx2px(640),
-      height: uni.upx2px(400),
-      pixelRatio: 1,
-      categories: chartData.categories,
-      series: chartData.series,
-      animation: true,
-      color: ['#064E3B'],
-      padding: [15, 15, 0, 15],
-      enableScroll: false,
-      legend: {
-        show: false
-      },
-      xAxis: {
-        disableGrid: true,
-        axisLine: false,
-        fontSize: 10,
-        fontColor: '#6B7280'
-      },
-      yAxis: {
-        data: [{ min: 0 }],
-        gridColor: '#E5E7EB',
-        gridType: 'dash',
-        dashLength: 4,
-        fontSize: 10,
-        fontColor: '#6B7280'
-      },
-      extra: {
-        line: {
-          type: 'curve',
-          width: 2,
-          activeType: 'hollow'
-        }
-      }
-    });
-  });
-};
+  return {
+    categories: navHistory.value.map(item => item.date.split('-').slice(1).join('/')),
+    series: [{
+      name: '净值',
+      data: navHistory.value.map(item => item.nav)
+    }]
+  };
+});
+
+// 图表配置
+const chartOpts = ref({
+  color: ['#064E3B'],
+  padding: [15, 15, 0, 15],
+  enableScroll: false,
+  legend: {
+    show: false
+  },
+  xAxis: {
+    disableGrid: true,
+    axisLine: false,
+    fontSize: 10,
+    fontColor: '#6B7280'
+  },
+  yAxis: {
+    data: [{ min: 0 }],
+    gridColor: '#E5E7EB',
+    gridType: 'dash',
+    dashLength: 4,
+    fontSize: 10,
+    fontColor: '#6B7280'
+  },
+  extra: {
+    line: {
+      type: 'curve',
+      width: 2,
+      activeType: 'hollow'
+    }
+  }
+});
 
 // 交易表单
 const showTransactionForm = ref(false);
@@ -708,11 +697,6 @@ const fetchNavHistory = async () => {
     if (response.code === 200 && response.data) {
       navHistory.value = response.data.navHistory || [];
       navStatistics.value = response.data.statistics || null;
-      
-      // 绘制图表
-      if (navHistory.value.length > 0) {
-        drawChart();
-      }
     }
   } catch (error) {
     console.error('获取净值历史失败:', error);
@@ -1309,11 +1293,6 @@ const deletePortfolio = async () => {
   height: 400rpx;
 }
 
-.nav-canvas {
-  width: 640rpx;
-  height: 400rpx;
-}
-
 .period-tabs {
   display: flex;
   gap: 16rpx;