root/screen-lnsh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页

Browse Source
This commit is contained in:
caill
2023-06-12 14:43:01 +08:00
parent 959e21fc05
commit 519c66b0fe
4 changed files with 216 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
src/pages/modules/homepage/one.vue
View File

@@ -7,32 +7,6 @@
</div>
<div class="n_body_container">
<div class="n_body_container_wraper">
<div class="n_left_content">
<div class="item_wrap">
<div class="item_tip item_tip_bg_s">
<div class="item_tip_left">当日混料生产</div>
</div>
<div class="item_content">
<div id="home_echart_1" style="width: 100%; height: 100%;"></div>
</div>
</div>
<div class="item_wrap">
<div class="item_tip item_tip_bg_s">
<div class="item_tip_left">当日压制生产</div>
</div>
<div class="item_content">
<div id="home_echart_2" style="width: 100%; height: 100%;"></div>
</div>
</div>
<div class="item_wrap">
<div class="item_tip item_tip_bg_s">
<div class="item_tip_left">当日成品情况</div>
</div>
<div class="item_content">
<div id="home_echart_3" style="width: 100%; height: 100%;"></div>
</div>
</div>
</div>
<div class="n_right_content">
<div class="right_wrap">
<div v-if="MixMachineList.length > 0" class="machine_wrap hlj_s_wrap">
@@ -420,6 +394,38 @@
</div>
</div>
</div>
<div class="n_left_content">
<div class="item_wrap">
<div class="item_tip item_tip_bg_s">
<div class="item_tip_left">当日混料生产</div>
</div>
<div class="item_content">
<div id="home_echart_1" style="width: 100%; height: 100%;"></div>
</div>
</div>
<div class="item_wrap">
<div class="item_tip item_tip_bg_s">
<div class="item_tip_left">当日压制生产</div>
</div>
<div class="item_content">
<div id="home_echart_2" style="width: 100%; height: 100%;"></div>
</div>
</div>
<div class="item_wrap">
<div class="item_tip item_tip_bg_s">
<div class="item_tip_left">当日成品情况</div>
</div>
<div class="item_content">
<div id="home_echart_3" style="width: 100%; height: 100%;"></div>
</div>
</div>
</div>
<!-- <div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div> -->
</div>
</template>
@@ -907,6 +913,7 @@ export default {
<style lang="stylus" scoped>
@import '~@css/mixin'
.n_container
position relative
_wh(100%, 100%)
overflow hidden
.n_header
@@ -924,20 +931,22 @@ export default {
margin-right -3px
.n_body_container
_wh(100%, 92%)
padding 40px 0 20px 20px
padding 40px 0 20px 0
_bis('../../../images/bg_content_l.jpg')
.n_body_container_wraper
_wh(100%, 100%)
_fj(row)
.n_left_content
_wh(33%, 100%)
position absolute
left 0
top 0
_wh(calc(100% / 3), 100%)
background-color #070b1c
.n_right_content
_wh(calc(67% - 16px), 100%)
padding-left calc(100% / 3)
_wh(100%, 100%)
.item_wrap
_wh(100%, 33%)
+.item_wrap
margin-top .5%
_wh(100%, calc(100% / 3))
.item_tip
_wh(100%, 32px)
line-height 32px
@@ -979,8 +988,8 @@ export default {
.hlj_s_wrap
width 4%
height 85.5%
top 12%
left 11%
top 9%
left 15%
.hlj_s
height 7%
.yj_info_wrap
@@ -1008,7 +1017,7 @@ export default {
width 4%
height 66.5%
top 44%
left 14%
left 15%
.hlj
height 7%
.yj_info_wrap
@@ -1051,7 +1060,7 @@ export default {
.lz_wrap_1
width 2%
height 84.6%
top 13%
top 10%
left 24%
.lz
&:nth-child(2)
@@ -1064,7 +1073,7 @@ export default {
width 2%
height 66.3%
top 45%
left 19%
left 20%
.lz
&:nth-child(2)
top 6.5%
@@ -1091,8 +1100,8 @@ export default {
.yjlz_wrap_1
width 2%
height 16.442%
top 3%
left 41%
top 2%
left 42%
.lz_1
width 100%
img
@@ -1101,14 +1110,14 @@ export default {
top auto
bottom 0
.yjlz_wrap_2
top 22%
top 21%
.yjlz_wrap_3
top 41%
.lz_1
top 50%
transform translateY(-50%)
.yjlz_wrap_5
top 60%
top 62%
.lz_1
top 50%
transform translateY(-50%)
@@ -1125,8 +1134,8 @@ export default {
.yj_wrap_1
width 16%
height 16.442%
top 3%
left 44%
top 2%
left 44.7%
.yj_info_wrap
width 60%
top: 0
@@ -1186,12 +1195,13 @@ export default {
.block_2
left:86%
.yj_wrap_2
top 22%
top 21%
.robot
animation rotate_630_1 1.5s linear 1.5s infinite alternate-reverse
transform: rotate(-46deg)
animation rotate_2500_2 1.5s linear 1.5s infinite alternate-reverse
.kongtuopan_1
top 37%
left 70%
left 85%
transform rotate(90deg)
.kongtuopan_2
top 76%
@@ -1247,6 +1257,8 @@ export default {
.robot
left: 79%;
top: 49%;
transform: rotate(-4deg)
animation rotate_630_1 1.5s linear 1.5s infinite alternate-reverse
.kongtuopan_1
top: 21%
left: 64%;
@@ -1258,7 +1270,7 @@ export default {
top: 64%
left: 80%;
.yj_wrap_5
top 60%
top 61%
.kongtuopan_1
top: 14%;
left: 64%;
@@ -1299,7 +1311,7 @@ export default {
.yj_wrap_8
top 89%
.yj_wrap_17
left 60%
left 65%
.yyj
left auto
right 0
@@ -1311,7 +1323,7 @@ export default {
left auto
right 0
.yj_wrap_15
left 60%
left 65%
.cyj_1
left auto
right 0
@@ -1319,7 +1331,7 @@ export default {
left 0
right auto
.yj_wrap_13
left 60%
left 65%
.cyj_1
left auto
right 0
@@ -1327,7 +1339,7 @@ export default {
left 0
right auto
.yj_wrap_12
left 60%
left 65%
.cyj_1
left auto
right 0
@@ -1335,7 +1347,7 @@ export default {
left 0
right auto
.yj_wrap_10
left 60%
left 65%
.yj_info_wrap_1
left auto
right -81%
@@ -1388,13 +1400,13 @@ export default {
transform: rotateZ(-46deg)
}
90% {
transform: rotateZ(-120deg) rotateY(-30deg)
transform: rotateZ(-115deg) rotateY(-30deg)
}
100% {
transform: rotateZ(-120deg) rotateY(0deg)
transform: rotateZ(-115deg) rotateY(0deg)
}
}
@keyframes rotate_630_1 {
@keyframes rotate_2500_2 {
0% {
transform: rotateZ(-46deg)
}
@@ -1405,10 +1417,27 @@ export default {
transform: rotateZ(-46deg)
}
90% {
transform: rotateZ(-90deg)
transform: rotateZ(-120deg) rotateY(-30deg)
}
100% {
transform: rotateZ(-90deg)
transform: rotateZ(-120deg) rotateY(0deg)
}
}
@keyframes rotate_630_1 {
0% {
transform: rotateZ(-4deg)
}
10% {
transform: rotateZ(-4deg)
}
20% {
transform: rotateZ(-20deg)
}
90% {
transform: rotateZ(-115deg) rotateY(-30deg)
}
100% {
transform: rotateZ(-115deg) rotateY(0deg)
}
}
@keyframes rotate_630_2 {
@@ -1431,4 +1460,8 @@ export default {
transform: rotateZ(15deg)
}
}
.style_block
position absolute
_wh(calc(100% / 3), calc(100% / 3))
background red
</style>