|
|
@@ -1,3 +1,27 @@
|
|
|
+<!--
|
|
|
+## 代码风格与命名规范问题
|
|
|
+1. 全局变量滥用 :代码中使用了 _this 全局变量(第50行),这是一种非常过时且危险的做法。在Vue组件中,应当使用箭头函数或 bind 方法来保持正确的 this 上下文,而不是依赖外部变量。这种写法会导致作用域混乱,增加调试难度。
|
|
|
+2. 命名不一致 :方法命名风格混乱,有的使用驼峰命名(如 onGetUserProfile ),有的使用下划线风格(如 changMobileLogin ),还有的使用混合风格(如 wechatLogin )。
|
|
|
+3. 硬编码问题 :代码中存在大量硬编码值,如第203行的 appid: 'wxf651ba4b0025640a' 和第204行的 main_body_id: '1' 。这些值应该通过配置文件或环境变量管理。
|
|
|
+4. 注释不规范 :注释风格不一致,有的使用 // ,有的使用 /* */ ,且部分注释与代码逻辑不符。例如第104行的注释 "切换微信登录" 与方法实现不符,该方法只是简单地设置 ismobile=false 。
|
|
|
+## 逻辑结构与流程问题
|
|
|
+1. 状态管理混乱 :组件中同时使用了 $db (本地存储)、 $store (Vuex)和组件内部 data 来管理状态,导致状态管理逻辑分散,难以追踪。
|
|
|
+2. 生命周期钩子使用不当 :在 mounted 钩子中仅仅赋值 _this = this ,这是完全多余的操作。而在 onShow 钩子中,混合了用户信息检查和微信登录逻辑,职责不清晰。
|
|
|
+3. 条件渲染逻辑复杂 :模板中使用了 v-if="ismobile" 和微信小程序条件编译 #ifdef MP-WEIXIN 混合控制登录方式显示,逻辑嵌套过深,可读性差。
|
|
|
+4. 导航逻辑不一致 :登录成功后,根据 redirect 参数的存在与否,使用了不同的导航方法: $common.navigateTo 、 uni.navigateBack 和 uni.switchTab ,逻辑分散且不一致。
|
|
|
+## 错误处理与安全性问题
|
|
|
+1. 错误处理不完善 :微信登录失败时(第246-263行),虽然有错误处理,但手机登录失败时(第167-175行)只是简单显示错误信息,没有更详细的错误分类和处理。
|
|
|
+2. 密码安全问题 :密码输入框(第14行)使用了简单的 :password="true" ,但没有任何密码强度检测或加密措施。
|
|
|
+3. 网络请求错误处理缺失 : $api.login 和 $api.third 调用中没有 catch 块来处理网络请求失败的情况,可能导致程序在网络异常时崩溃。
|
|
|
+4. 数据验证不足 :虽然有简单的手机号和密码非空验证,但没有更严格的格式验证(如手机号格式正则验证)。
|
|
|
+## 性能与可维护性问题
|
|
|
+1. 重复代码 :登录成功后的存储逻辑(第144-152行和第212-224行)在手机登录和微信登录中重复出现,应当提取为公共方法。
|
|
|
+2. 冗余代码 :第265-274行的 uni.login 代码被注释掉,属于死代码,应当移除。
|
|
|
+3. 依赖外部库不当 :代码中使用了 $common 、 $api 、 $db 等全局依赖,但没有明确的导入语句,增加了代码的耦合度和维护难度。
|
|
|
+4. 样式与逻辑混合 :模板中直接使用了内联样式(如第40行的 :style="{width:'160rpx',height: '40rpx'}" ),违反了样式与逻辑分离的原则。
|
|
|
+5. 微信登录逻辑过时 :使用了 uni.getUserProfile 方法,但根据微信小程序的最新政策,这种登录方式已经过时,应当使用更现代的登录流程。
|
|
|
+-->
|
|
|
+
|
|
|
<template>
|
|
|
<view class="body">
|
|
|
<u-navbar title="登录" bgColor="rgba(255,255,255,0.3)" :leftIconSize="0" titleStyle="font-weight:bold;color:#7a5831"></u-navbar>
|
|
|
@@ -24,16 +48,22 @@
|
|
|
|
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
|
<view v-else class="logView">
|
|
|
- <button @click="onGetUserProfile" class="logbt">
|
|
|
+ <view class="logbt">
|
|
|
<view class="login-head">
|
|
|
<image class="logoimg" :src="baseLogo" mode="widthFix"></image>
|
|
|
</view>
|
|
|
<view class="loginTitile"><text decode="true">请点击微信登录,并授权获取公开信息, 登录后您将获得更多权益</text></view>
|
|
|
- <view style="background-color: #cd5e3c; width: 200rpx; border-radius: 80rpx" class="cu-btn bg-orange shadow-blur round">
|
|
|
- <text class="cuIcon-lightauto"></text>
|
|
|
- 微信登录
|
|
|
+ <view class="btn-container">
|
|
|
+ <view @click="onGetUserProfile" style="background-color: #cd5e3c; width: 200rpx; border-radius: 80rpx" class="cu-btn bg-orange shadow-blur round">
|
|
|
+ <text class="cuIcon-lightauto"></text>
|
|
|
+ 微信登录
|
|
|
+ </view>
|
|
|
+ <view style="background-color: #dcdcdc; color: #000; width: 200rpx; border-radius: 80rpx; margin-left: 30rpx" class="cu-btn bg-orange shadow-blur round" @click="back()">
|
|
|
+ <text class="cuIcon-lightauto"></text>
|
|
|
+ 暂不登录
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- </button>
|
|
|
+ </view>
|
|
|
<view class="text-gray text-sm margin-top-xl" :style="{width:'160rpx',height: '40rpx'}" @click="changMobileLogin()">
|
|
|
|
|
|
</view>
|
|
|
@@ -93,6 +123,12 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ //返回首页
|
|
|
+ back(){
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/wenWuPage/wenWuPage',
|
|
|
+ })
|
|
|
+ },
|
|
|
//切换微信登录
|
|
|
wechatLogin(){
|
|
|
_this.ismobile=false;
|
|
|
@@ -420,7 +456,14 @@ image {
|
|
|
}
|
|
|
|
|
|
.login-bg {
|
|
|
- height: 100%;
|
|
|
- padding: 25rpx;
|
|
|
-}
|
|
|
+ height: 100%;
|
|
|
+ padding: 25rpx;
|
|
|
+ }
|
|
|
+ .btn-container {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
</style>
|