Skip to content

Z
zhongtong-avi-web
Commit a739ed31 authored by 李志鸣's avatar 李志鸣
Browse files
Options

fea(监控大屏): 修改设备运行时间统计图表

parent 4bb8089d
Hide whitespace changes
Inline Side-by-side
Showing with 234 additions and 165 deletions
src/interface/apis.js
View file @ a739ed31
...@@ -157,6 +157,10 @@ ...@@ -157,6 +157,10 @@
} }
}, },
"equipment-controller": { "equipment-controller": {
"data-get": {
"url": "/api/equipment/data",
"method": "get"
},
"export-post": { "export-post": {
"url": "/api/equipment/data/export", "url": "/api/equipment/data/export",
"method": "post" "method": "post"
...@@ -169,6 +173,10 @@ ...@@ -169,6 +173,10 @@
"url": "/api/equipment/file/upload", "url": "/api/equipment/file/upload",
"method": "post" "method": "post"
}, },
"findByShopCode-get": {
"url": "/api/equipment/findByShopCode",
"method": "get"
},
"transfer-post": { "transfer-post": {
"url": "/api/equipment/program/transfer", "url": "/api/equipment/program/transfer",
"method": "post" "method": "post"
...@@ -259,6 +267,10 @@ ...@@ -259,6 +267,10 @@
"url": "/api/v1/group", "url": "/api/v1/group",
"method": "put" "method": "put"
}, },
"page-post": {
"url": "/api/v1/group/page",
"method": "post"
},
"role-post": { "role-post": {
"url": "/api/v1/group/role", "url": "/api/v1/group/role",
"method": "post" "method": "post"
...@@ -275,6 +287,10 @@ ...@@ -275,6 +287,10 @@
"url": "/api/v1/group/tree/user", "url": "/api/v1/group/tree/user",
"method": "get" "method": "get"
}, },
"groupId-get": {
"url": "/api/v1/group/{groupId}",
"method": "get"
},
"groupId-delete": { "groupId-delete": {
"url": "/api/v1/group/{groupId}", "url": "/api/v1/group/{groupId}",
"method": "delete" "method": "delete"
...@@ -401,6 +417,14 @@ ...@@ -401,6 +417,14 @@
"url": "/api/v1/user/group/users", "url": "/api/v1/user/group/users",
"method": "get" "method": "get"
}, },
"id-get": {
"url": "/api/v1/user/id/{id}",
"method": "get"
},
"userId-delete": {
"url": "/api/v1/user/id/{userId}",
"method": "delete"
},
"no-get": { "no-get": {
"url": "/api/v1/user/no/{no}", "url": "/api/v1/user/no/{no}",
"method": "get" "method": "get"
...@@ -409,6 +433,10 @@ ...@@ -409,6 +433,10 @@
"url": "/api/v1/user/page", "url": "/api/v1/user/page",
"method": "get" "method": "get"
}, },
"page-post": {
"url": "/api/v1/user/page",
"method": "post"
},
"list-get": { "list-get": {
"url": "/api/v1/user/resource/list", "url": "/api/v1/user/resource/list",
"method": "get" "method": "get"
...@@ -609,6 +637,14 @@ ...@@ -609,6 +637,14 @@
"url": "/api/v2/workStation/delete/{id}", "url": "/api/v2/workStation/delete/{id}",
"method": "delete" "method": "delete"
}, },
"eqpRelation-post": {
"url": "/api/v2/workStation/eqpRelation",
"method": "post"
},
"eqpRelation-put": {
"url": "/api/v2/workStation/eqpRelation",
"method": "put"
},
"workPositionId-post": { "workPositionId-post": {
"url": "/api/v2/workStation/equipmentRelation/{workPositionId}", "url": "/api/v2/workStation/equipmentRelation/{workPositionId}",
"method": "post" "method": "post"
...@@ -633,6 +669,10 @@ ...@@ -633,6 +669,10 @@
"url": "/api/v2/workStation/pageEqpRelation", "url": "/api/v2/workStation/pageEqpRelation",
"method": "get" "method": "get"
}, },
"pageEquip-post": {
"url": "/api/v2/workStation/pageEquip",
"method": "post"
},
"username-get": { "username-get": {
"url": "/api/v2/workStation/pdaUser/{username}", "url": "/api/v2/workStation/pdaUser/{username}",
"method": "get" "method": "get"
...@@ -702,6 +742,10 @@ ...@@ -702,6 +742,10 @@
"busNo-get": { "busNo-get": {
"url": "/area/detail/busNo", "url": "/area/detail/busNo",
"method": "get" "method": "get"
},
"test-get": {
"url": "/area/test",
"method": "get"
} }
}, },
"report-controller": { "report-controller": {
...@@ -725,6 +769,10 @@ ...@@ -725,6 +769,10 @@
"url": "/area/oeuTrend", "url": "/area/oeuTrend",
"method": "get" "method": "get"
}, },
"runTimeList-get": {
"url": "/area/runTimeList",
"method": "get"
},
"stateTrend-get": { "stateTrend-get": {
"url": "/area/stateTrend", "url": "/area/stateTrend",
"method": "get" "method": "get"
......
src/views/Basic/DeviceBasic/list.vue
View file @ a739ed31
...@@ -226,19 +226,19 @@ ...@@ -226,19 +226,19 @@
}, },
// 获取设备分类数据 // 获取设备分类数据
getSeviceSortSelectData () { getSeviceSortSelectData () {
let queryParams = { dicCode: 'DEVICE_SORT', hash: 'dicCode' }; let queryParams = { dicCode: 'DEVICE_SORT', hash: 'dicCode' }
this.$fetch('dict-item-controller/dicCode-get', queryParams).then(response => { this.$fetch('dict-item-controller/dicCode-get', queryParams).then(response => {
this.equipTypeData = _.cloneDeep(response); this.equipTypeData = _.cloneDeep(response)
}); });
} }
}, },
mounted () { mounted () {
setTimeout(() => { setTimeout(() => {
this.tableConfig.height = document.querySelector('.page-pack').offsetHeight - 210; this.tableConfig.height = document.querySelector('.page-pack').offsetHeight - 210
// 获取设备分类数据 // 获取设备分类数据
this.getSeviceSortSelectData(); this.getSeviceSortSelectData()
// 获取表格数据 // 获取表格数据
this.getTableList(); this.getTableList()
}, 0) }, 0)
} }
} }
......
src/views/CenterControl/components/MachineFailureTrend.vue
View file @ a739ed31
...@@ -95,7 +95,6 @@ ...@@ -95,7 +95,6 @@
lineStyle: { lineStyle: {
color: '#234eb6' color: '#234eb6'
} }
}, },
axisLine: { axisLine: {
lineStyle: { lineStyle: {
...@@ -199,4 +198,4 @@ ...@@ -199,4 +198,4 @@
width: 607px; width: 607px;
} }
} }
</style> </style>
\ No newline at end of file
src/views/CenterControl/components/MachineStateTrend.vue
View file @ a739ed31
<template> <template>
<!--设备累计运行时间统计-->
<div class="machine-state-trend"> <div class="machine-state-trend">
<div class="search-pack"> <div class="search-pack">
<el-date-picker <el-select
style="width: 135px;" class="select-reset"
class="date-picker-reset" v-model="workshopCode"
v-model="startTime" placeholder="请选择车间"
type="date" size="small"
placeholder="开始时间"> clearable>
</el-date-picker> <el-option
<span class="middle-text">至</span> v-for="(item, index) in workshopList"
<el-date-picker :key="index"
style="width: 135px;" :label="item.label"
class="date-picker-reset" :value="item.value">
v-model="endTime" </el-option>
type="date" </el-select>
placeholder="结束时间">
</el-date-picker>
<el-button <el-button
class="ml-10" class="ml-10"
@click="doConfirmClick()" @click="doConfirmClick()"
...@@ -40,24 +39,48 @@ ...@@ -40,24 +39,48 @@
}, },
watch: { watch: {
pollingRequestTime (newVal, oldVal) { pollingRequestTime (newVal, oldVal) {
if (this.workshopCode === '') {
this.workshopCode = this.workshopList[0].value
}
// 请求设备状态趋势图图表数据 // 请求设备状态趋势图图表数据
this.getMachineStateTrendEchartData() this.getMachineStateTrendEchartData()
} }
}, },
data () { data () {
return { return {
// 开始时间 // 车间
startTime: '', workshopCode: '',
// 结束时间 // 车间数据
endTime: '', workshopList: [
// 图表时间数据 {
echartTimeData: [], label: '制件车间',
// 图表故障率数据 value: 'PARTS'
echartFailureData: [], },
// 图表运行率数据 {
echartRunningData: [], label: '焊装车间',
// 图表待机率数据 value: 'WELDING'
echartLoadingData: [] },
{
label: '涂装车间',
value: 'PAINTING'
},
{
label: '底盘车间',
value: 'CHASSIS'
},
{
label: '装配车间',
value: 'ASSEMBLY'
},
{
label: '试交车间',
value: 'TRIAL'
}
],
// 图表X轴设备名称
machineNameList: [],
// 图表Y轴运行时间
machineRunTime: []
} }
}, },
methods: { methods: {
...@@ -66,132 +89,97 @@ ...@@ -66,132 +89,97 @@
let domItem = document.getElementById('stateTrendChart') let domItem = document.getElementById('stateTrendChart')
echarts.dispose(domItem) echarts.dispose(domItem)
let echart = echarts.init(domItem) let echart = echarts.init(domItem)
let echartTimeData = this.echartTimeData let machineNameList = this.machineNameList
let echartFailureData = this.echartFailureData let machineRunTime = this.machineRunTime
let echartRunningData = this.echartRunningData
let echartLoadingData = this.echartLoadingData
echart.setOption({ echart.setOption({
color: ['#15e067'],
tooltip: { tooltip: {
trigger: 'axis' trigger: 'axis',
axisPointer: {
type: 'shadow'
}
}, },
grid: { grid: {
left: 60, left: '3%',
right: 110, right: '4%',
top: 30, bottom: '3%',
bottom: 30 containLabel: true
},
color: ['#7460ee', '#15e067', '#ee295c'],
legend: {
orient: 'vertical',
top: 'center',
left: '85%',
data: ['故障', '运行', '待机'],
itemGap: 10,
itemWidth: 15,
itemHeight: 12,
textStyle: {
color: '#00b4ff',
fontSize: 14
}
}, },
xAxis: [{ xAxis: [
name: '', {
type: 'category', type: 'category',
axisTick: { data: machineNameList,
'alignWithLabel': true axisTick: {
}, alignWithLabel: true
axisLabel: { },
color: '#00b4ff' axisLabel: {
}, interval: 0,
axisLine: { rotate: 30,
lineStyle: { color: '#00b4ff',
color: '#3569fd' lineStyle: {
} color: '#00b4ff'
}, }
data: echartTimeData },
}], axisLine: {
yAxis: [{ lineStyle: {
type: 'value', color: '#3569fd'
min: 0, }
max: 100,
axisLabel: {
color: '#00b4ff',
formatter: '{value}%'
},
splitLine: {
lineStyle: {
color: '#234eb6'
} }
}
}, ],
axisLine: { yAxis: [
lineStyle: { {
color: '#3569fd' type: 'value',
axisLabel: {
color: '#00b4ff'
},
splitLine: {
lineStyle: {
color: '#234eb6'
}
},
axisLine: {
lineStyle: {
color: '#3569fd'
}
} }
}, }
name: '' ],
}], series: [
series: [{ {
data: echartLoadingData, name: '设备运行时间',
name: '待机', type: 'bar',
stack: 'one', barWidth: '30%',
type: 'bar' data: machineRunTime
// label: { }
// show: true ]
// }
}, {
data: echartRunningData,
name: '运行',
stack: 'one',
type: 'bar'
// label: {
// show: true
// }
}, {
data: echartFailureData,
name: '故障',
stack: 'one',
type: 'bar'
// label: {
// show: true
// }
}]
}) })
}, },
// 点击确认按钮 // 点击确认按钮
doConfirmClick () { doConfirmClick () {
if (this.startTime !== '' && this.endTime !== '') { if (_.trim(this.workshopCode) === '') {
if (this.startTime > this.endTime) { this.$message.warning('车间不能为空！')
this.$message.warning('设备状态趋势图开始时间不能大于结束时间！')
} else {
// 请求设备状态趋势图图表数据
this.getMachineStateTrendEchartData()
}
} else { } else {
this.$message.warning('设备状态趋势图开始时间和结束时间不能为空！') // 请求设备状态趋势图图表数据
this.getMachineStateTrendEchartData()
} }
}, },
// 点击重置按钮 // 点击重置按钮
doRestClick () { doRestClick () {
this.startTime = '' this.workshopCode = this.workshopList[0].value
this.endTime = ''
// 请求设备状态趋势图图表数据
// this.getMachineStateTrendEchartData()
}, },
// 请求设备状态趋势图图表数据 // 请求设备状态趋势图图表数据
getMachineStateTrendEchartData () { getMachineStateTrendEchartData () {
let queryParams = { beginTime: this.startTime, endTime: this.endTime } let params = {workshopCode: this.workshopCode}
this.$fetch('report-controller/stateTrend-get', queryParams).then(response => { this.$fetch('report-controller/runTimeList-get', params).then(res => {
this.echartTimeData = [] let resolveMachineName = []
this.echartFailureData = [] let resolveMachineRunTime = []
this.echartRunningData = [] res.forEach((item) => {
this.echartLoadingData = [] resolveMachineName.push(item.equipCode)
for (let item of response) { resolveMachineRunTime.push(item.currentRuntime)
this.echartTimeData.push(item.date) })
this.echartFailureData.push(item.errorStatePercent) this.machineNameList = _.cloneDeep(resolveMachineName)
this.echartRunningData.push(item.runStatePercent) this.machineRunTime = _.cloneDeep(resolveMachineRunTime)
this.echartLoadingData.push(item.loadStatePercent)
}
// 渲染echarts图表 // 渲染echarts图表
this.renderEcharts() this.renderEcharts()
}) })
...@@ -202,7 +190,7 @@ ...@@ -202,7 +190,7 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.machine-state-trend { .machine-state-trend {
width: 607px; width: 1191px;
height: 414px; height: 414px;
position: absolute; position: absolute;
overflow: hidden; overflow: hidden;
...@@ -210,17 +198,12 @@ ...@@ -210,17 +198,12 @@
left: 1302px; left: 1302px;
.search-pack { .search-pack {
width: 607px; width: 1191px;
height: 60px; height: 60px;
margin-top: 30px; margin-top: 30px;
text-align: center; text-align: center;
line-height: 60px; line-height: 60px;
.middle-text { /deep/ .select-reset {
font-size: 18px;
padding: 0 10px;
color: #00b4ff;
}
/deep/ .date-picker-reset {
.el-input__inner { .el-input__inner {
background-color: #102040; background-color: #102040;
color: #00b4ff; color: #00b4ff;
...@@ -235,11 +218,31 @@ ...@@ -235,11 +218,31 @@
} }
} }
} }
/*.middle-text {*/
/* font-size: 18px;*/
/* padding: 0 10px;*/
/* color: #00b4ff;*/
/*}*/
/*/deep/ .date-picker-reset {*/
/* .el-input__inner {*/
/* background-color: #102040;*/
/* color: #00b4ff;*/
/* border: 1px solid #2563ca;*/
/* }*/
/* input::-webkit-input-placeholder {*/
/* color: #00b4ff;*/
/* }*/
/* .el-input__prefix {*/
/* .el-input__icon.el-icon-date {*/
/* color: #00b4ff;*/
/* }*/
/* }*/
/*}*/
} }
#stateTrendChart { #stateTrendChart {
height: 300px; height: 300px;
width: 607px; width: 1191px;
} }
} }
</style> </style>
\ No newline at end of file
src/views/CenterControl/components/MachineWarning.vue
View file @ a739ed31
...@@ -21,8 +21,12 @@ ...@@ -21,8 +21,12 @@
<span>描述</span> <span>描述</span>
</div> </div>
</div> </div>
<div class="table-body"> <VueSeamlessScroll
<div v-if="warningList.length > 0"
:data="warningList"
:class-option="optionSingleHeight"
class="table-body">
<div
class="tr" class="tr"
v-for="(item, index) in warningList" v-for="(item, index) in warningList"
:key="index"> :key="index">
...@@ -30,15 +34,19 @@ ...@@ -30,15 +34,19 @@
<div class="th-machine">{{item.equipName}}</div> <div class="th-machine">{{item.equipName}}</div>
<div class="th-pencil">{{item.info}}</div> <div class="th-pencil">{{item.info}}</div>
</div> </div>
</div> </VueSeamlessScroll>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import Moment from 'moment' import Moment from 'moment'
import VueSeamlessScroll from 'vue-seamless-scroll'
export default { export default {
components: {
VueSeamlessScroll
},
props: { props: {
pollingRequestTime: {} pollingRequestTime: {}
}, },
...@@ -50,6 +58,13 @@ ...@@ -50,6 +58,13 @@
this.judgeTime() this.judgeTime()
} }
}, },
computed: {
optionSingleHeight () {
return {
singleHeight: 50
}
}
},
data () { data () {
return { return {
// 报警信息列表 // 报警信息列表
...@@ -64,7 +79,7 @@ ...@@ -64,7 +79,7 @@
// 请求设备异常列表 // 请求设备异常列表
getMachineWarningList () { getMachineWarningList () {
this.$fetch('report-controller/warningList-get', {}).then(response => { this.$fetch('report-controller/warningList-get', {}).then(response => {
this.warningList = _.cloneDeep(response.slice(0, 17)) this.warningList = _.cloneDeep(response)
}) })
}, },
// 时间处理 // 时间处理
...@@ -103,16 +118,16 @@ ...@@ -103,16 +118,16 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.machine-warning { .machine-warning {
width: 534px; width: 534px;
height: 881px; height: 414px;
position: absolute; position: absolute;
top: 166px; top: 166px;
right: 57px; right: 57px;
overflow: hidden; overflow: hidden;
/*background-color: rgba(1,1,1,0.5);*/
.time-warning-pack { .time-warning-pack {
width: 534px; width: 534px;
height: 60px; height: 60px;
// background-color: rgba(1,1,1,0.5);
margin-top: 27px; margin-top: 27px;
line-height: 60px; line-height: 60px;
.time { .time {
...@@ -139,9 +154,10 @@ ...@@ -139,9 +154,10 @@
.warning-message-pack { .warning-message-pack {
margin-top: 10px; margin-top: 10px;
width: 474px; width: 474px;
height: 767px; height: 317px;
padding: 0 30px; padding: 0 30px;
// background-color: rgba(1,1,1,0.5); // background-color: rgba(1,1,1,0.5);
overflow: hidden;
.table-header { .table-header {
height: 40px; height: 40px;
color: #00b4ff; color: #00b4ff;
...@@ -168,11 +184,14 @@ ...@@ -168,11 +184,14 @@
} }
} }
.table-body { .table-body {
height: 257px;
overflow: hidden;
.tr { .tr {
overflow: hidden;
div { div {
float: left; float: left;
height: 40px; height: 50px;
line-height: 40px; line-height: 50px;
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
color: #3facd9; color: #3facd9;
...@@ -196,4 +215,4 @@ ...@@ -196,4 +215,4 @@
} }
} }
} }
</style> </style>
\ No newline at end of file
src/views/CenterControl/index.vue
View file @ a739ed31
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<MachineOperatingStatus <MachineOperatingStatus
:pollingRequestTime="pollingRequestTime"> :pollingRequestTime="pollingRequestTime">
</MachineOperatingStatus> </MachineOperatingStatus>
<!-- 设备状态趋势图 --> <!-- 设备累计运行时间统计 -->
<MachineStateTrend <MachineStateTrend
:pollingRequestTime="pollingRequestTime"> :pollingRequestTime="pollingRequestTime">
</MachineStateTrend> </MachineStateTrend>
......
src/views/Led/Station/stationSix.vue
View file @ a739ed31
...@@ -130,8 +130,8 @@ ...@@ -130,8 +130,8 @@
//获取工位实时信息 //获取工位实时信息
getData () { getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '6'}).then(res => { this.$fetch('led-controller/ledInfo-get', {ledNo: '6'}).then(res => {
this.timmingData = _.cloneDeep(res); this.timmingData = _.cloneDeep(res)
this.roomInfoList = _.cloneDeep(res.roomInfoList); this.roomInfoList = _.cloneDeep(res.roomInfoList)
this.warningList = _.cloneDeep(res.warningList) this.warningList = _.cloneDeep(res.warningList)
for (let item of this.roomInfoList) { for (let item of this.roomInfoList) {
console.log('item', item) console.log('item', item)
......
src/views/Workshop/Parts/components/ProgramIssued.vue
View file @ a739ed31
...@@ -241,6 +241,6 @@ ...@@ -241,6 +241,6 @@
} }
</script> </script>
<style> <style lang="scss" scoped>
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment