From 56c49234bd2a4583f7b693bee57f4caf685526aa Mon Sep 17 00:00:00 2001
From: zhonghua <zhonghua>
Date: Fri, 10 Apr 2026 17:12:12 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E4=BF=9D=E5=AD=98=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../public/create/views/SaveSuccessView.vue   | 146 ++++++++++++++----
 1 file changed, 117 insertions(+), 29 deletions(-)

diff --git a/frontend/src/views/public/create/views/SaveSuccessView.vue b/frontend/src/views/public/create/views/SaveSuccessView.vue
index 548d01a..277a8b5 100644
--- a/frontend/src/views/public/create/views/SaveSuccessView.vue
+++ b/frontend/src/views/public/create/views/SaveSuccessView.vue
@@ -26,7 +26,7 @@ export default { name: 'SaveSuccessView' }
       </div>
 
       <div class="action-group">
-        <button
+        <!-- <button
           v-if="showDubbingCta"
           class="btn-primary action-btn"
           @click="goDubbing"
@@ -36,13 +36,9 @@ export default { name: 'SaveSuccessView' }
             <div class="action-main">给绘本配音</div>
             <div class="action-desc">为每一页添加AI语音</div>
           </div>
-        </button>
+        </button> -->
 
-        <button
-          v-if="showWorksCta"
-          class="btn-outline action-btn"
-          @click="goWorks"
-        >
+        <button v-if="showWorksCta" class="btn-outline action-btn" @click="goWorks">
           <span class="action-icon">📚</span>
           <div class="action-text">
             <div class="action-main">{{ worksCtaMain }}</div>
@@ -78,7 +74,7 @@ const subline = computed(() => {
 })
 
 /** 提交审核成功后不展示「去配音」 */
-const showDubbingCta = computed(() => !afterPublish.value)
+// const showDubbingCta = computed(() => !afterPublish.value)
 
 const showWorksCta = computed(() => true)
 
@@ -143,17 +139,67 @@ onMounted(loadWork)
   pointer-events: none;
   animation: confettiFall 3s ease-in-out infinite;
 }
-.c1 { left: 10%; top: -5%; animation-delay: 0s; font-size: 28px; }
-.c2 { left: 30%; top: -8%; animation-delay: 0.5s; font-size: 20px; }
-.c3 { left: 55%; top: -3%; animation-delay: 1s; font-size: 22px; }
-.c4 { left: 75%; top: -6%; animation-delay: 1.5s; font-size: 26px; }
-.c5 { left: 90%; top: -4%; animation-delay: 0.8s; font-size: 18px; }
-.c6 { left: 45%; top: -7%; animation-delay: 2s; font-size: 24px; }
+
+.c1 {
+  left: 10%;
+  top: -5%;
+  animation-delay: 0s;
+  font-size: 28px;
+}
+
+.c2 {
+  left: 30%;
+  top: -8%;
+  animation-delay: 0.5s;
+  font-size: 20px;
+}
+
+.c3 {
+  left: 55%;
+  top: -3%;
+  animation-delay: 1s;
+  font-size: 22px;
+}
+
+.c4 {
+  left: 75%;
+  top: -6%;
+  animation-delay: 1.5s;
+  font-size: 26px;
+}
+
+.c5 {
+  left: 90%;
+  top: -4%;
+  animation-delay: 0.8s;
+  font-size: 18px;
+}
+
+.c6 {
+  left: 45%;
+  top: -7%;
+  animation-delay: 2s;
+  font-size: 24px;
+}
+
 @keyframes confettiFall {
-  0% { transform: translateY(0) rotate(0deg); opacity: 0; }
-  10% { opacity: 0.8; }
-  80% { opacity: 0.6; }
-  100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
+  0% {
+    transform: translateY(0) rotate(0deg);
+    opacity: 0;
+  }
+
+  10% {
+    opacity: 0.8;
+  }
+
+  80% {
+    opacity: 0.6;
+  }
+
+  100% {
+    transform: translateY(100vh) rotate(720deg);
+    opacity: 0;
+  }
 }
 
 .success-content {
@@ -172,11 +218,25 @@ onMounted(loadWork)
   animation: celebrationBounce 0.8s ease;
   margin-bottom: 12px;
 }
+
 @keyframes celebrationBounce {
-  0% { transform: scale(0) rotate(-20deg); opacity: 0; }
-  50% { transform: scale(1.3) rotate(10deg); }
-  70% { transform: scale(0.9) rotate(-5deg); }
-  100% { transform: scale(1) rotate(0deg); opacity: 1; }
+  0% {
+    transform: scale(0) rotate(-20deg);
+    opacity: 0;
+  }
+
+  50% {
+    transform: scale(1.3) rotate(10deg);
+  }
+
+  70% {
+    transform: scale(0.9) rotate(-5deg);
+  }
+
+  100% {
+    transform: scale(1) rotate(0deg);
+    opacity: 1;
+  }
 }
 
 .success-title {
@@ -185,6 +245,7 @@ onMounted(loadWork)
   color: #4A3728;
   letter-spacing: 1px;
 }
+
 .success-sub {
   font-size: 15px;
   color: #8D6E63;
@@ -196,29 +257,34 @@ onMounted(loadWork)
   perspective: 600px;
   margin-bottom: 32px;
 }
+
 .cover-card {
   width: 260px;
   border-radius: 18px;
   overflow: hidden;
   background: #fff;
-  box-shadow: 0 8px 32px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
   transform: rotateY(-3deg) rotateX(2deg);
   transition: transform 0.4s ease;
 }
+
 .cover-img {
   width: 100%;
   aspect-ratio: 4/3;
   object-fit: cover;
   display: block;
 }
+
 .cover-info {
   padding: 14px 16px;
 }
+
 .cover-name {
   font-size: 16px;
   font-weight: 700;
   color: #4A3728;
 }
+
 .cover-author {
   font-size: 12px;
   color: #8D6E63;
@@ -231,6 +297,7 @@ onMounted(loadWork)
   flex-direction: column;
   gap: 12px;
 }
+
 .action-btn {
   display: flex;
   align-items: center;
@@ -243,19 +310,40 @@ onMounted(loadWork)
   cursor: pointer;
   font-family: inherit;
 }
+
 .btn-primary {
   background: var(--ai-gradient, linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%));
   color: #fff;
 }
+
 .btn-outline {
   background: #fff;
   color: #4A3728;
   border: 1px solid rgba(99, 102, 241, 0.35);
-  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+}
+
+.action-icon {
+  font-size: 24px;
+  flex-shrink: 0;
+}
+
+.action-text {
+  flex: 1;
+}
+
+.action-main {
+  font-size: 15px;
+  font-weight: 700;
+}
+
+.action-desc {
+  font-size: 12px;
+  opacity: 0.7;
+  margin-top: 2px;
+}
+
+.btn-outline .action-desc {
+  opacity: 0.8;
 }
-.action-icon { font-size: 24px; flex-shrink: 0; }
-.action-text { flex: 1; }
-.action-main { font-size: 15px; font-weight: 700; }
-.action-desc { font-size: 12px; opacity: 0.7; margin-top: 2px; }
-.btn-outline .action-desc { opacity: 0.8; }
 </style>