feat: 完善后台管理+搜索功能+分销系统
主要更新: - 后台菜单精简(9项→6项) - 新增搜索功能(敏感信息过滤) - 分销绑定和提现系统完善 - 数据库初始化API(自动修复表结构) - 用户管理:显示绑定关系详情 - 小程序:上下章导航优化、匹配页面重构 - 修复hydration和数据类型问题
This commit is contained in:
@@ -983,3 +983,195 @@
|
||||
.bottom-space {
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
/* ===== 新版匹配动画 V2 ===== */
|
||||
.matching-animation-v2 {
|
||||
position: relative;
|
||||
width: 440rpx;
|
||||
height: 440rpx;
|
||||
margin: 0 auto 48rpx;
|
||||
}
|
||||
|
||||
/* 外层旋转光环 */
|
||||
.matching-outer-ring {
|
||||
position: absolute;
|
||||
inset: -20rpx;
|
||||
border-radius: 50%;
|
||||
background: conic-gradient(
|
||||
from 0deg,
|
||||
transparent 0deg,
|
||||
#00CED1 60deg,
|
||||
#7B61FF 120deg,
|
||||
#E91E63 180deg,
|
||||
#FFD700 240deg,
|
||||
#00CED1 300deg,
|
||||
transparent 360deg
|
||||
);
|
||||
animation: rotateRingV2 2s linear infinite;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.matching-outer-ring::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 8rpx;
|
||||
border-radius: 50%;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
@keyframes rotateRingV2 {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* 中层脉冲环 */
|
||||
.matching-pulse-ring {
|
||||
position: absolute;
|
||||
inset: 20rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(0, 206, 209, 0.5);
|
||||
animation: pulseRingV2 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes pulseRingV2 {
|
||||
0%, 100% { transform: scale(1); opacity: 0.5; }
|
||||
50% { transform: scale(1.1); opacity: 1; }
|
||||
}
|
||||
|
||||
/* 内层核心球体 */
|
||||
.matching-core {
|
||||
position: absolute;
|
||||
inset: 60rpx;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(135deg, #1a2a4a 0%, #0a1628 50%, #16213e 100%);
|
||||
box-shadow:
|
||||
0 0 60rpx rgba(0, 206, 209, 0.4),
|
||||
0 0 120rpx rgba(123, 97, 255, 0.2),
|
||||
inset 0 0 80rpx rgba(0, 206, 209, 0.1);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
animation: floatCoreV2 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.matching-core-inner {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle, rgba(0, 206, 209, 0.3) 0%, transparent 70%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
@keyframes floatCoreV2 {
|
||||
0%, 100% { transform: translateY(0) scale(1); }
|
||||
50% { transform: translateY(-10rpx) scale(1.02); }
|
||||
}
|
||||
|
||||
.matching-icon-v2 {
|
||||
font-size: 80rpx;
|
||||
animation: searchIconV2 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes searchIconV2 {
|
||||
0%, 100% { transform: rotate(-15deg); }
|
||||
50% { transform: rotate(15deg); }
|
||||
}
|
||||
|
||||
/* 粒子效果 */
|
||||
.particle {
|
||||
position: absolute;
|
||||
font-size: 32rpx;
|
||||
animation: floatParticle 3s ease-in-out infinite;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.particle-1 { top: 10%; left: 15%; animation-delay: 0s; }
|
||||
.particle-2 { top: 20%; right: 10%; animation-delay: 0.5s; }
|
||||
.particle-3 { bottom: 20%; left: 10%; animation-delay: 1s; }
|
||||
.particle-4 { bottom: 15%; right: 15%; animation-delay: 1.5s; }
|
||||
|
||||
@keyframes floatParticle {
|
||||
0%, 100% { transform: translateY(0) rotate(0deg); opacity: 0.4; }
|
||||
50% { transform: translateY(-20rpx) rotate(180deg); opacity: 1; }
|
||||
}
|
||||
|
||||
/* 扩散波纹 V2 */
|
||||
.ripple-v2 {
|
||||
position: absolute;
|
||||
inset: 40rpx;
|
||||
border-radius: 50%;
|
||||
border: 3rpx solid;
|
||||
border-color: rgba(0, 206, 209, 0.6);
|
||||
animation: rippleExpandV2 2.5s ease-out infinite;
|
||||
}
|
||||
|
||||
.ripple-v2-1 { animation-delay: 0s; }
|
||||
.ripple-v2-2 { animation-delay: 0.8s; }
|
||||
.ripple-v2-3 { animation-delay: 1.6s; }
|
||||
|
||||
@keyframes rippleExpandV2 {
|
||||
0% { transform: scale(1); opacity: 0.8; }
|
||||
100% { transform: scale(1.8); opacity: 0; }
|
||||
}
|
||||
|
||||
/* 新版匹配文字 */
|
||||
.matching-title-v2 {
|
||||
display: block;
|
||||
font-size: 38rpx;
|
||||
font-weight: 700;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
margin-bottom: 12rpx;
|
||||
background: linear-gradient(90deg, #00CED1, #7B61FF, #00CED1);
|
||||
background-size: 200% auto;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
animation: shineText 2s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes shineText {
|
||||
to { background-position: 200% center; }
|
||||
}
|
||||
|
||||
.matching-subtitle-v2 {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.matching-tips {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.tip-item {
|
||||
font-size: 26rpx;
|
||||
color: #00CED1;
|
||||
animation: fadeInUp 0.5s ease-out forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.tip-item:nth-child(1) { animation-delay: 0.5s; }
|
||||
.tip-item:nth-child(2) { animation-delay: 1.5s; }
|
||||
.tip-item:nth-child(3) { animation-delay: 2.5s; }
|
||||
|
||||
@keyframes fadeInUp {
|
||||
from { opacity: 0; transform: translateY(20rpx); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
.cancel-btn-v2 {
|
||||
display: inline-block;
|
||||
padding: 20rpx 60rpx;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 28rpx;
|
||||
border-radius: 40rpx;
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user