fix: 图表功能优化。

This commit is contained in:
tianyongbao
2026-01-19 00:01:37 +08:00
parent 2b60a33440
commit e0cdc4aebe

View File

@@ -324,11 +324,12 @@
<view @click="changeShow">{{ setTitle }}</view>
</nut-col> -->
</nut-row>
<view class="m_t_20" v-show="showChart">
<view class="loading" v-show="loading">
<view :style="{ position: 'relative', marginTop: '10px' }" v-show="showChart">
<view class="loading-container" v-show="loading">
<Loading />
</view>
<canvas
v-if="chartsDatas.length > 0"
class="charts"
type="2d"
:id="
@@ -345,11 +346,11 @@
height: chartConf.cHeight + 'px',
}"
></canvas>
<!-- <nut-empty description="暂无数据" v-show="chartsDatas.r.length == 0">
<nut-empty description="暂无数据" v-else>
<template #image>
<img :src="pond404" />
</template>
</nut-empty> -->
</nut-empty>
</view>
</nut-col>
</nut-row>
@@ -703,9 +704,7 @@ const paramsHistory = ref({
intervalType: 1, // 时间间隔类型1-1天, 2-3天, 3-7天
});
// 图表数据
const chartsDatas = ref<any>({
r: [],
});
const chartsDatas = ref<any>([]);
const uChartsOp = ref<any>({});
// 图表参数
const chartConf = reactive({
@@ -780,7 +779,7 @@ Taro.useDidShow(() => {
onMounted(() => {
const sysInfo = Taro.getSystemInfoSync();
let cWidth = (700 / 750) * sysInfo.screenWidth;
let cHeight = (165 / 750) * sysInfo.windowHeight;
let cHeight = (220 / 750) * sysInfo.windowHeight;
let pixelRatio = sysInfo.pixelRatio;
chartConf.cWidth = cWidth;
chartConf.cHeight = cHeight;
@@ -1141,7 +1140,7 @@ function drawCharts(type) {
console.log('📅 天数:', dayDev.value);
if (!data || data.length === 0) {
console.error(' 数据为空,无法绘制图表');
console.log('⚠️ 数据为空,绘制图表');
loading.value = false;
return;
}
@@ -1503,7 +1502,8 @@ function createCharts(x, series, ids) {
scrollAlign: "left",
labelCount: 7,
rotateLabel: true,
rotateAngle: 25,
rotateAngle: 30,
marginTop: 10,
},
yAxis: {
disableGrid: false,
@@ -2078,6 +2078,16 @@ defineExpose({
height: 330px;
width: 100%;
}
.loading-container {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
}
/** 底部弹出层 */
.rowPd {