From fec68fa56336928a140ce34856d72d2e216d587b Mon Sep 17 00:00:00 2001
From: jiangx <jiangx@1000mu.com>
Date: Mon, 22 Sep 2025 09:25:04 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=9A=80=20=E4=BA=8C=E7=BB=B4?=
 =?UTF-8?q?=E7=A0=81=E6=B7=BB=E5=8A=A0=E9=9A=8F=E6=9C=BA=E8=BF=90=E5=8A=A8?=
 =?UTF-8?q?=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/List/List.vue | 41 +++++++++++++++++++-----------------
 1 file changed, 22 insertions(+), 19 deletions(-)

diff --git a/src/components/List/List.vue b/src/components/List/List.vue
index c78ba28..20fa64e 100644
--- a/src/components/List/List.vue
+++ b/src/components/List/List.vue
@@ -22,14 +22,14 @@
           <ListItem :customer="item" />
         </SwiperSlide>
       </Swiper>
-      <div
-        class="absolute bottom-3 right-3 z-10 flex h-[252px] w-[184px] flex-col items-center justify-start gap-4 rounded-xl border border-solid border-black/5 bg-white bg-gradient-to-b from-[#ededed] to-[#fcfcfc] px-3 pt-3 shadow-[0_4px_10px_0_rgba(0,0,0,0.06)]"
-      >
-        <img :src="qr" class="size-40" alt="" />
-        <div class="text-center text-18 leading-relaxed text-[#333]">欢迎微信扫码留言<br />期待您的宝贵意见</div>
-      </div>
     </div>
   </div>
+  <div
+    class="random leftt-0 fixed top-0 z-200 flex h-[252px] w-[184px] flex-col items-center justify-start gap-4 rounded-xl border border-solid border-black/5 bg-white bg-gradient-to-b from-[#ededed] to-[#fcfcfc] px-3 pt-3 shadow-[0_4px_10px_0_rgba(0,0,0,0.06)]"
+  >
+    <img :src="qr" class="size-40" alt="" />
+    <div class="text-center text-18 leading-relaxed text-[#333]">欢迎微信扫码留言<br />期待您的宝贵意见</div>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -85,23 +85,26 @@ defineExpose({
 </script>
 
 <style>
-.tb {
-  writing-mode: tb;
-}
-/* stylelint-disable-next-line selector-class-pattern */
-.fadeInRight {
-  animation: fade-in-right 1s infinite;
+.random {
+  animation: random 60s linear infinite alternate;
 }
 
-@keyframes fade-in-right {
-  from {
-    opacity: 0;
-    transform: translate3d(100%, 0, 0);
+@keyframes random {
+  0% {
+    transform: translate(0, 0);
   }
 
-  to {
-    opacity: 1;
-    transform: translate3d(0, 0, 0);
+  25% {
+    transform: translate(70vw, 10vh);
+  }
+  50% {
+    transform: translate(40vw, 70vh);
+  }
+  75% {
+    transform: translate(10vw, 40vh);
+  }
+  100% {
+    transform: translate(0, 0);
   }
 }
 </style>