实时数据-实时趋势页面调试

This commit is contained in:
zhujiyan
2024-07-31 10:42:04 +08:00
parent a545692e33
commit 44684c99ed
9 changed files with 658 additions and 380 deletions

View File

@@ -42,6 +42,7 @@ import { ref, onMounted, watch } from 'vue'
import { queryByCode, queryByid, queryCsDictTree } from '@/api/system-boot/dictTree'
import { queryStatistical } from '@/api/system-boot/csstatisticalset'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { getDeviceHarmonicSpectrumData, getRealTimeTableList } from '@/api/cs-device-boot/EquipmentDelivery.ts'
const searchForm = ref({})
searchForm.value = {
index: []
@@ -59,10 +60,11 @@ queryByCode('portable-harmonic').then(res => {
})
})
const tableList: any = ref([])
for (let i = 0; i < 100; i++) {
for (let i = 0; i < 10000; i++) {
tableList.value.push({
name: i + 1,
value: Math.floor(Math.random() * 101)
// value: Math.floor(Math.random() * 101)
value: i + 2
})
}
const echartsData1: any = ref([]),
@@ -75,6 +77,21 @@ const echartsData1: any = ref([]),
const chartsTitle1 = ref('')
const chartsTitle2 = ref('')
const chartsTitle3 = ref('')
//谐波频谱参数
const params = ref({})
const getHarmonicSpectrumParams = (val: any) => {
params.value = val
params.value.list = []
console.log(params.value, '+++++++++++++')
//查询稳态指标
getRealTimeTableList().then(res => {
console.log('稳态指标', res)
})
//查询谐波频谱
getDeviceHarmonicSpectrumData(params.value).then(res => {
console.log('谐波频谱')
})
}
const init = () => {
const xDataList: any = [],
yDataList1: any = [],
@@ -83,22 +100,22 @@ const init = () => {
tableList.value.map((item: any) => {
xDataList.push(item.name)
yDataList1.push(item.value)
yDataList2.push(Math.floor(Math.random() * 101) + Math.floor(Math.random() * 101))
yDataList3.push(Math.floor(Math.random() * 101) + Math.floor(Math.random() * 101))
yDataList2.push(item.value + 1000)
yDataList3.push(item.value + 2000)
})
indexOptions.value.map((item:any)=>{
if(item.id==searchForm.value.index[0]){
chartsTitle1.value=item.name
}
if(item.id==searchForm.value.index[1]){
chartsTitle2.value=item.name
}
if(item.id==searchForm.value.index[2]){
chartsTitle3.value=item.name
}
})
console.log( chartsTitle1.value, chartsTitle2.value, chartsTitle3.value,"666677777");
indexOptions.value.map((item: any) => {
if (item.id == searchForm.value.index[0]) {
chartsTitle1.value = item.name
}
if (item.id == searchForm.value.index[1]) {
chartsTitle2.value = item.name
}
if (item.id == searchForm.value.index[2]) {
chartsTitle3.value = item.name
}
})
console.log(chartsTitle1.value, chartsTitle2.value, chartsTitle3.value, '666677777')
if (searchForm.value.index[0]) {
echartsData1.value = {
options: {
@@ -107,7 +124,7 @@ const init = () => {
{
left: '10%',
top: 0,
text:chartsTitle1.value
text: chartsTitle1.value
}
],
grid: {
@@ -163,7 +180,8 @@ const init = () => {
textStyle: {
color: '#000' //X轴文字颜色
}
}
},
boundaryGap: false
},
yAxis: [
{
@@ -180,8 +198,7 @@ const init = () => {
lineStyle: {
color: '#000'
}
},
smooth: true
}
}
],
series: [
@@ -196,6 +213,7 @@ const init = () => {
// }e
},
data: yDataList1,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
},
{
@@ -210,6 +228,7 @@ const init = () => {
// }
},
data: yDataList2,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
},
{
@@ -223,6 +242,7 @@ const init = () => {
// }
},
data: yDataList3,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
}
]
@@ -238,7 +258,7 @@ const init = () => {
{
left: '10%',
top: 0,
text:chartsTitle2.value
text: chartsTitle2.value
}
],
grid: {
@@ -294,7 +314,8 @@ const init = () => {
textStyle: {
color: '#000' //X轴文字颜色
}
}
},
boundaryGap: false
},
yAxis: [
{
@@ -326,6 +347,7 @@ const init = () => {
// }e
},
data: yDataList1,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
},
{
@@ -340,6 +362,7 @@ const init = () => {
// }
},
data: yDataList2,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
},
{
@@ -353,6 +376,7 @@ const init = () => {
// }
},
data: yDataList3,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
}
]
@@ -424,7 +448,8 @@ const init = () => {
textStyle: {
color: '#000' //X轴文字颜色
}
}
},
boundaryGap: false
},
yAxis: [
{
@@ -456,6 +481,7 @@ const init = () => {
// }e
},
data: yDataList1,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
},
{
@@ -470,6 +496,7 @@ const init = () => {
// }
},
data: yDataList2,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
},
{
@@ -483,6 +510,7 @@ const init = () => {
// }
},
data: yDataList3,
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
}
]
@@ -507,7 +535,7 @@ onMounted(() => {
console.log()
// init()
})
defineExpose({ init })
defineExpose({ getHarmonicSpectrumParams })
</script>
<style lang="scss" scoped>
.harmonic {
@@ -535,6 +563,7 @@ defineExpose({ init })
.harmonic_body_charts {
height: 200px;
margin: 15px 0;
border: 1px solid #eee;
}
}
}