forked from mt-fe-group/mt-yd-ui
Merge pull request 'update 数据分析' (#9) from lb into develop
Reviewed-on: mt-fe-group/mt-yd-ui#9
This commit is contained in:
commit
1617bc347a
@ -5,14 +5,15 @@
|
|||||||
<!-- 工厂 -->
|
<!-- 工厂 -->
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<!-- <el-select v-model="dataForm.factoryId" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-select> -->
|
<!-- <el-select v-model="dataForm.factoryId" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-select> -->
|
||||||
<el-select v-model="dataForm.ftId" :placeholder="'工厂'" clearable>
|
<el-select v-model="dataForm.ftId" :placeholder="'工厂'" clearable @change="handleFactoryChange">
|
||||||
<el-option v-for="factory in factoryList" :key="factory.id" :value="factory.id" :label="factory.name" />
|
<el-option v-for="factory in factoryList" :key="factory.id" :value="factory.id" :label="factory.name" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 产线 -->
|
<!-- 产线 -->
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-select v-model="dataForm.productlines" :placeholder="'产线'" multiple clearable>
|
<el-select v-model="dataForm.productlines" :placeholder="'产线'" multiple clearable>
|
||||||
<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id" :label="productLine.name" />
|
<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id"
|
||||||
|
:label="productLine.name" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 时间类型 -->
|
<!-- 时间类型 -->
|
||||||
@ -29,15 +30,8 @@
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 时间段选择 -->
|
<!-- 时间段选择 -->
|
||||||
<el-form-item v-else>
|
<el-form-item v-else>
|
||||||
<el-date-picker
|
<el-date-picker key="time-picker" v-model="rawTime" type="daterange" :range-separator="'至'"
|
||||||
key="time-picker"
|
:start-placeholder="'开始时间'" :end-placeholder="'结束时间'" format="yyyy-MM-dd" />
|
||||||
v-model="rawTime"
|
|
||||||
type="daterange"
|
|
||||||
:range-separator="'至'"
|
|
||||||
:start-placeholder="'开始时间'"
|
|
||||||
:end-placeholder="'结束时间'"
|
|
||||||
format="yyyy-MM-dd"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 按钮 -->
|
<!-- 按钮 -->
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
@ -48,7 +42,8 @@
|
|||||||
|
|
||||||
<transition mode="out-in" name="slide-to-left">
|
<transition mode="out-in" name="slide-to-left">
|
||||||
<equipment-efficiency-graph v-if="showGraph" key="graph" ref="eegraph" @close-graph="showGraph = false" />
|
<equipment-efficiency-graph v-if="showGraph" key="graph" ref="eegraph" @close-graph="showGraph = false" />
|
||||||
<base-table v-else :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
|
<base-table v-else :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)"
|
||||||
|
@operate-event="handleOperations" @refreshDataList="getDataList" />
|
||||||
<!-- v-loading="dataIsLoading " -->
|
<!-- v-loading="dataIsLoading " -->
|
||||||
</transition>
|
</transition>
|
||||||
<!-- <el-pagination
|
<!-- <el-pagination
|
||||||
@ -66,11 +61,11 @@
|
|||||||
<script>
|
<script>
|
||||||
import i18n from '@/i18n'
|
import i18n from '@/i18n'
|
||||||
import BaseTable from '@/components/base-table'
|
import BaseTable from '@/components/base-table'
|
||||||
import TableOperateComponent from '@/components/base-table/components/operationComponent'
|
// import TableOperateComponent from '@/components/base-table/components/operationComponent'
|
||||||
import TableTextComponent from '@/components/base-table/components/detailComponent'
|
import TableTextComponent from '@/components/base-table/components/detailComponent'
|
||||||
import EquipmentEfficiencyGraph from './equipmentEfficiencyGraph.vue'
|
import EquipmentEfficiencyGraph from './equipmentEfficiencyGraph.vue'
|
||||||
import { calcMaxHeight } from '@/utils'
|
import { calcMaxHeight } from '@/utils'
|
||||||
import { timeFilter } from '@/utils/filters'
|
// import { timeFilter } from '@/utils/filters'
|
||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
|
|
||||||
const tableConfigs = [
|
const tableConfigs = [
|
||||||
@ -171,9 +166,10 @@ export default {
|
|||||||
EquipmentEfficiencyGraph
|
EquipmentEfficiencyGraph
|
||||||
},
|
},
|
||||||
|
|
||||||
created() {
|
activated() {
|
||||||
this.getFactoryList()
|
this.getFactoryList().then(() => {
|
||||||
this.getProductLineList()
|
this.getProductLineList()
|
||||||
|
})
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
timeType() {
|
timeType() {
|
||||||
@ -184,12 +180,12 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
// 获取工厂列表
|
// 获取工厂列表
|
||||||
getFactoryList() {
|
getFactoryList() {
|
||||||
this.$http({
|
return this.$http({
|
||||||
url: this.$http.adornUrl('/monitoring/factory/page'),
|
url: this.$http.adornUrl('/monitoring/factory/list'),
|
||||||
method: 'get'
|
method: 'get'
|
||||||
}).then(({ data }) => {
|
}).then(({ data: res }) => {
|
||||||
if (data && data.code === 0) {
|
if (res && res.code === 0) {
|
||||||
this.factoryList = data.data.list
|
this.factoryList = res.data
|
||||||
/** set default */
|
/** set default */
|
||||||
if (this.factoryList.length) {
|
if (this.factoryList.length) {
|
||||||
this.dataForm.ftId = this.factoryList[0].id
|
this.dataForm.ftId = this.factoryList[0].id
|
||||||
@ -200,20 +196,31 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// 选择工厂时
|
||||||
|
handleFactoryChange(val) {
|
||||||
|
this.getProductLineList()
|
||||||
|
},
|
||||||
|
|
||||||
// 获取产线列表
|
// 获取产线列表
|
||||||
getProductLineList() {
|
getProductLineList() {
|
||||||
this.$http({
|
const query = {
|
||||||
url: this.$http.adornUrl('/monitoring/productionLine/page'),
|
url: this.$http.adornUrl('/monitoring/productionLine/list'),
|
||||||
method: 'get'
|
method: 'get'
|
||||||
}).then(({ data }) => {
|
}
|
||||||
if (data && data.code === 0) {
|
if (this.dataForm.ftId) {
|
||||||
this.productLineList = data.data.list
|
query.params = this.$http.adornParams({
|
||||||
|
factoryId: this.dataForm.ftId
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.$http(query).then(({ data: res }) => {
|
||||||
|
if (res && res.code === 0 && res.data.length) {
|
||||||
|
this.productLineList = res.data
|
||||||
/** set default */
|
/** set default */
|
||||||
if (this.productLineList.length) {
|
this.dataForm.productlines = [this.productLineList[0].id]
|
||||||
this.dataForm.productlines = [this.productLineList[0].id]
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
this.productLineList = []
|
this.productLineList = []
|
||||||
|
this.dataForm.productlines = []
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -96,7 +96,7 @@ export default {
|
|||||||
BaseTable
|
BaseTable
|
||||||
},
|
},
|
||||||
|
|
||||||
created() {
|
activated() {
|
||||||
// this.getFactoryList()
|
// this.getFactoryList()
|
||||||
this.getProductLineList()
|
this.getProductLineList()
|
||||||
},
|
},
|
||||||
@ -123,17 +123,18 @@ export default {
|
|||||||
// 获取产线列表
|
// 获取产线列表
|
||||||
getProductLineList() {
|
getProductLineList() {
|
||||||
this.$http({
|
this.$http({
|
||||||
url: this.$http.adornUrl('/monitoring/productionLine/page'),
|
url: this.$http.adornUrl('/monitoring/productionLine/list'),
|
||||||
method: 'get'
|
method: 'get'
|
||||||
}).then(({ data }) => {
|
}).then(({ data: res }) => {
|
||||||
if (data && data.code === 0) {
|
if (res && res.code === 0) {
|
||||||
this.productLineList = data.data.list
|
this.productLineList = res.data
|
||||||
/** set default */
|
/** set default */
|
||||||
if (this.productLineList.length) {
|
if (this.productLineList.length) {
|
||||||
this.dataForm.productlines = [this.productLineList[0].id]
|
this.dataForm.productlines = [this.productLineList[0].id]
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
this.productLineList = []
|
this.productLineList = []
|
||||||
|
this.dataForm.productlines = []
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -5,7 +5,8 @@
|
|||||||
<!-- 产线 -->
|
<!-- 产线 -->
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-select v-model="dataForm.productlines" :placeholder="'产线'" @change="handleProductLineChange" clearable>
|
<el-select v-model="dataForm.productlines" :placeholder="'产线'" @change="handleProductLineChange" clearable>
|
||||||
<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id" :label="productLine.name" />
|
<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id"
|
||||||
|
:label="productLine.name" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 工序 -->
|
<!-- 工序 -->
|
||||||
@ -30,14 +31,8 @@
|
|||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<div class="time-chart" style="margin-top: 10px;">
|
<div class="time-chart" style="margin-top: 10px;">
|
||||||
<div
|
<div v-show="equipmentCount > 0" id="time-chart__inner" ref="time-chart__inner" class="time-chart__inner"
|
||||||
v-show="equipmentCount > 0"
|
style="min-height: 50vh;" :style="{ height: autoHeight + 'px', width: '100%' }" />
|
||||||
id="time-chart__inner"
|
|
||||||
ref="time-chart__inner"
|
|
||||||
class="time-chart__inner"
|
|
||||||
style="min-height: 50vh;"
|
|
||||||
:style="{ height: autoHeight + 'px', width: '100%' }"
|
|
||||||
/>
|
|
||||||
<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>
|
||||||
@ -107,7 +102,7 @@ class ChartOption {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.tooltip = {
|
this.tooltip = {
|
||||||
formatter: function(params) {
|
formatter: function (params) {
|
||||||
return moment(params.value[1]).format('YYYY-MM-DD HH:mm:ss') + ' - ' + moment(params.value[2]).format('YYYY-MM-DD HH:mm:ss') + ' : ' + params.name
|
return moment(params.value[1]).format('YYYY-MM-DD HH:mm:ss') + ' - ' + moment(params.value[2]).format('YYYY-MM-DD HH:mm:ss') + ' : ' + params.name
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -132,7 +127,7 @@ class ChartOption {
|
|||||||
show: true
|
show: true
|
||||||
},
|
},
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
formatter: function(val) {
|
formatter: function (val) {
|
||||||
const time = new Date(val)
|
const time = new Date(val)
|
||||||
const hour = time.getHours()
|
const hour = time.getHours()
|
||||||
const minute = time.getMinutes()
|
const minute = time.getMinutes()
|
||||||
@ -223,17 +218,14 @@ export default {
|
|||||||
BaseTable
|
BaseTable
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
autoHeight: function() {
|
autoHeight: function () {
|
||||||
return Object.keys(this.equipments).length * 100 || 500
|
return Object.keys(this.equipments).length * 100 || 500
|
||||||
},
|
},
|
||||||
equipmentCount: function() {
|
equipmentCount: function () {
|
||||||
return Object.keys(this.equipments).length
|
return Object.keys(this.equipments).length
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.getProductLineList().then(() => {
|
|
||||||
this.getWorksetionList()
|
|
||||||
})
|
|
||||||
this.getEqList()
|
this.getEqList()
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@ -241,6 +233,11 @@ export default {
|
|||||||
this.initChart()
|
this.initChart()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
activated() {
|
||||||
|
this.getProductLineList().then(() => {
|
||||||
|
this.getWorksetionList()
|
||||||
|
})
|
||||||
|
},
|
||||||
updated() {
|
updated() {
|
||||||
if (this.chart) this.chart.resize()
|
if (this.chart) this.chart.resize()
|
||||||
},
|
},
|
||||||
@ -259,11 +256,11 @@ export default {
|
|||||||
// 获取产线列表
|
// 获取产线列表
|
||||||
getProductLineList() {
|
getProductLineList() {
|
||||||
return this.$http({
|
return this.$http({
|
||||||
url: this.$http.adornUrl('/monitoring/productionLine/page'),
|
url: this.$http.adornUrl('/monitoring/productionLine/list'),
|
||||||
method: 'get'
|
method: 'get'
|
||||||
}).then(({ data }) => {
|
}).then(({ data: res }) => {
|
||||||
if (data && data.code === 0) {
|
if (res && res.code === 0) {
|
||||||
this.productLineList = data.data.list
|
this.productLineList = res.data
|
||||||
/** set default */
|
/** set default */
|
||||||
if (this.productLineList.length) {
|
if (this.productLineList.length) {
|
||||||
this.dataForm.productlines = this.productLineList[0].id
|
this.dataForm.productlines = this.productLineList[0].id
|
||||||
@ -354,13 +351,13 @@ export default {
|
|||||||
getDataList() {
|
getDataList() {
|
||||||
let startTime = this.rawTime
|
let startTime = this.rawTime
|
||||||
? moment(this.rawTime)
|
? moment(this.rawTime)
|
||||||
.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
|
.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
|
||||||
.format('YYYY-MM-DDTHH:mm:ss')
|
.format('YYYY-MM-DDTHH:mm:ss')
|
||||||
: ''
|
: ''
|
||||||
let endTime = startTime
|
let endTime = startTime
|
||||||
? moment(startTime)
|
? moment(startTime)
|
||||||
.add(1, 'd')
|
.add(1, 'd')
|
||||||
.format('YYYY-MM-DDTHH:mm:ss')
|
.format('YYYY-MM-DDTHH:mm:ss')
|
||||||
: ''
|
: ''
|
||||||
|
|
||||||
// this.dataListLoading = true
|
// this.dataListLoading = true
|
||||||
@ -471,13 +468,13 @@ export default {
|
|||||||
dialogConfirm() {
|
dialogConfirm() {
|
||||||
let startTime = this.rawTime
|
let startTime = this.rawTime
|
||||||
? moment(this.rawTime)
|
? moment(this.rawTime)
|
||||||
.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
|
.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
|
||||||
.format('YYYY-MM-DDTHH:mm:ss')
|
.format('YYYY-MM-DDTHH:mm:ss')
|
||||||
: ''
|
: ''
|
||||||
let endTime = startTime
|
let endTime = startTime
|
||||||
? moment(startTime)
|
? moment(startTime)
|
||||||
.add(1, 'd')
|
.add(1, 'd')
|
||||||
.format('YYYY-MM-DDTHH:mm:ss')
|
.format('YYYY-MM-DDTHH:mm:ss')
|
||||||
: ''
|
: ''
|
||||||
|
|
||||||
const condition = {
|
const condition = {
|
||||||
|
Loading…
Reference in New Issue
Block a user