This commit is contained in:
aaron 2025-05-19 10:03:38 +08:00
parent f1b8c0fa74
commit 7dd3e7523f
2 changed files with 26 additions and 147 deletions

View File

@ -5,7 +5,7 @@ services:
build:
context: .
dockerfile: Dockerfile
image: tradus-web:1.3.1
image: tradus-web:1.3.2
container_name: tradus-web
ports:
- '6000:80'

View File

@ -394,15 +394,7 @@ watch(
</div>
<div v-if="isAnalyzing" class="analysis-status">
<div class="ai-progress">
<div class="ai-brain">
<span class="pulse-ring"></span>
<span class="inner-circle"></span>
<span class="brain-wave left"></span>
<span class="brain-wave center"></span>
<span class="brain-wave right"></span>
</div>
</div>
<div class="simple-loader"></div>
<div class="status-text">
<div class="thought-text" v-if="currentThought">{{ currentThought }}</div>
</div>
@ -602,82 +594,28 @@ watch(
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 1.5rem;
text-align: center;
gap: 1.5rem;
justify-content: flex-start;
padding: 1rem;
text-align: left;
gap: 1rem;
margin-top: 1rem;
background: transparent;
border-radius: var(--border-radius);
}
.ai-progress {
position: relative;
display: flex;
align-items: center;
justify-content: center;
padding: 5px;
.simple-loader {
width: 16px;
height: 16px;
border: 2px solid var(--color-border);
border-top-color: var(--color-text-secondary);
border-radius: 50%;
background: transparent;
animation: spin 1s linear infinite;
}
.ai-brain {
position: relative;
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
transform: translateZ(0); /* 启用硬件加速 */
z-index: 1;
}
.pulse-ring {
position: absolute;
width: 100%;
height: 100%;
border-radius: 50%;
border: 1.5px solid rgba(51, 85, 255, 0.6);
opacity: 0;
animation: pulse-ring 2s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
z-index: 0;
}
.inner-circle {
position: absolute;
width: 60%;
height: 60%;
background-color: rgba(51, 85, 255, 0.7);
border-radius: 50%;
opacity: 0.7;
animation: pulse-core 1.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite alternate;
z-index: 2;
}
.brain-wave {
position: absolute;
width: 3px;
height: 8px;
background-color: rgba(51, 85, 255, 0.7);
border-radius: 1.5px;
animation: wave-animation 0.8s infinite ease-in-out;
z-index: 3;
}
.brain-wave.left {
animation-delay: 0;
left: -12px;
}
.brain-wave.center {
animation-delay: 0.2s;
left: 0px;
margin-left: -2px;
}
.brain-wave.right {
animation-delay: 0.4s;
left: 12px;
@keyframes spin {
to {
transform: rotate(360deg);
}
}
.status-text {
@ -692,23 +630,8 @@ watch(
font-weight: 400;
color: var(--color-text-secondary);
position: relative;
overflow: hidden;
padding-right: 0.5rem;
white-space: nowrap;
animation: thought-appear 0.4s ease forwards;
max-width: 100%;
transition: opacity 0.3s;
}
@keyframes thought-appear {
0% {
opacity: 0;
transform: translateY(3px);
}
100% {
opacity: 1;
transform: translateY(0);
}
animation: none;
}
.analysis-container {
@ -881,44 +804,6 @@ watch(
}
}
@keyframes pulse-ring {
0% {
transform: scale(0.9);
opacity: 0.3;
}
50% {
transform: scale(1.2);
opacity: 0.15;
}
100% {
transform: scale(0.9);
opacity: 0.3;
}
}
@keyframes pulse-core {
0% {
transform: scale(0.9);
opacity: 0.6;
}
100% {
transform: scale(1);
opacity: 0.8;
}
}
@keyframes wave-animation {
0%,
100% {
height: 4px;
opacity: 0.3;
}
50% {
height: 12px;
opacity: 0.7;
}
}
/* 响应式设计 */
@media (max-width: 768px) {
.universal-analysis-view {
@ -997,9 +882,10 @@ watch(
margin-top: 0.75rem;
}
.ai-progress {
transform: scale(0.9);
min-width: 32px;
.simple-loader {
width: 14px;
height: 14px;
border-width: 2px;
}
.thought-text {
@ -1094,26 +980,19 @@ watch(
padding: 0.75rem;
flex-direction: column;
gap: 0.75rem;
align-items: center;
}
.ai-brain {
width: 32px;
height: 32px;
.simple-loader {
width: 12px;
height: 12px;
border-width: 1.5px;
margin: 0 auto;
}
.brain-wave.left {
left: -8px;
}
.brain-wave.right {
left: 8px;
}
.thought-text {
font-size: 0.8rem;
text-align: center;
white-space: normal;
}
}
</style>