diff --git a/src/assets/css/reset.css b/src/assets/css/reset.css index 5e8eb07..a2975fa 100644 --- a/src/assets/css/reset.css +++ b/src/assets/css/reset.css @@ -79,7 +79,7 @@ li { -webkit-border-radius: 6px; } -/* 顺和大屏尺寸1920*1200 */ +/* 顺安大屏尺寸1920*1200 */ html, body { /* width: 100%; height: 100%; diff --git a/src/assets/images/device/robot_2500_gray.png b/src/assets/images/device/robot_2500_gray.png index 53bf98f..67dd58a 100644 Binary files a/src/assets/images/device/robot_2500_gray.png and b/src/assets/images/device/robot_2500_gray.png differ diff --git a/src/assets/images/device/robot_2500_green.png b/src/assets/images/device/robot_2500_green.png index 6cf15b3..c61726b 100644 Binary files a/src/assets/images/device/robot_2500_green.png and b/src/assets/images/device/robot_2500_green.png differ diff --git a/src/assets/images/device/robot_2500_red.png b/src/assets/images/device/robot_2500_red.png index 2c1050b..313979e 100644 Binary files a/src/assets/images/device/robot_2500_red.png and b/src/assets/images/device/robot_2500_red.png differ diff --git a/src/assets/images/device/robot_2500_yellow.png b/src/assets/images/device/robot_2500_yellow.png index 094ab11..72dbcef 100644 Binary files a/src/assets/images/device/robot_2500_yellow.png and b/src/assets/images/device/robot_2500_yellow.png differ diff --git a/src/assets/images/device/robot_630_gray.png b/src/assets/images/device/robot_630_gray.png new file mode 100644 index 0000000..1254b17 Binary files /dev/null and b/src/assets/images/device/robot_630_gray.png differ diff --git a/src/assets/images/device/robot_630_green.png b/src/assets/images/device/robot_630_green.png new file mode 100644 index 0000000..91222d9 Binary files /dev/null and b/src/assets/images/device/robot_630_green.png differ diff --git a/src/assets/images/device/robot_630_red.png b/src/assets/images/device/robot_630_red.png new file mode 100644 index 0000000..aa571df Binary files /dev/null and b/src/assets/images/device/robot_630_red.png differ diff --git a/src/assets/images/device/robot_630_yellow.png b/src/assets/images/device/robot_630_yellow.png new file mode 100644 index 0000000..5025258 Binary files /dev/null and b/src/assets/images/device/robot_630_yellow.png differ diff --git a/src/assets/images/device/robot_cmd_gray.png b/src/assets/images/device/robot_cmd_gray.png index 164d6aa..55f4d5c 100644 Binary files a/src/assets/images/device/robot_cmd_gray.png and b/src/assets/images/device/robot_cmd_gray.png differ diff --git a/src/assets/images/device/robot_cmd_green.png b/src/assets/images/device/robot_cmd_green.png index 0330523..866d3b6 100644 Binary files a/src/assets/images/device/robot_cmd_green.png and b/src/assets/images/device/robot_cmd_green.png differ diff --git a/src/assets/images/device/robot_cmd_red.png b/src/assets/images/device/robot_cmd_red.png index df72f5e..282287c 100644 Binary files a/src/assets/images/device/robot_cmd_red.png and b/src/assets/images/device/robot_cmd_red.png differ diff --git a/src/assets/images/device/robot_cmd_yellow.png b/src/assets/images/device/robot_cmd_yellow.png index 37265bb..4fa9684 100644 Binary files a/src/assets/images/device/robot_cmd_yellow.png and b/src/assets/images/device/robot_cmd_yellow.png differ diff --git a/src/components/workshop.vue b/src/components/workshop.vue index c4988bd..091a87a 100644 --- a/src/components/workshop.vue +++ b/src/components/workshop.vue @@ -122,13 +122,13 @@ -
+
-
+
@@ -161,6 +161,9 @@
+
+ +
@@ -173,12 +176,12 @@
-
- -
+
+ +
@@ -199,6 +202,12 @@
+
+ + + + +
@@ -227,10 +236,10 @@
- - - - + + + +
@@ -279,11 +288,11 @@
-
- - - - +
+ + + +
@@ -314,11 +323,11 @@
-
- - - - +
+ + + +
@@ -378,7 +387,7 @@
-
+
@@ -726,11 +735,11 @@ export default { left: 9%; top: 50%; img - position absolute - width: 900%; - height: auto; - top: -2000%; - left: -400%; + position absolute + width: 1500%; + height: auto; + top: -700%; + left: -300%; .robot_cmd_wrap_2 left 79% .fmjxt_wrap @@ -762,8 +771,7 @@ export default { left -24% top 5% .slw_630_wrap_2 - left auto - right -22% + top 21% .mdssj_630_wrap_1 _wh(38%, auto) left 10% @@ -785,10 +793,10 @@ export default { top: 73%; img position absolute - width: 5000%; - height auto - top: -1200%; - left: -4000%; + width: 2000%; + height: auto; + top: -3500%; + left: -900%; .ktp_630_wrap _wh(15%, auto) .ktp_630_wrap_1 @@ -850,10 +858,10 @@ export default { top: 73%; img position: absolute; - width: 5000%; + width: 2000%; height: auto; - top: -1200%; - left: -4000%; + top: -3600%; + left: -800%; .ktp_1600_wrap _wh(17%, auto) .ktp_1600_wrap_1 @@ -918,13 +926,12 @@ export default { _wh(1%, 1%) left: 60%; top: 13%; - transform: rotate(227deg) img position: absolute; - width: 4000%; + width: 1600%; height: auto; - top: -600%; - left: -3200%; + top: -400%; + left: -900%; .ktp_2500_wrap _wh(14%,auto) .ktp_2500_wrap_1 @@ -1034,31 +1041,91 @@ export default { _wh(20.5%, 19%) border-top-left-radius 0 .rotate_1 - animation rotate_1 1.5s linear 1.5s infinite alternate-reverse + animation rotate_1 9s linear 1s infinite @keyframes rotate_1 { 0% { - transform: rotateZ(0deg) + transform: rotateZ(-20deg) + } + 2% { + transform: rotateZ(-20deg) + } + 8% { + transform: rotateZ(-60deg) } 10% { - transform: rotateZ(0deg) + transform: rotateZ(-60deg) } - 90% { - transform: rotateZ(45deg) + 18% { + transform: rotateZ(-20deg) + } + 20% { + transform: rotateZ(-20deg) + } + 28% { + transform: rotateZ(-120deg) + } + 30% { + transform: rotateZ(-120deg) + } + 43% { + transform: rotateZ(20deg) + } + 50% { + transform: rotateZ(20deg) + } + 58% { + transform: rotateZ(60deg) + } + 60% { + transform: rotateZ(60deg) + } + 68% { + transform: rotateZ(20deg) + } + 70% { + transform: rotateZ(20deg) + } + 78% { + transform: rotateZ(100deg) + } + 80% { + transform: rotateZ(100deg) + } + 93% { + transform: rotateZ(-20deg) } 100% { - transform: rotateZ(45deg) + transform: rotateZ(-20deg) } } .rotate_2 - animation rotate_2 1.5s linear 1.5s infinite alternate-reverse + animation rotate_2 4s linear 1s infinite @keyframes rotate_2 { 0% { - transform: rotateZ(0deg) + transform: rotateZ(-45deg) } - 10% { - transform: rotateZ(0deg) + 3% { + transform: rotateZ(-45deg) } - 90% { + 17% { + transform: rotateZ(-90deg) + } + 20% { + transform: rotateZ(-90deg) + } + 43% { + transform: rotateZ(45deg) + } + 50% { + transform: rotateZ(45deg) + } + 72% { + transform: rotateZ(90deg) + } + 75% { + transform: rotateZ(90deg) + } + 93% { transform: rotateZ(-45deg) } 100% { @@ -1066,35 +1133,105 @@ export default { } } .rotate_3 - animation rotate_3 1.5s linear 1.5s infinite alternate-reverse + animation rotate_3 4s linear 1s infinite @keyframes rotate_3 { - 0% { - transform: rotateZ(145deg) + 0%{ + transform: rotateZ(-120deg) } - 10% { - transform: rotateZ(145deg) + 3% { + transform: rotateZ(-120deg) } - 90% { - transform: rotateZ(110deg) + 20% { + transform: rotateZ(0deg) + } + 25% { + transform: rotateZ(0deg) + } + 47% { + transform: rotateZ(120deg) + } + 50% { + transform: rotateZ(120deg) + } + 70% { + transform: rotateZ(0deg) + } + 75% { + transform: rotateZ(0deg) + } + 97%{ + transform: rotateZ(-120deg) } 100% { - transform: rotateZ(110deg) + transform: rotateZ(-120deg) } } .rotate_4 - animation rotate_4 1.5s linear 1.5s infinite alternate-reverse + animation rotate_4 4s linear 1s infinite @keyframes rotate_4 { 0% { - transform: rotateZ(227deg) + transform: rotateZ(0deg) } - 10% { - transform: rotateZ(227deg) + 3% { + transform: rotateZ(0deg) } - 90% { - transform: rotateZ(190deg) + 22% { + transform: rotateZ(-90deg) + } + 25% { + transform: rotateZ(-90deg) + } + 43% { + transform: rotateZ(0deg) + } + 50% { + transform: rotateZ(0deg) + } + 72% { + transform: rotateZ(90deg) + } + 75% { + transform: rotateZ(90deg) + } + 93% { + transform: rotateZ(0deg) } 100% { - transform: rotateZ(190deg) + transform: rotateZ(0deg) + } +} +.rotate_5 + animation rotate_5 4s linear 1s infinite +@keyframes rotate_5 { + 0% { + transform: rotateZ(-20deg) + } + 3% { + transform: rotateZ(-20deg) + } + 22% { + transform: rotateZ(90deg) + } + 25% { + transform: rotateZ(90deg) + } + 43% { + transform: rotateZ(-20deg) + } + 50% { + transform: rotateZ(-20deg) + } + 72% { + transform: rotateZ(-90deg) + } + 75% { + transform: rotateZ(-90deg) + } + 93% { + transform: rotateZ(-20deg) + } + 100% { + transform: rotateZ(-20deg) } } diff --git a/src/pages/shunhe/LogisticsProcess.vue b/src/pages/shunhe/LogisticsProcess.vue index 22170f3..b521d2c 100644 --- a/src/pages/shunhe/LogisticsProcess.vue +++ b/src/pages/shunhe/LogisticsProcess.vue @@ -1,6 +1,6 @@