This commit is contained in:
2024-02-29 17:56:21 +08:00
parent c67f0eb602
commit 5879690bb0
3 changed files with 327 additions and 235 deletions

View File

@@ -3,97 +3,5 @@ import {post} from '@js/http.js'
/** 压制看板 */
export const cockpitpress = (id) => post('api/cockpit/press', {})
export const sortProductionMonitor = () => {
let res = {
// 当前工单信息
'current': {
// 物料
'materialName': '转炉镁碳砖MASC-65鞍钢23Z001',
// 当前工单
'workOrderCode': '230919001',
// 数量
'qty': '10000块',
// 重量
'weight': '10.00吨',
// 是否留有半托
'hasHalf': '否',
// 订单号
'orderCode': '',
// 规格
'spec': '11/11',
// 托盘类型
'vehicleType': '一类木托盘',
// 客户
'customer': '客户'
},
// 已拆垛
'depalletize': {
// 未完成
'uncompleted': 10000,
// 已完成
'completed': 0
},
// 已码垛
'palletize': {
// 未完成
'uncompleted': 50,
// 已完成
'completed': 50
},
// 已拆垛信息
'depalletizedVehicle': [
{
// 物料
'materialName': 'aaa',
// 时间
'datetime': '2023-09-14 14:23:57',
// 数量
'qty': '18块',
// 托盘号
'vehicleCode': 'M0002',
// 重量
'weight': '0.18吨'
}
],
// 已码垛信息
'palletizedVehicle': [
{
// 物料
'materialName': 'aaa',
// 时间
'datetime': '2023-09-14 14:23:57',
// 数量
'qty': '18块',
// 托盘号
'vehicleCode': 'M0002',
// 重量
'weight': '0.18吨'
}
],
// 剩余工单列表
'residualWorkOrder': [
{
// 物料
'materialName': '转炉镁碳砖MASC-65鞍钢23Z001',
// 当前工单
'workOrderCode': '230919001',
// 数量
'qty': '10000块',
// 重量
'weight': '10.00吨',
// 是否留有半托
'hasHalf': '否',
// 订单号
'orderCode': '12333',
// 规格
'spec': '11/11',
// 托盘类型
'vehicleType': '一类木托盘',
// 客户
'customer': '客户',
'createTime': '2023-09-14 14:23:57'
}
]
}
return res
}
/** 分拣作业监控 */
export const sortProductionMonitor = (id) => post('api/cockpit/sortProductionMonitor', {})

View File

