update

src/components/TeamChartDay.vue

@@ -8,6 +8,7 @@ import setupFn from "./TeamChartDayOptions";
 const store = useWsStore();
 const chartChart = ref(null);
 const chart = ref(null);
+const showChartDom = ref(false);
 
 /** 无状态，处理数据 */
 function loadData(yieldArray) {
@@ -24,11 +25,12 @@ function loadData(yieldArray) {
   }
   return result;
 }
+
 function setupChart(chart, dom, data) {
-  if (chart) chart.dispose();
+  if (chart.value) chart.value.dispose();
   nextTick(() => {
-    chart = echarts.init(dom);
-    setupFn(chart, data);
+    chart.value = echarts.init(dom);
+    setupFn(chart.value, data);
   });
 }
 
@@ -36,10 +38,12 @@ function setupChart(chart, dom, data) {
 function __apply(yieldArray) {
   const d = loadData(yieldArray);
   if (!d) {
+    showChartDom.value = false;
     if (chart.value) chart.value.dispose();
     return;
   }
-  setupChart(chart.value, chartChart.value, d);
+  showChartDom.value = true;
+  setupChart(chart, chartChart.value, d);
 }
 
 // 订阅
@@ -57,11 +61,9 @@ onMounted(() => {
     <div
       ref="chartChart"
       class="chart-chart"
-      :style="{ opacity: dayData && dayData.length > 0 ? 1 : 0 }"
+      :style="{ opacity: showChartDom ? 1 : 0 }"
     ></div>
-    <p v-show="!chart" class="empty-data-hint">
-      暂无数据
-    </p>
+    <p v-show="!chart" class="empty-data-hint">暂无数据</p>
   </Container>
 </template>
 

src/components/TeamChartMonth.vue

@@ -11,7 +11,6 @@ const chart = ref(null);
 
 const monthData = ref(null);
 store.$subscribe((mutation, state) => {
-  console.log("[ChartMonth]  ===>  state: ", state.data2.monthlyTarget);
   if (
     state.data2.monthlyTarget == undefined ||
     state.data2.monthlyTarget?.length == 0
@@ -29,15 +28,12 @@ store.$subscribe((mutation, state) => {
   setupChart();
 });
 
-
-
 // 绿色：24FF5E
 // 黄色：FFB524
 // 红色：FF3737
 function setupChart() {
   if (chart.value) chart.value.dispose();
   nextTick(() => {
-    console.log("[ChartMonth]  ===>  初始化表格: ", monthData.value);
     chart.value = echarts.init(chartChart.value);
     setupFn(chart.value, monthData.value);
   });
@@ -50,7 +46,11 @@ onMounted(() => {
 
 <template>
   <Container class="chart" title="本月班组情况" icon="cube">
-    <div ref="chartChart" class="chart-chart" :style="{opacity: (monthData) ? 1 : 0}"></div>
+    <div
+      ref="chartChart"
+      class="chart-chart"
+      :style="{ opacity: monthData ? 1 : 0 }"
+    ></div>
     <p v-show="!monthData" class="empty-data-hint">暂无数据</p>
   </Container>
 </template>
@@ -60,7 +60,8 @@ onMounted(() => {
   height: 300px;
 }
 
-.chart-inner {}
+.chart-inner {
+}
 
 .chart-chart {
   height: 100%;

src/components/useTeamMonthData.js

@@ -0,0 +1,6 @@
+import { useWsStore } from "../store";
+import setupFn from "./TeamChartMonthOptions";
+
+export const useTeamMonthData = () => {
+
+}