|
@@ -21,8 +21,8 @@
|
|
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD HH:mm"
|
|
|
:format="value1 ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm'"
|
|
|
:type="value1 ? 'daterange' : 'datetimerange'" range-separator="-" start-placeholder="开始时间"
|
|
|
- end-placeholder="结束时间" :disabled-date="disabledDate"
|
|
|
- @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)]"
|
|
|
style="width: 300px;"></el-date-picker>
|
|
|
</div>
|
|
@@ -43,32 +43,32 @@
|
|
|
</div>
|
|
|
<div class="main_list">
|
|
|
<el-row :gutter="15">
|
|
|
- <template v-if="array.length>0">
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="8">
|
|
|
- <div class="chart_item zhuti">
|
|
|
- <div style="font-weight: bold;" class="item_title">
|
|
|
- <span>2分钟平均风向 ( ° )/2分钟平均风速 ( m/s )</span>
|
|
|
+ <template v-if="array.length > 0">
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" v-if="windLineArr && windLineArr.length > 0">
|
|
|
+ <div class="chart_item zhuti">
|
|
|
+ <div style="font-weight: bold;" class="item_title">
|
|
|
+ <span>2分钟平均风向 ( ° )/2分钟平均风速 ( m/s )</span>
|
|
|
+ </div>
|
|
|
+ <div class="mt5">
|
|
|
+ <div ref="wind" class="ve-ring" style="height: 330px"></div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="mt5">
|
|
|
- <div ref="wind" class="ve-ring" style="height: 330px"></div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" v-for="(item, index) in array" :key="item.data_id">
|
|
|
+ <div class="chart_item zhuti">
|
|
|
+ <div style="font-weight: bold;" class="item_title">
|
|
|
+ <span>{{ item.data_name }} ( {{ item.data_unit ? item.data_unit : '' }} )</span>
|
|
|
+ </div>
|
|
|
+ <div class="mt5">
|
|
|
+ <div :id="'Access' + index" class="ve-ring" style="height: 330px"></div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="8" v-for="(item, index) in array" :key="item.data_id">
|
|
|
- <div class="chart_item zhuti">
|
|
|
- <div style="font-weight: bold;" class="item_title">
|
|
|
- <span>{{ item.data_name }} ( {{ item.data_unit ? item.data_unit : '' }} )</span>
|
|
|
- </div>
|
|
|
- <div class="mt5">
|
|
|
- <div :id="'Access' + index" class="ve-ring" style="height: 330px"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
+ </el-col>
|
|
|
|
|
|
</template>
|
|
|
<el-col :span="24" v-else>
|
|
|
- <div class="chart_item zhuti">
|
|
|
- <el-empty description="暂无数据" />
|
|
|
+ <div class="chart_item zhuti nodata">
|
|
|
+ <el-empty style="height: 100%;" description="暂无数据" />
|
|
|
</div>
|
|
|
</el-col>
|
|
|
|
|
@@ -219,12 +219,8 @@
|
|
|
<div class="selected-list-c">
|
|
|
<template v-for="(item, index) in copiedCustomizeColumns" :key="item.id">
|
|
|
<div :class="selectedItemIndex === index ? 'selected-item-tag-active' : 'selected-item-tag'"
|
|
|
- @click="changeSelected(index)"
|
|
|
- draggable="true"
|
|
|
- @dragstart="dragStart($event, index)"
|
|
|
- @dragover.prevent
|
|
|
- @drop="drop($event, index)"
|
|
|
- >{{ item.data_name }}</div>
|
|
|
+ @click="changeSelected(index)" draggable="true" @dragstart="dragStart($event, index)"
|
|
|
+ @dragover.prevent @drop="drop($event, index)">{{ item.data_name }}</div>
|
|
|
</template>
|
|
|
</div>
|
|
|
<div class="button-container">
|
|
@@ -254,29 +250,29 @@ import { getDataItemList, getPlatformList, getRgDataList, getTacRecordList } fro
|
|
|
import { Platform } from "@/api/interface";
|
|
|
import { parseTime } from '@/utils/index';
|
|
|
import { isToday, isWithinThirtyMinutes, getTimeStamp, getStamp, isDateFuture, isDateRangeWithinDays } from "@/utils/dateTime";
|
|
|
-import {useUserStore} from "@/stores/modules/user";
|
|
|
+import { useUserStore } from "@/stores/modules/user";
|
|
|
const value1 = ref(true)
|
|
|
-const dateRange = ref<[any, any]>([parseTime(new Date(), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00']);
|
|
|
+const dateRange = ref<[any, any]>([parseTime(new Date(), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00']);
|
|
|
const changetype = (e) => {
|
|
|
if (!e) {
|
|
|
dateRange.value = [parseTime(getTimeStamp(1), '{y}-{m}-{d} {h}:{i}'), parseTime(new Date(), '{y}-{m}-{d} {h}:{i}')]
|
|
|
- }else {
|
|
|
+ } else {
|
|
|
dateRange.value = [parseTime(new Date(), '{y}-{m}-{d}') + ' 00:00', parseTime(new Date(), '{y}-{m}-{d} {h}') + ':00'];
|
|
|
}
|
|
|
getHistoryList()
|
|
|
}
|
|
|
|
|
|
const dragStart = (event, index) => {
|
|
|
- event.dataTransfer.effectAllowed = 'move';
|
|
|
- // 保存当前拖动的元素索引
|
|
|
- event.dataTransfer.setData('text/plain', index.toString());
|
|
|
+ event.dataTransfer.effectAllowed = 'move';
|
|
|
+ // 保存当前拖动的元素索引
|
|
|
+ event.dataTransfer.setData('text/plain', index.toString());
|
|
|
};
|
|
|
|
|
|
const drop = (event, index) => {
|
|
|
- const draggedIndex = parseInt(event.dataTransfer.getData('text/plain'));
|
|
|
- // 移动数组中的元素来更新顺序
|
|
|
- const draggedItem = copiedCustomizeColumns.value.splice(draggedIndex, 1)[0];
|
|
|
- copiedCustomizeColumns.value.splice(index, 0, draggedItem);
|
|
|
+ const draggedIndex = parseInt(event.dataTransfer.getData('text/plain'));
|
|
|
+ // 移动数组中的元素来更新顺序
|
|
|
+ const draggedItem = copiedCustomizeColumns.value.splice(draggedIndex, 1)[0];
|
|
|
+ copiedCustomizeColumns.value.splice(index, 0, draggedItem);
|
|
|
};
|
|
|
|
|
|
const handleDateRangeChange = (newVal) => {
|
|
@@ -302,16 +298,16 @@ const handleDateChange = async (e) => {
|
|
|
} else {
|
|
|
if (!value1.value) {
|
|
|
// if (isWithinThirtyMinutes(e[0], e[1])) {
|
|
|
- // 获取参数
|
|
|
- getHistoryList()
|
|
|
+ // 获取参数
|
|
|
+ getHistoryList()
|
|
|
|
|
|
// } else {
|
|
|
// ElMessage.error("分钟模式下时间间隔不能大于3小时");
|
|
|
// }
|
|
|
} else {
|
|
|
// if (isDateRangeWithinDays(e[0], e[1], 7)) {
|
|
|
- await handleDateRangeChange(e)
|
|
|
- getHistoryList()
|
|
|
+ await handleDateRangeChange(e)
|
|
|
+ getHistoryList()
|
|
|
// } else {
|
|
|
// ElMessage.error("正点模式下时间间隔不能大于7天");
|
|
|
// }
|
|
@@ -540,14 +536,58 @@ const toggleSelection = (item) => {
|
|
|
if (item.isSelected) {
|
|
|
//添加
|
|
|
copiedCustomizeColumns.value.push(item)
|
|
|
+ if (item.data_id == 1) {
|
|
|
+ historyColumns.value.push({
|
|
|
+ data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
+ data_id: 2,
|
|
|
+ data_type: "风",
|
|
|
+ data_item: "ER_FEN_ZHONG_PING_JUN_FENG_XIANG",
|
|
|
+ data_name: "2分钟风向",
|
|
|
+ data_unit: "°",
|
|
|
+ data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
+ data_value: "",
|
|
|
+ data_order: 0,
|
|
|
+ data_condition: 0
|
|
|
+ })
|
|
|
+
|
|
|
+ } else if (item.data_id == 2) {
|
|
|
+ historyColumns.value.push({
|
|
|
+ data_id: 1,
|
|
|
+ data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
+ data_type: "风",
|
|
|
+ data_name: "2分钟风速",
|
|
|
+ data_item: "ER_FEN_ZHONG_PING_JUN_FENG_SU",
|
|
|
+ data_unit: "m/s",
|
|
|
+ data_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
+ data_value: "",
|
|
|
+ data_order: 0,
|
|
|
+ data_condition: 0
|
|
|
+ })
|
|
|
+ }
|
|
|
} else {
|
|
|
//删除
|
|
|
copiedCustomizeColumns.value = copiedCustomizeColumns.value.filter(column => column.data_id !== item.data_id);
|
|
|
+ historyColumns.value = historyColumns.value.filter(column => column.data_id !== item.data_id);
|
|
|
+ if (item.data_id == 1) {
|
|
|
+ historyColumns.value = historyColumns.value.filter(column => column.data_id !== 2);
|
|
|
+ copiedCustomizeColumns.value = copiedCustomizeColumns.value.filter(column => column.data_id !== 2);
|
|
|
+
|
|
|
+ } else if (item.data_id == 2) {
|
|
|
+ historyColumns.value = historyColumns.value.filter(column => column.data_id !== 1);
|
|
|
+ copiedCustomizeColumns.value = copiedCustomizeColumns.value.filter(column => column.data_id !== 1);
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
}
|
|
|
const handleSetting = () => {
|
|
|
- copiedCustomizeColumns.value = [...customizeColumns.value]
|
|
|
+ copiedCustomizeColumns.value = [...customizeColumns.value, ...historyColumns.value].reduce((acc, item) => {
|
|
|
+ if (!acc.some(existingItem => existingItem.data_id === item.data_id)) {
|
|
|
+ acc.push(item);
|
|
|
+ }
|
|
|
+ return acc;
|
|
|
+ }, []);
|
|
|
+ // copiedCustomizeColumns.value = [...customizeColumns.value]
|
|
|
elementList.value.forEach(element => {
|
|
|
const column = copiedCustomizeColumns.value.find(col => col.data_id === element.data_id);
|
|
|
if (column) {
|
|
@@ -606,7 +646,7 @@ const pageable = ref({
|
|
|
pageNum: 1,
|
|
|
|
|
|
});
|
|
|
-let historyColumns = [
|
|
|
+let historyColumns = ref([
|
|
|
{
|
|
|
data_id: 202,
|
|
|
data_r_table: "SHI_SHI_LIU_YAO_SU_SHU_JU",
|
|
@@ -668,8 +708,21 @@ let historyColumns = [
|
|
|
data_order: 0,
|
|
|
data_condition: 0,
|
|
|
isSelected: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ 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_h_table: "LI_SHI_LIU_YAO_SU_SHU_JU",
|
|
|
+ data_value: "",
|
|
|
+ data_order: 0,
|
|
|
+ data_condition: 0,
|
|
|
+ isSelected: true
|
|
|
}
|
|
|
-]
|
|
|
+])
|
|
|
|
|
|
// 查询自动站列表
|
|
|
const queryas = ref<Platform>({
|
|
@@ -680,7 +733,7 @@ const queryas = ref<Platform>({
|
|
|
|
|
|
|
|
|
const userStore = useUserStore();
|
|
|
-const platformList =ref<any>(computed(() => userStore.stations))
|
|
|
+const platformList = ref<any>(computed(() => userStore.stations))
|
|
|
const selectPlatform = ref()
|
|
|
|
|
|
const getPlatforms = async () => {
|
|
@@ -759,10 +812,11 @@ const Access = () => {
|
|
|
formatter: function (value) {
|
|
|
return value.replace(/ /g, '\n');
|
|
|
},
|
|
|
+ // interval: 0,
|
|
|
},
|
|
|
axisLine: {
|
|
|
- onZero: false //-----------重点
|
|
|
- }
|
|
|
+ onZero: false //-----------重点
|
|
|
+ }
|
|
|
},
|
|
|
yAxis: {
|
|
|
// min: minData1,
|
|
@@ -813,17 +867,17 @@ const tempLineArr = ref()
|
|
|
const humidityLineArr = ref()
|
|
|
const pressureLineArr = ref()
|
|
|
const getHistoryList = async () => {
|
|
|
- if (isDateFuture(dateRange.value[0]) ||isDateFuture(dateRange.value[1])) {
|
|
|
+ if (isDateFuture(dateRange.value[0]) || isDateFuture(dateRange.value[1])) {
|
|
|
ElMessage.error("不得选择未来的时间");
|
|
|
return false;
|
|
|
}
|
|
|
- const arr = [...customizeColumns.value, ...historyColumns].reduce((acc, item) => {
|
|
|
+ const arr = [...customizeColumns.value, ...historyColumns.value].reduce((acc, item) => {
|
|
|
if (!acc.some(existingItem => existingItem.data_id === item.data_id)) {
|
|
|
acc.push(item);
|
|
|
}
|
|
|
return acc;
|
|
|
}, []);
|
|
|
- const { data } = await getDataItemList({ ...pageable.value, as_code_list: [pageable.value.as_code], data_items: arr, 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: arr, 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 => {
|
|
|
return formatDate(item.data_time_i, 1)
|
|
|
})
|
|
@@ -853,22 +907,27 @@ const getHistoryList = async () => {
|
|
|
});
|
|
|
array.value = Object.values(resultMap);
|
|
|
nextTick(() => {
|
|
|
- if (array.value.length>0) Access();
|
|
|
+ if (array.value.length > 0) Access();
|
|
|
});
|
|
|
// console.log(array.value, 'array');
|
|
|
|
|
|
|
|
|
+ if (arr.some(item => item.data_id === 1)) {
|
|
|
+ windLineArr.value = data.list?.map(item => {
|
|
|
+ return {
|
|
|
+ value: item[1],
|
|
|
+ symbolRotate: adjustValue(item[2]),
|
|
|
+ symbolRotateStr: item[2]
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ nextTick(() => {
|
|
|
+ if (array.value.length > 0) showWind()
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ windLineArr.value = []
|
|
|
+ }
|
|
|
|
|
|
- windLineArr.value = data.list?.map(item => {
|
|
|
- return {
|
|
|
- value: item[1],
|
|
|
- symbolRotate: adjustValue(item[2]),
|
|
|
- symbolRotateStr: item[2]
|
|
|
- }
|
|
|
- })
|
|
|
- nextTick(()=>{
|
|
|
- if (array.value.length>0) showWind()
|
|
|
- })
|
|
|
};
|
|
|
function adjustValue(value) {
|
|
|
if (value === 'C') {
|
|
@@ -1307,4 +1366,8 @@ onMounted(() => {
|
|
|
.el-button.is-link {
|
|
|
height: 32px;
|
|
|
}
|
|
|
+
|
|
|
+.nodata {
|
|
|
+ height: calc(100vh - 220px);
|
|
|
+}
|
|
|
</style>
|