fnvtk/cunkebao_v3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

数智员工免密登录

Browse Source
This commit is contained in:
wong
2025-10-29 10:30:50 +08:00
parent 18a7055a4e
commit 175c78c3d0
6 changed files with 572 additions and 313 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
Store_vue/api/modules/auth.js
View File

@@ -3,14 +3,18 @@ import { request, requestWithRetry } from '../config'
// 认证相关API
export const authApi = {
// 用户登录
login: (account, password) => {
// @param {string} account - 账号
// @param {string} password - 密码
// @param {string} deviceId - 设备ID（仅APP端传递，H5端为空字符串）
login: (account, password, deviceId) => {
return request({
url: '/v1/auth/login',
method: 'POST',
data: {
account: account,
password: password,
typeId: 2 // 固定为2
typeId: 2, // 固定为2
deviceId: deviceId || '' // 设备ID（仅APP端有值）
}
})
}

397
Store_vue/pages/login/index.vue
View File

@@ -8,96 +8,39 @@
<!-- 内容区域 -->
<view class="content-area">
<!-- 登录方式选项卡 -->
<view class="tab-container" v-if="false">
<view
class="tab-item"
:class="{ active: loginType === 'code' }"
@tap="loginType = 'code'"
>
验证码登录
</view>
<view
class="tab-item"
:class="{ active: loginType === 'password' }"
@tap="loginType = 'password'"
>
密码登录
<!-- 登录标题 -->
<view class="login-title">账号密码登录</view>
<!-- 账号输入 -->
<view class="form-item">
<view class="input-item">
<u-input
v-model="account"
placeholder="请输入账号"
class="input-field"
border="0"
prefixIcon="account"
/>
</view>
</view>
<!-- 地区提示 -->
<view class="tip-text u-line-1">
您所在地区仅支持 手机号 <!-- / 微信 / Apple 登录 -->
<!-- 密码输入 -->
<view class="form-item">
<view class="input-item">
<u-input
:type="passwordVisible ? 'text' : 'password'"
v-model="password"
placeholder="请输入密码"
class="input-field"
border="0"
prefixIcon="lock"
/>
<view class="password-icon" @tap="passwordVisible = !passwordVisible">
<u-icon :name="passwordVisible ? 'eye' : 'eye-off'" size="20" color="#999"></u-icon>
</view>
</view>
</view>
<!-- 验证码登录 -->
<block v-if="loginType === 'code'">
<view class="form-item">
<view class="input-item">
<view class="input-prefix">+86</view>
<u-input
type="number"
v-model="phone"
maxlength="11"
placeholder="手机号"
class="input-field"
border="0"
/>
</view>
</view>
<view class="form-item">
<view class="input-item code-input-box">
<u-input
type="number"
v-model="code"
maxlength="6"
placeholder="验证码"
class="input-field"
border="0"
/>
<view
class="send-code-btn"
:class="{ disabled: codeSending || !isPhoneValid }"
@tap="sendCode"
>
{{ codeText }}
</view>
</view>
</view>
</block>
<!-- 密码登录 -->
<block v-else>
<view class="form-item">
<view class="input-item">
<view class="input-prefix">+86</view>
<u-input
type="number"
v-model="phone"
maxlength="11"
placeholder="手机号"
class="input-field"
border="0"
/>
</view>
</view>
<view class="form-item">
<view class="input-item">
<u-input
:type="passwordVisible ? 'text' : 'password'"
v-model="password"
placeholder="密码"
class="input-field"
border="0"
/>
<view class="password-icon" @tap="passwordVisible = !passwordVisible">
<u-icon :name="passwordVisible ? 'eye' : 'eye-off'" size="20" color="#999"></u-icon>
</view>
</view>
</view>
</block>
<!-- 用户协议 -->
<view class="agreement-container">
<checkbox-group @change="checkboxChange">
@@ -118,40 +61,6 @@
登录
</view>
<!-- 分隔线 -->
<view class="divider" v-if="false">
<view class="divider-line"></view>
<text class="divider-text">或</text>
<view class="divider-line"></view>
</view>
<!-- 第三方登录 -->
<view class="third-party-login" v-if="false">
<u-button
text="使用微信登录"
:custom-style="{backgroundColor: '#07c160', color: '#ffffff', marginBottom: '15px'}"
shape="circle"
@click="handleThirdLogin('wechat')"
:ripple="true"
>
<template slot="icon">
<u-icon name="weixin-fill" color="#ffffff" size="18" style="margin-right: 5px;"></u-icon>
</template>
</u-button>
<u-button
text="使用 Apple 登录"
:custom-style="{backgroundColor: '#000000', color: '#ffffff'}"
shape="circle"
@click="handleThirdLogin('apple')"
:ripple="true"
>
<template slot="icon">
<u-icon name="apple-fill" color="#ffffff" size="18" style="margin-right: 5px;"></u-icon>
</template>
</u-button>
</view>
<!-- 联系我们 -->
<view class="contact-us" @tap="contactUs">
联系我们
@@ -168,44 +77,63 @@
export default {
data() {
return {
loginType: 'password', // 默认密码登录
phone: '', // 手机号
code: '', // 验证码
account: '', // 账号
password: '', // 密码
passwordVisible: false, // 密码是否可见
agreement: true, // 是否同意协议
codeSending: false, // 是否正在发送验证码
countdown: 60, // 倒计时
codeText: '发送验证码' // 验证码按钮文本
deviceId: '' // 设备ID
}
},
// 页面加载时检查token
onLoad() {
this.checkTokenStatus();
this.getDeviceId();
},
// 页面显示时检查token
onShow() {
this.checkTokenStatus();
},
computed: {
// 验证手机号是否有效
isPhoneValid() {
return this.phone && this.phone.length === 11;
},
// 验证是否可以登录
canLogin() {
if (!this.phone || !this.agreement) {
return false;
}
if (this.loginType === 'code') {
return this.isPhoneValid && this.code && this.code.length === 6;
} else {
return this.password && this.password.length >= 6;
}
return this.account &&
this.password &&
this.password.length >= 6 &&
this.agreement;
}
},
methods: {
// 获取设备ID（仅APP端）
getDeviceId() {
// #ifdef APP-PLUS
try {
// 获取设备信息
uni.getSystemInfo({
success: (res) => {
console.log('设备信息:', res);
// 优先使用deviceId，如果没有则使用uuid或其他唯一标识
this.deviceId = res.deviceId || res.uuid || res.system + '_' + res.model;
console.log('APP设备ID:', this.deviceId);
},
fail: (err) => {
console.error('获取设备信息失败:', err);
// 如果获取失败，使用一个临时ID
this.deviceId = 'unknown_device';
}
});
} catch (err) {
console.error('获取设备ID异常:', err);
this.deviceId = 'unknown_device';
}
// #endif
// #ifdef H5
// H5端不传设备ID
this.deviceId = '';
console.log('H5端不传设备ID');
// #endif
},
// 检查token状态
checkTokenStatus() {
// 如果token有效，则跳转到聊天页面
@@ -219,37 +147,7 @@
uni.navigateBack();
},
// 切换登录类型
switchLoginType(type) {
this.loginType = type;
},
// 发送验证码
sendCode() {
if (this.codeSending || !this.isPhoneValid) return;
this.codeSending = true;
this.countdown = 60;
this.codeText = `${this.countdown}秒后重发`;
// 模拟发送验证码
uni.showToast({
title: '验证码已发送',
icon: 'success'
});
const timer = setInterval(() => {
this.countdown--;
this.codeText = `${this.countdown}秒后重发`;
if (this.countdown <= 0) {
clearInterval(timer);
this.codeSending = false;
this.codeText = '发送验证码';
}
}, 1000);
},
// 用户协议复选框变化
checkboxChange(){
this.agreement = !this.agreement
},
@@ -258,7 +156,6 @@
// 处理登录
async handleLogin() {
// 检查是否同意协议
console.log(this.agreement)
if (!this.agreement) {
uni.showToast({
title: '请阅读并同意用户协议和隐私政策',
@@ -268,24 +165,28 @@
return;
}
if (!this.canLogin) {
// 显示错误原因
if (!this.isPhoneValid) {
uni.showToast({
title: '请输入正确的手机号',
icon: 'none'
});
} else if (this.loginType === 'code' && (!this.code || this.code.length !== 6)) {
uni.showToast({
title: '请输入6位验证码',
icon: 'none'
});
} else if (this.loginType === 'password' && (!this.password || this.password.length < 6)) {
uni.showToast({
title: '密码不能少于6位',
icon: 'none'
});
}
// 验证表单
if (!this.account) {
uni.showToast({
title: '请输入账号',
icon: 'none'
});
return;
}
if (!this.password) {
uni.showToast({
title: '请输入密码',
icon: 'none'
});
return;
}
if (this.password.length < 6) {
uni.showToast({
title: '密码不能少于6位',
icon: 'none'
});
return;
}
@@ -295,11 +196,16 @@
});
try {
// 调用登录API
const loginPassword = this.loginType === 'password' ? this.password : this.code;
const response = await authApi.login(this.phone, loginPassword);
// 调用登录API，传递账号、密码和设备ID（仅APP端传递）
const response = await authApi.login(this.account, this.password, this.deviceId);
console.log(response);
console.log('登录响应:', response);
// #ifdef APP-PLUS
console.log('APP端登录 - 设备ID:', this.deviceId);
// #endif
// #ifdef H5
console.log('H5端登录 - 不传设备ID');
// #endif
if (response.code === 200) { // 成功code是200
// 登录成功，缓存token信息
@@ -337,20 +243,12 @@
}
},
// 第三方登录
handleThirdLogin(platform) {
// uni.showToast({
// title: `${platform === 'wechat' ? '微信' : 'Apple'}登录功能暂未实现`,
// icon: 'none'
// });
},
// 打开协议
openAgreement(type) {
// uni.showToast({
// title: `打开${type === 'user' ? '用户协议' : '隐私政策'}`,
// icon: 'none'
// });
uni.showToast({
title: `打开${type === 'user' ? '用户协议' : '隐私政策'}`,
icon: 'none'
});
},
// 联系我们
@@ -404,42 +302,12 @@
padding: 0 30px;
}
.tab-container {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
position: relative;
}
.tab-item {
position: relative;
text-align: center;
padding: 10px 0;
font-size: 16px;
color: #666;
flex: 1;
}
.tab-item.active {
color: #4080ff;
.login-title {
font-size: 24px;
font-weight: bold;
}
.tab-item.active::after {
content: '';
position: absolute;
bottom: -2px;
left: 25%;
width: 50%;
height: 3px;
background-color: #4080ff;
border-radius: 2px;
}
.tip-text {
font-size: 14px;
color: #666;
margin-bottom: 20px;
color: #333;
margin: 30px 0 40px;
text-align: center;
}
.input-item {
@@ -447,15 +315,8 @@
align-items: center;
border-bottom: 1px solid #eee;
padding: 12px 0;
height: 24px;
}
.input-prefix {
color: #333;
margin-right: 10px;
padding-right: 10px;
border-right: 1px solid #eee;
font-size: 14px;
min-height: 50px;
position: relative;
}
.input-field {
@@ -464,25 +325,9 @@
font-size: 15px;
}
.code-input-box {
position: relative;
}
.send-code-btn {
.password-icon {
position: absolute;
right: 0;
background-color: #4080ff;
color: #fff;
padding: 5px 10px;
border-radius: 4px;
font-size: 12px;
}
.send-code-btn.disabled {
background-color: #ccc;
}
.password-icon {
padding: 0 5px;
height: 100%;
display: flex;
@@ -526,28 +371,6 @@
background-color: #4080ff;
}
.divider {
display: flex;
align-items: center;
margin: 20px 0;
}
.divider-line {
flex: 1;
height: 1px;
background-color: #eee;
}
.divider-text {
color: #999;
padding: 0 15px;
font-size: 14px;
}
.third-party-login {
margin: 20px 0;
}
.contact-us {
text-align: center;
color: #999;