diff --git a/src/views/modules/monitoring/equipmentTimesequence.vue b/src/views/modules/monitoring/equipmentTimesequence.vue
index 15a859e..69074c4 100644
--- a/src/views/modules/monitoring/equipmentTimesequence.vue
+++ b/src/views/modules/monitoring/equipmentTimesequence.vue
@@ -32,8 +32,8 @@
id="time-chart__inner"
ref="time-chart__inner"
class="time-chart__inner"
- style="width: 100%; min-height: 50vh;"
- :style="{ height: autoHeight + 'px' }"
+ style="min-height: 50vh;"
+ :style="{ height: autoHeight + 'px', width: '100%' }"
/>
请先查询数据
@@ -112,6 +112,9 @@ class ChartOption {
show: true,
alignWithLabel: true
},
+ splitLine: {
+ show: true
+ },
axisLine: {
show: true
},
@@ -188,7 +191,7 @@ export default {
rawTime: new Date(),
dataForm: {
wsId: null,
- productlines: [],
+ productlines: null,
startTime: null,
entTime: null
},
@@ -215,6 +218,14 @@ export default {
this.getWorksetionList()
})
},
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart()
+ })
+ },
+ updated() {
+ if (this.chart) this.chart.resize()
+ },
watch: {
timeType() {
// 防止切换日期类型时报错
@@ -279,7 +290,7 @@ export default {
dataList.map(item => {
if (equipments[item.eqId]) {
// 如果设备已存在
- equipments[item.eqId].name = item.eqName
+ // equipments[item.eqId].name = item.eqName
equipments[item.eqId].status.push({
startTime: +new Date(item.startTime),
endTime: +new Date(item.endTime),
@@ -298,7 +309,7 @@ export default {
}
}
})
- // console.log('items --- ', equipments)
+ console.log('created equipments --- ', equipments)
return equipments
},
// 把分组好的设备数据转换为echarts需要的series数据
@@ -324,16 +335,26 @@ export default {
getDataList() {
let startTime = this.rawTime
? moment(this.rawTime)
- .set({ date: 1, hour: 0, minute: 0, second: 0, millisecond: 0 })
+ .set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
.format('YYYY-MM-DDTHH:mm:ss')
: ''
let endTime = startTime
? moment(startTime)
- .add(1, 'M')
+ .add(1, 'd')
.format('YYYY-MM-DDTHH:mm:ss')
: ''
+ const productlines = this.dataForm.productlines ? [this.dataForm.productlines] : []
+ const wsId = this.dataForm.wsId || ''
+
+ /** keep a copy of query conditions */
+ this.$set(this.queryBuffer, 'productlines', productlines)
+ this.$set(this.queryBuffer, 'wsId', wsId)
+ this.$set(this.queryBuffer, 'startTime', startTime)
+ this.$set(this.queryBuffer, 'endTime', endTime)
this.dataListLoading = true
+
+ /** fetch data */
this.$http({
url: this.$http.adornUrl('/monitoring/eqAnalysis/timeAndStatus'),
method: 'post',
@@ -346,15 +367,64 @@ export default {
}).then(({ data: res }) => {
if (res.code === 500) {
this.dataList.splice(0)
+ this.equipments = {} // 关闭 echarts 的显示
this.$message.error(res.msg)
} else {
- this.dataList = res.data
+ /** handle actual data */
+ this.dataList = res.data
+
+ /** test data */
+ // this.dataList = [
+ // {
+ // eqId: 'eq-001',
+ // eqName: 'A1预热机',
+ // startTime: '2022-05-04T00:30:34',
+ // endTime: '2022-05-04T08:30:34',
+ // status: 0
+ // },
+ // {
+ // eqId: 'eq-001',
+ // eqName: 'A1预热机',
+ // startTime: '2022-05-04T08:30:34',
+ // endTime: '2022-05-04T09:30:34',
+ // status: 1
+ // },
+ // {
+ // eqId: 'eq-001',
+ // eqName: 'A1预热机',
+ // startTime: '2022-05-04T09:30:34',
+ // endTime: '2022-05-04T11:30:34',
+ // status: 2
+ // },
+ // {
+ // eqId: 'eq-001',
+ // eqName: 'A1预热机',
+ // startTime: '2022-05-04T11:30:34',
+ // endTime: '2022-05-04T13:30:34',
+ // status: 1
+ // }
+ // ]
+
+ this.equipments = this.transformDataToEquipments(this.dataList)
+ this.chartOption.setYAxis(Object.keys(this.equipments).map(eId => this.equipments[eId].name))
+ console.log('(((set x axis))): ', this.dataList[0].startTime)
+ this.chartOption.setXAxis(this.dataList[0].startTime)
+ this.chartOption.setData(this.transformEquipmentsToSeries(this.equipments))
+
+ this.$nextTick(() => {
+ this.renderChart()
+ })
}
})
},
handleProductLineChange(val) {
this.getWorksetionList()
},
+ // 渲染 echarts
+ renderChart() {
+ console.log('>>> chart configs: ', this.chartOption)
+ this.chart.setOption(this.chartOption)
+ },
// 每页数
sizeChangeHandle(val) {
this.pageSize = val
@@ -383,3 +453,9 @@ export default {
}
}
+
+