fix: 图表功能优化。
This commit is contained in:
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user