TONASPACE/PartsInquiry
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

3

Browse Source
This commit is contained in:
Wdp-ab
2025-09-29 21:38:32 +08:00
parent ed26244cdb
commit 19117de6c8
182 changed files with 11590 additions and 2156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
frontend/pages/auth/login.vue
View File

@@ -1,18 +1,21 @@
<template>
<view class="auth-page">
<view class="tabs">
<view :class="['tab', tab==='login'?'active':'']" @click="tab='login'">登录</view>
<view :class="['tab', tab==='register'?'active':'']" @click="tab='register'">注册</view>
<view :class="['tab', tab==='reset'?'active':'']" @click="tab='reset'">忘记密码</view>
<view class="login-hero">
<image class="login-hero-img" :src="authLoginTopImage" mode="widthFix" />
</view>
<view class="header"><text class="title">邮箱密码登录</text></view>
<view v-if="tab==='login'" class="panel">
<view v-if="tab==='login'" class="panel">
<input class="input" type="text" v-model.trim="loginForm.email" placeholder="输入邮箱" />
<input class="input" type="password" v-model="loginForm.password" placeholder="输入密码" />
<button class="btn primary" :disabled="loading" @click="onLogin">登录</button>
<view class="quick-inline">
<button class="quick-link" @click="gotoRegister">注册</button>
<button class="quick-link" @click="gotoReset">忘记密码</button>
</view>
</view>
<view v-else-if="tab==='register'" class="panel">
<view class="panel minor" v-if="tab==='register'">
<input class="input" type="text" v-model.trim="regForm.name" placeholder="输入用户名" />
<input class="input" type="text" v-model.trim="regForm.email" placeholder="输入邮箱" />
<view class="row">
@@ -24,7 +27,7 @@
<button class="btn primary" :disabled="loading" @click="onRegister">注册新用户</button>
</view>
<view v-else class="panel">
<view class="panel minor" v-if="tab==='reset'">
<input class="input" type="text" v-model.trim="resetForm.email" placeholder="输入邮箱" />
<view class="row">
<input class="input flex1" type="text" v-model.trim="resetForm.code" placeholder="邮箱验证码" />
@@ -35,16 +38,19 @@
<button class="btn primary" :disabled="loading" @click="onReset">重置密码</button>
</view>
</view>
</template>
<script>
import { get, post } from '../../common/http.js'
import { AUTH_LOGIN_TOP_IMAGE } from '../../common/config.js'
export default {
data(){
data(){
return {
loading: false,
tab: 'login',
tab: 'login',
authLoginTopImage: AUTH_LOGIN_TOP_IMAGE,
loginForm: { email: '', password: '' },
regForm: { name: '', email: '', code: '', password: '', password2: '' },
resetForm: { email: '', code: '', password: '', password2: '' },
@@ -55,6 +61,8 @@ export default {
},
beforeUnmount(){ this._timers.forEach(t=>clearInterval(t)) },
methods: {
gotoRegister(){ this.tab='register' },
gotoReset(){ this.tab='reset' },
toast(msg){ try{ uni.showToast({ title: String(msg||'操作失败'), icon: 'none' }) } catch(_){} },
validateEmail(v){ return /^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,}$/.test(String(v||'').trim()) },
startCountdown(key){
@@ -136,20 +144,39 @@ export default {
}catch(e){ this.toast(e.message) }
finally{ this.loading=false }
}
}
}
}
</script>
<style lang="scss">
.auth-page{ padding: 32rpx; display:flex; flex-direction: column; gap: 24rpx; }
.tabs{ display:flex; gap: 24rpx; }
.tab{ padding: 12rpx 20rpx; border-radius: 999rpx; background:#f2f4f8; color:#5b6b80; font-weight:700; }
.tab.active{ background:#2d6be6; color:#fff; }
.panel{ display:flex; flex-direction: column; gap: 16rpx; background:#fff; padding: 24rpx; border-radius: 16rpx; border:2rpx solid #eef2f9; }
.input{ background:#f7f9ff; border:2rpx solid rgba(45,107,230,0.12); border-radius: 12rpx; padding: 22rpx 20rpx; font-size: 28rpx; }
@import '../../uni.scss';
.auth-page{ padding: 32rpx; display:flex; flex-direction: column; gap: 24rpx; position: relative; min-height: 100vh; }
.header{ display:flex; align-items:center; justify-content:center; padding: 8rpx 0 0; }
.title{ font-size: 34rpx; font-weight: 800; color: $uni-text-color; }
.login-hero{ display:flex; justify-content:center; padding: 16rpx 0 0; }
.login-hero-img{ width: 72%; max-width: 560rpx; border-radius: 8rpx; }
.panel{ display:flex; flex-direction: column; gap: 16rpx; background: transparent; padding: 0; border-radius: 0; border: none; }
.panel.minor{ margin-top: 12rpx; }
.input{ background:#ffffff; border:2rpx solid #e5e7eb; border-radius: 12rpx; padding: 22rpx 20rpx; font-size: 28rpx; }
.row{ display:flex; gap: 12rpx; align-items:center; }
.flex1{ flex:1; }
.btn{ padding: 22rpx 20rpx; border-radius: 12rpx; font-weight: 800; text-align:center; }
.btn.primary{ background: linear-gradient(135deg, #4788ff 0%, #2d6be6 100%); color:#fff; }
.btn.primary{ background: linear-gradient(135deg, #4788ff 0%, #2d6be6 100%); color:#fff; border: 1rpx solid rgba(45,107,230,0.25); width: 72%; margin: 0 auto; padding: 14rpx 16rpx; }
.btn.ghost{ background:#eef3ff; color:#2d6be6; }
/* 右下角快捷入口：贴着登录功能，无边框、无背景 */
.quick-inline{ display:flex; gap: 28rpx; justify-content:flex-end; align-items:center; margin-top: 10rpx; }
.quick-link{ background: transparent !important; color: #2d6be6; border: none !important; outline: none; padding: 0; font-size: 26rpx; font-weight: 700; box-shadow: none; line-height: 1.2; }
.quick-link::after{ border: none !important; }
/* 注册/重置页：验证码按钮与左侧输入框等高，且更紧凑 */
.panel.minor .row > .input{ height: $app-form-control-height; padding: 0 $app-form-control-padding-x; }
.panel.minor .row > .btn.ghost{
height: $app-form-control-height;
padding: 0 $app-form-control-padding-x;
border-radius: $app-form-control-border-radius;
display: inline-flex;
align-items: center;
justify-content: center;
}
</style>