iuu/cmgd-mini-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

处理用户登陆

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

214
pages/index/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<view class="page-content">
<view class="page-content" v-if="isLoggedIn">
<view style="z-index: 10000;position: sticky;" :style="'top:0px'">
<view class="top-bar">
<nut-button type="primary" block @click="navigateTo('/pages/index/goodsOrderAdd')">
@@ -13,9 +13,10 @@
<view class="room-grid-card">
<view class="grid-item-content">
<view class="room-name">{{room.room_name}}</view>
<view class="room-info" >
<view class="room-info">
<view class="room-id" @click="onShowInfoPopup(room)" v-if="room.tel">尾号: {{room.tel}}</view>
<view class="remark" @click="onShowInfoPopup(room)" v-if="room.remarks">备注: {{room.remarks}}</view>
<view class="remark" @click="onShowInfoPopup(room)" v-if="room.remarks">备注: {{room.remarks}}
</view>
</view>
<view class="room-buttons">
<view v-if="room.status === 1">
@@ -52,8 +53,7 @@
<nut-input v-model="form.tel" placeholder="请输入尾号"></nut-input>
</nut-form-item>
<nut-form-item label="备注">
<nut-textarea v-model="form.remarks" :rows="3"
placeholder="请输入备注"></nut-textarea>
<nut-textarea v-model="form.remarks" :rows="3" placeholder="请输入备注"></nut-textarea>
</nut-form-item>
</nut-form>
<view style=" padding: 0rpx 80rpx;">
@@ -62,22 +62,38 @@
</nut-button>
</view>
</view>
</nut-popup>
<!-- 弹出 -->
<nut-popup :custom-style="{ height: '50%' }" v-model:visible="visibleInfoPopup" position="bottom"
safe-area-inset-bottom :close-on-click-overlay="true" @close="onCloseInfoPopup">
<view>
<view class="title">{{tempRoom?.room_name}} </view>
<view class="room-info">
<view class="room-id" v-if="tempRoom?.tel">尾号: {{tempRoom.tel}}</view>
<view class="remark" v-if="tempRoom?.remarks">备注: {{tempRoom.remarks}}</view>
</view>
</view>
</nut-popup>
</nut-popup>
<!-- 弹出 -->
<nut-popup :custom-style="{ height: '50%' }" v-model:visible="visibleInfoPopup" position="bottom"
safe-area-inset-bottom :close-on-click-overlay="true" @close="onCloseInfoPopup">
<view>
<view class="title">{{tempRoom?.room_name}} </view>
<view class="room-info">
<view class="room-id" v-if="tempRoom?.tel">尾号: {{tempRoom.tel}}</view>
<view class="remark" v-if="tempRoom?.remarks">备注: {{tempRoom.remarks}}</view>
</view>
</view>
</nut-popup>
</view>
<view class="login-page" v-else>
<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>
@@ -96,11 +112,61 @@
import {
fetchRooms,
fetchBooking,
fetchUnBooking
fetchUnBooking,
fetchLogin,
} from '@/api/index';
import {
navigateTo,
} from '@/utils/helper'
// 响应式变量，用于控制是否显示列表或提示登录
const isLoggedIn = ref(false);
// 响应式数据
const username = ref('');
const password = ref('');
// 登录方法
const handleLogin = () => {
if (username.value === '') {
uni.showToast({
title: '请输入用户名',
icon: 'none',
});
return;
}
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.user_id)
uni.setStorageSync('username', res.user.user_name)
uni.setStorageSync('role', res.user.role.value)
isLoggedIn.value = true
// 登录操作（模拟成功）
uni.showToast({
title: '登录成功',
icon: 'success',
});
// rooms.value = res;
})
};
const form = reactive({
room_id: 0,
tel: '',
@@ -131,21 +197,21 @@
return {
'background-color': backgroundColor,
};
}
const visibleInfoPopup = ref(false)
}
const visibleInfoPopup = ref(false)
const onShowInfoPopup = (room) => {
console.log("----", room);
Object.assign(tempRoom, room)
visibleInfoPopup.value = true
}
const onCloseInfoPopup = () => {
Object.assign(tempRoom, {})
visibleInfoPopup.value = false
console.log("关闭");
};
}
const onCloseInfoPopup = () => {
Object.assign(tempRoom, {})
visibleInfoPopup.value = false
console.log("关闭");
};
const visiblePopup = ref(false)
const tempRoom = reactive({})
const onBooking = (room) => {
@@ -163,10 +229,11 @@
})
visiblePopup.value = false
console.log("关闭");
};
};
// 获取房间
const getRooms = () => {
console.log("房间");
fetchRooms().then(res => {
@@ -203,14 +270,27 @@
const init = () => {
console.log('init');
uni.hideTabBar()
checkLogin()
getRooms()
}
onShow(() => {
console.log("onshow---");
uni.hideTabBar()
checkLogin()
getRooms()
});
const checkLogin = () => {
let token = uni.getStorageSync('token');
console.log("token", token);
if (token) {
uni.showTabBar()
isLoggedIn.value = true;
}
}
onMounted(() => {
init();
})
@@ -319,22 +399,52 @@
font-size: 28rpx;
font-weight: 400;
text-align: center;
}
.room-info {
text-align: left;
padding: 20rpx 20rpx;
color: #666;
width: 100%;
// min-height: 160rpx;
box-sizing: border-box;
.room-id {
font-size: 28rpx;
}
.remark {
font-size: 26rpx;
}
}
.room-info {
text-align: left;
padding: 20rpx 20rpx;
color: #666;
width: 100%;
// min-height: 160rpx;
box-sizing: border-box;
.room-id {
font-size: 28rpx;
}
.remark {
font-size: 26rpx;
}
}
.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>

212
pages/login/index.vue
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>