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.
350 lines
7.9 KiB
350 lines
7.9 KiB
<template>
|
|
<view class="container">
|
|
<image class="bkg" mode="aspectFill" src="../static/login-bg.png"></image>
|
|
<view class="login">
|
|
<view class="login-title">
|
|
<view>Hello</view>
|
|
<view>欢迎登录护工端</view>
|
|
</view>
|
|
<view class="login-form">
|
|
<view>
|
|
<u-input v-model="form.username" border-color="#f5f5f5" placeholder="请输入用户名"></u-input>
|
|
</view>
|
|
<view>
|
|
<u-input v-model="form.password" border-color="#f5f5f5" type="password"
|
|
placeholder="请输入密码"></u-input>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="role-select">
|
|
<view class="role-title">请选择登录角色：</view>
|
|
<view class="role-options">
|
|
<view class="role-item" v-for="(item, index) in roleList" :key="index"
|
|
@click="form.role = item.value">
|
|
<view class="radio-box" :class="{'active': form.role === item.value}">
|
|
<view class="radio-inner" v-if="form.role === item.value"></view>
|
|
</view>
|
|
<text class="role-label">{{item.label}}</text>
|
|
</view>
|
|
|
|
<view class="role-item role-item-check"
|
|
@click="isRemeber = !isRemeber">
|
|
<view class="radio-box" :class="{'active': isRemeber}">
|
|
<view class="radio-inner" v-if="isRemeber"></view>
|
|
</view>
|
|
<text class="role-label">记住当前登录状态</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="login-btn">
|
|
<view @click="login">立即登录</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
form: {
|
|
username: '',
|
|
password: '',
|
|
role:''
|
|
// role: uni.getStorageSync('login_role') || 'nurse' // 从缓存获取角色，默认护工
|
|
},
|
|
roleList: [{
|
|
value: 'nurse',
|
|
label: '护工'
|
|
},
|
|
{
|
|
value: 'staff',
|
|
label: '工作人员'
|
|
},
|
|
{
|
|
value: 'operator',
|
|
label: '运营人员'
|
|
}
|
|
],
|
|
site_name: '',
|
|
isRemeber: true
|
|
};
|
|
},
|
|
onReady() {},
|
|
onShareAppMessage() {
|
|
return {
|
|
title: '医康养服务', // 分享标题
|
|
path: '/pages/index/index', // 分享路径，通常指向首页
|
|
}
|
|
},
|
|
mounted() {
|
|
this.form = this.vuex_saved_username_psd || {
|
|
username: "",
|
|
password: "",
|
|
role:'nurse'
|
|
};
|
|
console.log("form",this.form)
|
|
},
|
|
methods: {
|
|
login() {
|
|
if (!this.form.username || !this.form.password) {
|
|
uni.showToast({
|
|
title: '请输入用户名和密码',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (!this.form.role) {
|
|
uni.showToast({
|
|
title: '请选择登录角色',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
let that = this
|
|
// 根据角色选择不同的登录接口
|
|
let loginApi = null
|
|
switch (this.form.role) {
|
|
case 'nurse':
|
|
loginApi = this.$u.api.login // 护工登录
|
|
break
|
|
case 'staff':
|
|
loginApi = this.$u.api.staffLogin // 工作人员登录
|
|
break
|
|
case 'operator':
|
|
loginApi = this.$u.api.operatorLogin // 运营人员登录
|
|
break
|
|
default:
|
|
uni.showToast({
|
|
title: '无效的角色选择',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
loginApi({
|
|
username: this.form.username,
|
|
password: this.form.password,
|
|
}).then(res => {
|
|
console.log("res1", res)
|
|
if (res.errcode === 40002) {
|
|
that.base.toast("账号密码不正确")
|
|
return
|
|
}
|
|
// 缓存登录角色
|
|
uni.setStorageSync('login_role', this.form.role)
|
|
const loginRole = uni.getStorageSync('login_role');
|
|
if (loginRole === 'staff') {
|
|
that.$u.vuex('vuex_token', res.token)
|
|
} else if (loginRole === 'operator') {
|
|
that.$u.vuex('vuex_token', res.access_token)
|
|
} else {
|
|
that.$u.vuex('vuex_token', res.token)
|
|
}
|
|
|
|
if (this.isRemeber) {
|
|
this.$u.vuex("vuex_saved_username_psd", this.form);
|
|
} else {
|
|
this.$u.vuex("vuex_saved_username_psd", {
|
|
username: "",
|
|
password: "",
|
|
role:'nurse'
|
|
});
|
|
}
|
|
|
|
that.base.toast("登录成功", 1500, function() {
|
|
uni.login({
|
|
provider: 'weixin',
|
|
success: (loginRes) => {
|
|
const code = loginRes.code;
|
|
// 调用静默登录接口
|
|
|
|
setTimeout(function() {
|
|
const loginRole = uni.getStorageSync('login_role');
|
|
if (loginRole === 'staff') {
|
|
// that.$u.vuex('vuex_token', res.token)
|
|
that.$u.api.appletLogin({
|
|
code
|
|
}).then(silentRes => {
|
|
uni.reLaunch({
|
|
url: '/pages/index/staffIndex'
|
|
});
|
|
}).catch(err => {
|
|
console.error('静默登录失败', err);
|
|
// 可以给用户提示
|
|
});
|
|
} else if (loginRole === 'operator') {
|
|
// that.$u.vuex('vuex_token', res.access_token)
|
|
uni.reLaunch({
|
|
url: '/pages/index/operatorIndex'
|
|
});
|
|
} else {
|
|
// that.$u.vuex('vuex_token', res.token)
|
|
that.$u.api.nurseAppletLogin({
|
|
code
|
|
}).then(silentRes => {
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
});
|
|
}).catch(err => {
|
|
console.error('静默登录失败', err);
|
|
// 可以给用户提示
|
|
});
|
|
}
|
|
}, 1500)
|
|
|
|
},
|
|
fail: (err) => {
|
|
console.error('获取微信code失败', err);
|
|
// 可以给用户提示
|
|
}
|
|
});
|
|
|
|
|
|
})
|
|
}).catch(err => {
|
|
console.error("登录失败", err)
|
|
that.base.toast("登录失败，请稍后重试")
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.container {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-color: #fff;
|
|
font-size: 32rpx;
|
|
|
|
.bkg {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
}
|
|
|
|
.login {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
padding-top: 150rpx;
|
|
// text-align: center;
|
|
width: 100%;
|
|
|
|
&-title {
|
|
font-size: 50rpx;
|
|
color: #fff;
|
|
text-align: left;
|
|
|
|
&>view {
|
|
width: 50%;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
&-form {
|
|
padding: 400rpx 65rpx 100rpx 65rpx;
|
|
margin-bottom: 10rpx;
|
|
|
|
&>view {
|
|
background-color: #f5f5f5;
|
|
border-radius: 60rpx;
|
|
padding: 10rpx 30rpx;
|
|
margin-bottom: 35rpx;
|
|
}
|
|
|
|
}
|
|
|
|
&-btn {
|
|
padding: 0 65rpx;
|
|
|
|
&>view {
|
|
font-size: 33rpx;
|
|
border-radius: 60rpx;
|
|
margin-bottom: 35rpx;
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
text-align: center;
|
|
color: #fff;
|
|
background: linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%);
|
|
box-shadow: 1rpx 1rpx 10rpx #c10d12;
|
|
}
|
|
}
|
|
}
|
|
|
|
.role-select {
|
|
padding: 0 30rpx;
|
|
margin-bottom: 50rpx;
|
|
margin-top: -60rpx;
|
|
|
|
.role-title {
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
margin-bottom: 16rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.role-options {
|
|
display: flex;
|
|
// justify-content: center;
|
|
flex-wrap: wrap;
|
|
|
|
.role-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0 20rpx;
|
|
margin-bottom: 10rpx;
|
|
|
|
.radio-box {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
border-radius: 50%;
|
|
border: 2rpx solid #dcdfe6;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-right: 12rpx;
|
|
|
|
&.active {
|
|
border-color: #1479ff;
|
|
|
|
.radio-inner {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
border-radius: 50%;
|
|
background-color: #1479ff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.role-label {
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
}
|
|
}
|
|
.role-item-check{
|
|
margin-top:20rpx;
|
|
.radio-box{
|
|
border-radius: 0;
|
|
.radio-inner{
|
|
border-radius: 0;
|
|
}
|
|
&.active {
|
|
border-color: #1479ff;
|
|
|
|
.radio-inner {
|
|
border-radius: 0%;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |