更新看板
This commit is contained in:
parent
1c71d4c22d
commit
060ec37ccf
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2022-03-07 15:31:13
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-07-01 16:58:50
|
||||
* @LastEditTime: 2022-07-05 16:11:42
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -15,12 +15,11 @@
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="30" align="center"> </el-table-column>
|
||||
<el-table-column prop="name" label="客户名称" align="center"> </el-table-column>
|
||||
<el-table-column prop="code" label="订单编号" align="center"> </el-table-column>
|
||||
<el-table-column prop="num" label="数量" width="50" align="center"> </el-table-column>
|
||||
<el-table-column prop="customer" label="客户名称" align="center"> </el-table-column>
|
||||
<el-table-column prop="orderNo" label="订单编号" align="center"> </el-table-column>
|
||||
<el-table-column prop="quantity" label="数量" width="50" align="center"> </el-table-column>
|
||||
<el-table-column prop="productName" label="产品名称" align="center"> </el-table-column>
|
||||
<el-table-column prop="weight" label="重量" width="50" align="center"> </el-table-column>
|
||||
<el-table-column prop="process" label="加工方式" width="60" align="center"> </el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2022-03-07 15:31:13
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-07-01 16:58:00
|
||||
* @LastEditTime: 2022-07-05 16:18:48
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -25,13 +25,13 @@
|
||||
<el-col :span="8">
|
||||
<el-row>
|
||||
<div class="mid top-info">
|
||||
1293803
|
||||
{{wbData.taskCode}}
|
||||
<div style="color: #fff;margin: 5px 0;">加工单编号</div>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mid bottom-info">
|
||||
129
|
||||
{{wbData.plcValue}}
|
||||
<div style="color: #fff;margin: 5px 0;">工艺号</div>
|
||||
</div>
|
||||
</el-row>
|
||||
@ -39,11 +39,11 @@
|
||||
<el-col :span="8">
|
||||
<div class="back">
|
||||
<el-progress
|
||||
:percentage="80"
|
||||
:percentage="wbData.completeness"
|
||||
:stroke-width="8"
|
||||
:show-text="false"
|
||||
></el-progress>
|
||||
<div style="margin: 5px 0;">{{ hour }}:{{ minute }}:{{ second }}</div>
|
||||
<div style="margin: 5px 0;">{{ wbData.remainingTime}}</div>
|
||||
<div style="color: #fff;font-size:14px">剩余时间</div>
|
||||
</div>
|
||||
</el-col>
|
||||
@ -53,7 +53,7 @@
|
||||
<div class="tipDiv"></div>
|
||||
标识信息卡
|
||||
</div>
|
||||
<part-table :tableData="tableData"></part-table>
|
||||
<part-table :tableData="wbData.currTaskDetVoList"></part-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -63,17 +63,9 @@ import partTable from './board-part-table.vue'
|
||||
export default {
|
||||
components: {partTable},
|
||||
props: {
|
||||
tableData: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
countdown: {
|
||||
wbData: {
|
||||
type: Object,
|
||||
default: () => ({
|
||||
'hours': 1,
|
||||
'minutes': 10,
|
||||
'seconds': 0
|
||||
})
|
||||
default: () => {}
|
||||
},
|
||||
imgUrl: {
|
||||
type: String,
|
||||
@ -82,91 +74,21 @@ export default {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
hours: 1,
|
||||
minutes: 12,
|
||||
seconds: 0
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.hours = this.countdown.hours
|
||||
this.minutes = this.countdown.minutes
|
||||
this.seconds = this.countdown.seconds
|
||||
},
|
||||
mounted () {
|
||||
this.add()
|
||||
},
|
||||
watch: {
|
||||
// 监听数值变化
|
||||
second: {
|
||||
handler (newVal) {
|
||||
this.num(newVal)
|
||||
}
|
||||
},
|
||||
minute: {
|
||||
handler (newVal) {
|
||||
this.num(newVal)
|
||||
}
|
||||
},
|
||||
hour: {
|
||||
handler (newVal) {
|
||||
this.num(newVal)
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 初始化数据
|
||||
second () {
|
||||
return this.num(this.seconds)
|
||||
},
|
||||
minute () {
|
||||
return this.num(this.minutes)
|
||||
},
|
||||
hour () {
|
||||
return this.num(this.hours)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
num (n) {
|
||||
return n < 10 ? '0' + n : '' + n
|
||||
},
|
||||
// 倒计时函数
|
||||
add () {
|
||||
let time = window.setInterval(() => {
|
||||
if (this.hours !== 0 && this.minutes === 0 && this.seconds === 0) {
|
||||
this.hours -= 1
|
||||
this.minutes = 59
|
||||
this.seconds = 59
|
||||
} else if (
|
||||
this.hours === 0 &&
|
||||
this.minutes !== 0 &&
|
||||
this.seconds === 0
|
||||
) {
|
||||
this.minutes -= 1
|
||||
this.seconds = 59
|
||||
} else if (
|
||||
this.hours === 0 &&
|
||||
this.minutes === 0 &&
|
||||
this.seconds === 0
|
||||
) {
|
||||
this.seconds = 0
|
||||
window.clearInterval(time)
|
||||
} else if (
|
||||
this.hours !== 0 &&
|
||||
this.minutes !== 0 &&
|
||||
this.seconds === 0
|
||||
) {
|
||||
this.minutes -= 1
|
||||
this.seconds = 59
|
||||
} else {
|
||||
this.seconds -= 1
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container{
|
||||
width: 30%;
|
||||
}
|
||||
.title {
|
||||
color: #ffffff;
|
||||
font-size: 22px;
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2022-03-07 15:31:13
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-07-04 10:49:38
|
||||
* @LastEditTime: 2022-07-05 16:12:59
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -10,39 +10,9 @@
|
||||
<div class="container-title">
|
||||
浙江求精科技车间生产看板
|
||||
</div>
|
||||
<el-row :gutter="20" style="margin:20px">
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData1" imgUrl='BMA1'></board>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData2" imgUrl='BMA2' :countdown="countdown"></board>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData2" imgUrl='BMA3'></board>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20" style="margin:20px">
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData2" imgUrl='BMA4' :countdown="countdown1"></board>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData2" imgUrl='BMB1'></board>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData1" imgUrl='BMB2' :countdown="countdown"></board>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20" style="margin:20px">
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData2" imgUrl='BMB3' :countdown="countdown"></board>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData1" imgUrl='BMC1'></board>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<board :tableData="tableData2" imgUrl='BMC2' :countdown="countdown1"></board>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="container-body">
|
||||
<board v-for="(item,index) in wbData" :key="index" :wbData="item" :imgUrl="item.kilnCode + item.kilnId"></board>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -53,62 +23,61 @@ export default {
|
||||
components: { board },
|
||||
data () {
|
||||
return {
|
||||
tableData1: [
|
||||
{
|
||||
name: '樟子松',
|
||||
code: '1103434',
|
||||
num: 12,
|
||||
productName: '株洲铁',
|
||||
weight: 123,
|
||||
process: '压缩'
|
||||
},
|
||||
{
|
||||
name: '阿斯蒂芬',
|
||||
code: '1103434',
|
||||
num: 122,
|
||||
productName: '株洲铁',
|
||||
weight: 815,
|
||||
process: '压缩'
|
||||
},
|
||||
{
|
||||
name: '风都',
|
||||
code: '1103434',
|
||||
num: 334,
|
||||
productName: '株洲铁',
|
||||
weight: 1223,
|
||||
process: '压缩'
|
||||
}
|
||||
],
|
||||
tableData2: [
|
||||
{
|
||||
name: '阿斯蒂芬',
|
||||
code: '1103434',
|
||||
num: 122,
|
||||
productName: '株洲铁',
|
||||
weight: 815,
|
||||
process: '压缩'
|
||||
}
|
||||
],
|
||||
countdown: {
|
||||
'hours': 5,
|
||||
'minutes': 20,
|
||||
'seconds': 12
|
||||
},
|
||||
countdown1: {
|
||||
'hours': 11,
|
||||
'minutes': 43,
|
||||
'seconds': 56
|
||||
}
|
||||
websock: '',
|
||||
url: '',
|
||||
wbData: []
|
||||
}
|
||||
},
|
||||
created () {},
|
||||
methods: {}
|
||||
created () {
|
||||
const baseurl = window.SITE_CONFIG.baseUrl
|
||||
this.url = baseurl.slice(5)
|
||||
this.initWebSocket()
|
||||
},
|
||||
destroyed () {
|
||||
// 页面销毁时关闭ws连接
|
||||
if (this.websock) {
|
||||
this.websock.close() // 关闭websocket
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initWebSocket () {
|
||||
// 初始化weosocket
|
||||
const path = `ws:${this.url}/qj/websocket/2`
|
||||
this.websock = new WebSocket(path)
|
||||
this.websock.onmessage = this.websocketonmessage
|
||||
this.websock.onopen = this.websocketonopen
|
||||
this.websock.onerror = this.websocketonerror
|
||||
this.websock.onclose = this.websocketclose
|
||||
},
|
||||
websocketonopen () {
|
||||
// 连接建立之后执行send方法发送数据
|
||||
this.websocketsend(JSON.stringify())
|
||||
},
|
||||
websocketonerror () {
|
||||
// 连接建立失败重连
|
||||
this.initWebSocket()
|
||||
},
|
||||
websocketonmessage (e) {
|
||||
// 数据接收
|
||||
console.log(e.data)
|
||||
this.wbData = JSON.parse(e.data)
|
||||
console.log(this.wbData)
|
||||
},
|
||||
websocketsend () {
|
||||
// 数据发送
|
||||
this.websock.send()
|
||||
},
|
||||
websocketclose (e) {
|
||||
// 关闭
|
||||
console.log('断开连接', e)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.main-body {
|
||||
min-height: 100%;
|
||||
min-height: 88vh;
|
||||
width: 100%;
|
||||
background: url(~@/assets/img/board/1.png) center no-repeat;
|
||||
background-size: cover;
|
||||
@ -124,5 +93,13 @@ export default {
|
||||
line-height: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container-body {
|
||||
display: flex;
|
||||
margin: auto;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2021-11-15 08:20:28
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-03-18 14:48:46
|
||||
* @LastEditTime: 2022-07-05 15:46:53
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -98,7 +98,7 @@
|
||||
// })
|
||||
},
|
||||
initWebSocket () { // 初始化weosocket
|
||||
const path = `ws:${this.url}/qj/websocket/${'id'}`
|
||||
const path = `ws:${this.url}/qj/websocket/1`
|
||||
this.websock = new WebSocket(path)
|
||||
this.websock.onmessage = this.websocketonmessage
|
||||
this.websock.onopen = this.websocketonopen
|
||||
|
||||
|
Before Width: | Height: | Size: 9.2 KiB After Width: | Height: | Size: 9.2 KiB |
Loading…
Reference in New Issue
Block a user