269 lines
7.6 KiB
Vue
269 lines
7.6 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<section class="content">
|
||
|
|
<div class="device-status">
|
||
|
|
<button class="fl mgt10 mgl10 button--primary" @click="toIfWork">设备开/完工</button>
|
||
|
|
<p><span class="icon red"></span><span class="txt">有任务</span></p>
|
||
|
|
<p><span class="icon green"></span><span class="txt">生产中</span></p>
|
||
|
|
<p><span class="icon blue"></span><span class="txt">停机</span></p>
|
||
|
|
<p><span class="icon white"></span><span class="txt">待机</span></p>
|
||
|
|
</div>
|
||
|
|
<div class="list-box">
|
||
|
|
<div class="device"
|
||
|
|
:class="{bg1:item.is_run=='1',bg2:item.is_run=='0'}"
|
||
|
|
v-for="(item, index) in list" :key="index"
|
||
|
|
@click="toOperation(item)"
|
||
|
|
>
|
||
|
|
<div class="device-top"><div class="img"><img v-show="item.device_icon" :src="item.imgurl" alt=""></div></div>
|
||
|
|
<div class="fl icon" :class="{blue:item.device_status=='3',red:item.device_status=='2',green:item.device_status=='1',white:item.device_status=='0'}"></div>
|
||
|
|
<div class="fl desc">
|
||
|
|
<p class="device_name">{{item.device_name}}</p>
|
||
|
|
<p class="ellipsis">任务数: {{item.job_count}}</p>
|
||
|
|
<p class="ellipsis">工单: {{item.produceorder_code}}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<Back></Back>
|
||
|
|
</section>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Back from '@components/Back.vue'
|
||
|
|
export default {
|
||
|
|
name: 'Home',
|
||
|
|
components: {
|
||
|
|
Back
|
||
|
|
},
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
timer: null,
|
||
|
|
list: []
|
||
|
|
// list: [
|
||
|
|
// {
|
||
|
|
// device_status: '0',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0001',
|
||
|
|
// device_name: '设备名称设备名称设备名称设备名称哈哈哈你好吗好哦',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: '//img14.360buyimg.com/babel/s190x210_jfs/t1/54510/8/1271/6158/5cef5bfbEede24168/4aa624bd9ada781f.png!q90!cc_190x210'
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '1',
|
||
|
|
// is_setstatus: '1',
|
||
|
|
// device_code: 'A0002',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: '//img1.360buyimg.com/da/s590x470_jfs/t1/36626/1/11773/101331/5cf9fd07E20a31b94/57ae8abe34bebdd3.jpg!q90!cc_590x470.webp'
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '2',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0003',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: '//img14.360buyimg.com/mobilecms/s580x176_jfs/t1/45895/4/2239/49551/5d009864Ea34300cd/5a5e78699233f6dd.jpg!cr_1190x360_4_0'
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '0',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0004',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '1',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0005',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '2',
|
||
|
|
// is_setstatus: '1',
|
||
|
|
// device_code: 'A0006',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '0',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0007',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '0',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0008',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '1',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A0009',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '2',
|
||
|
|
// is_setstatus: '1',
|
||
|
|
// device_code: 'A00010',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// },
|
||
|
|
// {
|
||
|
|
// device_status: '0',
|
||
|
|
// is_setstatus: '0',
|
||
|
|
// device_code: 'A00011',
|
||
|
|
// job_count: '6',
|
||
|
|
// produceorder_code: 'gd0002',
|
||
|
|
// imgurl: ''
|
||
|
|
// }
|
||
|
|
// ]
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted () {
|
||
|
|
this.getList()
|
||
|
|
this.refresh()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
refresh () {
|
||
|
|
this.timer = setInterval(() => {
|
||
|
|
this.getList()
|
||
|
|
}, 30000)
|
||
|
|
},
|
||
|
|
getList () {
|
||
|
|
let data = {
|
||
|
|
'_SRVNAME': 'service.mps.AIOProduceReport20',
|
||
|
|
'_SRVMETHOD': 'queryEquip',
|
||
|
|
'_DATA': JSON.stringify({
|
||
|
|
accountId: this.$store.getters.accountId
|
||
|
|
})
|
||
|
|
}
|
||
|
|
this
|
||
|
|
.$post(data)
|
||
|
|
.then(res => {
|
||
|
|
if (res.code === '1') {
|
||
|
|
let newArr = []
|
||
|
|
res.allrows.map(el => {
|
||
|
|
newArr.push(Object.assign({}, el, {imgurl: this.$store.getters.imgBaseUrl + el.device_icon}))
|
||
|
|
})
|
||
|
|
this.list = newArr
|
||
|
|
this.$store.dispatch('getIsProplan', res.result.is_productonplan)
|
||
|
|
} else {
|
||
|
|
this.Dialog(res.desc)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
toIfWork () {
|
||
|
|
this.$router.push('/ifwork')
|
||
|
|
},
|
||
|
|
toOperation (item) {
|
||
|
|
if (item.is_run === '1') {
|
||
|
|
let obj = {
|
||
|
|
deviceUuid: item.device_uuid,
|
||
|
|
deviceCode: item.device_name
|
||
|
|
}
|
||
|
|
this.$store.dispatch('setDevice', obj)
|
||
|
|
this.$router.push('/operation')
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
beforeDestroy () {
|
||
|
|
clearInterval(this.timer)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="stylus" scoped>
|
||
|
|
.red
|
||
|
|
background red
|
||
|
|
.green
|
||
|
|
background #09ed20
|
||
|
|
.blue
|
||
|
|
background #53ccf9
|
||
|
|
.white
|
||
|
|
background white
|
||
|
|
.bg1
|
||
|
|
background #1E307E
|
||
|
|
border 1px solid #4F93D9
|
||
|
|
.bg2
|
||
|
|
background rgba(0,0,0,0.50)
|
||
|
|
border 1px solid #7B7B7B
|
||
|
|
.content
|
||
|
|
clear both
|
||
|
|
box-sizing border-box
|
||
|
|
// height 5rem
|
||
|
|
width 7.9rem
|
||
|
|
.device-status
|
||
|
|
text-align right
|
||
|
|
font-size .18rem
|
||
|
|
padding .1rem 0 0 .1rem
|
||
|
|
p
|
||
|
|
display inline-block
|
||
|
|
text-align left
|
||
|
|
.icon
|
||
|
|
display inline-block
|
||
|
|
width .2rem
|
||
|
|
height .2rem
|
||
|
|
border-radius .1rem
|
||
|
|
margin-top .08rem
|
||
|
|
.txt
|
||
|
|
display inline-block
|
||
|
|
width .56rem
|
||
|
|
line-height .4rem
|
||
|
|
margin-left .11rem
|
||
|
|
float right
|
||
|
|
.list-box
|
||
|
|
padding-bottom .2rem
|
||
|
|
// height 4.6rem
|
||
|
|
// overflow-y scroll
|
||
|
|
.device
|
||
|
|
display inline-block
|
||
|
|
width 1.75rem
|
||
|
|
height 2.1rem
|
||
|
|
margin .18rem 0rem 0 .19rem
|
||
|
|
overflow hidden
|
||
|
|
.device-top
|
||
|
|
box-sizing border-box
|
||
|
|
height 1rem
|
||
|
|
background #1E307E
|
||
|
|
box-shadow inset 0 0 5px 0 #4F93D9
|
||
|
|
padding .12rem .18rem .12rem .18rem
|
||
|
|
.img
|
||
|
|
width 1.37rem
|
||
|
|
height .76rem
|
||
|
|
background #fff
|
||
|
|
text-align center
|
||
|
|
img
|
||
|
|
width 1.37rem
|
||
|
|
height .76rem
|
||
|
|
.icon
|
||
|
|
display inline-block
|
||
|
|
width .2rem
|
||
|
|
height .2rem
|
||
|
|
border-radius .1rem
|
||
|
|
margin .1rem .06rem 0 .04rem
|
||
|
|
.desc
|
||
|
|
display inline-block
|
||
|
|
width 1.35rem
|
||
|
|
margin-top: .05rem
|
||
|
|
line-height .25rem
|
||
|
|
p
|
||
|
|
font-size .13rem
|
||
|
|
.device_name
|
||
|
|
max-height .5rem
|
||
|
|
overflow hidden
|
||
|
|
</style>
|