You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
328 lines
8.3 KiB
328 lines
8.3 KiB
<template>
|
|
<view>
|
|
<view style="height: 500rpx;background-color:#fff;">
|
|
<view style="height: 150rpx;"></view>
|
|
<view class="image-container;">
|
|
<image :src="$util.img('/uniapp_src/static/images/login/login1.png')" class="base-image"></image>
|
|
<image :src="$util.img('/uniapp_src/static/images/login/login2.png')" class="overlay-image"></image>
|
|
</view>
|
|
<view style="width: 100%;font-size: 60rpx;color: #ccc;text-align: center;margin-top: 60rpx;">
|
|
运动识堂
|
|
</view>
|
|
</view>
|
|
<view :style="{'background-color':'#fff','width':'100%','height':'100vh' }">
|
|
<view style="width: 95%;height: 30rpx;"></view>
|
|
<view style="width: 95%;margin:30rpx auto;">
|
|
<fui-input borderTop placeholder="登录账号" v-model="user" backgroundColor="#f2f2f2"></fui-input>
|
|
</view>
|
|
|
|
<view style="width: 95%;margin: auto;">
|
|
<fui-input borderTop :padding="['20rpx','32rpx']" v-model="password1" placeholder="登录密码"
|
|
:password="password" backgroundColor="#f2f2f2">
|
|
<fui-icon :name="password?'invisible':'visible'" color="#B2B2B2" :size="50"
|
|
@click="change"></fui-icon>
|
|
</fui-input>
|
|
</view>
|
|
|
|
<view style="width: 95%;margin:30rpx auto;">
|
|
<fui-input @click="picker_show_loginType=true" v-model="loginType_str" placeholder="请选择登录类型"
|
|
backgroundColor="#f2f2f2">
|
|
<fui-icon name="arrowdown" color="#B2B2B2" :size="50" @click="change"></fui-icon>
|
|
</fui-input>
|
|
<fui-picker layer="1" :linkage="true" :options="loginType_Arr" :show="picker_show_loginType"
|
|
@change="changePicker_loginType" @cancel="picker_show_loginType=false"></fui-picker>
|
|
</view>
|
|
|
|
<view style="width: 95%;margin:60rpx auto;">
|
|
<fui-button background="#00be8c" radius="5rpx" @click="login">登录</fui-button>
|
|
</view>
|
|
|
|
<view style="width: 95%;margin:60rpx auto;">
|
|
<fui-button background="#fff" radius="5rpx" @click="forgot" color="#00be8c">忘记登录密码</fui-button>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import apiRoute from '@/api/apiRoute.js';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
inited: false, // 添加标记位控制 init 只执行一次
|
|
|
|
password: true,
|
|
user: '', //账户
|
|
password1: '', //密码
|
|
mini_wx_openid: '', //微信小程序openid
|
|
|
|
loginType: '', //登陆类型|1=市场,2=教练,3=销售,4=学员,5=教务
|
|
loginType_str: '', //登陆类型中文名字
|
|
loginType_Arr: [{
|
|
value: '1',
|
|
text: '市场登陆'
|
|
},
|
|
{
|
|
value: '2',
|
|
text: '教练登陆'
|
|
},
|
|
{
|
|
value: '3',
|
|
text: '销售登陆'
|
|
},
|
|
{
|
|
value: '2',
|
|
text: '教务登陆'
|
|
},
|
|
{
|
|
value: '4',
|
|
text: '学员登陆'
|
|
},
|
|
],
|
|
picker_show_loginType: false, //是否显示下拉窗组件
|
|
|
|
|
|
path_arr: {
|
|
'1': '/pages/market/home/index', //市场
|
|
'2': '/pages/coach/home/index', //教练
|
|
'3': '/pages/market/index/index', //销售
|
|
'4': '/pages/student/index/index', //学员
|
|
'5': '/pages/academic/home/index', //教务
|
|
},
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.loginType = options.loginType ?? '1' //登陆类型|1=市场,2=教练,3=销售,4=学员,5=教务
|
|
const selectedItem = this.loginType_Arr.find(item => item.value === String(this.loginType));
|
|
this.loginType_str = selectedItem ? selectedItem.text : '未知类型';
|
|
|
|
let res_codes = options.res_codes || '' //这个是axios.js传错来的接口请求返回的code,如果是401时则说明登陆报错,此时不应进入下方初始化方法
|
|
if (!this.inited && !res_codes) {
|
|
this.openViewHome()
|
|
this.inited = true
|
|
}
|
|
},
|
|
methods: {
|
|
async init() {
|
|
//条件编译 微信小程序
|
|
//#ifdef MP-WEIXIN
|
|
await this.getMiNiWxOpenId()
|
|
//#endif
|
|
},
|
|
change() {
|
|
this.password = !this.password
|
|
},
|
|
forgot() {
|
|
this.$navigateTo({
|
|
url: '/pages/student/login/forgot'
|
|
})
|
|
},
|
|
//登陆
|
|
async login() {
|
|
try {
|
|
// 参数验证
|
|
if (!this.user) {
|
|
uni.showToast({
|
|
title: '请输入手机号',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
if (!this.password1) {
|
|
uni.showToast({
|
|
title: '请输入密码',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
if (!this.loginType) {
|
|
uni.showToast({
|
|
title: '请选择登录类型',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
|
|
const params = {
|
|
phone: this.user,
|
|
password: this.password1,
|
|
login_type: this.loginType,
|
|
mini_wx_openid: this.mini_wx_openid //微信小程序openid
|
|
};
|
|
|
|
console.log('登录参数:', params);
|
|
let res;
|
|
if (this.loginType != 4) {
|
|
//员工登录
|
|
res = await apiRoute.personnelLogin(params);
|
|
} else {
|
|
//学生
|
|
res = await apiRoute.xy_login(params);
|
|
}
|
|
|
|
if (res && res.code === 1) { // 成功状态码为1
|
|
// 登录成功
|
|
if (res.data && res.data.token) {
|
|
uni.setStorageSync("token", res.data.token);
|
|
// 保存用户类型
|
|
if (res.data.user_type) {
|
|
uni.setStorageSync("userType", res.data.user_type);
|
|
}
|
|
// 保存过期时间
|
|
if (res.data.expires_time) {
|
|
uni.setStorageSync("expires_time", res.data.expires_time);
|
|
}
|
|
// 返回用户信息
|
|
if (res.data.userinfo){
|
|
uni.setStorageSync('userInfo',res.data.userinfo)
|
|
}
|
|
}
|
|
|
|
uni.showToast({
|
|
title:'登录成功',
|
|
icon: 'success'
|
|
});
|
|
this.openViewHome();
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg || '登录失败',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
} catch (error) {
|
|
console.error('登录失败:', error);
|
|
uni.showToast({
|
|
title: error || '登录失败,请重试',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
},
|
|
|
|
//获取微信小程序openid
|
|
// 获取微信登录 code 并请求 openid
|
|
async getMiNiWxOpenId() {
|
|
uni.login({
|
|
provider: 'weixin',
|
|
success: (res) => {
|
|
const code = res.code;
|
|
this.fetchOpenId(code); // 调用单独方法
|
|
},
|
|
fail: () => {
|
|
uni.showToast({
|
|
title: '微信登录失败',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
});
|
|
},
|
|
// 获取微信登录 code 并请求 openid
|
|
async fetchOpenId(code) {
|
|
let params = {
|
|
code: code,
|
|
}
|
|
let res = await apiRoute.common_getMiniWxOpenId(params)
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.mini_wx_openid = res.data.openid
|
|
},
|
|
|
|
//登录类型选择相关
|
|
changePicker_loginType(e) {
|
|
console.log('监听选择', e)
|
|
this.loginType = e.value
|
|
this.loginType_str = e.text
|
|
this.picker_show_loginType = false
|
|
},
|
|
|
|
//检测首页是否正确跳转-不正确则进行重定向
|
|
async openViewHome() {
|
|
const userType = String(uni.getStorageSync('userType') || '');
|
|
const token = uni.getStorageSync('token') || ''
|
|
|
|
if (!userType) {
|
|
uni.showToast({
|
|
title: '您的角色不能访问本功能,请联系管理员',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (!token) {
|
|
uni.showToast({
|
|
title: '请先登录',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
const pages = getCurrentPages();
|
|
const currentPage = pages[pages.length - 1];
|
|
const thisPath = '/' + currentPage.route;
|
|
|
|
|
|
const openPath = this.path_arr[userType];
|
|
|
|
console.log('当前路径:', thisPath);
|
|
console.log('用户类型:', userType);
|
|
console.log('应跳转路径:', openPath);
|
|
|
|
if (thisPath !== openPath) {
|
|
// 如果不是正确的首页路径,则跳转到对应角色首页
|
|
uni.setStorageSync('tabBerIndex', 0)
|
|
|
|
// 使用 redirectTo 替代 navigateTo,避免页面栈堆积
|
|
uni.redirectTo({
|
|
url: openPath,
|
|
complete(e) {
|
|
console.log(e)
|
|
}
|
|
});
|
|
return
|
|
}
|
|
// 如果是正确的路径,交给 onShow 控制初始化
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
page {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.fui-section__title {
|
|
margin-left: 32rpx;
|
|
}
|
|
|
|
.fui-left__icon {
|
|
padding-right: 24rpx;
|
|
}
|
|
|
|
.image-container {
|
|
margin: auto;
|
|
position: relative;
|
|
width: 150rpx;
|
|
/* 设置与第一张图片相同的宽度 */
|
|
height: 150rpx;
|
|
/* 设置与第一张图片相同的高度 */
|
|
}
|
|
|
|
.base-image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.overlay-image {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
}
|
|
</style>
|