diff --git a/pwuniapp/pages/user/withdraw.vue b/pwuniapp/pages/user/withdraw.vue
index 00cfca2..dab6e68 100644
--- a/pwuniapp/pages/user/withdraw.vue
+++ b/pwuniapp/pages/user/withdraw.vue
@@ -92,10 +92,8 @@
最低满 ¥{{ minWithdrawAmount }} 起提
-
-
- ¥
-
+
+ ¥
-
+
+ 全部提现
+
- 输入金额已超出当前可提现佣金余额 (¥{{ userCommission }})
+ !
+ 输入金额已超出当前可提现佣金余额 (¥{{ userCommission }})
- 提现金额须满 ¥{{ minWithdrawAmount }} 元起提
+ !
+ 提现金额须满 ¥{{ minWithdrawAmount }} 元起提
- 可提余额 ¥{{ userCommission }} · 单笔最高 ¥20,000 · 免收手续费
+ 可提余额
+ ¥{{ userCommission }}
+ ·
+ 单笔最高 ¥20,000
+ ·
+ 免收手续费
@@ -187,6 +196,7 @@ const navInfo = ref(getNavBarInfo());
const userCommission = ref('0.00');
const currentChannel = ref('WECHAT');
const withdrawAmount = ref('');
+const isInputFocused = ref(false);
const isSubmitting = ref(false);
const showRecordsDrawer = ref(false);
const withdrawalsList = ref([]);
@@ -748,6 +758,181 @@ onShow(() => {
}
}
+/* 提现金额卡片专属样式 */
+.amount-card {
+ .card-section-head {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 24rpx;
+
+ .section-title {
+ font-size: 30rpx;
+ font-weight: 700;
+ color: #F8FAFC;
+ }
+
+ .section-rule-hint {
+ font-size: 22rpx;
+ color: #F59E0B;
+ font-weight: 600;
+ background: rgba(245, 158, 11, 0.12);
+ border: 1px solid rgba(245, 158, 11, 0.28);
+ padding: 4rpx 16rpx;
+ border-radius: 20rpx;
+ }
+ }
+
+ .amount-input-box {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ background: rgba(15, 23, 42, 0.7);
+ border: 2rpx solid rgba(255, 255, 255, 0.1);
+ border-radius: 20rpx;
+ padding: 0 24rpx;
+ height: 112rpx;
+ box-sizing: border-box;
+ transition: all 0.25s ease;
+
+ &.is-focused {
+ border-color: #10B981;
+ background: rgba(16, 185, 129, 0.05);
+ box-shadow: 0 0 0 6rpx rgba(16, 185, 129, 0.15);
+ }
+
+ .input-currency-symbol {
+ font-size: 52rpx;
+ font-weight: 800;
+ color: #10B981;
+ margin-right: 16rpx;
+ line-height: 1;
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+
+ .amount-field-input {
+ flex: 1;
+ height: 80rpx;
+ line-height: 80rpx;
+ font-size: 52rpx;
+ font-weight: 800;
+ color: #F8FAFC;
+ font-family: -apple-system, BlinkMacSystemFont, "DIN Alternate", "Helvetica Neue", sans-serif;
+ font-variant-numeric: tabular-nums;
+ }
+
+ .amount-input-ph {
+ color: #64748B;
+ font-size: 48rpx;
+ font-weight: 400;
+ }
+
+ .btn-all-in {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 10rpx 22rpx;
+ background: rgba(16, 185, 129, 0.12);
+ border: 1px solid rgba(16, 185, 129, 0.35);
+ border-radius: 28rpx;
+ margin-left: 16rpx;
+ flex-shrink: 0;
+ transition: all 0.2s ease;
+
+ .btn-all-in-text {
+ font-size: 24rpx;
+ font-weight: 600;
+ color: #10B981;
+ letter-spacing: 0.5rpx;
+ line-height: 1;
+ }
+ }
+ }
+
+ .amount-tips-row {
+ margin-top: 20rpx;
+
+ .tip-msg {
+ display: flex;
+ align-items: center;
+ font-size: 23rpx;
+ line-height: 1.4;
+
+ &.error {
+ color: #EF4444;
+ .tip-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ width: 28rpx;
+ height: 28rpx;
+ background: #EF4444;
+ color: #FFFFFF;
+ border-radius: 50%;
+ font-size: 20rpx;
+ font-weight: 800;
+ margin-right: 10rpx;
+ line-height: 1;
+ }
+ }
+
+ &.warning {
+ color: #F59E0B;
+ .tip-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ width: 28rpx;
+ height: 28rpx;
+ background: #F59E0B;
+ color: #FFFFFF;
+ border-radius: 50%;
+ font-size: 20rpx;
+ font-weight: 800;
+ margin-right: 10rpx;
+ line-height: 1;
+ }
+ }
+
+ &.normal {
+ color: #94A3B8;
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+ gap: 8rpx;
+
+ .balance-label {
+ color: #94A3B8;
+ }
+
+ .balance-num {
+ font-weight: 700;
+ color: #10B981;
+ font-size: 25rpx;
+ }
+
+ .dot-divider {
+ color: #64748B;
+ font-weight: 700;
+ }
+
+ .limit-text {
+ color: #94A3B8;
+ }
+
+ .free-fee-badge {
+ color: #10B981;
+ background: rgba(16, 185, 129, 0.1);
+ padding: 2rpx 10rpx;
+ border-radius: 6rpx;
+ font-size: 20rpx;
+ font-weight: 600;
+ }
+ }
+ }
+ }
+}
+
/* 规范说明卡片 (高对比度深色模式) */
.rules-card {
background: rgba(30, 41, 59, 0.65);
@@ -1099,22 +1284,88 @@ onShow(() => {
}
}
- .amount-input-box {
- background: #FAFAF9;
- border-color: #E7E5E4;
+ .amount-card {
+ background: #FFFFFF;
+ border: 1px solid #F0ECE4;
+ box-shadow: 0 4rpx 20rpx rgba(28, 25, 23, 0.04);
- &:focus-within {
- border-color: #EA580C;
- box-shadow: 0 0 16rpx rgba(234, 88, 12, 0.15);
+ .card-section-head {
+ .section-title {
+ color: #1C1917;
+ }
+ .section-rule-hint {
+ color: #EA580C;
+ background: #FFF7ED;
+ border: 1px solid #FFEDD5;
+ }
}
- .currency-prefix-box .input-currency-symbol { color: #EA580C; }
- .amount-field-input { color: #1C1917; }
- .amount-input-ph { color: #A8A29E; }
- .btn-all-in {
- background: rgba(234, 88, 12, 0.12);
- border-color: rgba(234, 88, 12, 0.35);
- color: #EA580C;
+ .amount-input-box {
+ background: #FAFAF9;
+ border: 2rpx solid #E7E5E4;
+
+ &.is-focused {
+ border-color: #EA580C;
+ background: #FFFFFF;
+ box-shadow: 0 0 0 6rpx rgba(234, 88, 12, 0.12);
+ }
+
+ .input-currency-symbol {
+ color: #EA580C;
+ }
+
+ .amount-field-input {
+ color: #1C1917;
+ }
+
+ .amount-input-ph {
+ color: #A8A29E;
+ }
+
+ .btn-all-in {
+ background: #FFF7ED;
+ border: 1px solid #FDBA74;
+
+ .btn-all-in-text {
+ color: #EA580C;
+ }
+ }
+ }
+
+ .amount-tips-row {
+ .tip-msg {
+ &.error {
+ color: #DC2626;
+ .tip-badge {
+ background: #DC2626;
+ }
+ }
+ &.warning {
+ color: #D97706;
+ .tip-badge {
+ background: #D97706;
+ }
+ }
+ &.normal {
+ color: #78716C;
+ .balance-label {
+ color: #78716C;
+ }
+ .balance-num {
+ color: #EA580C;
+ }
+ .dot-divider {
+ color: #D6D3D1;
+ }
+ .limit-text {
+ color: #78716C;
+ }
+ .free-fee-badge {
+ color: #EA580C;
+ background: #FFF7ED;
+ }
+ }
+ }
}
}