1

src/components/Chart/RateChart.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, onMounted, ref, watch } from "vue";
+import { computed, nextTick, onMounted, ref, watch } from "vue";
 import * as echarts from "echarts";
 import getOptions from "./rateOption";
 
@@ -33,14 +33,14 @@ watch(
 );
 
 const rate = computed(() => {
-  if (!props.rawData.nowYield || props.rawData.nowYield == 0) return [0, 0];
+  if (!props.rawData?.nowYield || props.rawData.nowYield == 0) return [0, 0];
   // const _rate = ((props.rawData.nowYield / props.rawData.targetYield) * 100)
   //   .toFixed(2)
   //   .toString();
   // return [parseInt(_rate), _rate.split(".")[1]];
   return [
     parseInt(props.rawData.nowYield),
-    (props.rawData.nowYield + "").split(".")[1],
+    ((props.rawData.nowYield + "").split(".")[1] ?? "").padStart(2, "0"),
   ];
 });
 
@@ -55,7 +55,9 @@ function reInitChart() {
 }
 
 onMounted(() => {
+  nextTick(() => {
     reInitChart();
+  });
 });
 </script>
 
@@ -63,10 +65,7 @@ onMounted(() => {
   <div class="chart rate-chart">
     <div ref="rateChartRef" class="chart-container"></div>
 
-    <div
+    <div :class="['fake-chart-title', isOnlyChild ? 'is-only-child' : '']">
-      v-if="!displayPlaceholder"
-      :class="['fake-chart-title', isOnlyChild ? 'is-only-child' : '']"
-    >
       <span class="integer-part">{{ rate[0] }}.</span>
       <span class="decimal-part">{{ rate[1] }}%</span>
     </div>
@@ -104,11 +103,11 @@ onMounted(() => {
   user-select: none;
   position: absolute;
   top: 30%;
-  left: 32%;
+  left: 36%;
 }
 
 .fake-chart-title.is-only-child {
-  left: 42%;
+  left: 36%;
 }
 
 .fake-chart-title > .integer-part {

src/components/Chart/YieldChart.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, ref } from "vue";
+import { nextTick, onMounted, ref } from "vue";
 import * as echarts from "echarts";
 import getOptions from "./yieldOption";
 
@@ -33,7 +33,9 @@ function reInitChart() {
 }
 
 onMounted(() => {
+  nextTick(() => {
     reInitChart();
+  });
 });
 </script>
 

src/components/datapage/LineToday.vue

@@ -15,9 +15,9 @@ onMounted(() => {
   // websocketData.value = loadData([
   //   {
   //     targetProduction: 120,
-  //     nowProduction: 10,
+  //     nowProduction: 0,
-  //     targetYield: 10.34,
+  //     targetYield: 0,
-  //     nowYield: 3.11,
+  //     nowYield: 10,
   //   },
   // ]);
   websocketData.value = loadData(store.data2.dailyTarget);