update 基本完成设备状态时序图
This commit is contained in:
parent
5a45aead7c
commit
4f39481693
@ -24,6 +24,9 @@
|
|||||||
<el-button @click="getDataList()">{{ $t('search') }}</el-button>
|
<el-button @click="getDataList()">{{ $t('search') }}</el-button>
|
||||||
<!-- <el-button v-if="$hasPermission('monitoring:equipmentEffiency:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
|
<!-- <el-button v-if="$hasPermission('monitoring:equipmentEffiency:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="success" @click="addEq()">{{ '添加设备' }}</el-button>
|
||||||
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<div class="time-chart" style="margin-top: 10px;">
|
<div class="time-chart" style="margin-top: 10px;">
|
||||||
@ -38,6 +41,16 @@
|
|||||||
<div v-show="equipmentCount === 0">请先查询数据</div>
|
<div v-show="equipmentCount === 0">请先查询数据</div>
|
||||||
<!-- <div v-show="equipmentCount === 0">{{ $t('module.basicData.visual.hints.searchFirst') }}</div> -->
|
<!-- <div v-show="equipmentCount === 0">{{ $t('module.basicData.visual.hints.searchFirst') }}</div> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<el-dialog :visible.sync="dialogVisible" :title="'添加设备'" width="30%">
|
||||||
|
<el-select v-model="eqId" style="width: 100%" placeholder="请选择设备" clearable>
|
||||||
|
<el-option v-for="eq in dialogEqList" :key="eq.id" :label="eq.name" :value="eq.id" />
|
||||||
|
</el-select>
|
||||||
|
<div slot="footer">
|
||||||
|
<el-button @click="dialogVisible = false">{{ '取消' }}</el-button>
|
||||||
|
<el-button type="primary" @click="dialogConfirm">{{ '确定' }}</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -183,7 +196,7 @@ export default {
|
|||||||
equipments: {},
|
equipments: {},
|
||||||
state: ['正常', '停机', '故障'],
|
state: ['正常', '停机', '故障'],
|
||||||
colors: ['#4caf50', '#ffb300', '#e53935'],
|
colors: ['#4caf50', '#ffb300', '#e53935'],
|
||||||
queryBuffer: {},
|
// queryBuffer: {},
|
||||||
// tableConfigs,
|
// tableConfigs,
|
||||||
calcMaxHeight,
|
calcMaxHeight,
|
||||||
timeType: 'range',
|
timeType: 'range',
|
||||||
@ -199,7 +212,11 @@ export default {
|
|||||||
pageIndex: 1,
|
pageIndex: 1,
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
totalPage: 0,
|
totalPage: 0,
|
||||||
dataListLoading: false
|
dataListLoading: false,
|
||||||
|
/** dialog */
|
||||||
|
dialogVisible: false,
|
||||||
|
eqId: null,
|
||||||
|
dialogEqList: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
@ -217,6 +234,7 @@ export default {
|
|||||||
this.getProductLineList().then(() => {
|
this.getProductLineList().then(() => {
|
||||||
this.getWorksetionList()
|
this.getWorksetionList()
|
||||||
})
|
})
|
||||||
|
this.getEqList()
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
@ -312,6 +330,7 @@ export default {
|
|||||||
console.log('created equipments --- ', equipments)
|
console.log('created equipments --- ', equipments)
|
||||||
return equipments
|
return equipments
|
||||||
},
|
},
|
||||||
|
|
||||||
// 把分组好的设备数据转换为echarts需要的series数据
|
// 把分组好的设备数据转换为echarts需要的series数据
|
||||||
transformEquipmentsToSeries(equipments) {
|
transformEquipmentsToSeries(equipments) {
|
||||||
const seriesData = []
|
const seriesData = []
|
||||||
@ -343,27 +362,20 @@ export default {
|
|||||||
.add(1, 'd')
|
.add(1, 'd')
|
||||||
.format('YYYY-MM-DDTHH:mm:ss')
|
.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.dataListLoading = true
|
||||||
this.$set(this.queryBuffer, 'productlines', productlines)
|
const condition = {
|
||||||
this.$set(this.queryBuffer, 'wsId', wsId)
|
startTime,
|
||||||
this.$set(this.queryBuffer, 'startTime', startTime)
|
endTime,
|
||||||
this.$set(this.queryBuffer, 'endTime', endTime)
|
productlines: [this.dataForm.productlines],
|
||||||
|
wsId: this.dataForm.wsId
|
||||||
this.dataListLoading = true
|
}
|
||||||
|
|
||||||
/** fetch data */
|
/** fetch data */
|
||||||
this.$http({
|
this.$http({
|
||||||
url: this.$http.adornUrl('/monitoring/eqAnalysis/timeAndStatus'),
|
url: this.$http.adornUrl('/monitoring/eqAnalysis/timeAndStatus'),
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: {
|
data: condition
|
||||||
startTime,
|
|
||||||
endTime,
|
|
||||||
productlines: [this.dataForm.productlines],
|
|
||||||
wsId: this.dataForm.wsId
|
|
||||||
}
|
|
||||||
}).then(({ data: res }) => {
|
}).then(({ data: res }) => {
|
||||||
if (res.code === 500) {
|
if (res.code === 500) {
|
||||||
this.dataList.splice(0)
|
this.dataList.splice(0)
|
||||||
@ -371,8 +383,8 @@ export default {
|
|||||||
this.$message.error(res.msg)
|
this.$message.error(res.msg)
|
||||||
} else {
|
} else {
|
||||||
/** handle actual data */
|
/** handle actual data */
|
||||||
this.dataList = res.data
|
this.dataList = res.data
|
||||||
|
|
||||||
/** test data */
|
/** test data */
|
||||||
// this.dataList = [
|
// this.dataList = [
|
||||||
// {
|
// {
|
||||||
@ -417,14 +429,91 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
handleProductLineChange(val) {
|
handleProductLineChange(val) {
|
||||||
this.getWorksetionList()
|
this.getWorksetionList()
|
||||||
},
|
},
|
||||||
|
|
||||||
// 渲染 echarts
|
// 渲染 echarts
|
||||||
renderChart() {
|
renderChart() {
|
||||||
console.log('>>> chart configs: ', this.chartOption)
|
console.log('>>> chart configs: ', this.chartOption)
|
||||||
this.chart.setOption(this.chartOption)
|
this.chart.setOption(this.chartOption)
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// 获取对话框里的设备列表
|
||||||
|
getEqList() {
|
||||||
|
this.$http({
|
||||||
|
url: this.$http.adornUrl('/monitoring/equipment/page'),
|
||||||
|
method: 'get',
|
||||||
|
params: this.$http.adornParams({
|
||||||
|
page: 1,
|
||||||
|
limit: 99999
|
||||||
|
})
|
||||||
|
}).then(({ data }) => {
|
||||||
|
if (data && data.code === 0) {
|
||||||
|
this.dialogEqList = data.data.list
|
||||||
|
} else {
|
||||||
|
this.dialogEqList.splice(0)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 添加设备
|
||||||
|
addEq() {
|
||||||
|
if (this.equipmentCount) {
|
||||||
|
this.dialogVisible = true
|
||||||
|
} else {
|
||||||
|
this.$message.warning('请先查询数据')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 确认添加设备
|
||||||
|
dialogConfirm() {
|
||||||
|
let startTime = this.rawTime
|
||||||
|
? moment(this.rawTime)
|
||||||
|
.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
|
||||||
|
.format('YYYY-MM-DDTHH:mm:ss')
|
||||||
|
: ''
|
||||||
|
let endTime = startTime
|
||||||
|
? moment(startTime)
|
||||||
|
.add(1, 'd')
|
||||||
|
.format('YYYY-MM-DDTHH:mm:ss')
|
||||||
|
: ''
|
||||||
|
|
||||||
|
const condition = {
|
||||||
|
startTime,
|
||||||
|
endTime,
|
||||||
|
productlines: [this.dataForm.productlines],
|
||||||
|
wsId: this.dataForm.wsId,
|
||||||
|
eqId: this.eqId
|
||||||
|
}
|
||||||
|
|
||||||
|
/** fetch data */
|
||||||
|
this.$http({
|
||||||
|
url: this.$http.adornUrl('/monitoring/eqAnalysis/timeAndStatus'),
|
||||||
|
method: 'post',
|
||||||
|
data: condition
|
||||||
|
}).then(({ data: res }) => {
|
||||||
|
if (res.code === 500) {
|
||||||
|
this.$message.error(res.msg)
|
||||||
|
} else {
|
||||||
|
/** handle new equipment */
|
||||||
|
const newEqStatusList = res.data
|
||||||
|
console.log('添加设备', res)
|
||||||
|
const newEq = this.transformDataToEquipments(newEqStatusList)
|
||||||
|
this.$set(this.equipments, Object.keys(newEq)[0], newEq[Object.keys(newEq)[0]])
|
||||||
|
this.chartOption.setYAxis(Object.keys(this.equipments).map(item => this.equipments[item].name))
|
||||||
|
this.chartOption.setData(this.transformEquipmentsToSeries(this.equipments))
|
||||||
|
|
||||||
|
this.$message.success('新设备数据获取成功')
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.dialogVisible = false
|
||||||
|
this.renderChart()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
// 每页数
|
// 每页数
|
||||||
sizeChangeHandle(val) {
|
sizeChangeHandle(val) {
|
||||||
this.pageSize = val
|
this.pageSize = val
|
||||||
|
Loading…
Reference in New Issue
Block a user