@@ -6,7 +6,7 @@
<div class="con1">
<div class="cbox">
<div>当前班次</div>
<div class="num" style="color: #f7b502; font-size: 0.46rem; letter-spacing: 15px;">
<div class="num" style="color: #f7b502; font-size: 46px; letter-spacing: 15px;">
{{showText}}
</div>
</div>
@@ -46,7 +46,7 @@
</div>
</div>
</div>
<div class="con4">
<!-- <div class="con4">
<div class="block_h2">
<div class="title"><span class="dotIncon"></span><span class="tltxt">生产任务</span></div>
</div>
@@ -60,6 +60,53 @@
</li>
</ul>
</vue-seamless-scroll>
</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.workorder_code}}</div>
<div class="scroll-ul_2_div">{{e.team}}</div>
<div class="scroll-ul_2_div">{{e.material_name}}</div>
<div class="scroll-ul_2_div">{{e.customer || '新余钢铁'}}</div>
<div class="scroll-ul_2_div">{{e.planproducestart_date}}</div>
<div class="scroll-ul_2_div">{{e.plan_qty}}</div>
<div class="scroll-ul_2_div">{{e.real_qty}}</div>
<div class="scroll-ul_2_div">{{e.unqualified_qty}}</div>
<div class="scroll-ul_2_div">{{e.qualified_rate}}</div>
<div class="scroll-ul_2_div">{{e.workorder_status}}</div>
<div class="scroll-ul_2_div">{{e.operator || '工人1'}}</div>
<div class="scroll-ul_2_div">{{e.createTime || '10-11 09:01'}}</div>
<div class="scroll-ul_2_div">{{e.createTime|| '10-11 19:11'}}</div>
</li>
</ul>
</vue-seamless-scroll>
</div>
</div>
</div>
</div>
</div>
<section class="bottom"></section>
@@ -69,7 +116,8 @@
<script>
import THeader from '@components/header3.vue'
// import * as echarts from 'echarts'
import { cockpitpress } from '@js/getData1'
// import { cockpitpress } from '@js/getData1'
import {cockpitpress} from '@js/mork1.js'
export default {
name: 'ProdCount',
components: {
@@ -89,16 +137,16 @@ export default {
materData: [],
deviceData: [],
PersonnelMonthlyProduction: [],
MonthlyWorkOrder: [],
// MonthlyWorkOrder: [
// {guada_num: 1200, name: 'XC-0', order_num: 1655, residue_num: 455},
// {guada_num: 1200, name: 'XC-1', order_num: 1655, residue_num: 455},
// {guada_num: 1200, name: 'XC-2', order_num: 1655, residue_num: 455},
// {guada_num: 1200, name: 'XC-3', order_num: 1655, residue_num: 455},
// {guada_num: 1200, name: 'XC-4', order_num: 1655, residue_num: 455},
// {guada_num: 1200, name: 'XC-5', order_num: 1655, residue_num: 455},
// {guada_num: 1200, name: 'XC-6', order_num: 1655, residue_num: 455}
// ],
// MonthlyWorkOrder: [],
MonthlyWorkOrder: [
{guada_num: 1200, name: 'XC-0', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-1', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-2', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-3', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-4', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-5', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-6', order_num: 1655, residue_num: 455}
],
// MonthlyWorkOrder: [
// {
// name: 'A1',
@@ -148,6 +196,20 @@ export default {
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
}
},
defaultOption2 () {
return {
timer1: null,
timer2: null,
step: 0.4, // 数值越大速度滚动越快
limitMoveNum: 6, // 开始无缝滚动的数据量 this.dataList.length
hoverStop: true, // 是否开启鼠标悬停stop
direction: 1, // 0向下 1向上 2向左 3向右
openWatch: true, // 开启数据实时监控刷新dom
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
}
}
},
mounted () {
@@ -176,7 +238,7 @@ export default {
this.showNum2 = (res.DayShiftList[0].real_qty + '').split('')
this.showNum3 = (res.DayShiftList[0].unqualified_qty + '').split('')
// this.PersonnelMonthlyProduction = res.PersonnelMonthlyProduction
this.MonthlyWorkOrder = res.MonthlyWorkOrder
// this.MonthlyWorkOrder = res.MonthlyWorkOrder
this.ProductionTask = res.ProductionTask
this.ShiftProductionList = res.ShiftProductionList
this.setEchart01()
@@ -586,33 +648,17 @@ export default {
// @import '~@css/mixin'
@import '../../css/mixin'
// @import '~@style/mixin'
.pages
position absolute
left .2509rem
top 11%
_wh(20%, .4rem)
_fj(flex-start)
a
cursor pointer
font-family "SourceHanSansCN"
_font(.18rem, .30rem, #fff, 700,)
letter-spacing .01rem
padding .05rem .2rem
border-radius .05rem
background: radial-gradient(circle at 7.2% 13.6%, rgb(37, 249, 245) 0%, #004c92 90%)
+a
margin-left .2rem
.bg
_wh(100%, 100%)
overflow hidden
.container
_wh(100%, calc(100% - 1.38rem))
padding .1rem .2509rem 0
_wh(100%, calc(100% - 138px))
padding 30px 25.09px 0
overflow hidden
clear both
.bottom
_wh(100%, .38rem)
background center bottom / 19.06rem 100% url(../../images/screen1/bottom.png) no-repeat
_wh(100%, 38px)
background center bottom / 1906px 100% url(../../images/screen1/bottom.png) no-repeat
.blue
color #32C5FF !important
.green
@@ -636,67 +682,52 @@ export default {
display flex
justify-content space-between
align-items center
// .c-title
// float left
// // line-height 1.23rem
// line-height 123px
// .c-left
// margin 0 1.3rem 0 1.3rem
// display flex
// align-items center
// .c-right
// // margin 0 2.9rem 0 2.5rem
// display flex
// align-items center
.cbox
width 30%
display flex
align-items center
justify-content center
div
// font-size .24rem
font-size 24px
color #32C5FF
.icon1
display inline-block
width .19rem
height .19rem
width 19px
height 19px
overflow hidden
position relative
background center center / 100% 100% url(../../images/screen1/sctj_icon.png) no-repeat
margin-right .2rem
margin-right 20px
.num
display flex
align-items center
.bg
// width .44rem
// height .6rem
width 44px
height 60px
background rgba(50,197,255,0.10)
display flex
align-items center
justify-content center
margin-right .1rem
// font-size .5rem
margin-right 10px
font-size 50px
color #F7B502
.dot
background none
width .14rem
width 14px
.center_wrapper
_wh(100%, calc(50% - 69px))
_fj(row)
.con2
width 70%
// height 100%
height calc(100% - 34px)
.title
// _wh(calc(100% - 34px), 32px)
_wh(100%, 32px)
margin 17px 0
padding-left 0.18rem
_font(16px, 32px, #fff,,left)
padding-left 18px
_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
.item_content_0
// _wh(calc(100% - 44px), calc(100% - 112px))
@@ -717,89 +748,162 @@ export default {
background center center / 100% 100% url(../../images/screen1/bg_title_tip.png) no-repeat
.con3
width 30%
// height 100%
height calc(100% - 34px)
// overflow hidden
position relative
.title
font-family: "SourceHanSansCN";
position absolute
_wh(calc(100% - 34px), 32px)
margin 17px 0
right 0
padding-left 0.18rem
_font(16px, 32px, #fff,,left)
padding-left 18px
_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
.item_content_1
_wh(calc(100% - 44px), 100%)
margin 60px auto
float right
.con4
_wh(100%, calc(50% - 85px))
margin-top 66px
overflow hidden
position relative
.block_h2
_wh(calc(100% - 0px), 32px)
margin 17px 0 10px 0
padding-left 0.18rem
background center center / 100% 100% url(../../images/screen1/bg_title_j.png) no-repeat
color #fff
h2
_font(16px, 32px, #fff,,left)
.list_scroll_title
_wh(calc(100% - 0px), 32px)
margin 0 auto
background #262F52
line-height 32px
color #fff
span
display inline-block
width 5%
text-align center
line-height 32px
font-size 14px
&:nth-child(4)
width 16%
&:nth-child(5)
width 6.5%
&:nth-child(6)
width 6.5%
&:nth-child(7)
width 8%
&:nth-child(14)
width 9%
&:nth-child(15)
width 9%
.content-block-scroll
_wh(calc(100% - 0px), calc(100% - 113px))
margin 0 auto 25px auto
overflow hidden
.content-block-scroll-ul
// .con4
// _wh(100%, calc(50% - 85px))
// margin-top 66px
// overflow hidden
// position relative
// .block_h2
// _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
// color #fff
// h2
// _font(16px, 32px, #fff,,left)
// .list_scroll_title
// _wh(calc(100% - 0px), 32px)
// margin 0 auto
// background #262F52
// line-height 32px
// color #fff
// span
// display inline-block
// width 5%
// text-align center
// line-height 32px
// font-size 14px
// &:nth-child(4)
// width 16%
// &:nth-child(5)
// width 6.5%
// &:nth-child(6)
// width 6.5%
// &:nth-child(7)
// width 8%
// &:nth-child(14)
// width 9%
// &:nth-child(15)
// width 9%
// .content-block-scroll
// _wh(calc(100% - 0px), calc(100% - 113px))
// margin 0 auto 25px auto
// overflow hidden
// .content-block-scroll-ul
// width 100%
// li
// width 100%
// height 38px
// _fj(row, center)
// &:nth-child(2n)
// background rgba(38,47,82,0.50)
// span
// display inline-block
// width 5%
// font-size 12px
// // padding 0 10px
// text-align center
// line-height 38px
// box-sizing border-box
// &:nth-child(4)
// width 16%
// &:nth-child(5)
// width 6.5%
// &:nth-child(6)
// width 6.5%
// &:nth-child(7)
// width 8%
// &:nth-child(14)
// width 9%
// &:nth-child(15)
// width 9%
.four_wrap
// _wh(100%, calc(39% - 20px))
margin-top 70px
// padding 10px 15px
// background-image linear-gradient(to bottom, #050c1b, #16243c)
// border 2px solid #16243c
// border-top-left-radius 10px
// border-top-right-radius 10px
.scroll-ul_1
width 100%
li
width 100%
line-height 40px
span
_font(16px, 1, #fff,,)
.scroll_th
color #2ef6ff
.item_tip
_wh(100%, 32px)
line-height 32px
padding 0 10px
.item_tip_bg_l
background center center / 100% 100% url(../../images/screen1/bg_title_j.png) no-repeat
.item_tip_left
_wh(60%, 100%)
font-family "SourceHanSansCN"
_font(18px, inherit, #fff, 700, left)
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
.item_content
_wh(100%, calc(100% - 37px))
margin-top 7px
.scroll_wrap
_wh(100%, 100%)
border 1px solid rgba(8,205,248,0.3)
.scroll_tab_2
_wh(100%, 40px)
border-bottom 1px solid rgba(8,205,248,0.3)
li
width 100%
height 38px
_fj(row, center)
&:nth-child(2n)
background rgba(38,47,82,0.50)
span
display inline-block
width 5%
font-size 12px
// padding 0 .1rem
text-align center
line-height 38px
box-sizing border-box
&:nth-child(4)
width 16%
&:nth-child(5)
width 6.5%
&:nth-child(6)
width 6.5%
&:nth-child(7)
width 8%
&:nth-child(14)
width 9%
&:nth-child(15)
width 9%
float left
width 7%
_font(14px,40px,#78B1DE,,center)
word-wrap break-word
word-break break-all
white-space nowrap
padding 0 2px
overflow hidden
box-sizing border-box
.scroll_container_2
width 100%
// height calc(100% - 40px)
height 230px
overflow hidden
.scroll-ul_2
li
_wh(100%, 44px)
border-bottom 1px solid rgba(8,205,248,0.3)
&:nth-child(even)
background rgba(1,24,52,0.60)
box-shadow inset 0px 1px 0px 0px rgba(13,89,115,0.3)
.scroll-ul_2_div
float left
_wh(7%, 44px)
_fj(center)
_font(12px, 44px, #fff,,center)
word-wrap break-word
word-break break-all
white-space nowrap
padding 0 2px
overflow hidden
</style>

View File

@@ -33,6 +33,40 @@
<div class="b-item"><span>数量</span><span>10000</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="b-box">
<div class="b-item"><span>当前工单</span><span>GD0000001</span></div>
<div class="b-item"><span>客户</span><span>XXXX有限公司</span></div>
<div class="b-item"><span>物料</span><span>VOD钢包砖</span></div>
<div class="b-item"><span>规格</span><span>200*165/135*100</span></div>
<div class="b-item"><span>数量</span><span>10000</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"><span>分拣1</span><span>VOD钢包砖</span></div>
<div class="b-item"><span>分拣2</span><span>VOD钢包砖</span></div>
<div class="b-item"><span>分拣3</span><span>VOD钢包砖</span></div>
<div class="b-item"><span>分拣4</span><span>VOD钢包砖</span></div>
<div class="b-item"><span>分拣5</span><span>VOD钢包砖</span></div>
</div>
</div>
</div>
<div class="two_wrap">
<div class="zdy_box">
@@ -129,8 +163,8 @@
<script>
import THeader from '@components/header3.vue'
import {sortProductionMonitor} from '@js/getData1.js'
// import {sortProductionMonitor} from '@js/mork2.js'
// import {sortProductionMonitor} from '@js/getData1.js'
import {sortProductionMonitor} from '@js/mork1.js'
export default {
name: 'SortWorkMonitor',
components: {
@@ -159,7 +193,7 @@ export default {
timer1: null,
timer2: null,
step: 0.4, // 数值越大速度滚动越快
limitMoveNum: 10, // 开始无缝滚动的数据量 this.dataList.length
limitMoveNum: 4, // 开始无缝滚动的数据量 this.dataList.length
hoverStop: true, // 是否开启鼠标悬停stop
direction: 1, // 0向下 1向上 2向左 3向右
openWatch: true, // 开启数据实时监控刷新dom
@@ -173,7 +207,7 @@ export default {
timer1: null,
timer2: null,
step: 0.4, // 数值越大速度滚动越快
limitMoveNum: 6, // 开始无缝滚动的数据量 this.dataList.length
limitMoveNum: 4, // 开始无缝滚动的数据量 this.dataList.length
hoverStop: true, // 是否开启鼠标悬停stop
direction: 1, // 0向下 1向上 2向左 3向右
openWatch: true, // 开启数据实时监控刷新dom
@@ -184,6 +218,9 @@ export default {
}
},
mounted () {
this.setEchart01()
this.setEchart02()
this.setEchart03()
this.refresh()
},
beforeDestroy () {
@@ -443,12 +480,9 @@ export default {
.zero-wrap
_wh(100%, 12%)
padding 0 0 15px 0
// background center center / 100% 100% url(../../images/screen1/sctj_top.png) no-repeat
// overflow hidden
display flex
.zero-title
width 33%
margin-right 1%
width 32%
height 32px
line-height 32px
font-family: "SourceHanSansCN";
@@ -456,12 +490,54 @@ export default {
font-size 18px
color #ffffff
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
overflow hidden
display flex
.e-box
width 33.3%
height 240px
// background #ff0
display flex
.a-box
width 40%
height 260px
// background #fcc
// .a-title
// font-family: "SourceHanSansCN";
// font-weight: bold;
// line-height 34px
// font-size 18px
// color #32c5ff
// background center center / 100% 100% url(../../images/screen1/bg_title_s.png) no-repeat
.pie_wraper_2
// position absolute
// top 17px
// left 0
width 222px
height 222px
// width 70%
// height 70%
background center / 100% auto url('../../images/pie-bg_2.png') no-repeat
.w_wraper
width 100%
height 100%
.b-box
width 60%
margin-top 10px
.b-item
color #ffffff
line-height 36px
margin-top 5px
margin-left 25px
span
&:nth-child(1)
color #2ef6ff
.zdy_box
_fj(flex-start, flex-start)
flex-wrap wrap
@@ -500,14 +576,17 @@ export default {
_wh(100%, 40%)
.three_w_item
_wh(calc(50% - 15px), 100%)
height 200px
padding 15px
padding-left 65px
background-image linear-gradient(to bottom, #040b1a, #050919)
overflow hidden
&:first-child
margin-right 30px
.four_wrap
_wh(100%, calc(39% - 20px))
margin-top 20px
width 100%
// _wh(100%, calc(39% - 20px))
margin-top 40px
// padding 10px 15px
// background-image linear-gradient(to bottom, #050c1b, #16243c)
// border 2px solid #16243c
@@ -557,7 +636,8 @@ export default {
box-sizing border-box
.scroll_container_2
width 100%
height calc(100% - 40px)
// height calc(100% - 40px)
height 230px
overflow hidden
.scroll-ul_2
li
@@ -570,7 +650,7 @@ export default {
float left
_wh(10%, 44px)
_fj(center)
_font(14px, 44px, #fff,,center)
_font(12px, 44px, #fff,,center)
word-wrap break-word
word-break break-all
white-space nowrap