故障录波:图表显示时间添加毫秒
单风机:添加风机切换按钮,添加风机名称型号,子系统分类显示调整 风机矩阵:跳转单风机,添加风机名称型号
This commit is contained in:
parent
6af3c059c0
commit
77e7e0f050
@ -8,6 +8,7 @@ export const getAirBlowerListReq = () => {
|
|||||||
belongLine: string
|
belongLine: string
|
||||||
irn: string
|
irn: string
|
||||||
madeinfactory: string
|
madeinfactory: string
|
||||||
|
deviceCode: string
|
||||||
model: string
|
model: string
|
||||||
modelId: string
|
modelId: string
|
||||||
name: string
|
name: string
|
||||||
|
@ -35,7 +35,9 @@
|
|||||||
<div class="cardContentLeft">
|
<div class="cardContentLeft">
|
||||||
<!--实时预览-->
|
<!--实时预览-->
|
||||||
<div class="overview">
|
<div class="overview">
|
||||||
<div class="cardLabel">实时预览</div>
|
<div class="cardLabel">
|
||||||
|
{{ '名称:' + route.query.name + ' ' + '型号:' + route.query.model }}
|
||||||
|
</div>
|
||||||
<div class="overviewDataSection" ref="listContainer">
|
<div class="overviewDataSection" ref="listContainer">
|
||||||
<div class="overviewDataSectionItem">
|
<div class="overviewDataSectionItem">
|
||||||
<span class="realLeft">机组运行状态:</span>
|
<span class="realLeft">机组运行状态:</span>
|
||||||
@ -101,6 +103,14 @@
|
|||||||
<div class="cardContentCenter">
|
<div class="cardContentCenter">
|
||||||
<!--风机控制-->
|
<!--风机控制-->
|
||||||
<div class="controlBackgroundImg">
|
<div class="controlBackgroundImg">
|
||||||
|
<div class="switchWindBlower">
|
||||||
|
<el-tooltip :content="beforeAirBlower.name">
|
||||||
|
<el-icon color="#fff" size="30" @click="switchAirblower(0)"><ArrowLeftBold /></el-icon>
|
||||||
|
</el-tooltip>
|
||||||
|
<el-tooltip :content="afterAirBlower.name">
|
||||||
|
<el-icon color="#fff" size="30" @click="switchAirblower(1)"><ArrowRightBold /></el-icon>
|
||||||
|
</el-tooltip>
|
||||||
|
</div>
|
||||||
<div class="control-type">
|
<div class="control-type">
|
||||||
<el-tag v-if="realTimeData.locked === 1" class="control-tag control-tag-left" type="primary">已锁定</el-tag>
|
<el-tag v-if="realTimeData.locked === 1" class="control-tag control-tag-left" type="primary">已锁定</el-tag>
|
||||||
<el-tag class="control-tag" type="primary">{{ realTimeDataState }}</el-tag>
|
<el-tag class="control-tag" type="primary">{{ realTimeDataState }}</el-tag>
|
||||||
@ -305,14 +315,15 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { nextTick, onActivated, onMounted, reactive, ref, computed, onBeforeMount, onUnmounted, VNode, VNodeRef } from 'vue'
|
import { nextTick, onActivated, onMounted, reactive, ref, computed, watch, onBeforeMount, onUnmounted, VNode, VNodeRef } from 'vue'
|
||||||
import * as echarts from 'echarts'
|
import * as echarts from 'echarts'
|
||||||
import { useEventListener } from '@vueuse/core'
|
import { useEventListener } from '@vueuse/core'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { DArrowRight } from '@element-plus/icons-vue'
|
import { DArrowRight, ArrowLeftBold, ArrowRightBold } from '@element-plus/icons-vue'
|
||||||
import { getRealValueListReq, getRealValueRangeReq } from '/@/api/backend/deviceModel/request'
|
import { getRealValueListReq, getRealValueRangeReq } from '/@/api/backend/deviceModel/request'
|
||||||
import { getModelAttributeListReq } from '/@/api/backend/deviceModel/request'
|
import { getModelAttributeListReq } from '/@/api/backend/deviceModel/request'
|
||||||
import { useRoute } from 'vue-router'
|
import { getAirBlowerListReq } from '/@/api/backend/airBlower/request'
|
||||||
|
import { useRoute, useRouter } from 'vue-router'
|
||||||
import Overview from './overview.vue'
|
import Overview from './overview.vue'
|
||||||
import { TableInstance } from 'element-plus'
|
import { TableInstance } from 'element-plus'
|
||||||
import { dayjs, ElMessage, ElMessageBox } from 'element-plus'
|
import { dayjs, ElMessage, ElMessageBox } from 'element-plus'
|
||||||
@ -323,7 +334,7 @@ import { useEnumStore } from '/@/stores/enums'
|
|||||||
const enumStore = useEnumStore()
|
const enumStore = useEnumStore()
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
const router = useRouter()
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
|
|
||||||
const windBlower = ref()
|
const windBlower = ref()
|
||||||
@ -400,8 +411,9 @@ const initpowerChart = () => {
|
|||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: 'shadow',
|
type: 'line',
|
||||||
},
|
},
|
||||||
|
show: true,
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
@ -602,7 +614,7 @@ const initTrendChart = (type: 'day' | 'month') => {
|
|||||||
top: 30,
|
top: 30,
|
||||||
right: 10,
|
right: 10,
|
||||||
bottom: 20,
|
bottom: 20,
|
||||||
left: 45,
|
left: 100,
|
||||||
borderColor: '#dadada',
|
borderColor: '#dadada',
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
@ -1054,7 +1066,7 @@ const createRealTimeData = async () => {
|
|||||||
realDataForSub[index].type138.push(showData)
|
realDataForSub[index].type138.push(showData)
|
||||||
} else if (item.attributeType === 140) {
|
} else if (item.attributeType === 140) {
|
||||||
const copyData = {
|
const copyData = {
|
||||||
name: item.attributeName +' '+ item.attributeCode,
|
name: item.attributeCode + ' ' + item.attributeName,
|
||||||
value: showData.value,
|
value: showData.value,
|
||||||
}
|
}
|
||||||
realDataForSub[index].type140.push(copyData)
|
realDataForSub[index].type140.push(copyData)
|
||||||
@ -1150,6 +1162,7 @@ const getChartData = <T extends string = any>(params: {
|
|||||||
getRealValueRangeReq(data).then((res) => {
|
getRealValueRangeReq(data).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
const data = res.data[route.query.irn as string]
|
const data = res.data[route.query.irn as string]
|
||||||
|
if (!data) return
|
||||||
const rangeKeys = Object.keys(data)
|
const rangeKeys = Object.keys(data)
|
||||||
const times: any = {}
|
const times: any = {}
|
||||||
const val: any = {}
|
const val: any = {}
|
||||||
@ -1248,6 +1261,8 @@ const getThisDayChartDataForMinute = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const getAllChartData = (type: ('power' | 'trend' | 'frequency')[] = ['power', 'trend', 'frequency']) => {
|
const getAllChartData = (type: ('power' | 'trend' | 'frequency')[] = ['power', 'trend', 'frequency']) => {
|
||||||
|
console.log(type, '-_-----')
|
||||||
|
|
||||||
if (type.includes('power')) {
|
if (type.includes('power')) {
|
||||||
getThisDayChartData().then(() => {
|
getThisDayChartData().then(() => {
|
||||||
initpowerChart()
|
initpowerChart()
|
||||||
@ -1338,7 +1353,60 @@ const getAlarmList = () => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
getAlarmList()
|
const airBlowerList = ref<
|
||||||
|
{
|
||||||
|
irn: string
|
||||||
|
model: string
|
||||||
|
name: string
|
||||||
|
deviceCode: string
|
||||||
|
iotModelId: string
|
||||||
|
}[]
|
||||||
|
>([])
|
||||||
|
|
||||||
|
const getAirBlowerList = () => {
|
||||||
|
getAirBlowerListReq().then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
airBlowerList.value = res.data.map((item) => {
|
||||||
|
return {
|
||||||
|
irn: item.irn,
|
||||||
|
model: item.model,
|
||||||
|
name: item.name,
|
||||||
|
deviceCode: item.deviceCode,
|
||||||
|
iotModelId: item.modelId,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const beforeAirBlower = computed(() => {
|
||||||
|
const len = airBlowerList.value.length
|
||||||
|
if (len === 0) return { irn: '', model: '', name: '', deviceCode: '', iotModelId: '' }
|
||||||
|
const curIndex = airBlowerList.value.findIndex((item) => item.irn === route.query.irn)
|
||||||
|
if (curIndex === 0) return airBlowerList.value[len - 1]
|
||||||
|
return airBlowerList.value[curIndex - 1]
|
||||||
|
})
|
||||||
|
const afterAirBlower = computed(() => {
|
||||||
|
const len = airBlowerList.value.length
|
||||||
|
if (len === 0) return { irn: '', model: '', name: '', deviceCode: '', iotModelId: '' }
|
||||||
|
const curIndex = airBlowerList.value.findIndex((item) => item.irn === route.query.irn)
|
||||||
|
if (curIndex === len - 1) return airBlowerList.value[0]
|
||||||
|
return airBlowerList.value[curIndex + 1]
|
||||||
|
})
|
||||||
|
const switchAirblower = (type: 0 | 1) => {
|
||||||
|
const data = type === 0 ? beforeAirBlower.value : afterAirBlower.value
|
||||||
|
const query = {
|
||||||
|
irn: data.irn,
|
||||||
|
iotModelId: data.iotModelId,
|
||||||
|
deviceCode: data.deviceCode,
|
||||||
|
model: data.model,
|
||||||
|
name: data.name,
|
||||||
|
}
|
||||||
|
router.push({
|
||||||
|
name: 'windTurbine',
|
||||||
|
query,
|
||||||
|
})
|
||||||
|
}
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
window.addEventListener('resize', sizeChange)
|
window.addEventListener('resize', sizeChange)
|
||||||
sizeChange()
|
sizeChange()
|
||||||
@ -1346,6 +1414,8 @@ onMounted(() => {
|
|||||||
createScroll()
|
createScroll()
|
||||||
useEventListener(window, 'resize', echartsResize)
|
useEventListener(window, 'resize', echartsResize)
|
||||||
autoUpdate()
|
autoUpdate()
|
||||||
|
getAlarmList()
|
||||||
|
getAirBlowerList()
|
||||||
})
|
})
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
@ -1356,8 +1426,34 @@ onUnmounted(() => {
|
|||||||
const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
|
const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
|
||||||
chartKeys.forEach((key) => {
|
chartKeys.forEach((key) => {
|
||||||
state.charts[key] && state.charts[key].dispose()
|
state.charts[key] && state.charts[key].dispose()
|
||||||
|
state.charts[key] = null
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => route.query.irn,
|
||||||
|
() => {
|
||||||
|
console.log('切换风机', route.query.name)
|
||||||
|
|
||||||
|
autoUpdateForSecondTimer && clearInterval(autoUpdateForSecondTimer)
|
||||||
|
autoUpdateForSecondTimer = null
|
||||||
|
autoUpdateTimerForHourTimer && clearInterval(autoUpdateTimerForHourTimer)
|
||||||
|
autoUpdateTimerForHourTimer = null
|
||||||
|
autoUpdateTimerForMinuteTimer && clearInterval(autoUpdateTimerForMinuteTimer)
|
||||||
|
autoUpdateTimerForMinuteTimer = null
|
||||||
|
const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
|
||||||
|
chartKeys.forEach((key) => {
|
||||||
|
state.charts[key] && state.charts[key].dispose()
|
||||||
|
state.charts[key] = null
|
||||||
|
})
|
||||||
|
|
||||||
|
nextTick(() => {
|
||||||
|
autoUpdate()
|
||||||
|
getAlarmList()
|
||||||
|
getAllChartData()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
@ -1515,6 +1611,28 @@ $labelHeight: 38px;
|
|||||||
aspect-ratio: 43 / 24;
|
aspect-ratio: 43 / 24;
|
||||||
background: url('/@/assets/WindBlower/bg.png') no-repeat;
|
background: url('/@/assets/WindBlower/bg.png') no-repeat;
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
|
&:hover {
|
||||||
|
.switchWindBlower {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.switchWindBlower {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 5%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: 100px;
|
||||||
|
height: 40px;
|
||||||
|
// background-color: red;
|
||||||
|
opacity: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
transition: opacity 0.4s;
|
||||||
|
.el-icon:hover {
|
||||||
|
cursor: pointer;
|
||||||
|
color: rgba(255, 255, 255, 0.7);
|
||||||
|
}
|
||||||
|
}
|
||||||
.control-type {
|
.control-type {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -655,6 +655,8 @@ const openWindTurbine = (row: TableDataObjType) => {
|
|||||||
irn: row.irn,
|
irn: row.irn,
|
||||||
iotModelId: row.iotModelId,
|
iotModelId: row.iotModelId,
|
||||||
deviceCode: row.deviceCode,
|
deviceCode: row.deviceCode,
|
||||||
|
model: row.model,
|
||||||
|
name:row.name
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -39,6 +39,7 @@ export type TableColumnType = {
|
|||||||
align?: 'left' | 'right' | 'center'
|
align?: 'left' | 'right' | 'center'
|
||||||
custom?: 'header' | 'default'
|
custom?: 'header' | 'default'
|
||||||
type?: 'default' | 'selection' | 'index' | 'expand'
|
type?: 'default' | 'selection' | 'index' | 'expand'
|
||||||
|
sortable?:boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export type CommandReqType = {
|
export type CommandReqType = {
|
||||||
|
@ -126,6 +126,8 @@ const handleDoubleClick = (row) => {
|
|||||||
irn: row.irn,
|
irn: row.irn,
|
||||||
iotModelId: row.modelId,
|
iotModelId: row.modelId,
|
||||||
name: row.name,
|
name: row.name,
|
||||||
|
deviceCode: row.deviceCode,
|
||||||
|
model: row.model,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -125,6 +125,8 @@ const handleClick = (row) => {
|
|||||||
irn: row.irn,
|
irn: row.irn,
|
||||||
iotModelId: row.modelId,
|
iotModelId: row.modelId,
|
||||||
deviceCode: row.deviceCode,
|
deviceCode: row.deviceCode,
|
||||||
|
name: row.name,
|
||||||
|
model: row.model,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -466,11 +466,11 @@ const readFile = (data: tableItemData) => {
|
|||||||
attrName.forEach((item) => {
|
attrName.forEach((item) => {
|
||||||
if (item === 'TimeStamp') {
|
if (item === 'TimeStamp') {
|
||||||
previewChartData.TimeStamp = previewChartData.TimeStamp.map((item: any) => {
|
previewChartData.TimeStamp = previewChartData.TimeStamp.map((item: any) => {
|
||||||
return dayjs(item).format('YYYY-MM-DD HH:mm:ss')
|
return dayjs(item).format('YYYY-MM-DD HH:mm:ss.SSS')
|
||||||
})
|
})
|
||||||
} else if (item === 'TimeStampUTC') {
|
} else if (item === 'TimeStampUTC') {
|
||||||
previewChartData.TimeStamp = previewChartData.TimeStampUTC.map((item: any) => {
|
previewChartData.TimeStamp = previewChartData.TimeStampUTC.map((item: any) => {
|
||||||
return dayjs(item).format('YYYY-MM-DD HH:mm:ss')
|
return dayjs(item).format('YYYY-MM-DD HH:mm:ss.SSS')
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
data.push({
|
data.push({
|
||||||
@ -625,7 +625,7 @@ const initPreviewChart = () => {
|
|||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: 'shadow',
|
type: 'line',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
|
Loading…
Reference in New Issue
Block a user