bestunion/Otsuka-APP
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

login

Browse Source
This commit is contained in:
Rhett霍 2026-03-09 08:24:15 +08:00
parent 5848878fb5
commit 15ddc0094b
1 changed files with 38 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
pages/login.vue
View File

@ -12,7 +12,10 @@
</view> </view>
<view class="input-item flex align-center"> <view class="input-item flex align-center">
<view class="iconfont icon-password icon"></view> <view class="iconfont icon-password icon"></view>
<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" /> <input v-model="loginForm.password" :type="passwordVisible ? 'text' : 'password'" class="input" placeholder="请输入密码" maxlength="20" />
<view class="password-eye" @click="togglePasswordVisible">
<uni-icons :type="passwordVisible ? 'eye-slash' : 'eye'" size="20" color="#999"></uni-icons>
</view>
</view> </view>
<view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled"> <view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
<view class="iconfont icon-code icon"></view> <view class="iconfont icon-code icon"></view>
@ -47,6 +50,9 @@
const captchaEnabled = ref(true) const captchaEnabled = ref(true)
// 用户注册开关 // 用户注册开关
const register = ref(false) const register = ref(false)
// 密码可见性
const passwordVisible = ref(false)
const loginForm = ref({ const loginForm = ref({
username: "admin", username: "admin",
password: "admin123", password: "admin123",
@ -54,6 +60,11 @@
uuid: "" uuid: ""
}) })
// 切换密码可见性
function togglePasswordVisible() {
passwordVisible.value = !passwordVisible.value
}
// 用户注册 // 用户注册
function handleUserRegister() { function handleUserRegister() {
proxy.$tab.redirectTo(`/pages/register`) proxy.$tab.redirectTo(`/pages/register`)
@ -149,6 +160,7 @@
background-color: #f5f6f7; background-color: #f5f6f7;
height: 45px; height: 45px;
border-radius: 20px; border-radius: 20px;
position: relative;
.icon { .icon {
font-size: 38rpx; font-size: 38rpx;
@ -162,8 +174,31 @@
line-height: 20px; line-height: 20px;
text-align: left; text-align: left;
padding-left: 15px; padding-left: 15px;
padding-right: 45px; /* 为眼睛图标留出更多空间 */
}
.password-eye {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
/* 增加点击区域 */
&::after {
content: '';
position: absolute;
top: -10px;
left: -10px;
right: -10px;
bottom: -10px;
}
} }
} }
.login-btn { .login-btn {
@ -193,4 +228,4 @@
} }
} }
} }
</style> </style>