fix: 功能显示优化。

This commit is contained in:
tianyongbao
2026-01-19 12:30:06 +08:00
parent 02f4f6ecd8
commit 0f4e12036d
3 changed files with 57 additions and 12 deletions

View File

@@ -60,6 +60,9 @@ let chartInstance: any = null;
// 接收的参数
const serialNum = ref('');
const dataType = ref(1); // 1-溶解氧, 2-水温, 3-饱和度, 4-PH, 5-盐度
const oxyWarnLower = ref<number | null>(null);
const tempWarnUpper = ref<number | null>(null);
const tempWarnLower = ref<number | null>(null);
// 屏幕尺寸
const screenWidth = ref(375);
@@ -105,6 +108,9 @@ onMounted(() => {
serialNum.value = params.serialNum || '';
dataType.value = Number(params.dataType) || 1;
dayType.value = Number(params.dayType) || 1;
oxyWarnLower.value = params.oxyWarnLower ? Number(params.oxyWarnLower) : null;
tempWarnUpper.value = params.tempWarnUpper ? Number(params.tempWarnUpper) : null;
tempWarnLower.value = params.tempWarnLower ? Number(params.tempWarnLower) : null;
// 设置标题
const titles = ['', '溶解氧曲线图', '水温曲线图', '饱和度曲线图', 'PH曲线图', '盐度曲线图'];
@@ -221,6 +227,34 @@ function drawChart() {
const xAxisData: string[] = [];
const seriesData: number[] = [];
let series: any[] = [];
// 根据数据类型添加告警线
if (dataType.value === 1 && oxyWarnLower.value) {
series.push({
name: '告警下限',
data: [],
color: '#c12e34',
lineType: 'dash',
});
} else if (dataType.value === 2) {
if (tempWarnLower.value) {
series.push({
name: '告警下限',
data: [],
color: '#c12e34',
lineType: 'dash',
});
}
if (tempWarnUpper.value) {
series.push({
name: '告警上限',
data: [],
color: '#e098c7',
lineType: 'dash',
});
}
}
chartData.value.forEach((item: any) => {
const timeStr = item.time || item.createTime || '';
@@ -238,8 +272,25 @@ function drawChart() {
}
const value = item[fieldName];
seriesData.push(value !== null && value !== undefined ? Number(value) : 0);
// 填充告警线数据
if (dataType.value === 1 && oxyWarnLower.value) {
series[0].data.push(oxyWarnLower.value);
} else if (dataType.value === 2) {
let idx = 0;
if (tempWarnLower.value) {
series[idx].data.push(tempWarnLower.value);
idx++;
}
if (tempWarnUpper.value) {
series[idx].data.push(tempWarnUpper.value);
}
}
});
// 添加主数据系列
series.unshift({ name: seriesName, data: seriesData });
Taro.nextTick(() => {
const env = Taro.getEnv();
@@ -258,7 +309,7 @@ function drawChart() {
width: cWidth,
height: cHeight,
categories: xAxisData,
series: [{ name: seriesName, data: seriesData }],
series: series,
pixelRatio: 1,
dataPointShape: false,
animation: true,
@@ -310,7 +361,7 @@ function drawChart() {
width: cWidth * pixelRatio,
height: cHeight * pixelRatio,
categories: xAxisData,
series: [{ name: seriesName, data: seriesData }],
series: series,
pixelRatio: pixelRatio,
dataPointShape: false,
animation: true,
@@ -350,6 +401,7 @@ function drawChart() {
<style lang="scss">
.chart-fullscreen-page {
background: #fff;
overflow: hidden;
}
.header {

View File

@@ -343,9 +343,7 @@
@touchmove="moveCandle"
:style="{
width: chartConf.cWidth + 'px',
height: chartConf.cHeight + 'px',
position: (visControl || alertShow) ? 'absolute' : 'relative',
left: (visControl || alertShow) ? '-9999px' : '0'
height: chartConf.cHeight + 'px'
}"
></canvas>
<nut-empty description="暂无数据" v-else>
@@ -726,11 +724,7 @@ const props = defineProps({
required: true,
default: 1,
},
// 公告弹窗是否打开
noticeOpen: {
type: Boolean,
default: false,
},
});
const pondDeviceRes = ref<any>();
const emit = defineEmits(["getPondInfo", "getRes", "render", "addDevice"]);
@@ -965,7 +959,7 @@ function fullscreenChart() {
// 跳转到全屏图表页面
Taro.navigateTo({
url: `/components/other/chartFullscreen?serialNum=${serialNum}&dataType=${prDev.value}&dayType=${dayDev.value}`
url: `/components/other/chartFullscreen?serialNum=${serialNum}&dataType=${prDev.value}&dayType=${dayDev.value}&oxyWarnLower=${oxyWarnLower.value || ''}&tempWarnUpper=${tempWarnUpper.value || ''}&tempWarnLower=${tempWarnLower.value || ''}`
});
}

View File

@@ -307,7 +307,6 @@
@addDevice="addDevice"
ref="pondChildInfo"
type="1"
:noticeOpen="noticeOpen"
/>
</nut-col>
</nut-row>