处理用户登陆

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,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>