Browse Source

修改未登录提示信息

wangyi/feature-20251022162725-启动页登录注册
Ethereal 1 month ago
parent
commit
4bd1fd5198
  1. 48
      components/login-prompt.vue

48
components/login-prompt.vue

@ -1,16 +1,22 @@
<template> <template>
<view class="login-prompt" v-if="showPrompt"> <view class="login-prompt" v-if="showPrompt">
<view class="mask" :class="{ 'mask-show': showAnimation }" @click="hide"></view>
<view
class="mask"
:class="{ 'mask-show': showAnimation }"
></view>
<view class="prompt-content" :class="{ 'slide-up': showAnimation }"> <view class="prompt-content" :class="{ 'slide-up': showAnimation }">
<text class="prompt-title">登录以获得更好的体验</text> <text class="prompt-title">登录以获得更好的体验</text>
<button class="login-btn" @click="goLogin">登录(推荐)</button>
<button class="visitor-btn" @click="continueAsVisitor">以访客身份继续</button>
<button class="login-btn" @click="goLogin">登录</button>
<button class="visitor-btn" @click="continueAsVisitor">
以访客身份继续
</button>
<text class="prompt-title-small">如果您还没有账号点击注册</text>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref, nextTick } from 'vue';
import { ref, nextTick } from "vue";
// //
const showPrompt = ref(false); const showPrompt = ref(false);
@ -39,7 +45,7 @@ const hide = () => {
// //
const goLogin = () => { const goLogin = () => {
uni.navigateTo({ uni.navigateTo({
url: '/pages/login/login'
url: "/pages/start/login/login",
}); });
hide(); hide();
}; };
@ -47,14 +53,14 @@ const goLogin = () => {
// 访 // 访
const continueAsVisitor = () => { const continueAsVisitor = () => {
// 访 // 访
uni.setStorageSync('visitorMode', true);
uni.setStorageSync("visitorMode", true);
hide(); hide();
}; };
// 使 // 使
defineExpose({ defineExpose({
show, show,
hide
hide,
}); });
</script> </script>
@ -88,10 +94,10 @@ defineExpose({
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
height: 300rpx;
height: 400rpx;
border-radius: 20rpx 20rpx 0 0; border-radius: 20rpx 20rpx 0 0;
background-color: white; background-color: white;
padding: 20rpx 30rpx;
padding: 20rpx 70rpx;
transform: translateY(100%); transform: translateY(100%);
transition: transform 0.3s ease; transition: transform 0.3s ease;
box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
@ -103,18 +109,18 @@ defineExpose({
.prompt-title { .prompt-title {
display: block; display: block;
text-align: left;
font-size: 28rpx;
text-align: center;
font-size: 40rpx;
font-weight: 700; font-weight: 700;
color: #333;
margin-top: 10rpx;
margin-bottom: 30rpx;
color: #000000;
margin-top: 30rpx;
margin-bottom: 40rpx;
} }
.login-btn { .login-btn {
width: 100%; width: 100%;
height: 80rpx; height: 80rpx;
background-color:rgb(35, 84, 230);
background-color: rgb(0, 0, 0);
color: white; color: white;
font-size: 32rpx; font-size: 32rpx;
line-height: 80rpx; line-height: 80rpx;
@ -131,4 +137,16 @@ defineExpose({
line-height: 80rpx; line-height: 80rpx;
border-radius: 40rpx; border-radius: 40rpx;
} }
.prompt-title-small {
display: block;
text-align: center;
font-size: 24rpx;
color: #6a6a6a;
margin-top: 30rpx;
margin-bottom: 40rpx;
line-height: 15.5px;
letter-spacing: 0.3px;
font-style: normal;
font-family: "PingFang SC";
}
</style> </style>
Loading…
Cancel
Save