统计分析
This commit is contained in:
parent
68597dbd8a
commit
5f2ec82b42
@ -11,7 +11,11 @@
|
||||
:sortable="item.sortable"
|
||||
>
|
||||
<template #default="scope">
|
||||
<el-radio v-if="item.prop === 'index'" :label="scope.row.id" v-model="selectedIndex" @change="handleRadioChange(scope.row)"
|
||||
<el-radio
|
||||
v-if="item.prop === 'index'"
|
||||
:label="scope.row.attributeCode"
|
||||
v-model="selectedIndex"
|
||||
@change="handleRadioChange(scope.row)"
|
||||
> </el-radio
|
||||
>
|
||||
</template>
|
||||
@ -47,6 +51,10 @@ const props = defineProps({
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
irn: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
@ -91,7 +99,7 @@ const tableColumn = [
|
||||
const tableData = ref<any[]>([])
|
||||
const emit = defineEmits(['handleRadioChange'])
|
||||
const handleRadioChange = (row) => {
|
||||
selectedIndex.value = row.id
|
||||
selectedIndex.value = row.attributeCode
|
||||
emit('handleRadioChange', row)
|
||||
}
|
||||
const getAttributeList = () => {
|
||||
@ -204,6 +212,7 @@ watch(
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
getCompleteData()
|
||||
selectedIndex.value = props.irn
|
||||
}
|
||||
},
|
||||
{
|
||||
|
@ -14,7 +14,7 @@ import { useConfig } from '/@/stores/config'
|
||||
import TrendAnalysis from './trendAnalysis.vue'
|
||||
import TrendComparison from './trendComparison.vue'
|
||||
const config = useConfig()
|
||||
const activeIndex = ref(2)
|
||||
const activeIndex = ref(1)
|
||||
const { t } = useI18n()
|
||||
const headerList = [t('statAnalysis.PowerCurveAnalysis'), t('statAnalysis.trendAnalysis'), t('statAnalysis.trendComparison')]
|
||||
|
||||
|
@ -6,7 +6,7 @@
|
||||
<span>{{ t('statAnalysis.deviceId') }}</span>
|
||||
<el-select
|
||||
v-model="statAnalysisSelect.deviceId"
|
||||
@change="selectstatAnalysis('deviceId')"
|
||||
@change="deviceIdChange"
|
||||
:placeholder="'请选择' + t('statAnalysis.deviceId')"
|
||||
class="statAnalysisSelect"
|
||||
>
|
||||
@ -18,7 +18,7 @@
|
||||
<el-input
|
||||
class="statAnalysisSelect"
|
||||
v-model="statAnalysisSelect.attributes"
|
||||
@click="showMeasure = true"
|
||||
@click="attributesChange"
|
||||
:placeholder="'请选择' + t('statAnalysis.attributes')"
|
||||
></el-input>
|
||||
</div>
|
||||
@ -91,7 +91,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<div class="measureSlot">
|
||||
<MeasurementPage :show="showMeasure" :iotModelId="iotModelId" @handleRadioChange="handleRadioChange"></MeasurementPage>
|
||||
<MeasurementPage :show="showMeasure" :iotModelId="iotModelId" :irn="irn" @handleRadioChange="handleRadioChange"></MeasurementPage>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
@ -121,12 +121,13 @@ const statAnalysisSelect = reactive({
|
||||
const times = reactive([{ time: '' }])
|
||||
const addTime = (index) => {
|
||||
times.push({ time: '' })
|
||||
customName.push(index + 2)
|
||||
customName.push(String(index + 2))
|
||||
}
|
||||
const switchTime = (index) => {
|
||||
times.splice(index, 1)
|
||||
customName.splice(index, 1)
|
||||
calculate.splice(index, 1)
|
||||
xData.splice(index, 1)
|
||||
}
|
||||
const timechange = (value) => {
|
||||
const count = getTimeIntervals(times[0][0], times[0][1])
|
||||
@ -142,20 +143,24 @@ const handleClick = () => {
|
||||
}
|
||||
|
||||
const iotModelId = ref('')
|
||||
watch(
|
||||
() => statAnalysisSelect.deviceId,
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
const row = statAnalysisSelectOptions.deviceId.filter((item) => {
|
||||
return item.value == newVal
|
||||
})
|
||||
iotModelId.value = row[0].iotModelId
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
const irn = ref('')
|
||||
const attributesChange = () => {
|
||||
const row = statAnalysisSelectOptions.deviceId.filter((item) => {
|
||||
return item.value == statAnalysisSelect.deviceId
|
||||
})
|
||||
if (row.length) {
|
||||
iotModelId.value = row[0].iotModelId
|
||||
showMeasure.value = true
|
||||
irn.value = statAnalysisSelect.attributeCode || ''
|
||||
} else {
|
||||
ElMessage.warning('请选择风机!!')
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
const deviceIdChange = () => {
|
||||
statAnalysisSelect.attributes = ''
|
||||
statAnalysisSelect.attributeCode = ''
|
||||
}
|
||||
|
||||
const showMeasure = ref(false)
|
||||
const selectedAttrRow = ref({
|
||||
@ -337,6 +342,7 @@ const getTimeIntervals = (startTimestamp, endTimestamp) => {
|
||||
}
|
||||
const statAnalysisOperate = () => {
|
||||
option.series = []
|
||||
option.legend.data = []
|
||||
chart.value.setOption(option, { notMerge: true })
|
||||
times.forEach((time, index) => {
|
||||
if (time[0] && time[1]) {
|
||||
@ -356,6 +362,7 @@ const statAnalysisOperate = () => {
|
||||
})
|
||||
}
|
||||
const calculate = reactive([{ max: '', min: '', average: '' }])
|
||||
const xDatas = reactive([])
|
||||
const historyDataReq = (data, index) => {
|
||||
historyReq(data).then((res) => {
|
||||
if (res.code == 200) {
|
||||
@ -370,11 +377,13 @@ const historyDataReq = (data, index) => {
|
||||
min: Math.floor(Math.min(...yData)),
|
||||
average: Math.floor(yData.reduce((a, b) => a + b, 0) / yData.length),
|
||||
}
|
||||
xDatas.push(xData)
|
||||
option.tooltip = {
|
||||
show: true,
|
||||
formatter: function (params) {
|
||||
const x = timestampToTime(xData[params.dataIndex])
|
||||
return `${params.marker} ${params.seriesName} ${x} : ${params.data}`
|
||||
const index = customName.indexOf(params.seriesName)
|
||||
const x = timestampToTime(xDatas[index][params.dataIndex])
|
||||
return `${params.marker} ${params.seriesName} <br/> ${x} <b>${params.data}</b>`
|
||||
},
|
||||
}
|
||||
option.xAxis.data = Array.from({ length: xData.length }, (_, index) => index)
|
||||
@ -383,10 +392,8 @@ const historyDataReq = (data, index) => {
|
||||
type: 'line',
|
||||
data: yData,
|
||||
}
|
||||
console.log(seriesData)
|
||||
option.legend.data.push(customName[index])
|
||||
option.series.push(seriesData)
|
||||
console.log(option)
|
||||
chart.value.setOption(option)
|
||||
} else {
|
||||
ElMessage.warning('查询失败1')
|
||||
|
@ -30,10 +30,11 @@
|
||||
<div class="headerPart" v-for="(deviceId, index) in statAnalysisDeviceId" :key="index">
|
||||
<div class="topLeft">
|
||||
<div class="selectPart">
|
||||
<span>{{ index + 1 }}</span>
|
||||
<el-input v-model="customName[index]" class="customName"></el-input>
|
||||
<span>{{ t('statAnalysis.deviceId') }}</span>
|
||||
<el-select
|
||||
v-model="statAnalysisDeviceId[index]"
|
||||
@change="deviceIdChange(index)"
|
||||
:placeholder="'请选择' + t('statAnalysis.deviceId')"
|
||||
class="statAnalysisSelect"
|
||||
>
|
||||
@ -45,7 +46,7 @@
|
||||
<el-input
|
||||
class="statAnalysisSelect"
|
||||
v-model="statAnalysisAttributes[index]"
|
||||
@click="selectAtteibutes(index, statAnalysisAttributes[index])"
|
||||
@click="selectAtteibutes(index)"
|
||||
:placeholder="'请选择' + t('statAnalysis.attributes')"
|
||||
></el-input>
|
||||
</div>
|
||||
@ -64,15 +65,15 @@
|
||||
<div class="icon">
|
||||
<el-button v-show="index !== 0" type="danger" size="small" :icon="Delete" @click="switchDevice(index)" circle></el-button>
|
||||
</div>
|
||||
<div class="selectPart" v-if="calculate[index] && calculate[index]['max']">
|
||||
<div class="selectPart" v-if="calculate[index] && calculate[index]['max'] != ''">
|
||||
<span>{{ t('statAnalysis.max') }}</span>
|
||||
<span class="max">{{ calculate[index]['max'] }}</span>
|
||||
</div>
|
||||
<div class="selectPart" v-if="calculate[index] && calculate[index]['min']">
|
||||
<div class="selectPart" v-if="calculate[index] && calculate[index]['min'] != ''">
|
||||
<span>{{ t('statAnalysis.min') }}</span>
|
||||
<span class="min">{{ calculate[index]['min'] }}</span>
|
||||
</div>
|
||||
<div class="selectPart" v-if="calculate[index] && calculate[index]['average']">
|
||||
<div class="selectPart" v-if="calculate[index] && calculate[index]['average'] != ''">
|
||||
<span>{{ t('statAnalysis.average') }}</span>
|
||||
<span class="average">{{ calculate[index]['average'] }}</span>
|
||||
</div>
|
||||
@ -91,7 +92,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<div class="measureSlot">
|
||||
<MeasurementPage :show="showMeasure" :iotModelId="iotModelId" @handleRadioChange="handleRadioChange"></MeasurementPage>
|
||||
<MeasurementPage :show="showMeasure" :iotModelId="iotModelId" :irn="irn" @handleRadioChange="handleRadioChange"></MeasurementPage>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
@ -131,13 +132,13 @@ const selectediotModelId = ref('')
|
||||
const addDevice = (index) => {
|
||||
statAnalysisDeviceId.push('')
|
||||
statAnalysisAttributes.push('')
|
||||
customName.value.push(index + 2)
|
||||
customName.push(String(index + 2))
|
||||
}
|
||||
const switchDevice = (index) => {
|
||||
statAnalysisDeviceId.splice(index, 1)
|
||||
statAnalysisAttributes.splice(index, 1)
|
||||
statAnalysisAttributeCode.splice(index, 1)
|
||||
customName.value.splice(index, 1)
|
||||
customName.splice(index, 1)
|
||||
calculate.splice(index, 1)
|
||||
}
|
||||
|
||||
@ -147,15 +148,23 @@ const handleClick = () => {
|
||||
}
|
||||
const iotModelId = ref('')
|
||||
const irn = ref('')
|
||||
const selectAtteibutes = (index, data = '') => {
|
||||
console.log('🚀 ~ selectAtteibutes ~ data:', data)
|
||||
showMeasure.value = true
|
||||
openModelIndex.value = index
|
||||
const selectAtteibutes = (index) => {
|
||||
const row = statAnalysisSelectOptions.deviceId.filter((item) => {
|
||||
return item.value == statAnalysisDeviceId[index]
|
||||
})
|
||||
iotModelId.value = row[0].iotModelId
|
||||
irn.value = data
|
||||
if (row.length) {
|
||||
iotModelId.value = row[0].iotModelId
|
||||
irn.value = statAnalysisAttributeCode[index] || ''
|
||||
showMeasure.value = true
|
||||
openModelIndex.value = index
|
||||
} else {
|
||||
ElMessage.warning('请选择风机!!')
|
||||
}
|
||||
}
|
||||
|
||||
const deviceIdChange = (index) => {
|
||||
statAnalysisAttributeCode[index] = ''
|
||||
statAnalysisAttributes[index] = ''
|
||||
}
|
||||
|
||||
const showMeasure = ref(false)
|
||||
@ -171,7 +180,6 @@ const handleRadioChange = (value) => {
|
||||
const selectstatAnalysisAttributes = () => {
|
||||
statAnalysisAttributes[openModelIndex.value] = selectedAttrRow.attributeName
|
||||
statAnalysisAttributeCode[openModelIndex.value] = selectedAttrRow.attributeCode
|
||||
console.log(statAnalysisAttributeCode)
|
||||
showMeasure.value = false
|
||||
}
|
||||
|
||||
@ -200,7 +208,7 @@ const option = {
|
||||
},
|
||||
}
|
||||
|
||||
const customName = ref(['1'])
|
||||
const customName = reactive(['1'])
|
||||
const chart = ref(null)
|
||||
onMounted(() => {
|
||||
if (chartContainer.value) {
|
||||
@ -234,42 +242,71 @@ const selectstatAnalysis = () => {}
|
||||
|
||||
const shortcuts = [
|
||||
{
|
||||
text: '昨日',
|
||||
text: '今天',
|
||||
value: () => {
|
||||
const start = getFormattedDate(0) + ' 00:00:00'
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24)
|
||||
return [start, end]
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '前三天',
|
||||
text: '昨天',
|
||||
value: () => {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 3)
|
||||
const start = getFormattedDate(-1) + ' 00:00:00'
|
||||
const end = getFormattedDate(-1) + ' 23:59:59'
|
||||
return [start, end]
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '前七天',
|
||||
text: '前3天',
|
||||
value: () => {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||
const start = getFormattedDate(-3) + ' 00:00:00'
|
||||
const end = getFormattedDate(-1) + ' 23:59:59'
|
||||
return [start, end]
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '上个月',
|
||||
text: '本周',
|
||||
value: () => {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||
return [start, end]
|
||||
return getDateRange('week')
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '本月',
|
||||
value: () => {
|
||||
return getDateRange('month')
|
||||
},
|
||||
},
|
||||
]
|
||||
const getFormattedDate = (offset) => {
|
||||
const date = new Date()
|
||||
date.setDate(date.getDate() + offset)
|
||||
|
||||
const year = date.getFullYear()
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0')
|
||||
const day = String(date.getDate()).padStart(2, '0')
|
||||
return `${year}-${month}-${day}`
|
||||
}
|
||||
const getDateRange = (type: 'week' | 'month') => {
|
||||
const today = new Date()
|
||||
if (type === 'week') {
|
||||
const dayOfWeek = today.getDay()
|
||||
const startOfWeek = new Date(today)
|
||||
startOfWeek.setDate(today.getDate() - dayOfWeek + (dayOfWeek === 0 ? -6 : 1))
|
||||
startOfWeek.setHours(0, 0, 0, 0)
|
||||
const endOfWeek = new Date(startOfWeek)
|
||||
endOfWeek.setDate(startOfWeek.getDate() + 6)
|
||||
endOfWeek.setHours(23, 59, 59, 999)
|
||||
return [startOfWeek, endOfWeek]
|
||||
}
|
||||
if (type === 'month') {
|
||||
const startOfMonth = new Date(today.getFullYear(), today.getMonth(), 1)
|
||||
startOfMonth.setHours(0, 0, 0, 0)
|
||||
const endOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, 0)
|
||||
endOfMonth.setHours(23, 59, 59, 999)
|
||||
return [startOfMonth, endOfMonth]
|
||||
}
|
||||
}
|
||||
|
||||
const statAnalysisOperate = () => {
|
||||
option.series = []
|
||||
@ -284,7 +321,6 @@ const statAnalysisOperate = () => {
|
||||
}
|
||||
return deviceId
|
||||
}, [])
|
||||
console.log(devices)
|
||||
const requestData = {
|
||||
devices: devices,
|
||||
interval: statAnalysisInterval.value,
|
||||
@ -297,30 +333,48 @@ const calculate = reactive([{ max: '', min: '', average: '' }])
|
||||
const historyDataReq = (data, devices) => {
|
||||
historyReq(data).then((res) => {
|
||||
if (res.code == 200) {
|
||||
devices.forEach((item) => {
|
||||
const deviceId = item.deviceId
|
||||
item.attributes.forEach((attribute) => {
|
||||
if (res.data && res.data[deviceId] && res.data[deviceId][attribute]) {
|
||||
const resData = res.data[deviceId][attribute]
|
||||
const xData = resData['times']
|
||||
const yData = resData['values']
|
||||
const resData = res.data
|
||||
const deviceIdKeys = Object.keys(resData)
|
||||
const attributeKeys = []
|
||||
if (deviceIdKeys.length) {
|
||||
deviceIdKeys.forEach((item) => {
|
||||
const indexList1 = findAllOccurrences(statAnalysisDeviceId, item)
|
||||
Object.keys(resData[item]).forEach((value) => {
|
||||
const indexList2 = findAllOccurrences(statAnalysisAttributeCode, value)
|
||||
const dataIndex = getCommonElements(indexList1, indexList2)[0]
|
||||
const historyData = resData[item][value]
|
||||
const xData = historyData['times']
|
||||
const yData = historyData['values']
|
||||
const seriesData = {
|
||||
name: attribute,
|
||||
name: customName[dataIndex],
|
||||
type: 'line',
|
||||
data: yData,
|
||||
}
|
||||
calculate[dataIndex] = {
|
||||
max: Math.floor(Math.max(...yData)),
|
||||
min: Math.floor(Math.min(...yData)),
|
||||
average: Math.floor(yData.reduce((a, b) => a + b, 0) / yData.length),
|
||||
}
|
||||
option.legend.data.push(customName[dataIndex])
|
||||
option.xAxis.data = xData.map((item) => timestampToTime(item))
|
||||
option.series.push(seriesData)
|
||||
chart.value.setOption(option)
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
} else {
|
||||
ElMessage.warning('查询失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const findAllOccurrences = (arr, target) => {
|
||||
return arr.map((value, index) => (value === target ? index : -1)).filter((index) => index !== -1)
|
||||
}
|
||||
|
||||
const getCommonElements = (arr1, arr2) => {
|
||||
return arr1.filter((item) => arr2.some((x) => x === item))
|
||||
}
|
||||
const statAnalysisExport = () => {}
|
||||
const statAnalysiImport = () => {}
|
||||
|
||||
@ -359,6 +413,10 @@ const timestampToTime = (timestamp) => {
|
||||
span {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.customName {
|
||||
width: 80px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.statAnalysisSelect {
|
||||
width: 200px;
|
||||
:deep(.el-select__wrapper) {
|
||||
|
Loading…
Reference in New Issue
Block a user