处理用户登陆

This commit is contained in:
2026-01-15 16:10:27 +08:00
parent 88c8a4517b
commit b04c263e49
37 changed files with 567 additions and 497 deletions

View File

@@ -1,115 +1,119 @@
<template>
<view class="content">
<view class="avatar">
<nut-avatar size="80">
<nut-icon size="30" name="my" />
</nut-avatar>
</view>
<view class="divider">
</view>
</view>
<template>
<view class="login-page">
<view class="login-title">
<text class="title-text">用户登陆</text>
</view>
<view class="login-container">
<nut-input v-model="username" placeholder="请输入用户名" clearable label="用户名" class="login-input"></nut-input>
<nut-input v-model="password" placeholder="请输入密码" clearable label="密码" type="password"
class="login-input"></nut-input>
<view style="padding-top:100rpx ;">
<!-- 登录按钮 -->
<nut-button type="primary" block @click="handleLogin">
登录
</nut-button>
</view>
</view>
</view>
</template>
<script setup>
import {
ref,
reactive,
onMounted,
computed
} from 'vue'
import {
onLoad,
onShow,
} from '@dcloudio/uni-app'
import {
fetchRooms,
fetchBooking,
fetchUnBooking,
fetchLogin,
} from '@/api/index';
import {
navigateTo,
} from '@/utils/helper'
<view class="tip-infos">
<text>申请获取以下权限</text>
<text>获得你的公开信息昵称头像等</text>
</view>
<view class="authorize-btn-inner">
<nut-button type="success" size="large" open-type="getUserInfo" @getuserinfo="getUserInfo">授权登录</nut-button>
</view>
<view class="authorize-btn-inner">
<nut-button type="danger" size="large" @click="switchTab('/pages/index/index')">暂不登录</nut-button>
</view>
</template>
<script setup>
import {
onMounted,
ref
} from 'vue';
import {
login
} from '@/api/user';
import {
onLoad
} from '@dcloudio/uni-app'
import {
navigateTo,
switchTab
} from '@/utils/helper';
const code = ref('')
const redirect_url = ref('')
onLoad((options) => {
redirect_url.value = options.redirect_url
})
onMounted(() => {
uni.login({
provider: "weixin",
success(res) {
if (res.errMsg === 'login:ok') {
code.value = res.code
}
}
})
})
const getUserInfo = (res) => {
if (code.value === '') {
// 响应式数据
const username = ref('');
const password = ref('');
// 登录方法
const handleLogin = () => {
if (username.value === '') {
uni.showToast({
title: '请输入用户名',
icon: 'none',
title: '请稍后再试'
})
});
return;
}
login(code.value, JSON.stringify(res.detail.userInfo)).then(res => {
if (password.value === '') {
uni.showToast({
title: '请输入密码',
icon: 'none',
});
return;
}
fetchLogin({
user_name: username.value,
password: password.value
}).then(res => {
console.log(res);
uni.setStorageSync('token', res.token)
uni.setStorageSync('uid', res.user_id)
if(res.is_bind_phone){
navigateTo('/pages/login/phoneAuthorization');
return
}
uni.setStorageSync('uid', res.user.user_id)
uni.setStorageSync('username', res.user.user_name)
uni.setStorageSync('role', res.user.role.value)
// isLoggedIn.value = true
// 登录操作(模拟成功)
uni.showToast({
title: '授权成功',
icon: 'none'
title: '登录成功',
icon: 'success',
});
uni.switchTab({
url: '/pages/index/index'
})
if (redirect_url.value !== 'undefined') {
navigateTo(redirect_url.value)
} else {
uni.navigateBack()
}
})
}
</script>
<style scoped lang="scss">
.divider {
height: 1px;
background: #eee;
width: 100%;
}
.content {
display: flex;
justify-content: center;
flex-direction: column;
padding: 25px 15px;
align-items: center;
gap: 20px;
}
.tip-infos {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 10px 25px;
gap: 10px;
text:nth-child(2) {
font-size: 15px;
color: #666;
}
}
.authorize-btn-inner {
padding: 15px;
}
};
</script>
<style scoped lang="scss">
.login-page {
display: flex;
// justify-content: center;
align-items: center;
flex-direction: column;
height: 100vh;
}
.login-title {
margin-top: 240rpx;
margin-bottom: 40rpx;
font-size: 32rpx;
color: #333;
font-weight: bold;
}
.title-text {
font-size: 36rpx;
color: #ff6600;
text-align: center;
}
.login-container {
width: 80%;
// max-width: 700rpx;
padding: 40rpx;
}
</style>