feat(login): 重构登录页面，改为邮箱登录并美化UI

- 美化登录页面UI，添加Logo图标和渐变背景
- 将登录方式从账号改为邮箱登录
- 新增邮箱格式验证（正则表达式校验）
- 新增密码长度验证（至少6位）
- 移除"忘记密码"和"立即注册"功能
- 添加"账号由后台系统统一配置"提示文字
- 优化登录按钮样式（渐变背景、阴影、点击反馈）
- 更新页面标题和副标题文案

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

 /*
  * @Date: 2025-06-28 10:33:00
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2026-01-30 13:50:37
+ * @LastEditTime: 2026-01-30 13:54:57
  * @FilePath: /manulife-weapp/src/pages/login/index.config.js
  * @Description: 登录页配置
  */
 export default definePageConfig({
-  navigationBarTitleText: '登录',
+  navigationBarTitleText: '',
   navigationStyle: 'custom'
 })

 <template>
   <view class="min-h-screen bg-white flex flex-col">
     <!-- Header -->
-    <NavHeader title="登录" :show-back="true" />
+    <NavHeader title="" :show-back="true" />
 
-    <view class="flex-1 flex flex-col px-[48rpx] pt-[80rpx]">
+    <view class="flex-1 flex flex-col px-[48rpx] pt-[120rpx]">
       <!-- Logo/Title -->
-      <view class="mb-[80rpx]">
-        <view class="text-[48rpx] font-bold text-gray-900 mb-[16rpx]">欢迎登录</view>
-        <view class="text-[28rpx] text-gray-500">Manulife 宏利</view>
+      <view class="mb-[100rpx]">
+        <!-- Logo Icon -->
+        <view class="flex justify-center mb-[40rpx]">
+          <view class="w-[160rpx] h-[160rpx] rounded-[32rpx] bg-gradient-to-br from-[#007AFF] to-[#0051D5] flex items-center justify-center shadow-lg">
+            <text class="text-white text-[80rpx] font-bold">M</text>
+          </view>
+        </view>
+
+        <!-- Title -->
+        <view class="text-center">
+          <view class="text-[52rpx] font-bold text-gray-900 mb-[16rpx]">欢迎登录</view>
+          <view class="text-[28rpx] text-gray-500">Manulife 臻奇智荟圈</view>
+        </view>
       </view>
 
       <!-- Form -->
       <view class="space-y-[48rpx]">
-        <!-- Username -->
+        <!-- Email -->
         <view class="border-b border-gray-200 pb-[16rpx]">
-          <view class="text-[28rpx] text-gray-900 font-medium mb-[16rpx]">账号</view>
+          <view class="text-[28rpx] text-gray-900 font-medium mb-[16rpx]">邮箱</view>
           <input
-            v-model="form.username"
+            v-model="form.email"
             type="text"
-            placeholder="请输入账号"
+            placeholder="请输入工作邮箱"
             placeholder-class="text-gray-300"
             class="w-full text-[32rpx] text-gray-900 h-[80rpx]"
           />
@@ -35,23 +45,22 @@
             class="w-full text-[32rpx] text-gray-900 h-[80rpx]"
           />
         </view>
+
+        <!-- Hint -->
+        <view class="text-[24rpx] text-gray-400 mt-[24rpx]">
+          账号由后台系统统一配置，请联系管理员获取
+        </view>
       </view>
 
       <!-- Actions -->
       <view class="mt-[80rpx]">
         <button
-          class="w-full h-[96rpx] bg-[#2563EB] rounded-[48rpx] flex items-center justify-center text-white text-[32rpx] font-bold active:opacity-90 after:border-none"
+          class="w-full h-[96rpx] bg-gradient-to-r from-[#007AFF] to-[#0051D5] rounded-[48rpx] flex items-center justify-center text-white text-[32rpx] font-bold shadow-lg active:scale-[0.98] transition-transform after:border-none"
           @tap="handleLogin"
         >
           登录
         </button>
       </view>
-
-      <!-- Links -->
-      <view class="mt-[48rpx] flex justify-between text-[28rpx]">
-        <view class="text-gray-500" @tap="handleForgotPassword">忘记密码</view>
-        <view class="text-[#2563EB]" @tap="handleRegister">立即注册</view>
-      </view>
     </view>
   </view>
 </template>
@@ -65,25 +74,48 @@ import NavHeader from '@/components/NavHeader.vue'
 const go = useGo()
 
 const form = reactive({
-  username: '',
+  email: '',
   password: ''
 })
 
 /**
+ * 验证邮箱格式
+ * @param {string} email - 邮箱地址
+ * @returns {boolean} 是否有效
+ */
+const isValidEmail = (email) => {
+  const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/
+  return emailRegex.test(email)
+}
+
+/**
  * Handle login action
  */
 const handleLogin = () => {
-  if (!form.username) {
-    Taro.showToast({ title: '请输入账号', icon: 'none' })
+  // 验证邮箱
+  if (!form.email) {
+    Taro.showToast({ title: '请输入邮箱', icon: 'none' })
+    return
+  }
+
+  if (!isValidEmail(form.email)) {
+    Taro.showToast({ title: '请输入有效的邮箱地址', icon: 'none' })
     return
   }
+
+  // 验证密码
   if (!form.password) {
     Taro.showToast({ title: '请输入密码', icon: 'none' })
     return
   }
 
+  if (form.password.length < 6) {
+    Taro.showToast({ title: '密码长度至少6位', icon: 'none' })
+    return
+  }
+
   // Mock login success
-  Taro.showLoading({ title: '登录中...' })
+  Taro.showLoading({ title: '登录中...', mask: true })
   setTimeout(() => {
     Taro.hideLoading()
     Taro.showToast({ title: '登录成功', icon: 'success' })
@@ -93,19 +125,28 @@ const handleLogin = () => {
     }, 1500)
   }, 1000)
 }
-
-const handleForgotPassword = () => {
-    Taro.showToast({ title: '功能开发中', icon: 'none' })
-}
-
-const handleRegister = () => {
-    Taro.showToast({ title: '功能开发中', icon: 'none' })
-}
 </script>
 
 <style lang="less">
-/* Reset button default styles if needed */
+/* Reset button default styles */
 button::after {
   border: none;
 }
+
+/* Enhance gradient effect for button */
+button {
+  background: linear-gradient(135deg, #007AFF 0%, #0051D5 100%);
+  box-shadow: 0 8rpx 24rpx rgba(0, 122, 255, 0.3);
+  transition: all 0.3s ease;
+
+  &:active {
+    transform: scale(0.98);
+    box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.2);
+  }
+}
+
+/* Logo icon enhancement */
+.shadow-lg {
+  box-shadow: 0 16rpx 32rpx rgba(0, 122, 255, 0.25);
+}
 </style>