From 601366d2a8de70cb98e0d60aca4c9e9d542a6823 Mon Sep 17 00:00:00 2001
From: duoaohui <928970622@qq.com>
Date: Tue, 26 May 2026 22:50:11 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=86=E9=A2=91=E8=BF=9E=E7=BA=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/pages/auth/login.vue | 60 +++++++++++++++++++++++++++++--
 1 file changed, 58 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/auth/login.vue b/frontend/src/pages/auth/login.vue
index d94d020..646cda8 100644
--- a/frontend/src/pages/auth/login.vue
+++ b/frontend/src/pages/auth/login.vue
@@ -80,8 +80,17 @@
           <view class="oauth-line"></view>
         </view>
         <view class="oauth-buttons">
-          <button class="oauth-btn oauth-wechat" :disabled="oauthLoading" @tap="oauthLogin('wechat')">微信登录</button>
-          <button class="oauth-btn oauth-qq" :disabled="oauthLoading" @tap="oauthLogin('qq')">QQ登录</button>
+          <button class="oauth-btn oauth-wechat" :disabled="oauthLoading" @tap="oauthLogin('wechat')">
+            <view class="oauth-icon oauth-icon-wechat">
+              <view class="wechat-bubble wechat-bubble-large"></view>
+              <view class="wechat-bubble wechat-bubble-small"></view>
+            </view>
+            <text>微信登录</text>
+          </button>
+          <button class="oauth-btn oauth-qq" :disabled="oauthLoading" @tap="oauthLogin('qq')">
+            <text class="oauth-icon oauth-icon-qq">Q</text>
+            <text>QQ登录</text>
+          </button>
         </view>
       </view>
 
@@ -433,6 +442,10 @@ export default {
   font-size: 28rpx;
   color: #FFFFFF;
   border: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12rpx;
 }
 
 .oauth-btn::after {
@@ -447,6 +460,49 @@ export default {
   background-color: #12B7F5;
 }
 
+.oauth-icon {
+  width: 36rpx;
+  height: 36rpx;
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 0.94);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 22rpx;
+  font-weight: 700;
+  line-height: 36rpx;
+}
+
+.oauth-icon-wechat {
+  position: relative;
+  color: #07C160;
+}
+
+.oauth-icon-qq {
+  color: #12B7F5;
+}
+
+.wechat-bubble {
+  position: absolute;
+  border-radius: 50%;
+  background-color: #07C160;
+}
+
+.wechat-bubble-large {
+  width: 18rpx;
+  height: 14rpx;
+  left: 8rpx;
+  top: 10rpx;
+}
+
+.wechat-bubble-small {
+  width: 14rpx;
+  height: 11rpx;
+  right: 7rpx;
+  bottom: 9rpx;
+  border: 2rpx solid #FFFFFF;
+}
+
 /* ---- 底部链接 ---- */
 .link-row {
   display: flex;