change
This commit is contained in:
@@ -23,4 +23,5 @@ For a detailed explanation on how things work, check out the [guide](http://vuej
|
||||
# 注意事项
|
||||
+ 华弘大屏分辨率都为 1920 * 1200
|
||||
+ 看板分辨率为 1920 * 1080
|
||||
+ 接口文档地址：https://apifox.com/apidoc/shared-7fca569c-0233-402a-92da-74188764d4fc
|
||||
+ 接口文档地址：https://apifox.com/apidoc/shared-7fca569c-0233-402a-92da-74188764d4fc
|
||||
+ https://apifox.com/apidoc/shared-7fca569c-0233-402a-92da-74188764d4fc/api-168547155
|
||||
@@ -1,20 +1,19 @@
|
||||
<template>
|
||||
<header>
|
||||
<div class="center_text">晟华大屏监控</div>
|
||||
<div class="tag_block">
|
||||
<div class="tag_left">
|
||||
<!-- <div v-if="index == '0'" class="tag cur_tag">首页</div>
|
||||
<router-link v-else to="/homepage" class="tag">首页</router-link> -->
|
||||
<div v-if="index == '1'" class="tag cur_tag">生产统计</div>
|
||||
<router-link v-else to="/prodcount" class="tag">生产统计</router-link>
|
||||
</div>
|
||||
<div class="tag_right">
|
||||
<div v-if="index == '2'" class="tag cur_tag">仓储监控</div>
|
||||
<router-link v-else to="/storagemonitor" class="tag">仓储监控</router-link>
|
||||
<div v-if="index == '3'" class="tag cur_tag">设备监控</div>
|
||||
<router-link v-else to="/devicemonitor" class="tag">设备监控</router-link>
|
||||
<div class="exit_btn iconfont" @click.stop="$router.push('/setup')"></div>
|
||||
<p>{{title}}</p>
|
||||
<div class="data_box clearfix">
|
||||
<div class="date_item date">{{date}}</div>
|
||||
<div class="date_item week">{{week}}</div>
|
||||
<div class="date_item clearfix">
|
||||
<div class="tiem_item hours">{{hours}}</div>
|
||||
<div class="colon">:</div>
|
||||
<div class="tiem_item minutes">{{minutes}}</div>
|
||||
<div class="colon">:</div>
|
||||
<div class="tiem_item seconds">{{seconds}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<slot></slot>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
@@ -22,54 +21,102 @@
|
||||
export default {
|
||||
name: 'Header',
|
||||
data () {
|
||||
return {}
|
||||
return {
|
||||
expand: false,
|
||||
timer: null,
|
||||
time: '',
|
||||
hours: '',
|
||||
minutes: '',
|
||||
seconds: '',
|
||||
date: '',
|
||||
week: ''
|
||||
}
|
||||
},
|
||||
props: {
|
||||
index: String
|
||||
title: String
|
||||
},
|
||||
created () {
|
||||
this.updateTime()
|
||||
this.timer = window.setInterval(this.updateTime, 1000)
|
||||
},
|
||||
beforeDestroy () {
|
||||
this.$once('hook:beforeDestroy', () => {
|
||||
clearInterval(this.timer)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
expandTooltip () {
|
||||
this.expand = !this.expand
|
||||
},
|
||||
updateTime () {
|
||||
let cd = new Date()
|
||||
let year = cd.getFullYear()
|
||||
let month = cd.getMonth() + 1 < 10 ? '0' + (cd.getMonth() + 1) : cd.getMonth() + 1
|
||||
let date = cd.getDate() < 10 ? '0' + cd.getDate() : cd.getDate()
|
||||
let hh = cd.getHours() < 10 ? '0' + cd.getHours() : cd.getHours()
|
||||
let mm = cd.getMinutes() < 10 ? '0' + cd.getMinutes() : cd.getMinutes()
|
||||
let ss = cd.getSeconds() < 10 ? '0' + cd.getSeconds() : cd.getSeconds()
|
||||
var weekday = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
|
||||
let myddy = new Date().getDay()
|
||||
let week = weekday[myddy]
|
||||
this.time = `${hh}:${mm}:${ss}`
|
||||
this.hours = `${hh}`
|
||||
this.minutes = `${mm}`
|
||||
this.seconds = `${ss}`
|
||||
this.date = `${year}年${month}月${date}日`
|
||||
this.week = `${week}`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~@style/mixin'
|
||||
header
|
||||
_wh(100%, 84px)
|
||||
overflow hidden
|
||||
position relative
|
||||
_bis('../assets/images/top.png',auto, 84px)
|
||||
.center_text
|
||||
_wh(400px, 40px)
|
||||
.exit_btn
|
||||
position absolute
|
||||
_font(36px, 40px, #fff,,center)
|
||||
font-family "阿里妈妈数黑体" !important
|
||||
left 50%
|
||||
top 8px
|
||||
margin-left -200px
|
||||
letter-spacing 6px
|
||||
.tag_block
|
||||
_wh(100%, 100%)
|
||||
_fj(row)
|
||||
padding 25px 15px 0
|
||||
.tag_left
|
||||
_wh(50%, 100%)
|
||||
_fj(row, flex-start)
|
||||
.tag
|
||||
margin-right 20px
|
||||
.tag_right
|
||||
_wh(50%, 100%)
|
||||
_fj(row, flex-end)
|
||||
.tag
|
||||
margin-left 20px
|
||||
.tag
|
||||
display inline-block
|
||||
_wh(132px, 36px)
|
||||
_font(16px, 36px)
|
||||
_bis('../assets/images/tag_1.png')
|
||||
cursor pointer
|
||||
&:hover
|
||||
color #32C5FF
|
||||
_bis('../assets/images/tag_2.png')
|
||||
.cur_tag
|
||||
color #32C5FF
|
||||
_bis('../assets/images/tag_2.png')
|
||||
left 25px
|
||||
top 14px
|
||||
height 37px
|
||||
width 37px
|
||||
line-height 37px
|
||||
font-size 20px
|
||||
color #fff
|
||||
background-color transparent
|
||||
header
|
||||
position relative
|
||||
width 100%
|
||||
height 8%
|
||||
position relative
|
||||
background center center / 100% 100% url(../images/screen1/header.png) no-repeat
|
||||
p
|
||||
// font-family "PangMenZhengDao"
|
||||
font-family "YouSheBiaoTiHei"
|
||||
font-size 50px
|
||||
line-height 100px
|
||||
color #fff
|
||||
font-weight lighter
|
||||
text-align center
|
||||
letter-spacing 5px
|
||||
text-shadow 0 8px 8px rgba(0,0,0,0.30)
|
||||
.data_box
|
||||
position absolute
|
||||
right 25px
|
||||
top 14px
|
||||
height 37px
|
||||
.date, .week
|
||||
padding-right 20px
|
||||
.date_item
|
||||
float left
|
||||
font-size 20px
|
||||
line-height 37px
|
||||
color #fff
|
||||
.tiem_item
|
||||
float left
|
||||
font-size 32px
|
||||
line-height 37px
|
||||
color #fff
|
||||
.colon
|
||||
float left
|
||||
font-size 32px
|
||||
line-height 37px
|
||||
color #fff
|
||||
</style>
|
||||
|
||||
@@ -1,143 +0,0 @@
|
||||
<template>
|
||||
<header>
|
||||
<div class="exit_btn" :style="expand ? {opacity: 1} : {opacity: 0.1}">
|
||||
<div class="exit_txt" @click="$router.push('/setup')" :style="expand ? {width: '70px'} : {width: '0px'}">退出</div>
|
||||
<div class="exit_arrow" v-text="!expand ? '>>' : '<<'" @click.stop="expand = !expand"></div>
|
||||
</div>
|
||||
<p>{{title}}</p>
|
||||
<div class="data_box clearfix">
|
||||
<div class="date_item date">{{date}}</div>
|
||||
<div class="date_item week">{{week}}</div>
|
||||
<div class="date_item time clearfix">
|
||||
<div class="tiem_item hours">{{hours}}</div>
|
||||
<div class="colon">:</div>
|
||||
<div class="tiem_item minutes">{{minutes}}</div>
|
||||
<div class="colon">:</div>
|
||||
<div class="tiem_item seconds">{{seconds}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<slot></slot>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Header',
|
||||
data () {
|
||||
return {
|
||||
expand: false,
|
||||
timer: null,
|
||||
time: '',
|
||||
hours: '',
|
||||
minutes: '',
|
||||
seconds: '',
|
||||
date: '',
|
||||
week: ''
|
||||
}
|
||||
},
|
||||
props: {
|
||||
title: String
|
||||
},
|
||||
created () {
|
||||
this.updateTime()
|
||||
this.timer = window.setInterval(this.updateTime, 1000)
|
||||
},
|
||||
beforeDestroy () {
|
||||
this.$once('hook:beforeDestroy', () => {
|
||||
clearInterval(this.timer)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
expandTooltip () {
|
||||
this.expand = !this.expand
|
||||
},
|
||||
updateTime () {
|
||||
let cd = new Date()
|
||||
let year = cd.getFullYear()
|
||||
let month = cd.getMonth() + 1 < 10 ? '0' + (cd.getMonth() + 1) : cd.getMonth() + 1
|
||||
let date = cd.getDate() < 10 ? '0' + cd.getDate() : cd.getDate()
|
||||
let hh = cd.getHours() < 10 ? '0' + cd.getHours() : cd.getHours()
|
||||
let mm = cd.getMinutes() < 10 ? '0' + cd.getMinutes() : cd.getMinutes()
|
||||
let ss = cd.getSeconds() < 10 ? '0' + cd.getSeconds() : cd.getSeconds()
|
||||
var weekday = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
|
||||
let myddy = new Date().getDay()
|
||||
let week = weekday[myddy]
|
||||
this.time = `${hh}:${mm}:${ss}`
|
||||
this.hours = `${hh}`
|
||||
this.minutes = `${mm}`
|
||||
this.seconds = `${ss}`
|
||||
this.date = `${year}年${month}月${date}日`
|
||||
this.week = `${week}`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
header
|
||||
position relative
|
||||
width 100%
|
||||
height 8%
|
||||
position relative
|
||||
background center center / 100% 100% url(../images/screen1/header.png) no-repeat
|
||||
p
|
||||
// font-family "PangMenZhengDao"
|
||||
font-family "YouSheBiaoTiHei"
|
||||
font-size 50px
|
||||
line-height 100px
|
||||
color #fff
|
||||
font-weight lighter
|
||||
text-align center
|
||||
letter-spacing 5px
|
||||
text-shadow 0 8px 8px rgba(0,0,0,0.30)
|
||||
.data_box
|
||||
position absolute
|
||||
right 0
|
||||
top 14px
|
||||
height 37px
|
||||
.date, .week
|
||||
padding-right 20px
|
||||
.time
|
||||
width 170px
|
||||
text-align center
|
||||
.date_item
|
||||
float left
|
||||
font-size 20px
|
||||
line-height 37px
|
||||
color #fff
|
||||
.tiem_item
|
||||
float left
|
||||
font-size 32px
|
||||
line-height 37px
|
||||
color #fff
|
||||
.colon
|
||||
float left
|
||||
font-size 32px
|
||||
line-height 37px
|
||||
color #fff
|
||||
.exit_btn
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 30px;
|
||||
height 50px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.exit_txt
|
||||
font-size: 20px;
|
||||
line-height: 50px;
|
||||
color: #e6e7e1;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
transition width .3s ease
|
||||
overflow hidden
|
||||
background-color: rgba(30, 182, 203, 80%);
|
||||
.exit_arrow
|
||||
width: 46px;
|
||||
font-size: 20px;
|
||||
line-height: 50px;
|
||||
color: #e6e7e1;
|
||||
text-align: center;
|
||||
background-color: rgba(30, 182, 203, 60%);
|
||||
border-top-right-radius: 30px;
|
||||
border-bottom-right-radius: 30px
|
||||
</style>
|
||||
@@ -7,3 +7,5 @@ export const inOutKilnDetail = () => post('api/cockpit/inOutKilnDetail', {})
|
||||
export const kilnDetail = () => post('api/cockpit/kilnDetail', {})
|
||||
// 大屏-两侧图表
|
||||
export const screenTableData = () => post('api/cockpit/screenTableData', {})
|
||||
// 窑看板
|
||||
export const klineInfo = () => post('api/cockpit/klineInfo', {})
|
||||
|
||||
@@ -2142,3 +2142,394 @@ export const screenTableData = () => {
|
||||
}
|
||||
return res
|
||||
}
|
||||
// 窑看板
|
||||
export const klineInfo = () => {
|
||||
let res = {
|
||||
'outKilnInfoVos': [
|
||||
{
|
||||
'vehicleCode': '1026',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1008',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0022',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1063',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0019',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1035',
|
||||
'materialCode': 'AP-55A',
|
||||
'materialModel': '35/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1062',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1023',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1027',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0008',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0045',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1055',
|
||||
'materialCode': 'MT-14A',
|
||||
'materialModel': '20/40',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1147',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0039',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1001',
|
||||
'materialCode': 'MT-14BT',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1064',
|
||||
'materialCode': 'ML-70B',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1028',
|
||||
'materialCode': 'ML-60BT',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1029',
|
||||
'materialCode': 'ML-14BT',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1044',
|
||||
'materialCode': 'ML-70B',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1013',
|
||||
'materialCode': 'ML-60BT',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1135',
|
||||
'materialCode': 'ML-60BT',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
}
|
||||
],
|
||||
'inKilnInfoVos': [
|
||||
{
|
||||
'vehicleCode': '0009',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0048',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0024',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1046',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1145',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0016',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1085',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1801',
|
||||
'materialCode': 'BP-65A',
|
||||
'materialModel': '35/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0036',
|
||||
'materialCode': 'MT-14A',
|
||||
'materialModel': '18/40',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0018',
|
||||
'materialCode': 'MT-14A',
|
||||
'materialModel': '18/40',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1098',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0010',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1139',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
}
|
||||
],
|
||||
'twoKilnInfoVos': [],
|
||||
'oneKilnInfoVos': [
|
||||
{
|
||||
'vehicleCode': '0003',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1094',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0034',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1003',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1144',
|
||||
'materialCode': 'BP-70A',
|
||||
'materialModel': '40/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1022',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1032',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0026',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1066',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1069',
|
||||
'materialCode': 'BP-65A',
|
||||
'materialModel': '35/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1014',
|
||||
'materialCode': 'BP-70A',
|
||||
'materialModel': '40/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1072',
|
||||
'materialCode': 'MT-60AT',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1057',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0049',
|
||||
'materialCode': 'BP-65A',
|
||||
'materialModel': '35/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0032',
|
||||
'materialCode': 'BP-70A',
|
||||
'materialModel': '40/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0027',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1065',
|
||||
'materialCode': 'ML-70B',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0038',
|
||||
'materialCode': 'MT-14A',
|
||||
'materialModel': '18/40',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0006',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1038',
|
||||
'materialCode': 'MT-14BT',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0013',
|
||||
'materialCode': 'ML-60BT',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1042',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1138',
|
||||
'materialCode': 'AP-70A',
|
||||
'materialModel': '40/0',
|
||||
'materialSpec': 'BD'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1056',
|
||||
'materialCode': 'ML-70BD',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1071',
|
||||
'materialCode': 'ML-75B',
|
||||
'materialModel': '18/30',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '0040',
|
||||
'materialCode': 'MT-14BT',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1078',
|
||||
'materialCode': 'MT-14BT',
|
||||
'materialModel': '20/30',
|
||||
'materialSpec': 'ZX'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1041',
|
||||
'materialCode': 'MT-14A',
|
||||
'materialModel': '20/40',
|
||||
'materialSpec': 'BB'
|
||||
},
|
||||
{
|
||||
'vehicleCode': '1080',
|
||||
'materialCode': 'ML-60BT',
|
||||
'materialModel': '20/10',
|
||||
'materialSpec': 'BB'
|
||||
}
|
||||
]
|
||||
}
|
||||
return res
|
||||
}
|
||||
|
||||
@@ -1,49 +0,0 @@
|
||||
$red = #ed4754
|
||||
$green = #67c23a
|
||||
$yellow = #f2d648
|
||||
$orange = #f17d3a
|
||||
$blue = #6798ef
|
||||
$gray = #c9c9c9
|
||||
$fc1 = #323232
|
||||
|
||||
.green
|
||||
background-color #11ff0d
|
||||
.yellow
|
||||
background-color #fdfd0f
|
||||
.gray
|
||||
background-color #bfbfbf
|
||||
.red
|
||||
background-color #ff1016
|
||||
|
||||
//宽高
|
||||
_wh(w, h)
|
||||
width: w
|
||||
height: h
|
||||
|
||||
//字体大小、行高、颜色
|
||||
_font(size,height,color=$fc1,weight=normal,align=left)
|
||||
font-size: size
|
||||
line-height: height
|
||||
color: color
|
||||
font-weight: weight
|
||||
text-align: align
|
||||
|
||||
//flex 布局和 子元素 对其方式
|
||||
_fj(x=space-between,y=center)
|
||||
display: flex
|
||||
justify-content: x
|
||||
align-items: y
|
||||
|
||||
// 背景图片地址和大小
|
||||
_bis(url,w,h=auto,x=center,y=center)
|
||||
background-position: x y
|
||||
background-size: w h
|
||||
background-image: url(url)
|
||||
background-repeat: no-repeat
|
||||
|
||||
// 定位上下居中
|
||||
_ct()
|
||||
position: absolute
|
||||
top: 50%
|
||||
transform: translateY(-50%)
|
||||
|
||||
@@ -68,7 +68,7 @@ export default {
|
||||
return {
|
||||
loginname: '',
|
||||
password: '',
|
||||
options: [{value: '1', label: '大屏'}, {value: '2', label: '看板1'}, {value: '3', label: '看板2'}],
|
||||
options: [{value: '1', label: '大屏'}, {value: '2', label: '压制生产看板'}, {value: '3', label: '分拣作业监控'}, {value: '4', label: '干燥作业监控'}],
|
||||
value: this.$store.getters.equipId,
|
||||
baseUrl: this.$store.getters.baseUrl,
|
||||
setTime: this.$store.getters.setTime / 1000,
|
||||
@@ -98,9 +98,11 @@ export default {
|
||||
if (this.value === '1') {
|
||||
this.$router.push('/home')
|
||||
} else if (this.value === '2') {
|
||||
this.$router.push('/pressprod')
|
||||
this.$router.push('/boardindex/pressprod')
|
||||
} else if (this.value === '3') {
|
||||
this.$router.push('/SortWorkMonitor')
|
||||
this.$router.push('/boardindex/sortwork')
|
||||
} else if (this.value === '4') {
|
||||
this.$router.push('/boardindex/drytask')
|
||||
}
|
||||
let element = document.documentElement
|
||||
if (this.fullscreen) {
|
||||
|
||||
211
src/pages/modules/board/DryTask.vue
Normal file
211
src/pages/modules/board/DryTask.vue
Normal file
@@ -0,0 +1,211 @@
|
||||
<template>
|
||||
<div class="dry_wraper">
|
||||
<div class="dry_content">
|
||||
<div class="dry_item_wraper">
|
||||
<div class="dry_title">冷却输送线</div>
|
||||
<div class="dry_item">
|
||||
<div class="dry_hj dry_hj_1 fr" v-for="e in outKilnInfoVos" :key="e.vehicleCode" :style="e.active ? {'backgroundColor':'#653101'} : ''">
|
||||
<div v-show="e.active" class="p1">{{ e.vehicleCode }}</div>
|
||||
<div v-show="e.active" class="mater_info">
|
||||
<div class="mater_p p2">{{e.materialCode}}</div>
|
||||
<div class="mater_p p3">{{ e.materialModel }}</div>
|
||||
<div class="mater_p p4">{{ e.materialSpec }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dry_item_line"></div>
|
||||
<div class="dry_item_wraper">
|
||||
<div class="dry_title">1号窑</div>
|
||||
<div class="dry_item">
|
||||
<div class="dry_hj fl" v-for="e in oneKilnInfoVos" :key="e.vehicleCode" :style="e.active ? {'backgroundColor':'#653101'} : ''">
|
||||
<div v-show="e.active" class="p1">{{ e.vehicleCode }}</div>
|
||||
<div v-show="e.active" class="mater_info">
|
||||
<div class="mater_p p2">{{e.materialCode}}</div>
|
||||
<div class="mater_p p3">{{ e.materialModel }}</div>
|
||||
<div class="mater_p p4">{{ e.materialSpec }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dry_item_line"></div>
|
||||
<div class="dry_item_wraper">
|
||||
<div class="dry_title">2号窑</div>
|
||||
<div class="dry_item">
|
||||
<div class="dry_hj fl" v-for="e in twoKilnInfoVos" :key="e.vehicleCode" :style="e.active ? {'backgroundColor':'#653101'} : ''">
|
||||
<div v-show="e.active" class="p1">{{ e.vehicleCode }}</div>
|
||||
<div v-show="e.active" class="mater_info">
|
||||
<div class="mater_p p2">{{e.materialCode}}</div>
|
||||
<div class="mater_p p3">{{ e.materialModel }}</div>
|
||||
<div class="mater_p p4">{{ e.materialSpec }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dry_item_line"></div>
|
||||
<div class="dry_item_wraper">
|
||||
<div class="dry_title">进窑输送线</div>
|
||||
<div class="dry_item">
|
||||
<div class="dry_hj dry_hj_1 fr" v-for="e in inKilnInfoVos" :key="e.vehicleCode" :style="e.active ? {'backgroundColor':'#653101'} : ''">
|
||||
<div v-show="e.active" class="p1">{{ e.vehicleCode }}</div>
|
||||
<div v-show="e.active" class="mater_info">
|
||||
<div class="mater_p p2">{{e.materialCode}}</div>
|
||||
<div class="mater_p p3">{{ e.materialModel }}</div>
|
||||
<div class="mater_p p4">{{ e.materialSpec }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { klineInfo } from '@js/getData2.js'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
interTime: this.$store.getters.setTime,
|
||||
timer: null,
|
||||
outKilnInfoVos: [], // 出窑缓存线信息
|
||||
inKilnInfoVos: [], // 入窑缓存线
|
||||
oneKilnInfoVos: [], // 窑1
|
||||
twoKilnInfoVos: [] // 窑2
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this._klineInfo()
|
||||
this.refresh()
|
||||
},
|
||||
beforeDestroy () {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
},
|
||||
destroyed () {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
},
|
||||
methods: {
|
||||
refresh () {
|
||||
this.timer = setInterval(() => {
|
||||
this._klineInfo()
|
||||
}, this.interTime)
|
||||
},
|
||||
async _klineInfo () {
|
||||
let res = await klineInfo()
|
||||
this.outKilnInfoVos = [...res.outKilnInfoVos]
|
||||
this.outKilnInfoVos.map(el => {
|
||||
this.$set(el, 'active', true)
|
||||
})
|
||||
for (let i = this.outKilnInfoVos.length; i < 39; i++) {
|
||||
this.outKilnInfoVos.push({vehicleCode: `out${i}`, active: false})
|
||||
}
|
||||
this.inKilnInfoVos = [...res.inKilnInfoVos]
|
||||
this.inKilnInfoVos.map(el => {
|
||||
this.$set(el, 'active', true)
|
||||
})
|
||||
for (let i = this.inKilnInfoVos.length; i < 40; i++) {
|
||||
this.inKilnInfoVos.push({vehicleCode: `in${i}`, active: false})
|
||||
}
|
||||
this.oneKilnInfoVos = [...res.oneKilnInfoVos]
|
||||
this.oneKilnInfoVos.map(el => {
|
||||
this.$set(el, 'active', true)
|
||||
})
|
||||
for (let i = this.oneKilnInfoVos.length; i < 37; i++) {
|
||||
this.oneKilnInfoVos.push({vehicleCode: `yao1${i}`, active: false})
|
||||
}
|
||||
this.twoKilnInfoVos = [...res.twoKilnInfoVos]
|
||||
this.twoKilnInfoVos.map(el => {
|
||||
this.$set(el, 'active', true)
|
||||
})
|
||||
for (let i = this.twoKilnInfoVos.length; i < 37; i++) {
|
||||
this.twoKilnInfoVos.push({vehicleCode: `yao2${i}`, active: false})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~@style/mixin'
|
||||
.dry_wraper
|
||||
position relative
|
||||
border-left 4px solid #18537a
|
||||
border-right 4px solid #18537a
|
||||
_wh(100%, 100%)
|
||||
// background-color #034c6d
|
||||
background: -webkit-radial-gradient(closest-side circle,rgba(86, 188, 234, 50%) 25%, #034c6d 100%)
|
||||
box-shadow inset 3px -6px 6px 0px rgba(0, 0, 0, 30%), inset -6px 3px 6px 0px rgba(0, 0, 0, 30%)
|
||||
.dry_content
|
||||
position relative
|
||||
_wh(100%, 100%)
|
||||
margin 0 auto
|
||||
padding 24px 0
|
||||
box-shadow inset 3px -6px 6px 0px rgba(0, 0, 0, 30%), inset -6px 3px 6px 0px rgba(0, 0, 0, 30%)
|
||||
&:before
|
||||
content ''
|
||||
position absolute
|
||||
top 0
|
||||
left -4px
|
||||
_wh(calc(100% + 4px), 20px)
|
||||
border 2px solid #7d420b
|
||||
background-color #653101
|
||||
&:after
|
||||
content ''
|
||||
position absolute
|
||||
bottom 0
|
||||
left -4px
|
||||
_wh(calc(100% + 4px), 20px)
|
||||
border 2px solid #7d420b
|
||||
background-color #653101
|
||||
.dry_item_wraper
|
||||
_wh(100%, calc((100% - 60px) / 4))
|
||||
.dry_item_line
|
||||
position relative
|
||||
left -4px
|
||||
_wh(calc(100% + 8px), 20px)
|
||||
border 2px solid #7d420b
|
||||
background-color #653101
|
||||
.dry_title
|
||||
font-size 24px
|
||||
font-family: 'YouSheBiaoTiHei';
|
||||
font-weight: 400;
|
||||
color: transparent;
|
||||
line-height 30px
|
||||
background: linear-gradient(0deg, #F9FEFF 0%, #F5FCFF 53.3154296875%, #BAE9FF 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
text-align: center;
|
||||
.dry_item
|
||||
clear both
|
||||
_wh(100%, calc(100% - 30px))
|
||||
padding 20px 10px
|
||||
.dry_hj
|
||||
_wh(2.5%, 100%)
|
||||
background-color #02344d
|
||||
border 2px solid #186189
|
||||
border-right 0
|
||||
&:last-child
|
||||
border-right 2px solid #186189
|
||||
.dry_hj_1
|
||||
&:last-child
|
||||
border-right 0
|
||||
.p1
|
||||
_font(14px, 30px, #73f440,,)
|
||||
border-bottom 2px solid #186189
|
||||
.mater_info
|
||||
height calc(100% - 32px)
|
||||
.mater_p
|
||||
display flex
|
||||
justify-content center
|
||||
align-items center
|
||||
width 100%
|
||||
_font(12px, 13px, #fff,,center)
|
||||
.p2
|
||||
height 50%
|
||||
// border-bottom 2px solid #186189
|
||||
.p3
|
||||
height 25%
|
||||
// border-bottom 2px solid #186189
|
||||
.p4
|
||||
height 25%
|
||||
</style>
|
||||
@@ -1,113 +1,103 @@
|
||||
<template>
|
||||
<section class="bg">
|
||||
<t-header title="压制生产看板">
|
||||
</t-header>
|
||||
<div class="container">
|
||||
<div class="con1">
|
||||
<div class="cbox">
|
||||
<div>当前班次：</div>
|
||||
<div class="num" style="color: #f7b502; font-size: 46px; letter-spacing: 15px;">
|
||||
{{showText}}
|
||||
</div>
|
||||
<div class="wraper">
|
||||
<div class="con1">
|
||||
<div class="cbox">
|
||||
<div>当前班次：</div>
|
||||
<div class="num" style="color: #f7b502; font-size: 46px; letter-spacing: 15px;">
|
||||
{{showText}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="cbox">
|
||||
<div>计划生产：</div>
|
||||
<div class="num">
|
||||
<div class="bg" v-for="(item, i) in showNum1" :key="i" :class="{dot: item === '.'}">{{item}}</div>
|
||||
</div>
|
||||
<div>块</div>
|
||||
</div>
|
||||
<div class="cbox">
|
||||
<div>已生产：</div>
|
||||
<div class="num">
|
||||
<div class="bg" v-for="(item, i) in showNum2" :key="i" :class="{dot: item === '.'}">{{item}}</div>
|
||||
</div>
|
||||
<div>块</div>
|
||||
</div>
|
||||
<div class="cbox">
|
||||
<div>不合格数：</div>
|
||||
<div class="num">
|
||||
<div class="bg" v-for="(item, i) in showNum3" :key="i" :class="{dot: item === '.'}">{{item}}</div>
|
||||
</div>
|
||||
<div>块</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center_wrapper" style="display:flex">
|
||||
<div class="con2">
|
||||
<div class="title"><span class="dotIncon"></span><span class="tltxt">当班生产</span></div>
|
||||
<div class="item_content_0">
|
||||
<div id="echart_d1" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="con3">
|
||||
<div class="title"><span class="dotIncon"></span><span class="tltxt">当日订单</span></div>
|
||||
<div class="item_content_1">
|
||||
<div id="echart_d2" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="four_wrap">
|
||||
<div class="item_tip item_tip_bg_l">
|
||||
<div class="item_tip_left">生产任务</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab_2">
|
||||
<li>设备</li>
|
||||
<li>工单号</li>
|
||||
<li>班次类型</li>
|
||||
<li>生产物料</li>
|
||||
<li>订单客户</li>
|
||||
<li>计划开始</li>
|
||||
<li>计划数(块)</li>
|
||||
<li>已生产(块)</li>
|
||||
<li>不合格(块)</li>
|
||||
<li>合格率</li>
|
||||
<li>状态</li>
|
||||
<li>开工人</li>
|
||||
<li>开工时间</li>
|
||||
<li>完工时间</li>
|
||||
</ul>
|
||||
<div class="scroll_container_2">
|
||||
<vue-seamless-scroll :data="ProductionTask" :class-option="defaultOption2">
|
||||
<ul class="scroll-ul_2">
|
||||
<li v-for="(e, i) in ProductionTask" :key="i">
|
||||
<div class="scroll-ul_2_div">{{e.device}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.workorderCode}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.team}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.materialName}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.customer}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planproducestartDate}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.realQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.unqualifiedQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.qualifiedRate}}%</div>
|
||||
<div class="scroll-ul_2_div">{{e.workorderStatus}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.operator}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.realproducestartDate}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.realproduceendDate}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
<div class="cbox">
|
||||
<div>计划生产：</div>
|
||||
<div class="num">
|
||||
<div class="bg" v-for="(item, i) in showNum1" :key="i" :class="{dot: item === '.'}">{{item}}</div>
|
||||
</div>
|
||||
<div>块</div>
|
||||
</div>
|
||||
<div class="cbox">
|
||||
<div>已生产：</div>
|
||||
<div class="num">
|
||||
<div class="bg" v-for="(item, i) in showNum2" :key="i" :class="{dot: item === '.'}">{{item}}</div>
|
||||
</div>
|
||||
<div>块</div>
|
||||
</div>
|
||||
<div class="cbox">
|
||||
<div>不合格数：</div>
|
||||
<div class="num">
|
||||
<div class="bg" v-for="(item, i) in showNum3" :key="i" :class="{dot: item === '.'}">{{item}}</div>
|
||||
</div>
|
||||
<div>块</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center_wrapper" style="display:flex">
|
||||
<div class="con2">
|
||||
<div class="title"><span class="dotIncon"></span><span class="tltxt">当班生产</span></div>
|
||||
<div class="item_content_0">
|
||||
<div id="echart_d1" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="con3">
|
||||
<div class="title"><span class="dotIncon"></span><span class="tltxt">当日订单</span></div>
|
||||
<div class="item_content_1">
|
||||
<div id="echart_d2" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="four_wrap">
|
||||
<div class="item_tip item_tip_bg_l">
|
||||
<div class="item_tip_left">生产任务</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab_2">
|
||||
<li>设备</li>
|
||||
<li>工单号</li>
|
||||
<li>班次类型</li>
|
||||
<li>生产物料</li>
|
||||
<li>订单客户</li>
|
||||
<li>计划开始</li>
|
||||
<li>计划数(块)</li>
|
||||
<li>已生产(块)</li>
|
||||
<li>不合格(块)</li>
|
||||
<li>合格率</li>
|
||||
<li>状态</li>
|
||||
<li>开工人</li>
|
||||
<li>开工时间</li>
|
||||
<li>完工时间</li>
|
||||
</ul>
|
||||
<div class="scroll_container_2">
|
||||
<vue-seamless-scroll :data="ProductionTask" :class-option="defaultOption2">
|
||||
<ul class="scroll-ul_2">
|
||||
<li v-for="(e, i) in ProductionTask" :key="i">
|
||||
<div class="scroll-ul_2_div">{{e.device}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.workorderCode}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.team}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.materialName}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.customer}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planproducestartDate}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.realQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.unqualifiedQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.qualifiedRate}}%</div>
|
||||
<div class="scroll-ul_2_div">{{e.workorderStatus}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.operator}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.realproducestartDate}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.realproduceendDate}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="bottom"></section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import THeader from '@components/header3.vue'
|
||||
// import * as echarts from 'echarts'
|
||||
import { cockpitpress } from '@js/getData1'
|
||||
// import {cockpitpress} from '@js/mork1.js'
|
||||
export default {
|
||||
name: 'ProdCount',
|
||||
components: {
|
||||
THeader
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
timeOut: null,
|
||||
@@ -632,20 +622,7 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
// @import '~@css/mixin'
|
||||
@import '../../css/mixin'
|
||||
// @import '~@style/mixin'
|
||||
.bg
|
||||
_wh(100%, 100%)
|
||||
overflow hidden
|
||||
.container
|
||||
_wh(100%, calc(100% - 138px))
|
||||
padding 30px 25.09px 0
|
||||
overflow hidden
|
||||
clear both
|
||||
.bottom
|
||||
_wh(100%, 38px)
|
||||
background center bottom / 1906px 100% url(../../images/screen1/bottom.png) no-repeat
|
||||
@import '~@style/mixin'
|
||||
.blue
|
||||
color #32C5FF !important
|
||||
.green
|
||||
@@ -663,7 +640,7 @@ export default {
|
||||
height 123px
|
||||
overflow hidden
|
||||
position relative
|
||||
background center center / 100% 100% url(../../images/screen1/sctj_top.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/sctj_top.png) no-repeat
|
||||
margin 5px 0
|
||||
text-align center
|
||||
display flex
|
||||
@@ -683,7 +660,7 @@ export default {
|
||||
height 19px
|
||||
overflow hidden
|
||||
position relative
|
||||
background center center / 100% 100% url(../../images/screen1/sctj_icon.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/sctj_icon.png) no-repeat
|
||||
margin-right 20px
|
||||
.num
|
||||
display flex
|
||||
@@ -715,7 +692,7 @@ export default {
|
||||
_font(18px, 32px, #fff,,left)
|
||||
letter-spacing: 2px;
|
||||
text-shadow: 0 0 9px #159aff;
|
||||
background center center / 100% 100% url(../../images/screen1/bg_title_l.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/bg_title_l.png) no-repeat
|
||||
.item_content_0
|
||||
// _wh(calc(100% - 44px), calc(100% - 112px))
|
||||
_wh(calc(100% - 44px), 100%)
|
||||
@@ -732,7 +709,7 @@ export default {
|
||||
position relative
|
||||
top 3px
|
||||
left -6px
|
||||
background center center / 100% 100% url(../../images/screen1/bg_title_tip.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/bg_title_tip.png) no-repeat
|
||||
.con3
|
||||
width 30%
|
||||
height calc(100% - 34px)
|
||||
@@ -747,7 +724,7 @@ export default {
|
||||
_font(18px, 32px, #fff,,left)
|
||||
letter-spacing: 2px;
|
||||
text-shadow: 0 0 9px #159aff;
|
||||
background center center / 100% 100% url(../../images/screen1/bg_title_s.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/bg_title_s.png) no-repeat
|
||||
.item_content_1
|
||||
_wh(calc(100% - 44px), 100%)
|
||||
margin 60px auto
|
||||
@@ -761,7 +738,7 @@ export default {
|
||||
// _wh(calc(100% - 0px), 32px)
|
||||
// margin 17px 0 10px 0
|
||||
// padding-left 18px
|
||||
// background center center / 100% 100% url(../../images/screen1/bg_title_j.png) no-repeat
|
||||
// background center center / 100% 100% url(../../../images/screen1/bg_title_j.png) no-repeat
|
||||
// color #fff
|
||||
// h2
|
||||
// _font(16px, 32px, #fff,,left)
|
||||
@@ -843,7 +820,7 @@ export default {
|
||||
line-height 32px
|
||||
padding 0 10px
|
||||
.item_tip_bg_l
|
||||
background center center / 100% 100% url(../../images/screen1/bg_title_j.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/bg_title_j.png) no-repeat
|
||||
.item_tip_left
|
||||
_wh(60%, 100%)
|
||||
font-family "SourceHanSansCN"
|
||||
@@ -851,7 +828,7 @@ export default {
|
||||
letter-spacing 2px
|
||||
text-shadow 0 0 9px #159AFF
|
||||
padding-left 34px
|
||||
background center left / 22px 22px url(../../images/screen1/bg_title_tip.png) no-repeat
|
||||
background center left / 22px 22px url(../../../images/screen1/bg_title_tip.png) no-repeat
|
||||
.item_content
|
||||
_wh(100%, calc(100% - 37px))
|
||||
margin-top 7px
|
||||
@@ -886,7 +863,7 @@ export default {
|
||||
.scroll-ul_2_div
|
||||
float left
|
||||
_wh(7%, 44px)
|
||||
_fj(center)
|
||||
_fj(row,center)
|
||||
_font(12px, 44px, #fff,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
@@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<<<<<<< HEAD:src/pages/modules/SortWorkMonitor.vue
|
||||
<section class="bg">
|
||||
<t-header title="分拣作业监控">
|
||||
</t-header>
|
||||
@@ -49,127 +50,169 @@
|
||||
<div class="b-item"><span>物料：</span><span>{{topSec2.materialName}}</span></div>
|
||||
<div class="b-item"><span>规格：</span><span>{{topSec2.materialSpec}}</span></div>
|
||||
<div class="b-item"><span>数量：</span><span>{{topSec2.planQty}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-box">
|
||||
<div class="a-box">
|
||||
<!-- <div class="a-title">人工分拣线：</div> -->
|
||||
<div class="pie_wraper_2">
|
||||
<div class="w_wraper">
|
||||
<div id="new_home_echart_03" style="width: 220px; height: 220px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="b-box">
|
||||
<div class="b-item" v-for="(e, i) in topSec3" :key="i"><span>{{e.pointName}}：</span><span>{{e.materialName}}</span></div>
|
||||
<!-- <div class="b-item"><span>当前工单：</span><span>{{topSec3.workorderCode}}</span></div>
|
||||
<div class="b-item"><span>客户：</span><span>{{topSec3.customer}}</span></div>
|
||||
<div class="b-item"><span>物料：</span><span>{{topSec3.materialName}}</span></div>
|
||||
<div class="b-item"><span>规格：</span><span>{{topSec3.materialSpec}}</span></div>
|
||||
<div class="b-item"><span>数量：</span><span>{{topSec3.planQty}}</span></div> -->
|
||||
=======
|
||||
<div class="wraper">
|
||||
<div class="zdy_box">
|
||||
<div class="zero-wrap">
|
||||
<div class="zero-title">
|
||||
<div class="item_tip_left">{{topSec1.pointName}}</div>
|
||||
</div>
|
||||
<div class="zero-title">
|
||||
<div class="item_tip_left">{{topSec2.pointName}}</div>
|
||||
</div>
|
||||
<div class="zero-title">
|
||||
<div class="item_tip_left">人工分拣线</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="one_wrap">
|
||||
<div class="e-box">
|
||||
<div class="a-box">
|
||||
<!-- <div class="a-title">分拣线1：</div> -->
|
||||
<div class="pie_wraper_2">
|
||||
<div class="w_wraper">
|
||||
<div id="new_home_echart_01" style="width: 220px; height: 220px;"></div>
|
||||
>>>>>>> 531846f0d18afe089f16fd741b29b58522df2837:src/pages/modules/board/SortWorkMonitor.vue
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="two_wrap">
|
||||
<div class="zdy_box">
|
||||
<div class="two_wrap_item">
|
||||
<div class="two_w_item_label">当日已拆垛：</div>
|
||||
</div>
|
||||
<div class="two_wrap_item">
|
||||
<div class="two_w_item_label">当日已码垛：</div>
|
||||
<div class="b-box">
|
||||
<div class="b-item"><span>当前工单：</span><span>{{topSec1.workorderCode}}</span></div>
|
||||
<div class="b-item"><span>客户：</span><span>{{topSec1.customer}}</span></div>
|
||||
<div class="b-item"><span>物料：</span><span>{{topSec1.materialName}}</span></div>
|
||||
<div class="b-item"><span>规格：</span><span>{{topSec1.materialSpec}}</span></div>
|
||||
<div class="b-item"><span>数量：</span><span>{{topSec1.planQty}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-box">
|
||||
<div class="a-box">
|
||||
<!-- <div class="a-title">分拣线2：</div> -->
|
||||
<div class="pie_wraper_2">
|
||||
<div class="w_wraper">
|
||||
<div id="new_home_echart_02" style="width: 220px; height: 220px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="three_wrap">
|
||||
<div class="zdy_box">
|
||||
<div class="three_w_item">
|
||||
<vue-seamless-scroll :data="chaiduoArr" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in chaiduoArr" :key="i">
|
||||
<span>{{e.createTime}} </span>
|
||||
<span class="scroll_th">托盘号:</span>
|
||||
<span>{{ e.vehicleCode }}，</span>
|
||||
<span class="scroll_th">物料:</span>
|
||||
<span>{{ e.materialName }}，</span>
|
||||
<span class="scroll_th">数量:</span>
|
||||
<span>{{ e.materialQty }}，</span>
|
||||
<span class="scroll_th">重量:</span>
|
||||
<span>{{ e.materialWeight }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
<div class="three_w_item">
|
||||
<vue-seamless-scroll :data="maduoArr" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in maduoArr" :key="i">
|
||||
<span>{{e.createTime}} </span>
|
||||
<span class="scroll_th">托盘号:</span>
|
||||
<span>{{ e.vehicleCode }}，</span>
|
||||
<span class="scroll_th">物料:</span>
|
||||
<span>{{ e.materialName }}，</span>
|
||||
<span class="scroll_th">数量:</span>
|
||||
<span>{{ e.materialQty }}，</span>
|
||||
<span class="scroll_th">重量:</span>
|
||||
<span>{{ e.materialWeight }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
<div class="b-box">
|
||||
<div class="b-item"><span>当前工单：</span><span>{{topSec2.workorderCode}}</span></div>
|
||||
<div class="b-item"><span>客户：</span><span>{{topSec2.customer}}</span></div>
|
||||
<div class="b-item"><span>物料：</span><span>{{topSec2.materialName}}</span></div>
|
||||
<div class="b-item"><span>规格：</span><span>{{topSec2.materialSpec}}</span></div>
|
||||
<div class="b-item"><span>数量：</span><span>{{topSec2.planQty}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-box">
|
||||
<div class="a-box">
|
||||
<!-- <div class="a-title">人工分拣线：</div> -->
|
||||
<div class="pie_wraper_2">
|
||||
<div class="w_wraper">
|
||||
<div id="new_home_echart_03" style="width: 220px; height: 220px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="four_wrap">
|
||||
<div class="item_tip item_tip_bg_l">
|
||||
<div class="item_tip_left">剩余工单列表</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab_2">
|
||||
<li>工单号</li>
|
||||
<li>物料</li>
|
||||
<li>规格</li>
|
||||
<li>数量（块）</li>
|
||||
<li>重量（吨）</li>
|
||||
<li>订单号</li>
|
||||
<li>客户</li>
|
||||
<li>托盘类型</li>
|
||||
<li>创建时间</li>
|
||||
</ul>
|
||||
<div class="scroll_container_2">
|
||||
<vue-seamless-scroll :data="lastWorkOrderList" :class-option="defaultOption2">
|
||||
<ul class="scroll-ul_2">
|
||||
<li v-for="(e, i) in lastWorkOrderList" :key="i">
|
||||
<div class="scroll-ul_2_div">{{e.workorderCode}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.materialName}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.materialSpec}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planWeight}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.produceOrder}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.customer}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.vehicleType}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.createTime}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="b-box">
|
||||
<div class="b-item" v-for="(e, i) in topSec3" :key="i"><span>{{e.pointName}}：</span><span>{{e.materialName}}</span></div>
|
||||
<!-- <div class="b-item"><span>当前工单：</span><span>{{topSec3.workorderCode}}</span></div>
|
||||
<div class="b-item"><span>客户：</span><span>{{topSec3.customer}}</span></div>
|
||||
<div class="b-item"><span>物料：</span><span>{{topSec3.materialName}}</span></div>
|
||||
<div class="b-item"><span>规格：</span><span>{{topSec3.materialSpec}}</span></div>
|
||||
<div class="b-item"><span>数量：</span><span>{{topSec3.planQty}}</span></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="bottom"></section>
|
||||
</section>
|
||||
<div class="two_wrap">
|
||||
<div class="zdy_box">
|
||||
<div class="two_wrap_item">
|
||||
<div class="two_w_item_label">当日已拆垛：</div>
|
||||
</div>
|
||||
<div class="two_wrap_item">
|
||||
<div class="two_w_item_label">当日已码垛：</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="three_wrap">
|
||||
<div class="zdy_box">
|
||||
<div class="three_w_item">
|
||||
<vue-seamless-scroll :data="chaiduoArr" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in chaiduoArr" :key="i">
|
||||
<span>{{e.createTime}} </span>
|
||||
<span class="scroll_th">托盘号:</span>
|
||||
<span>{{ e.vehicleCode }}，</span>
|
||||
<span class="scroll_th">物料:</span>
|
||||
<span>{{ e.materialName }}，</span>
|
||||
<span class="scroll_th">数量:</span>
|
||||
<span>{{ e.materialQty }}，</span>
|
||||
<span class="scroll_th">重量:</span>
|
||||
<span>{{ e.materialWeight }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
<div class="three_w_item">
|
||||
<vue-seamless-scroll :data="maduoArr" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in maduoArr" :key="i">
|
||||
<span>{{e.createTime}} </span>
|
||||
<span class="scroll_th">托盘号:</span>
|
||||
<span>{{ e.vehicleCode }}，</span>
|
||||
<span class="scroll_th">物料:</span>
|
||||
<span>{{ e.materialName }}，</span>
|
||||
<span class="scroll_th">数量:</span>
|
||||
<span>{{ e.materialQty }}，</span>
|
||||
<span class="scroll_th">重量:</span>
|
||||
<span>{{ e.materialWeight }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="four_wrap">
|
||||
<div class="item_tip item_tip_bg_l">
|
||||
<div class="item_tip_left">剩余工单列表</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab_2">
|
||||
<li>工单号</li>
|
||||
<li>物料</li>
|
||||
<li>规格</li>
|
||||
<li>数量（块）</li>
|
||||
<li>重量（吨）</li>
|
||||
<li>订单号</li>
|
||||
<li>客户</li>
|
||||
<li>托盘类型</li>
|
||||
<li>创建时间</li>
|
||||
</ul>
|
||||
<div class="scroll_container_2">
|
||||
<vue-seamless-scroll :data="lastWorkOrderList" :class-option="defaultOption2">
|
||||
<ul class="scroll-ul_2">
|
||||
<li v-for="(e, i) in lastWorkOrderList" :key="i">
|
||||
<div class="scroll-ul_2_div">{{e.workorderCode}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.materialName}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.materialSpec}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planQty}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.planWeight}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.produceOrder}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.customer}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.vehicleType}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.createTime}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import THeader from '@components/header3.vue'
|
||||
import {cockpitsorting} from '@js/getData1.js'
|
||||
// import {cockpitsorting} from '@js/mork1.js'
|
||||
export default {
|
||||
name: 'SortWorkMonitor',
|
||||
components: {
|
||||
THeader
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
timer: null,
|
||||
@@ -473,18 +516,7 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
// @import '~@css/mixin'
|
||||
@import '../../css/mixin'
|
||||
.bg
|
||||
_wh(100%, 100%)
|
||||
overflow hidden
|
||||
.container
|
||||
_wh(100%, calc(100% - 138px))
|
||||
padding 30px 25.09px 0
|
||||
clear both
|
||||
.bottom
|
||||
_wh(100%, 38px)
|
||||
background center bottom / 1906px 100% url(../../images/screen1/bottom.png) no-repeat
|
||||
@import '~@style/mixin'
|
||||
.zero-wrap
|
||||
_wh(100%, 12%)
|
||||
padding 0 0 15px 0
|
||||
@@ -497,14 +529,14 @@ export default {
|
||||
font-weight: bold;
|
||||
font-size 18px
|
||||
color #ffffff
|
||||
background center center / 100% 100% url(../../images/screen1/bg_title_s.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/bg_title_s.png) no-repeat
|
||||
&:nth-child(2)
|
||||
margin-left 2%
|
||||
margin-right 2%
|
||||
.one_wrap
|
||||
_wh(100%, 12%)
|
||||
padding 0 0 15px 15px
|
||||
// background center center / 100% 100% url(../../images/screen1/sctj_top.png) no-repeat
|
||||
// background center center / 100% 100% url(../../../images/screen1/sctj_top.png) no-repeat
|
||||
overflow hidden
|
||||
display flex
|
||||
.e-box
|
||||
@@ -522,7 +554,7 @@ export default {
|
||||
// line-height 34px
|
||||
// font-size 18px
|
||||
// color #32c5ff
|
||||
// background center center / 100% 100% url(../../images/screen1/bg_title_s.png) no-repeat
|
||||
// background center center / 100% 100% url(../../../images/screen1/bg_title_s.png) no-repeat
|
||||
.pie_wraper_2
|
||||
// position absolute
|
||||
// top 17px
|
||||
@@ -531,7 +563,7 @@ export default {
|
||||
height 222px
|
||||
// width 70%
|
||||
// height 70%
|
||||
background center / 100% auto url('../../images/pie-bg_2.png') no-repeat
|
||||
background center / 100% auto url('../../../images/pie-bg_2.png') no-repeat
|
||||
.w_wraper
|
||||
width 100%
|
||||
height 100%
|
||||
@@ -547,12 +579,12 @@ export default {
|
||||
&:nth-child(1)
|
||||
color #2ef6ff
|
||||
.zdy_box
|
||||
_fj(flex-start, flex-start)
|
||||
_fj(row,flex-start, flex-start)
|
||||
flex-wrap wrap
|
||||
align-content flex-start
|
||||
.one_wrap_item
|
||||
height calc(50% - 15px)
|
||||
_fj(flex-start)
|
||||
_fj(row,flex-start)
|
||||
margin-top 15px
|
||||
margin-right 15px
|
||||
.one_w_item_label
|
||||
@@ -565,7 +597,7 @@ export default {
|
||||
min-width 20px
|
||||
height 100%
|
||||
_font(30px, 1, #f7b502,,center)
|
||||
_fj(center)
|
||||
_fj(row,center)
|
||||
background-color rgba(50,197,255,0.1)
|
||||
padding 0 10px
|
||||
.two_wrap
|
||||
@@ -574,7 +606,7 @@ export default {
|
||||
.two_wrap_item
|
||||
_wh(50%, 100%)
|
||||
padding 0 15px
|
||||
_fj()
|
||||
_fj(row)
|
||||
.two_w_item_label
|
||||
width 170px
|
||||
_font(18px, 1, #32c5ff,,)
|
||||
@@ -614,7 +646,7 @@ export default {
|
||||
line-height 32px
|
||||
padding 0 10px
|
||||
.item_tip_bg_l
|
||||
background center center / 100% 100% url(../../images/screen1/bg_title_j.png) no-repeat
|
||||
background center center / 100% 100% url(../../../images/screen1/bg_title_j.png) no-repeat
|
||||
.item_tip_left
|
||||
_wh(60%, 100%)
|
||||
font-family "SourceHanSansCN"
|
||||
@@ -622,7 +654,7 @@ export default {
|
||||
letter-spacing 2px
|
||||
text-shadow 0 0 9px #159AFF
|
||||
padding-left 34px
|
||||
background center left / 22px 22px url(../../images/screen1/bg_title_tip.png) no-repeat
|
||||
background center left / 22px 22px url(../../../images/screen1/bg_title_tip.png) no-repeat
|
||||
.item_content
|
||||
_wh(100%, calc(100% - 37px))
|
||||
margin-top 7px
|
||||
@@ -657,7 +689,7 @@ export default {
|
||||
.scroll-ul_2_div
|
||||
float left
|
||||
_wh(11.1%, 44px)
|
||||
_fj(center)
|
||||
_fj(row,center)
|
||||
_font(12px, 44px, #fff,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
35
src/pages/modules/board/index.vue
Normal file
35
src/pages/modules/board/index.vue
Normal file
@@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<section class="wraper">
|
||||
<t-header :title="$route.meta.title"></t-header>
|
||||
<div class="container">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
<section class="bottom"></section>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import THeader from '@components/header.vue'
|
||||
export default {
|
||||
components: {
|
||||
THeader
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
.wraper
|
||||
width 100%
|
||||
height 100%
|
||||
overflow hidden
|
||||
.container
|
||||
width 100%
|
||||
height calc(100% - 138px)
|
||||
padding 30px 25px 0
|
||||
overflow hidden
|
||||
clear both
|
||||
.bottom
|
||||
width 100%
|
||||
height 38px
|
||||
background center bottom / 1906px 100% url(../../../images/screen1/bottom.png) no-repeat
|
||||
</style>
|
||||
@@ -8,10 +8,7 @@
|
||||
<h2>宁德华弘新材料科技有限公司</h2>
|
||||
</div>
|
||||
<v-time></v-time>
|
||||
<div class="exit_btn" :style="expand ? {opacity: 1} : {opacity: 0.1}">
|
||||
<div class="exit_txt" @click="$router.push('/setup')" :style="expand ? {width: '70px'} : {width: '0px'}">退出</div>
|
||||
<div class="exit_arrow" v-text="!expand ? '>>' : '<<'" @click.stop="expand = !expand"></div>
|
||||
</div>
|
||||
<div class="exit_btn iconfont" @click.stop="$router.push('/setup')"></div>
|
||||
</div>
|
||||
<div class="left_bg"></div>
|
||||
<div class="right_bg"></div>
|
||||
@@ -1423,29 +1420,4 @@ export default {
|
||||
.state_name
|
||||
width 100%
|
||||
height 20px
|
||||
.exit_btn
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 30px;
|
||||
height 50px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.exit_txt
|
||||
font-size: 20px;
|
||||
line-height: 50px;
|
||||
color: #e6e7e1;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
transition width .3s ease
|
||||
overflow hidden
|
||||
background-color: rgba(30, 182, 203, 80%);
|
||||
.exit_arrow
|
||||
width: 46px;
|
||||
font-size: 20px;
|
||||
line-height: 50px;
|
||||
color: #e6e7e1;
|
||||
text-align: center;
|
||||
background-color: rgba(30, 182, 203, 60%);
|
||||
border-top-right-radius: 30px;
|
||||
border-bottom-right-radius: 30px
|
||||
</style>
|
||||
|
||||
@@ -3,8 +3,10 @@ import Router from 'vue-router'
|
||||
|
||||
const Setup = r => require.ensure([], () => r(require('@page/Setup')), 'Setup')
|
||||
const home = r => require.ensure([], () => r(require('@page/modules/home/index')), 'home')
|
||||
const PressProd = r => require.ensure([], () => r(require('@page/modules/PressProd')), 'PressProd')
|
||||
const SortWorkMonitor = r => require.ensure([], () => r(require('@page/modules/SortWorkMonitor')), 'SortWorkMonitor')
|
||||
const boardIndex = r => require.ensure([], () => r(require('@page/modules/board/index')), 'boardIndex')
|
||||
const PressProd = r => require.ensure([], () => r(require('@page/modules/board/PressProd')), 'PressProd')
|
||||
const SortWorkMonitor = r => require.ensure([], () => r(require('@page/modules/board/SortWorkMonitor')), 'SortWorkMonitor')
|
||||
const DryTask = r => require.ensure([], () => r(require('@page/modules/board/DryTask')), 'DryTask')
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
@@ -24,12 +26,21 @@ export default new Router({
|
||||
component: home
|
||||
},
|
||||
{
|
||||
path: '/pressprod',
|
||||
component: PressProd
|
||||
},
|
||||
{
|
||||
path: '/SortWorkMonitor',
|
||||
component: SortWorkMonitor
|
||||
path: '/boardindex',
|
||||
component: boardIndex,
|
||||
children: [{
|
||||
path: 'pressprod',
|
||||
component: PressProd,
|
||||
meta: {title: '压制生产看板'}
|
||||
}, {
|
||||
path: 'sortwork',
|
||||
component: SortWorkMonitor,
|
||||
meta: {title: '分拣作业监控'}
|
||||
}, {
|
||||
path: 'drytask',
|
||||
component: DryTask,
|
||||
meta: {title: '干燥作业监控'}
|
||||
}]
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 1255596 */
|
||||
font-family: "iconfont";
|
||||
src: url('iconfont/iconfont.woff2') format('woff2'),
|
||||
url('iconfont/iconfont.woff') format('woff'),
|
||||
url('iconfont/iconfont.ttf') format('truetype');
|
||||
@@ -30,4 +30,4 @@
|
||||
|
||||
.icon-guanbi:before {
|
||||
content: "\e60f";
|
||||
}
|
||||
}
|
||||
@@ -1,37 +0,0 @@
|
||||
{
|
||||
"id": "1255596",
|
||||
"name": "nl-hht-hl",
|
||||
"font_family": "iconfont",
|
||||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "2229060",
|
||||
"name": "无信号",
|
||||
"font_class": "no-signal",
|
||||
"unicode": "e76b",
|
||||
"unicode_decimal": 59243
|
||||
},
|
||||
{
|
||||
"icon_id": "400034",
|
||||
"name": "下拉",
|
||||
"font_class": "htmal5icon03",
|
||||
"unicode": "e626",
|
||||
"unicode_decimal": 58918
|
||||
},
|
||||
{
|
||||
"icon_id": "731140",
|
||||
"name": "选择",
|
||||
"font_class": "guanbi1",
|
||||
"unicode": "e608",
|
||||
"unicode_decimal": 58888
|
||||
},
|
||||
{
|
||||
"icon_id": "4736203",
|
||||
"name": "关闭",
|
||||
"font_class": "guanbi",
|
||||
"unicode": "e60f",
|
||||
"unicode_decimal": 58895
|
||||
}
|
||||
]
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -8,4 +8,17 @@
|
||||
.state_2
|
||||
background center / 100% 100% url('../images/state_2.png') no-repeat
|
||||
.state_3
|
||||
background center / 100% 100% url('../images/state_3.png') no-repeat
|
||||
background center / 100% 100% url('../images/state_3.png') no-repeat
|
||||
.exit_btn
|
||||
position: fixed;
|
||||
left: 16px;
|
||||
top: 74px;
|
||||
width: 40px;
|
||||
height 40px;
|
||||
line-height 40px;
|
||||
border-radius: 50%;
|
||||
background-color: rgba(0,0,0,0.1);
|
||||
font-size: 22px;
|
||||
color: rgba(103,100,100,0.1);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
Reference in New Issue
Block a user