From 31bb5fe0278d2f8132c535f8129354bfad56b7b1 Mon Sep 17 00:00:00 2001
From: dengzedong <dengzedong@email>
Date: 星期三, 06 十一月 2024 11:25:24 +0800
Subject: [PATCH] 代码生成loading
---
src/views/data/point/DaPointChart.vue | 128 +++++++++++++++---------------------------
1 files changed, 46 insertions(+), 82 deletions(-)
diff --git a/src/views/data/point/DaPointChart.vue b/src/views/data/point/DaPointChart.vue
index fabc2f6..305e0e7 100644
--- a/src/views/data/point/DaPointChart.vue
+++ b/src/views/data/point/DaPointChart.vue
@@ -10,21 +10,21 @@
:model="dataForm"
@keydown.enter="getDataList()"
>
- <el-form-item>
+ <el-form-item label="开始时间">
<el-date-picker
+ size="mini"
v-model="dataForm.startTime"
type="datetime"
- value-format="yyyy-MM-dd HH:mm:ss"
- placeholder="选择日期时间"
- />
+ :clearable="false"
+ placeholder="选择日期时间"/>
</el-form-item>
- <el-form-item>
+ <el-form-item label="结束时间">
<el-date-picker
+ size="mini"
v-model="dataForm.endTime"
type="datetime"
- value-format="yyyy-MM-dd HH:mm:ss"
- placeholder="选择日期时间"
- />
+ :clearable="false"
+ placeholder="选择日期时间"/>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">查询</el-button>
@@ -49,67 +49,39 @@
import {ref} from 'vue';
import * as echarts from 'echarts';
import * as DaPoint from '@/api/data/da/point/daPointChart'
+ import {getYMDHMS} from "@/utils/dateUtil"
import download from "@/utils/download";
const message = useMessage() // 消息弹窗
const visible = ref(false);
const chartDom = ref(null);
let myChart = null;
+ const queryParams = reactive({
+ codes: [],
+ startDate: undefined,
+ endDate: undefined,
+ })
+ const chartParams = reactive({
+ pointNos:[],
+ start : undefined,
+ end : undefined,
+ })
const dataForm = ref({
id: "",
pointNo: "",
pointName: "",
pointTypeName: "",
- startTime: getYMDHMS(),
- endTime: undefined,
+ startTime: getYMDHMS(new Date() - 1000 * 60 * 60),
+ endTime: getYMDHMS(new Date()),
});
- const queryParams = reactive({
- pointNo: "",
- start: undefined,
- end: undefined,
- })
- function getYMDHMS() {
- let timestamp = new Date().getTime();
- let time = new Date(timestamp - 1000 * 60 * 30);
- let year = time.getFullYear();
- let month = (time.getMonth() + 1).toString();
- let date = time.getDate().toString();
- let hours = time.getHours().toString();
- let minute = time.getMinutes().toString();
- if (month < 10) {
- month = "0" + month;
- }
- if (date < 10) {
- date = "0" + date;
- }
- if (hours < 10) {
- hours = "0" + hours;
- }
- if (minute < 10) {
- minute = "0" + minute;
- }
- return (
- year +
- "-" +
- month +
- "-" +
- date +
- " " +
- hours +
- ":" +
- minute +
- ":" +
- "00"
- );
- }
/** 打开弹窗 */
const open = async (row: object) => {
visible.value = true
dataForm.value.id = row.id;
dataForm.value.pointNo = row.pointNo;
dataForm.value.pointName = row.pointName;
- dataForm.value.startTime = getYMDHMS();
- dataForm.value.endTime = "";
+ dataForm.value.startTime = getYMDHMS(new Date(this.dataForm.startTime) - 1000 * 60 * 60);
+ dataForm.value.endTime = getYMDHMS(new Date(this.dataForm.endTime) - 1000 * 60 * 60),
getDataList();
}
@@ -119,34 +91,27 @@
visible.value = true;
if (dataForm.value.id) {
try {
- queryParams.pointNo=dataForm.value.pointNo;
- queryParams.start = dataForm.value.startTime;
- queryParams.end = dataForm.value.endTime;
+ queryParams.codes=[dataForm.value.pointNo];
+ queryParams.startDate = getYMDHMS(new Date(this.dataForm.startTime) - 1000 * 60 * 60);
+ queryParams.endDate = getYMDHMS(new Date(this.dataForm.endTime) - 1000 * 60 * 60);
const data = await DaPoint.getPointDaChart(queryParams)
- const dataList = [];
- const xAxisData = [];
- data[dataForm.value.pointNo].forEach(function (value) {
- // 判断数据是否为布尔型
- if (typeof value["value"] === "boolean") {
- value["value"] = value["value"]? 1 : 0;
- }
- dataList.push([value["time"], value["value"]]);
- xAxisData.push(value["time"]);
- });
- let seriesData = [];
- seriesData.push({
- name: "采集值",
- type: "line",
- data: dataList,
- showSymbol: false,
- smooth: false,
- lineStyle: {
- normal: {
- color: "#5B8FF9",
- width: 1,
+ let seriesData = []
+ data.series.forEach(item => {
+ seriesData.push({
+ name: item.name,
+ type: "line",
+ data: item.data,
+ showSymbol: true,
+ smooth: false,
+ lineStyle: {
+ normal: {
+ color: "#5B8FF9",
+ width: 1,
+ },
},
- },
- });
+ });
+ })
+
myChart = echarts.init(chartDom.value);
const option = {
title: {
@@ -182,7 +147,7 @@
xAxis: {
type: "category",
boundaryGap: false,
- data: xAxisData,
+ data: data.categories,
},
yAxis: {
type: "value",
@@ -194,7 +159,6 @@
],
series: seriesData,
};
- myChart.clear();
myChart.setOption(option);
} catch (error) {
console.error(error)
@@ -204,9 +168,9 @@
/** 导出按钮操作 */
const exportLoading = ref(false)
const handleExport = async () => {
- queryParams.pointNos=[dataForm.value.pointNo];
- queryParams.start = dataForm.value.startTime;
- queryParams.end = dataForm.value.endTime;
+ chartParams.pointNos=[dataForm.value.pointNo];
+ chartParams.start = dataForm.value.startTime;
+ chartParams.end = dataForm.value.endTime;
try {
// 导出的二次确认
await message.exportConfirm()
--
Gitblit v1.9.3