修改问题

This commit is contained in:
zhujiyan
2024-10-21 19:00:52 +08:00
parent c4fa5612f8
commit f442e1eeec
4 changed files with 92 additions and 155 deletions

View File

@@ -111,16 +111,16 @@ const handleUpDevice = () => {
ndid: routes.query.ndid,
proList: proList
}
loading.value = true
// loading.value = true
offlineDataUploadMakeUp(form)
.then((res: any) => {
if (res.code == 'A0000') {
ElMessage.success(res.message)
loading.value = false
// loading.value = false
}
})
.catch(e => {
loading.value = false
// loading.value = false
})
}
const handleIntoDir = (row: any) => {
@@ -173,6 +173,7 @@ mqttRef.value.on('message', (topic: any, message: any) => {
// console.log('🚀 ~ mqttRef.value.on ~ message:', JSON.parse(message))
// console.log('mqtt接收到消息', message,topic)
console.log('mqtt接收到消息', JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message)))))
loading.value = false
// "{allStep:\""+times+"\",nowStep:"+i+"}"
let str = JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message))))
// eval('(' + str + ')').includes('fileName')
@@ -182,7 +183,7 @@ mqttRef.value.on('message', (topic: any, message: any) => {
allStep: str.match(regex1)[1],
nowStep: str.match(regex2)[1]
}
console.log(mqttMessage.value, '?????????')
console.log(mqttMessage.value, '=============================================185')
let checkedList = tableRef.value.getCheckboxRecords().map((item: any) => {
return item.name
})

View File

@@ -1,4 +1,4 @@
<!-- 谐波频谱 -->
<!-- 实时数据页面 -->
<template>
<div class="harmonic" :style="heightTop">
<div class="harmonic_select">
@@ -275,14 +275,14 @@ const init = () => {
searchForm.value.index.map((item: any, index: any) => {
item?.children.map((vv: any, vvs: any) => {
if (mqttMessage.value[vv.name]) {
console.log(
mqttMessage.value[vv.name],
'这是一个哥哥哥哥哥哥哥哥还是哈哈',
mqttMessage.value.dataTime,
vvs,
index,
vv.name
)
// console.log(
// mqttMessage.value[vv.name],
// '这是一个哥哥哥哥哥哥哥哥还是哈哈',
// mqttMessage.value.dataTime,
// vvs,
// index,
// vv.name
// )
item.linesList = []
item?.data.push({
time: mqttMessage.value.dataTime,
@@ -384,7 +384,7 @@ const init = () => {
searchForm.value.index.length == 3
? (height = mainHeight(275, 3).height)
: (height = mainHeight(275, searchForm.value.index.length).height)
item.children.map((zz: any) => {
item.children.map((zz: any,zzIndex:any) => {
item.echartsData.options.legend.data.push(zz.phase)
item.echartsData.options.series.push({
name: zz.phase,
@@ -393,9 +393,14 @@ const init = () => {
barMaxWidth: 24, //使用的 y 轴的 index在单个图表实例中存在多个 y轴的时候有用
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0]
barBorderRadius: [3, 3, 0, 0],
color:['#DAA520', '#2E8B57', '#A52a2a', '#000'][zzIndex],
// color: '#00CC99'
// }e
// 修改线条颜色
// lineStyle: {
// color: ['#DAA520', '#2E8B57', '#A52a2a', '#000'][index]
// }
},
data: zz.data,
smooth: true, // 这里设置平滑曲线

View File

@@ -1,7 +1,7 @@
<!-- 实时数据 - 实时趋势 -->
<!-- 实时数据 - 谐波频谱页面 -->
<template>
<div class="realtrend" v-loading="loading">
<el-tabs type="border-card" v-if="tabsList.length!=0" v-model="activeName" @tab-click="handleClick">
<el-tabs type="border-card" v-if="tabsList.length != 0" v-model="activeName" @tab-click="handleClick">
<el-tab-pane v-for="(item, index) in tabsList" :label="item.groupName" :name="index" :key="index">
<div>
<div class="realtrend_top">
@@ -28,7 +28,8 @@
</div>
<div class="thead_right">
<div class="right_cell" v-for="(value, key, index) in tableData" :key="index">
<p>
<p v-if="item.groupName.includes('间谐波') && index != 50">{{ index + 0.5 }}</p>
<p v-else>
<span>{{ String(key).replace('data', ' ') }}</span>
</p>
<p>
@@ -55,7 +56,7 @@
</div>
</el-tab-pane>
</el-tabs>
<el-empty v-else/>
<!-- <el-empty v-else/> -->
</div>
</template>
<script lang="ts" setup>
@@ -63,9 +64,7 @@ import { ref, onMounted, reactive, nextTick, defineEmits } from 'vue'
import { VxeGridProps, VxeGridPropTypes } from 'vxe-table'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { Platform, TrendCharts, DataLine } from '@element-plus/icons-vue'
import { getDeviceTrendDataGroup, getDeviceTrendData } from '@/api/cs-device-boot/EquipmentDelivery.ts'
import Index from '@/components/wangEditor/index.vue'
const activeName = ref(0)
const emit = defineEmits(['changeTrendType'])
const tableList: any = []
@@ -85,127 +84,58 @@ const gridOptions = ref<VxeGridProps<RowVO>>({
align: 'center'
})
gridOptions.value = { ...defaultAttribute, ...gridOptions.value }
const myColumns: any = ref([
// { field: 'name', title: '次数' }
// { field: 'value', title: '谐波电压含有率(%)' }
])
const myData = tableList
const tabsList = ref([])
const tabsList: any = ref([])
const loading: any = ref(true)
//接收参数
const params = ref({})
const open = async (val: any) => {
//获取指标tab
loading.value = true
await getDeviceTrendDataGroup().then(res => {
tabsList.value = res.data
if (tabsList.value.length != 0) {
// activeName.value = tabsList.value[0]?.id
activeName.value = val.activeTrendName || 0
//获取指标tab
// await getDeviceTrendDataGroup().then(res => {
// tabsList.value = res.data.reverse()
// if (tabsList.value.length != 0) {
// // activeName.value = tabsList.value[0]?.id
// activeName.value = val.activeTrendName || 0
// }
// params.value = { groupId: tabsList.value[activeName.value]?.id, ...val }
// })
tabsList.value = [
{
id: '6d5470f509ca271d7108a86e83bb283f',
groupName: '谐波电压含有率',
thdDataVOS: null,
thdDataTdVODatas: null
},
{
id: '8dc260f16280184e2b57d26668dc00b1',
groupName: '谐波电流幅值',
thdDataVOS: null,
thdDataTdVODatas: null
},
{
id: 'ae31115b83f02f03a0d3bd65cb017121',
groupName: '间谐波电压含有率',
thdDataVOS: null,
thdDataTdVODatas: null
}
params.value = { groupId: tabsList.value[activeName.value]?.id, ...val }
})
]
if (tabsList.value.length != 0) {
// activeName.value = tabsList.value[0]?.id
activeName.value = val.activeTrendName || 0
}
params.value = { groupId: tabsList.value[activeName.value]?.id, ...val }
init()
setTimeout(() => {
loading.value = false
}, 1500)
return
}
const newTableList: any = ref([])
//根据指标tab查询实时趋势
const loading: any = ref(false)
//echarts数据
const chartsData: any = ref([])
const chartsYxiasData: any = ref([])
const findRealTrendDataByGroupId = (obj: any) => {
return
chartsData.value = []
chartsYxiasData.value = []
getDeviceTrendData(obj).then(res => {
let list: any = []
let countList: any = []
myColumns.value = [{ field: 'name', title: '次数' }]
chartsData.value = res.data[0].thdDataTdVODatas
//处理实时趋势表格
let arr = res.data[0].thdDataVOS
arr.map((item: any, index: any) => {
myColumns.value.push({ field: item.phase, title: item.name })
chartsYxiasData.value.push({ phase: item.phase, title: item.name, phaseList: [], gbList: [] })
//循环第二层数据
item.list = []
item.data.map((vv: any, vvs: any) => {
if (!(vv.statisticalData + '')) {
vv.statisticalData = '/'
}
item.list.push({ value: vv.statisticalData, count: vv.frequency - 0 })
})
list[index + 1] = item.list
const minCount = Math.min(...item.list.map((item: any) => item.count))
const maxCount = Math.max(...item.list.map((item: any) => item.count))
for (let i = 0; i < 50; i++) {
countList[i] = { value: i + minCount + '次', count: i + minCount }
}
countList.map((item: any, index: any) => {
if (item.value.replace('次', '') - 0 > 50) {
countList.splice(index, 1)
}
})
list[0] = countList
if (item.list.length == 0) {
for (let i = 0; i < countList.length; i++) {
item.list.push({
value: '/',
count: index
})
}
}
if (item.list.length != 0) {
const maxCount1 = Math.max(...countList.map((item: any) => item.count))
const maxCount2 = Math.max(...item.list.map((item: any) => item.count))
if (maxCount2 < maxCount1) {
for (let i = 0; i < maxCount1 - maxCount2; i++) {
item.list.push({
value: '/',
count: index
})
}
}
}
})
// 转换为对象数组
list.map((item: any, index: any) => {
item.unshift({ value: myColumns.value[index].title, count: '' })
})
newTableList.value = list
loading.value = false
init()
})
}
//反转表格
const reverseTable = () => {
const buildData = myColumns.value.map(column => {
const item: any = { col0: column.title }
myData.forEach((row, index) => {
item[`col${index + 1}`] = row[column.field]
})
return item
})
const buildColumns: VxeGridPropTypes.Columns = [
{
field: 'col0',
fixed: 'left',
width: 200
}
]
myData.forEach((item, index) => {
buildColumns.push({
field: `col${index + 1}`,
minWidth: 120
})
})
gridOptions.value.data = buildData
gridOptions.value.columns = buildColumns
}
reverseTable()
const echartsData: any = ref([])
const barCharts = ref()
@@ -214,7 +144,6 @@ const barCharts = ref()
const init = () => {
let trendData: any = []
for (let key in tableData.value) {
console.log(key, ',,,,,')
trendData.push({
name: key,
value: tableData.value[key],
@@ -244,21 +173,21 @@ const init = () => {
echartsData.value = {
options: {
// backgroundColor: '#0f375f',
dataZoom: [
{
type: 'inside',
height: 13,
start: 0,
bottom: '20px',
end: 20
},
{
start: 0,
height: 13,
bottom: '20px',
end: 20
}
],
// dataZoom: [
// {
// type: 'inside',
// height: 13,
// start: 0,
// bottom: '20px',
// end: 20
// },
// {
// start: 0,
// height: 13,
// bottom: '20px',
// end: 20
// }
// ],
grid: {
top: '14%',
bottom: '70px', //也可设置left和right设置距离来控制图表的大小
@@ -288,7 +217,7 @@ const init = () => {
xAxis: {
name: '次数',
data: trendData.map((item: any) => {
return item.count+'次'
return item.count + '次'
}),
axisLine: {
show: true, //隐藏X轴轴线
@@ -358,7 +287,6 @@ const init = () => {
if (barCharts.value) {
barCharts.value[activeName.value]?.initChart()
}
loading.value = false
return
}
@@ -371,19 +299,22 @@ const handleClick = (tab: any, event: any) => {
//获取mqtt传送的实时数据
const mqttMessage: any = ref()
const tableData: any = ref({})
const colorList = ['#0e8780', '#FFCC00', '#009900', '#CC0000']
const colorList = ['#DAA520', '#2E8B57', '#A52a2a', '#000']
const setRealTrendData = (val: any) => {
console.log(val, '谐波频谱')
tableData.value = {}
mqttMessage.value = val
loading.value = true
for (let key in val) {
if (String(key).includes('data') && String(key) != 'dataLevel' && String(key) != 'dataTime') {
tableData.value[key] = val[key]
delete tableData.value.data1
}
}
loading.value = false
init()
if (tableData.value) {
init()
} else {
emit('changeTrendType', activeName.value)
}
}
//获取国标限值
const limitData: any = ref()
@@ -485,11 +416,11 @@ defineExpose({ open, setRealTrendData, setOverLimitData })
flex-direction: column;
p {
flex: none;
width: 90px;
width: 60px;
height: 100%;
text-align: center;
border: 1px solid #eee;
line-height: 50px;
line-height: 40px;
margin: 0 !important;
}
p:nth-child(1) {

View File

@@ -149,7 +149,7 @@
v-if="item?.type == 'file'"
src="@/assets/img/wenjian.svg"
/>
<span v-if="!item.type">暂无数据</span>
<!-- <span v-if="!item.type">暂无数据</span> -->
<p>
{{
item &&
@@ -162,7 +162,7 @@
</p>
</div>
</div>
<el-empty v-if="dirList.length === 0" />
<!-- <el-empty v-if="dirList.length === 0" /> -->
</div>
<popup ref="fileRef"></popup>
<el-dialog