mt-yd-ui/src/views/modules/monitoring/equipmentHistoricalParameters.vue
2023-02-03 16:44:47 +08:00

128 lines
3.5 KiB
Vue

<template>
<div class="mod-config">
<el-form :inline="true" class="blueTip" size="small">
<!-- <el-form-item>
{{ $t('eq.plcname') }}
</el-form-item>
<el-form-item>
<el-select v-model="dataForm.lineId" :placeholder="$t('eq.plcname')" clearable>
<el-option v-for="line in lineList" :key="line.code" :value="line.id" :label="line.name" />
</el-select>
</el-form-item> -->
<!-- <el-form-item :label="$t('eqId')">
<strong>{{ $route.params.id }}</strong>
</el-form-item> -->
<el-form-item :label="$t('equName')">
<strong>{{ equipmentName }}</strong>
</el-form-item>
<el-form-item :label="$t('equCode')">
<strong>{{ equipmentCode }}</strong>
</el-form-item>
</el-form>
<!-- <base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" /> -->
<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
</div>
</template>
<script>
import { calcMaxHeight } from '@/utils'
import { timeFilter } from '@/utils/filters'
import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
import i18n from '@/i18n'
import BaseTable from '@/components/base-table'
import { pick } from 'lodash/object'
import equipmentVue from './equipment.vue'
export default {
data() {
return {
calcMaxHeight,
equipmentName: null,
equipmentCode: null,
tableConfigs: [],
dataList: [],
dataListLoading: false,
dataListSelections: []
}
},
components: {
AddOrUpdate,
BaseTable
},
activated() {
this.getDataList()
},
mouted() {
this.getDataList()
},
created(){
// console.log('params',this.$route.params)
},
methods: {
// destroy dialog
handleDestroyDialog() {
setTimeout(() => {
this.addOrUpdateVisible = false
}, /** after dialog animated */ 200)
},
// 获取数据列表
getDataList() {
this.dataListLoading = true
this.$http({
url: this.$http.adornUrl(`/monitoring/equipmentValueMonitor/runLog/${this.$route.params.id}`),
method: 'get'
}).then(({ data: res }) => {
console.log('res',res)
if (
res &&
res.code === 0 &&
res.data &&
res.data.length > 0 &&
res.data[0].nameData &&
res.data[0].nameData.length > 0 &&
res.data[0].data &&
res.data[0].data.length > 0
) {
this.equipmentName = res.data[0].data[0].equName
this.equipmentCode = res.data[0].data[0].equCode
console.log(this.equipmentName)
this.setTableProps(res.data[0].nameData)
this.setTableData(res.data[0].data)
} else {
this.dataList = []
}
this.dataListLoading = false
})
},
setTableProps(nameData) {
this.tableConfigs = [
{
type: 'index',
name: i18n.t('index')
},
{ prop: 'time', name: this.$t('ti'), filter: timeFilter },
{ prop: 'plcCode', name: this.$t('plcCode') },
// { prop: 'equName', name: this.$t('equName') },
// { prop: 'equCode', name: this.$t('equCode') },
// ...['数值1', '数值2', '数值3'].map(name => {
// return { prop: name, name }
// })
...Array.from(new Set(nameData.map((item) => item.name))).map((name) => ({ prop: name, name }))
]
},
setTableData(data) {
this.dataList = data.map((item) => {
const rowItem = pick(item, ['time', 'plcCode', 'equName', 'equCode'])
if (item.data && item.data.length > 0) {
item.data.forEach((param) => {
rowItem[param.dynamicName] = param.dynamicValue
})
}
return rowItem
})
}
}
}
</script>