update 数据分析-设备效率分析的echarts

This commit is contained in:
g7hoo 2022-09-21 16:58:26 +08:00
parent 9187d56f6c
commit 7ed4a512bc
2 changed files with 58 additions and 42 deletions

View File

@ -167,7 +167,8 @@ export default {
} }
}, },
components: { components: {
BaseTable, EquipmentEfficiencyGraph BaseTable,
EquipmentEfficiencyGraph
}, },
created() { created() {
@ -298,6 +299,9 @@ export default {
this.showGraph = true this.showGraph = true
console.clear()
console.log('inject data: ', injectData)
setTimeout(() => { setTimeout(() => {
// console.log('befoer graph: ', this.$refs.eegraph) // console.log('befoer graph: ', this.$refs.eegraph)
this.$refs.eegraph.init(injectData) // this.$refs.eegraph.init(injectData) //
@ -356,4 +360,3 @@ export default {
transform: translateX(0); transform: translateX(0);
} }
</style> </style>

View File

@ -15,7 +15,7 @@
</svg> </svg>
</span> </span>
<div class="close-row" style="padding-left: 8px;"> <div class="close-row">
<el-radio-group v-model="dataType" class="head-radio-group" size="small" @change="setLegend"> <el-radio-group v-model="dataType" class="head-radio-group" size="small" @change="setLegend">
<el-radio-button label="百分比" /> <el-radio-button label="百分比" />
<el-radio-button label="时间" /> <el-radio-button label="时间" />
@ -100,7 +100,7 @@ class EchartConfigs {
setSeries(val) { setSeries(val) {
this.series.splice(0) this.series.splice(0)
if (Array.isArray(val)) { if (Array.isArray(val) && this.series.length === 0) {
this.series = val this.series = val
} else { } else {
console.error('setSeries() 只接受数组参数') console.error('setSeries() 只接受数组参数')
@ -149,15 +149,11 @@ export default {
无间隔: 1, 无间隔: 1,
按月: 2, 按月: 2,
按周: 3, 按周: 3,
按天: 4 按天: 4,
按小时: 5
} }
return { return {
// current: 1,
// size: 999,
// ftId: this.injectData.factoryId , // id
// wsId: this.injectData.workSequenceId , // id
// productlines: ['1409788336610934786'], // 线ids
type: searchTypeMap[this.searchType], type: searchTypeMap[this.searchType],
eqId: this.injectData.equipmentId, eqId: this.injectData.equipmentId,
startTime: this.injectData.startTime, // '2022-06-14T00:00:00' startTime: this.injectData.startTime, // '2022-06-14T00:00:00'
@ -166,18 +162,32 @@ export default {
}, },
// getOEE // getOEE
getOEE(params) {}, getOEE(params) {
return this.$http({
url: this.$http.adornUrl('/monitoring/eqAnalysis/oee'),
method: 'post',
data: params
}).then(({ data: res }) => {
if (!res.data || res.code === 500) {
this.dataList.splice(0)
this.$message.error(res.msg)
return { data: null }
}
return res.data
})
},
getList() { getList() {
const params = this.makeQuerys() const params = this.makeQuerys()
// //
return this.getOEE(params).then(res => { return this.getOEE(params).then(datalist => {
console.log('getOEE res:', datalist)
this.timeList.splice(0) this.timeList.splice(0)
this.rateList.splice(0) this.rateList.splice(0)
this.xAxis.splice(0) this.xAxis.splice(0)
if (res.data) { if (datalist.length) {
// //
res.data.map(item => { datalist.map(item => {
const time = moment(item.time) const time = moment(item.time)
if (this.searchType === '按月') { if (this.searchType === '按月') {
this.xAxis.push(`${time.year()}${time.month() + 1}`) this.xAxis.push(`${time.year()}${time.month() + 1}`)
@ -264,8 +274,13 @@ export default {
// //
renderGraph() { renderGraph() {
// console.log('latest config: ', this.config) console.log('latest config: ', JSON.stringify(this.config))
this.chart.setOption(this.config) this.$nextTick(() => {
// this.chart.setOption(this.config)
this.chart.setOption(this.config, {
notMerge: true
})
})
} }
} }
} }
@ -273,8 +288,6 @@ export default {
<style scoped> <style scoped>
.graph-area { .graph-area {
margin-top: 18px;
/* background: #f0f0f0; */
width: 100%; width: 100%;
min-height: 200px; min-height: 200px;
position: relative; position: relative;
@ -298,11 +311,11 @@ export default {
} }
.close-btn:hover { .close-btn:hover {
color: #0b58ff; color: #409eff;
} }
.head-radio-group >>> .el-radio-button__orig-radio:checked + .el-radio-button__inner { .head-radio-group >>> .el-radio-button__orig-radio:checked + .el-radio-button__inner {
background-color: #0b58ff; background-color: #409eff;
border-color: #0b58ff; border-color: #409eff;
} }
</style> </style>