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.
74 lines
2.9 KiB
74 lines
2.9 KiB
<template>
|
|
<view class="page-staff-login">
|
|
<view class="login-container">
|
|
<text class="login-logo">🧑🍳</text>
|
|
<text class="login-title">调酒师登录</text>
|
|
<text class="login-subtitle">别再摸鱼了，起来干活！</text>
|
|
|
|
<view class="login-form">
|
|
<input class="form-input" v-model="username" placeholder="账号" type="text" />
|
|
<input class="form-input" v-model="password" placeholder="密码" type="password" />
|
|
<button class="login-submit" @tap="onLogin" :loading="loading" :disabled="loading">🔓 登 录</button>
|
|
</view>
|
|
|
|
<view class="back-link" @tap="goBack">
|
|
<text>← 返回顾客端</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { ref } from 'vue'
|
|
import { post } from '@/utils/request'
|
|
import { API } from '@/utils/constants'
|
|
import { useStaffStore } from '@/stores/staff'
|
|
|
|
export default {
|
|
setup() {
|
|
const staff = useStaffStore()
|
|
const username = ref('')
|
|
const password = ref('')
|
|
const loading = ref(false)
|
|
|
|
async function onLogin() {
|
|
if (!username.value || !password.value) {
|
|
uni.showToast({ title: '请输入账号密码', icon: 'none' })
|
|
return
|
|
}
|
|
if (loading.value) return
|
|
loading.value = true
|
|
try {
|
|
const res = await post(API.STAFF_LOGIN, { username: username.value, password: password.value })
|
|
if (!res || !res.token) {
|
|
uni.showToast({ title: '登录失败', icon: 'none' })
|
|
loading.value = false
|
|
return
|
|
}
|
|
staff.login(res.token, res.nickname, res.staffId)
|
|
uni.reLaunch({ url: '/pages/staff/board' })
|
|
} catch (e) {
|
|
loading.value = false
|
|
}
|
|
}
|
|
|
|
function goBack() { uni.navigateBack() }
|
|
|
|
return { username, password, loading, onLogin, goBack }
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
.page-staff-login{min-height:100vh;display:flex;flex-direction:column;background:var(--bg);width:100%}
|
|
.login-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80rpx 64rpx}
|
|
.login-logo{font-size:120rpx;animation:float 3s ease-in-out infinite}
|
|
.login-title{font-size:44rpx;font-weight:800;color:var(--gold);margin:24rpx 0 8rpx}
|
|
.login-subtitle{font-size:26rpx;color:var(--text-dim);margin-bottom:64rpx}
|
|
.login-form{width:100%}
|
|
.form-input{width:100%;height:96rpx;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 32rpx;font-size:30rpx;color:var(--text);margin-bottom:24rpx}
|
|
.login-submit{width:100%;height:96rpx;border-radius:24rpx;background:linear-gradient(135deg,var(--gold-dark),var(--gold));color:#1A1A1A;border:none;font-size:32rpx;font-weight:800;margin-top:16rpx;display:flex;align-items:center;justify-content:center}
|
|
.back-link{margin-top:24rpx;color:var(--text-muted);font-size:24rpx}
|
|
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16rpx)}}
|
|
</style>
|