Commit 452e9d10 authored by 李志鸣's avatar 李志鸣

Merge branch 'dev' of git.vtstar.net:zhongtong/zhongtong-avi-web into dev

parents c0a4ca6f fc4a9d7c
<template> <template>
<div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0"> <div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0">
<div class="title-pack">中涂人工</div> <div class="title-pack">{{timmingData.name}}</div>
<div class="table-pack"> <div class="table-pack">
<div class="tr"> <div class="tr">
<div class="th-l">进车数</div> <div class="th-l">进车数</div>
<div class="th-r">{{width}}</div> <div class="th-r">{{timmingData.busIn}}</div>
</div> </div>
<div class="tr"> <div class="tr">
<div class="th-l">人工喷涂完工数</div> <div class="th-l">出车数</div>
<div class="th-r">{{height}}</div> <div class="th-r">{{timmingData.busOut}}</div>
</div>
<div class="tr">
<div class="th-l">中涂交车完工数</div>
<div class="th-r">{{height}}</div>
</div> </div>
<div class="info"> <div class="info">
设备报警信息: 设备报警信息:
<div>&nbsp;</div> <div>&nbsp;</div>
<swiper :options="swiperOption" ref="mySwiper" @someSwiperEvent="callback"> <swiper :options="swiperOption" ref="mySwiper">
<swiper-slide>I'mSlide14455555555555 58866666666666666555589</swiper-slide> <swiper-slide v-for="(item, index) in warningList" :key="index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{warningList[index].name}}{{warningList[index].info}}</swiper-slide>
<swiper-slide>I'55589</swiper-slide>
<swiper-slide>I'mSlide144556666666666666555589</swiper-slide>
</swiper> </swiper>
</div> </div>
<div class="time">时间:{{ timeNow }}</div> <div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { swiper, swiperSlide } from 'vue-awesome-swiper' import { swiper, swiperSlide } from 'vue-awesome-swiper'
import Moment from 'moment'
export default { export default {
components: { components: {
swiper, swiper,
...@@ -37,25 +32,68 @@ ...@@ -37,25 +32,68 @@
}, },
data () { data () {
return { return {
// 实时数据
timmingData: {},
// 报警数据
warningList: {},
width: 0, width: 0,
height: 0, height: 0,
zoom: 'scale(0)', zoom: 'scale(0)',
// 屏幕显示当前时间
timeNow: '', timeNow: '',
// 定时器
timer: '', timer: '',
// Data轮询定时器
dataTimer: '',
// swiper配置信息
swiperOption: { swiperOption: {
autoplay: { autoplay: {
delay: 5000 delay: 5000 //轮播频率 5s
} }
} }
} }
}, },
methods: {}, methods: {
// 时间日期格式化
formatTime (time, format) {
if (time !== null && time !== '') {
return Moment(time).format(format)
} else {
return '暂无'
}
},
//获取工位实时信息
getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '1'}).then(res => {
this.timmingData = res;
this.warningList = res.warningList;
console.log(this.warningList)
})
}
},
mounted () { mounted () {
this.getData()
this.dataTimer = setInterval(() => {
this.getData()
}, 60000)
let vm = this
// 模拟时间运作
this.timer = setInterval(() => {
vm.timeNow = vm.formatTime()
}, 1000)
setTimeout(() => { setTimeout(() => {
this.width = document.body.offsetWidth this.width = document.body.offsetWidth
this.height = document.body.offsetHeight this.height = document.body.offsetHeight
this.zoom = `scale(${this.width / 1710})` this.zoom = `scale(${this.width / 1710})`
}, 3000) }, 3000)
},
beforeDestroy () {
if (this.timer) {
clearInterval(this.timer); //在Vue实例销毁前,清除定时器
}
if (this.dataTimer) {
clearInterval(this.dataTimer); //在Vue实例销毁前,清除定时器
}
} }
} }
</script> </script>
......
<template> <template>
<div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0;"> <div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0;">
<div class="title-pack">电泳</div> <div class="title-pack">{{timmingData.name}}</div>
<div class="table-pack"> <div class="table-pack">
<div class="tr"> <div class="tr">
<div class="th-l">{{width}}</div> <div class="th-l">进车数</div>
<div class="th-r">{{width}}</div> <div class="th-r">{{timmingData.busIn}}</div>
</div> </div>
<div class="tr"> <div class="tr">
<div class="th-l">{{height}}</div> <div class="th-l">出车数</div>
<div class="th-r">{{height}}</div> <div class="th-r">{{timmingData.busOut}}</div>
</div> </div>
<div class="info"> <div class="info">
设备报警信息: 设备报警信息:
<div>&nbsp;</div> <div>&nbsp;</div>
<swiper :options="swiperOption" ref="mySwiper"> <swiper :options="swiperOption" ref="mySwiper">
<swiper-slide>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;I'mSlide14455555555555 58866666666666666555589</swiper-slide> <swiper-slide v-for="(item, index) in warningList" :key="index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{warningList[index].name}}{{warningList[index].info}}</swiper-slide>
<swiper-slide>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;I'55589</swiper-slide>
<swiper-slide>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;I'mSlide144556666666666666555589</swiper-slide>
</swiper> </swiper>
</div> </div>
<div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div> <div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div>
...@@ -34,18 +32,23 @@ ...@@ -34,18 +32,23 @@
}, },
data () { data () {
return { return {
// 工位实时数据
timmingData: {},
// 报警数据
warningList: {},
width: 0, width: 0,
height: 0, height: 0,
zoom: 'scale(0)', zoom: 'scale(0)',
// 屏幕显示当前时间
timeNow: '', timeNow: '',
// 定时器
timer: '', timer: '',
// minLength: null, // Data轮询定时器
// minutes: null, dataTimer: '',
// secondsLength: null, // swiper配置信息
// seconds: null,
swiperOption: { swiperOption: {
autoplay: { autoplay: {
delay: 5000 delay: 5000 //轮播频率 5s
} }
} }
} }
...@@ -59,18 +62,24 @@ ...@@ -59,18 +62,24 @@
return '暂无' return '暂无'
} }
}, },
//获取工位实时信息
getData () { getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '1'}).then(res => { this.$fetch('led-controller/ledInfo-get', {ledNo: '2'}).then(res => {
this.timmingData = res;
this.warningList = res.warningList;
// console.log(this.warningList)
console.log(res) console.log(res)
}) })
} }
}, },
mounted () { mounted () {
this.getData() this.getData()
let vm = this this.dataTimer = setInterval(() => {
this.getData()
}, 60000)
// 模拟时间运作
this.timer = setInterval(() => { this.timer = setInterval(() => {
vm.timeNow = this.formatTime() this.timeNow = this.formatTime()
// console.log(this.timeNow)
}, 1000) }, 1000)
setTimeout(() => { setTimeout(() => {
this.width = document.body.offsetWidth this.width = document.body.offsetWidth
...@@ -83,6 +92,9 @@ ...@@ -83,6 +92,9 @@
if (this.timer) { if (this.timer) {
clearInterval(this.timer); //在Vue实例销毁前,清除定时器 clearInterval(this.timer); //在Vue实例销毁前,清除定时器
} }
if (this.dataTimer) {
clearInterval(this.dataTimer); //在Vue实例销毁前,清除定时器
}
} }
} }
</script> </script>
......
<template> <template>
<div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0"> <div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0">
<div class="title-pack">中涂机器人</div> <div class="title-pack">{{ timmingData.name }}</div>
<div class="table-pack"> <div class="table-pack">
<div class="tr"> <div class="tr">
<div class="th-l">进车数</div> <div class="th-l">进车数</div>
<div class="th-r">{{width}}</div> <div class="th-r">{{timmingData.busIn}}</div>
</div> </div>
<div class="tr"> <div class="tr">
<div class="th-l">喷涂机器人完工数</div> <div class="th-l">出车数</div>
<div class="th-r">{{height}}</div> <div class="th-r">{{timmingData.busOut}}</div>
</div>
<div class="tr">
<div class="th-l">中途交车完工数</div>
<div class="th-r">{{height}}</div>
</div> </div>
<div class="info"> <div class="info">
设备报警信息: 设备报警信息:
<div>&nbsp;</div>
<swiper :options="swiperOption" ref="mySwiper">
<swiper-slide v-for="(item, index) in warningList" :key="index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{warningList[index].name}}{{warningList[index].info}}</swiper-slide>
</swiper>
</div> </div>
<div class="time">时间:2019-08-29 09:00:00</div> <div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import Moment from 'moment'
export default { export default {
components: {
swiper,
swiperSlide
},
data () { data () {
return { return {
width: 0, width: 0,
height: 0, height: 0,
zoom: 'scale(0)' zoom: 'scale(0)',
// 工位实时数据
timmingData: {},
// 报警数据
warningList: {},
// 屏幕显示当前时间
timeNow: '',
// 定时器
timer: '',
// Data轮询定时器
dataTimer: '',
// swiper配置信息
swiperOption: {
autoplay: {
delay: 5000 //轮播频率 5s
}
}
}
},
methods: {
// 时间日期格式化
formatTime (time, format) {
if (time !== null && time !== '') {
return Moment(time).format(format)
} else {
return '暂无'
}
},
//获取工位实时信息
getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '3'}).then(res => {
this.timmingData = res;
this.warningList = res.warningList;
console.log(this.warningList)
})
} }
}, },
methods: {},
mounted () { mounted () {
this.getData()
this.dataTimer = setInterval(() => {
this.getData()
}, 60000)
this.timer = setInterval(() => {
this.timeNow = this.formatTime()
// console.log(this.timeNow)
}, 1000)
setTimeout(() => { setTimeout(() => {
this.width = document.body.offsetWidth this.width = document.body.offsetWidth
this.height = document.body.offsetHeight this.height = document.body.offsetHeight
this.zoom = `scale(${this.width / 1710})` this.zoom = `scale(${this.width / 1710})`
}, 3000) }, 3000)
},
beforeDestroy () {
if (this.timer) {
clearInterval(this.timer); //在Vue实例销毁前,清除定时器
}
if (this.dataTimer) {
clearInterval(this.dataTimer); //在Vue实例销毁前,清除定时器
}
} }
} }
</script> </script>
......
<template> <template>
<div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0;"> <div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0;">
<div class="title-pack">隔热防腐</div> <div class="title-pack">{{timmingData.name}}</div>
<div class="table-pack"> <div class="table-pack">
<div class="tr"> <div class="tr">
<div class="th-l">进车数</div> <div class="th-l">进车数</div>
<div class="th-r">{{width}}</div> <div class="th-r">{{timmingData.busIn}}</div>
</div> </div>
<div class="tr"> <div class="tr">
<div class="th-l">完工</div> <div class="th-l">出车</div>
<div class="th-r">{{height}}</div> <div class="th-r">{{timmingData.busOut}}</div>
</div> </div>
<div class="info"> <div class="info">
设备报警信息: 设备报警信息:
<div>&nbsp;</div>
<swiper :options="swiperOption" ref="mySwiper">
<swiper-slide v-for="(item, index) in warningList" :key="index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{warningList[index].name}}{{warningList[index].info}}</swiper-slide>
</swiper>
</div> </div>
<div class="time">时间:2019-08-29 09:00:00</div> <div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import Moment from 'moment'
export default { export default {
components: {
swiper,
swiperSlide
},
data () { data () {
return { return {
width: 0, width: 0,
height: 0, height: 0,
zoom: 'scale(0)' zoom: 'scale(0)',
// 工位实时数据
timmingData: {},
// 报警数据
warningList: {},
// 屏幕显示当前时间
timeNow: '',
// 定时器
timer: '',
// Data轮询定时器
dataTimer: '',
// swiper配置信息
swiperOption: {
autoplay: {
delay: 5000 //轮播频率 5s
}
}
}
},
methods: {
// 时间日期格式化
formatTime (time, format) {
if (time !== null && time !== '') {
return Moment(time).format(format)
} else {
return '暂无'
}
},
//获取工位实时信息
getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '4'}).then(res => {
console.log(res)
this.timmingData = res;
this.warningList = res.warningList;
console.log(this.warningList)
})
} }
}, },
methods: {},
mounted () { mounted () {
this.getData()
this.dataTimer = setInterval(() => {
this.getData()
}, 60000)
// 模拟时间运作
this.timer = setInterval(() => {
this.timeNow = this.formatTime()
}, 1000)
setTimeout(() => { setTimeout(() => {
this.width = document.body.offsetWidth this.width = document.body.offsetWidth
this.height = document.body.offsetHeight this.height = document.body.offsetHeight
this.zoom = `scale(${this.width / 1710})` this.zoom = `scale(${this.width / 1710})`
console.log(`scale(${this.width / 1710})`) console.log(`scale(${this.width / 1710})`)
}, 3000) }, 3000)
},
beforeDestroy () {
if (this.timer) {
clearInterval(this.timer); //在Vue实例销毁前,清除定时器
}
if (this.dataTimer) {
clearInterval(this.dataTimer); //在Vue实例销毁前,清除定时器
}
} }
} }
</script> </script>
......
<template> <template>
<div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0"> <div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0">
<div class="title-pack">腻子</div> <div class="title-pack">{{timmingData.name}}</div>
<div class="table-pack"> <div class="table-pack">
<div class="tr"> <div class="tr">
<div class="th-l">进车数</div> <div class="th-l">进车数</div>
<div class="th-r">{{width}}</div> <div class="th-r">{{timmingData.busIn}}</div>
</div> </div>
<div class="tr"> <div class="tr">
<div class="th-l">完工</div> <div class="th-l">出车</div>
<div class="th-r">{{height}}</div> <div class="th-r">{{timmingData.busOut}}</div>
</div> </div>
<div class="info"> <div class="info">
设备报警信息: 设备报警信息:
<div>&nbsp;</div>
<swiper :options="swiperOption" ref="mySwiper">
<swiper-slide v-for="(item, index) in warningList" :key="index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{warningList[index].name}}{{warningList[index].info}}</swiper-slide>
</swiper>
</div> </div>
<div class="time">时间:2019-08-29 09:00:00</div> <div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import Moment from 'moment'
export default { export default {
components: {
swiper,
swiperSlide
},
data () { data () {
return { return {
// 工位实时数据
timmingData: {},
// 报警数据
warningList: {},
width: 0, width: 0,
height: 0, height: 0,
zoom: 'scale(0)' zoom: 'scale(0)',
// 屏幕显示当前时间
timeNow: '',
// 定时器
timer: '',
// swiper配置信息
swiperOption: {
autoplay: {
delay: 5000 //轮播频率 5s
}
}
}
},
methods: {
// 时间日期格式化
formatTime (time, format) {
if (time !== null && time !== '') {
return Moment(time).format(format)
} else {
return '暂无'
}
},
//获取工位实时信息
getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '5'}).then(res => {
this.timmingData = res;
this.warningList = res.warningList;
// console.log(this.warningList)
console.log(res)
})
} }
}, },
methods: {},
mounted () { mounted () {
this.getData()
let vm = this
// 模拟时间运作
this.timer = setInterval(() => {
vm.timeNow = this.formatTime()
}, 1000)
setTimeout(() => { setTimeout(() => {
this.width = document.body.offsetWidth this.width = document.body.offsetWidth
this.height = document.body.offsetHeight this.height = document.body.offsetHeight
this.zoom = `scale(${this.width / 1710})` this.zoom = `scale(${this.width / 1710})`
}, 3000) }, 3000)
},
beforeDestroy () {
if (this.timer) {
clearInterval(this.timer); //在Vue实例销毁前,清除定时器
}
} }
} }
</script> </script>
......
This diff is collapsed.
<template> <template>
<div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0"> <div class="page-pack" :style="{transform: zoom}" style="transform-origin: 0 0">
<div class="title-pack">面/清漆</div> <div class="title-pack">{{timmingData.name}}</div>
<div class="table-pack"> <div class="table-pack">
<div class="tr"> <div class="tr">
<div class="th-l">进车数</div> <div class="th-l">进车数</div>
<div class="th-r">{{width}}</div> <div class="th-r">{{timmingData.busIn}}</div>
</div> </div>
<div class="tr"> <div class="tr">
<div class="th-l">完工</div> <div class="th-l">出车</div>
<div class="th-r">{{height}}</div> <div class="th-r">{{timmingData.busOut}}</div>
</div> </div>
<div class="info"> <div class="info">
设备报警信息: 设备报警信息:
<div>&nbsp;</div>
<swiper :options="swiperOption" ref="mySwiper">
<swiper-slide v-for="(item, index) in warningList" :key="index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{warningList[index].name}}{{warningList[index].info}}</swiper-slide>
</swiper>
</div> </div>
<div class="time">时间:2019-08-29 09:00:00</div> <div class="time">时间:{{ formatTime(timeNow,'YYYY-MM-DD HH:mm:ss') }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import Moment from 'moment'
export default { export default {
components: {
swiper,
swiperSlide
},
data () { data () {
return { return {
// 工位实时数据
timmingData: {},
// 报警数据
warningList: {},
width: 0, width: 0,
height: 0, height: 0,
zoom: 'scale(0)' zoom: 'scale(0)',
// 屏幕显示当前时间
timeNow: '',
// 定时器
timer: '',
// swiper配置信息
swiperOption: {
autoplay: {
delay: 5000 //轮播频率 5s
}
}
}
},
methods: {
// 时间日期格式化
formatTime (time, format) {
if (time !== null && time !== '') {
return Moment(time).format(format)
} else {
return '暂无'
}
},
//获取工位实时信息
getData () {
this.$fetch('led-controller/ledInfo-get', {ledNo: '6'}).then(res => {
this.timmingData = res;
this.warningList = res.warningList;
// console.log(this.warningList)
console.log(res)
})
} }
}, },
methods: {},
mounted () { mounted () {
this.getData()
let vm = this
// 模拟时间运作
this.timer = setInterval(() => {
vm.timeNow = this.formatTime()
}, 1000)
setTimeout(() => { setTimeout(() => {
this.width = document.body.offsetWidth this.width = document.body.offsetWidth
this.height = document.body.offsetHeight this.height = document.body.offsetHeight
this.zoom = `scale(${this.width / 1710})` this.zoom = `scale(${this.width / 1710})`
}, 3000) }, 3000)
},
beforeDestroy () {
if (this.timer) {
clearInterval(this.timer); //在Vue实例销毁前,清除定时器
}
} }
} }
</script> </script>
......
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