|
@@ -21,9 +21,8 @@
|
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD HH:mm"
|
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD HH:mm"
|
|
:format="value1 ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm'"
|
|
:format="value1 ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm'"
|
|
:type="value1 ? 'daterange' : 'datetimerange'" range-separator="-" start-placeholder="开始时间"
|
|
:type="value1 ? 'daterange' : 'datetimerange'" range-separator="-" start-placeholder="开始时间"
|
|
- end-placeholder="结束时间" :disabled-date="disabledDate"
|
|
|
|
- :disabled-minutes="disabledMinutes" @focus="handleFocus" @calendar-change="handleChange"
|
|
|
|
- @change="handleDateChange"
|
|
|
|
|
|
+ end-placeholder="结束时间" :disabled-date="disabledDate" @focus="handleFocus"
|
|
|
|
+ @calendar-change="handleChange" @change="handleDateChange"
|
|
:default-time="[new Date(2000, 1, 1, 0, 0), new Date(2000, 1, 1, new Date().getHours(), 0)]"
|
|
:default-time="[new Date(2000, 1, 1, 0, 0), new Date(2000, 1, 1, new Date().getHours(), 0)]"
|
|
style="width: 300px;"></el-date-picker>
|
|
style="width: 300px;"></el-date-picker>
|
|
</div>
|
|
</div>
|
|
@@ -31,7 +30,7 @@
|
|
<el-form-item>
|
|
<el-form-item>
|
|
<div>
|
|
<div>
|
|
<el-button type="primary" @click="getHistoryList">查询</el-button>
|
|
<el-button type="primary" @click="getHistoryList">查询</el-button>
|
|
- <el-button plain @click="resetForm(formRef)">重置</el-button>
|
|
|
|
|
|
+ <el-button plain @click="resetForm">重置</el-button>
|
|
</div>
|
|
</div>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-form>
|
|
@@ -58,40 +57,22 @@ import * as echarts from 'echarts';
|
|
import { useRouter } from "vue-router";
|
|
import { useRouter } from "vue-router";
|
|
import { ElMessage } from "element-plus";
|
|
import { ElMessage } from "element-plus";
|
|
import { useGlobalStore } from "@/stores/modules/global";
|
|
import { useGlobalStore } from "@/stores/modules/global";
|
|
-import { ref, computed, onMounted, reactive, watch, onDeactivated, onActivated } from "vue";
|
|
|
|
|
|
+import { ref, computed, onMounted, reactive, watch, onDeactivated, onActivated, nextTick } from "vue";
|
|
import { getDataItemList, getPlatformList, getRgDataList, getTacRecordList } from "@/api/modules/allData";
|
|
import { getDataItemList, getPlatformList, getRgDataList, getTacRecordList } from "@/api/modules/allData";
|
|
import { Platform } from "@/api/interface";
|
|
import { Platform } from "@/api/interface";
|
|
import { parseTime } from '@/utils/index';
|
|
import { parseTime } from '@/utils/index';
|
|
import { isToday, isWithinThirtyMinutes, getTimeStamp, getStamp, isDateFuture, isDateRangeWithinDays } from "@/utils/dateTime";
|
|
import { isToday, isWithinThirtyMinutes, getTimeStamp, getStamp, isDateFuture, isDateRangeWithinDays } from "@/utils/dateTime";
|
|
import { ElLoading } from "element-plus";
|
|
import { ElLoading } from "element-plus";
|
|
-import {useUserStore} from "@/stores/modules/user";
|
|
|
|
-
|
|
|
|
-/* 全局请求 loading */
|
|
|
|
-const loading = ref()
|
|
|
|
-
|
|
|
|
-/**
|
|
|
|
- * @description 开启 Loading
|
|
|
|
- * */
|
|
|
|
-const startFullLoading = () => {
|
|
|
|
- loading.value = ElLoading.service({
|
|
|
|
- fullscreen: true,
|
|
|
|
- lock: true,
|
|
|
|
- text: "Loading",
|
|
|
|
- background: "rgba(0, 0, 0, 0.7)"
|
|
|
|
- });
|
|
|
|
-};
|
|
|
|
|
|
+import { useUserStore } from "@/stores/modules/user";
|
|
|
|
+
|
|
|
|
|
|
-/**
|
|
|
|
- * @description 结束 Loading
|
|
|
|
- * */
|
|
|
|
-const endFullLoading = () => {
|
|
|
|
- loading.value.close();
|
|
|
|
-};
|
|
|
|
const value1 = ref(true)
|
|
const value1 = ref(true)
|
|
-const dateRange = ref<[any, any]>([parseTime(new Date(), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}:{i}')]);
|
|
|
|
|
|
+const dateRange = ref<[any, any]>([parseTime(getTimeStamp(5), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00']);
|
|
const changetype = (e) => {
|
|
const changetype = (e) => {
|
|
if (!e) {
|
|
if (!e) {
|
|
dateRange.value = [parseTime(getTimeStamp(1), '{y}-{m}-{d} {h}:{i}'), parseTime(new Date(), '{y}-{m}-{d} {h}:{i}')]
|
|
dateRange.value = [parseTime(getTimeStamp(1), '{y}-{m}-{d} {h}:{i}'), parseTime(new Date(), '{y}-{m}-{d} {h}:{i}')]
|
|
|
|
+ } else {
|
|
|
|
+ dateRange.value = [parseTime(getTimeStamp(5), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00'];
|
|
}
|
|
}
|
|
getHistoryList()
|
|
getHistoryList()
|
|
}
|
|
}
|
|
@@ -105,33 +86,33 @@ const handleDateRangeChange = (newVal) => {
|
|
const startZeroed = new Date(startDate);
|
|
const startZeroed = new Date(startDate);
|
|
startZeroed.setHours(0, 0, 0, 0);
|
|
startZeroed.setHours(0, 0, 0, 0);
|
|
dateRange.value = [parseTime(new Date(startZeroed)), parseTime(new Date(roundedEndDate))];
|
|
dateRange.value = [parseTime(new Date(startZeroed)), parseTime(new Date(roundedEndDate))];
|
|
- console.log(dateRange.value, '今天');
|
|
|
|
|
|
+
|
|
} else {
|
|
} else {
|
|
const noTodayStart = new Date(startDate).setMinutes(0, 0, 0);
|
|
const noTodayStart = new Date(startDate).setMinutes(0, 0, 0);
|
|
const noTodayEnd = new Date(endDate).setHours(23, 0, 0, 0);
|
|
const noTodayEnd = new Date(endDate).setHours(23, 0, 0, 0);
|
|
dateRange.value = [parseTime(new Date(noTodayStart)), parseTime(new Date(noTodayEnd))];
|
|
dateRange.value = [parseTime(new Date(noTodayStart)), parseTime(new Date(noTodayEnd))];
|
|
- console.log(dateRange.value, '不是今天');
|
|
|
|
|
|
+
|
|
}
|
|
}
|
|
};
|
|
};
|
|
const handleDateChange = async (e) => {
|
|
const handleDateChange = async (e) => {
|
|
- if (isDateFuture(e[0]) ||isDateFuture(e[1])) {
|
|
|
|
|
|
+ if (isDateFuture(e[0]) || isDateFuture(e[1])) {
|
|
ElMessage.error("不得选择未来的时间");
|
|
ElMessage.error("不得选择未来的时间");
|
|
} else {
|
|
} else {
|
|
if (!value1.value) {
|
|
if (!value1.value) {
|
|
- if (isWithinThirtyMinutes(e[0], e[1])) {
|
|
|
|
|
|
+ // if (isWithinThirtyMinutes(e[0], e[1])) {
|
|
// 获取参数
|
|
// 获取参数
|
|
getHistoryList()
|
|
getHistoryList()
|
|
|
|
|
|
|
|
+ // } else {
|
|
|
|
+ // ElMessage.error("分钟模式下时间间隔不能大于3小时");
|
|
|
|
+ // }
|
|
} else {
|
|
} else {
|
|
- ElMessage.error("分钟模式下时间间隔不能大于3小时");
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- if (isDateRangeWithinDays(e[0], e[1], 7)) {
|
|
|
|
- await handleDateRangeChange(e)
|
|
|
|
- getHistoryList()
|
|
|
|
- } else {
|
|
|
|
- ElMessage.error("正点模式下时间间隔不能大于7天");
|
|
|
|
- }
|
|
|
|
|
|
+ // if (isDateRangeWithinDays(e[0], e[1], 7)) {
|
|
|
|
+ await handleDateRangeChange(e)
|
|
|
|
+ getHistoryList()
|
|
|
|
+ // } else {
|
|
|
|
+ // ElMessage.error("正点模式下时间间隔不能大于7天");
|
|
|
|
+ // }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -150,25 +131,6 @@ const handleChange = (val: Date[]) => {
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
-const disabledHours = () => {
|
|
|
|
- const a: number[] = [];
|
|
|
|
- for (let i = 0; i < 24; i++) {
|
|
|
|
- if (new Date().getHours() >= i) continue;
|
|
|
|
- a.push(i);
|
|
|
|
- }
|
|
|
|
- return a;
|
|
|
|
-};
|
|
|
|
-
|
|
|
|
-const disabledMinutes = () => {
|
|
|
|
- const a: number[] = [];
|
|
|
|
- // for (let i = 0; i < 60; i++) {
|
|
|
|
- // if (new Date().getMinutes() >= i) continue;
|
|
|
|
- // a.push(i);
|
|
|
|
- // }
|
|
|
|
- return a;
|
|
|
|
-};
|
|
|
|
-
|
|
|
|
-
|
|
|
|
|
|
|
|
const pageable = ref({
|
|
const pageable = ref({
|
|
data_type: true,
|
|
data_type: true,
|
|
@@ -176,8 +138,7 @@ const pageable = ref({
|
|
as_code: undefined,
|
|
as_code: undefined,
|
|
data_items: [],
|
|
data_items: [],
|
|
pageNum: 1,
|
|
pageNum: 1,
|
|
- pageSize: 20,
|
|
|
|
- total: 0
|
|
|
|
|
|
+
|
|
});
|
|
});
|
|
let historyColumns = [
|
|
let historyColumns = [
|
|
{
|
|
{
|
|
@@ -228,7 +189,7 @@ const queryas = ref<Platform>({
|
|
|
|
|
|
|
|
|
|
const userStore = useUserStore();
|
|
const userStore = useUserStore();
|
|
-const platformList =ref<any>(computed(() => userStore.stations))
|
|
|
|
|
|
+const platformList = ref<any>(computed(() => userStore.stations))
|
|
const selectPlatform = ref()
|
|
const selectPlatform = ref()
|
|
|
|
|
|
const getPlatforms = async () => {
|
|
const getPlatforms = async () => {
|
|
@@ -262,13 +223,18 @@ const timeArr = ref()
|
|
const tempLineArr = ref()
|
|
const tempLineArr = ref()
|
|
const humidityLineArr = ref()
|
|
const humidityLineArr = ref()
|
|
const pressureLineArr = ref()
|
|
const pressureLineArr = ref()
|
|
|
|
+const pressureInfo = ref<any>({
|
|
|
|
+ max: 1080,
|
|
|
|
+ min: 800
|
|
|
|
+})
|
|
const getHistoryList = async () => {
|
|
const getHistoryList = async () => {
|
|
|
|
|
|
- if (isDateFuture(dateRange.value[0]) ||isDateFuture(dateRange.value[1])) {
|
|
|
|
|
|
+
|
|
|
|
+ if (isDateFuture(dateRange.value[0]) || isDateFuture(dateRange.value[1])) {
|
|
ElMessage.error("不得选择未来的时间");
|
|
ElMessage.error("不得选择未来的时间");
|
|
return false;
|
|
return false;
|
|
}
|
|
}
|
|
- const { data } = await getDataItemList({ ...pageable.value, pageSize: 99, as_code_list: [pageable.value.as_code], data_items: historyColumns, data_type: false, time_space: value1.value ? 60 : 1, end_time: getStamp(dateRange.value[1]), begin_time: getStamp(dateRange.value[0]) });
|
|
|
|
|
|
+ const { data } = await getDataItemList({ ...pageable.value, as_code_list: [pageable.value.as_code], data_items: historyColumns, data_type: false, time_space: value1.value ? 60 : 1, end_time: getStamp(dateRange.value[1]), begin_time: getStamp(dateRange.value[0]) });
|
|
timeArr.value = data.list?.map(item => {
|
|
timeArr.value = data.list?.map(item => {
|
|
return formatDate(item.data_time_i, 1)
|
|
return formatDate(item.data_time_i, 1)
|
|
})
|
|
})
|
|
@@ -281,10 +247,46 @@ const getHistoryList = async () => {
|
|
pressureLineArr.value = data.list?.map(item => {
|
|
pressureLineArr.value = data.list?.map(item => {
|
|
return item[202]
|
|
return item[202]
|
|
})
|
|
})
|
|
- console.log(pressureLineArr.value, 555555);
|
|
|
|
- showData()
|
|
|
|
|
|
+ pressureInfo.value.max = getMaxAndAdd50(pressureLineArr.value)
|
|
|
|
+ pressureInfo.value.min = getMaxAndMinus50(pressureLineArr.value)
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ nextTick(() => {
|
|
|
|
+ showData()
|
|
|
|
+ })
|
|
};
|
|
};
|
|
|
|
+function getMaxAndAdd50(arr) {
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ if (!arr || arr.length === 0) {
|
|
|
|
+ return
|
|
|
|
+ } else {
|
|
|
|
+ // 使用 filter 方法过滤掉不能转换为数值的字符串
|
|
|
|
+ const numericArray = arr.filter(item => !isNaN(Number(item)));
|
|
|
|
+
|
|
|
|
+ // 使用 map 方法将过滤后的数组转换为数值数组
|
|
|
|
+ const numberArray = numericArray.map(item => Number(item));
|
|
|
|
+ let max = Math.max.apply(null, numberArray); // 获取最大值方法
|
|
|
|
+ let maxint = Math.ceil(max / 5) * 5; // 向上以5的倍数取整
|
|
|
|
+ return maxint === 0 ? 5 : maxint + 50; // 输出最大值+5
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+}
|
|
|
|
+function getMaxAndMinus50(arr) {
|
|
|
|
+ if (!arr || arr.length === 0) {
|
|
|
|
+ return
|
|
|
|
+ } else {
|
|
|
|
+ // 使用 filter 方法过滤掉不能转换为数值的字符串
|
|
|
|
+ const numericArray = arr.filter(item => !isNaN(Number(item)));
|
|
|
|
+ // 使用 map 方法将过滤后的数组转换为数值数组
|
|
|
|
+ const numberArray = numericArray.map(item => Number(item));
|
|
|
|
+ let min = Math.min.apply(null, numberArray); // 获取最小值方法
|
|
|
|
+ let minint = Math.floor(min / 5) * 5; // 向下以6的倍数取整
|
|
|
|
+ return minint <= 50 ? 0 : minint - 50; // 输出最小值+6
|
|
|
|
+ }
|
|
|
|
|
|
|
|
+}
|
|
|
|
|
|
const formRef = ref()
|
|
const formRef = ref()
|
|
const data = ref()
|
|
const data = ref()
|
|
@@ -293,40 +295,20 @@ const globalStore = useGlobalStore();
|
|
const isDark = computed(() => globalStore.isDark);
|
|
const isDark = computed(() => globalStore.isDark);
|
|
|
|
|
|
// resetForm
|
|
// resetForm
|
|
-const resetForm = (formEl) => {
|
|
|
|
- if (!formEl) return;
|
|
|
|
- formEl.resetFields();
|
|
|
|
|
|
+const resetForm = () => {
|
|
|
|
+ dateRange.value = [parseTime(getTimeStamp(5), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00'];
|
|
|
|
+ value1.value = true
|
|
|
|
+ pageable.value.as_code = platformList.value[0].as_code
|
|
|
|
+ getHistoryList()
|
|
|
|
+
|
|
};
|
|
};
|
|
|
|
|
|
const showData = () => {
|
|
const showData = () => {
|
|
- function getMaxAndAdd50(arr) {
|
|
|
|
- console.log(arr);
|
|
|
|
-
|
|
|
|
- if (!arr||arr.length === 0) {
|
|
|
|
- return
|
|
|
|
- } else {
|
|
|
|
- const maxValue = Math.max(...arr);
|
|
|
|
- // 将最大值加 50
|
|
|
|
- const result = maxValue + 50;
|
|
|
|
- return result;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- function getMaxAndMinus50(arr) {
|
|
|
|
- if (!arr||arr.length === 0) {
|
|
|
|
- return
|
|
|
|
- } else {
|
|
|
|
- const maxValue = Math.min(...arr);
|
|
|
|
- // 将最大值加 50
|
|
|
|
- const result = maxValue - 50;
|
|
|
|
- return result>=0 ? result : 0;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
|
|
+
|
|
|
|
|
|
const colors = ['#5470C6', '#59A073', '#FFB652'];
|
|
const colors = ['#5470C6', '#59A073', '#FFB652'];
|
|
var dom = document.getElementById("data");
|
|
var dom = document.getElementById("data");
|
|
- // var myChart = echarts.init(dom);
|
|
|
|
|
|
+ // var myChart = echarts.init(dom);
|
|
let mychart = echarts.init(dom);
|
|
let mychart = echarts.init(dom);
|
|
let option = {
|
|
let option = {
|
|
color: colors,
|
|
color: colors,
|
|
@@ -365,7 +347,10 @@ const showData = () => {
|
|
alignWithLabel: true
|
|
alignWithLabel: true
|
|
},
|
|
},
|
|
// prettier-ignore
|
|
// prettier-ignore
|
|
- data: timeArr.value
|
|
|
|
|
|
+ data: timeArr.value,
|
|
|
|
+ axisLine: {
|
|
|
|
+ onZero: false //-----------重点
|
|
|
|
+ }
|
|
}
|
|
}
|
|
],
|
|
],
|
|
yAxis: [
|
|
yAxis: [
|
|
@@ -404,8 +389,8 @@ const showData = () => {
|
|
type: 'value',
|
|
type: 'value',
|
|
name: '本站气压',
|
|
name: '本站气压',
|
|
|
|
|
|
- min: getMaxAndMinus50(pressureLineArr.value),
|
|
|
|
- max: getMaxAndAdd50(pressureLineArr.value),
|
|
|
|
|
|
+ min: pressureInfo.value.min,
|
|
|
|
+ max: pressureInfo.value.max,
|
|
position: 'left',
|
|
position: 'left',
|
|
axisLine: {
|
|
axisLine: {
|
|
show: true,
|
|
show: true,
|
|
@@ -443,10 +428,8 @@ const showData = () => {
|
|
}
|
|
}
|
|
]
|
|
]
|
|
};
|
|
};
|
|
- //单击后执行操作
|
|
|
|
- mychart.on('click',(param) => {
|
|
|
|
- console.log(param)
|
|
|
|
- });
|
|
|
|
|
|
+
|
|
|
|
+
|
|
mychart.setOption(option)
|
|
mychart.setOption(option)
|
|
window.addEventListener("resize", function () {
|
|
window.addEventListener("resize", function () {
|
|
mychart.resize();
|
|
mychart.resize();
|