首页图片

This commit is contained in:
2023-06-12 10:27:09 +08:00
parent 53ca0f3197
commit 959e21fc05
24 changed files with 772 additions and 2289 deletions

View File

@@ -74,18 +74,24 @@
</div>
</div>
<div class="yaji_wrap">
<div class="machine_wrap yyj_wrap_1">
<!-- <div class="sh_machine yj_gif">
<img src="../../../images/workshop/yj_2500.gif" alt="">
</div> -->
<div class="machine_wrap yj_wrap_1">
<div class="sh_machine yj_info_wrap">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine weilan">
<img src="../../../images/workshop/weilan_2.png" alt="">
</div>
<div class="sh_machine jzjcss">
<img src="../../../images/workshop/jzjcss_yellow.png" alt="">
</div>
<div class="sh_machine yyj">
<img src="../../../images/workshop/yj_2500_gray.png" alt="">
<div v-if="PressMachineList.length > 0" class="sh_machine yyj">
<img v-show="PressMachineList[0].device_status === 0" src="../../../images/workshop/yj_2500_gray.png" alt="">
<img v-show="PressMachineList[0].device_status === 1" src="../../../images/workshop/yj_2500_yellow.png" alt="">
<img v-show="PressMachineList[0].device_status === 2" src="../../../images/workshop/yj_2500_green.png" alt="">
<img v-show="PressMachineList[0].device_status === 3" src="../../../images/workshop/yj_2500_red.png" alt="">
</div>
<div class="sh_machine wzm"></div>
<div class="sh_machine kongtuopan_1">
@@ -95,22 +101,32 @@
<img src="../../../images/workshop/ktp.png" alt="">
</div>
<div class="sh_machine robot">
<img src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img src="../../../images/workshop/robot_2500_green.png" alt="">
</div>
<div class="sh_machine block_1">
</div>
<div class="sh_machine block_1 block_2">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 yyj_wrap_2">
<div class="machine_wrap yj_wrap_1 yj_wrap_2">
<div class="sh_machine yj_info_wrap">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine weilan">
<img src="../../../images/workshop/weilan_1.png" alt="">
</div>
<div class="sh_machine jzjcss">
<img src="../../../images/workshop/jzjcss_yellow.png" alt="">
</div>
<div class="sh_machine yyj">
<img src="../../../images/workshop/yj_2500_gray.png" alt="">
<div v-if="PressMachineList.length > 0" class="sh_machine yyj">
<img v-show="PressMachineList[1].device_status === 0" src="../../../images/workshop/yj_2500_gray.png" alt="">
<img v-show="PressMachineList[1].device_status === 1" src="../../../images/workshop/yj_2500_yellow.png" alt="">
<img v-show="PressMachineList[1].device_status === 2" src="../../../images/workshop/yj_2500_green.png" alt="">
<img v-show="PressMachineList[1].device_status === 3" src="../../../images/workshop/yj_2500_red.png" alt="">
</div>
<div class="sh_machine wzm"></div>
<div class="sh_machine kongtuopan_1">
@@ -120,15 +136,41 @@
<img src="../../../images/workshop/ktp.png" alt="">
</div>
<div class="sh_machine robot">
<img src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img src="../../../images/workshop/robot_2500_green.png" alt="">
</div>
<div class="sh_machine block_1 block_2">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="machine_wrap yj_wrap_1 yj_wrap_3">
<div class="sh_machine yj_info_wrap">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine cyj_1 cyj_2">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine blj_1">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div class="sh_machine blj_1 blj_2">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1">
<img v-show="PressMachineList[2].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[2].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[2].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[2].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
<img v-show="PressMachineList[3].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[3].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[3].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[3].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div class="sh_machine weilan">
<img src="../../../images/workshop/weilan_3.png" alt="">
@@ -155,15 +197,36 @@
<img src="../../../images/workshop/ktp.png" alt="">
</div>
<div class="sh_machine robot">
<img src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img src="../../../images/workshop/robot_2500_green.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_2">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5">
<div class="sh_machine yj_info_wrap">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine cyj_1 cyj_2">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine blj_1">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1">
<img v-show="PressMachineList[4].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[4].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[4].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[4].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
<img v-show="PressMachineList[5].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[5].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[5].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[5].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp.png" alt="">
@@ -178,9 +241,21 @@
<img src="../../../images/workshop/ktp.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_3">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7">
<div class="sh_machine yj_info_wrap">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine blj_1">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1">
<img v-show="PressMachineList[6].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[6].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[6].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[6].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div class="sh_machine weilan">
<img src="../../../images/workshop/weilan_6.png" alt="">
@@ -195,15 +270,36 @@
<img src="../../../images/workshop/jcpmj.png" alt="">
</div>
<div class="sh_machine robot">
<img src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img src="../../../images/workshop/robot_2500_green.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_2 cyj_wrap_4">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8">
<div class="sh_machine yj_info_wrap">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine cyj_1 cyj_2">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine blj_1 blj_2">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1">
<img v-show="PressMachineList[7].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[7].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[7].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[7].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
<img v-show="PressMachineList[8].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[8].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[8].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[8].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp.png" alt="">
@@ -218,13 +314,13 @@
<img src="../../../images/workshop/ktp.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 yyj_wrap_2 yyj_wrap_3">
<div class="machine_wrap yj_wrap_1 yj_wrap_2 yj_wrap_17">
<div class="sh_machine yyj">
<img src="../../../images/workshop/yj_2500_gray.png" alt="">
</div>
<div class="sh_machine wzm"></div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_5">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_15">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
@@ -232,7 +328,7 @@
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_2 cyj_wrap_6">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_13">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
@@ -240,17 +336,26 @@
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_3 cyj_wrap_7">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7 yj_wrap_12">
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
<div class="machine_wrap yyj_wrap_1 cyj_wrap_1 cyj_wrap_2 cyj_wrap_4 cyj_wrap_8">
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8 yj_wrap_10">
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
<p>2023-6-10</p>
<p>成品1</p>
<p>367</p>
<div class="bg_line"></div>
</div>
<div class="sh_machine cyj_1">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
<div class="sh_machine cyj_1 cyj_2">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
<img v-show="PressMachineList[9].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="PressMachineList[9].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="PressMachineList[9].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="PressMachineList[9].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
<div class="sh_machine kongtuopan_1 kongtuopan_3">
<img src="../../../images/workshop/ktp.png" alt="">
@@ -296,6 +401,48 @@
</div>
</template>
<script>
import { workshopCondition } from '@js/getData2'
export default {
data () {
return {
interTime: this.$store.getters.setTime,
timer: null,
myCharts1: '',
myCharts2: '',
myCharts3: '',
PressMachineList: [], // 压机数据
MixMachineList: [], // 混料机数据
MixBlankingList: [], // 混料机下料位
TrappedShelfList: [] // 困料位料盅
}
},
mounted () {
this._workshopCondition()
// this.refresh()
},
beforeDestroy () {
clearInterval(this.timer)
},
methods: {
refresh () {
this.timer = setInterval(() => {
this._workshopCondition()
}, this.interTime)
},
async _workshopCondition () {
let res = await workshopCondition()
if (res.code === 200) {
this.PressMachineList = [...res.result.PressMachineList]
this.MixMachineList = [...res.result.MixMachineList]
this.MixBlankingList = [...res.result.MixBlankingList]
this.TrappedShelfList = [...res.result.TrappedShelfList]
}
}
}
}
</script>
<style lang="stylus" scoped>
@import '~@css/mixin'
.n_container
@@ -439,6 +586,39 @@
transform rotate(90deg)
top: 4.4%;
left: 90.5%;
.yyj_wrap_2
left: 80%;
.cyj_wrap_1
left 70%
.cyj_wrap_2
left 60%
.cyj_wrap_3
left 50%
.yj_wrap_1
// width 10.801%
// height 29.895%
width: 15%;
height: 41.5%;
transform rotate(90deg)
top: 4.4%;
// left: 90.5%;
left 87%
.yj_info_wrap
display none
width 60%
top: 0
left: -77%
padding: 5px
_bis('../../../images/workshop/txtbg.png')
p
_font(14px, 16px, #fff,,right)
.bg_line
position absolute
_wh(67%, 2px)
background-color #03fcfd
right -100%
top 50%
transform translate(-50%)
.yyj
width 50%
img
@@ -482,8 +662,8 @@
background-color #fff
.block_2
left:86%
.yyj_wrap_2
left: 80%;
.yj_wrap_2
left: 71%
.robot
animation rotate_630_1 1.5s linear 1.5s infinite alternate-reverse
.kongtuopan_1
@@ -494,8 +674,24 @@
top 76%
.weilan
top 16%
.cyj_wrap_1
left 70%
.block_2
top 9%
left: 89%;
.yj_wrap_3
left: 54%
.yj_info_wrap
top -10%
.bg_line
width: 100%;
right: -150%;
.yj_info_wrap_1
top 46%
.blj_1
width: 18%;
top: 14%;
left: 16%;
.blj_2
top 70%
.cyj_1
width 50%
height 50%
@@ -538,8 +734,8 @@
.kongtuopan_4
top: 64%
left: 80%;
.cyj_wrap_2
left 60%
.yj_wrap_5
left: 37%
.kongtuopan_1
top: 14%;
left: 64%;
@@ -550,8 +746,12 @@
top 70%
.kongtuopan_4
top 86%
.cyj_wrap_3
left 50%
.yj_wrap_7
left 22%
.yj_info_wrap
top 19%
.blj_1
top 42%
.cyj_1
top 25%
img
@@ -562,7 +762,7 @@
.robot
left: 75%
transform: rotate(15deg);
animation rotate_630_2 3s linear 1.5s infinite reverse
animation rotate_630_2 3s linear 1.5s infinite alternate-reverse
.kongtuopan_1
top 43%
left 90%
@@ -573,83 +773,79 @@
width: 18%;
top: 12%;
left: 57%;
.cyj_wrap_4
top 89%
.yyj_wrap_3
left auto
right 13%
.yj_wrap_8
left 8%
.yj_wrap_17
top 70%
.yyj
img
left -23%
left auto
right 37%
transform rotate(180deg)
.cyj_wrap_5
left auto
right 17%
.cyj_wrap_6
left auto
right 17%
.cyj_wrap_7
left auto
right 17%
.cyj_wrap_8
left auto
right 17%
.kongtuopan_3
left 18%
.kongtuopan_4
left 18%
.yj_wrap_15
top 70%
.cyj_1
img
left 0
right auto
.yj_wrap_13
top 70%
.yj_wrap_12
top 70%
.yj_wrap_10
top 70%
@keyframes rotate_2500_1 {
0% {
transform: rotate(-46deg)
transform: rotateZ(-46deg)
}
10% {
transform: rotate(-46deg)
transform: rotateZ(-46deg)
}
20% {
transform: rotate(-46deg)
transform: rotateZ(-46deg)
}
90% {
transform: rotate(-120deg)
transform: rotateZ(-120deg) rotateY(-30deg)
}
100% {
transform: rotate(-120deg)
transform: rotateZ(-120deg) rotateY(0deg)
}
}
@keyframes rotate_630_1 {
0% {
transform: rotate(-46deg)
transform: rotateZ(-46deg)
}
10% {
transform: rotate(-46deg)
transform: rotateZ(-46deg)
}
20% {
transform: rotate(-46deg)
transform: rotateZ(-46deg)
}
90% {
transform: rotate(-90deg)
transform: rotateZ(-90deg)
}
100% {
transform: rotate(-90deg)
transform: rotateZ(-90deg)
}
}
@keyframes rotate_630_2 {
0% {
transform: rotate(150deg)
transform: rotateZ(150deg) rotateY(-30deg)
}
10% {
transform: rotate(150deg)
transform: rotateZ(150deg) rotateY(0deg)
}
50% {
transform: rotate(70deg)
transform: rotateZ(70deg) rotateY(-30deg)
}
60% {
transform: rotate(70deg)
transform: rotateZ(70deg) rotateY(0deg)
}
90% {
transform: rotate(15deg)
transform: rotateZ(15deg)
}
100% {
transform: rotate(15deg)
transform: rotateZ(15deg)
}
}
</style>