|
@@ -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-hours="disabledHours"
|
|
|
|
- :disabled-minutes="disabledMinutes" @focus="handleFocus" @calendar-change="handleChange"
|
|
|
|
- @change="handleDateChange"
|
|
|
|
|
|
+ end-placeholder="结束时间" :disabled-date="disabledDate" :disabled-minutes="disabledMinutes"
|
|
|
|
+ @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>
|
|
@@ -63,12 +62,14 @@ import { ref, computed, onMounted, reactive, watch, onDeactivated, onActivated }
|
|
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,isWithin24Hours } from "@/utils/dateTime";
|
|
|
|
|
|
+import { isToday, isWithinThirtyMinutes, getTimeStamp, getStamp, isWithin24Hours, isDateFuture, isDateRangeWithinDays } from "@/utils/dateTime";
|
|
const value1 = ref(true)
|
|
const value1 = ref(true)
|
|
-const dateRange = ref<[any, any]>([parseTime(new Date(getTimeStamp(5)), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}:{i}')]);
|
|
|
|
|
|
+const dateRange = ref<[any, any]>([parseTime(new Date(getTimeStamp(5)), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d}') + ' 00:00']);
|
|
const changetype = (e) => {
|
|
const changetype = (e) => {
|
|
if (!e) {
|
|
if (!e) {
|
|
- dateRange.value = [parseTime(getTimeStamp(2), '{y}-{m}-{d} {h}:{i}'), parseTime(new Date(), '{y}-{m}-{d} {h}:{i}')]
|
|
|
|
|
|
+ dateRange.value = [parseTime(getTimeStamp(2), '{y}-{m}-{d} {h}:{i}'), parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00']
|
|
|
|
+ } else {
|
|
|
|
+ dateRange.value = [parseTime(new Date(getTimeStamp(5)), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d}') + ' 00:00']
|
|
}
|
|
}
|
|
}
|
|
}
|
|
const handleDateRangeChange = (newVal) => {
|
|
const handleDateRangeChange = (newVal) => {
|
|
@@ -77,42 +78,50 @@ const handleDateRangeChange = (newVal) => {
|
|
// 获取当前时间的整点
|
|
// 获取当前时间的整点
|
|
const currentHour = new Date().getHours();
|
|
const currentHour = new Date().getHours();
|
|
const roundedEndDate = new Date(endDate);
|
|
const roundedEndDate = new Date(endDate);
|
|
- roundedEndDate.setMinutes(0, 0, 0); // 设置分钟、秒、毫秒为0
|
|
|
|
|
|
+ roundedEndDate.setHours(0, 0, 0, 0); // 设置分钟、秒、毫秒为0
|
|
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, '今天');
|
|
console.log(dateRange.value, '今天');
|
|
} else {
|
|
} else {
|
|
- const noTodayStart = new Date(startDate).setMinutes(0, 0, 0);
|
|
|
|
- const noTodayEnd = new Date(endDate).setHours(23, 0, 0, 0);
|
|
|
|
|
|
+ const noTodayStart = new Date(startDate).setHours(0, 0, 0, 0);
|
|
|
|
+ const noTodayEnd = new Date(endDate).setHours(0, 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, '不是今天');
|
|
console.log(dateRange.value, '不是今天');
|
|
}
|
|
}
|
|
};
|
|
};
|
|
-const handleDateChange =async (e) => {
|
|
|
|
-
|
|
|
|
- if (!value1.value) {
|
|
|
|
- if (isWithin24Hours(e[0], e[1])) {
|
|
|
|
- // 获取参数
|
|
|
|
- getHistoryList()
|
|
|
|
|
|
+const handleDateChange = async (e) => {
|
|
|
|
+ console.log(isDateFuture(e[0]), isDateFuture(e[1]));
|
|
|
|
+
|
|
|
|
+ if (isDateFuture(e[0]) ||isDateFuture(e[1])) {
|
|
|
|
+ ElMessage.error("不得选择未来的时间");
|
|
|
|
+ } else {
|
|
|
|
+ if (!value1.value) {
|
|
|
|
+ if (isWithin24Hours(e[0], e[1])) {
|
|
|
|
+ // 获取参数
|
|
|
|
+ getHistoryList()
|
|
|
|
|
|
|
|
+ } else {
|
|
|
|
+ ElMessage.error("小时模式下时间间隔不能大于24小时");
|
|
|
|
+ }
|
|
} else {
|
|
} else {
|
|
- ElMessage.error("小时模式下时间间隔不能大于24小时");
|
|
|
|
|
|
+ if (isDateRangeWithinDays(e[0], e[1], 30)) {
|
|
|
|
+ await handleDateRangeChange(e)
|
|
|
|
+ getHistoryList()
|
|
|
|
+ } else {
|
|
|
|
+ ElMessage.error("日模式下时间间隔不能大于30天");
|
|
|
|
+ }
|
|
}
|
|
}
|
|
- } else {
|
|
|
|
- await handleDateRangeChange(e)
|
|
|
|
- getHistoryList()
|
|
|
|
-
|
|
|
|
-
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
const pickDay = ref()
|
|
const pickDay = ref()
|
|
const handleFocus = () => {
|
|
const handleFocus = () => {
|
|
pickDay.value = null
|
|
pickDay.value = null
|
|
}
|
|
}
|
|
-const limitTime = 1000 * 60 * 60 * 24 * 6
|
|
|
|
|
|
+const limitTime = 1000 * 60 * 60 * 24 * 30
|
|
|
|
|
|
const disabledDate = (time: Date) => {
|
|
const disabledDate = (time: Date) => {
|
|
|
|
+ return time.getTime() > Date.now() - 8.64e6
|
|
if (!value1.value) {
|
|
if (!value1.value) {
|
|
return time.getTime() > Date.now() - 8.64e6
|
|
return time.getTime() > Date.now() - 8.64e6
|
|
} else {
|
|
} else {
|
|
@@ -145,7 +154,7 @@ const disabledHours = () => {
|
|
const disabledMinutes = () => {
|
|
const disabledMinutes = () => {
|
|
const a: number[] = [];
|
|
const a: number[] = [];
|
|
for (let i = 0; i < 60; i++) {
|
|
for (let i = 0; i < 60; i++) {
|
|
- if (new Date().getMinutes() >= i) continue;
|
|
|
|
|
|
+ if (new Date().getMinutes() >= 59) continue;
|
|
a.push(i);
|
|
a.push(i);
|
|
}
|
|
}
|
|
return a;
|
|
return a;
|
|
@@ -156,7 +165,7 @@ const disabledMinutes = () => {
|
|
|
|
|
|
|
|
|
|
const pageable = ref({
|
|
const pageable = ref({
|
|
- data_type: true,
|
|
|
|
|
|
+ data_type: false,
|
|
time_order: 0,
|
|
time_order: 0,
|
|
as_code: undefined,
|
|
as_code: undefined,
|
|
data_items: [],
|
|
data_items: [],
|
|
@@ -166,36 +175,12 @@ const pageable = ref({
|
|
});
|
|
});
|
|
let historyColumns = [
|
|
let historyColumns = [
|
|
{
|
|
{
|
|
- data_id: 202,
|
|
|
|
data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
- data_type: "气压",
|
|
|
|
- data_name: "本站气压",
|
|
|
|
- data_item: "BEN_ZHAN_QI_YA",
|
|
|
|
- data_unit: "hPa",
|
|
|
|
- data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
|
- data_value: "",
|
|
|
|
- data_order: 0,
|
|
|
|
- data_condition: 0
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
|
- data_id: 101,
|
|
|
|
- data_type: "温湿度",
|
|
|
|
- data_item: "QI_WEN",
|
|
|
|
- data_name: "气温",
|
|
|
|
- data_unit: "℃",
|
|
|
|
- data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
|
- data_value: "",
|
|
|
|
- data_order: 0,
|
|
|
|
- data_condition: 0
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
|
- data_id: 106,
|
|
|
|
- data_type: "温湿度",
|
|
|
|
- data_item: "XIANG_DUI_SHI_DU",
|
|
|
|
- data_name: "相对湿度",
|
|
|
|
- data_unit: "%",
|
|
|
|
|
|
+ data_id: 309,
|
|
|
|
+ data_type: "降水",
|
|
|
|
+ data_item: "RI_JIANG_SHUI_LIANG",
|
|
|
|
+ data_name: "日降水量",
|
|
|
|
+ data_unit: "mm",
|
|
data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
data_value: "",
|
|
data_value: "",
|
|
data_order: 0,
|
|
data_order: 0,
|
|
@@ -213,7 +198,19 @@ let historyColumns = [
|
|
data_value: "",
|
|
data_value: "",
|
|
data_order: 0,
|
|
data_order: 0,
|
|
data_condition: 0
|
|
data_condition: 0
|
|
- }
|
|
|
|
|
|
+ }, {
|
|
|
|
+ data_id: 302,
|
|
|
|
+ data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
|
+ data_type: "降水",
|
|
|
|
+ data_name: "小时累计降水量(翻斗)",
|
|
|
|
+ data_item: "XIAO_SHI_LEI_JI_JIANG_SHUI_LIANG_FAN_DOU",
|
|
|
|
+ data_unit: "mm",
|
|
|
|
+ data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
|
+ data_value: "",
|
|
|
|
+ data_order: 0,
|
|
|
|
+ data_condition: 0,
|
|
|
|
+ isSelected: true
|
|
|
|
+ },
|
|
]
|
|
]
|
|
|
|
|
|
// 查询自动站列表
|
|
// 查询自动站列表
|
|
@@ -257,24 +254,32 @@ function formatDate(timestamp, type) {
|
|
|
|
|
|
|
|
|
|
const timeArr = ref()
|
|
const timeArr = ref()
|
|
-const tempLineArr = ref()
|
|
|
|
-const humidityLineArr = ref()
|
|
|
|
-const pressureLineArr = ref()
|
|
|
|
|
|
+const dayArr = ref()
|
|
|
|
+const hourArr1 = ref()
|
|
|
|
+const hourArr2 = ref()
|
|
|
|
+const show = ref(false)
|
|
const getHistoryList = async () => {
|
|
const getHistoryList = async () => {
|
|
- 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[1]), begin_time: getStamp(dateRange[0]) });
|
|
|
|
|
|
+ console.log(dateRange.value, 111);
|
|
|
|
+
|
|
|
|
+ const { data } = await getDataItemList({ ...pageable.value, pageSize: 99, as_code_list: [pageable.value.as_code], data_items: historyColumns, time_space: value1.value ? 1440 : 60, 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)
|
|
})
|
|
})
|
|
- tempLineArr.value = data.list?.map(item => {
|
|
|
|
- return item[101]
|
|
|
|
|
|
+ dayArr.value = data.list?.map(item => {
|
|
|
|
+ return item[309]
|
|
})
|
|
})
|
|
- humidityLineArr.value = data.list?.map(item => {
|
|
|
|
- return item[106]
|
|
|
|
|
|
+ hourArr1.value = data.list?.map(item => {
|
|
|
|
+ return item[312]
|
|
})
|
|
})
|
|
- pressureLineArr.value = data.list?.map(item => {
|
|
|
|
- return item[202]
|
|
|
|
|
|
+ hourArr2.value = data.list?.map(item => {
|
|
|
|
+ return item[302]
|
|
})
|
|
})
|
|
|
|
+ if (timeArr.value?.length > 0) {
|
|
|
|
+ show.value = true
|
|
|
|
+
|
|
|
|
+ }
|
|
showData()
|
|
showData()
|
|
|
|
+
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
@@ -291,8 +296,19 @@ const resetForm = (formEl) => {
|
|
};
|
|
};
|
|
|
|
|
|
const showData = () => {
|
|
const showData = () => {
|
|
|
|
+
|
|
let mychart = echarts.init(data.value);
|
|
let mychart = echarts.init(data.value);
|
|
let option = {
|
|
let option = {
|
|
|
|
+ title: {
|
|
|
|
+ text: '暂无数据',
|
|
|
|
+ show: !timeArr.value ? true : false,
|
|
|
|
+ x: 'center',
|
|
|
|
+ y: 'center',
|
|
|
|
+ textStyle: {
|
|
|
|
+ fontSize: 14,
|
|
|
|
+ fontWeight: 'normal',
|
|
|
|
+ }
|
|
|
|
+ },
|
|
tooltip: {
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
trigger: 'axis',
|
|
axisPointer: {
|
|
axisPointer: {
|
|
@@ -310,7 +326,7 @@ const showData = () => {
|
|
xAxis: [
|
|
xAxis: [
|
|
{
|
|
{
|
|
type: 'category',
|
|
type: 'category',
|
|
- data: ['06/11 16:00', '06/11 20:00', '06/12 00:00', '06/12 04:00', '06/12 08:00', '06/12 12:00', '06/12 16:00', '06/12 20:00', '06/13 00:00', '06/13 04:00', '06/13 08:00', '06/13 12:00'],
|
|
|
|
|
|
+ data: timeArr.value,
|
|
axisTick: {
|
|
axisTick: {
|
|
alignWithLabel: true
|
|
alignWithLabel: true
|
|
},
|
|
},
|
|
@@ -332,7 +348,7 @@ const showData = () => {
|
|
type: 'bar',
|
|
type: 'bar',
|
|
barWidth: '50%',
|
|
barWidth: '50%',
|
|
color: '#88c1ff',
|
|
color: '#88c1ff',
|
|
- data: [2, 3, 5, 3, 1, 0, 5, 2, 3, 4.5, 3.6, 2.8]
|
|
|
|
|
|
+ data: dayArr.value
|
|
}
|
|
}
|
|
]
|
|
]
|
|
};
|
|
};
|
|
@@ -344,7 +360,7 @@ const showData = () => {
|
|
|
|
|
|
// watch(isDark, () => {
|
|
// watch(isDark, () => {
|
|
// showData()
|
|
// showData()
|
|
-
|
|
|
|
|
|
+
|
|
|
|
|
|
// });
|
|
// });
|
|
onMounted(() => {
|
|
onMounted(() => {
|