update
This commit is contained in:
parent
22f4b99ab1
commit
2a6cb3fe87
@ -8,6 +8,7 @@ import setupFn from "./TeamChartDayOptions";
|
|||||||
const store = useWsStore();
|
const store = useWsStore();
|
||||||
const chartChart = ref(null);
|
const chartChart = ref(null);
|
||||||
const chart = ref(null);
|
const chart = ref(null);
|
||||||
|
const showChartDom = ref(false);
|
||||||
|
|
||||||
/** 无状态,处理数据 */
|
/** 无状态,处理数据 */
|
||||||
function loadData(yieldArray) {
|
function loadData(yieldArray) {
|
||||||
@ -24,11 +25,12 @@ function loadData(yieldArray) {
|
|||||||
}
|
}
|
||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
|
|
||||||
function setupChart(chart, dom, data) {
|
function setupChart(chart, dom, data) {
|
||||||
if (chart) chart.dispose();
|
if (chart.value) chart.value.dispose();
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
chart = echarts.init(dom);
|
chart.value = echarts.init(dom);
|
||||||
setupFn(chart, data);
|
setupFn(chart.value, data);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -36,10 +38,12 @@ function setupChart(chart, dom, data) {
|
|||||||
function __apply(yieldArray) {
|
function __apply(yieldArray) {
|
||||||
const d = loadData(yieldArray);
|
const d = loadData(yieldArray);
|
||||||
if (!d) {
|
if (!d) {
|
||||||
|
showChartDom.value = false;
|
||||||
if (chart.value) chart.value.dispose();
|
if (chart.value) chart.value.dispose();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setupChart(chart.value, chartChart.value, d);
|
showChartDom.value = true;
|
||||||
|
setupChart(chart, chartChart.value, d);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 订阅
|
// 订阅
|
||||||
@ -57,11 +61,9 @@ onMounted(() => {
|
|||||||
<div
|
<div
|
||||||
ref="chartChart"
|
ref="chartChart"
|
||||||
class="chart-chart"
|
class="chart-chart"
|
||||||
:style="{ opacity: dayData && dayData.length > 0 ? 1 : 0 }"
|
:style="{ opacity: showChartDom ? 1 : 0 }"
|
||||||
></div>
|
></div>
|
||||||
<p v-show="!chart" class="empty-data-hint">
|
<p v-show="!chart" class="empty-data-hint">暂无数据</p>
|
||||||
暂无数据
|
|
||||||
</p>
|
|
||||||
</Container>
|
</Container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -11,7 +11,6 @@ const chart = ref(null);
|
|||||||
|
|
||||||
const monthData = ref(null);
|
const monthData = ref(null);
|
||||||
store.$subscribe((mutation, state) => {
|
store.$subscribe((mutation, state) => {
|
||||||
console.log("[ChartMonth] ===> state: ", state.data2.monthlyTarget);
|
|
||||||
if (
|
if (
|
||||||
state.data2.monthlyTarget == undefined ||
|
state.data2.monthlyTarget == undefined ||
|
||||||
state.data2.monthlyTarget?.length == 0
|
state.data2.monthlyTarget?.length == 0
|
||||||
@ -29,15 +28,12 @@ store.$subscribe((mutation, state) => {
|
|||||||
setupChart();
|
setupChart();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 绿色:24FF5E
|
// 绿色:24FF5E
|
||||||
// 黄色:FFB524
|
// 黄色:FFB524
|
||||||
// 红色:FF3737
|
// 红色:FF3737
|
||||||
function setupChart() {
|
function setupChart() {
|
||||||
if (chart.value) chart.value.dispose();
|
if (chart.value) chart.value.dispose();
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
console.log("[ChartMonth] ===> 初始化表格: ", monthData.value);
|
|
||||||
chart.value = echarts.init(chartChart.value);
|
chart.value = echarts.init(chartChart.value);
|
||||||
setupFn(chart.value, monthData.value);
|
setupFn(chart.value, monthData.value);
|
||||||
});
|
});
|
||||||
@ -50,7 +46,11 @@ onMounted(() => {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<Container class="chart" title="本月班组情况" icon="cube">
|
<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>
|
<p v-show="!monthData" class="empty-data-hint">暂无数据</p>
|
||||||
</Container>
|
</Container>
|
||||||
</template>
|
</template>
|
||||||
@ -60,7 +60,8 @@ onMounted(() => {
|
|||||||
height: 300px;
|
height: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chart-inner {}
|
.chart-inner {
|
||||||
|
}
|
||||||
|
|
||||||
.chart-chart {
|
.chart-chart {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
6
src/components/useTeamMonthData.js
Normal file
6
src/components/useTeamMonthData.js
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
import { useWsStore } from "../store";
|
||||||
|
import setupFn from "./TeamChartMonthOptions";
|
||||||
|
|
||||||
|
export const useTeamMonthData = () => {
|
||||||
|
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user